/* Landing da North. As cenas recebem --p (0 a 1) do landing.js e movem apenas
   transform e opacity. Sem JS ou com movimento reduzido, tudo fica estático. */
html[data-tema="escuro"] body.landing,html:not([data-tema]) body.landing{
  --l-bg:#09090b;--l-surface:#18181b;--l-surface-2:#202024;--l-line:rgba(255,255,255,.1);
  --l-text:#f4f4f5;--l-muted:#a1a1aa;--l-faint:#71717a;--l-accent:#22c55e;--l-accent-ink:#04130a;
  --l-solid:#f4f4f5;--l-solid-ink:#09090b;--l-glow:rgba(34,197,94,.2);--l-shadow:rgba(0,0,0,.55);
  --l-brilho:#d9ffe8;--l-halo:rgba(34,197,94,.55)}
html[data-tema="claro"] body.landing{
  --l-bg:#f6f7fb;--l-surface:#fff;--l-surface-2:#f0f1f6;--l-line:rgba(15,23,42,.11);
  --l-text:#171923;--l-muted:#5f6675;--l-faint:#7b8392;--l-accent:#059669;--l-accent-ink:#fff;
  --l-solid:#171923;--l-solid-ink:#fff;--l-glow:rgba(16,185,129,.16);--l-shadow:rgba(15,23,42,.16);
  --l-brilho:#34d399;--l-halo:rgba(5,150,105,.4)}

/* svh ignora a barra do navegador do celular, que aparece e some ao rolar. */
html{--vh:1vh;scroll-behavior:smooth;scroll-padding-top:110px}
@supports(height:1svh){html{--vh:1svh}}
body.landing{display:block;margin:0;background:var(--l-bg);color:var(--l-text);overflow-x:clip;-webkit-font-smoothing:antialiased}
body.landing a{color:inherit;text-decoration:none}
body.landing :where(h1,h2,h3,p){margin:0}
body.landing h1,body.landing h2{font-weight:500;letter-spacing:-.04em;line-height:1.04}
body.landing h2 span{color:var(--l-faint)}

/* Barra em pílula */
.nl-nav{position:fixed;z-index:50;top:18px;left:50%;display:flex;align-items:center;gap:24px;width:min(1000px,calc(100% - 32px));padding:9px 10px 9px 22px;box-sizing:border-box;border:1px solid var(--l-line);border-radius:999px;background:color-mix(in srgb,var(--l-bg) 72%,transparent);transform:translateX(-50%);transition:background-color .25s ease,box-shadow .25s ease}
.nl-nav.is-scrolled{background:color-mix(in srgb,var(--l-bg) 92%,transparent);box-shadow:0 12px 34px var(--l-shadow)}
.nl-brand{display:inline-flex;align-items:center;gap:9px;font-size:19px;font-weight:600;letter-spacing:-.02em}
.nl-brand svg,.nl-brand img{width:26px;height:26px}
.nl-nav nav{display:flex;gap:24px;margin-inline:auto;font-size:15px;color:var(--l-muted)}
.nl-nav nav a:hover{color:var(--l-text)}
.nl-nav-actions{display:flex;align-items:center;gap:8px}
.nl-theme{display:flex;padding:3px;border:1px solid var(--l-line);border-radius:999px}
.nl-theme button{display:grid;place-items:center;width:30px;height:30px;padding:0;border:0;border-radius:50%;background:transparent;color:var(--l-faint);cursor:pointer}
.nl-theme button svg{width:15px;height:15px}
.nl-theme button[aria-pressed="true"]{background:var(--l-surface-2);color:var(--l-text)}

.nl-pill{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 20px;box-sizing:border-box;border:1px solid transparent;border-radius:999px;font-size:15px;font-weight:600;white-space:nowrap;transition:transform .2s ease,background-color .2s ease,box-shadow .2s ease}
.nl-pill:hover{transform:translateY(-1px)}
.nl-pill-ghost{border-color:var(--l-line)}
body.landing .nl-pill-solid{background:var(--l-solid);color:var(--l-solid-ink)}
body.landing .nl-pill-accent{background:var(--l-accent);color:var(--l-accent-ink)}
.nl-pill-accent:hover{box-shadow:0 12px 34px var(--l-glow)}
.nl-pill-lg{min-height:52px;padding:0 30px;font-size:16px}
/* Halo discreto, respirando devagar atrás do botão. */
.nl-pill-brilho{position:relative;isolation:isolate}
.nl-pill-brilho::before{content:'';position:absolute;z-index:-1;inset:-2px;border-radius:inherit;background:var(--l-halo);filter:blur(12px);animation:nl-halo 3.6s ease-in-out infinite}
@keyframes nl-halo{0%,100%{opacity:.14}50%{opacity:.38}}

/* Hero: o texto sai e o celular sobe até o centro */
.nl-hero{position:relative;--p:0}
.nl-hero-stage{position:relative;display:flex;flex-direction:column;align-items:center;gap:48px;padding:150px 20px 60px;overflow:hidden}
.nl-hero-copy{display:flex;flex-direction:column;align-items:center;gap:22px;max-width:900px;text-align:center}
.nl-hero-copy h1{font-size:clamp(44px,7.2vw,92px)}
.nl-hero-copy h1 em{font-style:normal;color:var(--l-accent)}
/* Escrita do título: cada letra nasce acesa e assenta na cor final. */
.nl-letra{opacity:0}
.nl-letra.is-on{animation:nl-letra .4s ease-out both}
@keyframes nl-letra{
  0%{opacity:0;color:var(--l-brilho);text-shadow:0 0 28px var(--l-accent),0 0 8px var(--l-brilho)}
  12%{opacity:1;color:var(--l-brilho);text-shadow:0 0 28px var(--l-accent),0 0 8px var(--l-brilho)}
  100%{opacity:1;text-shadow:0 0 0 transparent}
}
.nl-cursor{position:relative}
.nl-cursor::after{content:'';position:absolute;bottom:-.04em;left:.03em;width:.055em;height:.92em;border-radius:999px;background:var(--l-brilho);box-shadow:0 0 16px 3px var(--l-accent)}
.nl-hero.is-fora .nl-pill-brilho::before{animation-play-state:paused}
.nl-hero-copy p{max-width:540px;color:var(--l-muted);font-size:clamp(17px,1.5vw,20px);line-height:1.5}
.nl-note{padding:0 20px 40px;color:var(--l-faint);font-size:13px;text-align:center}

.nl-phone-wrap{position:relative;width:min(330px,82vw)}
.nl-phone{box-sizing:border-box;width:100%;padding:9px;border:1px solid var(--l-line);border-radius:50px;background:#0b0b0d;box-shadow:0 40px 90px var(--l-shadow),0 0 0 1px rgba(255,255,255,.04) inset}
.nl-phone-screen{display:flex;flex-direction:column;gap:6px;min-height:620px;padding:16px 18px 20px;box-sizing:border-box;border-radius:41px;background:radial-gradient(120% 50% at 50% 0,rgba(34,197,94,.16),transparent 70%),#0f1012;color:#f4f4f5;text-align:center}
.nl-phone-status{display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:600}
.nl-phone-status i{width:70px;height:20px;margin-right:calc(50% - 56px);border-radius:999px;background:#000}
.nl-phone-top{display:flex;justify-content:space-between;align-items:center;margin:12px 0 26px;color:#a1a1aa;font-size:13px}
.nl-phone-top b{display:grid;place-items:center;width:34px;height:34px;border:1px solid rgba(255,255,255,.1);border-radius:50%;font-weight:400}
.nl-phone-screen>small{color:#a1a1aa;font-size:13px}
.nl-phone-screen>strong{font-size:37px;font-weight:500;letter-spacing:-.03em}
.nl-phone-sub{color:#71717a;font-size:12px}
.nl-phone-line{width:100%;height:76px;margin:12px 0 10px}
.nl-phone-line path,.nl-ui-curva path,.nl-janela-corpo svg path{fill:none;stroke:#22c55e;stroke-width:2.5;vector-effect:non-scaling-stroke;stroke-linecap:round}
.nl-phone-tabs{display:flex;gap:6px;justify-content:center;font-size:12px;color:#a1a1aa}
.nl-phone-tabs span{padding:7px 12px;border-radius:999px;background:#1c1c20}
.nl-phone-tabs .is-on{background:#f4f4f5;color:#09090b;font-weight:600}
.nl-phone-screen>p{margin:18px 0 4px;color:#a1a1aa;font-size:13px;text-align:left}
.nl-phone-screen ul{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.nl-phone-screen li{display:flex;align-items:center;gap:10px;padding:10px;border-radius:18px;background:#18181b;font-size:13px;text-align:left}
.nl-phone-screen li span{display:grid;flex:1;font-weight:600}
.nl-phone-screen li small{color:#71717a;font-size:11px;font-weight:400}
.nl-phone-screen li i,.nl-float i{display:grid;flex:none;place-items:center;width:30px;height:30px;border-radius:50%;background:#26262b;color:#f87171;font-style:normal;font-size:13px}
.nl-phone-screen li i.is-in,.nl-float i.is-in{background:rgba(34,197,94,.14);color:#22c55e}
.nl-phone-screen li b.is-in{color:#22c55e}

.nl-float{position:absolute;display:none;align-items:center;gap:10px;padding:10px 18px 10px 10px;border:1px solid var(--l-line);border-radius:999px;background:var(--l-surface);box-shadow:0 18px 44px var(--l-shadow);white-space:nowrap}
.nl-float span{display:grid;color:var(--l-muted);font-size:12px}
.nl-float b{color:var(--l-text);font-size:14px;font-weight:600}

/* Frase que acende */
.nl-frase-stage{display:grid;place-items:center;padding:110px 24px}
.nl-frase p{max-width:1000px;font-size:clamp(30px,4.6vw,62px);font-weight:500;letter-spacing:-.035em;line-height:1.14}
.nl-frase span{color:var(--l-text);opacity:.16;transition:opacity .35s ease}
.nl-frase span.is-lit{opacity:1}

/* Passos e bússola */
.nl-passos{--p:0}
.nl-passos-stage{position:relative;display:grid;gap:40px;padding:60px 24px}
.nl-passos-copy{display:grid;gap:42px}
.nl-passos-copy span{display:block;margin-bottom:12px;color:var(--l-accent);font-size:15px;font-weight:600}
.nl-passos-copy h2{font-size:clamp(34px,4.4vw,60px)}
.nl-passos-copy p{max-width:460px;margin-top:18px;color:var(--l-muted);font-size:18px;line-height:1.5}
.nl-bussola{position:relative;display:none;aspect-ratio:1;width:min(640px,44vw,78vh)}
.nl-bussola-luz{position:absolute;inset:6%;border-radius:50%;background:radial-gradient(circle,var(--l-glow),transparent 68%)}
.nl-bussola svg{position:relative;width:100%;height:100%;overflow:visible}
.nl-anel circle{fill:none;stroke:var(--l-line);stroke-width:1.5}
.nl-anel .nl-marcas{stroke:var(--l-faint);stroke-width:10;stroke-dasharray:1.5 12.5}
.nl-anel .nl-tracos{stroke:var(--l-accent);stroke-width:2;stroke-dasharray:46 24;opacity:.55}
.nl-anel,.nl-agulha{transform-origin:300px 300px}
.nl-anel-a{transform:rotate(calc(var(--p,0)*150deg))}
.nl-anel-b{transform:rotate(calc(var(--p,0)*-230deg))}
.nl-agulha{transform:rotate(calc((1 - var(--p,0))*-310deg - 2deg + var(--p,0)*2deg))}
.nl-agulha-norte{fill:var(--l-accent)}
.nl-agulha-sul{fill:var(--l-surface-2);stroke:var(--l-line)}
.nl-agulha circle{fill:var(--l-text)}
.nl-pontos text{fill:var(--l-muted);font-size:22px;font-weight:600;text-anchor:middle}
.nl-bussola-cards div{position:absolute;right:-2%;bottom:6%;display:grid;gap:2px;min-width:210px;padding:16px 20px;border:1px solid var(--l-line);border-radius:22px;background:var(--l-surface);box-shadow:0 22px 50px var(--l-shadow);opacity:0;transform:translateY(16px);transition:opacity .35s ease,transform .45s cubic-bezier(.22,.8,.28,1)}
.nl-bussola-cards small{color:var(--l-muted);font-size:13px}
.nl-bussola-cards strong{font-size:23px;font-weight:500;letter-spacing:-.02em}
.nl-bussola-cards b{color:var(--l-accent);font-size:13px;font-weight:600}
.nl-passos[data-atual="0"] .nl-bussola-cards div:nth-child(1),.nl-passos[data-atual="1"] .nl-bussola-cards div:nth-child(2),.nl-passos[data-atual="2"] .nl-bussola-cards div:nth-child(3),.nl-passos[data-atual="3"] .nl-bussola-cards div:nth-child(4){opacity:1;transform:none}
.nl-segmentos{display:none}

/* Galeria: desliza na horizontal enquanto a página desce */
.nl-galeria{--p:0;padding:60px 0}
.nl-galeria-trilho{display:flex;gap:16px;padding:0 24px 12px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none}
.nl-galeria-trilho::-webkit-scrollbar{display:none}
.nl-galeria-trilho>header{display:flex;flex:none;flex-direction:column;justify-content:center;gap:18px;width:min(520px,84vw);scroll-snap-align:start}
.nl-galeria-trilho>header h2{font-size:clamp(34px,4.4vw,60px)}
.nl-galeria-trilho>header p{color:var(--l-muted);font-size:18px;line-height:1.5}
.nl-galeria-trilho article{display:flex;flex:none;flex-direction:column;gap:10px;box-sizing:border-box;width:min(400px,84vw);min-height:470px;padding:30px;border:1px solid var(--l-line);border-radius:32px;background:var(--l-surface);scroll-snap-align:center}
.nl-galeria-trilho article>span{color:var(--l-accent);font-size:14px;font-weight:600}
.nl-galeria-trilho article h3{font-size:28px;font-weight:500;letter-spacing:-.02em}
.nl-galeria-trilho article>p{color:var(--l-muted);font-size:16px;line-height:1.5}
.nl-ui{display:flex;flex:1;min-height:170px;margin-top:auto;padding-top:22px;box-sizing:border-box}
.nl-ui-barras{align-items:flex-end;gap:10px}
.nl-ui-barras i{flex:1;height:var(--h);border-radius:12px 12px 4px 4px;background:var(--l-surface-2)}
.nl-ui-barras i:nth-child(6){background:var(--l-accent)}
.nl-ui-lista{flex-direction:column;justify-content:flex-end;gap:8px}
.nl-ui-lista p{display:flex;justify-content:space-between;padding:14px 16px;border-radius:16px;background:var(--l-surface-2);font-size:14px}
.nl-ui-lista b{font-weight:500}
.nl-ui-lista em{color:var(--l-muted);font-style:normal}
.nl-ui-limite{flex-direction:column;justify-content:flex-end;gap:6px}
.nl-ui-limite small{color:var(--l-muted);font-size:14px}
.nl-ui-limite strong{font-size:34px;font-weight:500;letter-spacing:-.03em}
.nl-ui-limite i{display:block;height:10px;margin-top:8px;border-radius:999px;background:var(--l-surface-2);overflow:hidden}
.nl-ui-limite u{display:block;width:var(--w);height:100%;border-radius:inherit;background:var(--l-accent)}
.nl-ui-curva svg{width:100%;height:100%;align-self:flex-end}
.nl-ui-meta{flex-direction:column;align-items:center;justify-content:flex-end;gap:10px}
.nl-ui-meta div{display:grid;place-items:center;width:136px;height:136px;border-radius:50%;background:radial-gradient(closest-side,var(--l-surface) 76%,transparent 77%),conic-gradient(var(--l-accent) calc(var(--m)*1%),var(--l-surface-2) 0)}
.nl-ui-meta b{font-size:26px;font-weight:500}
.nl-ui-meta small{color:var(--l-muted);font-size:14px}
.nl-ui-selos{flex-wrap:wrap;align-content:flex-end;gap:8px}
.nl-ui-selos em{padding:10px 15px;border-radius:999px;background:var(--l-surface-2);font-size:14px;font-style:normal}

/* Janela que cresce */
.nl-expande{--p:0}
.nl-expande-stage{display:flex;flex-direction:column;align-items:center;gap:40px;padding:80px 16px}
.nl-expande h2{font-size:clamp(34px,4.6vw,62px);text-align:center}
.nl-janela{width:min(1200px,100%);border:1px solid var(--l-line);border-radius:28px;background:var(--l-surface);overflow:hidden;box-shadow:0 40px 90px var(--l-shadow)}
.nl-janela-nav{display:flex;align-items:center;gap:6px;padding:14px 18px;color:var(--l-muted);font-size:14px;overflow:hidden}
.nl-janela-nav b{margin-right:14px;color:var(--l-text);font-size:17px}
.nl-janela-nav span{padding:7px 14px;border-radius:999px}
.nl-janela-nav .is-on{background:var(--l-surface-2);color:var(--l-text)}
.nl-janela-corpo{display:flex;flex-direction:column;align-items:center;gap:4px;padding:30px clamp(16px,4vw,52px) 40px}
.nl-janela-corpo>small{color:var(--l-muted);font-size:15px}
.nl-janela-corpo>strong{font-size:clamp(38px,6vw,76px);font-weight:500;letter-spacing:-.04em}
.nl-janela-corpo svg{width:100%;height:110px;margin:12px 0 18px}
.nl-janela-grade{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;width:100%}
.nl-janela-grade p{display:grid;gap:4px;padding:16px 18px;border-radius:20px;background:var(--l-surface-2)}
.nl-janela-grade small{color:var(--l-muted);font-size:13px}
.nl-janela-grade b{font-size:clamp(15px,1.6vw,21px);font-weight:500}

/* Plano e dúvidas */
.nl-secao{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:56px;align-items:start;width:min(1120px,calc(100% - 48px));margin:0 auto;padding:110px 0}
.nl-secao header h2{font-size:clamp(34px,4.4vw,60px)}
.nl-secao header p{max-width:440px;margin-top:20px;color:var(--l-muted);font-size:18px;line-height:1.5}
.nl-plano-card{display:flex;flex-direction:column;gap:18px;padding:34px;border:1px solid var(--l-line);border-radius:32px;background:var(--l-surface)}
.nl-selo{align-self:flex-start;padding:8px 14px;border-radius:999px;background:var(--l-glow);color:var(--l-accent);font-size:13px;font-weight:600}
.nl-preco{display:flex;align-items:baseline;gap:6px}
.nl-preco strong{font-size:72px;font-weight:500;letter-spacing:-.04em}
.nl-preco small,.nl-preco span{color:var(--l-muted);font-size:18px}
.nl-plano-card ul{display:grid;gap:12px;margin:0;padding:0;list-style:none;color:var(--l-muted);font-size:16px}
.nl-plano-card li{padding-left:26px;background:linear-gradient(var(--l-accent),var(--l-accent)) 0 .55em/12px 2px no-repeat}
.nl-link{color:var(--l-muted);font-size:15px;text-align:center}
.nl-faq details{border-bottom:1px solid var(--l-line)}
.nl-faq summary{display:flex;justify-content:space-between;gap:20px;padding:22px 0;cursor:pointer;font-size:18px;font-weight:500;list-style:none}
.nl-faq summary::-webkit-details-marker{display:none}
.nl-faq summary::after{content:'+';color:var(--l-accent);font-size:24px;line-height:1;transition:transform .25s ease}
.nl-faq details[open] summary::after{transform:rotate(45deg)}
.nl-faq details p{padding:0 40px 22px 0;color:var(--l-muted);font-size:16px;line-height:1.55}

.nl-final{--p:0;display:flex;flex-direction:column;align-items:center;gap:20px;padding:120px 24px;text-align:center;background:radial-gradient(50% 70% at 50% 100%,var(--l-glow),transparent 70%)}
.nl-final h2{font-size:clamp(42px,7vw,96px)}
.nl-final p{max-width:480px;color:var(--l-muted);font-size:19px;line-height:1.5}

.nl-rodape{padding:48px 24px 0;overflow:hidden;border-top:1px solid var(--l-line)}
.nl-rodape-topo{display:flex;flex-wrap:wrap;justify-content:space-between;gap:28px;width:min(1120px,100%);margin:0 auto;color:var(--l-muted);font-size:15px}
.nl-rodape-topo p{margin-top:10px}
.nl-rodape-topo nav,.nl-rodape-legal{display:grid;gap:10px;align-content:start}
.nl-rodape a:hover{color:var(--l-text)}
.nl-marca{margin-bottom:-.2em;color:var(--l-surface-2);font-size:clamp(90px,25vw,380px);font-weight:600;letter-spacing:-.05em;line-height:1;text-align:center;user-select:none}

[data-reveal]{transition:opacity .7s cubic-bezier(.22,.8,.28,1),transform .7s cubic-bezier(.22,.8,.28,1)}
html.js [data-reveal]:not(.is-visible){opacity:0;transform:translateY(26px)}

/* Cenas fixadas: com script ativo, movimento permitido e altura suficiente.
   Celular deitado fica com a versão estática, porque as cenas não caberiam. */
@media(min-height:520px) and (prefers-reduced-motion:no-preference){
  html.js .nl-hero{height:calc(var(--vh)*230)}
  html.js .nl-hero-stage{position:sticky;top:0;display:block;height:calc(var(--vh)*100);box-sizing:border-box;padding:0}
  html.js .nl-note{position:absolute;bottom:14px;left:24px;padding:0;text-align:left}
  html.js .nl-hero-copy{position:absolute;top:clamp(104px,15vh,150px);left:50%;width:min(900px,92vw);opacity:calc(1 - var(--p)*2.4);transform:translateX(-50%) translateY(calc(var(--p)*-90px)) scale(calc(1 - var(--p)*.1))}
  html.js .nl-phone-wrap{position:absolute;top:calc(clamp(104px,15vh,150px) + 400px);left:50%;transform:translateX(-50%) translateY(calc(var(--p)*(-1)*(clamp(104px,15vh,150px) + 322px))) scale(calc(.94 + var(--p)*.06));transform-origin:top center}
  html.js .nl-float{display:inline-flex;opacity:calc(var(--p)*3 - .7)}
  html.js .nl-float-a{top:12%;right:calc(100% + 34px);transform:translateX(calc((1 - var(--p))*90px))}
  html.js .nl-float-b{top:42%;right:calc(100% + 76px);transform:translateX(calc((1 - var(--p))*150px))}
  html.js .nl-float-c{top:20%;left:calc(100% + 56px);transform:translateX(calc((var(--p) - 1)*130px))}
  html.js .nl-float-d{top:52%;left:calc(100% + 26px);transform:translateX(calc((var(--p) - 1)*80px))}

  html.js .nl-frase{height:calc(var(--vh)*210)}
  html.js .nl-frase-stage{position:sticky;top:0;height:calc(var(--vh)*100);box-sizing:border-box;padding:0 24px}

  html.js .nl-passos{height:calc(var(--vh)*440)}
  html.js .nl-passos-stage{position:sticky;top:0;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;width:min(1320px,100%);height:calc(var(--vh)*100);margin:0 auto;box-sizing:border-box;padding:0 clamp(24px,5vw,64px)}
  html.js .nl-passos-copy{display:block;position:relative;height:340px}
  html.js .nl-passos-copy article{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;opacity:0;transform:translateY(22px);transition:opacity .4s ease,transform .55s cubic-bezier(.22,.8,.28,1);pointer-events:none}
  html.js .nl-passos-copy article.is-active{opacity:1;transform:none}
  html.js .nl-bussola{display:block;justify-self:center}
  html.js .nl-segmentos{position:absolute;right:clamp(24px,5vw,64px);bottom:34px;left:clamp(24px,5vw,64px);display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
  .nl-segmentos i{position:relative;height:2px;background:var(--l-line);overflow:hidden}
  .nl-segmentos i::after{content:'';position:absolute;inset:0;background:var(--l-text);transform:scaleX(var(--s,0));transform-origin:left}

  html.js .nl-galeria{padding:0}
  html.js .nl-galeria-stage{position:sticky;top:0;display:flex;align-items:center;height:calc(var(--vh)*100);overflow:hidden}
  html.js .nl-galeria-trilho{width:max-content;padding:0 clamp(24px,5vw,64px);overflow:visible;transform:translate3d(calc(var(--p)*var(--distancia,0px)*-1),0,0);will-change:transform}
  html.js .nl-galeria-trilho>header{width:min(560px,40vw);margin-right:40px}

  html.js .nl-expande{height:calc(var(--vh)*220)}
  html.js .nl-expande-stage{position:sticky;top:0;justify-content:center;height:calc(var(--vh)*100);box-sizing:border-box;padding:0 16px;overflow:hidden}
  html.js .nl-expande h2{position:absolute;top:13vh;opacity:calc(1 - var(--p)*2.6);transform:translateY(calc(var(--p)*-40px))}
  html.js .nl-janela{transform:translateY(calc((1 - var(--p))*13vh)) scale(calc(.68 + var(--p)*.32))}

}

@media(max-width:1180px){.nl-float{max-width:210px}html.js .nl-float-b,html.js .nl-float-d{display:none}}
@media(max-width:800px){
  .nl-nav{gap:10px;padding-left:16px}
  .nl-nav nav,.nl-theme{display:none}
  .nl-nav-actions .nl-pill{min-height:38px;padding:0 14px;font-size:14px}
  .nl-nav-actions{margin-left:auto}
  .nl-hero-stage{padding-top:120px}
  .nl-phone-screen{min-height:560px}
  .nl-secao{grid-template-columns:1fr;gap:32px;padding:72px 0}
  .nl-janela-grade{grid-template-columns:repeat(2,minmax(0,1fr))}
  .nl-janela-nav span:nth-of-type(n+4){display:none}
  .nl-galeria-trilho article{min-height:430px}
  .nl-frase-stage{padding:80px 24px}
}
/* Evita ver o título pronto antes da escrita. O atraso libera o texto caso o
   script não chegue a rodar. */
@media(prefers-reduced-motion:no-preference){
  html.js .nl-hero-copy h1:not(.is-pronto){visibility:hidden;animation:nl-mostrar 0s 2s forwards}
}
@keyframes nl-mostrar{to{visibility:visible}}
/* As mesmas cenas no celular, redistribuídas para a tela em pé. */
@media(max-width:800px) and (min-height:520px) and (prefers-reduced-motion:no-preference){
  html.js .nl-hero{--topo:clamp(470px,calc(var(--vh)*60),560px);height:calc(var(--vh)*210)}
  html.js .nl-hero-copy{top:92px;gap:16px;width:calc(100% - 32px)}
  html.js .nl-hero-copy h1{font-size:clamp(38px,11.4vw,54px)}
  html.js .nl-hero-copy p{font-size:16px}
  html.js .nl-phone-wrap{top:var(--topo);width:330px;will-change:transform;transform:translateX(-50%) translateY(calc(var(--p)*-1*(var(--topo) - 84px))) scale(calc(.74 + var(--p)*.06))}
  html.js .nl-float-a{top:12%;right:auto;left:-72px;transform:translateX(calc((1 - var(--p))*-130px))}
  html.js .nl-float-c{top:41%;right:-72px;left:auto;transform:translateX(calc((1 - var(--p))*130px))}
  html.js .nl-note{right:auto;bottom:10px;left:50%;padding:3px 12px;border-radius:999px;background:var(--l-bg);font-size:12px;white-space:nowrap;transform:translateX(-50%)}

  html.js .nl-frase-stage{padding:0 22px}

  html.js .nl-passos{height:calc(var(--vh)*400)}
  html.js .nl-passos-stage{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);align-items:start;gap:16px;padding:84px 24px 44px}
  html.js .nl-bussola{order:-1;width:min(76vw,calc(var(--vh)*40))}
  html.js .nl-passos-copy{height:100%}
  html.js .nl-passos-copy article{justify-content:flex-start}
  html.js .nl-passos-copy span{margin-bottom:8px}
  html.js .nl-passos-copy h2{font-size:clamp(27px,7.6vw,34px)}
  html.js .nl-passos-copy p{margin-top:10px;font-size:16px}
  html.js .nl-bussola-cards div{right:-7%;bottom:-3%;min-width:0;padding:10px 14px;border-radius:16px}
  html.js .nl-bussola-cards small{font-size:12px}
  html.js .nl-bussola-cards strong{font-size:17px}
  html.js .nl-bussola-cards b{font-size:12px}
  html.js .nl-segmentos{right:24px;bottom:22px;left:24px;gap:8px}

  html.js .nl-galeria-stage{box-sizing:border-box;padding-top:44px}
  html.js .nl-galeria-trilho{gap:12px;padding:0 16px}
  html.js .nl-galeria-trilho>header{width:82vw;margin-right:6px}
  html.js .nl-galeria-trilho article{width:82vw;min-height:min(430px,calc(var(--vh)*68));padding:24px;border-radius:26px}

  html.js .nl-expande h2{top:calc(var(--vh)*15);padding:0 20px;font-size:clamp(28px,8vw,36px)}
  html.js .nl-janela{will-change:transform}
}
@media(max-width:350px){
  .nl-brand span{display:none}
}
@media(max-width:360px) and (min-height:520px) and (prefers-reduced-motion:no-preference){
  html.js .nl-float-a{left:-40px}
  html.js .nl-float-c{right:-40px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .nl-pill-brilho::before{opacity:.25}
  .nl-frase span{opacity:1}
  .nl-bussola-cards div{transition:none}
  [data-reveal]{transition:none}
}

/* Telas baixas de notebook: o celular precisa caber inteiro no centro. */
@media(min-width:801px) and (min-height:520px) and (max-height:780px) and (prefers-reduced-motion:no-preference){
  html.js .nl-phone-wrap{transform:translateX(-50%) translateY(calc(var(--p)*(-1)*(clamp(104px,15vh,150px) + 322px))) scale(calc((.94 + var(--p)*.06)*.78))}
}