/* Rove Legal redesign, version 6 "Collage" with Rove's content and colours.
   Everything is set in rem and the root size follows the viewport (16px at a 1512px screen): text column 92 to 1420, panels 24 to 1488, h1 60/0.9, h2 40/1.1, body 16 to 18.
   Demo fonts and collage imagery need licensing or replacing before launch. */

@font-face{font-family:"Reckless";src:url(../../assets/fonts/reckless-400.woff2) format("woff2");font-weight:300 500;font-style:normal;font-display:swap}
@font-face{font-family:"STK Miso";src:url(../../assets/fonts/stkmiso-400.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"STK Miso";src:url(../../assets/fonts/stkmiso-500.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}

:root{
  --night:#010B1F; --night-2:#071530; --ink:#020F28; --text:#0E1A33;
  --paper:#FDFAF8; --paper-2:#FCF7F4; --paper-3:#F5EEEA; --white:#fff;
  --blue:#083FD5; --sky:#D8E5FF; --sky-2:#A9C2FF; --amber:#FFB850;
  --t80:rgba(2,15,40,.8); --t70:rgba(2,15,40,.7); --t60:rgba(2,15,40,.6); --t33:rgba(2,15,40,.33); --t20:rgba(2,15,40,.2); --t10:rgba(2,15,40,.1); --t05:rgba(2,15,40,.05);
  --w90:rgba(255,255,255,.9); --w80:rgba(255,255,255,.8); --w70:rgba(255,255,255,.7); --w50:rgba(255,255,255,.5); --w20:rgba(255,255,255,.2); --w10:rgba(255,255,255,.1); --w06:rgba(255,255,255,.06); --w03:rgba(255,255,255,.03);
  --serif:"Reckless","Iowan Old Style","Times New Roman",serif;
  --sans:"STK Miso","Helvetica Neue",Helvetica,Arial,sans-serif;
  --ease:cubic-bezier(.42,0,0,1); --ease-in:cubic-bezier(.42,0,0,1); --ease-acc:cubic-bezier(.62,0,.32,1);
  --r:12px; --gut:5.75rem; --gutw:1.5rem; --gap:1.5rem; --sec:11rem; --hdr:3.375rem;
}
*,*::before,*::after{box-sizing:border-box}
html{font-size:clamp(14px,1.0582vw,20px);-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:5rem}
body{margin:0;background:var(--white);color:var(--text);font:400 1rem/1.45 var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;text-align:inherit}
ul,ol{margin:0;padding:0;list-style:none}
h1,h2,h3,h4,p,figure,blockquote{margin:0}
h1,h2,h3{font-family:var(--serif);font-weight:400;color:var(--ink)}
::selection{background:var(--sky);color:var(--ink)}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:4px}
[data-theme="dark"] :focus-visible{outline-color:var(--amber)}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* type */
.t-hero{font-size:3.75rem;line-height:.9;letter-spacing:-.02em}
.t-hero2{font-size:4.5rem;line-height:1;letter-spacing:-.02em;font-weight:350}
.t-mega{font-size:5rem;line-height:1;letter-spacing:-.02em;font-weight:350}
.t-xl{font-size:3.5rem;line-height:1.05;letter-spacing:-.02em}
.t-h2,h2{font-size:2.5rem;line-height:1.1;letter-spacing:-.02em}
.t-h2s{font-size:2rem;line-height:1.1;letter-spacing:-.02em}
.t-h3,h3{font-size:1.625rem;line-height:1.12;letter-spacing:-.005em}
.t-h3s{font-size:1.375rem;line-height:1.18;letter-spacing:-.005em}
.t-quote{font-family:var(--serif);font-size:1.875rem;line-height:1.1;letter-spacing:-.01em;font-weight:350;color:var(--ink)}
.t-lg{font-size:1.125rem;line-height:1.4}
.t-cap{font-family:var(--sans);font-size:1.25rem;line-height:1.4;letter-spacing:-.02em;font-weight:400}
.t-sm{font-size:.875rem;line-height:1.5;letter-spacing:-.01em}
.eyebrow{font:400 .8125rem/1.2 var(--sans);color:var(--t60)}
.eyebrow--h1{font:500 .875rem/1.2 var(--sans);color:var(--t70)}
.c80{color:var(--t80)} .c70{color:var(--t70)} .c60{color:var(--t60)}
[data-theme="dark"]{background:var(--night);color:#fff}
[data-theme="dark"] h1,[data-theme="dark"] h2,[data-theme="dark"] h3{color:var(--paper-2)}
[data-theme="dark"] .eyebrow{color:rgba(255,255,255,.56)}
[data-theme="dark"] .c80{color:var(--w80)} [data-theme="dark"] .c70{color:var(--w70)}

/* layout */
.wrap{padding-inline:var(--gut)}
.wide{padding-inline:var(--gutw)}
.g{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap)}
.g>*{grid-column:var(--c,1/-1);min-width:0}
.sec{padding-block:var(--sec)}
.rule{height:1px;background:var(--t10);border:0;margin:0}
[data-theme="dark"] .rule{background:var(--w10)}
.stackv{display:grid;justify-items:start;align-content:start}

/* buttons: small, 8px corners */
.btn{display:inline-flex;align-items:center;justify-content:center;height:2.5rem;padding:0 .75rem;border-radius:8px;font:400 .9375rem/1.2 var(--sans);border:1px solid transparent;white-space:nowrap;transition:color .2s ease,background-color .2s ease,border-color .2s ease}
.btn--solid{background:var(--ink);color:#fff;border-color:var(--ink)} .btn--solid:hover{background:#12274F;border-color:#12274F}
.btn--ghost{background:var(--white);color:var(--ink);border-color:var(--t20)} .btn--ghost:hover{background:var(--paper-3)}
[data-theme="dark"] .btn--solid,.btn--white{background:#fff;color:var(--ink);border-color:#fff} [data-theme="dark"] .btn--solid:hover,.btn--white:hover{background:var(--sky);border-color:var(--sky)}
[data-theme="dark"] .btn--ghost,.btn--glass{background:var(--w06);color:#fff;border-color:var(--w20)} [data-theme="dark"] .btn--ghost:hover,.btn--glass:hover{background:var(--w20)}
.btns{display:flex;flex-wrap:wrap;gap:.5rem}
.tlink{border-bottom:1px solid currentColor;padding-bottom:1px;transition:color .2s ease}
.tlink:hover{color:var(--blue)} [data-theme="dark"] .tlink:hover{color:var(--sky-2)}
.tag{display:inline-flex;align-items:center;height:1.375rem;padding:0 .4375rem;border-radius:4px;font:500 .75rem/1 var(--sans);background:var(--sky);color:#0A2F9E;white-space:nowrap}
.tag--amber{background:#FFEFD3;color:#7A4A00} .tag--plain{background:var(--paper-3);color:var(--t80)} .tag--ok{background:#DDF3E4;color:#17603A}

/* reveal: rise and fade, overlapping */
.js [data-reveal]{opacity:0;transform:translateY(28px);transition:opacity .8s var(--ease),transform .85s var(--ease);transition-delay:calc(var(--i,0)*80ms)}
.js [data-reveal].in{opacity:1;transform:none}

/* header: sits over the page, softly blurs what passes under it, flips colour with the section beneath */
.hdr{position:fixed;inset:0 0 auto 0;z-index:100;height:var(--hdr);display:flex;align-items:center;color:var(--ink);transition:color .2s ease}
.hdr::before{content:"";position:absolute;inset:0 0 -1.25rem 0;z-index:-1;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);-webkit-mask-image:linear-gradient(#000 55%,transparent);mask-image:linear-gradient(#000 55%,transparent);background:linear-gradient(rgba(255,255,255,.72),rgba(255,255,255,0));transition:background .3s var(--ease)}
.hdr.is-dark{color:#fff}
.hdr.is-dark::before{background:linear-gradient(rgba(1,11,31,.6),rgba(1,11,31,0))}
.hdr__in{display:flex;align-items:center;width:100%}
.hdr__logo img{height:1.5rem;width:auto;transition:filter .3s var(--ease)}
.hdr.is-dark .hdr__logo img{filter:brightness(0) invert(1)}
.hdr__nav{display:flex;gap:2.5rem;margin-left:2.5rem;font-size:1rem;line-height:1.5}
.hdr__nav a{transition:opacity .2s ease;opacity:1}
.hdr__nav:hover a{opacity:.55} .hdr__nav a:hover,.hdr__nav a[aria-current]{opacity:1}
.hdr__nav a[aria-current]{border-bottom:1px solid currentColor}
.hdr__cta{margin-left:auto;display:flex;align-items:center;gap:.75rem}
.hdr__tel{font-size:.9375rem;padding:0 .5rem}
.hdr .btn{height:2rem;padding:0 .625rem}
.hdr .btn--solid{background:var(--ink);color:#fff;border-color:var(--ink)}
.hdr.is-dark .btn--solid{background:#fff;color:var(--ink);border-color:#fff}
.hdr__burger{display:none;width:2.75rem;height:2.75rem;margin-left:auto;position:relative}
.hdr__burger span{position:absolute;left:.6875rem;right:.6875rem;height:1.5px;background:currentColor;transition:transform .3s var(--ease),top .3s var(--ease)}
.hdr__burger span:first-child{top:1.125rem}.hdr__burger span:last-child{top:1.5625rem}
.hdr__burger[aria-expanded="true"] span:first-child{top:1.34rem;transform:rotate(45deg)}
.hdr__burger[aria-expanded="true"] span:last-child{top:1.34rem;transform:rotate(-45deg)}

/* home hero: full-width image card */
.hero{padding:var(--hdr) var(--gutw) 0}
.hero__card{position:relative;height:44.375rem;border-radius:var(--r);overflow:hidden;isolation:isolate;display:grid;align-content:center}
.hero__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% 30%;z-index:-3}
.js .hero__img{animation:heroIn 1.6s var(--ease) both}
@keyframes heroIn{from{transform:scale(1.06);opacity:.3}to{transform:none;opacity:1}}
.hero__card::before{content:"";position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(1,11,31,.82) 0%,rgba(1,11,31,.62) 30%,rgba(1,11,31,.12) 58%,rgba(1,11,31,0) 75%)}
.hero__edge{position:absolute;right:-1px;top:24%;height:56%;width:auto;z-index:-1}
.js .hero__edge{animation:edgeIn 1.4s var(--ease) .4s both}
@keyframes edgeIn{from{transform:translateX(40%)}to{transform:none}}
.hero__ghost{position:absolute;left:53%;top:26%;width:14rem;z-index:-1;display:grid;opacity:.34;font:400 .6875rem/1 var(--sans);color:#fff}
.hero__ghost span{display:grid;grid-template-columns:1fr 1fr;border:1px solid rgba(255,255,255,.5);border-bottom:0;padding:.3rem .4rem}
.hero__ghost span:last-child{border-bottom:1px solid rgba(255,255,255,.5)}
.hero__body{padding-left:calc(var(--gut) - var(--gutw));display:grid;justify-items:start;max-width:46rem}
.hero__note{display:inline-flex;align-items:center;gap:.75rem;font-size:1rem;line-height:1.5;color:#fff;margin-bottom:1.75rem}
.hero__note b{font-weight:400;border:1px solid var(--w50);border-radius:4px;padding:0 .3rem;color:#E8E6E3}
.hero__note svg{width:.75rem;height:.75rem;opacity:.8}
.hero__note span{transition:opacity .2s ease} .hero__note:hover span{opacity:.7}
.hero__body h1{color:var(--paper-2);max-width:9.6em}
.hero__body p{margin-top:1.5rem;color:var(--w90);max-width:32rem}
.hero__body .btns{margin-top:1.75rem}

/* client tiles on the dark page */
.logos{padding:1.25rem 0 9rem}
.logos__in{display:grid;grid-template-columns:15.5rem minmax(0,1fr);align-items:center;gap:var(--gap)}
.mq{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.mq__track{display:flex;width:max-content;gap:var(--mq-gap,.5rem);padding-right:var(--mq-gap,.5rem);align-items:center}
.js .mq__track{animation:mq var(--mq-dur,60s) linear infinite}
.mq:hover .mq__track{animation-play-state:paused}
@keyframes mq{to{transform:translateX(-50%)}}
.ltile{flex:none;width:9.5rem;height:4rem;border-radius:8px;background:var(--paper-2);display:grid;place-items:center}
.ltile img{max-width:6.25rem;max-height:1.9rem;width:auto;height:auto;object-fit:contain;mix-blend-mode:multiply;filter:grayscale(1) contrast(1.05);opacity:.86}
.logos--light{padding:3.5rem 0 0}
.logos--light .mq__track{--mq-gap:6.5rem}
.logos--light img{height:2.25rem;width:auto;max-width:10rem;object-fit:contain;mix-blend-mode:multiply;filter:grayscale(1) contrast(1.05);opacity:.8}

/* dark feature band: text left, floating object right, a thread running down through the objects */
.feat{padding-bottom:var(--sec)}
.feat__head{max-width:31rem;padding-bottom:4rem}
.feat__row{min-height:33rem;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:end;padding:5rem 0 4.5rem;border-bottom:1px solid var(--w10);position:relative}
.feat__row:last-child{border-bottom:0}
.feat__text{grid-column:1/6;display:grid;gap:.875rem;justify-items:start;max-width:29rem}
.feat__text p{color:var(--w80)}
.feat__text .btn{margin-top:.75rem}
.feat__obj{grid-column:7/13;align-self:center;display:grid;justify-items:center;position:relative}
.feat__obj::before{content:"";position:absolute;left:50%;top:-9rem;bottom:-9rem;width:1px;background:linear-gradient(transparent,var(--w20) 20%,var(--w20) 80%,transparent);z-index:0}
.feat__obj>*{position:relative;z-index:1}
.dcard{width:21rem;border-radius:var(--r);border:1px solid var(--w10);background:#0B1933;padding:1rem;display:grid;gap:.75rem}
.dcard--light{background:var(--paper-3);border-color:transparent;color:var(--text)}
.dcard__top{display:flex;align-items:center;justify-content:space-between;gap:.75rem}
.dcard__title{font-family:var(--serif);font-size:1.0625rem;line-height:1.2;letter-spacing:-.005em}
.dcard--light .dcard__title{font-family:var(--sans);font-weight:500;font-size:1.125rem;letter-spacing:-.01em}
.dcard small{font-size:.75rem;line-height:1.3;color:var(--w50)}
.dcard--light small{color:var(--t60)}
.drows{display:grid;border-radius:8px;background:var(--w03);padding:.25rem .75rem}
.dcard--light .drows{background:rgba(255,255,255,.6)}
.drow{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.5rem 0;font-size:.8125rem;line-height:1.3;color:var(--w50)}
.drow b{font-weight:400;color:#fff;text-align:right}
.dcard--light .drow{color:var(--t60)} .dcard--light .drow b{color:var(--text)}
.drow+.drow{border-top:1px solid var(--w06)} .dcard--light .drow+.drow{border-top-color:var(--t05)}
.dmini{display:grid;grid-template-columns:2.5rem 1fr;gap:.875rem;align-items:center;width:21rem;border-radius:var(--r);border:1px solid var(--w10);background:#0B1933;padding:.875rem}
.dmini i{width:2.5rem;height:2.5rem;border-radius:8px;background:var(--w10);display:grid;place-items:center}
.dmini i svg{width:1.125rem;height:1.125rem}
.dmini i img{width:2.5rem;height:2.5rem;border-radius:8px;object-fit:cover}
.dmini strong{display:block;font-weight:400;font-size:1rem;line-height:1.3}
.dmini span{font-size:.8125rem;color:var(--w50)}
.dstack{display:grid;gap:.625rem;justify-items:center}
.dblock{display:grid;gap:.5rem;border-radius:8px;background:rgba(255,255,255,.62);padding:.75rem}
.dblock .tag{justify-self:start}
.dblock p{font-size:.875rem;line-height:1.35;color:var(--t80);display:flex;align-items:center;gap:.5rem}
.dblock p b{font-weight:500;color:var(--text)}
.dblock svg{width:.9rem;height:.9rem;flex:none;color:var(--blue)}
.badgepair{display:flex;gap:.625rem;align-items:center}
.badgepair img{height:4.25rem;width:auto;max-width:none;border-radius:4px}
.js .feat__obj [data-rise]{opacity:0;transform:translateY(2.5rem);transition:opacity .75s var(--ease-in),transform 1s var(--ease);transition-delay:calc(var(--k,0)*120ms + .1s)}
.js .feat__row.in [data-rise]{opacity:1;transform:none}

/* heading left, card rail right, figure beneath */
.rail{padding:var(--sec) 0;overflow:hidden}
.rail__in{display:grid;grid-template-columns:18rem minmax(0,1fr);column-gap:var(--gap);padding-left:var(--gut);min-height:35.75rem}
.rail__side{display:grid;align-content:space-between;justify-items:start;padding-right:1rem}
.rail__side h2{max-width:7em}
.rail__fig b{display:block;font-family:var(--serif);font-weight:400;font-size:3.75rem;line-height:.9;letter-spacing:-.02em;color:var(--ink);font-variant-numeric:tabular-nums}
.rail__fig span{display:block;margin-top:1.25rem;font-size:1.125rem;line-height:1.4;color:var(--t80)}
.bars{display:flex;gap:.3rem;align-items:center;margin-top:1.75rem}
.bars button{height:2px;width:.625rem;border-radius:1px;background:var(--t20);transition:width .4s var(--ease),background-color .4s var(--ease);position:relative}
.bars button::after{content:"";position:absolute;inset:-.75rem -.1rem}
.bars button.is-on{width:1.5rem;background:var(--ink)}
[data-theme="dark"] .bars button{background:var(--w20)} [data-theme="dark"] .bars button.is-on{background:#fff}
.rail__track{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-right:var(--gutw);cursor:grab}
.rail__track::-webkit-scrollbar{display:none}
.rcard{flex:none;width:33.9rem;height:35.75rem;scroll-snap-align:start;border-radius:var(--r);background:var(--paper-2);display:grid;grid-template-rows:minmax(0,1fr) auto;overflow:hidden;color:var(--text)}
.rcard__img{margin:.75rem .75rem 0;border-radius:8px;overflow:hidden}
.rcard__img img{width:100%;height:100%;object-fit:cover}
.rcard .t-cap{transition:color .2s ease}
a.rcard:hover .t-cap{color:var(--blue)}
.rcard__obj{display:grid;place-items:center}
.rcard__obj img{max-width:13rem;max-height:13rem;width:auto;height:auto}
.rcard__cap{padding:1.5rem 1.75rem 1.75rem;display:grid;gap:.5rem}
.rcard__cap p{color:var(--t80);max-width:25rem}

/* quote with a large photo */
.qband{background:var(--paper);padding:5.5rem 0}
.qband__in{align-items:stretch}
.qband__text{display:grid;align-content:space-between;justify-items:start;padding:.25rem 0 1.5rem}
.qband__stack{display:grid}
.q{grid-area:1/1;display:grid;gap:1.5rem;justify-items:start;align-content:end;opacity:0;visibility:hidden;transition:opacity .3s var(--ease),visibility 0s .3s}
.q.is-active{opacity:1;visibility:visible;transition:opacity .75s var(--ease-in) .1s,visibility 0s}
.q cite{font-style:normal;font-size:1rem;color:var(--t60)}
.q cite b{font-family:var(--serif);font-weight:400;font-size:1.25rem;color:var(--ink);margin-right:.75rem;letter-spacing:-.005em}
.qband__photo{border-radius:var(--r);overflow:hidden;height:42.5rem}
.qband__photo img{width:100%;height:100%;object-fit:cover}
.qdark{position:relative;isolation:isolate;border-radius:var(--r);overflow:hidden;min-height:38rem;display:grid;align-content:end;padding:4.25rem calc(var(--gut) - var(--gutw))}
.qdark>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.qdark::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(1,11,31,.92) 0%,rgba(1,11,31,.78) 34%,rgba(1,11,31,.2) 70%)}
.qdark .t-quote{color:#fff;max-width:17.5em}
.qdark cite{font-style:normal;color:var(--w70);display:block;margin-top:1.5rem}
.qdark cite b{font-family:var(--serif);font-weight:400;font-size:1.25rem;color:#fff;margin-right:.75rem}
.qdark .btn{margin-top:2rem}

/* two-tone statement */
.mega{padding:var(--sec) 0 6rem;text-align:center;position:relative}
.mega p{font-family:var(--serif);color:var(--ink)}
.mega .dim{display:block;background:linear-gradient(180deg,rgba(2,15,40,.46),rgba(2,15,40,.14));-webkit-background-clip:text;background-clip:text;color:transparent}
.mega__float{position:absolute;pointer-events:none;will-change:transform}

/* sticky collage story */
.story{position:relative}
.story__sticky{position:sticky;top:0;height:100vh;min-height:36rem;display:grid;align-items:center}
.story__list{display:grid;gap:3.25rem}
.story__list button{font-family:var(--serif);font-size:2.25rem;line-height:1.1;letter-spacing:-.02em;color:var(--t20);max-width:7.4em;transition:color .5s var(--ease)}
.story__list button:hover{color:var(--t33)}
.story__list .is-active button{color:rgba(2,15,40,.9)}
.story__steps{display:grid}
.story__step{grid-area:1/1;display:grid;grid-template-columns:repeat(9,minmax(0,1fr));column-gap:var(--gap);align-items:center;opacity:0;visibility:hidden;transition:opacity .45s var(--ease),visibility 0s .45s}
.story__step.is-active{opacity:1;visibility:visible;transition:opacity .75s var(--ease-in) .1s,visibility 0s}
.story__step h3{display:none}
.story__text{grid-column:7/10;justify-self:end;max-width:18.9rem;color:var(--t70)}
.collage{grid-column:1/7;justify-self:center;position:relative;width:min(100%,33rem);aspect-ratio:1160/1200}
.collage>img{position:absolute;inset:0;width:100%;height:100%;transition:transform 1s var(--ease)}
.story__step .collage>img:nth-child(1){transform:translateY(-1.25rem)}
.story__step .collage>img:nth-child(3){transform:translateY(1.75rem)}
.story__step.is-active .collage>img{transform:none}
.collage__card{position:absolute;left:8%;right:8%;bottom:20%;transform:translateY(2rem);opacity:0;transition:transform 1s var(--ease) .15s,opacity .75s var(--ease-in) .15s}
.story__step.is-active .collage__card{transform:none;opacity:1}

/* flat object cards (light) */
.ocard{background:var(--white);border:1px solid var(--t10);border-radius:var(--r);padding:1rem 1.125rem;display:grid;gap:.75rem;color:var(--text)}
.ocard--paper{background:var(--paper-2)}
.ocard__top{display:flex;justify-content:space-between;align-items:center;gap:.75rem}
.ocard__title{font-family:var(--serif);font-size:1.25rem;line-height:1.15;letter-spacing:-.005em;color:var(--ink)}
.ocard small{font-size:.75rem;line-height:1.35;color:var(--t60)}
.orows{display:grid}
.orow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1rem;align-items:center;padding:.5625rem 0;border-top:1px solid var(--t10);font-size:.8125rem;line-height:1.3}
.orow svg{width:.9375rem;height:.9375rem;color:var(--blue)}
.orow span:first-child{display:flex;align-items:center;gap:.5rem}
.ocard .big{font-family:var(--serif);font-size:2.75rem;line-height:.9;letter-spacing:-.02em;color:var(--ink);font-variant-numeric:tabular-nums}
.ocard .face{width:3rem;height:3rem;border-radius:8px;object-fit:cover}
.js [data-seq]>*{opacity:0;transform:translateY(.5rem);transition:opacity .5s var(--ease),transform .6s var(--ease);transition-delay:calc(var(--k,0)*130ms + .3s)}
.js .in [data-seq]>*,.js .in[data-seq]>*,.js .is-active [data-seq]>*{opacity:1;transform:none}
/* 100-square figure */
.waffle{display:grid;grid-template-columns:repeat(20,1fr);gap:.1875rem}
.waffle i{aspect-ratio:1;border-radius:2px;background:var(--ink);outline:1px solid transparent;outline-offset:-1px;transition:background-color .45s var(--ease),outline-color .45s var(--ease);transition-delay:calc(var(--k,0)*10ms + .4s)}
.in .waffle i.off{background:transparent;outline-color:var(--t33)}
.waffle--blue i{background:var(--t10)}
.in .waffle--blue i{background:var(--blue)}
/* licence cards */
.lic{border-radius:var(--r);border:1px solid var(--t10);background:var(--white);padding:1.25rem;display:grid;gap:2.5rem;align-content:space-between;width:17.5rem;min-height:11.5rem}
.lic--blue{background:var(--blue);border-color:var(--blue);color:#fff}
.lic strong{display:block;font-family:var(--serif);font-weight:400;font-size:1.5rem;line-height:1.1;letter-spacing:-.005em}
.lic--blue strong{color:#fff} .lic strong{color:var(--ink)}
.lic p{font-size:.875rem;line-height:1.4;opacity:.8}
.lic ul{display:flex;flex-wrap:wrap;gap:.375rem}
.lic--blue .tag{background:rgba(255,255,255,.16);color:#fff}

/* dark rounded panel: numbered accordion left, floating cards right */
.proc{border-radius:var(--r);padding:.75rem;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:.75rem;min-height:46.5rem}
.proc__left{padding:3.25rem 3rem 3rem 2.75rem;display:grid;align-content:center;gap:2.5rem}
.proc__left h2{max-width:11.2em}
.acc__item{padding:.5rem 0}
.acc__q{width:100%;display:grid;grid-template-columns:2.375rem 1fr;align-items:baseline;padding:.5rem 0;font-family:var(--serif);font-size:1.5rem;line-height:1.15;letter-spacing:-.005em;color:rgba(170,165,160,.7);transition:color .2s ease}
.acc__q .n{font-size:1rem;line-height:1.05;letter-spacing:-.01em}
.acc__q:hover{color:rgba(255,255,255,.8)}
.is-open>.acc__q{color:var(--paper-2)}
.acc__a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .62s var(--ease-acc)}
.is-open>.acc__a{grid-template-rows:1fr}
.acc__in{overflow:hidden;min-height:0}
.acc__in p{padding:.5rem 0 .75rem 2.375rem;color:var(--w70);font-size:1.125rem;line-height:1.4;max-width:24.1rem}
.proc__vis{border-radius:var(--r);background:var(--w03);position:relative;overflow:hidden;display:grid;place-items:center;isolation:isolate}
.proc__vis .tear{position:absolute;left:0;right:0;bottom:0;width:100%;z-index:-1;opacity:.95}
.pv{grid-area:1/1;display:grid;gap:.75rem;width:21.5rem;opacity:0;visibility:hidden;transform:translateY(2rem);transition:opacity .4s var(--ease),transform .6s var(--ease),visibility 0s .4s}
.pv.is-active{opacity:1;visibility:visible;transform:none;transition:opacity .75s var(--ease-in) .15s,transform .9s var(--ease) .15s,visibility 0s}
.pv .ocard{background:var(--paper-2);border-color:transparent}
.fchips{display:grid;gap:1.25rem;justify-items:center}
.fchip{display:inline-flex;align-items:center;height:2.375rem;padding:0 .875rem;border-radius:8px;background:var(--paper-2);color:var(--text);font-size:1.0625rem;letter-spacing:-.01em;white-space:nowrap}
.fchip:nth-child(2){margin-left:-7rem} .fchip:nth-child(3){margin-left:3rem} .fchip:nth-child(4){margin-left:-3rem}

/* light FAQ accordion */
.faq .acc__item{border-bottom:1px solid var(--t10);padding:0}
.faq .acc__item:first-child{border-top:1px solid var(--t10)}
.faq .acc__q{grid-template-columns:1fr 1rem;gap:1.5rem;align-items:center;padding:1.375rem 0;color:var(--ink);font-size:1.5rem}
.faq .acc__q:hover{color:var(--blue)}
.faq .acc__ic{position:relative;width:1rem;height:1rem}
.faq .acc__ic::before,.faq .acc__ic::after{content:"";position:absolute;left:0;top:calc(50% - .75px);width:1rem;height:1.5px;background:currentColor;transition:transform .62s var(--ease-acc)}
.faq .acc__ic::after{transform:rotate(90deg)}
.faq .is-open>.acc__q .acc__ic::after{transform:rotate(0)}
.faq .acc__in p{padding:0 3rem 1.5rem 0;color:var(--t80);max-width:36rem;font-size:1.125rem}

/* media panels with the caption beneath */
.mp{position:relative;border-radius:var(--r);background:var(--paper);overflow:hidden;isolation:isolate;height:35rem;display:grid;place-items:center}
.mp--short{height:30rem}
.mp--in{display:grid;grid-template-rows:minmax(0,1fr) auto;place-items:stretch;height:auto;min-height:30rem}
.mp__stage{position:relative;display:grid;place-items:center;padding:2.5rem 2rem 1rem}
.mp__cap{padding:1.25rem 1.5rem 1.75rem;display:grid;gap:.5rem;align-content:start}
.mp__cap p{color:var(--t80);max-width:25.6rem}
.mp .tear{position:absolute;z-index:-1}
.mp .tear--tr{top:0;right:0;width:46%}
.mp .tear--tl{top:0;left:0;width:34%;transform:scaleX(-1)}
.mp .float{position:absolute;z-index:1}
.cap{display:grid;gap:.75rem;padding-top:1.5rem;align-content:start}
.cap h3{max-width:20rem}
.cap p{font-size:1.125rem;line-height:1.4;color:var(--t80);max-width:22.4rem}
.two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1rem var(--gap);grid-template-rows:auto auto}
.two>div{display:grid;grid-template-rows:subgrid;grid-row:span 2}
.three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;grid-template-rows:auto auto}
.three>*{display:grid;grid-template-rows:subgrid;grid-row:span 2}

/* rulers: one column per unit; bars and notes share the columns */
.ruler{--n:12;display:grid;width:100%}
.ruler__ticks,.ruler__bar,.ruler__notes{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr))}
.ruler__ticks span{font:400 .75rem/1 var(--sans);color:var(--t60);padding:0 0 .5rem .3rem;border-left:1px solid var(--t20);white-space:nowrap;font-variant-numeric:tabular-nums}
.ruler__bar{height:2.5rem;border-radius:6px;background:var(--t05);overflow:hidden}
.ruler__bar i{display:flex;align-items:center;padding-left:.75rem;font:400 .8125rem/1 var(--sans);font-style:normal;color:#fff;white-space:nowrap;grid-row:1;clip-path:inset(0 100% 0 0);transition:clip-path 1.2s var(--ease)}
.in .ruler__bar i,.ruler.in .ruler__bar i{clip-path:inset(0 0 0 0)}
.ruler__bar .a{background:var(--ink)}
.ruler__bar .b{background:var(--blue);transition-delay:.8s}
.ruler__bar .c{background:repeating-linear-gradient(135deg,#BFD0FF 0 6px,#DDE7FF 6px 12px);color:var(--ink);transition-delay:.9s}
.ruler__bar .m{background:var(--amber);color:var(--ink);padding:0;justify-content:center;transition-delay:1.5s}
.ruler__notes{margin-top:1.25rem}
.ruler__note{display:grid;gap:.375rem;align-content:start;border-top:1px solid var(--ink);padding:.75rem .75rem 0 0}
.ruler__note b{font-family:var(--serif);font-weight:400;font-size:1.75rem;line-height:1;letter-spacing:-.02em;color:var(--ink)}
.ruler__note span{font-size:.875rem;line-height:1.4;color:var(--t80)}

/* statement panel */
.spanel{border-radius:var(--r);background:var(--paper);padding:7.5rem var(--gutw);display:grid;justify-items:center;text-align:center;gap:2.5rem}
.spanel h2{max-width:13em}
.badges{display:flex;gap:.625rem;align-items:center;flex-wrap:wrap;justify-content:center}
.badge{height:5rem;padding:.5rem;border-radius:8px;background:var(--white);border:1px solid var(--t10);display:inline-flex;align-items:center}
.badge img{height:100%;width:auto;max-width:none;border-radius:4px}

/* who-can-apply self check */
.check{width:min(100%,43rem);display:grid;gap:1.5rem;text-align:left}
.check__list{display:grid;border-top:1px solid var(--t10)}
.check__item{display:grid;grid-template-columns:2.75rem 1fr;align-items:center;width:100%;padding:1.125rem 0;border-bottom:1px solid var(--t10);font-family:var(--serif);font-size:1.625rem;line-height:1.12;letter-spacing:-.005em;color:var(--ink)}
.check__box{width:1.625rem;height:1.625rem;border-radius:6px;border:1.5px solid var(--t33);display:grid;place-items:center;transition:background-color .3s var(--ease),border-color .3s var(--ease)}
.check__box svg{width:.9rem;height:.9rem;color:#fff;opacity:0;transform:scale(.6);transition:opacity .2s ease,transform .3s var(--ease)}
.check__item[aria-pressed="true"] .check__box{background:var(--blue);border-color:var(--blue)}
.check__item[aria-pressed="true"] .check__box svg{opacity:1;transform:none}
.check__item:hover .check__box{border-color:var(--blue)}
.check__out{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1.5rem;align-items:center;min-height:3.5rem}
.check__states{display:grid}
.check__state{grid-area:1/1;opacity:0;visibility:hidden;transition:opacity .3s var(--ease),visibility 0s .3s;color:var(--t80);font-size:1.125rem;line-height:1.4}
.check__state.is-active{opacity:1;visibility:visible;transition:opacity .6s var(--ease-in) .15s,visibility 0s}
.check__state b{font-family:var(--serif);font-weight:400;font-size:1.5rem;color:var(--ink);display:block;letter-spacing:-.005em}
.check__go{opacity:0;visibility:hidden;transition:opacity .3s var(--ease),visibility 0s .3s}
.check.is-all .check__go{opacity:1;visibility:visible;transition:opacity .6s var(--ease-in) .2s,visibility 0s}

/* hero collage on inner pages */
.phero{padding:calc(var(--hdr) + 2.5rem) 0 0}
.phero__body{display:grid;justify-items:start}
.phero__body .t-hero2{margin-top:1.5rem;max-width:11.7em;color:var(--ink)}
.phero__body .btns{margin-top:2rem}
.pcollage{position:relative;height:25rem;margin-top:1.5rem}
.pcollage>*{position:absolute}
.pcollage img{width:auto;max-width:none}
.pcollage .ocard{width:15.5rem}
.js .pcollage [data-rise]{opacity:0;transform:translateY(3rem);transition:opacity .75s var(--ease-in),transform 1.1s var(--ease);transition-delay:calc(var(--k,0)*110ms + .2s)}
.js .pcollage.in [data-rise]{opacity:1;transform:none}
.intro{padding:4rem 0 3.75rem;align-items:center}
.figure{display:flex;align-items:center;gap:.75rem;justify-self:end}
.figure b{font-family:var(--serif);font-weight:400;font-size:3.75rem;line-height:.9;letter-spacing:-.02em;color:var(--ink);font-variant-numeric:tabular-nums}
.figure span{font-size:.875rem;line-height:1.5;letter-spacing:-.01em;color:var(--t80);max-width:7.2rem}
.pulls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--gap);padding-top:3.5rem}
.pulls>div{display:grid;gap:.5rem;align-content:start}
.pulls strong{font-family:var(--serif);font-weight:400;font-size:1.625rem;line-height:1.12;letter-spacing:-.005em;color:var(--ink)}
.pulls span{color:var(--t60)}

/* bento */
.bento{display:grid;gap:1rem}
.bento__row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1rem}
.bigp{position:relative;border-radius:var(--r);background:var(--paper);min-height:35.75rem;overflow:hidden;isolation:isolate;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);padding:2.5rem}
.bigp__cap{grid-column:1/5;align-self:end;display:grid;gap:.75rem;justify-items:start}
.bigp__cap p{color:var(--t80)}
.bigp__media{grid-column:6/13;position:relative}
.bigp__media img.photo{position:absolute;right:0;bottom:-2.5rem;height:calc(100% + 1rem);width:auto;max-width:none;border-radius:var(--r) var(--r) 0 0;object-fit:cover}
.statrow{display:grid;width:100%}
.statrow div{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,5fr);align-items:center;gap:1rem;padding:1.5rem 0;border-top:1px solid var(--t10)}
.statrow div:first-child{border-top:0}
.statrow b{font-family:var(--serif);font-weight:400;font-size:2.5rem;line-height:1;letter-spacing:-.02em;color:var(--ink);font-variant-numeric:tabular-nums}
.statrow span{color:var(--t80)}

/* dark tiles panel */
.dpanel{border-radius:var(--r);padding:3.5rem;position:relative;overflow:hidden;isolation:isolate}
.dpanel .tear{position:absolute;left:0;bottom:0;width:27%;z-index:-1;transform:rotate(180deg)}
.slist{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:var(--gap)}
.slist li{padding:.75rem 0;border-top:1px solid var(--w10);font-family:var(--serif);font-size:1.375rem;line-height:1.18;letter-spacing:-.005em;color:var(--paper-2)}

/* values cards */
.vcard{border-radius:var(--r);background:var(--paper);display:grid;grid-template-rows:minmax(0,1fr) auto;min-height:32.5rem}
.vcard__obj{display:grid;place-items:center;padding:2rem}
.vcard__obj img{max-height:11rem;max-width:11rem;width:auto;height:auto}
.vcard__cap{padding:0 1.75rem 2rem;display:grid;gap:.75rem}
.vcard__cap p{color:var(--t80);max-width:21rem}

/* closing band + footer */
.close{padding:var(--sec) 0 5.5rem}
.close h2{max-width:12.2em}
.close .btns{margin-top:2.25rem}
.close .t-sm{margin-top:1.25rem;color:var(--t60)}
.ftr{padding:3.5rem 0 0;position:relative;overflow:hidden}
.ftr__logo img{height:1.75rem;width:auto}
.ftr h2{font-family:var(--serif);font-size:1rem;line-height:1.05;letter-spacing:-.02em;color:var(--ink);margin-bottom:1.5rem}
.ftr__col a,.ftr__col span{display:block;padding:.34rem 0;font-size:1rem;line-height:1.45;color:var(--text);transition:color .2s ease}
.ftr__col a:hover{color:var(--blue)}
.ftr__meta{padding-top:5rem;display:grid;gap:2rem}
.ftr__badges{display:flex;gap:.625rem}
.ftr__badges img{height:4.5rem;width:auto;border-radius:6px}
.ftr__bot{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:center;padding-bottom:7.5rem;color:var(--t80)}
.ftr__bot a{transition:color .2s ease} .ftr__bot a:hover{color:var(--blue)}
.ftr__tear{display:block;width:100%;height:auto;margin-top:-4.5rem;position:relative;z-index:-1}

/* about */
.mission{padding:calc(var(--hdr) + 3rem) 0 7rem;position:relative;overflow:hidden}
.mission__tear{position:absolute;right:0;top:6.5rem;height:16rem;width:auto;transform:scaleX(-1)}
.mission__text{display:grid;gap:1.25rem}
.mission__text p{font-family:var(--serif);font-size:3.5rem;line-height:1.05;letter-spacing:-.02em;color:var(--ink)}
.founder__photo{border-radius:var(--r);overflow:hidden;aspect-ratio:1}
.founder__photo img{width:100%;height:100%;object-fit:cover}
.clist{display:grid;width:100%;border-top:1px solid var(--t10)}
.clist a{display:grid;grid-template-columns:7rem 1fr;gap:1rem;padding:.875rem 0;border-bottom:1px solid var(--t10)}
.clist span:first-child{color:var(--t60)}
.clist span:last-child{transition:color .2s ease} .clist a:hover span:last-child{color:var(--blue)}
.awards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;grid-template-rows:auto auto auto}
.award{border-radius:var(--r);background:var(--paper);padding:1.75rem;display:grid;grid-template-rows:subgrid;grid-row:span 3;row-gap:1rem;align-content:start}
.award__mark{height:6.5rem;display:flex;align-items:center;margin-bottom:2.5rem}
.award__mark img{height:100%;width:auto;border-radius:6px}
.award__mark span{font-family:var(--serif);font-size:1.625rem;line-height:1.12;color:var(--ink);max-width:9em}
.award p{color:var(--t80)}

/* contact */
.contact{padding:calc(var(--hdr) + 4.5rem) 0 5rem;background:var(--paper);align-items:start}
.contact__left{display:grid;gap:1.5rem;justify-items:start;position:sticky;top:6rem}
.contact__left h1{font-size:3.5rem;line-height:1.05;letter-spacing:-.02em;max-width:8em}
.contact__left p{font-size:1.125rem;line-height:1.4;color:var(--t80);max-width:23rem}
.notes{display:grid;width:100%;max-width:26rem;border-top:1px solid var(--t10);margin-top:1rem}
.notes p{font-size:1rem!important;line-height:1.45!important;padding:.875rem 0;border-bottom:1px solid var(--t10);max-width:none!important}
.notes b{font-weight:500;color:var(--ink)}
.fcard{background:var(--white);border:1px solid var(--t10);border-radius:var(--r);padding:2.5rem;display:grid;gap:1.75rem}
.fcard>*{min-width:0}
.fq{display:grid;gap:.75rem;justify-items:start}
.fq>span{font-weight:500}
.seg{display:inline-flex;padding:.25rem;border-radius:999px;background:var(--paper-3);gap:.125rem;max-width:100%}
.seg button{height:2.25rem;padding:0 1rem;border-radius:999px;font-size:.9375rem;color:var(--t70);white-space:nowrap;text-align:center;transition:background-color .2s ease,color .2s ease}
.seg button:hover{color:var(--ink)}
.seg button[aria-selected="true"]{background:var(--ink);color:#fff}
.form{display:grid;grid-template-columns:1fr 1fr;gap:1.125rem var(--gap)}
.field{display:grid;gap:.5rem}
.field--full{grid-column:1/-1}
.field label{font-weight:500;font-size:.9375rem}
.field input,.field select,.field textarea{width:100%;font:400 1rem/1.3 var(--sans);color:var(--text);background:var(--paper);border:1px solid var(--t10);border-radius:8px;padding:.8rem .9rem;appearance:none;transition:border-color .2s ease,background-color .2s ease}
.field select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23020F28' stroke-width='1.5'%3E%3Cpath d='M3 6l5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .9rem center;background-size:1rem;padding-right:2.75rem}
.field textarea{min-height:8rem;resize:vertical}
.field input:hover,.field select:hover,.field textarea:hover{border-color:var(--t33)}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--blue);background:var(--white)}
.form__foot{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:1rem;align-items:center;justify-content:space-between}
.form__foot small{color:var(--t60);font-size:.875rem}
.form__done{grid-column:1/-1;padding:1rem 1.125rem;border-radius:8px;background:var(--sky);border:1px solid #B5CCFA;color:var(--ink)}
.placeholder{border:1px dashed var(--t33);border-radius:var(--r);padding:4rem 1.5rem;display:grid;gap:.75rem;justify-items:center;text-align:center;background:var(--paper)}
.placeholder p{color:var(--t80);max-width:24rem}
.callbox{display:grid;justify-items:start;gap:1rem}
.callbox .tel{font-family:var(--serif);font-size:3.5rem;line-height:1;letter-spacing:-.02em;color:var(--ink);transition:color .2s ease}
.callbox .tel:hover{color:var(--blue)}
[data-when]{display:none}
[data-when].is-on{display:revert}
.field[data-when].is-on{display:grid}

/* tablets */
@media (max-width:1100px) and (min-width:901px){
  .hdr__tel{display:none}
  .hdr__nav{gap:1.5rem;margin-left:1.5rem}
  :root{--gut:3rem}
}
/* phones and small tablets: fixed 16px root, single column */
@media (max-width:900px){
  html{font-size:16px}
  :root{--gut:1.25rem;--gutw:.75rem;--sec:5.5rem;--hdr:3.75rem;--gap:1rem}
  .t-hero{font-size:2.75rem;line-height:.95} .t-hero2{font-size:2.75rem} .t-mega{font-size:2.6rem} .t-xl{font-size:2.125rem}
  .t-h2,h2{font-size:2rem} .t-h2s{font-size:1.75rem} .t-quote{font-size:1.5rem}
  .g>*{grid-column:1/-1}
  .g{row-gap:1.75rem}
  .hdr__burger{display:block}
  .hdr__cta{display:none}
  .hdr__nav{position:fixed;inset:var(--hdr) 0 0 0;background:var(--paper);color:var(--ink);flex-direction:column;gap:0;margin:0;padding:.75rem var(--gut) 2rem;font-family:var(--serif);font-size:1.875rem;letter-spacing:-.015em;opacity:0;visibility:hidden;transform:translateY(-.75rem);transition:opacity .3s var(--ease),transform .4s var(--ease),visibility 0s .3s;overflow:auto}
  .hdr__nav a{padding:1.125rem 0;border-bottom:1px solid var(--t10)!important;opacity:1!important}
  .hdr.is-open{color:var(--ink)}
  .hdr.is-open::before{background:var(--paper);-webkit-mask-image:none;mask-image:none;inset:0}
  .hdr.is-open .hdr__logo img{filter:none}
  .hdr.is-open .hdr__nav{opacity:1;visibility:visible;transform:none;transition:opacity .3s var(--ease),transform .4s var(--ease),visibility 0s}
  .hero__card{height:auto;min-height:38rem;align-content:end}
  .hero__card::before{background:linear-gradient(0deg,rgba(1,11,31,.94) 0%,rgba(1,11,31,.8) 46%,rgba(1,11,31,.05) 82%)}
  .hero__img{object-position:66% 0;height:64%}
  .hero__edge,.hero__ghost{display:none}
  .hero__body{padding:15rem 1.25rem 1.75rem;max-width:none}
  .hero__note{flex-wrap:wrap;gap:.5rem;font-size:.9375rem;margin-bottom:1.25rem}
  .logos{padding:1.25rem 0 4.5rem}
  .logos__in{grid-template-columns:1fr;gap:1rem}
  .feat__head{padding-bottom:1rem}
  .feat__row{grid-template-columns:minmax(0,1fr);min-height:0;padding:3rem 0;row-gap:2rem}
  .feat__text,.feat__obj{grid-column:1}
  .feat__obj{justify-items:stretch}
  .feat__obj::before{display:none}
  .dcard,.dmini{width:100%}
  .rail__in{grid-template-columns:minmax(0,1fr);padding-left:var(--gut);row-gap:2rem;min-height:0}
  .rail__side{gap:1.5rem;padding-right:var(--gut)}
  .rcard{width:82vw;height:auto;min-height:26rem}
  .rcard__img{height:14rem}
  .qband{padding:4rem 0}
  .qband__text{gap:2rem}
  .qband__photo{height:20rem}
  .qdark{min-height:30rem;padding:2rem 1.25rem}
  .qdark::before{background:linear-gradient(0deg,rgba(1,11,31,.94) 0%,rgba(1,11,31,.7) 60%,rgba(1,11,31,.3) 100%)}
  .mega{padding:5.5rem 0 3rem}
  .mega__float{display:none}
  .story__sticky{position:static;height:auto;min-height:0;padding:1rem 0 var(--sec)}
  .story__list{display:none}
  .story__steps{gap:4rem}
  .story__step{grid-area:auto;grid-template-columns:minmax(0,1fr);opacity:1;visibility:visible;row-gap:1rem}
  .story__step h3{display:block;font-size:1.875rem;line-height:1.1}
  .story__text{grid-column:1;justify-self:start;max-width:none}
  .collage{grid-column:1;width:min(100%,24rem)}
  .collage>img{transform:none!important}
  .collage__card{transform:none;opacity:1}
  .proc{grid-template-columns:minmax(0,1fr);min-height:0}
  .proc__left{padding:2rem 1rem 1rem}
  .proc__vis{min-height:24rem;padding:1.5rem .75rem}
  .pv{width:100%}
  .acc__in p{max-width:none}
  .fchip:nth-child(n){margin-left:0}
  .mp{height:auto;min-height:20rem;padding:1.5rem 1rem}
  .mp--in{padding:0}
  .two,.three,.bento__row,.awards,.pulls,.slist{grid-template-columns:minmax(0,1fr)}
  .two,.three,.awards{grid-template-rows:none}
  .two>div,.three>*,.award{grid-row:auto;grid-template-rows:none}
  .two>div+div,.three>*+*{margin-top:1.5rem}
  .pulls{row-gap:1.5rem;padding-top:2.5rem}
  .cap{padding-top:1rem}
  .ruler__ticks span{font-size:.625rem;padding-left:.15rem}
  .ruler__ticks span:nth-child(even){color:transparent}
  .ruler__bar i{font-size:.6875rem;padding-left:.4rem}
  .ruler__notes{grid-template-columns:minmax(0,1fr);row-gap:1rem}
  .ruler__note{grid-column:1/-1!important;justify-items:start!important;text-align:left!important}
  .spanel{padding:4rem 1.25rem}
  .check__item{font-size:1.375rem}
  .check__out{grid-template-columns:minmax(0,1fr)}
  .phero{padding-top:calc(var(--hdr) + 1.5rem)}
  .pcollage{height:auto;display:grid;gap:.75rem;margin-top:2rem}
  .pcollage>*{position:static!important;transform:none!important;width:auto!important}
  .pcollage>img{display:none}
  .pcollage>img.keep{display:block;height:15rem!important;justify-self:center}
  .pcollage .ocard{width:100%!important}
  .intro{padding:2.5rem 0}
  .figure{justify-self:start}
  .bigp{grid-template-columns:minmax(0,1fr);padding:1.5rem;min-height:0;row-gap:1.5rem}
  .bigp__cap,.bigp__media{grid-column:1}
  .bigp__media{height:17rem;order:-1}
  .bigp__media img.photo{height:100%;bottom:0;right:auto;left:0;width:100%;border-radius:8px}
  .dpanel{padding:2rem 1.25rem}
  .vcard{min-height:0}
  .close{padding:var(--sec) 0 3.5rem}
  .ftr__bot{grid-template-columns:minmax(0,1fr);row-gap:.75rem;padding-bottom:6.5rem}
  .ftr__bot>*{grid-column:1!important;justify-self:start!important}
  .ftr__meta{padding-top:2.5rem}
  .ftr__tear{margin-top:-2rem}
  .mission{padding-bottom:4rem}
  .mission__tear{display:none}
  .mission__text p{font-size:2.125rem}
  .contact{padding-top:calc(var(--hdr) + 2rem)}
  .contact__left{position:static}
  .contact__left h1{font-size:2.5rem}
  .fcard{padding:1.25rem}
  .form{grid-template-columns:minmax(0,1fr)}
  .seg{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);width:100%;border-radius:14px}
  .seg button{height:auto;min-height:2.75rem;padding:.375rem .5rem;font-size:.875rem;line-height:1.15;white-space:normal;border-radius:11px}
  .callbox .tel{font-size:2.125rem}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001s!important;animation-iteration-count:1!important;transition-duration:.001s!important;transition-delay:0s!important}
  .js [data-reveal],.js [data-rise],.js [data-seq]>*{opacity:1!important;transform:none!important}
  .js .mq__track{animation:none}
  .mq__track{flex-wrap:wrap;width:auto}
  .ruler__bar i{clip-path:none}
}

.pcollage{overflow:hidden}

.ocard,.dcard,.dmini,.lic,.pv{max-width:100%}
.statrow a,.statrow span{overflow-wrap:anywhere;min-width:0}
@media (max-width:900px){
  .mp{grid-template-columns:minmax(0,1fr)}
  .mp>.ocard,.mp>.lic,.feat__obj .dcard,.feat__obj .dmini,.pv .ocard,.mp__stage>.ocard{width:100%!important}
  .mp .float{display:none}
  .mp>.ruler{padding:1.5rem 0}
  .mp[style*="padding:0 6%"]{padding:1.25rem 1rem!important}
}

/* without JavaScript everything is simply laid out in order */
html:not(.js) .story__sticky{position:static;height:auto;padding:var(--sec) 0}
html:not(.js) .story__list{display:none}
html:not(.js) .story__steps{gap:4rem}
html:not(.js) .story__step,html:not(.js) .q,html:not(.js) .pv,html:not(.js) .check__state{grid-area:auto;opacity:1;visibility:visible;transform:none}
html:not(.js) .story__step h3{display:block;grid-column:7/10}
html:not(.js) .collage>img{transform:none}
html:not(.js) .collage__card{opacity:1;transform:none}
html:not(.js) .check__go{opacity:1;visibility:visible}
html:not(.js) [data-when]{display:revert}
html:not(.js) .ruler__bar i{clip-path:none}

/* ===== polish pass ===== */
:root{--fs-xs:max(13px,.8125rem);--fs-sm:max(13px,.875rem);--sub:4.5rem}
h1,h2,h3,.t-hero2,.t-xl,.t-mega,.panel__statement{text-wrap:balance}
p{text-wrap:pretty}
.eyebrow,.drow,.dmini span,.ocard small,.dcard small,.ruler__bar i{font-size:var(--fs-xs)}
.t-sm,.orow,.dblock p,.lic p,.ruler__note span,.figure span,.form__foot small{font-size:var(--fs-sm)}
.ruler__ticks span{font-size:var(--fs-xs)}
.tag{height:1.5rem;padding:0 .5rem;font-size:var(--fs-xs);font-weight:400}
.sec-t{padding-top:var(--sec)}
.sec-t--tight{padding-top:8rem}
.sub{margin-top:var(--sub)}
.headblock{margin-bottom:var(--sub);display:grid;gap:1.5rem;justify-items:start}
.headblock p{max-width:23.5rem}

/* header: a solid themed bar, so nothing smears beneath it */
.hdr::before{inset:0;-webkit-mask-image:none;mask-image:none;background:rgba(255,255,255,.92);border-bottom:1px solid transparent;transition:background-color .2s ease,border-color .2s ease}
.page-paper .hdr::before{background:rgba(253,250,248,.94)}
.hdr.is-dark::before{background:rgba(1,11,31,.9)}
.hdr.is-scrolled::before{border-bottom-color:var(--t10)}
.hdr.is-dark.is-scrolled::before{border-bottom-color:var(--w10)}

/* hero */
.logos__in{grid-template-columns:auto minmax(0,1fr);gap:3rem}
.logos__in>p{white-space:nowrap}

/* quote band: text block centred against the photo */
.qband__text{align-content:center;gap:2rem;padding:0}
.qband__text .bars{margin:0}

/* sticky story: collage centred between the list and the text; cards sit low, clear of faces */
.story__text{justify-self:start;max-width:100%}
.collage__card{left:6%;right:6%;bottom:9%}
.collage__card .ocard__title{font-size:1.125rem}

/* object cards */
.ocard{gap:.875rem}
.ocard--lg{width:34rem;padding:1.5rem 1.75rem 1.25rem}
.ocard--lg .ocard__title{font-size:1.625rem}
.ocard--lg .orow{font-size:1rem;padding:.875rem 0}
.orow b{font-weight:500}
.orow svg{flex:none}

/* media panels: object centred, equal padding on every side, panel sized to its content */
.mp,.mp--short{height:auto;min-height:0;padding:4.5rem 2.5rem}
.mp--in{padding:0}
.mp>.ocard,.mp>.lic{width:min(100%,26rem)}
.mp>.ocard--lg{width:min(100%,34rem)}
.mp--photo{padding:.75rem;display:block;aspect-ratio:16/11}
.mp--photo img{width:100%;height:100%;object-fit:cover;border-radius:8px}
.mp--prop{padding:3.5rem 2rem}
.prop{width:7.5rem;height:7.5rem;object-fit:contain}
.cap{padding-top:1.25rem;gap:.625rem}
.cap h3{max-width:22rem}
.cap p{max-width:24rem}
.cap--sm p{font-size:1rem;line-height:1.45}
.mp__cap{padding:1.25rem 1.75rem 1.75rem;gap:.625rem}
.caps3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--gap);grid-template-rows:auto auto}
.caps3>div{display:grid;grid-template-rows:subgrid;grid-row:span 2;row-gap:.625rem;padding-top:1.25rem;border-top:1px solid var(--t10);margin-top:1.25rem;align-content:start}
.caps3 p{color:var(--t80);max-width:22rem}
.mp .tear--tr{width:24%}

/* licence cards */
.lic{width:min(100%,24rem);min-height:13rem;gap:2rem;justify-items:start}
.lic strong{color:var(--ink);font-size:1.875rem}
.lic--blue strong{color:#fff}
.lic .tag{justify-self:start}
.lic--blue .tag{background:rgba(255,255,255,.18);color:#fff}

/* rulers */
.ruler{position:relative}
.ruler__bar{position:relative}
.ruler__bar .pin{position:absolute;top:0;bottom:0;width:3px;background:var(--amber);padding:0;clip-path:none;transform:scaleY(0);transform-origin:bottom;transition:transform .6s var(--ease) 1.1s}
.in .ruler__bar .pin{transform:none}
.ruler__bar .end{background:var(--amber);color:var(--ink);padding:0;justify-content:center;transition-delay:1.5s}
.ruler__end{position:absolute;right:0;top:0;font:400 var(--fs-xs)/1 var(--sans);color:var(--t60)}
.ruler__note{padding-right:1rem}
.ruler__note--r{justify-items:end;text-align:right;padding-right:0;padding-left:1rem}

/* numbered panel: each step shows one composed object, centred */
.proc{min-height:40rem}
.proc__left{align-content:center}
.pv{width:min(100% - 3rem,23rem)}
.pv .ocard{background:var(--paper-2);border-color:transparent;padding:1.25rem 1.375rem}
.pv .ocard__title{font-size:1.375rem}
.pv .lic{width:100%;min-height:9.5rem;background:var(--paper-2);border-color:transparent}
.pv .lic--blue{background:var(--blue)}

/* home: who we are */
.who{border-radius:var(--r);background:var(--paper);padding:3.5rem calc(var(--gap) + 2rem);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:center;position:relative;overflow:hidden;isolation:isolate}
.who__text{grid-column:1/6;display:grid;gap:1.25rem;justify-items:start}
.who__text p{color:var(--t80);font-size:1.125rem;line-height:1.4}
.who__media{grid-column:8/13;position:relative}
.who__media img.photo{width:100%;aspect-ratio:1/1.06;object-fit:cover;object-position:50% 20%;border-radius:var(--r);position:relative}
.who__media img.scrap{position:absolute;left:-3.25rem;bottom:-2.25rem;width:11rem;z-index:-1}
.dpanel .tear{width:24%}

/* who can apply: list and result side by side */
.spanel--split{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);padding:5.5rem calc(var(--gut) - var(--gutw));text-align:left;justify-items:stretch;align-items:center;row-gap:2.5rem}
.spanel--split .check{grid-column:1/8;width:100%;gap:2.25rem}
.spanel--split h2{max-width:none}
.check__card{grid-column:9/13;background:var(--white);border:1px solid var(--t10);border-radius:var(--r);padding:1.75rem;display:grid;gap:1.25rem;align-content:space-between;min-height:15rem}
.check__meter{display:grid;grid-template-columns:repeat(3,1fr);gap:.25rem;height:.375rem}
.check__meter i{border-radius:3px;background:var(--t10);transition:background-color .4s var(--ease)}
.check__meter i.on{background:var(--blue)}
.check__states{display:grid;align-content:start}
.check__state{font-size:1rem}
.check__state b{font-size:1.625rem;line-height:1.12;margin-bottom:.5rem}
.check__go{justify-self:start}

/* hero collage on inner pages */
.pcollage{height:26rem}
.pcollage .ocard{width:17.5rem;padding:1.25rem}
.pcollage .ocard small{line-height:1.4}

/* statrow */
.statrow b{font-size:2.75rem}

/* contact */
.form__done{display:grid;grid-template-columns:auto 1fr;gap:.25rem 1rem;align-items:start;padding:1.5rem;background:var(--paper);border:1px solid var(--t10)}
.form__done[hidden]{display:none}
.form__done i{grid-row:span 2;width:2.5rem;height:2.5rem;border-radius:8px;background:var(--blue);color:#fff;display:grid;place-items:center}
.form__done i svg{width:1.125rem;height:1.125rem}
.form__done b{font-family:var(--serif);font-weight:400;font-size:1.625rem;line-height:1.12;color:var(--ink)}
.form__done span{color:var(--t80)}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--blue);outline-offset:1px;border-color:var(--blue)}
.seg button:focus-visible,.btn:focus-visible{outline-offset:2px}

/* footer torn accent */
.ftr__tear{position:absolute;right:0;bottom:0;width:26rem;height:auto;transform:rotate(180deg);margin:0;z-index:-1}
.ftr{isolation:isolate}
.ftr__bot{padding-bottom:6.5rem}

/* motion: collage pieces assemble a beat apart */
.js .pcollage [data-rise]{transition:opacity .8s var(--ease),transform .9s var(--ease);transition-delay:calc(var(--k,0)*130ms + .15s);transform:translateY(40px)}
.js .feat__obj [data-rise]{transition:opacity .8s var(--ease),transform .9s var(--ease);transition-delay:calc(var(--k,0)*130ms + .1s);transform:translateY(36px)}
.js .pcollage.in [data-rise],.js .feat__row.in [data-rise]{transform:none}
.q.is-active{transition:opacity .7s var(--ease) .1s,visibility 0s}
.story__step.is-active{transition:opacity .7s var(--ease) .1s,visibility 0s}
.pv.is-active{transition:opacity .7s var(--ease) .15s,transform .85s var(--ease) .15s,visibility 0s}

@media (max-width:900px){
  .who{grid-template-columns:minmax(0,1fr);padding:1.5rem;row-gap:2rem}
  .who__text,.who__media{grid-column:1}
  .who__media{order:-1}
  .who__media img.scrap{display:none}
  .spanel--split{grid-template-columns:minmax(0,1fr);padding:3rem 1.25rem}
  .spanel--split .check,.check__card{grid-column:1}
  .check__card{min-height:0}
  .caps3{grid-template-columns:minmax(0,1fr);grid-template-rows:none}
  .caps3>div{grid-row:auto;grid-template-rows:none}
  .mp,.mp--short{padding:2rem 1rem}
  .mp--in,.mp--photo{padding:0}
  .mp--photo{padding:.5rem}
  .logos__in{grid-template-columns:minmax(0,1fr);gap:1rem}
  .pcollage{height:auto}
  .pv{width:100%}
  .proc{min-height:0}
  .ftr__tear{width:14rem}
  .ruler__end{display:none}
  .collage__card{left:0;right:0}
}

.is-all .check__go{opacity:1;visibility:visible;transition:opacity .6s var(--ease) .2s,visibility 0s}
.slist a{transition:color .2s ease}
.slist a:hover{color:var(--sky-2)}
.vcard{min-height:27rem}
.vcard__obj{padding:3rem 2rem 2rem}
.vcard__obj .prop,.mp--prop .prop{width:8.5rem;height:8.5rem}
.three>.vcard{grid-row:auto;display:grid;grid-template-rows:minmax(0,1fr) auto}
.close{padding-top:var(--sec)}
.rail{padding:var(--sec) 0 0}
.rail + .qband{margin-top:var(--sec)}
.mission{padding-bottom:5.5rem}

.form__foot[hidden]{display:none}
.pv .lic{color:var(--text)}
.pv .lic--blue{color:#fff}
.pv .lic p{opacity:.82}
.pcollage{border-bottom:1px solid var(--t10)}
.intro{padding-top:3.5rem}
.who__media img.scrap{left:-3.5rem;bottom:2rem;width:12rem}

.eyebrow--h1{font-size:var(--fs-sm)}
.waffle{max-width:22rem}
@media (max-width:900px){
  .pcollage{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:.75rem;border-bottom:0;margin-top:1.5rem}
  .pcollage>img.keep{grid-column:1/-1}
  .pcollage .ocard{width:auto!important}
  .ruler__note,.ruler__note--r{padding-left:0;padding-right:0}
  .mp>.lic{width:min(100%,24rem)!important}
  .mp>.ocard{width:min(100%,30rem)!important}
  .lic{min-height:10rem}
}
@media (max-width:520px){
  .pcollage{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:900px){.dpanel .tear{display:none}.check__card{min-height:0}}

/* header links: colour-only hover */
.hdr__nav:hover a{opacity:1}
.hdr__nav a{transition:color .2s ease}
.hdr__nav a:hover{color:var(--blue)}
.hdr.is-dark .hdr__nav a:hover{color:var(--sky-2)}
.hdr__tel{transition:color .2s ease}
.hdr__tel:hover{color:var(--blue)} .hdr.is-dark .hdr__tel:hover{color:var(--sky-2)}
.ftr__tear{width:21rem}
.caps3 h3{max-width:16rem}
@media (prefers-reduced-motion:reduce){.ruler__bar .pin{transform:none}}

.pcollage .ocard{min-height:10.25rem;align-content:start}
