/* Contact page - loads after home.css */
.page-hero { position: relative; overflow: hidden; padding: 88px 0 72px; background: var(--blue-soft); }
.page-hero::after {
  content: ''; position: absolute; right: 8%; top: -30%; width: 260px; height: 160%;
  background: linear-gradient(180deg, rgba(31,95,240,.22), rgba(31,95,240,0));
  transform: skewX(-24deg); pointer-events: none;
}
.page-hero .wrap { position: relative; z-index: 1; }
.page-hero h1 { font-size: clamp(34px, 4.6vw, 56px); font-weight: 800; margin-bottom: 14px; }
.page-hero p { font-size: 18px; max-width: 520px; }

.info-row { padding: 0; margin-top: -40px; position: relative; z-index: 2; }
.info-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.info-card {
  background: var(--white); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 30px; display: flex; gap: 18px; align-items: flex-start;
  box-shadow: 0 24px 44px -28px rgba(27,38,54,.3);
}
.info-card .trust-icon { flex-shrink: 0; }
.info-card h3 { font-size: 18px; margin-bottom: 6px; }
.info-card p { font-size: 15px; }
.info-card a:hover { color: var(--blue); }

.contact-section { padding: 90px 0 110px; }
.contact-panel-inner {
  display: grid; grid-template-columns: 1fr 1.15fr; border-radius: 28px; overflow: hidden;
  border: 1px solid var(--line); box-shadow: 0 40px 70px -40px rgba(27,38,54,.4);
}
.contact-image { position: relative; min-height: 420px; }
.contact-image img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.contact-image::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(27,38,54,0) 45%, rgba(27,38,54,.75)); }
.contact-image p { position: absolute; left: 32px; right: 32px; bottom: 28px; z-index: 1; color: var(--white); font-family: 'Sora', sans-serif; font-size: 20px; font-weight: 600; line-height: 1.3; }
.contact-form-side { padding: 56px; background: var(--white); }
.contact-form-side h2 { font-size: 30px; margin-bottom: 10px; }
.contact-sub { margin-bottom: 30px; }

.field { margin-bottom: 20px; }
.field label { display: block; font-size: 14px; font-weight: 700; color: var(--navy); margin-bottom: 8px; }
.field input, .field textarea {
  width: 100%; font: inherit; font-size: 15px; color: var(--navy);
  padding: 14px 16px; background: #f6f9ff; border: 1.5px solid var(--line); border-radius: 12px;
  transition: border-color .2s, background .2s, box-shadow .2s; resize: vertical;
}
.field input:focus, .field textarea:focus { outline: none; background: var(--white); border-color: var(--blue); box-shadow: 0 0 0 4px rgba(31,95,240,.14); }
.contact-form .btn { width: 100%; margin-top: 8px; padding: 16px 30px; font-size: 16px; }

@media (max-width: 1024px) {
  .info-grid { grid-template-columns: 1fr; }
  .info-row { margin-top: -28px; }
  .contact-panel-inner { grid-template-columns: 1fr; }
  .contact-image { min-height: 260px; }
  .contact-section { padding: 64px 0 84px; }
}
@media (max-width: 640px) {
  .page-hero { padding: 56px 0 64px; }
  .contact-form-side { padding: 32px 22px; }
  .contact-image p { left: 22px; right: 22px; font-size: 17px; }
  .info-card { padding: 24px 22px; }
}