@font-face{font-family:"Archivo";src:url(fonts/archivo.woff2) format("woff2");font-weight:100 900;font-stretch:62% 125%;font-style:normal;font-display:swap}
@font-face{font-family:"Archivo";src:url(fonts/archivo-italic.woff2) format("woff2");font-weight:100 900;font-stretch:62% 125%;font-style:italic;font-display:swap}

/* Layout: quiet gallery. Full-bleed photography, expanded headlines on warm white,
   beige bands for rhythm, black for the closing call to action. One family (Archivo),
   two widths: expanded for display, normal for reading. */
:root{
  --white:#FBF9F5;   /* warm white page */
  --paper:#FFFFFF;
  --beige:#ECE4D7;   /* section band */
  --sand:#C7B497;    /* deep beige accent */
  --black:#181715;
  --stone:#6E675D;   /* muted text on light */
  --mist:#B9B2A7;    /* muted text on black */
  --line:rgba(24,23,21,.14);
  --wa:#25D366;
  --font:"Archivo", "Helvetica Neue", Arial, sans-serif;
  --gl:max(20px, env(safe-area-inset-left, 0px));
  --gr:max(20px, env(safe-area-inset-right, 0px));
  --max:1360px;
  --ease:cubic-bezier(.7,0,.2,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{margin:0;background:var(--white);color:var(--black);font-family:var(--font);font-size:17px;line-height:1.6;font-stretch:100%;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:95;background:var(--black)}
main{overflow-x:clip}
img,svg,canvas,video{max-width:100%;display:block}
a{color:inherit}
::selection{background:var(--sand);color:var(--black)}
:focus-visible{outline:2px solid currentColor;outline-offset:4px;border-radius:2px}
.wrap{max-width:var(--max);margin-inline:auto;padding-left:var(--gl);padding-right:var(--gr)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* type */
h1,h2,h3{margin:0;font-weight:500;font-stretch:125%;letter-spacing:-.025em;line-height:1.02;text-wrap:balance}
.d1{font-size:clamp(2.6rem,6.4vw,6.2rem)}
.d2{font-size:clamp(2rem,4.3vw,4rem)}
.d3{font-size:clamp(1.35rem,2vw,1.75rem);letter-spacing:-.015em;line-height:1.12}
p{margin:0}
.lede{font-size:clamp(1.05rem,1.3vw,1.22rem);line-height:1.6;max-width:36rem;color:var(--stone)}
.small{font-size:.9rem;color:var(--stone)}
.tag{display:inline-flex;align-items:center;gap:10px;font-size:.88rem;font-weight:500;color:var(--stone)}
.tag::before{content:"";width:28px;height:1px;background:currentColor}

/* buttons */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.6em;height:54px;padding:0 1.6em;border-radius:999px;font:500 .98rem/1 var(--font);font-stretch:110%;text-decoration:none;cursor:pointer;border:0;white-space:nowrap;overflow:hidden;isolation:isolate;transition:color .45s var(--ease)}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;transform:translateY(101%);transition:transform .55s var(--ease)}
.btn:hover::before,.btn:focus-visible::before{transform:none}
.btn svg{width:1.15em;height:1.15em;flex:none}
.btn-dark{background:var(--black);color:var(--white)}
.btn-dark::before{background:var(--sand)}
.btn-dark:hover,.btn-dark:focus-visible{color:var(--black)}
.btn-light{background:var(--white);color:var(--black)}
.btn-light::before{background:var(--sand)}
.btn-ghost{color:inherit;box-shadow:inset 0 0 0 1px currentColor}
.btn-ghost::before{background:currentColor}
.btn-ghost:hover,.btn-ghost:focus-visible{color:var(--black)}
.on-dark .btn-ghost:hover,.on-dark .btn-ghost:focus-visible{color:var(--black)}
.on-dark .btn-ghost::before{background:var(--white)}
.btn-wa{background:var(--wa);color:#0B2E17}
.btn-wa::before{background:var(--white)}
.link{display:inline-flex;align-items:center;gap:12px;font-weight:500;font-stretch:110%;text-decoration:none;padding-bottom:6px;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat;transition:background-size .5s var(--ease)}
.link:hover{background-size:30% 1px}

/* header */
.top{position:fixed;left:0;right:0;top:env(safe-area-inset-top,0px);z-index:80;color:var(--black);transition:background .5s,color .5s,transform .5s var(--ease),box-shadow .5s}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;height:84px}
.top.solid{background:color-mix(in srgb,var(--white) 90%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line)}
.top.over:not(.solid){color:var(--white)}
.top.hide{transform:translateY(-110%)}
.logo{display:block;line-height:0;color:inherit;text-decoration:none}
.logo svg{height:22px;width:auto}
.nav{display:flex;align-items:center;gap:34px}
.nav a.n{position:relative;font-size:.95rem;font-weight:500;font-stretch:110%;text-decoration:none;padding:6px 0}
.nav a.n::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .5s var(--ease)}
.nav a.n:hover::after,.nav a.n[aria-current="page"]::after{transform:scaleX(1);transform-origin:left}
.nav .btn{height:46px;padding:0 1.3em;font-size:.92rem}
.top.over:not(.solid) .nav .btn-dark{background:var(--white);color:var(--black)}
.menu-btn{display:none;background:none;border:0;color:inherit;width:46px;height:46px;padding:0;cursor:pointer;position:relative}
.menu-btn span{position:absolute;left:11px;right:11px;height:1.5px;background:currentColor;transition:transform .4s var(--ease),top .4s var(--ease)}
.menu-btn span:first-child{top:18px}.menu-btn span:last-child{top:27px}
.menu-open .menu-btn span:first-child{top:22px;transform:rotate(45deg)}
.menu-open .menu-btn span:last-child{top:22px;transform:rotate(-45deg)}
.sheet{position:fixed;inset:0;z-index:70;background:var(--beige);color:var(--black);display:flex;flex-direction:column;justify-content:flex-end;padding:120px var(--gr) calc(110px + env(safe-area-inset-bottom,0px)) var(--gl);clip-path:inset(0 0 100% 0);transition:clip-path .7s var(--ease);visibility:hidden}
.menu-open .sheet{clip-path:inset(0);visibility:visible}
.sheet a{display:block;font-size:clamp(2.4rem,11vw,4rem);font-weight:500;font-stretch:125%;letter-spacing:-.03em;line-height:1.15;text-decoration:none}
.sheet p{margin-top:28px;color:var(--stone)}
.menu-open .top,.menu-open .top.over:not(.solid){color:var(--black)}

/* hero (home) */
.hero{position:relative;height:max(620px,100svh);color:var(--white);overflow:hidden;background:var(--black)}
.hero-media{position:absolute;inset:0}
.hero-media img,.hero-media canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-media canvas{opacity:0;transition:opacity .6s}
.hero-media canvas.ready{opacity:1}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(24,23,21,.45) 0%,rgba(24,23,21,0) 22%,rgba(24,23,21,0) 38%,rgba(24,23,21,.72) 100%),linear-gradient(90deg,rgba(24,23,21,.42) 0%,rgba(24,23,21,0) 62%);pointer-events:none}
.hero-in{position:absolute;left:0;right:0;bottom:0;z-index:2;padding-bottom:clamp(30px,5vw,64px);pointer-events:none}
.hero-in a{pointer-events:auto}
.hero h1{max-width:13ch}
.hero-row{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:28px 40px;margin-top:clamp(24px,3vw,40px)}
.hero-row p{max-width:30rem;color:rgba(255,255,255,.86);font-size:1.06rem}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.creds{display:flex;flex-wrap:wrap;gap:0;list-style:none;margin:0;padding:0;font-size:.88rem;font-weight:500;font-stretch:110%;color:rgba(255,255,255,.9)}
.creds li{padding:0 18px;border-left:1px solid rgba(255,255,255,.35)}
.creds li:first-child{padding-left:0;border-left:0}
@media (min-width:701px){.creds{margin-right:72px}}
[id]{scroll-margin-top:110px}
.wet{position:absolute;right:var(--gr);top:108px;padding:9px 14px 9px 12px;border-radius:99px;background:rgba(24,23,21,.38);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:2;font-size:.85rem;color:rgba(255,255,255,.8);display:flex;align-items:center;gap:10px;pointer-events:none;opacity:0;transition:opacity .8s}
.wet.on{opacity:1}
.wet i{width:8px;height:8px;border-radius:50%;background:var(--sand);box-shadow:0 0 0 6px rgba(199,180,151,.25)}

/* page heads (inner pages) */
.phead{padding-block:calc(84px + clamp(60px,9vw,130px)) clamp(40px,6vw,80px)}
.phead .wrap{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:30px 60px;align-items:end}
.phead .lede{margin-top:0}

/* sections */
.sec{padding-block:clamp(84px,11vw,160px)}
.sec.tight{padding-block:clamp(60px,8vw,110px)}
.band{background:var(--beige)}
.dark{background:var(--black);color:var(--white)}
.dark .lede,.dark .small{color:var(--mist)}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px clamp(40px,7vw,120px)}
.stack{display:grid;gap:26px}

/* intro facts */
.facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));list-style:none;margin:clamp(56px,7vw,96px) 0 0;padding:0;border-top:1px solid var(--line)}
.facts li{padding:26px 24px 0 0}
.facts li+li{padding-left:24px;border-left:1px solid var(--line)}
.facts b{display:block;font-size:clamp(1.9rem,3.4vw,3rem);font-weight:500;font-stretch:125%;letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums}
.facts span{display:block;margin-top:12px;font-size:.92rem;color:var(--stone);max-width:20ch}

/* photo pair */
.pair{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:20px;margin-top:clamp(64px,8vw,110px);align-items:start}
.pair figure:first-child{grid-column:1/8}
.pair figure:last-child{grid-column:9/13;margin-top:clamp(80px,14vw,220px)}
figure{margin:0}
.ph{position:relative;overflow:hidden;background:var(--beige)}
.ph img{width:100%;height:100%;object-fit:cover}
.ph.r43{aspect-ratio:4/3}.ph.r34{aspect-ratio:3/4}.ph.r45{aspect-ratio:4/5}.ph.r169{aspect-ratio:16/9}.ph.r32{aspect-ratio:3/2}
figcaption{display:flex;justify-content:space-between;gap:16px;margin-top:14px;font-size:.88rem;color:var(--stone)}
figcaption b{font-weight:500;color:var(--black);font-stretch:110%}
.dark figcaption b{color:var(--white)}

/* brush reveal */
.reveal{--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 100' preserveAspectRatio='none'%3E%3Cpath d='M0 0H200L204 4L201 7L209 10L203 14L212 18L205 22L214 26L206 31L211 35L204 39L216 43L207 48L213 52L205 57L215 61L208 66L212 70L203 74L214 79L206 83L211 88L204 92L209 96L202 100H0Z'/%3E%3C/svg%3E")}
.js .reveal.pre{-webkit-mask:var(--m) 100% 0/330% 100% no-repeat;mask:var(--m) 100% 0/330% 100% no-repeat}
.js .reveal.go{-webkit-mask:var(--m) 0 0/330% 100% no-repeat;mask:var(--m) 0 0/330% 100% no-repeat;transition:-webkit-mask-position 1.5s var(--ease),mask-position 1.5s var(--ease)}
.js .reveal.pre img{transform:scale(1.14)}
.js .reveal.go img{transform:none;transition:transform 2s var(--ease-out)}
.js .rise.pre{opacity:0;transform:translateY(36px)}
.js .rise.go{opacity:1;transform:none;transition:opacity 1.1s var(--ease-out),transform 1.1s var(--ease-out)}

/* services list with hover image */
.svc-list{list-style:none;margin:clamp(40px,5vw,64px) 0 0;padding:0;border-top:1px solid var(--line)}
.svc-list a{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) 46px;gap:20px 40px;align-items:center;padding:30px 0;border-bottom:1px solid var(--line);text-decoration:none;transition:padding .6s var(--ease)}
.svc-list h3{font-size:clamp(1.6rem,3.2vw,2.8rem);transition:transform .6s var(--ease)}
.svc-list p{color:var(--stone);max-width:30rem}
.svc-list .go-ic{width:46px;height:46px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--line);display:grid;place-items:center;transition:background .4s,color .4s}
.svc-list .go-ic svg{width:16px;height:16px}
.svc-list a:hover h3{transform:translateX(14px)}
.svc-list a:hover .go-ic{background:var(--black);color:var(--white)}
.svc-list{position:relative;z-index:2}
.floater{position:fixed;left:0;top:0;z-index:1;width:clamp(240px,22vw,340px);aspect-ratio:4/5;pointer-events:none;overflow:hidden;opacity:0;transform:translate(-50%,-50%) scale(.85);transition:opacity .35s,transform .5s var(--ease-out)}
.floater.on{opacity:1}
.floater img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .35s}
.floater img.on{opacity:1}

/* grow image */
.grow{position:relative;height:100svh;overflow:hidden;display:grid;place-items:center}
.grow .ph{position:absolute;inset:0;margin:auto;width:100%;height:100%}
.grow .cap{position:absolute;left:0;right:0;bottom:0;z-index:2;color:var(--white);padding-bottom:clamp(28px,4vw,52px)}
.grow .cap .wrap{padding-right:calc(var(--gr) + 76px);display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px}
.grow::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 55%,rgba(24,23,21,.55));pointer-events:none;z-index:1}

/* thumbs row */
.thumbs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:clamp(40px,5vw,64px)}
.thumbs a{text-decoration:none}
.thumbs .ph img{transition:transform 1.4s var(--ease-out)}
.thumbs a:hover .ph img{transform:scale(1.05)}

/* audiences */
.who{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin-top:clamp(40px,5vw,64px);list-style:none;padding:0}
.who li{padding:28px 28px 0 0;border-top:1px solid var(--line)}
.who li+li{padding-left:28px;border-left:1px solid var(--line)}
.who h3{font-size:1.2rem;letter-spacing:-.01em;line-height:1.2;margin-bottom:12px}
.who p{color:var(--stone);font-size:.96rem}

/* cta band */
.cta{background:var(--black);color:var(--white);padding-block:clamp(90px,11vw,160px);position:relative;overflow:hidden}
.cta .wrap{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:40px 80px;align-items:end}
.cta .lede{color:var(--mist);margin-top:24px}
.cta-actions{display:grid;gap:12px;justify-items:start}
.cta-actions .phone{font-size:clamp(1.6rem,2.4vw,2.1rem);font-weight:500;font-stretch:125%;letter-spacing:-.02em;text-decoration:none;margin-top:10px;font-variant-numeric:tabular-nums}
.cta .mark-bg{position:absolute;right:-6vw;top:50%;width:min(46vw,620px);transform:translateY(-50%) rotate(0deg);opacity:.08;pointer-events:none}

/* services page */
.svc-block{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:30px 20px;align-items:center}
.svc-block+.svc-block{margin-top:clamp(90px,11vw,170px)}
.svc-block .ph{grid-column:1/8}
.svc-block .txt{grid-column:9/13}
.svc-block.flip .ph{grid-column:6/13;grid-row:1}
.svc-block.flip .txt{grid-column:1/5;grid-row:1}
.svc-block .txt{display:grid;gap:20px}
.svc-block ul,.svc-more ul{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:0;border-top:1px solid var(--line)}
.svc-block li,.svc-more li{padding:12px 0;border-bottom:1px solid var(--line);font-size:.96rem}
.svc-more{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:clamp(40px,5vw,64px)}
.svc-more article{background:var(--white);padding:clamp(24px,2.6vw,36px);display:grid;gap:14px;align-content:start}
.svc-more h3{font-size:1.4rem;letter-spacing:-.015em;line-height:1.15}
.svc-more p{color:var(--stone);font-size:.96rem}
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;list-style:none;margin:clamp(40px,5vw,64px) 0 0;padding:0;counter-reset:s}
.steps li{counter-increment:s;padding:0 28px 0 0;display:grid;gap:14px;align-content:start}
.steps li+li{padding-left:28px;border-left:1px solid var(--line)}
.steps li::before{content:"0" counter(s);font-size:clamp(2.4rem,4vw,3.6rem);font-weight:400;font-stretch:125%;letter-spacing:-.04em;line-height:1;color:var(--sand)}
.steps h3{font-size:1.25rem;letter-spacing:-.01em;line-height:1.2}
.steps p{color:var(--stone);font-size:.96rem}
.brands{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:20px 40px;padding-block:40px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.brands strong{font-size:clamp(1.3rem,2.4vw,2rem);font-weight:500;font-stretch:125%;letter-spacing:-.02em}

/* projects page */
.gallery{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(40px,5vw,72px) 20px;align-items:start}
.gallery figure{cursor:zoom-in}
.gallery button{all:unset;display:block;cursor:zoom-in;width:100%}
.gallery button:focus-visible{outline:2px solid var(--black);outline-offset:6px}
.gallery .ph img{transition:transform 1.4s var(--ease-out)}
.gallery figure:hover .ph img{transform:scale(1.04)}
.g1{grid-column:1/9}.g2{grid-column:9/13;margin-top:18%}
.g3{grid-column:2/6}.g4{grid-column:7/13;margin-top:10%}
.g5{grid-column:1/13}
.g6{grid-column:1/6}.g7{grid-column:7/12;margin-top:16%}
.g8{grid-column:1/8}.g9{grid-column:9/13;margin-top:24%}
.lb{position:fixed;inset:0;z-index:100;background:rgba(24,23,21,.96);color:var(--white);display:grid;grid-template-rows:auto 1fr auto;opacity:0;visibility:hidden;transition:opacity .45s,visibility .45s}
.lb.on{opacity:1;visibility:visible}
.lb-top,.lb-bot{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:calc(18px + env(safe-area-inset-top,0px)) var(--gr) 18px var(--gl)}
.lb-bot{padding-top:18px;padding-bottom:calc(18px + env(safe-area-inset-bottom,0px))}
.lb-img{position:relative;display:grid;place-items:center;padding:0 var(--gr) 0 var(--gl);min-height:0}
.lb-img img{max-width:100%;max-height:100%;object-fit:contain}
.lb button{background:none;border:0;color:inherit;cursor:pointer;width:52px;height:52px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(255,255,255,.3);display:grid;place-items:center}
.lb button:hover{background:rgba(255,255,255,.1)}
.lb button svg{width:18px;height:18px}
.lb .count{font-variant-numeric:tabular-nums;color:var(--mist);font-size:.9rem}
.lb .nav2{display:flex;gap:10px}

/* contact page */
.contact{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:50px clamp(40px,7vw,110px);align-items:start}
.contact .stack{position:sticky;top:120px}
.c-lines{display:grid;gap:0;margin-top:10px;border-top:1px solid var(--line)}
.c-lines a,.c-lines div{display:flex;justify-content:space-between;gap:20px;padding:18px 0;border-bottom:1px solid var(--line);text-decoration:none}
.c-lines span{color:var(--stone)}
.c-lines b{font-weight:500;font-stretch:110%;text-align:right}
form{background:var(--paper);padding:clamp(24px,3.6vw,52px);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 24px;box-shadow:0 30px 60px -40px rgba(24,23,21,.35)}
form h2{grid-column:1/-1}
.f{display:grid;gap:6px;min-width:0}
.f.full{grid-column:1/-1}
label{font-size:.82rem;font-weight:500;color:var(--stone)}
label small{font-weight:400}
input,select,textarea{font:inherit;font-size:1.05rem;color:var(--black);background:transparent;border:0;border-bottom:1px solid rgba(24,23,21,.28);border-radius:0;padding:.55em 0;width:100%;min-width:0;transition:border-color .3s}
select{appearance:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23181715' stroke-width='1.4'/%3E%3C/svg%3E") no-repeat right 2px center/12px 8px;padding-right:22px}
textarea{min-height:110px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--black)}
.form-foot{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.form-note{grid-column:1/-1;font-size:.86rem;color:var(--stone)}
.status{grid-column:1/-1;font-weight:500;font-size:.96rem;padding:.9em 1.1em;background:var(--beige);border-left:3px solid var(--black)}
.status.ok{border-color:#2E7D4F}.status.err{border-color:#B03A2E}
.hp{display:none}
.faq{margin-top:clamp(40px,5vw,64px);border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:26px 0;font-size:clamp(1.1rem,1.6vw,1.35rem);font-weight:500;font-stretch:115%;letter-spacing:-.01em}
.faq summary::-webkit-details-marker{display:none}
.faq summary i{flex:none;width:20px;height:20px;position:relative}
.faq summary i::before,.faq summary i::after{content:"";position:absolute;left:0;right:0;top:9.5px;height:1px;background:currentColor;transition:transform .4s var(--ease)}
.faq summary i::after{transform:rotate(90deg)}
.faq details[open] summary i::after{transform:rotate(0)}
.faq details p{padding:0 0 26px;color:var(--stone);max-width:44rem}

/* footer */
footer{background:var(--black);color:var(--mist);font-size:.95rem}
footer .wrap{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:40px;padding-block:clamp(60px,7vw,96px) 40px}
footer .logo{color:var(--white)}
footer .logo svg{height:20px}
footer h4{margin:0 0 14px;font-size:.82rem;font-weight:500;color:var(--white);font-stretch:110%}
footer a{color:var(--white);text-decoration:none}
footer a:hover{text-decoration:underline;text-underline-offset:4px}
footer p+p{margin-top:6px}
.legal{border-top:1px solid rgba(255,255,255,.12);padding-block:22px calc(22px + env(safe-area-inset-bottom,0px))}
.legal .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;padding-block:0;grid-template-columns:none}

/* floating WhatsApp */
.wa-float{position:fixed;right:calc(22px + env(safe-area-inset-right,0px));bottom:calc(22px + env(safe-area-inset-bottom,0px));z-index:75;width:60px;height:60px;border-radius:50%;background:var(--wa);color:#fff;display:grid;place-items:center;box-shadow:0 14px 30px -10px rgba(0,0,0,.45);transition:transform .4s var(--ease-out)}
.wa-float:hover{transform:scale(1.08)}
.wa-float svg{width:30px;height:30px}
.callbar{display:none}

/* page transition */
.veil{position:fixed;inset:0;z-index:120;background:var(--beige);pointer-events:none;visibility:hidden}
.pt-in .veil{visibility:visible}
.veil svg{position:absolute;left:50%;top:50%;width:64px;transform:translate(-50%,-50%)}

/* responsive */
@media (max-width:1020px){
  .nav a.n,.nav .btn{display:none}
  .menu-btn{display:block}
  .phead .wrap,.split,.cta .wrap,.contact{grid-template-columns:minmax(0,1fr)}
  .contact .stack{position:static}
  .facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .facts li:nth-child(3){padding-left:0;border-left:0}
  .who,.steps{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:40px}
  .who li:nth-child(3),.steps li:nth-child(3){padding-left:0;border-left:0}
  .svc-more{grid-template-columns:repeat(2,minmax(0,1fr))}
  .svc-list a{grid-template-columns:minmax(0,1fr) 46px}
  .svc-list p{grid-column:1;grid-row:2}
  .svc-list .go-ic{grid-row:1/3;grid-column:2}
  .svc-block .ph,.svc-block.flip .ph{grid-column:1/-1;grid-row:auto}
  .svc-block .txt,.svc-block.flip .txt{grid-column:1/-1;grid-row:auto}
  footer .wrap{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:700px){
  body{font-size:16px;padding-bottom:calc(74px + env(safe-area-inset-bottom,0px))}
  .top .wrap{height:72px}
  .logo svg{height:18px}
  .wet{display:none}
  .hero-in{padding-bottom:calc(92px + env(safe-area-inset-bottom,0px))}
  .hero::after{background:linear-gradient(180deg,rgba(24,23,21,.45) 0%,rgba(24,23,21,0) 20%,rgba(24,23,21,0) 32%,rgba(24,23,21,.78) 100%)}
  .creds li{padding:0 12px}
  .facts{grid-template-columns:minmax(0,1fr)}
  .facts li,.facts li+li{padding:22px 0;border-left:0;border-bottom:1px solid var(--line)}
  .pair figure:first-child,.pair figure:last-child{grid-column:1/-1;margin-top:0}
  .pair figure:last-child{width:72%;justify-self:end}
  .thumbs{grid-template-columns:minmax(0,1fr)}
  .who,.steps,.svc-more{grid-template-columns:minmax(0,1fr)}
  .who li,.who li+li,.steps li,.steps li+li{padding:24px 0 0;border-left:0}
  .steps li+li{border-top:1px solid var(--line)}
  .gallery figure{grid-column:1/-1!important;margin-top:0!important}
  form{grid-template-columns:minmax(0,1fr)}
  footer .wrap{grid-template-columns:minmax(0,1fr)}
  .wa-float{display:none}
  .callbar{display:grid;grid-template-columns:1fr 1fr;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:85;padding:10px var(--gr) calc(10px + env(safe-area-inset-bottom,0px)) var(--gl);background:var(--black)}
  .callbar a{display:flex;justify-content:center;align-items:center;gap:8px;height:52px;border-radius:999px;font-weight:500;font-stretch:110%;text-decoration:none;background:var(--white);color:var(--black)}
  .callbar a.wa{background:var(--wa);color:#0B2E17}
  .callbar svg{width:20px;height:20px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01s!important;animation:none!important}
}

/* line masks for headline intros */
.ln{display:block;overflow:hidden;padding-bottom:.1em;margin-bottom:-.1em}
.ln>span{display:block}
.capline{display:flex;justify-content:space-between;gap:16px;margin-top:14px;font-size:.88rem;color:var(--stone)}
.capline b{font-weight:500;color:var(--black);font-stretch:110%}
