/* Clearview Developments
   Built on the Clearview Development design tokens.
   Navy and azure carried from the Advisory heritage; horizon amber is the
   Developments signature accent. */

:root{
  --navy-950:#04091F; --navy-900:#081325; --navy-800:#0E1E33; --navy-700:#16293F;
  --blue-700:#02607F; --blue-600:#03729A; --blue-500:#0381AD; --blue-100:#D3EBF4; --blue-50:#EEF8FB;
  --amber-600:#C97E2B; --amber-500:#E49A41; --amber-100:#FDF1E0;
  --grey-900:#161C25; --grey-800:#232B36; --grey-700:#3A4451; --grey-600:#545E6C;
  --grey-500:#717B89; --grey-300:#BAC2CC; --grey-200:#D8DDE4; --grey-150:#E5E9EE;
  --grey-100:#EEF1F5; --grey-50:#F6F8FA; --white:#fff;

  --ink:var(--navy-950); --body:var(--grey-800); --muted:var(--grey-600);
  --rule:var(--grey-200); --rule-strong:var(--grey-300);

  --display:'Space Grotesk',Segoe UI,system-ui,sans-serif;
  --sans:'IBM Plex Sans',system-ui,-apple-system,Segoe UI,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;

  --wide:1240px; --measure:68ch; --gut:24px;
  --h:88px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; font-family:var(--sans); color:var(--body);
  font-size:17px; line-height:1.62; background:var(--white);
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; height:auto; display:block}
a{color:var(--blue-600); text-decoration:none}
a:hover{text-decoration:underline}
:focus-visible{outline:3px solid rgba(3,129,173,.45); outline-offset:2px; border-radius:2px}

h1,h2,h3,h4{font-family:var(--display); color:var(--ink); font-weight:700; letter-spacing:-.018em; margin:0}
h1{font-size:clamp(2.2rem,4.4vw,3.5rem); line-height:1.06}
h2{font-size:clamp(1.6rem,2.7vw,2.3rem); line-height:1.14}
h2 + p, h2 + .lead, h3 + p, h1 + p{margin-top:.85rem}
.sec h2 + p, .sec h2 + .lead{margin-top:1rem}
h3{font-size:1.2rem; line-height:1.3; letter-spacing:-.01em}
p{margin:0 0 1.1em}
.lead{font-size:1.19rem; line-height:1.55; color:var(--grey-700)}
.measure{max-width:var(--measure)}

.eyebrow{
  font-family:var(--mono); font-size:.705rem; letter-spacing:.155em;
  text-transform:uppercase; color:var(--blue-600); margin:0 0 .85rem
}
.eyebrow--rev{color:var(--amber-500)}

.wrap{max-width:var(--wide); margin:0 auto; padding:0 var(--gut)}
.sec{padding:72px 0}
.sec--tight{padding:48px 0}
.sec--wide{padding:104px 0}
.sec--grey{background:var(--grey-50); border-block:1px solid var(--rule)}
.sec--navy{background:var(--navy-900); color:rgba(255,255,255,.80)}
.sec--navy h2,.sec--navy h3{color:#fff}
.rule{border:0; border-top:1px solid var(--rule); margin:0}

/* header */
.hdr{position:sticky; top:0; z-index:60; background:rgba(255,255,255,.93);
  backdrop-filter:saturate(180%) blur(10px); border-bottom:1px solid var(--rule)}
.hdr__in{display:flex; align-items:center; gap:28px; height:var(--h); max-width:var(--wide); margin:0 auto; padding:0 var(--gut)}
.hdr__logo img{height:42px; width:auto; display:block}
.nav{display:flex; gap:26px; margin-left:auto; align-items:center}
.nav a{font-size:.925rem; color:var(--grey-700); text-decoration:none; white-space:nowrap}
.nav a:hover,.nav a[aria-current="page"]{color:var(--ink)}
.nav a[aria-current="page"]{box-shadow:inset 0 -2px 0 var(--amber-500)}
.btn{display:inline-block; font-family:var(--sans); font-size:.925rem; font-weight:600;
  padding:.62em 1.25em; border:1px solid transparent; cursor:pointer; text-decoration:none!important}
.btn--p{background:var(--navy-900); color:#fff}
.btn--p:hover{background:var(--navy-700)}
.btn--a{background:var(--amber-500); color:var(--navy-950)}
.btn--a:hover{background:var(--amber-600); color:#fff}
.btn--g{background:transparent; color:#fff; border-color:rgba(255,255,255,.45)}
.btn--g:hover{border-color:#fff; background:rgba(255,255,255,.08)}
.btn--o{background:transparent; color:var(--ink); border-color:var(--rule-strong)}
.btn--o:hover{border-color:var(--ink)}
.navtoggle{display:none; margin-left:auto; background:none; border:1px solid var(--rule-strong); padding:.45em .7em; font-family:var(--sans); font-size:.9rem}

/* hero */
.hero{position:relative; min-height:clamp(480px,80vh,700px); display:flex; align-items:flex-end;
  background:var(--navy-950); overflow:hidden}
.hero--short{min-height:clamp(420px,62vh,520px)}
.hero__img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.hero__scrim{position:absolute; inset:0;
  background:linear-gradient(100deg,rgba(4,9,31,.92) 0%,rgba(4,9,31,.82) 34%,rgba(4,9,31,.36) 62%,rgba(4,9,31,.14) 100%)}
.hero__in{position:relative; padding:72px 0 58px; width:100%}
.hero h1{color:#fff; max-width:25ch}
.hero .lead{color:rgba(255,255,255,.88); max-width:56ch; margin-top:1.05rem}
.hero__cta{display:flex; gap:12px; flex-wrap:wrap; margin-top:1.7rem}

/* generic layout helpers */
.two{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:56px; align-items:start}
.two--w{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
.rows > *{padding:26px 0; border-top:1px solid var(--rule)}
.rows > *:last-child{border-bottom:1px solid var(--rule)}
.list{margin:0; padding:0; list-style:none}
.list li{position:relative; padding:0 0 .55em 1.1em}
.list li::before{content:""; position:absolute; left:0; top:.72em; width:5px; height:1px; background:var(--amber-500)}
.num{counter-reset:s; margin:0; padding:0; list-style:none}
.num li{counter-increment:s; position:relative; padding:0 0 1.15em 2.4em}
.num li::before{content:counter(s); position:absolute; left:0; top:.06em; font-family:var(--mono);
  font-size:.82rem; color:var(--blue-600); border-bottom:1px solid var(--amber-500); padding-bottom:1px}

table{border-collapse:collapse; width:100%; font-size:.965rem}
th,td{text-align:left; padding:.72em .9em .72em 0; border-bottom:1px solid var(--rule); vertical-align:top}
th{font-family:var(--sans); font-weight:600; color:var(--ink); font-size:.86rem; letter-spacing:.01em}
td:first-child{padding-right:1.6em}

/* project cards */
.cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(288px,1fr)); gap:34px}
.cards--2{grid-template-columns:repeat(auto-fit,minmax(min(400px,100%),1fr)); gap:40px 56px; max-width:1000px}
.card__img{aspect-ratio:3/2; object-fit:cover; width:100%}
.card h3{margin:.95rem 0 .55rem}
.meta{margin:0 0 .8rem; font-size:.855rem; font-family:var(--mono); color:var(--muted)}
.meta div{padding:.24em 0; border-bottom:1px solid var(--grey-150); display:flex; gap:.9em}
.meta dt{min-width:5.6em; color:var(--grey-500)}
.meta dd{margin:0; color:var(--grey-800)}
.tag{display:inline-block; font-family:var(--mono); font-size:.69rem; letter-spacing:.11em;
  text-transform:uppercase; padding:.34em .65em; background:var(--blue-50); color:var(--blue-700)}
.tag--amber{background:var(--amber-100); color:var(--amber-600)}

/* people */
.people{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:30px}
.person img{width:100%; aspect-ratio:1/1; object-fit:cover; background:var(--navy-800)}
.roster{display:grid; gap:0; max-width:980px}
.tbl{border-collapse:collapse; width:100%; min-width:840px; font-size:.92rem}
.tbl th,.tbl td{text-align:left; vertical-align:top; padding:14px 22px 14px 0; border-bottom:1px solid var(--rule)}
.tbl thead th{font-family:var(--mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--azure-600,#0381AD); font-weight:500; border-bottom:1.5px solid var(--ink); padding-bottom:10px}
.tbl tbody th{font-weight:600; color:var(--ink); width:22%}
.tbl td{color:var(--grey-700,#3C4654)}
@media (max-width:940px){
  .tbl{min-width:0; display:block}
  .tbl thead{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0)}
  .tbl tbody,.tbl tr,.tbl th,.tbl td{display:block; width:auto}
  .tbl tr{border-top:1px solid var(--rule); padding:1.15rem 0 .4rem}
  .tbl tbody th{width:auto; padding:0 0 .7rem; border:0; font-size:1.08rem; font-family:var(--display)}
  .tbl td{padding:0 0 .7rem; border:0}
  .tbl td::before{content:attr(data-l); display:block; font-family:var(--mono);
    font-size:.66rem; letter-spacing:.1em; text-transform:uppercase;
    color:var(--blue-500); margin-bottom:.1rem}
}
/* Figures. Each one needs 880px to be legible, which on a phone is a 2.6x
   sideways swipe, so below 940px no figure is shown at all. Five of the seven
   are illustration and the prose beside them already carries what they show.
   The other two are replaced by .mstack, built from the same source data. */
.figwrap{overflow-x:auto; margin:0 0 .4rem; -webkit-overflow-scrolling:touch}
.fig{display:block; width:100%; height:auto; min-width:880px}
.mstack{display:none}
@media (max-width:940px){
  .figwrap--desk{display:none}
  .mstack{display:block; list-style:none; margin:1.9rem 0 0; padding:0}
}
.mstack__i{border-top:1px solid var(--rule); padding-top:1.15rem; margin:0 0 1.5rem}
.mstack__i:last-child{margin-bottom:0}
.mstack__n{font-family:var(--mono); font-size:.72rem; letter-spacing:.14em;
  color:var(--blue-500); margin:0 0 .4rem}
.mstack__t{font-family:var(--display); font-weight:700; color:var(--ink);
  font-size:1.2rem; line-height:1.2; letter-spacing:-.018em; margin:0 0 .5rem}
.mstack__w{color:var(--grey-600); font-size:.95rem; margin:0 0 .95rem}
.mstack__o{background:var(--grey-100); padding:.95rem 1.05rem}
.sec--grey .mstack__o{background:var(--white)}
.mstack__lbl{font-family:var(--mono); font-size:.66rem; letter-spacing:.1em;
  text-transform:uppercase; color:var(--blue-500); margin:0 0 .35rem}
.mstack__o p:last-child{margin:0; color:var(--ink); font-size:.97rem}
/* paired text and image, both inside the content grid.
   The image is a grid item stretched to the row height, so it reads as part of the
   page rather than a picture dropped beside a column. */
.pair{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:56px;
  align-items:start; margin-top:2.2rem}
.pair--flip .pair__t{order:2}
.pair--flip .pair__m{order:1}
.pair__t{display:flex; flex-direction:column; justify-content:flex-start}
.pair__m{position:relative; width:100%; aspect-ratio:3/2; background:var(--navy-800)}
.pair__m img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  object-position:50% 56%}
.pair__cap{position:absolute; left:0; right:0; bottom:0; margin:0; padding:14px 18px;
  font-family:var(--mono); font-size:.7rem; letter-spacing:.07em; text-transform:uppercase;
  color:rgba(255,255,255,.88); background:linear-gradient(to top,rgba(4,9,31,.62),rgba(4,9,31,0))}
@media (max-width:900px){
  .pair{grid-template-columns:1fr; gap:28px}
  .pair--flip .pair__t, .pair--flip .pair__m{order:0}
  .pair__m{aspect-ratio:16/9}
}

/* numbered routes */
.routes{margin:2rem 0 0; padding:0; list-style:none; counter-reset:r}
.routes li{counter-increment:r; position:relative; padding:0 0 1.15rem 3.1rem;
  margin:0 0 1.15rem; border-bottom:1px solid var(--rule)}
.routes li:last-child{border-bottom:0; margin-bottom:0; padding-bottom:0}
.routes li::before{content:"0" counter(r); position:absolute; left:0; top:.2em;
  font-family:var(--mono); font-size:.78rem; letter-spacing:.06em; color:var(--blue-500)}
.routes b{display:block; font-weight:600; color:var(--ink); font-size:1.02rem; line-height:1.3}
.routes span{display:block; font-size:.92rem; color:var(--muted); margin-top:.22rem; line-height:1.52}

/* development chain, set on navy */
.chain{display:grid; grid-template-columns:repeat(auto-fit,minmax(min(158px,100%),1fr));
  gap:0 30px; margin-top:2.6rem}
.chain > div{padding:20px 0 2px; border-top:1px solid rgba(255,255,255,.24)}
.chain span{display:block; font-family:var(--mono); font-size:.72rem; letter-spacing:.08em;
  color:#7FC4DC; margin-bottom:.55rem}
.chain b{display:block; font-family:var(--display); font-weight:700; color:#fff;
  font-size:1rem; line-height:1.24; letter-spacing:-.01em}
@media (max-width:760px){ .chain{gap:0 24px} .chain > div{padding:16px 0 2px} }

/* list set on navy */
.list--rev li{color:rgba(255,255,255,.80)}
.list--rev li::before{background:var(--amber-500)}

/* numbered milestone rows: sequence carried by the numbers, no chart needed */
.mile{counter-reset:m; margin-top:2.4rem}
.mile__r{counter-increment:m; position:relative; display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(0,1.28fr); gap:48px;
  padding:24px 0 26px 3.4rem; border-top:1px solid var(--rule)}
.mile__r:last-child{border-bottom:1px solid var(--rule)}
.mile__r::before{content:"0" counter(m); position:absolute; left:0; top:calc(24px + .3em);
  font-family:var(--mono); font-size:.78rem; letter-spacing:.06em; color:var(--blue-500)}
.mile__r h3{font-size:1.08rem; margin:0; line-height:1.3}
.mile__r p{margin:0; font-size:.94rem; color:var(--muted); line-height:1.55}
@media (max-width:760px){
  .mile__r{grid-template-columns:1fr; gap:.45rem; padding:20px 0 22px 3.1rem}
}

/* screening tests: numbered grid */
.tests{display:grid; grid-template-columns:repeat(auto-fit,minmax(min(272px,100%),1fr));
  gap:0 52px; margin-top:2.4rem; counter-reset:t}
.tests > div{counter-increment:t; position:relative; padding:24px 0 26px 3.1rem;
  border-top:1px solid var(--rule)}
.tests > div::before{content:"0" counter(t); position:absolute; left:0; top:calc(24px + .22em);
  font-family:var(--mono); font-size:.78rem; letter-spacing:.06em; color:var(--blue-500)}
.tests h3{font-size:1.04rem; line-height:1.28; margin:0 0 .4rem}
.tests p{font-size:.92rem; color:var(--muted); margin:0; line-height:1.52}

.band{display:block; width:100%; line-height:0}
.band img{width:100%; height:clamp(220px,26vw,340px); object-fit:cover; object-position:50% 58%}
.caps{display:grid; grid-template-columns:repeat(auto-fit,minmax(min(290px,100%),1fr)); gap:0 46px; margin-top:2.2rem}
.cap{padding:22px 0 24px; border-top:1px solid var(--rule)}
.cap h3{font-size:1.02rem; line-height:1.25; margin:0 0 .5rem}
.cap p{font-size:.93rem; color:var(--muted); margin:0}
/* selected projects, grouped by sector. dl/dt/dd so it still reads if CSS fails to load */
.sect{column-count:3; column-gap:56px; margin-top:2.4rem}
.sect__g{break-inside:avoid; -webkit-column-break-inside:avoid; page-break-inside:avoid;
  padding:30px 0 22px; border-top:2px solid var(--ink)}
.sect__g h3{font-size:.78rem; font-family:var(--mono); letter-spacing:.11em; text-transform:uppercase;
  color:var(--azure); margin:0 0 1.35rem; font-weight:500}
.sect__g dl{margin:0; padding:0}
.sect__g dt{font-weight:600; color:var(--ink); font-size:1rem; line-height:1.32; margin:0}
.sect__g dd{margin:.3rem 0 0; margin-inline-start:0; font-size:.885rem; color:var(--muted);
  line-height:1.55; padding-bottom:1.1rem; border-bottom:1px solid var(--rule)}
.sect__g dd + dt{margin-top:1.1rem}
.sect__g dd:last-of-type{border-bottom:0; padding-bottom:0}
@media (max-width:1080px){ .sect{column-count:2; column-gap:44px} }
@media (max-width:680px){
  .sect{column-count:1; margin-top:2rem}
  .sect__g{padding:24px 0 18px}
}

/* specialist bench: fixed-size portraits so the row holds its shape at any count */
.bench{display:grid; grid-template-columns:repeat(auto-fit,minmax(min(236px,100%),1fr));
  gap:42px 44px; margin-top:2.2rem}
.bench__p img{width:164px; height:164px; object-fit:cover; background:var(--navy-800);
  display:block; margin:0 0 1rem}
.bench__p h3{margin:0 0 .18rem; font-size:1.06rem; line-height:1.25}
.bench__p .disc{font-family:var(--mono); font-size:.72rem; letter-spacing:.08em;
  text-transform:uppercase; color:var(--azure); margin:0 0 .7rem}
.bench__p p{font-size:.92rem; margin:0; color:var(--muted); max-width:36ch}
@media (max-width:760px){
  .bench{gap:32px 34px; grid-template-columns:repeat(auto-fit,minmax(min(214px,100%),1fr))}
  .bench__p img{width:140px; height:140px; margin-bottom:.8rem}
}
@media (max-width:520px){
  .bench{grid-template-columns:1fr; gap:28px}
  .bench__p img{width:128px; height:128px}
  .bench__p p{font-size:.9rem; max-width:none}
}
.faq{display:grid; grid-template-columns:repeat(auto-fit,minmax(min(390px,100%),1fr)); gap:36px 64px; margin-top:2rem; max-width:1000px}
.faq h3{font-size:1.06rem; margin:0 0 .5rem}
.faq p{margin:0}
.rost{display:grid; grid-template-columns:186px minmax(0,1fr); gap:40px; padding:26px 0;
  border-top:1px solid var(--rule)}
.rost:last-child{border-bottom:1px solid var(--rule)}
.rost__p img{width:100%; aspect-ratio:1/1; object-fit:cover; background:var(--navy-800); display:block}
.rost__b h3{margin:0 0 .15rem; font-size:1.22rem}
.rost__b .role{font-size:.9rem; color:var(--muted); margin:0 0 1rem}
.rost__b p{max-width:62ch}
.rost__b p + p{margin-top:.8rem}
.person h3{margin:.9rem 0 .18rem}
.person .role{font-size:.885rem; color:var(--muted); margin:0 0 .7rem}
.person p{font-size:.94rem; margin-bottom:.7em}
.creds{margin:0; padding:0; list-style:none; font-size:.875rem; color:var(--grey-700)}
.creds li{padding:.34em 0; border-top:1px solid var(--grey-150)}
.creds .at{color:var(--muted)}

/* doors */
.doors{display:grid; grid-template-columns:repeat(auto-fit,minmax(255px,1fr)); gap:0}
.door{padding:30px 28px 30px 0; border-top:2px solid var(--ink)}
.door + .door{padding-left:28px; border-left:1px solid var(--rule)}
.door h3{margin-bottom:.55rem; font-size:1.32rem}
.door .eyebrow{margin-bottom:.6rem}
.door p{font-size:.955rem}
.door__go{margin-top:1rem; font-size:.9rem}
.door__go a{font-weight:600}

/* stages */
.stages{display:grid; grid-template-columns:repeat(4,1fr); gap:0; margin-top:8px}
.stage{padding:22px 22px 22px 0; border-top:2px solid var(--amber-500); position:relative}
.stage + .stage{padding-left:22px; border-left:1px solid var(--rule)}
.stage .n{font-family:var(--mono); font-size:.72rem; color:var(--blue-600); letter-spacing:.12em}
.stage h3{margin:.4rem 0 .5rem; font-size:1.06rem}
.stage p{font-size:.925rem; color:var(--grey-700); margin:0}

/* map */
.map{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.78fr); gap:52px; align-items:center}
.map svg{width:100%; height:auto}
.mapnote{font-family:var(--mono); font-size:.7rem; letter-spacing:.05em;
  color:var(--grey-500); margin:.9rem 0 0}

/* forms */
form{max-width:640px}
.f{margin:0 0 1.05rem}
.f label{display:block; font-size:.875rem; font-weight:600; color:var(--ink); margin-bottom:.34rem}
.f input,.f select,.f textarea{
  width:100%; font:inherit; font-size:.97rem; padding:.66em .78em;
  border:1px solid var(--rule-strong); background:#fff; color:var(--body); border-radius:0}
.f input:focus,.f select:focus,.f textarea:focus{border-color:var(--blue-500); outline:none;
  box-shadow:0 0 0 3px rgba(3,129,173,.16)}
.f textarea{min-height:120px; resize:vertical}
.f .hint{font-size:.83rem; color:var(--muted); margin:.3rem 0 0}
.fgrid{display:grid; grid-template-columns:1fr 1fr; gap:0 18px}

/* footer */
.ftr{background:var(--navy-950); color:rgba(255,255,255,.62); padding:56px 0 34px; font-size:.915rem}
.ftr a{color:rgba(255,255,255,.82)}
.ftr a:hover{color:#fff}
.ftr__top{display:grid; grid-template-columns:1.25fr 1fr 1fr; gap:40px; padding-bottom:34px;
  border-bottom:1px solid rgba(255,255,255,.14)}
.ftr img{height:36px; width:auto; margin-bottom:16px}
.ftr h2{font-family:var(--sans); font-size:.79rem; letter-spacing:.09em; text-transform:uppercase;
  color:rgba(255,255,255,.52); font-weight:600; margin:0 0 .85rem}
.ftr ul{list-style:none; margin:0; padding:0}
.ftr li{padding:.2em 0}
.ftr__note{padding-top:22px; font-size:.8rem; line-height:1.55; color:rgba(255,255,255,.42); max-width:62ch}
.ftr__btm{padding-top:14px; display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap;
  font-size:.83rem; color:rgba(255,255,255,.45)}

@media (max-width:980px){
  .two,.two--w,.map{grid-template-columns:1fr; gap:34px}
  .stages{grid-template-columns:1fr 1fr}
  .ftr__top{grid-template-columns:1fr 1fr}
}
@media (max-width:760px){
  body{font-size:16.5px}
  .nav{display:none}
  .nav.open{display:flex; position:absolute; top:var(--h); left:0; right:0; flex-direction:column;
    align-items:flex-start; gap:0; background:#fff; border-bottom:1px solid var(--rule); padding:8px var(--gut) 18px}
  .nav.open a{padding:.72em 0; width:100%; border-bottom:1px solid var(--grey-150)}
  .nav.open .btn{margin-top:14px; width:100%; text-align:center; border-bottom:0}
  .navtoggle{display:block}
  .sec,.sec--wide{padding:52px 0}
  .stages{grid-template-columns:1fr}
  .stage,.stage + .stage{padding:20px 0; border-left:0; border-top:2px solid var(--amber-500)}
  .door,.door + .door{padding:24px 0; border-left:0}
  .fgrid{grid-template-columns:1fr}
  .rost{grid-template-columns:1fr; gap:22px; padding:28px 0}
  .rost__p{max-width:168px}
  .hero__scrim{background:linear-gradient(180deg,rgba(4,9,31,.46) 0%,rgba(4,9,31,.66) 52%,rgba(4,9,31,.84) 100%)}
  .hero h1{max-width:none}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important; transition:none!important}}
@media print{.hdr,.ftr,.hero__scrim{position:static}}