
.d{font-size:17.5px}
.wrap{max-width:1320px;margin:0 auto;padding:0 56px}
/* nav */
.nav{position:fixed;inset:0 0 auto 0;z-index:40;color:var(--paper);transition:background-color .35s var(--ease),color .35s var(--ease),box-shadow .35s}
.nav-in{max-width:1440px;margin:0 auto;height:84px;padding:0 40px;display:flex;align-items:center;gap:40px}
.nav .wm{font-size:27px}
.nav nav{margin-left:auto}
.nav ul{list-style:none;display:flex;gap:30px;margin:0;padding:0}
.nav nav a{text-decoration:none;font-weight:500;font-size:15.5px;opacity:.88;padding:8px 0;position:relative}
.nav nav a:hover{opacity:1}
.nav nav a::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:1.5px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.nav nav a:hover::after{transform:scaleX(1)}
.nav .nav-pay{opacity:.75;font-size:14.5px}
.btn-s{min-height:44px;padding:0 18px;font-size:15px}
.btn-l{min-height:58px;padding:0 28px;font-size:17px}
.nav.solid{background:rgba(244,240,232,.97);color:var(--ink);box-shadow:0 1px 0 rgba(26,26,25,.08)}
/* hero */
.hero{position:relative;height:100vh;height:100svh;min-height:640px;max-height:1100px;color:var(--paper);overflow:hidden;background:#141412}
.hero-media{position:absolute;inset:0}
.hero-media picture,.hero-img,.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% 50%}
.hero-img{transform-origin:66% 60%}
.js .hero:not(.ready) .hero-img{transform:scale(1.075);filter:brightness(.42) saturate(.55) contrast(1.05)}
.hero.ready .hero-img{animation:push 2.6s var(--ease) both,lightson 2.1s .2s var(--ease) both}
.hero-video{opacity:0;transition:opacity .8s var(--ease)}
.hero-video.on{opacity:1}
@keyframes push{from{transform:scale(1.075)}to{transform:scale(1)}}
@keyframes lightson{from{filter:brightness(.42) saturate(.55) contrast(1.05)}to{filter:none}}
.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(14,14,13,.78) 0%,rgba(14,14,13,.55) 30%,rgba(14,14,13,.12) 52%,rgba(14,14,13,0) 64%),linear-gradient(180deg,rgba(14,14,13,.45) 0%,rgba(14,14,13,0) 18%,rgba(14,14,13,0) 70%,rgba(14,14,13,.35) 100%)}
.hero-in{position:relative;z-index:2;height:100%;max-width:1440px;margin:0 auto;padding:0 40px 9vh 72px;display:flex;flex-direction:column;justify-content:flex-end}
.eyebrow{font-weight:500;font-size:16px;margin:0 0 26px;opacity:.9}
.hero-h{font-size:clamp(84px,11.2vw,184px);line-height:.86;letter-spacing:-.045em;display:flex;flex-direction:column}
.hero-h .l1{animation:rise .9s .1s var(--ease) both}
.hero-h .l2{animation:rise .9s .75s var(--ease) both}
.hero-sub{font-size:19.5px;max-width:30ch;margin:30px 0 34px;opacity:.92}
.hero-acts{display:flex;gap:14px}
.on-dark{color:var(--paper)}
@keyframes rise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.hero-scroll{position:absolute;right:44px;bottom:44px;z-index:2;width:44px;height:64px;border-radius:999px;box-shadow:inset 0 0 0 1.5px rgba(244,240,232,.5)}
.hero-scroll span{position:absolute;left:50%;top:14px;width:2px;height:12px;margin-left:-1px;background:var(--paper);border-radius:2px;animation:sc 2s var(--ease-io) infinite}
@keyframes sc{0%{transform:translateY(0);opacity:0}30%{opacity:1}100%{transform:translateY(22px);opacity:0}}
/* services */
.services{padding:150px 0 140px}
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:56px}
.sec-head h2{font-size:clamp(56px,6.4vw,104px);max-width:9ch}
.sec-head p{max-width:30ch;margin:0;color:var(--muted);font-size:18px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.card{position:relative;background:#fff;border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.card:hover{transform:translateY(-4px);box-shadow:0 22px 50px -24px rgba(26,26,25,.35)}
.card-wide{grid-column:span 2;flex-direction:row}
.card-hit{position:absolute;inset:0;z-index:1;background:none;border:0;cursor:pointer;border-radius:inherit}
.card-img{aspect-ratio:16/10;overflow:hidden;background:var(--paper-2)}
.card-wide .card-img{aspect-ratio:auto;flex:1.35;min-height:340px}
.card-img img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.card:hover .card-img img{transform:scale(1.04)}
.card-body{padding:26px 26px 26px;display:flex;flex-direction:column;flex:1}
.card-wide .card-body{flex:1;padding:36px;justify-content:flex-end}
.card h3{font-family:var(--display);font-weight:800;font-size:30px;letter-spacing:-.025em;line-height:1;margin:0 0 10px}
.card-wide h3{font-size:42px}
.card p{margin:0 0 22px;color:var(--muted);font-size:16.5px;max-width:36ch}
.card-acts{margin-top:auto;display:flex;align-items:center;gap:18px;position:relative;z-index:2}
.card-tag{align-self:flex-start;font-weight:500;font-size:13.5px;color:var(--red);margin-bottom:14px;display:inline-flex;align-items:center;gap:8px}
.card-tag::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--red)}
.link{background:none;border:0;padding:6px 0;cursor:pointer;font-weight:500;font-size:15px;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;color:var(--ink)}
.link:hover{color:var(--red)}
.card-unsure{background:var(--ink);color:var(--paper)}
.card-unsure .card-body{justify-content:center;padding:44px 48px}
.card-unsure h3{font-size:48px}
.card-unsure p{color:rgba(244,240,232,.72);font-size:18px}
.card-unsure .link{color:var(--paper)}
.card-unsure:hover{transform:none;box-shadow:none}
/* sequence */
.seq{height:420vh;position:relative;background:#141412}
.seq-stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;color:var(--paper)}
.seq-layer{position:absolute;inset:0;opacity:0;will-change:opacity,transform}
.seq-layer[data-i="0"]{opacity:1}
.seq-layer picture,.seq-img{width:100%;height:100%;object-fit:cover}
.seq-shade{position:absolute;inset:0;background:linear-gradient(0deg,rgba(14,14,13,.72) 0%,rgba(14,14,13,.2) 38%,rgba(14,14,13,0) 55%),linear-gradient(90deg,rgba(14,14,13,.45),rgba(14,14,13,0) 55%)}
.seq-text{position:absolute;left:72px;bottom:12vh;right:72px}
.seq-cap{position:absolute;left:0;bottom:0;margin:0;font-family:var(--display);font-weight:800;font-size:clamp(40px,4.4vw,68px);letter-spacing:-.03em;line-height:.95;max-width:12ch;opacity:0;transform:translateY(24px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.seq-cap.on{opacity:1;transform:none}
.seq-h{font-size:clamp(72px,9vw,150px);letter-spacing:-.045em;line-height:.86;opacity:0;transform:translateY(30px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.seq-h.on{opacity:1;transform:none}
.seq-progress{position:absolute;right:44px;top:50%;width:2px;height:120px;margin-top:-60px;background:rgba(244,240,232,.22);border-radius:2px;overflow:hidden}
.seq-progress span{display:block;width:100%;height:100%;background:var(--paper);transform-origin:top;transform:scaleY(0)}
/* about */
.about{padding:150px 0 120px}
.facts{list-style:none;margin:0 0 110px;padding:0;display:flex;flex-direction:column;gap:6px}
.facts li{font-family:var(--display);font-weight:800;font-size:clamp(46px,5.6vw,88px);letter-spacing:-.035em;line-height:1;color:#8F887B}
.facts strong{color:var(--ink);font-weight:800}
.who{display:grid;grid-template-columns:repeat(3,1fr);gap:56px;border-top:1.5px solid var(--ink);padding-top:36px}
.who h3{font-family:var(--display);font-weight:800;font-size:28px;letter-spacing:-.02em;margin:0 0 10px}
.who p{margin:0;color:var(--muted);max-width:30ch}
/* contact */
.contact{background:var(--ink);color:var(--paper);padding:140px 0}
.ct-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:96px;align-items:start}
.ct-side h2{font-size:clamp(60px,6.2vw,100px);letter-spacing:-.04em;line-height:.88}
.ct-side>p{font-size:19px;color:rgba(244,240,232,.75);margin:30px 0 40px;max-width:28ch}
.ct-alt{display:flex;flex-direction:column;gap:8px}
.ct-alt a{text-decoration:none;color:rgba(244,240,232,.75)}
.ct-alt a:hover{color:var(--paper)}
.ct-phone{font-family:var(--display);font-weight:800;font-size:40px;letter-spacing:-.02em;color:var(--paper)!important}
.ct-form{background:var(--paper);color:var(--ink);border-radius:14px;padding:44px}
/* form shared in desktop */
.req fieldset{border:0;margin:0 0 28px;padding:0}
.req legend{margin-bottom:14px;padding:0}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px 18px;margin-bottom:18px}
.req-foot{display:flex;align-items:center;gap:22px;margin-top:26px}
.req-note{margin:0;color:var(--muted);font-size:14.5px;max-width:34ch}
.form-err{margin-top:16px}
.req-done{padding:40px 8px;text-align:left}
.req-done:focus{outline:none}
.done-mark{width:64px;color:var(--red);margin-bottom:26px}
.req-done h3{font-family:var(--display);font-weight:800;font-size:56px;letter-spacing:-.035em;line-height:.95;margin:0 0 16px}
.req-done p{font-size:18px;max-width:40ch;margin:0 0 12px}
.done-alt{color:var(--muted)}
.btn[aria-busy=true]{pointer-events:none;opacity:.85}
.btn[aria-busy=true] .lbl::after{content:"";display:inline-block;width:14px;height:14px;margin-left:10px;border:2px solid rgba(255,255,255,.5);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite;vertical-align:-2px}
@keyframes spin{to{transform:rotate(360deg)}}
/* film */
.film{padding:130px 0 140px;background:var(--paper)}
.film-in{max-width:1320px;margin:0 auto;padding:0 56px}
.film-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:36px;gap:40px}
.film-head h2{font-size:clamp(56px,6vw,96px)}
.film-head p{margin:0;max-width:34ch;color:var(--muted)}
.film-frame{position:relative;aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;background:#111}
.film-poster,.film-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.film-play{position:absolute;right:36px;bottom:36px;display:inline-flex;align-items:center;gap:14px;height:64px;padding:0 26px 0 20px;border-radius:999px;border:0;background:var(--paper);color:var(--ink);font-weight:500;font-size:17px;cursor:pointer;transition:transform .3s var(--ease)}
.film-play:hover{transform:scale(1.03)}
.film-play svg{width:26px;height:26px;color:var(--red)}
.film-dur{color:var(--muted);font-size:15px}
/* footer */
.foot{background:#121211;color:rgba(244,240,232,.72);padding:90px 0 36px}
.foot-in{max-width:1320px;margin:0 auto;padding:0 56px;display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:48px}
.foot .wm{font-size:30px;color:var(--paper)}
.foot-brand p{max-width:30ch;margin:22px 0 0}
.foot h2{font-size:14.5px;font-weight:500;color:var(--paper);margin:0 0 16px}
.foot ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.foot a{text-decoration:none}
.foot a:hover{color:var(--paper)}
.foot p{margin:0 0 12px;line-height:1.75}
.foot-small{font-size:14.5px;opacity:.7}
.foot-base{max-width:1320px;margin:70px auto 0;padding:26px 56px 0;border-top:1px solid rgba(244,240,232,.12);display:flex;justify-content:space-between;font-size:14px;opacity:.7}
/* dialog */
.sheet{border:0;padding:0;margin:auto;width:min(980px,calc(100vw - 64px));max-height:calc(100vh - 64px);border-radius:14px;background:var(--paper);color:var(--ink);overflow:auto}
.sheet::backdrop{background:rgba(14,14,13,.6)}
.sheet[open]{animation:pop .45s var(--ease)}
.sheet[open]::backdrop{animation:fade .35s var(--ease)}
@keyframes pop{from{opacity:0;transform:translateY(24px) scale(.98)}to{opacity:1;transform:none}}
@keyframes fade{from{opacity:0}to{opacity:1}}
.sheet-in{display:grid;grid-template-columns:1fr 1fr;position:relative}
.sheet-img{min-height:100%;background:var(--paper-2)}
.sheet-img picture,.sheet-img img{width:100%;height:100%;object-fit:cover}
.sheet-body{padding:52px 48px 40px}
.sheet-body h2{font-family:var(--display);font-weight:800;font-size:46px;letter-spacing:-.03em;line-height:.95;margin:0 0 20px}
.sheet-lede{font-size:18px;margin:0 0 26px}
.sheet dl{margin:0 0 30px}
.sheet dt{font-weight:600;font-size:14.5px;margin-bottom:4px}
.sheet dd{margin:0 0 18px;color:var(--muted)}
.sheet-acts{display:flex;gap:10px;flex-wrap:wrap}
.sheet-more{display:inline-block;margin-top:22px;font-size:14.5px;color:var(--muted)}
.sheet-x{position:absolute;top:16px;right:16px;z-index:2;width:44px;height:44px;border-radius:50%;border:0;background:rgba(244,240,232,.92);cursor:pointer;display:grid;place-items:center}
.sheet-x svg{width:20px;height:20px}
@media (max-width:1180px){.wrap,.film-in,.foot-in{padding:0 40px}.cards{grid-template-columns:repeat(2,1fr)}.card-wide{grid-column:span 2}.ct-grid{grid-template-columns:1fr;gap:56px}.nav ul{gap:22px}.hero-in{padding-left:48px}.who{gap:32px}}
@media (max-width:980px){.nav nav{display:none}.nav .nav-call{margin-left:auto}.card-wide{flex-direction:column}.card-wide .card-img{aspect-ratio:16/10;min-height:0;flex:none}.foot-in{grid-template-columns:1fr 1fr}.who{grid-template-columns:1fr}.sheet-in{grid-template-columns:1fr}.sheet-img{aspect-ratio:16/9}}

