@font-face{font-family:"Anton";font-weight:400;font-display:swap;src:url(../fontes/anton-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-weight:300;font-display:swap;src:url(../fontes/hanken-grotesk-latin-300-normal.woff2) format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-weight:400;font-display:swap;src:url(../fontes/hanken-grotesk-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-weight:500;font-display:swap;src:url(../fontes/hanken-grotesk-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-weight:600;font-display:swap;src:url(../fontes/hanken-grotesk-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-weight:700;font-display:swap;src:url(../fontes/hanken-grotesk-latin-700-normal.woff2) format("woff2")}
:root{
  --figo:#451739;--figo-2:#38122E;--figo-3:#2A0D22;--lilac:#987E92;--lilac-bg:#EFE9EE;--lilac-bg2:#E7DEE4;--lilac-tint:#DED4DC;
  --mostarda:#D6A461;--mostarda-dark:#896541;--mostarda-tint:#F9F2E9;--veto-border:#EDD6B8;
  --green:#7D7E3B;--green-deep:#19251A;--green-soft:#EAEAE0;--green-line:#D8D8C4;
  --ink:#33283A;--ink-soft:#6B5C74;--ink-faint:#B2A4B6;--surface:#FCF9FB;--line:#E8DCE4;--line-2:#DBCBD6;--creme:#FBEDE4;
  --sans:"Hanken Grotesk",system-ui,-apple-system,sans-serif;--display:"Anton",Impact,sans-serif;
  --r-lg:30px;--r-md:22px;--r-sm:16px;
  --elev-1:0 1px 2px rgba(58,20,48,.05),0 4px 14px -6px rgba(58,20,48,.10),0 16px 32px -20px rgba(58,20,48,.28);
  --elev-2:0 2px 6px rgba(58,20,48,.07),0 10px 24px -10px rgba(58,20,48,.18),0 32px 64px -28px rgba(58,20,48,.42);
  --ease:cubic-bezier(.2,.75,.25,1);--ease-spring:cubic-bezier(.34,1.45,.4,1);
  --h1:clamp(50px,6vw,88px);--h2:clamp(36px,4.2vw,58px);--h3:24px;--mani:clamp(28px,3.4vw,46px);
  color-scheme:light only;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
html,body{margin:0;padding:0}
body{background:var(--lilac-bg);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:geometricPrecision}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3,p,figure,ol,ul,dl,dd{margin:0}
ol,ul{padding:0;list-style:none}
button{font:inherit}
:focus-visible{outline:2px solid var(--green);outline-offset:3px}
.oculto{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.ic{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.ic-16{width:16px;height:16px;stroke-width:1.8}.ic-20{width:20px;height:20px;stroke-width:1.7}
.marca{display:block;width:112px;height:auto}
.wrap{width:min(1280px,100% - 96px);margin-inline:auto}
.d{font-family:var(--display);font-weight:400;text-transform:uppercase;letter-spacing:.012em;line-height:1.26;text-wrap:balance}
.label{font:600 11.5px/1.2 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font:600 15px/1 var(--sans);padding:16px 26px;border-radius:999px;border:0;cursor:pointer;text-decoration:none;white-space:nowrap;transition:transform .13s var(--ease-spring),background .13s var(--ease),box-shadow .24s var(--ease)}
.btn:hover{transform:translateY(-1px)}.btn:active{transform:scale(.97)}
.btn-forte{background:var(--figo);color:#fff}
.btn-linha{background:transparent;color:var(--figo);box-shadow:inset 0 0 0 1.5px var(--figo)}
.btn-linha:hover{background:var(--figo);color:#fff}
.btn-claro{background:var(--creme);color:var(--figo)}
.btn-linha-claro{background:transparent;color:var(--creme);box-shadow:inset 0 0 0 1.5px rgba(251,237,228,.55)}
.btn-linha-claro:hover{background:var(--creme);color:var(--figo)}
.btn-sm{font-size:14px;padding:12px 18px}
.frm{display:grid;gap:14px}
.campo{display:grid;gap:6px}
.campo span{font:600 11.5px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.campo input,.campo textarea{font:400 17px/1.4 var(--sans);padding:14px 16px;border-radius:14px;border:1px solid var(--line-2);background:var(--surface);color:var(--ink);width:100%;resize:vertical}
.campo input::placeholder,.campo textarea::placeholder{color:var(--ink-faint)}
.frm-pe{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.frm-ok{font-size:14px;color:var(--green-deep);background:var(--green-soft);box-shadow:inset 0 0 0 1px var(--green-line);padding:9px 14px;border-radius:999px}
.frm-erro{font-size:14px;color:var(--mostarda-dark);background:var(--mostarda-tint);box-shadow:inset 0 0 0 1px var(--veto-border);padding:9px 14px;border-radius:999px}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

/* ══ o véu de abertura — o ícone do app ══ */
.veu{position:fixed;inset:0;z-index:300;background:var(--figo);display:grid;place-items:center;animation:veu-sobe .9s 1.2s var(--ease) forwards;pointer-events:none}
.veu img{width:72px;height:auto;animation:veu-a 1s .1s var(--ease) both}
@keyframes veu-sobe{to{transform:translateY(-101%);visibility:hidden}}
@keyframes veu-a{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.veu{display:none}}

/* ══ a página ══ */
.site{background:radial-gradient(1100px 560px at 4% -10%,#ECEEDA 0%,transparent 55%),radial-gradient(900px 640px at 110% 4%,#ECE0E9 0%,transparent 52%),var(--lilac-bg);color:var(--ink);overflow-x:clip}
.nav{position:sticky;top:0;z-index:60;transition:background .3s var(--ease),box-shadow .3s var(--ease)}
.nav.solida{background:rgba(239,233,238,.88);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line)}
.nav .wrap{display:flex;align-items:center;gap:28px;height:74px}
.nav nav{display:flex;gap:26px;margin-left:12px}
.nav nav a{text-decoration:none;font:500 14px/1 var(--sans);color:var(--ink-soft)}
.nav nav a:hover{color:var(--figo)}
.nav .acoes{margin-left:auto;display:flex;gap:12px;align-items:center}
.nav .entrar{font:600 14px/1 var(--sans);color:var(--figo);text-decoration:none}
.nav-lojas{display:flex;gap:8px;align-items:center}
.nav-lojas .btn{gap:7px}
.nav .hamb{display:none;background:transparent;border:0;color:var(--figo);width:44px;height:44px;border-radius:50%;cursor:pointer;place-items:center}
.menu-m{display:none}

/* hero — a leitura ao vivo */
.hero{display:grid;grid-template-columns:6fr 6fr;gap:48px;align-items:center;padding:36px 0 88px}
.hero-t{padding-top:0}
.hero h1{font-size:clamp(40px,4.4vw,64px);line-height:1.06;color:var(--figo);max-width:17ch;animation:up 1s .1s var(--ease) both}
.hero h1 b{font-weight:inherit;color:var(--mostarda-dark)}
.hero .sub{font-weight:300;font-size:21px;line-height:1.42;color:var(--ink);max-width:34ch;margin-top:28px;animation:up 1s .32s var(--ease) both}
.hero .cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:36px;animation:up 1s .42s var(--ease) both}
@keyframes up{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
/* o leque de telas do hero */
.baralho{animation:up 1.2s .25s var(--ease) both}
.leque{position:relative;height:min(64vh,600px)}
.leque .fone{position:absolute;left:50%;top:0;width:40%;max-width:230px;margin-left:-20%;background:var(--figo-3);border-radius:42px;transform-origin:50% 120%;transition:transform .8s var(--ease),opacity .5s var(--ease);cursor:pointer;border:0;padding:10px;will-change:transform}
.leque .fone.ativa{cursor:default;box-shadow:0 40px 80px -20px rgba(58,20,48,.45),inset 0 0 0 1px rgba(255,255,255,.14)}
.leque .fone:not(.ativa):hover{filter:brightness(1.04)}
.leque .fone:focus-visible{outline:2px solid var(--mostarda);outline-offset:4px}
.leque-cab{text-align:center;margin-top:22px;min-height:78px}
.leque-cab h3{font-family:var(--display);text-transform:uppercase;letter-spacing:.02em;font-size:22px;line-height:1;color:var(--figo)}
.leque-cab p{font-size:15px;line-height:1.5;color:var(--ink-soft);max-width:38ch;margin:8px auto 0}
.leque-cab.troca h3,.leque-cab.troca p{animation:up .6s var(--ease) both}
.pontos{display:flex;justify-content:center;gap:8px;margin-top:12px}
.ponto{width:8px;height:8px;border-radius:50%;border:0;padding:0;background:var(--line);cursor:pointer;transition:background .3s,transform .3s}
.ponto.on{background:var(--figo);transform:scale(1.25)}
.leque::after{content:"";position:absolute;left:14%;right:14%;bottom:-6px;height:40px;border-radius:50%;background:radial-gradient(closest-side,rgba(58,20,48,.28),rgba(58,20,48,0));filter:blur(6px)}
/* a peça lida ao vivo */


/* como o app funciona — a lista editorial do método */
.como{padding:96px 0 24px;border-top:1px solid var(--figo)}
.como .cab{display:grid;grid-template-columns:repeat(12,1fr);gap:24px;align-items:start}
.como .cab .label{grid-column:1/4;color:var(--mostarda-dark)}
.como h2{grid-column:4/12;font-size:var(--h2);color:var(--figo);max-width:14ch}
.como .intro{grid-column:4/12;font-weight:300;font-size:21px;line-height:1.45;color:var(--ink);max-width:48ch;margin-top:6px}
.etapas{margin-top:48px;display:grid}
.etapa{display:grid;grid-template-columns:repeat(12,1fr);gap:24px;padding:30px 0;border-top:1px solid var(--line-2)}
.etapa .n{grid-column:1/4;font-family:var(--display);font-size:44px;line-height:.9;color:var(--mostarda)}
.etapa > div{grid-column:4/12;display:grid;gap:10px}
.etapa h3{font-family:var(--display);text-transform:uppercase;letter-spacing:.02em;font-size:var(--h3);line-height:1.05;color:var(--figo)}
.etapa p{font-size:17px;line-height:1.55;color:var(--ink-soft);max-width:60ch}

/* a leitura — os seis cartões de pergunta (mesma família do Provador, escala menor) */
.leitura{padding:96px 0 8px;border-top:1px solid var(--figo)}
.leitura .cab{display:grid;gap:12px;margin-bottom:44px}
.leitura .cab .label{color:var(--mostarda-dark)}
.leitura h2{font-size:var(--h2);color:var(--figo);max-width:16ch}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.flip.mini{width:100%;aspect-ratio:1/.92}
.mini .face{border-radius:26px;box-shadow:0 1px 0 var(--line),0 26px 50px -30px rgba(58,20,48,.5)}
.mini .face.frente{padding:24px;grid-template-rows:auto 1fr auto;gap:6px}
.mini .face.frente .perg{display:grid;align-content:center;font-size:clamp(23px,2.15vw,33px);line-height:1.04;justify-content:start}
.mini .face.frente small{font:600 10.5px/1.2 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:rgba(251,237,228,.55)}
.mini .face.verso{padding:22px;align-items:end}
/* o padrão fica INSINUADO nos pequenos — a onça aberta é privilégio do Provador */
/* sem repetir (a emenda aparecia): a estampa entra cortada, e cada cartão mostra um pedaço diferente */
.mini .face.verso{background:#C99755 url(../marca/onca.webp) center/auto 150% no-repeat}
.cards > *:nth-child(2) .verso{background-position:22% 30%}
.cards > *:nth-child(3) .verso{background-position:78% 60%}
.cards > *:nth-child(4) .verso{background-position:40% 80%}
.cards > *:nth-child(5) .verso{background-position:85% 20%}
.cards > *:nth-child(6) .verso{background-position:12% 65%}
.mini .face.verso::before{background:linear-gradient(175deg,rgba(69,23,57,.78) 0%,rgba(69,23,57,.93) 42%,rgba(69,23,57,.97) 100%)}
.mini .face.verso p{font-size:15.5px;line-height:1.42;font-weight:300}
.mini .face.verso .label{margin-bottom:8px}
.flip.mini:hover .face{box-shadow:0 1px 0 var(--line),0 34px 60px -30px rgba(58,20,48,.6)}
.flip.mini:focus-visible{outline:2px solid var(--mostarda);outline-offset:5px;border-radius:26px}

/* a vitrine noturna — o Provador */
.noite{background:linear-gradient(165deg,var(--figo) 0%,var(--figo-2) 55%,var(--figo-3) 100%);color:var(--creme);padding:120px 0;margin-top:60px;position:relative;overflow:hidden}
.noite-g{display:grid;grid-template-columns:5fr 7fr;gap:64px;align-items:center}
.noite h2{font-size:var(--h2);color:var(--creme);max-width:12ch}
.noite .sub{font-weight:300;font-size:19px;line-height:1.5;color:rgba(251,237,228,.85);max-width:40ch;margin-top:22px}
.noite .sub b{font-weight:500;color:var(--creme)}
.noite .cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:32px}
.flip{perspective:1600px;justify-self:center;width:min(100%,460px);aspect-ratio:4/5;cursor:pointer}
.flip-in{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .9s var(--ease)}
.flip.on .flip-in{transform:rotateY(180deg)}
.face{position:absolute;inset:0;border-radius:var(--r-lg);backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden;box-shadow:var(--elev-2)}
.face.frente{background:linear-gradient(180deg,#5A2249 0%,#3A122F 100%);display:grid;grid-template-rows:auto 1fr auto;padding:26px}
.face.frente .label{color:var(--mostarda)}
.face.frente .peca{display:grid;place-items:center}
.face.frente .peca img{max-height:250px;width:auto;filter:drop-shadow(0 26px 30px rgba(0,0,0,.45))}
.face.frente .perg{font-family:var(--display);text-transform:uppercase;font-size:34px;line-height:1;color:var(--creme);display:flex;justify-content:space-between;align-items:end;gap:12px}
.face.frente .perg small{font:600 11px/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:rgba(251,237,228,.6);text-align:right}
.face.verso{transform:rotateY(180deg);background:#C99755 url(../marca/onca.webp) center/cover;display:grid;align-items:end;padding:26px}
.face.verso::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(69,23,57,.15) 0%,rgba(69,23,57,.9) 62%)}
.face.verso > div{position:relative;color:var(--creme)}
.face.verso .label{color:var(--mostarda);margin-bottom:12px}
.face.verso p{font-weight:300;font-size:21px;line-height:1.35}
.face.verso .fonte{margin-top:16px;font:500 12px/1.4 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:rgba(251,237,228,.65)}

/* consultoras · contato */
.duas{padding:120px 0 40px;display:grid;grid-template-columns:1fr 1fr;gap:20px}
.bloco{background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--elev-1);padding:40px}
.bloco h2{font-size:clamp(28px,2.8vw,38px);color:var(--figo)}
.bloco .sub{font-weight:300;font-size:17px;line-height:1.5;color:var(--ink);margin:16px 0 26px;max-width:42ch}
.bloco .email{display:inline-block;margin-top:18px;font-size:14px;color:var(--mostarda-dark);text-decoration:none;border-bottom:1px solid var(--mostarda)}

/* rodapé */
.foot{margin-top:80px;background:var(--figo);color:var(--creme)}
.foot .wrap{padding:64px 0 36px}
.foot .marca{width:180px}
.foot-g{display:flex;justify-content:space-between;align-items:end;gap:32px;flex-wrap:wrap}
.foot .links{display:flex;gap:22px;flex-wrap:wrap;font-size:14px;align-items:center}
.foot a{text-decoration:none;color:rgba(251,237,228,.85)}
.foot a:hover{color:var(--creme)}
.foot .social{display:inline-flex;align-items:center;gap:7px}
.foot .social .ic{width:18px;height:18px}
.foot .fim{margin-top:40px;padding-top:20px;border-top:1px solid rgba(214,164,97,.4);font-size:12.5px;opacity:.65;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}
.foot .onca{height:26px;background:url(../marca/onca.webp) center/900px auto}

/* página utilitária — privacidade, apagar conta (sem véu, sem hero) */
.pag-util .veu{display:none}
.folha{max-width:720px;padding:48px 0 24px;margin-inline:auto}
.folha > .label{margin-bottom:14px}
.folha > h1{font-size:clamp(40px,5vw,64px);color:var(--figo);margin-bottom:18px}
.folha > .sub{font-weight:300;font-size:19px;line-height:1.45;color:var(--ink);max-width:46ch;margin-bottom:28px}
.aviso-irrev{background:var(--mostarda-tint);box-shadow:inset 0 0 0 1px var(--veto-border);border-radius:var(--r-sm);padding:16px 18px;margin-bottom:36px;color:var(--mostarda-dark)}
.aviso-irrev p{font-size:16px;line-height:1.45}
.folha .caminho{margin-bottom:28px}
.folha .caminho > .label{margin-bottom:10px}
.folha .caminho > h2{font-size:clamp(26px,3vw,36px);color:var(--figo);margin-bottom:14px}
.folha .caminho > p{font-weight:300;font-size:17px;line-height:1.5;margin-bottom:12px;max-width:48ch}
.folha .caminho.bloco{padding:36px;margin-bottom:36px}
.folha .caminho.bloco .sub{margin:0 0 22px;max-width:none}
.chk{display:flex;align-items:flex-start;gap:10px;font-size:16px;line-height:1.4;color:var(--ink)}
.chk input{margin-top:4px;width:18px;height:18px;flex:0 0 auto;accent-color:var(--figo)}
.folha .legal{background:var(--surface);border-radius:var(--r-md);box-shadow:var(--elev-1);padding:28px 28px 12px;margin-bottom:36px}
.folha .legal h2{font-family:var(--display);font-weight:400;font-size:clamp(22px,2.4vw,28px);text-transform:uppercase;letter-spacing:.012em;line-height:1.26;color:var(--figo);margin:28px 0 10px}
.folha .legal h2:first-child{margin-top:0}
.folha .legal p{font-weight:300;font-size:17px;line-height:1.6;color:var(--ink);margin:0 0 14px}
.folha .legal ul{margin:0 0 14px;padding-left:22px;list-style:disc}
.folha .legal li{font-weight:300;font-size:17px;line-height:1.55;color:var(--ink);margin-bottom:8px}
.folha .legal b{font-weight:600;color:var(--ink)}
.folha .legal a{color:var(--figo);text-decoration:underline;text-underline-offset:3px}
.folha-voltar{margin:8px 0 48px}
@media (max-width:760px){
  .folha .legal{padding:22px 18px 8px}
}

@media (max-width:980px){
  .wrap{width:min(1280px,100% - 40px)}
  .hero{grid-template-columns:1fr;gap:36px;padding-bottom:56px}.hero-t{padding-top:20px}
  .baralho{max-width:520px;margin:0 auto;width:100%}.leque{height:auto;aspect-ratio:1/.98}
  .como{padding-top:72px}.como .cab,.etapa{grid-template-columns:1fr;gap:10px}.como .cab .label,.como h2,.como .intro,.etapa .n,.etapa > div{grid-column:auto}.como .intro{font-size:19px}.etapa{padding:22px 0}.etapa .n{font-size:32px}
  .cards{grid-template-columns:repeat(2,1fr);gap:14px}.leitura{padding-top:72px}.leitura .cab{margin-bottom:32px}
  .noite-g{grid-template-columns:1fr;gap:40px}.duas{grid-template-columns:1fr}.bloco{padding:28px}
}
@media (max-width:760px){
  .nav nav,.nav .entrar,.nav .nav-lojas{display:none}.nav .wrap{height:64px;gap:14px}.marca{width:96px}.nav .hamb{display:grid}
  .menu-m{position:fixed;inset:0;z-index:80;background:var(--figo);color:var(--creme);padding:24px;display:none;flex-direction:column;gap:6px}
  .menu-m.on{display:flex}
  .menu-m .fecha{align-self:flex-end;background:transparent;border:0;color:var(--creme);width:44px;height:44px;display:grid;place-items:center;cursor:pointer}
  .menu-m a{font-family:var(--display);text-transform:uppercase;font-size:36px;color:var(--creme);text-decoration:none;padding:10px 0;border-bottom:1px solid rgba(251,237,228,.15)}
  .menu-m .m-pe{margin-top:auto;display:grid;gap:12px}
  .menu-m .m-pe .btn{width:100%;font:600 15px/1 var(--sans);text-transform:none;border-bottom:0;padding:16px 26px}
  .menu-m .m-pe .btn-claro{color:var(--figo)}.menu-m .m-pe .btn-linha-claro{color:var(--creme)}.menu-m .m-pe .btn-linha-claro:hover{color:var(--figo)}
  .hero h1{font-size:clamp(34px,8.6vw,44px);line-height:1.1}.hero .sub{font-size:19px}.hero .cta .btn,.noite .cta .btn{width:100%}
  .como{padding-top:56px}.cards{grid-template-columns:1fr;gap:14px}.flip.mini{aspect-ratio:1/.62}.leitura{padding-top:56px}
  .noite{padding:72px 0}.noite h2{max-width:none}.duas{padding-top:72px}
}


/* ══ LOTE 21SET-LANDING-APP → LOTE 24OUT-INSTALAR — /app, a página do link na bio ══
   V1 (escolha dela, 24/out 08h36): a página INTEIRA no figo, assinada só com o A da marca; o título
   em Fraunces creme; o único botão é o Ação (mostarda, rótulo figo — o «Combinar» da Produção). Sem
   legendas, sem cartão branco, sem sombra. Ela precede a tela «Instalar Ateliê Closet» do app — as
   duas são a MESMA tela. O script do <head> marca `html[data-aparelho]` (iphone-app · desktop;
   android e iphone já saíram daqui) e `data-esquema` (sim/nao); o CSS mostra só o caminho certo.
   Sem JS (ou aparelho não reconhecido): os dois caminhos à mão (`.inst-so-sem-js`). */
@font-face{font-family:"Fraunces";font-weight:300 900;font-display:swap;src:url(../fontes/fraunces-latin-opsz-normal.woff2) format("woff2")}
.inst-pag{background:var(--figo);min-height:100dvh;font-family:-apple-system,BlinkMacSystemFont,system-ui,"Segoe UI",Roboto,sans-serif;color:#FCF9FB;-webkit-font-smoothing:antialiased}
.inst-pag .veu{display:none}
.inst{min-height:100dvh;max-width:440px;margin:0 auto;padding:max(24px,calc(env(safe-area-inset-top) + 12px)) 24px calc(24px + env(safe-area-inset-bottom));display:flex;flex-direction:column;box-sizing:border-box}
.inst-top{margin-top:auto;text-align:center}
.inst-marca{display:inline-block;width:72px;height:72px}
.inst-marca svg{display:block;width:100%;height:100%}
.inst-titulo{margin:22px 0 0;font:500 28px/34px "Fraunces",Georgia,"Times New Roman",serif;letter-spacing:-.01em;color:#FCF9FB;text-wrap:balance;text-transform:none}
.inst-miolo{margin:34px 0 auto;display:grid;gap:14px}
.inst-pag .btn{height:auto;min-height:50px;padding:12px 20px;border-radius:25px;font:600 17px/22px inherit;font-family:inherit;white-space:normal;text-align:center;text-wrap:balance;display:flex;align-items:center;justify-content:center;text-decoration:none;box-shadow:none;width:100%}
.inst-pag .btn-primary{background:var(--mostarda);color:var(--figo)}
.inst-pag .btn-primary:active{filter:brightness(.92)}
.inst-pag .btn-linha{background:transparent;color:#FCF9FB;box-shadow:inset 0 0 0 1px rgba(252,249,251,.45)}
.inst-lojas{display:grid;gap:10px}
.inst-manual{margin:12px 0 0;font:400 15px/20px inherit;font-family:inherit;color:rgba(252,249,251,.72);text-align:center;text-wrap:balance}
.inst-manual b{font-weight:600;color:#FCF9FB}
.inst-manual .ic{width:16px;height:16px;vertical-align:-3px;stroke-width:1.7;fill:none;stroke:currentColor}
.inst-manual .ic circle{fill:currentColor;stroke:none}
.inst-cartao{padding:18px 16px;border-radius:16px;background:rgba(252,249,251,.08)}
.inst-cartao .inst-manual{margin:0;text-align:left;font-size:17px;line-height:22px;color:#FCF9FB}
.inst-qr-linha{display:grid;justify-items:center;gap:16px}
.inst-qr{width:200px;padding:12px;background:#fff;border-radius:16px}
.inst-qr svg{display:block;width:100%;height:auto}
/* o título: «Ateliê Closet» quando há botão embaixo (Instagram, sem JS); «Instalar Ateliê Closet» quando o gesto é dela (TikTok, QR) */
.inst-t-gesto{display:none}
html[data-aparelho="iphone-app"][data-esquema="nao"] .inst-t-botao,html[data-aparelho="desktop"] .inst-t-botao{display:none}
html[data-aparelho="iphone-app"][data-esquema="nao"] .inst-t-gesto,html[data-aparelho="desktop"] .inst-t-gesto{display:block}
/* o que cada aparelho vê */
.inst-so-iphone-app,.inst-so-esquema,.inst-so-sem-esquema,.inst-so-desktop{display:none}
html[data-aparelho="iphone-app"] .inst-so-iphone-app{display:block}
html[data-aparelho="iphone-app"] .inst-so-esquema,html[data-aparelho="iphone-app"] .inst-so-sem-esquema{display:none}
html[data-aparelho="iphone-app"] .inst-so-sem-js{display:none}
html[data-aparelho="iphone-app"][data-esquema="sim"] .inst-so-esquema{display:block}
html[data-aparelho="iphone-app"][data-esquema="nao"] .inst-so-sem-esquema{display:block}
html[data-aparelho="desktop"] .inst-so-desktop{display:block}
html[data-aparelho="desktop"] .inst-qr-linha.inst-so-desktop{display:grid}
html[data-aparelho="desktop"] .inst-so-sem-js{display:none}

/* ══ /cadastro — três planos e a conta ══ */
.planos-folha{max-width:1080px}
.planos-grade{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-items:stretch;margin-bottom:18px}
.plano{background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--elev-1);padding:28px 24px 24px;display:flex;flex-direction:column;text-align:left}
.plano.recomendado{background:var(--mostarda-tint);box-shadow:inset 0 0 0 1.5px var(--veto-border),var(--elev-1)}
.plano.escolhido{box-shadow:inset 0 0 0 2px var(--figo),var(--elev-1)}
.plano.recomendado.escolhido{box-shadow:inset 0 0 0 2px var(--figo)}
.plano .selos{display:flex;flex-wrap:wrap;gap:8px;min-height:28px;margin-bottom:12px}
.plano .selo{font:600 11px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--mostarda-dark);background:var(--surface);box-shadow:inset 0 0 0 1px var(--veto-border);padding:7px 10px;border-radius:999px}
.plano h2{font-size:clamp(26px,2.4vw,34px);color:var(--figo);margin-bottom:8px}
.plano .olho{font-weight:300;font-size:16px;line-height:1.4;color:var(--ink);margin-bottom:16px}
.plano .preco{font:600 15px/1.3 var(--sans);color:var(--figo);margin:0 0 14px}
.plano ul{display:grid;gap:10px;margin-bottom:22px}
.plano li{display:flex;gap:10px;align-items:flex-start;font-weight:300;font-size:15.5px;line-height:1.4}
.plano li[hidden]{display:none !important}
.plano li .ic{width:16px;height:16px;stroke-width:1.8;margin-top:3px;color:var(--figo)}
.plano .btn{margin-top:auto;width:100%;white-space:normal}
.planos-nota{font-size:14px;line-height:1.5;color:var(--ink-soft);max-width:62ch;margin:0 0 36px}
.planos-nota a{color:var(--figo);text-underline-offset:3px}
.conta-bloco{background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--elev-1);padding:36px;max-width:560px;margin-bottom:48px}
.conta-bloco h2{font-size:clamp(28px,3vw,40px);color:var(--figo);margin-bottom:10px}
.conta-bloco .sub{font-weight:300;font-size:17px;line-height:1.45;margin-bottom:22px}
.conta-form{display:grid;gap:14px}
.conta-form [hidden]{display:none !important}
.conta-troca{justify-self:start;background:none;border:0;padding:0;cursor:pointer;font:600 14px/1 var(--sans);color:var(--figo);text-decoration:underline;text-underline-offset:3px}
.conta-form .btn{width:100%}
@media (max-width:900px){
  .planos-grade{grid-template-columns:1fr}
  .conta-bloco{padding:28px 22px}
}