[hidden]{display:none!important}
/* Layout: grid suíço de 12 colunas, rótulo mono à esquerda (1–4), conteúdo à direita (5–12); home numa tela só; dock de vidro fixo embaixo */
:root{
  --bg:#000; --fg:#fff; --muted:rgba(255,255,255,.56); --faint:rgba(255,255,255,.18);
  --gold:#C9A24A; --panel:#0c0c0c;
  --sans:'Geist',ui-sans-serif,system-ui,-apple-system,'Helvetica Neue',Arial,sans-serif;
  --mono:'Geist Mono',ui-monospace,'SFMono-Regular',Menlo,monospace;
  --serif:'Instrument Serif','Times New Roman',serif;
  --gut:max(16px,env(safe-area-inset-left,0px));
  --gutR:max(16px,env(safe-area-inset-right,0px));
  --ease:cubic-bezier(.22,.8,.2,1);
  color-scheme:dark;
}
html{background:var(--bg);overflow-x:clip}
body{overflow-x:clip}
body{background:var(--bg);color:var(--fg);font-family:var(--sans);font-size:14px;line-height:1.45;-webkit-font-smoothing:antialiased;padding-left:var(--gut);padding-right:var(--gutR)}
a{color:inherit;text-decoration:none}
a:hover{color:var(--gold)}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
:focus-visible{outline:1px solid var(--gold);outline-offset:3px}
img,video{max-width:100%;display:block}
.mono{font-family:var(--mono);font-size:11px;letter-spacing:.04em;text-transform:uppercase}
.muted{color:var(--muted)}
.it{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:0}
h1,h2,h3{text-wrap:balance;font-weight:300;margin:0}
p{margin:0}

/* grão */
#view{position:relative;z-index:1}
.grain{position:fixed;inset:-50%;width:200%;height:200%;pointer-events:none;z-index:0;background:url(/assets/grain.png);opacity:.5;animation:grain 1.2s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-4%)}60%{transform:translate(-4%,-1%)}80%{transform:translate(3%,3%)}100%{transform:translate(0,0)}}

/* grade */
.g12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:20px}

/* topo */
.top{position:relative;z-index:20;padding-block:22px;align-items:start}
.top .who{grid-column:1/span 4}
.top .mark{grid-column:5/span 4;justify-self:center;line-height:0}
.top .mark img{height:20px;width:auto}
.top .say{grid-column:9/span 4;justify-self:end;text-align:right}
.dock .lang-d{display:flex;align-items:center;gap:4px;padding:0 10px 0 6px;color:var(--muted);font-family:var(--mono);font-size:11px}
.dock .lang-d button{padding:10px 2px;color:var(--muted)} .dock .lang-d button[aria-pressed="true"]{color:var(--fg)}
.top nav{grid-column:7/span 3;display:flex;flex-direction:column;gap:1px}
.top .meta{grid-column:10/span 3;justify-self:end;text-align:right;display:flex;flex-direction:column;gap:1px}
.top nav a[aria-current="page"]{color:var(--gold)}
.lang button{color:var(--muted)} .lang button[aria-pressed="true"]{color:var(--fg)}
.clock{font-family:var(--mono);font-size:12px;font-variant-numeric:tabular-nums}

/* dock */
.dock{position:fixed;left:50%;bottom:calc(18px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:80;display:flex;align-items:center;gap:4px;padding:6px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);-webkit-backdrop-filter:blur(22px) saturate(160%);backdrop-filter:blur(22px) saturate(160%);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 18px 50px rgba(0,0,0,.55);max-width:calc(100vw - 32px)}
.dock .cur{display:flex;align-items:center;gap:10px;padding:10px 16px;white-space:nowrap}
.dock .dot{width:6px;height:6px;border-radius:50%;background:var(--gold);flex:none}
.dock .items{display:flex;align-items:center;gap:2px;max-width:0;opacity:0;overflow:hidden;transition:max-width .7s var(--ease),max-height .6s var(--ease),opacity .4s var(--ease)}
@media (hover:hover){.dock:hover .items{max-width:720px;opacity:1}}
.dock:focus-within .items,.dock.open .items{max-width:720px;opacity:1}
.dock .cur .chev{color:var(--muted);transition:transform .4s var(--ease)}
.dock:hover .cur .chev,.dock.open .cur .chev{transform:rotate(180deg)}
.dock .items a{padding:10px 14px;border-radius:999px;white-space:nowrap;transition:background .3s,color .3s}
.dock .items a:hover{background:rgba(255,255,255,.1);color:var(--fg)}
.dock .items a[aria-current="page"]{color:var(--gold)}
.dock .items a.cta{border:1px solid var(--gold);margin-left:6px}
.dock .items a.cta:hover{background:var(--gold);color:#000}

/* cursor */
.cursor{position:fixed;left:0;top:0;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:transparent;-webkit-backdrop-filter:invert(1) grayscale(1);backdrop-filter:invert(1) grayscale(1);pointer-events:none;z-index:100;display:flex;align-items:center;justify-content:center;transition:width .35s var(--ease),height .35s var(--ease),margin .35s var(--ease)}
.cursor span{font-family:var(--mono);font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#000;opacity:0;transition:opacity .2s}
.cursor.big{width:72px;height:72px;margin:-36px 0 0 -36px;background:var(--fg);-webkit-backdrop-filter:none;backdrop-filter:none}
@supports not ((backdrop-filter:invert(1)) or (-webkit-backdrop-filter:invert(1))){.cursor{background:#fff;mix-blend-mode:difference;filter:grayscale(1)}}
.cursor.big span{opacity:1}
.cursor.link{width:34px;height:34px;margin:-17px 0 0 -17px}
@media (pointer:fine){html.has-cursor,html.has-cursor a,html.has-cursor button{cursor:none}}
@media (pointer:coarse){.cursor{display:none}}

/* transição */
.curtain{position:fixed;inset:0;background:#000;z-index:85;pointer-events:none;opacity:0;transition:opacity .45s var(--ease)}
.curtain.on{opacity:1}

/* revelar */
html.anim .rv{opacity:0;transform:translateY(18px);transition:opacity 1s var(--ease),transform 1.1s var(--ease)}
html.anim .rv.in{opacity:1;transform:none}
html.anim .rv-img{clip-path:inset(100% 0 0 0);transition:clip-path 1.3s var(--ease)}
html.anim .rv-img.in{clip-path:inset(0 0 0 0)}
html.anim .rv-img img,html.anim .rv-img video{transform:scale(1.08);transition:transform 1.8s var(--ease)}
html.anim .rv-img.in img,html.anim .rv-img.in video{transform:none}

/* home */
.home{position:fixed;inset:0;overflow:hidden;padding-left:var(--gut);padding-right:var(--gutR)}
.home .slides{position:absolute;inset:0}
.home .slides img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.6s var(--ease),transform 7s linear;transform:scale(1.06)}
.home .slides img.on{opacity:.55;transform:scale(1)}
.home .veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.15) 40%,rgba(0,0,0,.7))}
.home .seal{position:absolute;left:50%;top:46%;width:min(340px,44vh,70vw);transform:translate(-50%,-50%);perspective:900px}
.sealcv{width:100%;height:auto;display:block;transition:transform .8s var(--ease)}
.srcv{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.home .foot{position:absolute;left:var(--gut);right:var(--gutR);bottom:calc(92px + env(safe-area-inset-bottom,0px));align-items:end;z-index:4}
.home .bio{grid-column:1/span 3;font-size:13px;font-weight:300;line-height:1.45;max-width:36ch;color:rgba(255,255,255,.85)}
.home .now{font-size:13px}
.home .now{grid-column:9/span 4;justify-self:end;text-align:right}
.home .now a{align-items:flex-end}
.home .now a{display:flex;flex-direction:column;gap:4px}
.home .mail{grid-column:10/span 3;justify-self:end}
.home .top{position:relative}

/* seções padrão (linguagem do About) */
.page{padding-block:0 160px}
.lead{padding-block:110px 90px}
.lead h1{grid-column:5/span 6;font-size:clamp(24px,2.6vw,34px);line-height:1.15;letter-spacing:-.02em}
.lead p{grid-column:5/span 5;margin-top:22px;max-width:52ch;font-size:16px;font-weight:300;color:rgba(255,255,255,.8)}
.sec{padding-block:0 110px}
.sec>.lbl{grid-column:1/span 4}
.sec>.body{grid-column:5/span 8;min-width:0}
.rule{border-top:1px solid var(--fg)}
.rows>*{border-bottom:1px solid var(--faint)}

/* works */
.wk-tools{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px 24px;padding-bottom:14px}
.chips{display:flex;flex-wrap:wrap;gap:4px 18px}
.chips button{min-height:32px;color:var(--muted)}
.chips button[aria-pressed="true"]{color:var(--fg);text-decoration:underline;text-underline-offset:5px}
.wk-head,.wk-row{display:grid;grid-template-columns:52px minmax(0,1.3fr) minmax(0,1fr) 64px;gap:16px;align-items:baseline}
.wk-head{padding-block:10px}
.wk-row{padding-block:15px;position:relative;transition:color .25s,padding .5s var(--ease)}
.wk-row .nm{font-size:18px}
.wk-row:hover{padding-left:10px;color:var(--gold)}
.wk-row .yr{text-align:right;font-variant-numeric:tabular-nums}
.wk-list{position:relative}
.peek{position:absolute;right:calc(100% + 28px);width:min(220px,26vw);aspect-ratio:4/5;overflow:hidden;pointer-events:none;opacity:0;transform:scale(.96);transition:opacity .35s var(--ease),transform .5s var(--ease),top .45s var(--ease);background:var(--panel)}
.peek.on{opacity:1;transform:none}
.peek img{width:100%;height:100%;object-fit:cover}
.peek .ph{position:absolute;inset:0;display:flex;align-items:flex-end;padding:12px}
.wk-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:44px 20px;padding-top:20px}
.card{display:flex;flex-direction:column;gap:10px}
.card .im{aspect-ratio:4/5;background:var(--panel);overflow:hidden;position:relative}
.card .im img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.card:hover .im img{transform:scale(1.04)}
.card .cap{display:flex;justify-content:space-between;gap:12px}
.ph-n{position:absolute;inset:auto auto 12px 12px}

/* universo */
.uni{position:fixed;inset:0;overflow:hidden;touch-action:none;cursor:grab;background:#000}
.uni.drag{cursor:grabbing}
.uni .field{position:absolute;left:50%;top:50%;width:0;height:0;will-change:transform}
.uni .tile{position:absolute;display:flex;flex-direction:column;gap:8px;transform:translate(-50%,-50%)}
.uni .tile .im{background:var(--panel);overflow:hidden;position:relative}
.uni .tile .im img{width:100%;height:100%;object-fit:cover;pointer-events:none;user-select:none;-webkit-user-drag:none}
.uni .tile .cap{display:flex;justify-content:space-between;gap:10px}
.uni .core{position:absolute;transform:translate(-50%,-50%);width:220px}
.uni .core video{width:100%;mix-blend-mode:screen;pointer-events:none}
.uni .hint{position:fixed;right:var(--gutR);bottom:calc(30px + env(safe-area-inset-bottom,0px));z-index:5;pointer-events:none;text-align:right}
.uni .top{position:fixed;left:0;right:0;top:0;padding-left:var(--gut);padding-right:var(--gutR);padding-bottom:40px;background:linear-gradient(#000 55%,rgba(0,0,0,0));z-index:4}
.uni .back{position:fixed;left:var(--gut);bottom:calc(26px + env(safe-area-inset-bottom,0px));z-index:5}

/* case */
.cs-head{padding-block:100px 40px;align-items:end}
.cs-head .n{grid-column:1/span 1}
.cs-head h1{grid-column:2/span 6;font-size:clamp(36px,4.4vw,60px);letter-spacing:-.03em;line-height:1}
.cs-head p{grid-column:9/span 4;font-size:16px;font-weight:300}
.cs-hero{margin-left:calc(-1 * var(--gut));margin-right:calc(-1 * var(--gutR))}
.cs-hero img,.cs-hero .phx{width:100%;aspect-ratio:16/9;object-fit:cover}
.phx{background:var(--panel);display:flex;align-items:flex-end;padding:16px}
.cs-body{padding-block:64px 0}
.ficha{grid-column:1/span 3;align-self:start;position:sticky;top:28px;display:grid;grid-template-columns:76px minmax(0,1fr);row-gap:10px;margin:0;font-size:13px}
.ficha dt{font-family:var(--mono);font-size:11px;text-transform:uppercase;color:var(--muted)} .ficha dd{margin:0}
.cs-flow{grid-column:5/span 8;display:flex;flex-direction:column;gap:20px;min-width:0}
.cs-flow .ctx{max-width:58ch;font-size:18px;font-weight:300;margin-bottom:56px}
.cs-flow .full img,.cs-flow .full video{width:100%;aspect-ratio:16/9;object-fit:cover}
.duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.duo>div{aspect-ratio:4/5}
.between{margin-block:60px;max-width:22ch;font-size:28px;line-height:1.2}
.next{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:20px;align-items:baseline;margin-top:150px;padding-block:20px 120px;border-top:1px solid var(--fg)}
.next .l{grid-column:1/span 4}.next .r{grid-column:5/span 8;font-size:clamp(28px,3vw,40px);font-weight:300;letter-spacing:-.03em;transition:padding .6s var(--ease)}
.next:hover .r{padding-left:14px}

/* about */
.ab-top{padding-block:110px 110px;align-items:start}
.ab-top .pic{grid-column:1/span 3}
.ab-top .pic img{width:100%;aspect-ratio:4/5;object-fit:cover;filter:grayscale(1)}
.ab-top .txt{grid-column:5/span 5;display:flex;flex-direction:column;gap:22px}
.ab-top h1{font-size:clamp(24px,2.6vw,34px);line-height:1.15;letter-spacing:-.02em}
.ab-top p{max-width:54ch;font-size:16px;font-weight:300;color:rgba(255,255,255,.8)}
.steps li{display:grid;grid-template-columns:52px minmax(0,1fr) minmax(0,1.4fr);gap:16px;align-items:baseline;padding-block:16px;position:relative}
.steps li .t{font-size:18px}
.steps li .d{color:rgba(255,255,255,.7)}
.steps li::after{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:100%;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform 1.4s var(--ease)}
.steps li.in::after{transform:scaleX(1)}
.steps li .k{font-family:var(--mono);font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.steps li.in .k{color:var(--gold);transition:color .6s .4s}
ol,ul{list-style:none;margin:0;padding:0}
.marq{overflow:hidden;border-block:1px solid var(--faint);padding-block:18px;margin-left:calc(-1 * var(--gut));margin-right:calc(-1 * var(--gutR))}
.marq .track{display:flex;gap:16px;width:max-content;will-change:transform;padding-right:16px}
.logo{flex:none;width:clamp(150px,16vw,220px);aspect-ratio:2/1;border:1px solid var(--faint);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:12px;transition:border-color .3s}
.logo:hover{border-color:var(--gold)}
.logo img{max-width:72%;max-height:56%;object-fit:contain;filter:grayscale(1) brightness(1.8)}
.logo .nm{font-size:clamp(15px,1.3vw,18px);text-align:center;line-height:1.2}
.logo .png{font-family:var(--mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.marq+.marq{border-top:0}
.cv li{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) 120px;gap:16px;align-items:baseline;padding-block:14px}
.cv li .y{text-align:right;font-family:var(--mono);font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.cv h3{font-size:11px;font-family:var(--mono);text-transform:uppercase;color:var(--muted);padding-block:26px 10px}
.cv h3:first-child{padding-top:0}
.contact{align-items:start;padding-block:28px calc(170px + env(safe-area-inset-bottom,0px));row-gap:20px}
.contact .lbl{grid-column:1/span 4}
.contact .mail{grid-column:5/span 4;display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.contact .mail .addr{font-size:clamp(20px,1.8vw,26px);font-weight:300;letter-spacing:-.02em;user-select:all}
.contact .soc{grid-column:10/span 3;justify-self:end;text-align:right;display:flex;flex-direction:column;gap:3px}
.copy{color:var(--muted)} .copy:hover{color:var(--gold)}

/* contato */
.form{display:flex;flex-direction:column;gap:0}
.fld{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:16px;align-items:baseline;padding-block:16px;border-bottom:1px solid var(--faint)}
.fld label,.fld .lb{font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.fld input,.fld textarea,.fld select{width:100%;background:transparent;border:0;color:var(--fg);font:inherit;font-size:18px;font-weight:300;padding:4px 0;outline:none;border-bottom:1px solid transparent;transition:border-color .3s}
.fld input:focus,.fld textarea:focus,.fld select:focus{border-bottom-color:var(--gold)}
.fld textarea{resize:vertical;min-height:110px}
.fld select option{background:#000}
.pick{display:flex;flex-wrap:wrap;gap:8px}
.fld .pick label{cursor:pointer;font-family:var(--sans);font-size:14px;text-transform:none;letter-spacing:0;color:var(--fg)}
.pick input{position:absolute;opacity:0;pointer-events:none}
.pick span{display:inline-block;padding:9px 14px;border:1px solid var(--faint);border-radius:999px;font-size:14px;transition:all .25s}
.pick input:checked+span{background:var(--fg);color:#000;border-color:var(--fg)}
.pick input:focus-visible+span{outline:1px solid var(--gold);outline-offset:3px}
.send{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding-top:28px}
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 26px;border:1px solid var(--gold);border-radius:999px;font-size:15px;transition:background .3s,color .3s}
.btn:hover{background:var(--gold);color:#000}
.ok{padding:28px 0;border-bottom:1px solid var(--faint);font-size:20px;font-weight:300}
.err{color:#E8A08A;font-family:var(--mono);font-size:11px;text-transform:uppercase}
.alt{display:flex;flex-direction:column;gap:6px}
.stepnav{display:flex;flex-direction:column;gap:6px;margin-top:22px}
.stepnav li{color:var(--muted);transition:color .3s}
.stepnav li span{display:inline-block;width:26px}
.stepnav li.on{color:var(--fg)} .stepnav li.done{color:var(--gold)}
.prog{height:1px;background:var(--faint)} .prog i{display:block;height:1px;background:var(--fg);width:25%;transition:width .6s var(--ease)}
fieldset.step{border:0;margin:0;padding:0;min-width:0} fieldset.step legend{padding:18px 0 4px}
.fld.bad .lb,.fld.bad>label{color:#E8A08A}
.nav{display:flex;gap:18px;align-items:center}
.ghost{color:var(--muted);min-height:44px} .ghost:hover{color:var(--fg)}
.pick.ack{flex-direction:column;align-items:flex-start} .pick.ack span{border-radius:12px}
.addr{overflow-wrap:anywhere}

/* lab */
.lab-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.exp{display:flex;flex-direction:column;gap:10px}
.exp .box{aspect-ratio:4/3;background:var(--panel);position:relative;overflow:hidden}
.exp .box video{width:100%;height:100%;object-fit:contain;mix-blend-mode:screen}
.exp canvas{width:100%;height:100%;display:block}
.exp .cap{display:flex;justify-content:space-between;gap:12px}
.exp.soon .box{display:flex;align-items:center;justify-content:center}

/* responsivo */
@media (max-width:900px){
  .top .who{grid-column:1/span 6}.top .mark{grid-column:7/span 6;justify-self:end}
  .top nav{display:none}.top .meta{display:none}
  .lead h1,.lead p,.sec>.body,.ab-top .txt,.cs-flow,.contact .mail{grid-column:1/-1}
  .sec>.lbl,.contact .lbl{grid-column:1/-1;margin-bottom:16px}
  .ab-top .pic{grid-column:1/span 8;margin-bottom:32px}
  .ficha{grid-column:1/-1;position:static;margin-bottom:40px}
  .cs-head .n{grid-column:1/-1}.cs-head h1{grid-column:1/-1;margin-block:10px 16px}.cs-head p{grid-column:1/-1}
  .home .seal{top:42%}
  .home .bio{grid-column:1/-1}.home .now{grid-column:1/-1;margin-top:16px}.home .mail{display:none}
  .contact .soc{grid-column:1/-1;justify-self:start;text-align:left;margin-top:20px}
  .wk-head,.wk-row{grid-template-columns:40px minmax(0,1fr) 52px}.wk-head .ds,.wk-row .ds{display:none}
  .wk-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lab-grid{grid-template-columns:1fr}
  .fld{grid-template-columns:1fr;gap:6px}
  .stepnav{flex-direction:row;flex-wrap:wrap;gap:4px 14px;margin-top:12px}
  .top .say{display:none}
  .home .now{grid-column:1/-1;justify-self:start;text-align:left;margin-top:12px}
  .home .now a{flex-direction:row;align-items:baseline;gap:10px;font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.04em}
  .home .foot{bottom:calc(84px + env(safe-area-inset-bottom,0px))}
  .dock .items{max-width:calc(100vw - 72px);opacity:1}
  .dock .cur{padding:10px 6px 10px 12px}
  .dock .cur .lbl,.dock .cur .chev{display:none}
  .steps li{grid-template-columns:40px minmax(0,1fr)}.steps li .d{grid-column:2}
  .cv li{grid-template-columns:minmax(0,1fr) 90px}.cv li .r{grid-column:1}
  .peek{display:none}
  .dock{gap:2px;padding:5px}
  .dock .cur{padding:10px 12px;gap:8px}
  .dock.open .cur .lbl,.dock.open .cur .chev{display:none}
  .dock .items{overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .dock .items::-webkit-scrollbar{display:none}
  .dock.open .items{max-width:calc(100vw - 80px)}
  .dock .items a{padding:10px 10px;font-size:13px}
  .dock .items a.cta{margin-left:4px}
  .next .l,.next .r{grid-column:1/-1}
  .g12{column-gap:12px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  html.anim .rv,html.anim .rv-img{opacity:1;transform:none;clip-path:none}
}

/* ---------- site final ---------- */
html,body{margin:0;background:#000}
*,*::before,*::after{box-sizing:border-box}
figure{margin:0}
.dock .lang-d a{padding:10px 2px;color:var(--muted)} .dock .lang-d a[aria-current="true"]{color:var(--fg)}
/* tela de carregamento / transição */
.curtain{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:18px}
.curtain img{height:22px;width:auto;opacity:.9}
.curtain i{display:block;width:80px;height:1px;background:var(--faint);position:relative;overflow:hidden}
.curtain i::after{content:"";position:absolute;inset:0;background:var(--gold);transform:translateX(-100%);animation:load 1s var(--ease) infinite}
@keyframes load{to{transform:translateX(100%)}}
.curtain.on{pointer-events:all}
html:not(.js) .curtain{display:none}
/* páginas de tela única */
.p-home,.p-lab{overflow:hidden;height:100%;overscroll-behavior:none}
.home,.uni{height:100vh;height:100dvh}
.uni .core{width:220px}
.uni .core .sealcv{width:100%}
.uni .tile .im video,.uni .tile .im canvas{width:100%;height:100%;object-fit:cover;display:block}
.uni .tile .im{display:flex;align-items:center;justify-content:center}
.uni .tile .im .ph-n{position:absolute}
/* sobre */
.brands{padding-bottom:110px}
.brands h2{padding-bottom:18px}
/* case */
.cs-hero video{width:100%;aspect-ratio:16/9;object-fit:cover}
.cs-flow .full img,.cs-flow .full video{width:100%;height:auto;aspect-ratio:auto}
.cs-flow figcaption{padding-top:8px}
.duo>div,.trio>div{aspect-ratio:auto;overflow:hidden}
.duo img,.duo video,.trio img,.trio video{width:100%;height:100%;object-fit:cover;aspect-ratio:4/5}
.trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.cs-flow .txt{max-width:58ch;font-size:16px;font-weight:300;color:rgba(255,255,255,.85)}
.result{margin:60px 0;padding:28px 0;border-block:1px solid var(--faint)}
.result p{font-size:clamp(22px,2.2vw,30px);font-weight:300;line-height:1.2;letter-spacing:-.02em;max-width:26ch}
.result cite{display:block;margin-top:14px;font-style:normal}
.hp{position:absolute;left:-9999px;opacity:0}
.page-body{padding-bottom:160px}
@media (max-width:900px){
  .trio{grid-template-columns:1fr 1fr}
  .uni .tile{transform-origin:center}
  .uni .hint{left:var(--gut);right:auto;text-align:left;bottom:calc(84px + env(safe-area-inset-bottom,0px))}
  .uni .back{display:none}
}
/* reforços para celulares: posição sem "inset" e cortina que some sozinha se o JS falhar */
.home,.uni,.curtain,.home .slides,.home .veil{top:0;right:0;bottom:0;left:0}
.home .slides img{top:0;left:0}
@keyframes curtainOut{to{opacity:0;visibility:hidden}}
.curtain.boot{animation:curtainOut .45s 2.6s forwards}
/* iPhone: a home e o Lab ficam dentro de uma camada fixa do tamanho da tela (Safari escondia o conteúdo fixo dentro do corpo sem altura) */
.p-home,.p-lab{height:auto;overflow:hidden;overflow-x:hidden}
.p-home #view,.p-lab #view{position:fixed;top:0;left:0;right:0;bottom:0;height:100vh;height:100dvh;overflow:hidden;z-index:1}
.p-home .home,.p-lab .uni{position:absolute;top:0;left:0;right:0;bottom:0;height:100%}
/* vídeos do Vimeo/YouTube */
.embed{position:relative;width:100%;background:#000;overflow:hidden}
.embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.embed.bg iframe{pointer-events:none}
.cs-flow .full video[controls]{width:100%;background:#000}


/* dupla e trio: proporção escolhida no painel; nocrop = imagem inteira */
.duo img,.duo video,.trio img,.trio video{aspect-ratio:var(--ar,4/5)}
.duo.nocrop,.trio.nocrop{align-items:start}
.duo.nocrop img,.duo.nocrop video,.trio.nocrop img,.trio.nocrop video{aspect-ratio:auto;height:auto;object-fit:contain}
/* ampliar imagem do case */
.cs-flow img,.cs-hero img{cursor:zoom-in}
html.has-cursor .cs-flow img,html.has-cursor .cs-hero img{cursor:none}
.zoom{position:fixed;inset:0;z-index:95;background:rgba(0,0,0,.94);display:flex;align-items:center;justify-content:center;padding:clamp(12px,4vw,48px);opacity:0;transition:opacity .35s var(--ease);cursor:zoom-out}
.zoom.on{opacity:1}
.zoom img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;transform:scale(.97);transition:transform .45s var(--ease)}
.zoom.on img{transform:none}
.zoom .x{position:absolute;top:18px;right:18px;font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
