
/* Clean mobile-only rebuild for iPhone/Android portrait + landscape */
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
figure { margin: 0; }

@media (max-width: 980px) {
  html, body, main { overflow-x: hidden !important; }
  *, *::before, *::after { min-width: 0; }

  .nav-toggle { display: none !important; }
  .site-nav { display: flex !important; align-items: center !important; }
  .site-nav ul,
  .site-nav ul.is-open {
    position: static !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: .45rem .8rem !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    border: 0 !important;
    box-shadow: none !important;
  }
  .site-nav li a,
  .site-nav a {
    display: inline-flex !important;
    width: auto !important;
    justify-content: center !important;
    min-height: 0 !important;
    padding: .2rem 0 !important;
    font-size: .74rem !important;
    letter-spacing: .08em !important;
    line-height: 1.12 !important;
  }
  .nav-cta { padding: .38rem .68rem !important; }
  .header-inner { gap: .7rem !important; align-items: flex-start !important; }
  .container { width: min(100% - 1rem, 1180px) !important; }

  p, li { font-size: .98rem !important; line-height: 1.7 !important; }
  .lead, .section-head > p, .feature-body p, .plain-card p, .process-card p,
  .faq-item p, .service-band p, .prose-panel p, .footer-copy, .form-panel p {
    font-size: 1rem !important; line-height: 1.72 !important;
  }
  h1 { font-size: clamp(2rem, 7vw, 2.7rem) !important; line-height: 1.06 !important; }
  h2 { font-size: clamp(1.6rem, 5.5vw, 2rem) !important; line-height: 1.08 !important; }
  h3 { font-size: 1.12rem !important; line-height: 1.16 !important; }

  .section-head,
  .guide-grid,
  .process-grid,
  .footer-grid,
  .contact-layout,
  .two-up,
  .service-band,
  .form-grid {
    grid-template-columns: 1fr !important;
  }

  /* HOME page stays compact */
  .theme-home .service-tile-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .5rem !important;
  }
  .theme-home .service-tile figure {
    aspect-ratio: 1 / 1 !important;
    overflow: hidden !important;
    border-radius: 16px 16px 0 0 !important;
  }
  .theme-home .service-tile img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }
  .theme-home .service-copy { padding: .55rem .42rem .66rem !important; }
  .theme-home .service-copy h2 { font-size: .74rem !important; line-height: 1.12 !important; letter-spacing: .05em !important; }
  .theme-home .service-copy p { font-size: .74rem !important; line-height: 1.32 !important; }

  .theme-home .feature-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .5rem !important;
    align-items: start !important;
  }
  .theme-home .feature-card {
    display: block !important;
    overflow: hidden !important;
  }

  .theme-home .feature-card .feature-media,
  .theme-home .feature-card figure {
    aspect-ratio: 1 / 1 !important;
    overflow: hidden !important;
  }

  .theme-home .feature-card img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: cover !important;
    display: block !important;
  }
  .theme-home .feature-body { padding: .55rem .45rem .7rem !important; }
  .theme-home .feature-body .eyebrow { font-size: .5rem !important; letter-spacing: .06em !important; margin-bottom: .3rem !important; }
  .theme-home .feature-body h3 { font-size: .74rem !important; line-height: 1.12 !important; margin-bottom: .25rem !important; }
  .theme-home .feature-body p { font-size: .68rem !important; line-height: 1.28 !important; margin: 0 !important; }

  /* Interior page hero blocks: safe single-column in portrait, no overlap */
  body:not(.theme-home) .split-hero {
    grid-template-columns: 1fr !important;
    gap: .85rem !important;
    align-items: start !important;
  }
  body:not(.theme-home) .split-hero > .glass-panel.hero-panel,
  body:not(.theme-home) .split-hero > .glass-panel.prose-panel,
  body:not(.theme-home) .split-hero > .hero-side,
  body:not(.theme-home) .split-hero > .page-hero-image,
  body:not(.theme-home) .split-hero > .image-frame {
    width: 100% !important;
    max-width: 100% !important;
  }
  body:not(.theme-home) .image-frame,
  body:not(.theme-home) .page-hero-image,
  body:not(.theme-home) .hero-side {
    overflow: hidden !important;
    padding: 0 !important;
    border-radius: 20px !important;
  }
  body:not(.theme-home) .image-frame img,
  body:not(.theme-home) .page-hero-image img,
  body:not(.theme-home) .hero-side img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
    object-fit: cover !important;
    aspect-ratio: auto !important;
    max-height: 240px !important;
  }
  body:not(.theme-home) .hero-panel,
  body:not(.theme-home) .prose-panel,
  body:not(.theme-home) .feature-body,
  body:not(.theme-home) .plain-card,
  body:not(.theme-home) .process-card,
  body:not(.theme-home) .service-band,
  body:not(.theme-home) .form-panel {
    padding: 1rem !important;
  }

  .note-strip { grid-template-columns: 1fr !important; }
}

/* Landscape phones / larger small devices: use two columns where it fits */
@media (max-width: 980px) and (orientation: landscape) {
  body:not(.theme-home) .split-hero {
    grid-template-columns: minmax(0, 1.1fr) minmax(220px, .9fr) !important;
    align-items: stretch !important;
    gap: .9rem !important;
  }
  body:not(.theme-home) .image-frame img,
  body:not(.theme-home) .page-hero-image img,
  body:not(.theme-home) .hero-side img {
    height: 100% !important;
    min-height: 100% !important;
    max-height: none !important;
  }
}

@media (max-width: 700px) {
  .brand__logo { width: 40px !important; }
  .brand__name { font-size: .86rem !important; letter-spacing: .06em !important; }
  .site-nav li a, .site-nav a { font-size: .72rem !important; }
  .container { width: min(100% - .9rem, 1180px) !important; }
}

/* Portrait mobile: keep these homepage sections in 3 columns */
@media (max-width: 980px) and (orientation: portrait) {
  .theme-home .note-strip,
  .theme-home .process-grid,
  .theme-home .guide-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .5rem !important;
    align-items: start !important;
  }

  .theme-home .note-strip > div,
  .theme-home .process-card,
  .theme-home .plain-card {
    padding: .65rem .5rem !important;
  }

  .theme-home .note-strip strong,
  .theme-home .process-card .number,
  .theme-home .plain-card .eyebrow {
    font-size: .58rem !important;
    letter-spacing: .06em !important;
    line-height: 1.1 !important;
  }

  .theme-home .process-card h3,
  .theme-home .plain-card h3 {
    font-size: .76rem !important;
    line-height: 1.14 !important;
    margin-top: .2rem !important;
  }

  .theme-home .note-strip p,
  .theme-home .note-strip span,
  .theme-home .process-card p,
  .theme-home .plain-card p {
    font-size: .68rem !important;
    line-height: 1.28 !important;
    margin: .2rem 0 0 !important;
  }

  /* Top nav in a compact 3-column layout on portrait mobile */
  .site-nav ul,
  .site-nav ul.is-open {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, auto)) !important;
    justify-content: end !important;
    gap: .25rem .55rem !important;
  }

  .site-nav li a,
  .site-nav a {
    font-size: .68rem !important;
    letter-spacing: .05em !important;
    white-space: nowrap !important;
  }

  .nav-cta {
    padding: .28rem .5rem !important;
  }
}

/* Smaller iPhones: shrink the top links a touch more so they don't crowd the brand */
@media (max-width: 430px) and (orientation: portrait) {
  .site-nav li a,
  .site-nav a {
    font-size: .62rem !important;
    letter-spacing: .04em !important;
  }

  .brand__name {
    font-size: .82rem !important;
  }
}


/* Portrait mobile refinements: two-line brand, one-line nav, and page-specific 3-column layouts */
@media (max-width: 980px) and (orientation: portrait) {
  .header-inner {
    align-items: center !important;
    gap: .5rem !important;
  }

  .brand {
    align-items: center !important;
    gap: .42rem !important;
  }

  .brand__name {
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    white-space: normal !important;
    line-height: .98 !important;
    font-size: .78rem !important;
    letter-spacing: .05em !important;
  }

  .site-nav {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    justify-content: flex-end !important;
  }

  .site-nav ul,
  .site-nav ul.is-open {
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: flex-end !important;
    gap: .18rem .42rem !important;
    max-width: 100% !important;
  }

  .site-nav li,
  .site-nav a,
  .site-nav li a {
    min-width: 0 !important;
  }

  .site-nav a,
  .site-nav li a {
    font-size: .58rem !important;
    letter-spacing: .035em !important;
    line-height: 1.05 !important;
    white-space: nowrap !important;
    padding: .1rem 0 !important;
  }

  .nav-cta {
    padding: .22rem .38rem !important;
  }

  /* Services page: 3 columns */
  .page-services .stack-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .45rem !important;
    align-items: stretch !important;
  }

  .page-services .service-band {
    display: block !important;
    padding: .65rem .52rem !important;
  }

  .page-services .service-band h2 {
    font-size: .8rem !important;
    line-height: 1.12 !important;
  }

  .page-services .service-band p,
  .page-services .service-band li {
    font-size: .68rem !important;
    line-height: 1.3 !important;
  }

  .page-services .gold-list {
    padding-left: .85rem !important;
    margin-top: .5rem !important;
  }

  /* How it works page: 3 columns */
  .page-process .process-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .45rem !important;
    align-items: stretch !important;
  }

  .page-process .process-card {
    padding: .68rem .52rem !important;
  }

  .page-process .process-card .number {
    font-size: .58rem !important;
    letter-spacing: .05em !important;
  }

  .page-process .process-card h2 {
    font-size: .8rem !important;
    line-height: 1.12 !important;
  }

  .page-process .process-card p {
    font-size: .68rem !important;
    line-height: 1.3 !important;
  }

  /* About page: 3 columns */
  .page-about .two-up {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .45rem !important;
    align-items: stretch !important;
  }

  .page-about .two-up > * {
    padding: .68rem .52rem !important;
  }

  .page-about .two-up h2 {
    font-size: .8rem !important;
    line-height: 1.12 !important;
  }

  .page-about .two-up p,
  .page-about .two-up li {
    font-size: .68rem !important;
    line-height: 1.3 !important;
  }
}

@media (max-width: 430px) and (orientation: portrait) {
  .brand__name {
    font-size: .74rem !important;
  }

  .site-nav a,
  .site-nav li a {
    font-size: .54rem !important;
    letter-spacing: .025em !important;
  }
}

/* Mobile portrait nav spacing fix for iPhone/Android */
@media (max-width: 980px) and (orientation: portrait) {
  .header-inner {
    display: grid !important;
    grid-template-columns: auto 1fr !important;
    align-items: start !important;
    column-gap: .65rem !important;
  }

  .brand {
    min-width: 0 !important;
  }

  .brand__name {
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    white-space: normal !important;
    line-height: .98 !important;
  }

  .site-nav {
    min-width: 0 !important;
    width: 100% !important;
    justify-self: end !important;
  }

  .site-nav ul,
  .site-nav ul.is-open {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: .35rem .7rem !important;
    row-gap: .35rem !important;
    column-gap: .7rem !important;
    width: 100% !important;
  }

  .site-nav li {
    display: flex !important;
    align-items: center !important;
  }

  .site-nav a,
  .site-nav li a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: .6rem !important;
    letter-spacing: .03em !important;
    line-height: 1.05 !important;
    white-space: nowrap !important;
    padding: .12rem 0 !important;
  }

  .nav-cta {
    padding: .24rem .46rem !important;
  }
}

@media (max-width: 430px) and (orientation: portrait) {
  .header-inner {
    column-gap: .5rem !important;
  }

  .site-nav ul,
  .site-nav ul.is-open {
    gap: .28rem .55rem !important;
    row-gap: .28rem !important;
    column-gap: .55rem !important;
  }

  .site-nav a,
  .site-nav li a {
    font-size: .56rem !important;
    letter-spacing: .02em !important;
  }
}
