/* Subpage styles — extends home.css. Same tokens, same rhythm. */

.narrow{width:min(760px,calc(100% - 48px));margin-inline:auto}
@media(max-width:820px){.narrow{width:calc(100% - 32px)}}

/* ---------- page hero ---------- */
.page-hero{position:relative;padding:64px 0 56px;background:
  radial-gradient(120% 140% at 88% 0%,var(--aqua) 0%,transparent 58%),var(--aqua-soft)}
@media(min-width:900px){.page-hero{padding:92px 0 80px}}
.page-hero-grid{display:grid;gap:40px;grid-template-columns:1fr;align-items:center}
@media(min-width:960px){.page-hero-grid{grid-template-columns:1.05fr .95fr;gap:64px}}
.page-hero-copy h1{margin:0 0 20px;font-family:Manrope,sans-serif;font-weight:800;
  font-size:clamp(2.3rem,5vw,3.7rem);line-height:1.03;letter-spacing:-.035em;color:var(--brand-ink);text-wrap:balance}
.page-hero-copy h1 em{font-style:normal;color:var(--brand)}
.page-hero-copy .hero-lead{margin:0 0 30px;max-width:52ch;color:var(--text);font-size:1.09rem;line-height:1.62}
.page-hero-media{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.page-hero-media img{display:block;width:100%;height:100%;object-fit:cover;aspect-ratio:16/10}

/* ---------- prose ---------- */
.prose-section{padding:64px 0}
@media(min-width:900px){.prose-section{padding:84px 0}}
.prose-section.alt-section{background:var(--aqua-soft)}
.prose-section h2{margin:0 0 16px;font-family:Manrope,sans-serif;font-weight:800;
  font-size:clamp(1.5rem,3vw,2.05rem);line-height:1.14;letter-spacing:-.028em;color:var(--brand-ink);text-wrap:balance}
.prose-section p{margin:0 0 18px;color:var(--text);font-size:1.05rem;line-height:1.68}
.prose-section p:last-child{margin-bottom:0}

.prose-list{display:grid;gap:10px;margin:24px 0 0;padding:0;list-style:none}
.prose-list li{position:relative;padding:13px 18px 13px 44px;border:1px solid var(--line);
  border-radius:var(--radius-sm);background:var(--white);color:var(--ink);font-size:1rem;line-height:1.5}
.prose-list li::before{content:"";position:absolute;left:18px;top:1.28em;width:8px;height:8px;
  border-radius:50%;background:var(--cyan)}
.alt-section .prose-list li{background:var(--white)}

.chip-list{display:flex;flex-wrap:wrap;gap:9px;margin:24px 0 26px;padding:0;list-style:none}
.chip-list li{padding:9px 16px;border:1px solid var(--line);border-radius:999px;
  background:var(--white);color:var(--text);font-size:.95rem;font-weight:600}
.area-note-text{padding:20px 22px;border-left:3px solid var(--cyan);
  background:var(--aqua-soft);border-radius:0 var(--radius-sm) var(--radius-sm) 0;font-size:1rem}

/* ---------- cta band ---------- */
.page-cta{padding:76px 0;background:var(--brand-ink);color:var(--white);text-align:center}
.page-cta h2{margin:0 0 12px;font-family:Manrope,sans-serif;font-weight:800;
  font-size:clamp(1.7rem,3.4vw,2.4rem);line-height:1.1;letter-spacing:-.03em;color:var(--white);text-wrap:balance}
.page-cta p{margin:0 auto 28px;max-width:54ch;color:#b7d4d8;font-size:1.05rem;line-height:1.6}
.page-cta .contact-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.page-cta .button-outline{border-color:rgba(255,255,255,.55);color:var(--white)}
.page-cta .button-outline:hover{border-color:var(--white);background:rgba(255,255,255,.1)}

/* subpage FAQ sits on paper, not the tinted band */
.page-hero + .section.faq-section,
.prose-section + .faq-section{background:var(--white)}

/* --- links added to the homepage --- */
.card-title-link{color:inherit;text-decoration:none}
.card-title-link:hover{color:var(--brand)}
.text-action.secondary{margin-left:16px;opacity:.72;font-weight:600}
.text-action.secondary:hover{opacity:1}
.feature-actions{display:flex;flex-wrap:wrap;align-items:center;gap:18px}
.area-links{display:flex;flex-wrap:wrap;gap:10px;margin:34px 0 0}
.area-links a{padding:9px 17px;border:1px solid rgba(255,255,255,.22);border-radius:999px;
  background:rgba(255,255,255,.06);color:#cfe6ea;font-size:.94rem;font-weight:600;text-decoration:none}
.area-links a:hover{border-color:var(--cyan);color:#fff;background:rgba(255,255,255,.12)}

/* .button-outline is authored for dark grounds; the subpage hero is light */
.page-hero .button-outline{border-color:var(--brand);color:var(--brand);background:transparent}
.page-hero .button-outline:hover{background:var(--aqua);border-color:var(--brand);color:var(--brand-ink)}

/* location and 404 heroes carry no image — don't leave half the grid empty */
.page-hero-grid.no-media{grid-template-columns:1fr}
.page-hero-grid.no-media .page-hero-copy{max-width:720px}
.page-hero-grid.no-media .hero-lead{max-width:56ch}