:root{
  --ink:#28241F; --ink-soft:#5A534B; --cream:#FBF8F3; --sand:#EFE7D9; --stone:#DED2BE;
  --sage:#6E8A6C; --sage-d:#3E5A3C; --sage-l:#A9C0A4; --forest:#243524; --line:rgba(40,36,31,.14);
  --serif:"DM Serif Display",Georgia,serif; --sans:"Manrope",system-ui,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--sans);color:var(--ink);font-size:17px;line-height:1.7;background:var(--cream);-webkit-font-smoothing:antialiased}
::selection{background:var(--sage-l);color:var(--ink)}
a{color:inherit}
img{max-width:100%}
.grain{position:fixed;inset:0;z-index:90;pointer-events:none;opacity:.05;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* type */
.eyebrow{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--sage-d);font-weight:700;display:block;margin-bottom:20px}
h1,h2,h3,h4{font-family:var(--serif);font-weight:400;letter-spacing:0;color:var(--ink)}
h2{font-size:clamp(34px,5.2vw,68px);line-height:1.02;max-width:13em}
em{font-style:italic;color:var(--sage-d)}
.lede{font-size:clamp(17px,1.4vw,21px);color:var(--ink-soft);max-width:34em;margin-top:22px;font-family:var(--sans)}
.center{text-align:center;margin-left:auto;margin-right:auto}
section{padding:clamp(80px,11vw,150px) clamp(22px,7vw,120px)}

/* reveal */
.reveal{opacity:0;transform:translateY(34px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform 1s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}

/* nav */
nav{position:fixed;top:0;left:0;right:0;z-index:80;display:flex;align-items:center;justify-content:space-between;gap:18px;
  padding:20px clamp(20px,5vw,60px);transition:background .4s,box-shadow .4s,padding .4s}
nav .brand img{height:30px;display:block;transition:filter .4s}
nav.over .brand img{filter:brightness(0) invert(1)}
nav.over .links a{color:rgba(255,255,255,.88)}
nav.over .tel{color:#fff!important}
nav.solid{background:rgba(251,248,243,.92);backdrop-filter:blur(12px);box-shadow:0 1px 0 var(--line);padding-top:13px;padding-bottom:13px}
nav .links{display:flex;align-items:center;gap:28px}
nav .links a{font-size:14px;color:var(--ink-soft);text-decoration:none;font-weight:600;transition:color .3s}
nav .links a:hover{color:var(--ink)}
nav .tel{font-weight:700;color:var(--ink)!important}
.pill{display:inline-flex;align-items:center;gap:8px;background:var(--sage-d);color:#fff;font-weight:700;font-size:14px;
  padding:13px 26px;border-radius:40px;text-decoration:none;transition:background .35s,transform .35s,box-shadow .35s;box-shadow:0 10px 26px rgba(62,90,60,.3)}
.pill:hover{background:var(--forest);transform:translateY(-2px)}
nav.over .pill{background:rgba(255,255,255,.16);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.4);box-shadow:none}
nav.over .pill:hover{background:rgba(255,255,255,.28)}
.pill.big{padding:17px 38px;font-size:16px;margin-top:6px}
@media(max-width:900px){nav .links a:not(.pill),nav .tel{display:none}}

/* HERO parallax */
.hero{position:relative;min-height:104vh;display:flex;flex-direction:column;justify-content:center;
  padding:150px clamp(22px,7vw,120px) 130px;overflow:hidden;color:#fff;background:#23331F}
.hero-layers{position:absolute;inset:0;z-index:0;will-change:transform}
.pl{position:absolute;left:0;width:100%;display:block}
.pl-photo{top:0;height:120%;object-fit:cover;opacity:.5}
.pl-1,.pl-2,.pl-3{bottom:0;height:auto}
.pl-1 path{fill:#33472F;opacity:.85}
.pl-2 path{fill:#2A3B26;opacity:.9}
.pl-3 path{fill:#1E2C1B}
.hero::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(25,35,22,.5) 0%,rgba(25,35,22,.28) 38%,rgba(25,35,22,.55) 100%)}
.hero-inner{position:relative;z-index:3;max-width:1180px;margin:0 auto;width:100%}
.kicker{font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:rgba(255,255,255,.8);font-weight:700;margin-bottom:26px}
.hero h1{font-family:var(--serif);font-size:clamp(46px,8vw,108px);line-height:.98;max-width:12em;font-weight:400;color:#fff}
.hero h1 em{color:#CFE0CC}
.hero .sub{font-size:clamp(18px,1.6vw,22px);color:rgba(255,255,255,.86);max-width:30em;margin-top:30px;font-family:var(--sans)}
.hero .cta-row{margin-top:42px;display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.hero .pill{background:#fff;color:var(--sage-d)}
.hero .pill:hover{background:#EDE7D9}
.hero .ghost{font-family:var(--serif);font-style:italic;font-size:22px;color:#fff;text-decoration:none;opacity:.92}

/* marquee */
.marquee{overflow:hidden;background:var(--forest);color:#CFE0CC}
.marquee .track{display:flex;white-space:nowrap;animation:slide 30s linear infinite;width:max-content}
.marquee span{font-family:var(--serif);font-style:italic;font-size:clamp(18px,2vw,26px);padding:16px 34px;position:relative;opacity:.9}
.marquee span::after{content:"◆";position:absolute;right:-6px;font-size:8px;top:50%;transform:translateY(-50%);color:var(--sage-l)}
@keyframes slide{to{transform:translateX(-50%)}}

/* WHY */
.why h2{max-width:11em}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;margin-top:64px}
.stats .s{border-top:3px solid var(--sage-d);padding-top:20px}
.stats .n{font-family:var(--serif);font-weight:400;font-size:clamp(48px,6vw,86px);line-height:.9;color:var(--ink);display:block}
.stats .s p{font-size:14px;color:var(--ink-soft);margin-top:14px;max-width:14em}
@media(max-width:820px){.stats{grid-template-columns:1fr 1fr;gap:28px}}

/* STRATA */
.strata{padding-bottom:0;background:var(--cream)}
.strata-head{max-width:42em;margin-bottom:clamp(40px,6vw,70px)}
.strata-head h2{max-width:12em}
.strata-stack{position:relative}
.stratum{padding:0 clamp(22px,7vw,120px);opacity:0;transform:translateX(var(--from,-60px));transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.stratum.in{opacity:1;transform:none}
.stratum:nth-child(even){--from:60px}
.st-inner{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:minmax(120px,.4fr) 1fr;gap:clamp(20px,4vw,60px);align-items:center;padding:clamp(30px,4vw,52px) 0}
.st-no{font-family:var(--serif);font-size:clamp(60px,9vw,140px);line-height:.8;opacity:.9}
.st-body h3{font-size:clamp(26px,3.4vw,40px);margin-bottom:12px}
.st-body p{font-size:clamp(15px,1.3vw,17px);max-width:42em}
/* rock layers: light at top, deepening toward bedrock */
.st1{background:#F4EEE2}
.st2{background:#EDE5D5}
.st3{background:#E2DAC6;color:#28241F}
.st4{background:#CFD7C4}
.st5{background:#A9BEA2;color:#1f2c1c}
.st6{background:#71916C;color:#F2F5EF}
.st6 .st-body p{color:rgba(255,255,255,.85)}.st6 em{color:#EAF0E6}
.st7{background:#46603F;color:#F2F5EF}
.st7 .st-body p{color:rgba(255,255,255,.85)}.st7 em{color:#EAF0E6}
.st5 .st-no,.st6 .st-no,.st7 .st-no{color:rgba(255,255,255,.5)}
.st1 .st-no,.st2 .st-no,.st3 .st-no,.st4 .st-no{color:var(--sage-d);opacity:.45}
.bedrock-base{background:var(--forest);color:#9DB39A;text-align:center;padding:30px 20px;font-family:var(--serif);font-size:18px;letter-spacing:.3em;text-transform:uppercase}
.bedrock-base span{position:relative}
@media(max-width:640px){.st-inner{grid-template-columns:1fr;gap:6px;padding:30px 0}.st-no{font-size:clamp(50px,16vw,80px)}}

/* LASTS */
.lasts{background:var(--sand)}
.lasts-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,6vw,80px);align-items:center;max-width:1180px;margin:0 auto}
.lasts h2{max-width:11em}
.resolve{font-family:var(--serif);font-style:italic;font-size:clamp(22px,2.6vw,32px);color:var(--ink);margin-top:28px;line-height:1.25}
.lastviz{background:var(--cream);border:1px solid var(--line);border-radius:14px;padding:26px}
.lastviz svg{width:100%;height:auto;display:block}
#crevealRect{transition:width 2.2s cubic-bezier(.22,.7,.2,1)}
.cax line{stroke:rgba(40,36,31,.2)}.cax text{font-family:var(--sans);font-size:12px;fill:var(--ink-soft)}
.clab{font-family:var(--sans);font-size:13px;font-weight:700;fill:var(--ink)}
.clab.dark{fill:#fff}
@media(max-width:820px){.lasts-grid{grid-template-columns:1fr;gap:36px}}

/* METHOD / BUCKETS */
.method-head{max-width:42em}
.method-head h2{max-width:12em}
.buckets{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:54px}
.bk{border-radius:16px;padding:38px;position:relative;overflow:hidden;color:var(--ink)}
.bk:nth-child(1){background:linear-gradient(165deg,#EFE7D9,#E2DAC6)}
.bk:nth-child(2){background:linear-gradient(165deg,#BFD0BA,#9DB39A)}
.bk:nth-child(3){background:linear-gradient(165deg,#5C7A57,#3E5A3C);color:#F2F5EF}
.bk:nth-child(3) .bk-when{color:rgba(255,255,255,.75)}
.bk:nth-child(3) p{color:rgba(255,255,255,.85)}
.bk:nth-child(3) .bk-risk{color:#fff;border-color:rgba(255,255,255,.4)}
.bk-when{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);font-weight:700}
.bk h4{font-size:30px;font-weight:400;margin:8px 0 12px}
.bk p{font-size:15px;color:var(--ink-soft)}
.bk-risk{margin-top:20px;display:inline-block;font-size:12px;font-weight:700;padding:7px 16px;border:1px solid var(--line);border-radius:30px}
@media(max-width:820px){.buckets{grid-template-columns:1fr}}

/* DIFFERENCE */
.diff{background:var(--forest);color:#EAF0E6}
.diff .eyebrow{color:#A9C0A4}
.diff h2{color:#fff}
.diff .lede{color:rgba(255,255,255,.82)}
.diff-head{max-width:42em}
.diff-cols{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:54px}
.dc{border-radius:16px;padding:38px}
.dc.typical{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14)}
.dc.shope{background:#fff;color:var(--ink)}
.dc h4{font-size:26px;font-weight:400;margin-bottom:20px}
.dc.typical h4{color:#fff}
.dc ul{list-style:none}
.dc li{padding:13px 0 13px 30px;position:relative;font-size:16px}
.dc.typical li{color:rgba(255,255,255,.78);border-bottom:1px solid rgba(255,255,255,.1)}
.dc.shope li{border-bottom:1px solid var(--line)}
.dc li:last-child{border-bottom:none}
.dc.typical li::before{content:"—";position:absolute;left:0;color:rgba(255,255,255,.4)}
.dc.shope li::before{content:"✓";position:absolute;left:0;color:var(--sage-d);font-weight:800}
@media(max-width:760px){.diff-cols{grid-template-columns:1fr}}

/* SERVICES */
.services-head{max-width:42em}
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:56px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.svc{background:var(--cream);padding:38px 32px;transition:background .35s}
.svc:hover{background:var(--sand)}
.svc-ico{width:60px;height:60px;margin-bottom:16px;display:block;object-fit:contain;mix-blend-mode:multiply}
.svc h4{font-size:24px;font-weight:400;margin-bottom:10px}
.svc p{font-size:15px;color:var(--ink-soft)}
@media(max-width:820px){.svc-grid{grid-template-columns:1fr 1fr}}
@media(max-width:540px){.svc-grid{grid-template-columns:1fr}}

/* MOMENTS */
.moments{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(36px,6vw,80px);align-items:center}
.moments-pic{border-radius:14px;overflow:hidden}
.moments-pic img{width:100%;display:block;aspect-ratio:4/5;object-fit:cover}
@media(max-width:820px){.moments{grid-template-columns:1fr;gap:28px}.moments-pic{order:-1}}

/* TEAM */
.team{background:var(--sand)}
.team-head{max-width:42em}
.teamscroll{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;padding:10px 2px 16px;margin-top:50px;cursor:grab}
.teamscroll::-webkit-scrollbar{display:none}
.teamscroll.drag{cursor:grabbing;scroll-behavior:auto}
.tcard{flex:0 0 min(560px,86vw);scroll-snap-align:center;display:grid;grid-template-columns:190px 1fr;gap:26px;background:var(--cream);border:1px solid var(--line);border-radius:14px;padding:22px;align-items:center}
.tphoto{position:relative;aspect-ratio:4/5;border-radius:10px;overflow:hidden;display:grid;place-items:center;background:radial-gradient(circle at 36% 28%,var(--sage-l),var(--forest))}
.tphoto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tphoto .mono{font-family:var(--serif);font-size:50px;color:#fff;user-select:none}
.tmeta .tname{font-family:var(--serif);font-size:27px;line-height:1.05}
.tmeta .ttitle{font-size:12px;color:var(--sage-d);font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin-top:8px}
.tmeta p{font-size:15px;color:var(--ink-soft);margin-top:14px}
@media(max-width:560px){.tcard{grid-template-columns:1fr;gap:16px}.tphoto{aspect-ratio:16/10}}
.team-ctrl{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:14px}
.team-ctrl button{width:48px;height:48px;border-radius:50%;border:1px solid var(--line);background:var(--cream);cursor:pointer;font-size:18px;color:var(--ink);transition:.25s;display:grid;place-items:center}
.team-ctrl button:hover{background:var(--sage-d);color:#fff;border-color:var(--sage-d)}
.team-hint{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft)}

/* HORIZON */
.horizon{position:relative;height:60vh;min-height:360px;overflow:hidden;display:flex;align-items:center;justify-content:center;text-align:center;padding:0}
.horizon img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.horizon::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(36,53,36,.34),rgba(36,53,36,.5))}
.horizon h3{position:relative;z-index:2;font-family:var(--serif);font-weight:400;font-size:clamp(30px,4.6vw,60px);color:#fff;line-height:1.08;max-width:16em;padding:0 24px;text-shadow:0 2px 30px rgba(0,0,0,.45)}

/* FAQ */
.faq-head{max-width:42em}
.faqlist{max-width:54em;margin-top:48px}
details{border-bottom:1px solid var(--line)}
summary{cursor:pointer;list-style:none;padding:24px 44px 24px 0;font-family:var(--serif);font-size:clamp(20px,2.1vw,26px);position:relative;color:var(--ink)}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:6px;top:22px;font-size:28px;color:var(--sage-d);transition:transform .3s;font-family:var(--sans);font-weight:300}
details[open] summary::after{transform:rotate(45deg)}
details p{padding:0 0 26px;font-size:16px;color:var(--ink-soft);max-width:46em}

/* CONTACT */
.contact{position:relative;overflow:hidden;text-align:center;color:#fff;padding-top:clamp(90px,12vw,170px);padding-bottom:clamp(90px,12vw,170px)}
.contact-bg{position:absolute;inset:0;z-index:0}
.contact-bg img{width:100%;height:100%;object-fit:cover}
.contact-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(36,53,36,.76),rgba(20,30,19,.86))}
.contact-inner{position:relative;z-index:2;max-width:32em;margin:0 auto}
.contact .eyebrow{color:#A9C0A4}
.contact h2{color:#fff;margin:0 auto 18px;max-width:13em}
.contact .lede{color:rgba(255,255,255,.86)}
.contact .pill{background:#fff;color:var(--sage-d)}
.contact .pill:hover{background:#EDE7D9}
.cdetails{margin-top:42px;display:flex;gap:34px;justify-content:center;flex-wrap:wrap;font-size:15px;color:rgba(255,255,255,.9)}
.cdetails a{text-decoration:none;font-weight:700;color:#fff}
.cdetails .lbl{display:block;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#A9C0A4;margin-bottom:5px;font-weight:700}

/* FOOTER */
footer{background:var(--ink);color:#A9B6A6;padding:66px clamp(22px,6vw,120px) 110px;font-size:14px;line-height:1.7}
.ftop{display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap;border-bottom:1px solid rgba(255,255,255,.1);padding-bottom:36px}
.fbrand{font-family:var(--serif);font-size:27px;color:#fff;max-width:12em;font-weight:400}
.fcols{display:flex;gap:54px;flex-wrap:wrap}
.fcols h5{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#7d8d79;margin-bottom:14px}
.fcols a{display:block;color:#A9B6A6;text-decoration:none;margin-bottom:9px;font-size:14px}
.fcols a:hover{color:#fff}
.disc{margin-top:30px;font-size:12px;color:#6f7e6b;max-width:62em;line-height:1.65}
.copy{margin-top:18px;font-size:12px;color:#6f7e6b}

.concept{position:fixed;bottom:0;left:0;z-index:84;background:rgba(40,36,31,.85);color:#E9EFE4;font-size:11px;letter-spacing:.03em;padding:6px 14px;border-top-right-radius:8px}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal,.stratum{opacity:1;transform:none;transition:none}
  .marquee .track{animation:none}
  #crevealRect{transition:none;width:420px}
  .hero-layers{transform:none!important}
}
