/* Secondary pages — FAQ, privacy, approach, why-wayfinder, 404.
   Built on the V2 system: tokens from style.css, sub-page chrome from
   services.css. Only what those two don't already provide lives here. */

/* Dark hero for a page with no hero image. Mirrors .detail-hero's rhythm. */
.page-hero{background:var(--deep);color:#fff;padding:34px 0 84px}
.page-hero .eyebrow{color:#75e1fc}
.page-hero h1{max-width:15ch;margin-bottom:26px}
.page-hero .lede{font-size:19px;line-height:1.75;color:#c1cedb;max-width:640px;margin:0}
.page-hero .updated{font-size:13px;color:#8ea4bd;margin:28px 0 0}
.page-hero .detail-cta{margin-top:46px}
.page-hero-wide h1{max-width:20ch}

/* Anchor strip that sits directly under a hero. */
.page-jumps{display:flex;flex-wrap:wrap;gap:12px 38px;padding:24px 0;border-bottom:1px solid var(--line);font-size:14px}
.page-jumps strong{font-weight:600;letter-spacing:.14em;font-size:12px;color:var(--body)}
.page-jumps a:hover{color:#007a99}

/* FAQ page: one .faq-section grid per category. */
.faq-group{padding-top:76px;padding-bottom:76px}
.faq-group+.faq-group{border-top:1px solid var(--line)}
.faq-group h2{font-size:clamp(27px,2.5vw,37px);margin-bottom:16px}
.faq-group .faq-note{font-size:15px;line-height:1.7;color:var(--body);margin:0;max-width:32ch}
.faq-section details p a{border-bottom:1px solid #9fd8e8;font-weight:500}
.faq-section details p a:hover{color:#007a99;border-color:#007a99}
.faq-section details p+p{margin-top:14px}

/* Legal prose with a sticky contents rail. */
.legal-grid{display:grid;grid-template-columns:1fr 2.15fr;gap:80px;align-items:start}
.legal-toc{position:sticky;top:36px}
.legal-toc .eyebrow{margin-bottom:18px}
.legal-toc a{display:block;padding:12px 0;border-top:1px solid var(--line);font-size:14px;color:var(--body)}
.legal-toc a:last-of-type{border-bottom:1px solid var(--line)}
.legal-toc a:hover{color:#007a99}
.legal-body>section+section{margin-top:56px;padding-top:52px;border-top:1px solid var(--line)}
.legal-body h2{font-size:25px;letter-spacing:-.02em;margin:0 0 18px}
.legal-body p{font-size:16.5px;line-height:1.8;color:var(--body);max-width:68ch}
.legal-body p+p{margin-top:14px}
.legal-body ul{list-style:none;padding:0;margin:0}
.legal-body li{padding:20px 0;border-top:1px solid var(--line);font-size:16.5px;line-height:1.8;color:var(--body);max-width:68ch}
.legal-body li:first-child{border-top:none;padding-top:0}
.legal-body li strong{display:block;color:var(--navy);font-weight:600;margin-bottom:4px}
.legal-body a{border-bottom:1px solid #9fd8e8;font-weight:500}
.legal-body a:hover{color:#007a99;border-color:#007a99}

/* Approach: the engagement stages, as a ruled sequence. */
.stage-list{list-style:none;padding:0;margin:0}
.stage-list li{display:grid;grid-template-columns:150px 1fr;gap:40px;padding:30px 0;border-top:1px solid var(--line)}
.stage-list li:last-child{border-bottom:1px solid var(--line)}
.stage-list .stage-when{font-size:12px;letter-spacing:.14em;font-weight:600;color:#007a99;padding-top:5px}
.stage-list h3{font-size:23px;margin:0 0 9px}
.stage-list p{margin:0;font-size:16px;line-height:1.75;color:var(--body);max-width:62ch}

/* Why Wayfinder: the proof strip and the reasons grid. */
.proof-strip{background:#c9f3fd}
.proof-strip .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:40px;padding:52px 0}
.proof-strip strong{display:block;font-family:Sora,Arial,sans-serif;font-size:21px;letter-spacing:-.02em;margin-bottom:9px}
.proof-strip span{font-size:14px;line-height:1.6;color:#2c4257}
.reason-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 80px;margin-top:8px}
.reason-grid article{padding:34px 0;border-top:1px solid var(--line)}
.reason-grid h3{font-size:23px;margin:0 0 11px}
.reason-grid p{margin:0;font-size:16px;line-height:1.75;color:var(--body)}

/* 404. */
.notfound{background:var(--deep);color:#fff;min-height:62vh;display:flex;align-items:center;padding:80px 0}
.notfound .eyebrow{color:#75e1fc}
.notfound p{font-size:19px;line-height:1.75;color:#c1cedb;max-width:560px;margin:0}
.notfound-links{display:flex;flex-wrap:wrap;gap:18px 46px;margin-top:48px}
.notfound-links a{display:inline-flex;align-items:center;gap:18px;font-size:17px;padding:10px 0;border-bottom:1px solid #ffffff4d}
.notfound-links a span{color:#75e1fc;transition:transform .2s}
.notfound-links a:hover{color:#75e1fc;border-color:#75e1fc}
.notfound-links a:hover span{transform:translate(4px,-4px)}

@media(max-width:1000px){
  .legal-grid{gap:44px}
  .proof-strip .wrap{grid-template-columns:1fr 1fr;gap:34px}
}
@media(max-width:700px){
  .page-hero{padding-bottom:52px}
  .page-hero h1,.page-hero-wide h1{max-width:none}
  .page-hero .lede,.notfound p{font-size:17px}
  .page-hero .detail-cta{margin-top:32px}
  .page-jumps{gap:10px 26px;font-size:13px}
  .faq-group{padding-top:46px;padding-bottom:46px}
  .legal-grid,.reason-grid{grid-template-columns:1fr;gap:30px}
  .legal-toc{position:static}
  .legal-body>section+section{margin-top:40px;padding-top:36px}
  .reason-grid article{padding:26px 0}
  .proof-strip .wrap{grid-template-columns:1fr;gap:26px;padding:40px 0}
  .stage-list li{grid-template-columns:1fr;gap:12px;padding:24px 0}
  .stage-list .stage-when{padding-top:0}
  .notfound{min-height:0;padding:56px 0 64px}
  .notfound-links{gap:14px;margin-top:34px}
  .notfound-links a{width:100%;justify-content:space-between}
}