/* Section styles (B3): the look of every section type in src/sections.ts, from theme tokens only. Mobile first: one stacked column; 700px and 1100px add columns. */
.sec{min-width:0}
.sec+.sec{margin-top:var(--space-7)}
.sec img{display:block;max-width:100%;height:auto}
.sec-title{margin:0 0 var(--space-5);font-size:clamp(1.25rem,4vw,1.75rem);line-height:1.15;color:var(--gold-100)}
.sec-sub{margin:0;color:var(--cream);font-size:1.125rem;max-width:52ch}
.sec-empty{margin:0;padding:var(--space-5);border:2px dashed var(--rule-soft);border-radius:var(--radius-md);color:var(--muted);text-align:center}
.sec-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:var(--space-5)}
.sec-media{margin:0}

/* hero: the scrim keeps the words readable over any photo */
.sec-hero{position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:center;padding:var(--space-7) var(--space-4);border:2px solid var(--rule-soft);border-radius:var(--radius-lg);background:linear-gradient(180deg,var(--navy-600),var(--navy-850));text-align:center}
.sec-hero[data-align="left"]{text-align:left}
.sec-hero .sec-title{margin-bottom:var(--space-3);font-size:clamp(1.75rem,8vw,3.5rem);line-height:1.05}
.sec-hero .sec-sub{margin-inline:auto}
.sec-hero[data-align="left"] .sec-sub{margin-inline:0}
.sec-hero .btn{margin-top:var(--space-5)}
.sec-hero .sec-in{position:relative;width:100%;max-width:42rem;margin-inline:auto}
.sec-hero[data-align="left"] .sec-in{margin-inline:0}
.sec-bg{position:absolute;inset:0;z-index:-1}
.sec-bg img{width:100%;height:100%;object-fit:cover}
.sec-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(var(--x-030b16-a72),var(--x-030b16-a86))}

/* richText, textImage, embed */
.sec-richText .sec-body{max-width:65ch}
.sec-textImage{display:grid;gap:var(--space-5);align-items:center}
.sec-textImage .sec-media{order:-1}
.sec-textImage .sec-media img{width:100%;border-radius:var(--radius-md)}
.sec-textImage .sec-title{margin-bottom:var(--space-3)}
.sec-embed .sec-media{max-width:48rem}
.sec-embed iframe{border-radius:var(--radius-md)}

/* gallery, team: square tiles that crop instead of stretching */
.sec-gallery figure{margin:0}
.sec-gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius-md)}
.sec-caption{margin-top:var(--space-2);color:var(--muted);font-size:.9375rem}
.sec-teamGrid .team-card{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-4);border-radius:var(--radius-md);background:var(--navy-800)}
.sec-teamGrid .team-card img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:var(--radius-sm)}
.sec-teamGrid .team-card img+.sec-name{margin-top:var(--space-2)}
.sec-name{font-size:1.125rem}
.sec-teamGrid .sec-name{margin:0;color:var(--cream)}
.sec-role{color:var(--accent-hi);font-weight:600}
.sec-bio{color:var(--paper)}

/* cta */
.sec-cta{padding:var(--space-7) var(--space-4);border:2px solid var(--rule-line);border-radius:var(--radius-lg);background:linear-gradient(180deg,var(--navy-600),var(--navy-800));text-align:center}
.sec-cta .sec-in{max-width:40rem;margin-inline:auto}
.sec-cta .sec-title{margin-bottom:var(--space-3);font-size:clamp(1.5rem,6vw,2.25rem);color:var(--cream)}
.sec-cta .sec-sub{margin-inline:auto}
.sec-cta .btn{margin-top:var(--space-5)}

/* faq: native details, so it works without script */
.sec-list{display:grid;gap:var(--space-2);max-width:48rem}
.sec-faq .sec-item{border:2px solid var(--rule-soft);border-radius:var(--radius-md);background:var(--navy-800)}
.sec-q{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);min-height:2.75rem;padding:var(--space-3) var(--space-4);cursor:pointer;list-style:none;color:var(--cream);font:600 1rem/1.4 var(--font-display);transition:background-color var(--dur-fast) var(--ease-out)}
.sec-q::-webkit-details-marker{display:none}
.sec-q::after{content:"+";flex:none;color:var(--accent);font-size:1.5rem;line-height:1}
.sec-faq details[open] .sec-q::after{content:"\2212"}
.sec-q:hover{background:var(--navy-700)}
.sec-a{margin:0;padding:0 var(--space-4) var(--space-4);color:var(--paper);white-space:pre-line}

/* logos: tiles that contain the logo whole */
.sec-logos .sec-item{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);padding:var(--space-4);border:2px solid var(--rule-soft);border-radius:var(--radius-md);background:var(--navy-800);text-align:center}
.sec-logos .sec-item>a{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);width:100%;min-height:2.75rem;color:var(--cream);text-decoration:none;transition:color var(--dur-fast) var(--ease-out)}
.sec-logos .sec-item>a:hover{color:var(--accent-hi)}
.sec-logos img{width:100%;height:4.5rem;object-fit:contain}
.sec-logos .sec-name{color:var(--cream);font-weight:600}

/* stats: the number reads first, its label under it */
.sec-stats .sec-grid{margin:0}
.sec-stats .sec-item{display:flex;flex-direction:column-reverse;gap:var(--space-1);padding-top:var(--space-3);border-top:2px solid var(--accent)}
.sec-value{margin:0;color:var(--accent-hi);font:700 clamp(2.25rem,9vw,3.5rem)/1 var(--font-digits)}
.sec-label{color:var(--muted);font:600 .8125rem/1.4 var(--font-display);letter-spacing:.14em;text-transform:uppercase}

/* spacer */
.sec-spacer{display:flex;align-items:center;height:var(--space-5)}
.sec-spacer[data-size="m"]{height:var(--space-7)}
.sec-spacer[data-size="l"]{height:var(--space-8)}
.sec-line{width:100%;height:2px;margin:0;border:0;background:var(--rule-gold)}

@media (min-width:700px){
  .sec-hero{min-height:20rem;padding:var(--space-8) var(--space-7)}
  .sec-cta{padding:var(--space-8) var(--space-7)}
  .sec-textImage{grid-template-columns:1fr 1fr;gap:var(--space-7)}
  .sec-textImage[data-side="right"] .sec-media{order:1}
  .sec-gallery .sec-grid,.sec-teamGrid .sec-grid{grid-template-columns:repeat(2,1fr)}
  .sec-logos .sec-grid,.sec-stats .sec-grid{grid-template-columns:repeat(auto-fit,minmax(10rem,1fr))}
}
@media (min-width:1100px){
  .sec-hero{min-height:26rem}
  .sec-gallery .sec-grid,.sec-teamGrid .sec-grid{grid-template-columns:repeat(3,1fr)}
}
@media (prefers-reduced-motion:reduce){
  .sec-q,.sec-logos .sec-item>a{transition:none}
}
