/* ==========================================================================
   LAUNCH — design tokens
   Paleta: ignição (âmbar) + sinal técnico (ciano) sobre tinta quase-preta
   Display: Space Grotesk · Corpo: Inter · Dados/labels: IBM Plex Mono
   ========================================================================== */
:root{
  --ink-900:#0A0C11;
  --ink-850:#0F131A;
  --ink-800:#151A22;
  --ink-700:#1C222D;
  --ink-600:#2A3140;
  --line:#2A3140;

  --paper:#F2EFE8;
  --muted:#8B93A7;
  --muted-2:#5D6577;

  --amber:#FF7A1A;
  --amber-soft:#FFB37A;
  --cyan:#4FE3C1;

  --container:1280px;
  --header-h:84px;
  --rail-h:64px;

  --ease-slide: cubic-bezier(.65,0,.35,1);
  --dur-slide: 850ms;

  --font-display:'Space Grotesk', system-ui, sans-serif;
  --font-body:'Inter', system-ui, sans-serif;
  --font-mono:'IBM Plex Mono', ui-monospace, monospace;
}

*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0;
  background:var(--ink-900);
  color:var(--paper);
  font-family:var(--font-body);
  overflow:hidden; /* o scroll é controlado via JS/transform, não pelo documento */
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{ font-family:var(--font-display); margin:0; letter-spacing:-0.01em; }
p{ margin:0; }
button{ font-family:inherit; cursor:pointer; }
::selection{ background:var(--amber); color:var(--ink-900); }

.container{
  width:100%;
  max-width:var(--container);
  margin:0 auto;
  padding:0 32px;
}

/* ==========================================================================
   Fundo panorâmico fixo
   Camada position:fixed cobre a viewport inteira e NUNCA sai de cena.
   Dentro dela, .bg-panorama é mais larga (slideCount * 100vw) e desliza em
   translateX EXATAMENTE em sincronia com o slider de conteúdo — por isso
   cada tela revela sua fatia certa, sem parallax, sem esticar, sem corte.

   Para produção: troque o gradiente por
     background-image: url('../img/panorama-bg.jpg');
   Imagem única recomendada: 1920px * nº de telas de largura x 1080px de altura
   (ex.: 5 telas => 9600 x 1080px), background-size: 100% 100%.
   ========================================================================== */
.bg-fixed-layer{
  position:fixed;
  inset:0;
  width:100vw;
  height:100vh;
  overflow:hidden;
  z-index:0;
}
.bg-panorama{
  position:absolute;
  top:0; left:0;
  height:100%;
  width:500vw; /* = slideCount * 100vw, ajustado via JS se slideCount mudar */
  will-change:transform;
  transition:transform var(--dur-slide) var(--ease-slide);
  background:
    radial-gradient(1200px 800px at 8% 20%, rgba(255,122,26,.20), transparent 60%),
    radial-gradient(900px 700px at 28% 80%, rgba(79,227,193,.14), transparent 60%),
    radial-gradient(1100px 900px at 48% 15%, rgba(255,122,26,.16), transparent 60%),
    radial-gradient(1000px 800px at 68% 75%, rgba(79,227,193,.18), transparent 60%),
    radial-gradient(1300px 900px at 88% 30%, rgba(255,122,26,.22), transparent 60%),
    linear-gradient(180deg, var(--ink-850) 0%, var(--ink-900) 55%, #060709 100%);
  background-size: 100% 100%;
}
.bg-noise{
  position:absolute; inset:0;
  opacity:.035;
  mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.bg-vignette{
  position:absolute; inset:0;
  background:radial-gradient(120% 100% at 50% 50%, transparent 40%, rgba(6,7,9,.55) 100%);
}

/* Linha visual única, curva e fixa, atravessando toda a experiência. */
.golden-continuity-line{
  position:fixed;
  z-index:6;
  left:0;
  right:0;
  top:62%;
  width:100%;
  height:180px;
  pointer-events:none;
  overflow:visible;
}
.golden-continuity-line path{
  fill:none;
  vector-effect:non-scaling-stroke;
}
.gold-line-glow{
  stroke:#d99b31;
  stroke-width:8;
  opacity:.24;
  filter:url(#goldGlow);
}
.gold-line-main{
  stroke:url(#goldLine);
  stroke-width:1.35;
}
.gold-line-travel{
  stroke:#fff0b2;
  stroke-width:3.2;
  stroke-linecap:round;
  stroke-dasharray:85 1900;
  filter:url(#goldGlow);
  animation:goldenFlow 8s linear infinite;
}
@keyframes goldenFlow{
  from{ stroke-dashoffset:0; }
  to{ stroke-dashoffset:-1985; }
}

/* ==========================================================================
   Header — logo à esquerda, menu, tudo dentro do container central
   ========================================================================== */
.site-header{
  position:fixed;
  top:0; left:0; right:0;
  height:var(--header-h);
  z-index:50;
  background:linear-gradient(180deg, rgba(10,12,17,.9), rgba(10,12,17,.55) 70%, transparent);
  backdrop-filter:blur(6px);
}
.header-inner{
  max-width:var(--container);
  margin:0 auto;
  height:100%;
  padding:0 32px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}
.logo{
  font-family:var(--font-display);
  font-size:20px;
  font-weight:700;
  letter-spacing:.02em;
  color:var(--paper);
  text-decoration:none;
  display:flex;
  align-items:center;
  flex-shrink:0;
}
.logo img{
  display:block;
  width:168px;
  height:auto;
  max-height:90px;
  object-fit:contain;
}
.logo-dot{ color:var(--amber); margin-left:2px; }

.main-nav{
  display:flex;
  align-items:center;
  gap:6px;
}
.nav-link{
  background:transparent;
  border:none;
  color:var(--muted);
  font-family:var(--font-body);
  font-size:14px;
  font-weight:500;
  padding:9px 14px;
  border-radius:999px;
  display:flex;
  align-items:center;
  gap:8px;
  transition:color .2s ease, background .2s ease;
  white-space:nowrap;
}
.nav-code{
  font-family:var(--font-mono);
  font-size:10px;
  color:var(--amber);
  opacity:.7;
}
.nav-link:hover{ color:var(--paper); background:rgba(255,255,255,.05); }
.nav-link.active{ color:var(--ink-900); background:var(--paper); }
.nav-link.active .nav-code{ color:var(--amber); opacity:1; }

.nav-toggle{
  display:none;
  background:rgba(255,255,255,.06);
  border:1px solid var(--line);
  color:var(--paper);
  width:40px; height:40px;
  border-radius:10px;
  align-items:center;
  justify-content:center;
  font-size:18px;
}
.nav-toggle-icon{
  width:24px;
  height:24px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
}

/* ==========================================================================
   Slider horizontal
   ========================================================================== */
.slider{
  position:relative;
  z-index:10;
  width:100vw;
  height:100vh;
  overflow:hidden;
}
.slider-track{
  display:flex;
  height:100%;
  will-change:transform;
  transition:transform var(--dur-slide) var(--ease-slide);
}
.slide{
  flex:0 0 100vw;
  width:100vw;
  height:100vh;
  display:flex;
  align-items:center;
}
.slide-inner{
  padding-top:var(--header-h);
  padding-bottom:var(--rail-h);
}

.eyebrow{
  display:flex;
  align-items:center;
  gap:8px;
  font-family:var(--font-mono);
  font-size:13px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--amber);
  margin-bottom:20px;
}
.eyebrow i{ font-size:16px; }

.hero-title{
  font-size:clamp(34px, 5.4vw, 72px);
  line-height:1.04;
  font-weight:700;
  max-width:16ch;
  margin-bottom:20px;
}
.hero-sub{
  font-size:clamp(14px, 1.2vw, 17px);
  line-height:1.55;
  color:var(--muted);
  max-width:44ch;
  margin-bottom:28px;
}
.section-title{
  font-size:clamp(32px, 4.4vw, 56px);
  line-height:1.05;
  font-weight:700;
  max-width:20ch;
  margin-bottom:44px;
}

/* Contador regressivo — tela inicial */
.countdown{
  display:flex;
  align-items:center;
  gap:18px;
  margin-bottom:32px;
  flex-wrap:wrap;
}
.countdown-block{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:4px;
  min-width:52px;
}
.countdown-num{
  font-family:var(--font-display);
  font-size:clamp(28px, 3.4vw, 42px);
  font-weight:700;
  line-height:1;
  color:var(--paper);
  font-variant-numeric:tabular-nums;
}
.countdown-label{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--muted);
}
.countdown-divider{
  width:28px;
  height:2px;
  background:var(--amber);
  border-radius:2px;
  flex-shrink:0;
  margin-bottom:16px;
  align-self:flex-end;
}

.hero-actions{ display:flex; gap:14px; flex-wrap:wrap; }

/* Hero Ünnishop — conteúdo comercial + demonstração real em iframe */
.hero-layout{
  display:grid;
  grid-template-columns:minmax(0, .9fr) minmax(460px, 1.1fr);
  align-items:center;
  gap:24px;
}
.hero-copy{
  position:relative;
  z-index:3;
}
.hero-layout .hero-title{
  max-width:13ch;
  font-size:clamp(38px, 4.4vw, 68px);
}
.hero-visual{
  position:relative;
  align-self:stretch;
  min-height:min(760px, calc(100vh - var(--header-h) - var(--rail-h)));
  display:flex;
  align-items:center;
  justify-content:center;
  isolation:isolate;
}
.hero-furniture{
  position:absolute;
  z-index:0;
  right:-31vw;
  bottom:-5vh;
  width:min(1050px, 75vw);
  max-width:none;
  height:auto;
  pointer-events:none;
  user-select:none;
  filter:drop-shadow(0 28px 36px rgba(0,0,0,.28));
}
.mobile-hero-scene{ display:none; }
.hero-gold-line{
  position:absolute;
  z-index:1;
  top:61%;
  left:-42vw;
  width:145vw;
  height:180px;
  overflow:visible;
  pointer-events:none;
}
.hero-gold-line path{
  fill:none;
  vector-effect:non-scaling-stroke;
}
.hero-gold-glow{ stroke:#d99b31; stroke-width:8; opacity:.30; filter:url(#goldGlow); }
.hero-gold-main{ stroke:#f0c96f; stroke-width:1.45; }
.hero-gold-travel{
  stroke:#fff0b2;
  stroke-width:3.2;
  stroke-linecap:round;
  stroke-dasharray:85 1900;
  filter:url(#goldGlow);
  animation:goldenFlow 8s linear infinite;
}
.phone-stage{
  position:relative;
  z-index:2;
  width:min(310px, 23vw);
  aspect-ratio:9 / 19.5;
  transform:translate(-6vw, 3vh);
  filter:drop-shadow(0 28px 38px rgba(0,0,0,.42));
}
.try-callout{
  position:absolute;
  z-index:4;
  top:29%;
  right:-12vw;
  width:235px;
  color:var(--paper);
  pointer-events:none;
}
.try-callout svg{
  display:block;
  width:210px;
  height:92px;
  margin-left:-112px;
  margin-bottom:-18px;
  overflow:visible;
}
.try-callout path{
  fill:none;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.try-arrow-shadow{
  stroke:rgba(255,122,26,.28);
  stroke-width:8;
  filter:blur(5px);
}
.try-arrow-main,
.try-arrow-head{
  stroke:#f6efe5;
  stroke-width:2.2;
  stroke-dasharray:320;
  stroke-dashoffset:320;
  animation:drawTryArrow 1.6s .5s cubic-bezier(.22,.8,.3,1) forwards;
}
.try-callout-copy{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding-left:8px;
}
.try-callout-copy strong{
  color:#fff;
  font-family:var(--font-display);
  font-size:21px;
  line-height:1;
}
.try-callout-copy span{
  max-width:20ch;
  color:#aeb5c3;
  font-size:11px;
  line-height:1.4;
}
@keyframes drawTryArrow{
  to{ stroke-dashoffset:0; }
}
.phone-metal{
  position:absolute;
  inset:0;
  z-index:2;
  padding:10px;
  border:2px solid #a9aaae;
  border-radius:clamp(42px, 4vw, 62px);
  background:
    linear-gradient(115deg, #f4f4f5 0%, #777980 8%, #191a1e 17%, #050506 48%, #24252a 83%, #999ba1 93%, #ececef 100%);
  box-shadow:
    inset 0 0 0 2px rgba(255,255,255,.15),
    inset 0 0 0 5px #070708,
    inset 0 0 18px rgba(255,255,255,.08),
    0 0 0 1px rgba(0,0,0,.9),
    0 34px 65px rgba(0,0,0,.52);
}
.phone-screen{
  position:relative;
  z-index:1;
  width:100%;
  height:100%;
  overflow:hidden;
  border:3px solid #050506;
  border-radius:clamp(34px, 3.2vw, 51px);
  background:#f4f0e8;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);
}
.phone-screen iframe{
  display:block;
  width:100%;
  height:100%;
  border:0;
  background:#f4f0e8;
}
.whatsapp-shell{
  width:100%;
  height:100%;
  display:flex;
  flex-direction:column;
  background:#efeae2;
}
.whatsapp-header{
  position:relative;
  z-index:3;
  flex:0 0 58px;
  min-width:0;
  padding:15px 8px 7px;
  display:flex;
  align-items:center;
  gap:5px;
  color:#fff;
  background:linear-gradient(135deg, #075e54, #087f6e);
  box-shadow:0 2px 8px rgba(0,0,0,.16);
}
.whatsapp-back{
  display:grid;
  place-items:center;
  width:17px;
  font-size:16px;
}
.whatsapp-avatar{
  flex:0 0 40px;
  width:40px;
  height:40px;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#ff9f00;
  background:#202124;
  font-family:var(--font-display);
  font-size:18px;
  font-weight:800;
}
.whatsapp-contact{
  min-width:0;
  flex:1;
  display:flex;
  flex-direction:column;
  line-height:1.05;
}
.whatsapp-contact strong{
  display:flex;
  align-items:center;
  gap:3px;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  font-size:15px;
}
.whatsapp-contact strong i{
  color:#5ee47b;
  font-size:11px;
}
.whatsapp-contact small{
  margin-top:3px;
  font-size:11px;
  opacity:.82;
}
.whatsapp-actions{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:13px;
}
.whatsapp-chat{
  min-height:0;
  flex:1;
  overflow:hidden;
  background:#efeae2;
}
.whatsapp-chat iframe{
  height:100% !important;
}
.phone-speaker{
  position:absolute;
  z-index:4;
  top:16px;
  left:50%;
  width:19%;
  height:5px;
  border-radius:99px;
  transform:translateX(-50%);
  background:#08090a;
  box-shadow:inset 0 1px 1px rgba(255,255,255,.12);
}
.phone-camera{
  position:absolute;
  z-index:4;
  top:14px;
  left:61.5%;
  width:8px;
  height:8px;
  border-radius:50%;
  background:radial-gradient(circle at 38% 35%, #315987, #08111e 45%, #020305 72%);
  box-shadow:0 0 0 2px #08090a;
}
.phone-button{
  position:absolute;
  z-index:1;
  display:block;
  background:linear-gradient(90deg, #27282d, #9b9ca1 50%, #202126);
  border:1px solid #09090a;
  box-shadow:0 2px 3px rgba(0,0,0,.35);
}
.phone-button-silent{
  left:-5px;
  top:16%;
  width:6px;
  height:6%;
  border-radius:4px 0 0 4px;
}
.phone-button-volume-up,
.phone-button-volume-down{
  left:-6px;
  width:7px;
  height:9%;
  border-radius:4px 0 0 4px;
}
.phone-button-volume-up{ top:26%; }
.phone-button-volume-down{ top:37%; }
.phone-button-power{
  right:-6px;
  top:28%;
  width:7px;
  height:15%;
  border-radius:0 4px 4px 0;
}

.btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  border-radius:999px;
  padding:15px 26px;
  font-size:15px;
  font-weight:600;
  border:1px solid transparent;
  transition:transform .18s ease, background .18s ease, border-color .18s ease;
}
.btn:active{ transform:scale(.97); }
.btn-primary{
  background:var(--amber);
  color:var(--ink-900);
}
.btn-primary:hover{ background:var(--amber-soft); }
.btn-ghost{
  background:transparent;
  color:var(--paper);
  border-color:var(--line);
}
.btn-ghost:hover{ border-color:var(--paper); }

/* ==========================================================================
   TELA 02 — BENEFÍCIOS E COMO FUNCIONA
   ========================================================================== */
.benefit-layout{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0, 1.02fr) minmax(420px, .98fr);
  align-items:center;
  gap:18px;
}
.benefit-copy{
  position:relative;
  z-index:3;
  max-width:720px;
}
.benefit-layout .section-title{
  max-width:13ch;
  margin-bottom:16px;
  font-size:clamp(38px, 4.2vw, 62px);
}
.benefit-intro{
  max-width:61ch;
  margin-bottom:22px;
  color:#b7bdc9;
  font-size:14px;
  line-height:1.58;
}
.benefit-cards{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
  max-width:670px;
}
.benefit-card{
  position:relative;
  min-height:112px;
  padding:16px;
  display:flex;
  align-items:flex-start;
  gap:12px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.075);
  border-radius:16px;
  background:linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.018));
  box-shadow:0 16px 36px rgba(0,0,0,.12);
  backdrop-filter:blur(9px);
  transition:transform .22s ease, border-color .22s ease, background .22s ease;
}
.benefit-card::after{
  content:"";
  position:absolute;
  right:-34px;
  bottom:-40px;
  width:92px;
  height:92px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(79,227,193,.10), transparent 68%);
}
.benefit-card:hover{
  transform:translateY(-3px);
  border-color:rgba(79,227,193,.30);
  background:linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.025));
}
.benefit-card-featured{
  border-color:rgba(235,185,76,.27);
  background:linear-gradient(145deg, rgba(235,185,76,.11), rgba(255,255,255,.02));
}
.feature-icon{
  flex:0 0 38px;
  width:38px;
  height:38px;
  border:1px solid rgba(79,227,193,.20);
  border-radius:11px;
  display:grid;
  place-items:center;
  color:var(--cyan);
  background:rgba(79,227,193,.08);
  font-size:20px;
}
.feature-icon svg{
  width:21px;
  height:21px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.benefit-card-featured .feature-icon{
  color:#f4cf7b;
  border-color:rgba(244,207,123,.24);
  background:rgba(244,207,123,.09);
}
.benefit-card h3{
  margin:1px 0 5px;
  color:var(--paper);
  font-size:14px;
}
.benefit-card p{
  color:var(--muted);
  font-size:11.5px;
  line-height:1.45;
}
.benefit-visual{
  position:relative;
  align-self:stretch;
  min-height:min(760px, calc(100vh - var(--header-h) - var(--rail-h)));
  pointer-events:none;
  isolation:isolate;
}
.benefit-visual::before{
  content:"";
  position:absolute;
  z-index:-2;
  top:12%;
  left:5%;
  width:72%;
  aspect-ratio:1;
  border-radius:50%;
  background:radial-gradient(circle, rgba(79,227,193,.13), rgba(255,122,26,.05) 40%, transparent 69%);
  filter:blur(5px);
}
.benefit-visual img{
  position:absolute;
  z-index:2;
  right:-28vw;
  bottom:-8vh;
  width:min(1120px, 79vw);
  max-width:none;
  height:auto;
  filter:drop-shadow(0 28px 38px rgba(0,0,0,.34));
}
.benefit-mobile-image{ display:none; }
.benefit-orbit{
  position:absolute;
  z-index:1;
  border:1px solid rgba(247,220,141,.20);
  border-radius:50%;
  transform:rotate(-18deg);
}
.benefit-orbit-one{
  right:-2vw;
  top:22%;
  width:410px;
  height:190px;
}
.benefit-orbit-two{
  right:-8vw;
  top:18%;
  width:510px;
  height:250px;
  border-color:rgba(79,227,193,.10);
}

/* ==========================================================================
   TELA 03 — ATENDIMENTO
   ========================================================================== */
.service-layout{
  display:grid;
  grid-template-columns:minmax(340px, .72fr) minmax(560px, 1.28fr);
  align-items:center;
  gap:64px;
}
.service-heading .section-title{ max-width:12ch; margin-bottom:20px; }
.service-intro{
  max-width:46ch;
  color:#aeb5c3;
  font-size:15px;
  line-height:1.65;
}
.service-cards{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:16px;
}
.service-card{
  position:relative;
  min-height:205px;
  padding:24px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.085);
  border-radius:22px;
  background:linear-gradient(145deg, rgba(255,255,255,.065), rgba(255,255,255,.018));
  box-shadow:0 22px 48px rgba(0,0,0,.18);
  backdrop-filter:blur(10px);
  transition:transform .22s ease, border-color .22s ease;
}
.service-card:hover{ transform:translateY(-4px); border-color:rgba(79,227,193,.30); }
.service-card-highlight{
  border-color:rgba(244,207,123,.28);
  background:linear-gradient(145deg, rgba(244,207,123,.12), rgba(255,255,255,.02));
}
.service-icon{
  width:48px;
  height:48px;
  margin-bottom:28px;
  border:1px solid rgba(79,227,193,.22);
  border-radius:14px;
  display:grid;
  place-items:center;
  color:var(--cyan);
  background:rgba(79,227,193,.08);
}
.service-card-highlight .service-icon{ color:#f4cf7b; border-color:rgba(244,207,123,.25); background:rgba(244,207,123,.09); }
.service-icon svg{
  width:25px;
  height:25px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.service-number{
  position:absolute;
  top:25px;
  right:24px;
  color:rgba(255,255,255,.18);
  font-family:var(--font-mono);
  font-size:12px;
}
.service-card h3{ margin-bottom:9px; font-size:18px; }
.service-card p{ color:var(--muted); font-size:13px; line-height:1.55; }

/* ==========================================================================
   TELA 04 — AVISE-ME
   Formulário horizontal compacto em duas colunas
   ========================================================================== */
.notify-layout{
  transform:translateY(24px);
}
.notify-layout .eyebrow{ margin-bottom:12px; }
.notify-layout .section-title{
  max-width:18ch;
  margin-bottom:12px;
  font-size:clamp(34px, 3.7vw, 52px);
}
.notify-layout > .hero-sub{
  margin-bottom:20px;
}
.notify-form{
  display:grid;
  grid-template-columns:minmax(280px, .78fr) minmax(460px, 1.22fr);
  grid-template-rows:auto auto auto;
  column-gap:24px;
  row-gap:12px;
  max-width:920px;
  margin-bottom:10px;
  padding:20px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:22px;
  background:linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.015));
  box-shadow:0 22px 52px rgba(0,0,0,.18);
  backdrop-filter:blur(10px);
}
.form-trap{
  position:absolute !important;
  left:-10000px !important;
  top:auto !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}
.notify-form .form-field{ display:flex; flex-direction:column; gap:7px; }
.notify-form .form-name{ grid-column:1; grid-row:1; }
.notify-form .form-whatsapp{ grid-column:1; grid-row:2; }
.notify-form .form-interests{ grid-column:2; grid-row:1 / span 2; }
.notify-form .consent-row{ grid-column:2; grid-row:3; align-self:center; }
.notify-form .btn-block{ grid-column:1; grid-row:3; align-self:center; }
.field-label{
  font-size:13px;
  font-weight:600;
  color:var(--paper);
}
.input-wrap{
  display:flex;
  align-items:center;
  gap:10px;
  background:rgba(255,255,255,.04);
  border:1px solid var(--line);
  border-radius:999px;
  padding:0 18px;
  transition:border-color .18s ease;
}
.input-wrap:focus-within{ border-color:var(--amber); }
.input-wrap i{ color:var(--muted); font-size:18px; }
.input-wrap input{
  flex:1;
  min-width:0;
  background:transparent;
  border:none;
  outline:none;
  color:var(--paper);
  font-size:15px;
  padding:14px 0;
  font-family:var(--font-body);
}
.input-wrap input::placeholder{ color:var(--muted-2); }

/* Chips — seleção múltipla de interesses */
.chips{ display:flex; flex-wrap:wrap; gap:10px; }
.chip{
  background:rgba(255,255,255,.04);
  border:1px solid var(--line);
  color:var(--paper);
  font-size:13px;
  font-weight:500;
  padding:9px 14px;
  border-radius:999px;
  transition:background .18s ease, border-color .18s ease, color .18s ease;
}
.chip:hover{ border-color:var(--muted); }
.chip.active{
  background:var(--amber);
  border-color:var(--amber);
  color:var(--ink-900);
  font-weight:600;
}

/* Checkbox de consentimento — custom */
.consent-row{
  display:flex;
  align-items:flex-start;
  gap:12px;
  cursor:pointer;
}
.consent-row input[type="checkbox"]{
  position:absolute;
  opacity:0;
  width:0; height:0;
}
.consent-box{
  flex-shrink:0;
  width:20px; height:20px;
  border-radius:6px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.04);
  display:flex; align-items:center; justify-content:center;
  color:transparent;
  font-size:13px;
  margin-top:1px;
  transition:background .18s ease, border-color .18s ease, color .18s ease;
}
.consent-row input[type="checkbox"]:checked + .consent-box{
  background:var(--amber);
  border-color:var(--amber);
  color:var(--ink-900);
}
.consent-row input[type="checkbox"]:focus-visible + .consent-box{
  outline:2px solid var(--cyan);
  outline-offset:2px;
}
.consent-text{
  font-size:13px;
  line-height:1.5;
  color:var(--muted);
}
.consent-text strong{ color:var(--paper); }

.btn-block{ justify-content:center; width:100%; }

.form-note{
  display:flex; align-items:center; gap:6px;
  font-size:12.5px; color:var(--muted-2);
}

/* ==========================================================================
   TELA 05 — INFORMAÇÕES E CANAIS OFICIAIS
   ========================================================================== */
.final-layout{
  display:grid;
  grid-template-columns:minmax(320px, .72fr) minmax(620px, 1.28fr);
  align-items:center;
  gap:62px;
}
.final-heading .section-title{
  max-width:11ch;
  margin-bottom:20px;
}
.final-intro{
  max-width:43ch;
  color:#aeb5c3;
  font-size:15px;
  line-height:1.65;
}
.final-content{ min-width:0; }
.info-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:12px;
  max-width:none;
  margin-bottom:14px;
}
.info-item{
  position:relative;
  min-height:192px;
  border:1px solid var(--line);
  border-radius:20px;
  padding:20px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  background:linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.015));
  box-shadow:0 20px 45px rgba(0,0,0,.14);
  backdrop-filter:blur(9px);
}
.info-item-date{
  border-color:rgba(244,207,123,.27);
  background:linear-gradient(145deg, rgba(244,207,123,.11), rgba(255,255,255,.018));
}
.info-icon{
  width:42px;
  height:42px;
  margin-bottom:22px;
  border:1px solid rgba(79,227,193,.22);
  border-radius:12px;
  display:grid;
  place-items:center;
  color:var(--cyan);
  background:rgba(79,227,193,.075);
}
.info-item-date .info-icon{
  color:#f4cf7b;
  border-color:rgba(244,207,123,.25);
  background:rgba(244,207,123,.08);
}
.info-icon svg{
  width:22px;
  height:22px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.info-label{
  display:block;
  font-family:var(--font-mono);
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:var(--cyan);
  margin-bottom:7px;
}
.info-item-date .info-label{ color:#f4cf7b; }
.info-value{
  color:var(--paper);
  font-family:var(--font-display);
  font-size:16px;
  font-weight:650;
  line-height:1.25;
}
.info-item small{
  margin-top:8px;
  color:var(--muted);
  font-size:10.5px;
  line-height:1.45;
}
.info-link{ text-decoration:none; transition:color .18s ease; }
.info-link:hover{ color:var(--cyan); }
.official-channels{
  padding:15px 16px;
  border:1px solid rgba(255,255,255,.075);
  border-radius:18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  background:rgba(255,255,255,.025);
  backdrop-filter:blur(9px);
}
.channels-copy{
  flex:0 0 145px;
  display:flex;
  flex-direction:column;
  gap:4px;
}
.channels-copy span{
  color:var(--amber);
  font-family:var(--font-mono);
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.channels-copy strong{ font-size:13px; line-height:1.3; }
.channel-links{ min-width:0; display:flex; gap:8px; }
.channel-link{
  min-width:0;
  padding:9px 10px;
  border:1px solid rgba(255,255,255,.075);
  border-radius:12px;
  display:flex;
  align-items:center;
  gap:8px;
  color:var(--paper);
  background:rgba(255,255,255,.025);
  text-decoration:none;
  transition:transform .18s ease, border-color .18s ease, background .18s ease;
}
.channel-link:hover{ transform:translateY(-2px); border-color:rgba(255,255,255,.20); background:rgba(255,255,255,.05); }
.channel-link > svg{
  flex:0 0 22px;
  width:22px;
  height:22px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.channel-link span{ min-width:0; display:flex; flex-direction:column; }
.channel-link small{ color:var(--muted); font-size:8px; }
.channel-link strong{ overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:10px; }
.channel-instagram > svg{ color:#e968a4; }
.channel-facebook > svg{ color:#6ba4ff; }
.channel-whatsapp > svg{ color:#53df83; }
.final-actions{
  margin-top:14px;
  display:flex;
  align-items:center;
  gap:10px;
}
.final-actions .btn{ padding:12px 18px; font-size:12px; }
.final-actions .btn svg{
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.site-link{
  margin-left:auto;
  color:var(--muted);
  font-size:11px;
  text-decoration:none;
  transition:color .18s ease;
}
.site-link:hover{ color:var(--paper); }

/* ==========================================================================
   Setas + trilho inferior (indicador estilo painel de lançamento)
   ========================================================================== */
.arrow{
  position:fixed;
  top:50%;
  transform:translateY(-50%);
  z-index:40;
  width:48px; height:48px;
  border-radius:50%;
  background:rgba(255,255,255,.06);
  border:1px solid var(--line);
  color:var(--paper);
  display:flex; align-items:center; justify-content:center;
  font-size:20px;
  backdrop-filter:blur(6px);
  transition:background .2s ease, opacity .2s ease, border-color .2s ease;
}
.arrow:hover{ background:rgba(255,255,255,.12); border-color:var(--amber); }
.arrow:disabled{ opacity:.25; pointer-events:none; }
.arrow-prev{ left:24px; }
.arrow-next{ right:24px; }
.arrow svg{
  display:block;
  width:23px;
  height:23px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.rail{
  position:fixed;
  bottom:22px;
  left:50%;
  transform:translateX(-50%);
  z-index:40;
  display:flex;
  gap:10px;
  background:rgba(15,19,26,.7);
  border:1px solid var(--line);
  padding:8px;
  border-radius:999px;
  backdrop-filter:blur(8px);
}
.rail-dot{
  width:34px; height:34px;
  border-radius:50%;
  border:none;
  background:transparent;
  color:var(--muted-2);
  font-family:var(--font-mono);
  font-size:10px;
  display:flex; align-items:center; justify-content:center;
  transition:background .2s ease, color .2s ease;
}
.rail-dot.active{ background:var(--amber); color:var(--ink-900); font-weight:600; }
.rail-dot:not(.active):hover{ background:rgba(255,255,255,.08); color:var(--paper); }
.rail-marker{
  width:5px;
  height:5px;
  border-radius:50%;
  background:currentColor;
}

/* ==========================================================================
   Responsivo
   ========================================================================== */
@media (max-width: 900px){
  .main-nav{
    position:fixed;
    top:var(--header-h);
    left:0; right:0;
    flex-direction:column;
    align-items:stretch;
    background:var(--ink-850);
    border-bottom:1px solid var(--line);
    padding:10px 20px 18px;
    gap:2px;
    transform:translateY(-130%);
    transition:transform .3s ease;
    z-index:49;
  }
  .main-nav.open{ transform:translateY(0); }
  .nav-link{ justify-content:flex-start; padding:12px 10px; border-radius:10px; }
  .nav-toggle{ display:flex; }
  .logo img{ width:142px; }

  .hero-layout{
    grid-template-columns:1fr;
    align-content:center;
    gap:8px;
  }
  .hero-copy{
    max-width:64%;
  }
  .hero-layout .hero-title{
    font-size:clamp(31px, 6vw, 52px);
  }
  .hero-visual{
    position:absolute;
    right:-10vw;
    bottom:var(--rail-h);
    width:56vw;
    min-height:72vh;
  }
  .hero-furniture{
    right:-35vw;
    bottom:-1vh;
    width:92vw;
    opacity:.78;
  }
  .phone-stage{
    width:min(238px, 27vw);
    transform:translateX(-3vw);
  }
  .try-callout{
    top:28%;
    right:-5vw;
    width:200px;
  }
  .try-callout svg{
    width:160px;
    height:72px;
    margin-left:-66px;
  }
  .try-callout-copy strong{ font-size:17px; }
  .try-callout-copy span{ font-size:9px; }

  .benefit-layout{
    grid-template-columns:minmax(0, 1.1fr) minmax(280px, .9fr);
    gap:4px;
  }
  .benefit-intro{ max-width:54ch; }
  .benefit-cards{ grid-template-columns:1fr; max-width:500px; }
  .benefit-card{ min-height:82px; padding:12px; }
  .benefit-card p{ font-size:10.5px; }
  .benefit-visual img{
    right:-48vw;
    width:102vw;
    opacity:.85;
  }
  .benefit-orbit{ opacity:.45; }
  .service-layout{
    grid-template-columns:minmax(280px, .75fr) minmax(430px, 1.25fr);
    gap:24px;
  }
  .service-cards{ gap:10px; }
  .service-card{ min-height:178px; padding:18px; }
  .service-icon{ width:40px; height:40px; margin-bottom:20px; }
  .service-card h3{ font-size:15px; }
  .service-card p{ font-size:11px; }
  .notify-form{
    grid-template-columns:minmax(240px, .8fr) minmax(360px, 1.2fr);
    column-gap:14px;
    max-width:820px;
    padding:16px;
  }
  .notify-layout{ transform:translateY(18px); }

  .final-layout{
    grid-template-columns:minmax(250px, .68fr) minmax(500px, 1.32fr);
    gap:24px;
  }
  .final-heading .section-title{ font-size:clamp(34px, 4.5vw, 48px); }
  .final-intro{ font-size:12px; }
  .info-grid{ grid-template-columns:repeat(3, 1fr); gap:8px; }
  .info-item{ min-height:170px; padding:15px; }
  .info-icon{ width:36px; height:36px; margin-bottom:17px; }
  .info-value{ font-size:13px; }
  .official-channels{ padding:11px; }
  .channels-copy{ display:none; }
  .channel-links{ width:100%; }
  .channel-link{ flex:1; }
  .final-actions .btn{ padding:10px 13px; }
  .arrow{ width:40px; height:40px; font-size:16px; }
  .arrow-prev{ left:12px; }
  .arrow-next{ right:12px; }
  .container{ padding:0 22px; }
  .rail-dot{ width:28px; height:28px; }
}

@media (max-width: 620px){
  body{ overflow:hidden; }
  .site-header{ height:72px; }
  :root{ --header-h:72px; }
  .hero-layout{
    display:flex;
    align-items:flex-start;
    justify-content:center;
    padding-top:94px;
  }
  .hero-copy{
    max-width:100%;
    width:100%;
  }
  .hero-layout .hero-title{
    max-width:15ch;
    font-size:clamp(29px, 9vw, 42px);
    margin-bottom:12px;
  }
  .hero-layout .hero-sub{
    max-width:92%;
    font-size:13px;
    margin-bottom:14px;
  }
  .hero-layout .eyebrow{ margin-bottom:12px; font-size:10px; }
  .hero-layout .countdown{ gap:9px; margin-bottom:16px; }
  .hero-layout .countdown-divider{ width:12px; }
  .hero-layout .countdown-num{ font-size:25px; }
  .hero-layout .countdown-label{ font-size:9px; }
  .hero-layout .btn{ padding:11px 16px; font-size:12px; }
  .hero-visual{
    right:-6vw;
    bottom:54px;
    width:62vw;
    min-height:45vh;
    pointer-events:none;
    opacity:.96;
  }
  .hero-furniture{
    right:-47vw;
    bottom:-3vh;
    width:132vw;
    opacity:.58;
  }
  .phone-stage{
    width:min(184px, 38vw);
    transform:translate(4vw, 7vh);
    pointer-events:auto;
  }
  .try-callout{
    display:none;
  }
  .try-callout svg{
    width:112px;
    height:58px;
    margin-left:-48px;
    margin-bottom:-15px;
  }
  .try-callout-copy strong{ font-size:13px; }
  .try-callout-copy span{ display:none; }
  .hero-actions{ max-width:52%; }
  .hero-actions .btn{ width:100%; justify-content:center; }

  .benefit-layout{
    display:flex;
    align-items:flex-start;
    padding-top:92px;
  }
  .benefit-copy{
    width:100%;
    max-width:100%;
  }
  .benefit-layout .eyebrow{ margin-bottom:10px; font-size:10px; }
  .benefit-layout .section-title{
    max-width:14ch;
    margin-bottom:10px;
    font-size:clamp(29px, 8.4vw, 40px);
  }
  .benefit-intro{
    max-width:88%;
    margin-bottom:12px;
    font-size:11.5px;
    line-height:1.45;
  }
  .benefit-cards{
    width:62%;
    gap:6px;
  }
  .benefit-card{
    min-height:66px;
    padding:8px;
    gap:8px;
    border-radius:12px;
  }
  .benefit-card > i{
    flex-basis:29px;
    width:29px;
    height:29px;
    border-radius:8px;
    font-size:16px;
  }
  .benefit-card h3{ margin-bottom:2px; font-size:10.5px; }
  .benefit-card p{
    display:-webkit-box;
    overflow:hidden;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    font-size:8.5px;
    line-height:1.35;
  }
  .benefit-visual{
    position:absolute;
    right:-18vw;
    bottom:52px;
    width:68vw;
    min-height:48vh;
  }
  .benefit-visual img{
    right:-42vw;
    bottom:-2vh;
    width:145vw;
    opacity:.72;
  }
  .benefit-orbit{ display:none; }

  .service-layout{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    justify-content:center;
    gap:18px;
    padding-top:86px;
  }
  .service-heading .eyebrow{ margin-bottom:10px; font-size:10px; }
  .service-heading .section-title{
    max-width:15ch;
    margin-bottom:8px;
    font-size:clamp(28px, 8vw, 39px);
  }
  .service-intro{
    max-width:92%;
    font-size:11px;
    line-height:1.45;
  }
  .service-cards{ grid-template-columns:repeat(2, minmax(0, 1fr)); gap:7px; }
  .service-card{
    min-height:136px;
    padding:11px;
    border-radius:14px;
  }
  .service-icon{
    width:32px;
    height:32px;
    margin-bottom:12px;
    border-radius:9px;
  }
  .service-icon svg{ width:18px; height:18px; }
  .service-number{ top:12px; right:11px; font-size:9px; }
  .service-card h3{ margin-bottom:4px; font-size:11px; }
  .service-card p{
    display:-webkit-box;
    overflow:hidden;
    -webkit-line-clamp:3;
    -webkit-box-orient:vertical;
    font-size:8.5px;
    line-height:1.35;
  }
  .notify-layout{
    transform:none;
    padding-top:82px;
  }
  .notify-layout .eyebrow{ margin-bottom:8px; font-size:10px; }
  .notify-layout .section-title{
    margin-bottom:7px;
    font-size:clamp(27px, 7.6vw, 36px);
  }
  .notify-layout > .hero-sub{
    margin-bottom:10px;
    font-size:11px;
  }
  .notify-form{
    display:grid;
    grid-template-columns:1fr 1fr;
    grid-template-rows:auto auto auto;
    gap:7px;
    max-width:100%;
    padding:10px;
    border-radius:15px;
  }
  .notify-form .form-name{ grid-column:1; grid-row:1; }
  .notify-form .form-whatsapp{ grid-column:2; grid-row:1; }
  .notify-form .form-interests{ grid-column:1 / -1; grid-row:2; }
  .notify-form .consent-row{ grid-column:2; grid-row:3; }
  .notify-form .btn-block{ grid-column:1; grid-row:3; }
  .notify-form .field-label{ font-size:9px; }
  .notify-form .input-wrap{ padding:0 10px; }
  .notify-form .input-wrap input{ padding:9px 0; font-size:11px; }
  .notify-form .input-wrap i{ font-size:14px; }
  .notify-form .chips{ gap:5px; }
  .notify-form .chip{ padding:6px 9px; font-size:8px; }
  .notify-form .consent-text{
    display:-webkit-box;
    overflow:hidden;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    font-size:8px;
    line-height:1.3;
  }
  .notify-form .consent-box{ width:16px; height:16px; }
  .notify-form .btn{ padding:10px 12px; font-size:10px; }
  .notify-layout .form-note{ font-size:9px; }

  .final-layout{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    justify-content:center;
    gap:12px;
    padding-top:82px;
  }
  .final-heading .eyebrow{ margin-bottom:8px; font-size:10px; }
  .final-heading .section-title{
    max-width:15ch;
    margin-bottom:7px;
    font-size:clamp(27px, 7.5vw, 36px);
  }
  .final-intro{
    max-width:92%;
    font-size:10.5px;
    line-height:1.4;
  }
  .info-grid{ grid-template-columns:repeat(3, minmax(0, 1fr)); gap:5px; margin-bottom:7px; }
  .info-item{
    min-height:124px;
    padding:8px;
    border-radius:12px;
  }
  .info-icon{
    width:28px;
    height:28px;
    margin-bottom:10px;
    border-radius:8px;
  }
  .info-icon svg{ width:16px; height:16px; }
  .info-label{ margin-bottom:4px; font-size:7px; }
  .info-value{ font-size:9.5px; overflow-wrap:anywhere; }
  .info-item small{
    display:-webkit-box;
    overflow:hidden;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    margin-top:5px;
    font-size:7.5px;
  }
  .official-channels{ padding:7px; border-radius:12px; }
  .channel-links{ gap:4px; }
  .channel-link{
    min-width:0;
    padding:6px;
    border-radius:8px;
    justify-content:center;
  }
  .channel-link > svg{ flex-basis:18px; width:18px; height:18px; }
  .channel-link span{ display:none; }
  .final-actions{ margin-top:7px; gap:6px; }
  .final-actions .btn{ padding:8px 10px; font-size:8px; }
  .final-actions .btn svg{ width:14px; height:14px; }
  .site-link{ font-size:8px; }
}

/* ==========================================================================
   MOBILE VERTICAL — camada independente; não altera o desktop
   ========================================================================== */
@media (max-width: 620px){
  html{
    scroll-behavior:smooth;
    scroll-padding-top:72px;
    background:#0b0d12;
  }
  body{
    min-width:320px;
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior-y:none;
  }
  .bg-fixed-layer{
    position:fixed;
    background:
      radial-gradient(circle at 82% 16%, rgba(255,122,26,.10), transparent 31%),
      radial-gradient(circle at 12% 68%, rgba(79,227,193,.055), transparent 30%),
      #0b0d12;
  }
  .bg-panorama{ display:none; }
  .golden-continuity-line,
  .arrow,
  .rail{ display:none !important; }
  .site-header{
    position:fixed;
    top:0;
    background:linear-gradient(180deg, rgba(11,13,18,.98), rgba(11,13,18,.86));
    border-bottom:1px solid rgba(255,255,255,.07);
    backdrop-filter:blur(14px);
  }
  .header-inner{ padding:0 18px; }
  .logo img{ width:128px; }
  .main-nav{
    max-height:calc(100vh - 72px);
    overflow-y:auto;
    background:rgba(15,17,23,.98);
    box-shadow:0 24px 42px rgba(0,0,0,.38);
  }
  .nav-link{ min-height:46px; font-size:14px; }

  .slider{
    width:100%;
    height:auto;
    overflow:visible;
  }
  .slider-track{
    display:block;
    width:100% !important;
    height:auto;
    transform:none !important;
    transition:none;
  }
  .slide{
    position:relative;
    width:100%;
    height:auto;
    min-height:100svh;
    display:block;
    overflow:hidden;
    scroll-margin-top:72px;
    border-bottom:1px solid rgba(255,255,255,.07);
  }
  .slide-inner{
    width:100%;
    height:auto;
    min-height:100svh;
    padding:104px 20px 54px;
  }
  .eyebrow{
    margin-bottom:13px;
    font-size:10px;
    line-height:1.35;
  }
  .section-title{
    font-size:clamp(32px, 9.4vw, 43px);
    line-height:1.02;
  }

  /* Tela 01: conteúdo legível, aparelho real e cenário próprio */
  #slide-novidade{ min-height:1420px; }
  #slide-novidade::after{
    content:"";
    position:absolute;
    z-index:0;
    inset:45% 0 0;
    background:linear-gradient(180deg, #0b0d12 0%, transparent 18%, rgba(5,6,8,.12) 72%, #08090d 100%);
    pointer-events:none;
  }
  .hero-layout{
    position:relative;
    z-index:1;
    display:block;
    min-height:1420px;
    padding-top:102px;
    padding-bottom:60px;
  }
  .hero-copy{
    position:relative;
    z-index:4;
    max-width:none;
    width:100%;
  }
  .hero-layout .hero-title{
    max-width:12ch;
    margin-bottom:16px;
    font-size:clamp(38px, 11.2vw, 52px);
    line-height:1.02;
  }
  .hero-layout .hero-sub{
    max-width:33ch;
    margin-bottom:22px;
    font-size:14px;
    line-height:1.55;
  }
  .hero-layout .countdown{
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:7px;
    width:100%;
    margin-bottom:21px;
  }
  .hero-layout .countdown-block{
    min-width:0;
    padding:11px 8px;
    align-items:center;
    border:1px solid rgba(255,255,255,.08);
    border-radius:12px;
    background:rgba(255,255,255,.035);
  }
  .hero-layout .countdown-num{ font-size:25px; }
  .hero-layout .countdown-label{ font-size:7.5px; }
  .hero-layout .countdown-divider{ display:none; }
  .hero-actions{
    display:grid;
    grid-template-columns:1fr;
    gap:9px;
    max-width:none;
    width:100%;
  }
  .hero-actions .btn{
    width:100%;
    min-height:48px;
    padding:12px 18px;
    justify-content:center;
    font-size:13px;
  }
  .hero-visual{
    position:absolute;
    z-index:1;
    inset:520px 0 0;
    width:auto;
    min-height:0;
    height:auto;
    display:block;
    pointer-events:none;
    opacity:1;
  }
  .mobile-hero-scene{
    display:block;
    position:absolute;
    z-index:0;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:57% bottom;
    opacity:.82;
    filter:saturate(.86) contrast(1.04);
  }
  .hero-visual::after{
    content:"";
    position:absolute;
    z-index:1;
    inset:0;
    background:
      linear-gradient(180deg, #0b0d12 0%, rgba(11,13,18,.36) 18%, transparent 42%),
      linear-gradient(90deg, rgba(11,13,18,.42), transparent 48%);
  }
  .hero-furniture{ display:none; }
  .hero-gold-line{
    z-index:2;
    top:62%;
    left:-30%;
    width:180%;
    opacity:.66;
  }
  .phone-stage{
    position:absolute;
    z-index:3;
    top:92px;
    left:50%;
    width:min(272px, 72vw);
    transform:translateX(-50%);
    pointer-events:auto;
    filter:drop-shadow(0 28px 38px rgba(0,0,0,.56));
  }
  .try-callout{ display:none; }

  /* Tela 02 */
  .benefit-layout{
    display:flex;
    flex-direction:column;
    min-height:auto;
    padding-top:102px;
    padding-bottom:0;
  }
  .benefit-copy{ width:100%; max-width:none; }
  .benefit-layout .section-title{
    max-width:12ch;
    margin-bottom:14px;
    font-size:clamp(34px, 10vw, 45px);
  }
  .benefit-intro{
    max-width:36ch;
    margin-bottom:18px;
    font-size:13px;
    line-height:1.55;
  }
  .benefit-cards{
    width:100%;
    display:grid;
    grid-template-columns:1fr;
    gap:9px;
  }
  .benefit-card{
    min-height:0;
    padding:14px;
    gap:12px;
    border-radius:16px;
  }
  .benefit-card .feature-icon{
    flex:0 0 40px;
    width:40px;
    height:40px;
  }
  .benefit-card h3{ margin:1px 0 4px; font-size:14px; }
  .benefit-card p{
    display:block;
    overflow:visible;
    font-size:11px;
    line-height:1.48;
  }
  .benefit-visual{
    position:relative;
    right:auto;
    bottom:auto;
    width:calc(100% + 40px);
    min-height:460px;
    margin:10px -20px 0;
    overflow:hidden;
  }
  .benefit-visual img{
    right:-56%;
    bottom:-2%;
    width:210%;
    max-width:none;
    opacity:.9;
  }

  /* Tela 03 */
  .service-layout{
    display:block;
    min-height:auto;
    padding-top:102px;
  }
  .service-heading .section-title{
    max-width:12ch;
    margin-bottom:13px;
    font-size:clamp(34px, 10vw, 45px);
  }
  .service-intro{
    max-width:36ch;
    margin-bottom:22px;
    font-size:13px;
    line-height:1.55;
  }
  .service-cards{
    grid-template-columns:1fr;
    gap:10px;
  }
  .service-card{
    min-height:0;
    padding:17px 18px;
    border-radius:17px;
    display:grid;
    grid-template-columns:46px 1fr;
    gap:13px;
    align-items:start;
  }
  .service-icon{
    width:42px;
    height:42px;
    margin:0;
    border-radius:12px;
  }
  .service-icon svg{ width:22px; height:22px; }
  .service-number{ top:15px; right:15px; font-size:10px; }
  .service-card h3{ margin:1px 28px 5px 0; font-size:15px; }
  .service-card p{
    display:block;
    overflow:visible;
    font-size:11px;
    line-height:1.48;
  }

  /* Tela 04 */
  .notify-layout{
    min-height:auto;
    padding-top:102px;
    transform:none;
  }
  .notify-layout .section-title{
    max-width:12ch;
    margin-bottom:12px;
    font-size:clamp(34px, 9.8vw, 44px);
  }
  .notify-layout > .hero-sub{
    max-width:34ch;
    margin-bottom:18px;
    font-size:13px;
    line-height:1.5;
  }
  .notify-form{
    display:flex;
    flex-direction:column;
    gap:14px;
    width:100%;
    padding:17px;
    border-radius:18px;
  }
  .notify-form .form-field,
  .notify-form .form-name,
  .notify-form .form-whatsapp,
  .notify-form .form-interests,
  .notify-form .consent-row,
  .notify-form .btn-block{
    grid-column:auto;
    grid-row:auto;
  }
  .notify-form .field-label{ font-size:12px; }
  .notify-form .input-wrap{ padding:0 14px; }
  .notify-form .input-wrap input{ padding:13px 0; font-size:14px; }
  .notify-form .input-wrap i{ font-size:17px; }
  .notify-form .chips{ gap:7px; }
  .notify-form .chip{ padding:9px 11px; font-size:11px; }
  .notify-form .consent-text{
    display:block;
    overflow:visible;
    font-size:11px;
    line-height:1.45;
  }
  .notify-form .consent-box{ width:20px; height:20px; }
  .notify-form .btn{ min-height:48px; padding:12px 16px; font-size:13px; }
  .notify-layout .form-note{ margin-top:9px; font-size:10px; }

  /* Tela 05 */
  .final-layout{
    display:block;
    min-height:auto;
    padding-top:102px;
  }
  .final-heading .section-title{
    max-width:12ch;
    margin-bottom:12px;
    font-size:clamp(34px, 9.8vw, 44px);
  }
  .final-intro{
    max-width:35ch;
    margin-bottom:22px;
    font-size:13px;
    line-height:1.52;
  }
  .info-grid{
    grid-template-columns:1fr;
    gap:9px;
    margin-bottom:12px;
  }
  .info-item{
    min-height:0;
    padding:15px;
    display:grid;
    grid-template-columns:40px 1fr;
    column-gap:12px;
    border-radius:16px;
  }
  .info-icon{
    grid-row:1 / span 3;
    width:38px;
    height:38px;
    margin:0;
    border-radius:11px;
  }
  .info-icon svg{ width:20px; height:20px; }
  .info-label{ margin:1px 0 5px; font-size:9px; }
  .info-value{ font-size:14px; overflow-wrap:anywhere; }
  .info-item small{
    display:block;
    overflow:visible;
    margin-top:5px;
    font-size:9.5px;
  }
  .official-channels{ padding:12px; border-radius:16px; }
  .channels-copy{ display:flex; margin-bottom:10px; }
  .official-channels{ display:block; }
  .channel-links{
    width:100%;
    display:grid;
    grid-template-columns:1fr;
    gap:7px;
  }
  .channel-link{
    min-height:48px;
    padding:9px 11px;
    justify-content:flex-start;
    border-radius:12px;
  }
  .channel-link > svg{ flex-basis:22px; width:22px; height:22px; }
  .channel-link span{ display:flex; }
  .final-actions{
    display:grid;
    grid-template-columns:1fr;
    gap:8px;
    margin-top:14px;
  }
  .final-actions .btn{
    min-height:47px;
    padding:11px 15px;
    justify-content:center;
    font-size:12px;
  }
  .site-link{ padding:9px; text-align:center; font-size:10px; }
}

/* ==========================================================================
   MOBILE — AJUSTE DE COMPOSIÇÃO V2
   Fluxo natural: nenhum conteúdo disputa a mesma área do aparelho.
   ========================================================================== */
@media (max-width: 620px){
  .nav-toggle{
    display:flex !important;
    width:44px;
    height:44px;
    color:var(--paper);
    border-color:rgba(255,255,255,.16);
    background:rgba(255,255,255,.055);
  }
  .nav-toggle-icon{ display:block; }

  #slide-novidade,
  .hero-layout{
    min-height:0;
  }
  #slide-novidade::after{ display:none; }
  .hero-layout{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    padding-top:96px;
    padding-bottom:54px;
  }
  .hero-copy{
    order:1;
    position:relative;
    z-index:2;
  }
  .hero-layout .hero-title{
    max-width:11ch;
    font-size:clamp(36px, 10.4vw, 46px);
  }
  .hero-layout .hero-sub{
    max-width:34ch;
    margin-bottom:18px;
    font-size:13px;
  }
  .hero-layout .countdown{ margin-bottom:15px; }
  .hero-layout .countdown-block{ padding:9px 5px; }
  .hero-actions{
    grid-template-columns:1fr 1fr;
    gap:8px;
  }
  .hero-actions .btn{
    min-width:0;
    min-height:45px;
    padding:10px 9px;
    font-size:11px;
    line-height:1.25;
  }
  .hero-visual{
    order:2;
    position:relative;
    inset:auto;
    width:100%;
    height:auto;
    min-height:0;
    margin-top:24px;
    padding:0;
    display:flex;
    justify-content:center;
    overflow:visible;
    background:none;
  }
  .hero-visual::after,
  .mobile-hero-scene,
  .hero-furniture,
  .hero-gold-line{ display:none !important; }
  .phone-stage{
    position:relative;
    top:auto;
    left:auto;
    width:min(270px, 74vw);
    margin:0 auto;
    transform:none;
    filter:drop-shadow(0 24px 34px rgba(0,0,0,.5));
  }
  .phone-screen iframe{
    height:100%;
    min-height:0;
  }

  /* Benefícios: destaque visual limpo somente com a mulher. */
  .benefit-layout{ padding-bottom:0; }
  .benefit-visual{
    width:calc(100% + 40px);
    min-height:430px;
    height:430px;
    margin:10px -20px 0;
    overflow:hidden;
    background:
      radial-gradient(circle at 32% 62%, rgba(255,122,26,.09), transparent 52%),
      linear-gradient(180deg, transparent, rgba(7,9,13,.55));
  }
  .benefit-visual::before{
    top:17%;
    left:2%;
    width:82%;
  }
  .benefit-visual .benefit-desktop-image{ display:none; }
  .benefit-visual .benefit-mobile-image{
    display:block;
    left:50%;
    right:auto;
    top:0;
    bottom:auto;
    width:min(390px, 100vw);
    max-width:none;
    height:auto;
    opacity:1;
    clip-path:none;
    transform:translateX(-50%);
    filter:drop-shadow(0 24px 32px rgba(0,0,0,.35));
  }
}

@media (max-width: 390px){
  .hero-layout{ padding-left:17px; padding-right:17px; }
  .hero-actions{ grid-template-columns:1fr; }
  .phone-stage{ width:min(258px, 76vw); }
  .benefit-visual .benefit-mobile-image{ width:100vw; }
}

@media (prefers-reduced-motion: reduce){
  .slider-track, .bg-panorama{ transition:none; }
  .gold-line-travel{ animation:none; }
  .hero-gold-travel{ animation:none; }
  .try-arrow-main, .try-arrow-head{ animation:none; stroke-dashoffset:0; }
}