/* NLH Consulting. "The still point": dawn lake, stacked stones, the logo's navy and gold rule. See DESIGN.md */
@font-face{font-family:"Newsreader";src:url(/fonts/newsreader-latin-opsz-normal.woff2) format("woff2");font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:"Newsreader";src:url(/fonts/newsreader-latin-opsz-italic.woff2) format("woff2");font-weight:200 800;font-style:italic;font-display:swap}
@font-face{font-family:"Libre Caslon Text";src:url(/fonts/libre-caslon-text-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Source Serif 4";src:url(/fonts/source-serif-4-latin-opsz-normal.woff2) format("woff2");font-weight:200 900;font-display:swap}
@font-face{font-family:"Hanken Grotesk";src:url(/fonts/hanken-grotesk-latin-wght-normal.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Figtree";src:url(/fonts/figtree-latin-wght-normal.woff2) format("woff2");font-weight:300 900;font-display:swap}
@font-face{font-family:"Manrope";src:url(/fonts/manrope-latin-wght-normal.woff2) format("woff2");font-weight:200 800;font-display:swap}

:root{
  --navy:#071f44; --navy-2:#0e2c5c; --slate:#464a53; --gold:#a97c39; --gold-lt:#d2a862; --gold-dk:#86602a;
  --white:#fff; --paper:#f5f7fa; --mist:#e4eaf2; --line:#d4dce7; --ink:#1d2a3f;
  --page-max:1560px; --page-gut:clamp(20px,3.6vw,56px);
  --sec:clamp(56px,7.4vw,108px);
  --head:"Newsreader",Georgia,serif; --body:"Hanken Grotesk",system-ui,sans-serif;
  --ease:cubic-bezier(.23,1,.32,1); --ease-io:cubic-bezier(.77,0,.175,1);
  --hdr-h:92px;
}
html[data-hf="2"]{--head:"Libre Caslon Text",Georgia,serif}
html[data-hf="3"]{--head:"Source Serif 4",Georgia,serif}
html[data-bf="2"]{--body:"Figtree",system-ui,sans-serif}
html[data-bf="3"]{--body:"Manrope",system-ui,sans-serif}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overflow-x:clip}
body{margin:0;background:var(--white);color:var(--ink);font:400 clamp(16px,1.08vw,18px)/1.62 var(--body);overflow-x:clip;-webkit-font-smoothing:antialiased}
main{overflow-x:clip}
img,svg{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3,p,ul,ol,dl,dd,figure,blockquote,address{margin:0;padding:0}
ul,ol{list-style:none}
address{font-style:normal}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.skip{position:fixed;left:12px;top:12px;z-index:10001;background:var(--navy);color:#fff;padding:10px 16px}
.skip:not(:focus){clip-path:inset(50%);width:1px;height:1px;overflow:hidden;padding:0}
.wrap{width:100%;max-width:var(--page-max);margin-inline:auto;padding-inline:var(--page-gut)}
.sec{padding-block:var(--sec)}
[data-of]:not(.is-active){display:none}
html[data-hero="1"] .hero[data-v="1"],html[data-hero="2"] .hero[data-v="2"],html[data-hero="3"] .hero[data-v="3"]{display:block}
html[data-footer="1"] .ft[data-v="1"],html[data-footer="2"] .ft[data-v="2"],html[data-footer="3"] .ft[data-v="3"]{display:block}

/* Type */
.h2{font:400 clamp(32px,3.7vw,62px)/1.08 var(--head);letter-spacing:-.018em;color:var(--navy);font-optical-sizing:auto;text-wrap:balance}
.hl{color:var(--gold);font-style:italic}
html[data-hf="2"] .hl{font-style:normal}
html[data-hf="3"] .hl{font-style:normal}
.w{display:inline-block;overflow:hidden;vertical-align:top;padding:.12em .05em .2em;margin:-.12em -.05em -.2em}
.w>span{display:inline-block;will-change:transform}
.lead{font:400 clamp(21px,1.75vw,29px)/1.32 var(--head);color:var(--navy)}
@media (max-width:899px){.h2,.lead{max-width:none;text-wrap:pretty}}

/* Logo */
.logo{width:100%;height:100%;--logo-a:#071f44;--logo-b:#464a53;--logo-c:#a97c39}
.logo--light{--logo-a:#fff;--logo-b:#cfd8e6;--logo-c:#d2a862}

/* Buttons: never move. The gold diamond from the logo's rule blooms to fill the button. */
.btn{position:relative;display:inline-flex;align-items:center;gap:12px;min-height:54px;padding:0 26px 0 22px;background:var(--navy);color:#fff;font:600 15.5px/1 var(--body);letter-spacing:.005em;text-decoration:none;white-space:nowrap;isolation:isolate;overflow:hidden;transition:color .35s var(--ease)}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--gold-lt);clip-path:polygon(29px 50%,29px 50%,29px 50%,29px 50%);transition:clip-path .6s var(--ease)}
.btn__d{width:9px;height:9px;flex:none;background:var(--gold-lt);transform:rotate(45deg);transition:background-color .3s}
@media (hover:hover){
  .btn:hover{color:var(--navy)}
  .btn:hover::before{clip-path:polygon(29px -340px,400px 50%,29px 340px,-340px 50%)}
  .btn:hover .btn__d{background:var(--navy)}
}
.btn--sm{min-height:46px;padding:0 20px 0 17px;font-size:14.5px;gap:10px}
.btn--sm::before{clip-path:polygon(22px 50%,22px 50%,22px 50%,22px 50%)}
@media (hover:hover){.btn--sm:hover::before{clip-path:polygon(22px -340px,400px 50%,22px 340px,-340px 50%)}}
.btn--ghost{background:rgba(255,255,255,.62);color:var(--navy);box-shadow:inset 0 0 0 1.5px var(--navy)}
.btn--ghost .btn__d{background:var(--gold)}
.btn--gold{background:var(--gold-lt);color:var(--navy)}
.btn--gold::before{background:#fff}
.btn--gold .btn__d{background:var(--navy)}
.btn--light{background:#fff;color:var(--navy)}
.btn--light .btn__d{background:var(--gold)}
.btn--ghostlight{background:transparent;color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.75)}
.btn--ghostlight .btn__d{background:var(--gold-lt)}

/* Button option 2: the logo's rule. A gold line that rises to fill. */
html[data-btn="2"] .btn{background:transparent;color:var(--navy);box-shadow:inset 0 -2px 0 var(--gold);padding:0 14px 0 12px;min-height:50px;gap:12px}
html[data-btn="2"] .btn::before{clip-path:inset(100% 0 0 0);transition:clip-path .45s var(--ease);background:var(--gold-lt)}
html[data-btn="2"] .btn__d{background:var(--gold)}
html[data-btn="2"] .btn--sm{min-height:44px}
@media (hover:hover){html[data-btn="2"] .btn:hover::before{clip-path:inset(0 0 0 0)}}
html[data-btn="2"] .btn--light,html[data-btn="2"] .btn--ghostlight,html[data-btn="2"] .ft--a .btn,html[data-btn="2"] .menu .btn{color:#fff}
@media (hover:hover){html[data-btn="2"] .btn--light:hover,html[data-btn="2"] .btn--ghostlight:hover,html[data-btn="2"] .ft--a .btn:hover,html[data-btn="2"] .menu .btn:hover{color:var(--navy)}}
html[data-btn="2"] .ft--a .btn__d,html[data-btn="2"] .menu .btn__d,html[data-btn="2"] .btn--light .btn__d,html[data-btn="2"] .btn--ghostlight .btn__d{background:var(--gold-lt)}

/* Button option 3: the folder tab. Cut corner, gold slides across on the diagonal. */
html[data-btn="3"] .btn{clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%);padding:0 30px 0 22px}
html[data-btn="3"] .btn--ghost{box-shadow:none;background:var(--mist)}
html[data-btn="3"] .btn--ghostlight{background:rgba(255,255,255,.2);color:#fff}
html[data-btn="3"] .btn::before{clip-path:polygon(-40% 0,-40% 0,-80% 100%,-80% 100%);transition:clip-path .55s var(--ease)}
@media (hover:hover){html[data-btn="3"] .btn:hover::before{clip-path:polygon(-40% 0,160% 0,120% 100%,-80% 100%)}}
html[data-btn="3"] .btn--ghostlight:hover{color:var(--navy)}

/* Header. Three states: in-flow at the top, fixed + hidden, fixed + shown (only scrolling up, past the hero). */
.hdr{position:absolute;top:0;left:0;right:0;z-index:9999;transform:translate3d(0,0,0);will-change:transform}
.hdr__in{width:100%;max-width:var(--page-max);margin:auto;padding:16px var(--page-gut);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px}
.hdr__logo{display:block;width:92px;height:60px}
.hdr__logo .logo{width:92px;height:60px}
.hdr__nav{display:flex;gap:clamp(18px,2.2vw,38px)}
.hdr__nav a{position:relative;font:400 clamp(17px,1.25vw,20px)/1 var(--head);color:var(--navy);text-decoration:none;padding:8px 0}
.hdr__nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1.5px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}
@media (hover:hover){.hdr__nav a:hover::after{transform:scaleX(1)}}
.hdr__end{display:flex;justify-content:flex-end;align-items:center;gap:14px}
.hdr__tog{display:none;position:relative;width:46px;height:46px}
.hdr__tog span{position:absolute;left:10px;right:10px;height:2px;background:var(--navy);transition:transform .7s var(--ease),background-color .3s}
.hdr__tog span:first-child{top:18px}.hdr__tog span:last-child{top:27px}
.hdr.is-fixed{position:fixed;background:#fff;transform:translate3d(0,calc(-100% - 24px),0);opacity:0;pointer-events:none}
.hdr.is-fixed .hdr__in{padding-block:10px}
.hdr.is-fixed .hdr__logo,.hdr.is-fixed .hdr__logo .logo{width:76px;height:50px}
.hdr.is-anim{transition:transform .6s var(--ease),opacity .6s var(--ease)}
.hdr.is-shown{transform:translate3d(0,0,0);opacity:1;pointer-events:auto}
.hdr.is-fading{transition:opacity .45s ease;transform:translate3d(0,0,0);opacity:0;pointer-events:none}
html[data-hero="2"] .hdr:not(.is-fixed) .hdr__nav a{color:#fff}
html[data-hero="2"] .hdr:not(.is-fixed) .logo{--logo-a:#fff;--logo-b:#dfe6f0;--logo-c:#d2a862}
html[data-hero="2"] .hdr:not(.is-fixed) .hdr__tog span{background:#fff}
html[data-hero="2"] .hdr:not(.is-fixed) .btn{background:#fff;color:var(--navy)}
html[data-hero="2"] .hdr:not(.is-fixed) .btn__d{background:var(--gold)}
body.menu-open .hdr{position:fixed;background:transparent;transform:none;opacity:1;pointer-events:auto;transition:none}
body.menu-open .hdr .logo{--logo-a:#fff;--logo-b:#cfd8e6;--logo-c:#d2a862}
body.menu-open .hdr__tog span{background:#fff}
body.menu-open .hdr__tog span:first-child{transform:translateY(4.5px) rotate(45deg)}
body.menu-open .hdr__tog span:last-child{transform:translateY(-4.5px) rotate(-45deg)}
body.menu-open .hdr__end .btn{visibility:hidden}

/* Header option 2: a floating pill, phone gets a bottom dock */
@media (min-width:900px){
  html[data-header="2"] .hdr__in{max-width:max-content;grid-template-columns:auto auto auto;margin-top:18px;padding:8px 8px 8px 22px;background:#fff;border-radius:999px;box-shadow:0 14px 44px rgba(7,31,68,.14);gap:clamp(22px,2.6vw,44px)}
  html[data-header="2"] .hdr__logo,html[data-header="2"] .hdr__logo .logo{width:64px;height:42px}
  html[data-header="2"] .btn{border-radius:999px}
  html[data-header="2"] .hdr.is-fixed{background:transparent}
  html[data-header="2"] .hdr.is-fixed .hdr__in{padding-block:8px;margin-top:12px}
  html[data-header="2"] .hdr.is-fixed .hdr__logo,html[data-header="2"] .hdr.is-fixed .hdr__logo .logo{width:64px;height:42px}
  html[data-hero="2"][data-header="2"] .hdr:not(.is-fixed) .hdr__nav a{color:var(--navy)}
  html[data-hero="2"][data-header="2"] .hdr:not(.is-fixed) .logo{--logo-a:#071f44;--logo-b:#464a53;--logo-c:#a97c39}
  html[data-hero="2"][data-header="2"] .hdr:not(.is-fixed) .btn{background:var(--navy);color:#fff}
}
/* Header option 3: nav left, logo hanging on a navy folder tab, call right */
@media (min-width:900px){
  html[data-header="3"] .hdr__in{grid-template-columns:1fr auto 1fr;padding-top:0}
  html[data-header="3"] .hdr__logo{order:2;width:138px;height:auto;padding:26px 22px 22px;background:var(--navy);--c:14px;clip-path:polygon(0 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,16px 100%,0 calc(100% - 16px))}
  html[data-header="3"] .hdr__logo .logo{width:94px;height:62px;--logo-a:#fff;--logo-b:#cfd8e6;--logo-c:#d2a862}
  html[data-header="3"] .hdr__nav{order:1;gap:clamp(14px,1.6vw,28px)}
  html[data-header="3"] .hdr__end{order:3}
  html[data-header="3"] .hdr.is-fixed .hdr__in{padding-block:0 8px}
  html[data-header="3"] .hdr.is-fixed .hdr__logo{width:110px;padding:14px 16px 16px}
  html[data-header="3"] .hdr.is-fixed .hdr__logo .logo{width:78px;height:50px}
  html[data-hero="2"][data-header="3"] .hdr:not(.is-fixed) .hdr__logo .logo{--logo-a:#fff}
}

/* Slide-out menu: same curve and duration both ways, items stagger in and out */
.menu{position:fixed;inset:0;z-index:9998;background:var(--navy);color:#fff;display:flex;flex-direction:column;justify-content:center;gap:clamp(24px,5svh,44px);padding:96px var(--page-gut) 34px;transform:translate3d(100%,0,0);visibility:hidden;transition:transform .7s var(--ease-io),visibility 0s linear .7s}
.menu.is-open{transform:none;visibility:visible;transition:transform .7s var(--ease-io),visibility 0s}
.menu__nav{display:flex;flex-direction:column;gap:clamp(4px,1.2svh,12px)}
.menu__nav a{font:400 clamp(32px,6.4svh,52px)/1.14 var(--head);color:#fff;text-decoration:none}
.menu__nav a,.menu__foot{opacity:0;transform:translate3d(36px,0,0);transition:opacity .45s ease,transform .7s var(--ease);transition-delay:calc((6 - var(--i))*.04s)}
.menu.is-open .menu__nav a,.menu.is-open .menu__foot{opacity:1;transform:none;transition-delay:calc(.22s + var(--i)*.055s)}
.menu__foot{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.menu__foot>a:not(.btn){color:#dfe6f0;text-decoration:none}
.menu__foot .btn{margin-top:14px}

/* Hero shared */
.hero{position:relative;overflow:hidden}
.hero__h{font:400 clamp(44px,5.7vw,98px)/1.02 var(--head);letter-spacing:-.022em;color:var(--navy)}
.hero__h .ln{display:block;overflow:hidden;padding:.08em .04em .18em;margin:-.08em -.04em -.18em}
.hero__h .ln>span{display:block}
.hero__p{font-size:clamp(17px,1.32vw,22px);line-height:1.42;color:var(--navy);max-width:34em;margin-top:clamp(16px,2svh,26px)}
.hero__cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:clamp(20px,3svh,34px)}

/* Hero 1: still lake + building cairn */
.hero--a{height:100svh;min-height:600px;background:#c4d4e8}
.hero__plate{position:absolute;inset:-7% 0 -7% 0;display:block;will-change:transform}
.hero__plate img{width:100%;height:100%;object-fit:cover;object-position:62% 56%}
.hero__copy{position:relative;z-index:3;padding-top:clamp(112px,15svh,170px)}
.hero__cairn{position:absolute;z-index:2;right:max(var(--page-gut),calc((100vw - var(--page-max))/2 + var(--page-gut)));bottom:-3.5svh;height:min(66svh,58vw);aspect-ratio:1000/1260;will-change:transform}
.hero__cairn img{position:absolute;inset:0;width:100%;height:100%}
html.has-motion .hero[data-v="1"] .hero__cairn img,html.has-motion [data-hero-in]{opacity:0}
html.has-motion .hero__h .ln>span{transform:translateY(112%)}
@media (min-width:900px) and (max-height:640px){.hero__h{font-size:clamp(40px,10svh,64px)}.hero__copy{padding-top:96px}}

/* Hero 2: slideshow */
.hero--b{height:100svh;min-height:560px;background:var(--navy)}
.slides,.hero--b__scrim{position:absolute;inset:0}
.slide{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.14);transition:opacity 1.1s ease-in-out}
.slide.is-on{opacity:1;z-index:1}
.slide.is-zoom{transform:scale(1);transition:opacity 1.1s ease-in-out,transform 4.4s cubic-bezier(.3,.1,.3,1)}
.hero--b__scrim{z-index:2;background:linear-gradient(90deg,rgba(7,31,68,.78) 0%,rgba(7,31,68,.5) 46%,rgba(7,31,68,.1) 100%),linear-gradient(0deg,rgba(7,31,68,.42),rgba(7,31,68,0) 34%),linear-gradient(180deg,rgba(7,31,68,.4),rgba(7,31,68,0) 24%)}
.hero--b .hero__copy{position:absolute;z-index:3;left:0;right:0;bottom:clamp(56px,10svh,104px);padding-top:0}
.hero--b .hero__h,.hero--b .hero__p{color:#fff}
.hero--b .hl{color:var(--gold-lt)}
.slides__bar{position:absolute;z-index:3;left:0;right:0;bottom:0;height:4px;background:rgba(255,255,255,.22)}
.slides__bar i{display:block;height:100%;background:var(--gold-lt);transform:scaleX(0);transform-origin:left}

/* Hero 3: type + panorama */
.hero--c{padding-top:clamp(112px,14svh,150px);background:#fff}
.hero--c__top{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(14px,2.4svh,26px);padding-bottom:clamp(10px,2svh,24px)}
.hero--c__side{display:flex;flex-wrap:wrap;align-items:center;gap:18px clamp(20px,3vw,44px)}
.hero--c__side .hero__p{margin:0;max-width:27em}
.hero--c .hero__h{font-size:clamp(44px,5.3vw,96px)}
.hero--c__pano{position:relative;margin-top:clamp(24px,5svh,70px)}
.hero--c__frame{position:relative;height:clamp(240px,44svh,520px);overflow:hidden}
.hero--c__frame img{position:absolute;left:0;top:-14%;width:100%;height:128%;object-fit:cover;object-position:60% 62%}
.hero--c__cairn{position:absolute;z-index:2;right:max(var(--page-gut),calc((100vw - var(--page-max))/2 + var(--page-gut)));bottom:-5%;height:172%;width:auto;max-height:66svh}

/* Marquee: runs on its own, never pauses */
.mq{background:var(--navy);color:#fff;overflow:hidden;padding:clamp(15px,1.5vw,22px) 0}
.mq__t{display:flex;width:max-content;animation:mq 58s linear infinite;will-change:transform}
.mq ul{display:flex;flex:none}
.mq li{display:flex;align-items:center;font:400 clamp(19px,1.6vw,27px)/1.1 var(--head);white-space:nowrap}
.mq li::after{content:"";width:8px;height:8px;margin:0 clamp(22px,2.6vw,42px);background:var(--gold-lt);transform:rotate(45deg)}
@keyframes mq{to{transform:translate3d(-50%,0,0)}}

/* Frames: photos sit on paper, inside the pack */
.frame{position:relative;overflow:hidden}
.frame>img{position:absolute;left:0;top:-13%;width:100%;height:126%;max-width:none;object-fit:cover}

/* About */
.about__g{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(16px,2vw,32px);row-gap:clamp(36px,5vw,72px);align-items:center}
.about__copy{grid-column:1/7}
.about__copy .h2{margin-bottom:clamp(20px,2.2vw,32px)}
.about__copy p+p{margin-top:16px}
.about__copy p:not(.lead):not(.about__sig){max-width:38em}
.about__sig{font:italic 400 clamp(18px,1.4vw,23px)/1.3 var(--head);color:var(--gold-dk);padding-top:22px}
.about__sig::before{content:"";display:block;width:112px;height:9px;margin-bottom:16px;background:linear-gradient(var(--gold),var(--gold)) 0 50%/100% 1.5px no-repeat}
.about__fig{grid-column:7/13;padding:clamp(14px,1.8vw,28px)}
.pack{position:relative}
.pack__folder{position:absolute;inset:-3.4% -2.6% -3.4% -2.6%;background:var(--navy);transform:rotate(1.6deg)}
.pack__folder::before{content:"";position:absolute;right:9%;top:-16px;width:26%;height:18px;background:var(--navy);clip-path:polygon(12px 0,calc(100% - 12px) 0,100% 100%,0 100%)}
.sheet{position:relative;background:#fff;padding:clamp(10px,1vw,16px);box-shadow:0 22px 50px rgba(7,31,68,.2);transform:rotate(-.7deg)}
.sheet__clip{position:absolute;z-index:2;left:clamp(26px,3vw,44px);top:-13px;width:16px;height:46px;border:2px solid var(--gold);border-radius:9px;background:transparent}
.frame--about{aspect-ratio:16/10.4}
.frame--about img{object-position:88% 30%}
.sheet figcaption{padding:12px 4px 2px;font-size:15px;line-height:1.35;color:var(--slate)}
.sheet figcaption strong{color:var(--navy);font:400 19px/1.25 var(--head)}
.stats{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(16px,2vw,32px)}
.stats>div{padding-top:14px;border-top:1.5px solid var(--gold)}
.stats dt{font:400 clamp(46px,5vw,84px)/1 var(--head);color:var(--navy);letter-spacing:-.02em;font-variant-numeric:lining-nums}
.stats dd{margin-top:8px;font-size:clamp(15px,1vw,16.5px);line-height:1.4;color:var(--slate);max-width:17em}

/* Services: the binder */
.svc{background:var(--paper)}
.svc__h{margin-bottom:14px}
.svc__intro{max-width:42em;color:var(--slate);margin-bottom:clamp(28px,3.4vw,50px)}
.binder{position:relative}
.binder__tabs{display:none}
.binder__sheets{display:grid;gap:18px}
.page{background:#fff;padding:clamp(20px,2.4vw,40px);display:grid;gap:clamp(18px,2.4vw,40px);box-shadow:0 16px 44px rgba(7,31,68,.08)}
.page h3{font:400 clamp(26px,2.3vw,38px)/1.12 var(--head);color:var(--navy);letter-spacing:-.012em;margin-bottom:12px}
.page__txt>p{color:var(--slate);max-width:36em}
.page ul{margin-top:18px;display:grid;gap:10px}
.page li{position:relative;padding-left:20px;line-height:1.42;color:var(--ink)}
.page li::before{content:"";position:absolute;left:1px;top:.55em;width:7px;height:7px;background:var(--gold);transform:rotate(45deg)}
.page__img{aspect-ratio:4/3}
@media (min-width:900px){
  .binder{display:grid;grid-template-columns:minmax(0,clamp(250px,24%,350px)) minmax(0,1fr);align-items:stretch}
  .binder__tabs{display:flex;flex-direction:column;gap:6px;padding-top:26px;position:relative;z-index:2}
  .binder__tabs button{position:relative;text-align:left;font:400 clamp(18px,1.4vw,23px)/1.2 var(--head);color:var(--navy);padding:16px 18px 16px 18px;background:var(--mist);clip-path:polygon(0 0,calc(100% - 0px) 0,100% 100%,14px 100%,0 calc(100% - 14px));transition:background-color .35s ease,color .35s ease}
  .binder__tabs button::after{content:"";position:absolute;right:16px;top:50%;width:9px;height:9px;margin-top:-4px;background:var(--gold-lt);transform:rotate(45deg) scale(0);transition:transform .45s var(--ease)}
  .binder__tabs button[aria-selected="true"]{background:var(--navy);color:#fff;padding-right:38px}
  .binder__tabs button[aria-selected="true"]::after{transform:rotate(45deg) scale(1)}
}
@media (min-width:900px) and (hover:hover){.binder__tabs button:not([aria-selected="true"]):hover{background:var(--gold-lt)}}
@media (min-width:900px){
  .binder__sheets{display:grid;grid-template-areas:"a";position:relative;background:var(--navy);padding:clamp(14px,1.3vw,20px) clamp(14px,1.3vw,20px) clamp(14px,1.3vw,20px) clamp(14px,1.3vw,20px)}
  .page{grid-area:a;grid-template-columns:minmax(0,1fr) minmax(0,1.04fr);align-items:center;box-shadow:none;opacity:0;visibility:hidden;clip-path:inset(0 0 100% 0);transition:clip-path .7s var(--ease),opacity .25s ease,visibility 0s linear .7s}
  .page.is-on{opacity:1;visibility:visible;clip-path:inset(0 0 0 0);transition:clip-path .7s var(--ease),opacity .2s ease,visibility 0s;z-index:1}
  .page__img{aspect-ratio:auto;height:100%;min-height:clamp(300px,31vw,450px)}
}

/* Process: cairn builds as you read */
.proc__g{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(20px,4vw,72px);align-items:start}
.proc__stage{position:sticky;top:max(16px,calc(50svh - min(38svh,330px)));display:flex;justify-content:center}
.proc__stack{position:relative;height:min(76svh,660px);aspect-ratio:1000/1260;max-width:100%}
.proc__stack img{position:absolute;inset:0;width:100%;height:100%;will-change:transform}
.proc__intro{color:var(--slate);max-width:36em;margin-top:14px}
.steps{margin-top:clamp(26px,4vw,56px)}
.steps li{display:grid;grid-template-columns:clamp(50px,5vw,86px) minmax(0,1fr);gap:clamp(8px,1.4vw,20px);min-height:min(42svh,380px);align-items:start;transition:opacity .4s ease}
html.has-motion .steps li{opacity:.32}
html.has-motion .steps li.is-on{opacity:1}
.steps b{font:400 clamp(44px,4.8vw,80px)/.95 var(--head);color:var(--gold);font-variant-numeric:lining-nums}
.steps h3{font:400 clamp(24px,2.3vw,38px)/1.14 var(--head);color:var(--navy);letter-spacing:-.01em;margin-bottom:8px}
.steps p{color:var(--slate);max-width:32em}
.steps li:last-child{min-height:0}

/* Work: pinned, every card on its own layer */
.work{position:relative;z-index:1;overflow:hidden;height:100svh;background:var(--mist);touch-action:pan-y}
.work__track{height:100%;display:flex;align-items:center;gap:clamp(28px,4vw,64px);padding-left:max(var(--page-gut),calc((100vw - var(--page-max))/2 + var(--page-gut)))}
.work__intro{flex:none;width:clamp(260px,27vw,430px)}
.work__intro .h2{font-size:clamp(44px,min(5.4vw,11svh),96px)}
.work__intro p{margin-top:14px;color:var(--slate);font-size:clamp(15px,min(1.2vw,2.8svh),19px);line-height:1.45}
.work__row{display:flex;gap:clamp(16px,1.8vw,28px);padding-block:16px;padding-right:var(--page-gut)}
.job{flex:none;display:flex;flex-direction:column;width:clamp(290px,62svh,470px);height:min(82svh,660px);background:#fff;box-shadow:0 14px 34px rgba(7,31,68,.1);will-change:transform;transform:translate3d(0,0,0)}
.job:nth-child(even){margin-top:clamp(0px,2svh,20px)}
.job--navy{background:var(--navy);color:#dbe3ef}
.job__img{flex:1 1 40%;min-height:0}
.job__img>img{top:0;height:100%;left:-7%;width:114%}
.job__b{flex:0 0 auto;padding:clamp(14px,2.6svh,28px) clamp(16px,2.2svh,28px)}
.job h3{font:400 clamp(21px,min(1.9vw,4.2svh),32px)/1.12 var(--head);color:var(--navy);letter-spacing:-.01em}
.job--navy h3{color:#fff}
.job__m{font-size:clamp(12.5px,2.2svh,14.5px);line-height:1.3;color:var(--gold-dk);font-weight:600;margin:6px 0 clamp(6px,1.2svh,12px)}
.job--navy .job__m{color:var(--gold-lt)}
.job p:last-child{font-size:clamp(13.5px,2.3svh,16px);line-height:1.42}

/* Recognition */
.bento{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(12px,1.2vw,20px);margin-top:clamp(28px,3.4vw,52px)}
.cell{background:var(--paper);padding:clamp(20px,2.2vw,36px)}
.cell h3{font:400 clamp(22px,1.9vw,31px)/1.14 var(--head);color:var(--navy);letter-spacing:-.01em;margin-bottom:16px}
.cell--navy{background:var(--navy);color:#dbe3ef}
.cell--navy h3{color:#fff;font-size:clamp(28px,2.8vw,46px);margin-bottom:clamp(20px,2.4vw,36px)}
.cell--awards{grid-column:span 7}
.award+.award{margin-top:20px}
.award strong{display:block;font:400 clamp(19px,1.5vw,24px)/1.2 var(--head);color:var(--gold-lt);margin-bottom:4px}
.award p{max-width:36em}
.cell--img{grid-column:span 5;min-height:300px;padding:0}
.cell--appts{grid-column:span 4}
.cell--creds{grid-column:span 4}
.cell--supply{grid-column:span 4;background:var(--mist)}
.cell ul:not(.tags){display:grid;gap:10px}
.cell ul:not(.tags) li{line-height:1.4;font-size:clamp(15.5px,1.02vw,17px)}
.tags{display:flex;flex-wrap:wrap;gap:8px}
.tags li{background:#fff;color:var(--navy);padding:8px 13px;font-size:14.5px;line-height:1.25}

/* Reviews */
.rev{position:relative;overflow:hidden;padding-block:clamp(70px,9vw,140px) clamp(90px,14vw,210px);background:#b8cbe2}
.rev__bg{position:absolute;inset:0;overflow:hidden}
.rev__bg img{position:absolute;left:0;top:-13%;width:100%;height:126%;max-width:none;object-fit:cover;object-position:70% 60%}
.rev__in{position:relative;z-index:1}
.letters{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(16px,2vw,30px);margin-top:clamp(30px,4vw,60px);align-items:start}
.letter{position:relative;grid-column:span 4;background:#fff;padding:clamp(22px,2.4vw,38px);box-shadow:0 26px 60px rgba(7,31,68,.24);transform-origin:50% 0}
.letter p{font:400 clamp(21px,1.75vw,29px)/1.26 var(--head);color:var(--navy)}
.letter::before{content:"";display:block;width:100%;height:9px;margin-bottom:18px;background:linear-gradient(var(--gold),var(--gold)) 0 50%/100% 1.5px no-repeat}
.letter::after{content:"";position:absolute;left:clamp(22px,2.4vw,38px);top:calc(clamp(22px,2.4vw,38px) - 2px);width:12px;height:12px;background:var(--gold);transform:rotate(45deg);box-shadow:0 0 0 5px #fff}
.letter footer{margin-top:18px;line-height:1.34;font-size:15px;color:var(--slate)}
.letter footer strong{display:block;color:var(--navy);font-weight:600;font-size:16px}
.letter footer span{display:block}
.letter--b{margin-top:clamp(0px,6vw,96px)}
.letter--c{margin-top:clamp(0px,2.4vw,36px)}

/* Visit */
.visit__g{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,4.4vw,80px);align-items:center}
.visit__l .h2{margin-bottom:14px}
.visit__l>p{color:var(--slate);max-width:32em}
.visit address{margin-top:20px;display:grid;gap:8px}
.visit address a{font:400 clamp(21px,1.75vw,28px)/1.24 var(--head);color:var(--navy);text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:4px;text-decoration-thickness:1.5px;transition:color .3s}
.visit address a.visit__alt{font:400 15.5px/1.4 var(--body);color:var(--slate);text-underline-offset:3px;text-decoration-thickness:1px}
@media (hover:hover){.visit address a:hover{color:var(--gold-dk)}}
.hours{margin-top:26px;width:100%;max-width:27em;border-collapse:collapse}
.hours caption{text-align:left;font:400 clamp(21px,1.6vw,25px)/1.2 var(--head);color:var(--navy);padding-bottom:10px}
.hours th,.hours td{padding:6px 0;font-weight:400;text-align:left}
.hours td{text-align:right;font-variant-numeric:tabular-nums}
.hours tr.is-today th,.hours tr.is-today td{color:var(--gold-dk);font-weight:600}
.hours tr.is-today th::before{content:"";display:inline-block;width:7px;height:7px;margin-right:9px;vertical-align:.12em;background:var(--gold);transform:rotate(45deg)}
.map{position:relative;padding:clamp(10px,1.2vw,18px)}
.map__folder{position:absolute;inset:0;background:var(--navy);transform:rotate(-1.1deg)}
.map__sheet{position:relative;background:#fff;padding:clamp(8px,.8vw,12px);box-shadow:0 18px 44px rgba(7,31,68,.2);height:clamp(340px,44vw,620px)}
.map iframe{display:block;width:100%;height:100%;border:0;pointer-events:none}
.map.is-active iframe{pointer-events:auto}

/* FAQ */
.faq{background:var(--paper);overflow:hidden}
.faq__g{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,4.4vw,80px);align-items:start}
.faq__stone{margin-top:clamp(24px,3vw,44px);width:min(66%,300px)}
.acc__i{border-bottom:1px solid var(--line)}
.acc__i:first-child{border-top:1px solid var(--line)}
.acc h3{margin:0;font:inherit}
.acc button{display:grid;grid-template-columns:minmax(0,1fr) 22px;gap:18px;align-items:center;width:100%;text-align:left;padding:clamp(16px,1.5vw,24px) 0;font:400 clamp(21px,1.75vw,29px)/1.2 var(--head);color:var(--navy);transition:color .3s}
@media (hover:hover){.acc button:hover{color:var(--gold-dk)}}
.acc button i{position:relative;width:18px;height:18px}
.acc button i::before,.acc button i::after{content:"";position:absolute;left:0;right:0;top:8px;height:1.6px;background:var(--gold);transition:transform .5s var(--ease)}
.acc button i::after{transform:rotate(90deg)}
.acc button[aria-expanded="true"] i::before{transform:rotate(135deg)}
.acc button[aria-expanded="true"] i::after{transform:rotate(225deg)}
.acc__p{display:grid;grid-template-rows:0fr;transition:grid-template-rows .55s var(--ease),visibility 0s linear .55s;visibility:hidden}
.acc__p>div{overflow:hidden;min-height:0}
.acc__p p{padding:0 40px clamp(18px,1.6vw,26px) 0;color:var(--slate);max-width:44em}
.acc__i.is-open .acc__p{grid-template-rows:1fr;visibility:visible;transition:grid-template-rows .55s var(--ease),visibility 0s}

/* Footers */
.ft h3{font:400 clamp(23px,1.7vw,29px)/1.2 var(--head);color:var(--gold);margin-bottom:12px}
.ft__cols{display:grid;gap:clamp(24px,3vw,48px)}
.ft__cols>div>a,.ft__cols>div>p{display:block;font-size:clamp(15px,.98vw,16px);line-height:1.5;text-decoration:none}
.ft__cols>div>a{padding-block:3px;transition:color .3s}
.ft__cols>div>p{margin-top:8px}
.ft__base{font-size:14.5px;padding-block:20px 22px}
.ft__base a{color:var(--gold-dk);font-weight:600;text-decoration:none}

.ft--a{background:var(--navy);color:#dbe3ef;padding-top:var(--sec)}
.ft--a h3{color:var(--gold-lt)}
.ft--a .h2{color:#fff;max-width:17em}
.ft--a .hl{color:var(--gold-lt)}
.ft__cta{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px clamp(24px,4vw,70px);padding-bottom:clamp(38px,5vw,76px)}
.ft--a .ft__cols{grid-template-columns:minmax(0,.8fr) repeat(4,minmax(0,1fr));padding-top:clamp(30px,3.4vw,52px);border-top:1px solid rgba(210,168,98,.45)}
.ft--a .ft__cols a:not(.ft__logo):hover{color:var(--gold-lt)}
.ft__logo{display:block;width:clamp(100px,8.6vw,132px)}
.ft__logo .logo{width:100%;height:auto;aspect-ratio:830/535}
.ft--a .ft__base{margin-top:clamp(30px,3.6vw,56px);color:#b7c3d6}
.ft--a .ft__base a{color:var(--gold-lt)}

.ft--b{background:#fff;padding-top:var(--sec);overflow:hidden}
.ft__top{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:24px;padding-bottom:clamp(34px,4vw,60px)}
.ft__top .h2{max-width:17em}
.ft--b .ft__cols{grid-template-columns:repeat(4,minmax(0,1fr))}
.ft--b .ft__cols a:hover{color:var(--gold-dk)}
.ft--b__mark{display:block;width:100%;height:auto;aspect-ratio:830/300;margin-top:clamp(30px,4vw,60px);--logo-a:#071f44}

.ft--c{position:relative;overflow:hidden;padding-top:clamp(80px,12vw,180px)}
.ft--c__bg{position:absolute;inset:0;background:#c4d4e8}
.ft--c__bg img{position:absolute;left:0;top:-12%;width:100%;height:124%;max-width:none;object-fit:cover;object-position:62% 60%}
.ft--c__in{position:relative;z-index:1}
.card{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,8fr);background:#fff;box-shadow:0 34px 80px rgba(7,31,68,.32)}
.card__l{background:var(--navy);color:#dbe3ef;padding:clamp(22px,2.6vw,42px);display:flex;flex-direction:column;justify-content:space-between;gap:30px}
.card__l .logo{width:clamp(100px,10vw,150px);height:auto;aspect-ratio:830/535;--logo-a:#fff;--logo-b:#cfd8e6;--logo-c:#d2a862}
.card__l strong{font:400 21px/1.2 var(--head);color:#fff}
.card__r{padding:clamp(22px,3vw,52px)}
.card__r .ft__cols{grid-template-columns:repeat(3,minmax(0,1fr));margin:clamp(20px,2.4vw,36px) 0}
.card__r a:not(.btn):hover{color:var(--gold-dk)}
.ft--c .ft__base{color:#fff;margin-top:clamp(20px,3vw,40px)}
.ft--c .ft__base a{color:#f0cf95}

/* 404 */
.nf{min-height:100svh;display:grid;align-content:center;gap:18px;position:relative;padding:100px var(--page-gut) 40px;overflow:hidden;background:#c4d4e8}
.nf>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% 56%}
.nf>*:not(img){position:relative;max-width:32em}

/* Phones and small tablets */
@media (max-width:899px){
  :root{--page-gut:20px}
  .hdr__nav,.hdr__end .btn{display:none}
  .hdr__tog{display:block}
  .hdr__in{grid-template-columns:1fr auto;padding-block:12px}
  .hdr__logo,.hdr__logo .logo{width:80px;height:52px}
  .hero__h{font-size:clamp(40px,8.4vw,82px)}
  .hero__p{max-width:none}
  .hero__copy{padding-top:clamp(84px,13svh,120px)}
  .hero--a .btn{min-height:50px;padding-inline:13px 15px;font-size:14.5px;gap:9px}
  .hero--a .hero__cta{gap:8px}
  .hero__plate img{object-position:50% 56%}
  .hero__cairn{right:12px;bottom:-2svh;height:min(38svh,92vw)}
  .hero--b .hero__copy{bottom:44px}
  .hero--b__scrim{background:linear-gradient(0deg,rgba(7,31,68,.82),rgba(7,31,68,.3) 60%,rgba(7,31,68,.42))}
  .hero--c__top{grid-template-columns:minmax(0,1fr)}
  .hero--c__cairn{height:124%;right:10px}
  .about__copy,.about__fig{grid-column:1/-1}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .page__img{aspect-ratio:16/11}
  .proc__g{grid-template-columns:minmax(0,1fr);gap:0}
  .proc__txt{order:-1;display:contents}
  .proc__txt>.h2{order:-3}
  .proc__intro{order:-2;margin-bottom:20px}
  .proc__stage{order:-1;top:0;z-index:2;background:var(--white);padding-block:10px 12px;margin-inline:calc(var(--page-gut)*-1)}
  .proc__stack{height:min(34svh,330px)}
  .steps{margin-top:18px}
  .steps li{min-height:min(36svh,300px);grid-template-columns:48px minmax(0,1fr)}
  .work__track{display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:0;padding-left:0}
  .work__intro{width:auto;padding-inline:var(--page-gut);padding-bottom:50px}
  .work__intro .h2{font-size:clamp(36px,6svh,52px)}
  .work__intro p{font-size:16px;margin-top:8px}
  .work__row{padding-inline:var(--page-gut);padding-block:6px 14px;width:max-content}
  .job{width:min(78vw,340px);height:clamp(340px,calc(100svh - 250px),540px)}
  .job:nth-child(even){margin-top:0}
  .job__b{padding:14px 16px}
  .job h3{font-size:21px}
  .job__m{font-size:13px}
  .job p:last-child{font-size:14.5px}
  .bento{grid-template-columns:minmax(0,1fr)}
  .bento>.cell{grid-column:1/-1}
  .cell--img{min-height:0;aspect-ratio:16/10}
  .letters{grid-template-columns:minmax(0,1fr)}
  .letter{grid-column:1/-1;margin-top:0}
  .rev{padding-bottom:clamp(60px,14vw,110px)}
  .visit__g,.faq__g{grid-template-columns:minmax(0,1fr)}
  .map__sheet{height:clamp(320px,90vw,520px)}
  .faq__stone{display:none}
  .acc__p p{padding-right:0}
  .ft__cta{flex-direction:column;align-items:flex-start}
  .ft--a .ft__cols,.ft--b .ft__cols,.card__r .ft__cols{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ft__logo{grid-column:1/-1}
  .card{grid-template-columns:minmax(0,1fr)}
  /* Header option 2 on phones: a dock along the bottom */
  html[data-header="2"] .hdr__in{margin:10px 10px 0;width:auto;background:#fff;border-radius:999px;padding:5px 5px 5px 18px;box-shadow:0 12px 34px rgba(7,31,68,.18)}
  html[data-header="2"] .hdr__logo,html[data-header="2"] .hdr__logo .logo{width:58px;height:38px}
  html[data-header="2"] .hdr__end{gap:4px}
  html[data-header="2"] .hdr__end .btn{display:inline-flex;border-radius:999px;min-height:42px;font-size:13.5px;padding:0 14px 0 12px;gap:8px}
  html[data-header="2"] .hdr.is-fixed{background:transparent}
  html[data-header="2"] .hdr.is-fixed .hdr__in{padding:5px 5px 5px 18px}
  html[data-header="2"] .hdr.is-fixed .hdr__logo,html[data-header="2"] .hdr.is-fixed .hdr__logo .logo{width:58px;height:38px}
  html[data-hero="2"][data-header="2"] .hdr:not(.is-fixed) .logo{--logo-a:#071f44;--logo-b:#464a53;--logo-c:#a97c39}
  html[data-hero="2"][data-header="2"] .hdr:not(.is-fixed) .hdr__tog span{background:var(--navy)}
  html[data-hero="2"][data-header="2"] .hdr:not(.is-fixed) .btn{background:var(--navy);color:#fff}
  body.menu-open[class] .hdr__in{background:transparent;box-shadow:none}
  /* Header option 3 on phones: logo hanging on the tab, centred */
  html[data-header="3"] .hdr__in{grid-template-columns:1fr auto 1fr;padding-top:0;align-items:start}
  html[data-header="3"] .hdr__logo{grid-column:2;width:100px;height:auto;padding:14px 14px 16px;background:var(--navy);clip-path:polygon(0 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,12px 100%,0 calc(100% - 12px))}
  html[data-header="3"] .hdr__logo .logo{width:72px;height:46px;--logo-a:#fff;--logo-b:#cfd8e6;--logo-c:#d2a862}
  html[data-header="3"] .hdr__end{grid-column:3;padding-top:8px}
}
@media (max-width:599px){.ft__cols>div:has(a[href^="mailto"]){grid-column:1/-1}.card__r .ft__cols{grid-template-columns:minmax(0,1fr)}}
@media (min-width:900px) and (max-width:1180px){.hdr__nav a{font-size:16.5px}.hdr__nav{gap:16px}.hdr__end .btn{padding-inline:12px 14px}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;animation:none!important}
  .work{height:auto;overflow-x:auto;touch-action:auto}
  .work__track{width:max-content;padding-block:48px}
  .slide{transform:none}
}

@media (max-width:599px){.hero__h{font-size:min(12vw,50px)}.hero--c .hero__h{font-size:min(12vw,50px)}}

.rev .hl{color:#6f4c14}
