/* ============================================================
   MAPA NAIL — Páginas de venda (Liquid Glass / iOS 26)
   ============================================================ */
:root{
  --olive:#6E7A45; --olive-deep:#4F5A2D; --olive-light:#97A55F;
  --coral:#F2917E; --coral-deep:#E26E58; --lilac:#ABA6EC; --lilac-deep:#8B85E0;
  --ink:#2A2E22; --ink-soft:#565a49; --ink-mute:#8a8d7c; --on:#fff;
  --glass:rgba(255,255,255,.5); --glass2:rgba(255,255,255,.66);
  --stroke:rgba(255,255,255,.66);
  --shadow:0 22px 60px -18px rgba(40,46,28,.42), 0 4px 14px -6px rgba(40,46,28,.28);
  --inset:inset 0 1px 0 rgba(255,255,255,.85), inset 0 -1px 0 rgba(255,255,255,.16);
  --blur:saturate(180%) blur(26px);
  --spring:cubic-bezier(.34,1.56,.64,1); --ease:cubic-bezier(.22,.61,.36,1);
  --radius:28px; --radius-sm:18px; --maxw:1080px;
}
*{ box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
[hidden]{ display:none !important; }
html{ scroll-behavior:smooth; }
html,body{ margin:0; }
body{ font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",system-ui,Roboto,sans-serif;
  color:var(--ink); background:#eef0e6; -webkit-font-smoothing:antialiased; letter-spacing:-.01em;
  overflow-x:hidden; animation:pageIn .7s var(--spring); }
@keyframes pageIn{ from{ opacity:0; transform:translateY(12px) scale(.99);} }
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }

/* fundo vivo */
.bg{ position:fixed; inset:0; z-index:-2; overflow:hidden;
  background:radial-gradient(120% 80% at 12% 0%, #e9efd6 0%, #e6e3f4 50%, #f6e3dd 100%); }
.blob{ position:absolute; border-radius:50%; filter:blur(72px); opacity:.8; will-change:transform; }
.b1{ width:60vmax; height:60vmax; left:-20vmax; top:-26vmax;
  background:radial-gradient(circle at 35% 35%,var(--olive-light),var(--olive) 60%,transparent 72%);
  animation:f1 28s var(--ease) infinite alternate; }
.b2{ width:48vmax; height:48vmax; right:-16vmax; top:10vmax;
  background:radial-gradient(circle at 50% 50%,#ffb9aa,var(--coral) 58%,transparent 72%);
  animation:f2 34s var(--ease) infinite alternate; }
.b3{ width:52vmax; height:52vmax; left:30vmax; top:120vh;
  background:radial-gradient(circle at 50% 50%,#cfcbff,var(--lilac) 58%,transparent 72%);
  animation:f3 30s var(--ease) infinite alternate; }
@keyframes f1{ to{ transform:translate(8vmax,6vmax) scale(1.12) rotate(16deg);} }
@keyframes f2{ to{ transform:translate(-7vmax,9vmax) scale(1.08) rotate(-14deg);} }
@keyframes f3{ to{ transform:translate(6vmax,-7vmax) scale(1.14) rotate(12deg);} }

/* vidro */
.glass{ background:var(--glass); -webkit-backdrop-filter:var(--blur); backdrop-filter:var(--blur);
  border:1px solid var(--stroke); box-shadow:var(--shadow),var(--inset); border-radius:var(--radius);
  position:relative; }
.glass::before{ content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.5),rgba(255,255,255,0) 30%); opacity:.7; mix-blend-mode:screen; }

/* layout */
.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 20px; }
section{ position:relative; padding:46px 0; }
.kicker{ font-size:12.5px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--coral-deep); }
h1,h2,h3{ letter-spacing:-.025em; margin:0; }
.h-grad{ background:linear-gradient(120deg,var(--coral-deep),var(--lilac-deep)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.h-olive{ background:linear-gradient(120deg,var(--olive),var(--olive-deep)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.lead{ color:var(--ink-soft); line-height:1.55; }

/* botões */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:9px; border:none; cursor:pointer;
  font-family:inherit; font-weight:700; font-size:16px; padding:16px 26px; border-radius:999px; color:var(--ink);
  transition:transform .18s var(--spring), box-shadow .25s var(--ease); }
.btn:active{ transform:scale(.96); }
.btn .ic{ width:20px; height:20px; }
.btn-primary{ color:var(--on); background:linear-gradient(135deg,var(--olive-light),var(--olive) 55%,var(--olive-deep));
  box-shadow:0 16px 30px -10px rgba(79,90,45,.7), inset 0 1px 0 rgba(255,255,255,.4); }
.btn-primary:hover{ transform:translateY(-2px); box-shadow:0 22px 40px -12px rgba(79,90,45,.8), inset 0 1px 0 rgba(255,255,255,.5); }
.btn-cta{ background:linear-gradient(135deg,var(--coral),var(--coral-deep) 60%,var(--lilac-deep));
  color:#fff; box-shadow:0 18px 34px -12px rgba(226,110,88,.7), inset 0 1px 0 rgba(255,255,255,.4); }
.btn-cta:hover{ transform:translateY(-2px); box-shadow:0 26px 46px -14px rgba(226,110,88,.85), inset 0 1px 0 rgba(255,255,255,.5); }
.btn-lg{ font-size:18px; padding:19px 34px; }
.btn-soft{ background:var(--glass2); -webkit-backdrop-filter:var(--blur); backdrop-filter:var(--blur);
  border:1px solid var(--stroke); box-shadow:var(--inset); }
.btn-block{ width:100%; }
.btn-pulse{ animation:pulse 2.6s var(--ease) infinite; }
@keyframes pulse{ 0%,100%{ box-shadow:0 18px 34px -12px rgba(226,110,88,.7), inset 0 1px 0 rgba(255,255,255,.4);} 50%{ box-shadow:0 18px 50px -10px rgba(226,110,88,.95), 0 0 0 6px rgba(242,145,126,.18), inset 0 1px 0 rgba(255,255,255,.5);} }

/* switcher flutuante (canto superior) */
.switcher{ position:fixed; top:14px; right:14px; z-index:60; display:flex; gap:3px; padding:5px; border-radius:999px;
  background:var(--glass2); -webkit-backdrop-filter:var(--blur); backdrop-filter:var(--blur);
  border:1px solid var(--stroke); box-shadow:var(--shadow); animation:drop .6s var(--spring) both; }
@keyframes drop{ from{ opacity:0; transform:translateY(-16px);} to{ opacity:1; transform:none;} }
.switcher a, .switcher span{ font-size:12.5px; font-weight:700; padding:8px 13px; border-radius:999px; color:var(--ink-soft); cursor:pointer; white-space:nowrap; transition:.25s var(--spring); }
.switcher .on{ color:#fff; background:linear-gradient(135deg,var(--olive-light),var(--olive-deep)); box-shadow:0 6px 14px -5px rgba(79,90,45,.6); cursor:default; }
.switcher a:hover{ background:rgba(255,255,255,.55); color:var(--ink); }

/* badge mini topo */
.brandrow{ display:flex; align-items:center; gap:10px; }
.brandrow .bm{ width:38px; height:38px; }
.brandrow .nm{ font-size:19px; font-weight:800; }
.brandrow .nm span{ background:linear-gradient(120deg,var(--coral-deep),var(--lilac-deep)); -webkit-background-clip:text; background-clip:text; color:transparent; }

/* HERO */
.hero{ padding-top:74px; }
.hero-grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:30px; align-items:center; }
.hero h1{ font-size:clamp(32px,6vw,52px); font-weight:850; line-height:1.04; margin:16px 0 16px; }
.hero .lead{ font-size:clamp(16px,2.4vw,19px); max-width:30ch; }
.hero-cta{ margin-top:26px; display:flex; flex-direction:column; gap:12px; align-items:flex-start; }
.price-pill{ display:inline-flex; align-items:baseline; gap:8px; padding:8px 16px; border-radius:999px;
  background:var(--glass2); border:1px solid var(--stroke); box-shadow:var(--inset); font-weight:700; }
.price-pill b{ font-size:18px; color:var(--olive-deep); }
.price-pill small{ color:var(--ink-mute); font-weight:600; }
.trust{ display:flex; flex-wrap:wrap; gap:8px 16px; margin-top:18px; }
.trust span{ display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:600; color:var(--ink-soft); }
.trust svg{ width:16px; height:16px; color:var(--olive); }

/* PHONE MOCKUP 3D */
.stage{ position:relative; display:flex; justify-content:center; align-items:center; perspective:1600px; }
.phone{ position:relative; width:262px; flex:0 0 auto; border-radius:46px; padding:13px;
  background:linear-gradient(155deg,#41442f,#23251c 42%,#14150e);
  box-shadow:0 60px 100px -34px rgba(40,46,28,.65), 0 26px 50px -26px rgba(40,46,28,.5),
    inset 0 2px 3px rgba(255,255,255,.2), inset 0 -3px 6px rgba(0,0,0,.55);
  transform:rotateY(-15deg) rotateX(7deg) rotateZ(-1.2deg); transform-style:preserve-3d;
  transition:transform .7s var(--spring); will-change:transform; }
.phone::after{ content:""; position:absolute; top:14%; bottom:14%; left:-3px; width:3px; border-radius:3px;
  background:linear-gradient(180deg,#5a5d44,#2c2e22); }
.phone-notch{ position:absolute; top:24px; left:50%; transform:translateX(-50%) translateZ(2px);
  width:78px; height:23px; background:#080905; border-radius:999px; z-index:4; box-shadow:inset 0 0 6px rgba(0,0,0,.8); }
.phone-screen{ position:relative; border-radius:33px; overflow:hidden; aspect-ratio:9/19.3; z-index:1;
  background:radial-gradient(120% 80% at 12% 6%, #eaf0d8 0%, #e7e4f4 52%, #f7e4dd 100%);
  display:flex; flex-direction:column; }
.phone-screen::before{ content:""; position:absolute; inset:0; z-index:5; pointer-events:none;
  background:linear-gradient(135deg,rgba(255,255,255,.32),transparent 30%); }
.phone-glow{ position:absolute; inset:-12% -8% 6%; z-index:0; filter:blur(40px); opacity:.55;
  background:radial-gradient(40% 40% at 30% 20%,var(--olive-light),transparent),radial-gradient(40% 40% at 80% 70%,var(--coral),transparent); }

/* mini UI dentro do phone */
.mini{ flex:1; padding:42px 14px 12px; display:flex; flex-direction:column; gap:9px; overflow:hidden; }
.mini-kicker{ font-size:8px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--coral-deep); }
.mini-title{ font-size:17px; font-weight:850; margin:-2px 0 2px; }
.gm{ background:rgba(255,255,255,.52); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.7); border-radius:15px; box-shadow:inset 0 1px 0 rgba(255,255,255,.8); }
.mini-anchor{ padding:12px; text-align:center; background:linear-gradient(135deg,rgba(171,166,236,.32),rgba(242,145,126,.26)); }
.mini-anchor span{ display:block; font-size:8.5px; font-weight:600; color:var(--ink-soft); }
.mini-anchor b{ display:block; font-size:32px; font-weight:850; line-height:1.1; margin:1px 0;
  background:linear-gradient(120deg,var(--olive-deep),var(--coral-deep) 60%,var(--lilac-deep)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.mini-anchor small{ font-size:8.5px; color:var(--ink-soft); }
.mini-rows{ padding:6px; }
.mini-row{ display:flex; justify-content:space-between; align-items:center; padding:8px 8px; font-size:10.5px; color:var(--ink); }
.mini-row b{ color:var(--olive-deep); font-weight:800; }
.mini-row.an{ background:linear-gradient(120deg,rgba(151,165,95,.28),rgba(171,166,236,.22)); border-radius:9px; font-weight:700; }
.mini-chips{ display:flex; gap:5px; }
.mini-chip{ font-size:8.5px; font-weight:700; padding:5px 9px; border-radius:999px; background:rgba(255,255,255,.5); color:var(--ink-soft); border:1px solid rgba(255,255,255,.7); }
.mini-chip.on{ color:#fff; background:linear-gradient(135deg,var(--olive-light),var(--olive-deep)); border-color:transparent; }
.mini-spacer{ flex:1; }
.mini-tabbar{ display:flex; gap:2px; padding:5px; border-radius:999px; }
.mini-tabbar span{ flex:1; text-align:center; font-size:7.5px; font-weight:700; color:var(--ink-mute); padding:6px 0; border-radius:999px; }
.mini-tabbar span.on{ color:#fff; background:linear-gradient(135deg,var(--olive-light),var(--olive-deep)); }
/* trilha mini */
.mini-step{ display:flex; gap:8px; align-items:center; padding:8px; }
.mini-pin{ width:26px; height:26px; border-radius:50% 50% 50% 6px; transform:rotate(45deg); flex:0 0 auto; display:grid; place-items:center; color:#fff; font-size:10px; font-weight:800; }
.mini-pin > *{ transform:rotate(-45deg); }
.mini-pin.p1{ background:linear-gradient(135deg,#b9c08e,var(--olive)); }
.mini-pin.p2{ background:linear-gradient(135deg,var(--coral),var(--coral-deep)); }
.mini-pin.p3{ background:linear-gradient(135deg,var(--lilac),var(--lilac-deep)); }
.mini-step .t{ font-size:9.5px; } .mini-step .t b{ display:block; font-size:11px; color:var(--ink); }
.mini-step .t span{ color:var(--ink-mute); }

/* cartões flutuantes ao redor do phone */
.float-card{ position:absolute; z-index:6; padding:11px 14px; border-radius:16px;
  background:var(--glass2); -webkit-backdrop-filter:var(--blur); backdrop-filter:var(--blur);
  border:1px solid var(--stroke); box-shadow:var(--shadow); font-weight:700; animation:bob 5s var(--ease) infinite alternate; }
.float-card small{ display:block; font-size:10px; font-weight:600; color:var(--ink-mute); }
.float-card b{ font-size:16px; color:var(--olive-deep); }
.fc-1{ top:8%; left:-4%; } .fc-2{ bottom:14%; right:-6%; animation-delay:-2.5s; }
.fc-emoji{ font-size:20px; }
@keyframes bob{ to{ transform:translateY(-12px);} }

/* PROVA / pains */
.cards3{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.pain{ padding:22px; }
.pain .pe{ font-size:26px; } .pain h3{ font-size:17px; margin:10px 0 6px; } .pain p{ margin:0; font-size:14px; color:var(--ink-soft); line-height:1.5; }

/* features (4 entregáveis) */
.feat-grid{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.feat{ padding:22px; display:flex; gap:15px; }
.feat .fic{ flex:0 0 auto; width:48px; height:48px; border-radius:15px; display:grid; place-items:center; color:#fff; }
.feat .fic .ic{ width:25px; height:25px; }
.fic.c1{ background:linear-gradient(135deg,var(--olive-light),var(--olive-deep)); }
.fic.c2{ background:linear-gradient(135deg,var(--lilac),var(--lilac-deep)); }
.fic.c3{ background:linear-gradient(135deg,var(--coral),var(--coral-deep)); }
.fic.c4{ background:linear-gradient(135deg,#ffc27a,var(--coral-deep)); }
.feat h3{ font-size:17px; margin:2px 0 6px; } .feat p{ margin:0; font-size:14px; color:var(--ink-soft); line-height:1.5; }

/* galeria de telas */
.gallery{ display:flex; gap:8px; justify-content:center; align-items:flex-end; perspective:1600px; flex-wrap:wrap; }
.gallery .phone{ width:208px; }
.gallery .phone.mid{ width:228px; z-index:2; transform:rotateY(0deg) rotateX(4deg) translateY(-12px); }
.gallery .phone.l{ transform:rotateY(18deg) rotateX(6deg); }
.gallery .phone.r{ transform:rotateY(-18deg) rotateX(6deg); }

/* passos */
.steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; counter-reset:s; }
.step{ padding:24px 20px; } .step .n{ font-size:34px; font-weight:850; line-height:1; }
.step h3{ font-size:17px; margin:8px 0 6px; } .step p{ margin:0; font-size:14px; color:var(--ink-soft); line-height:1.5; }

/* incluso */
.incl{ padding:26px; } .incl ul{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:12px 22px; }
.incl li{ display:flex; gap:11px; font-size:15px; line-height:1.45; }
.incl li svg{ flex:0 0 auto; width:22px; height:22px; color:var(--olive); margin-top:1px; }

/* PRICING */
.price-sec{ padding-bottom:30px; }
.pricebox{ max-width:480px; margin:0 auto; padding:34px 28px; text-align:center; overflow:hidden;
  background:linear-gradient(160deg,rgba(151,165,95,.26),rgba(171,166,236,.22)); }
.pricebox .tag{ display:inline-block; font-size:12px; font-weight:800; color:#fff; padding:6px 14px; border-radius:999px;
  background:linear-gradient(135deg,var(--coral-deep),var(--lilac-deep)); }
.pricebox .install{ font-size:54px; font-weight:850; line-height:1; margin:16px 0 2px;
  background:linear-gradient(120deg,var(--olive-deep),var(--coral-deep)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.pricebox .install small{ font-size:22px; }
.pricebox .cash{ font-size:15px; color:var(--ink-soft); font-weight:600; }
.pricebox .cash b{ color:var(--ink); }
.pricebox .pbtn{ margin:22px 0 14px; }
.pricebox .micro{ font-size:12.5px; color:var(--ink-mute); }
.pb-perks{ display:flex; flex-direction:column; gap:9px; margin:18px 0 4px; text-align:left; }
.pb-perks li{ display:flex; gap:10px; font-size:14.5px; align-items:center; }
.pb-perks svg{ width:20px; height:20px; color:var(--olive); flex:0 0 auto; }

/* garantia */
.guarantee{ display:flex; gap:20px; align-items:center; padding:26px; max-width:680px; margin:0 auto; }
.guarantee .seal{ flex:0 0 auto; width:92px; height:92px; border-radius:50%; display:grid; place-items:center; color:#fff;
  background:linear-gradient(135deg,var(--olive-light),var(--olive-deep)); box-shadow:0 16px 30px -12px rgba(79,90,45,.6), var(--inset);
  text-align:center; font-weight:850; line-height:1; }
.guarantee .seal b{ font-size:30px; } .guarantee .seal span{ font-size:10px; font-weight:700; }
.guarantee h3{ font-size:19px; margin:0 0 6px; } .guarantee p{ margin:0; font-size:14.5px; color:var(--ink-soft); line-height:1.55; }

/* FAQ */
.faq{ max-width:720px; margin:0 auto; display:flex; flex-direction:column; gap:12px; }
.qa{ padding:0 20px; cursor:pointer; overflow:hidden; }
.qa summary{ list-style:none; padding:18px 0; font-size:16px; font-weight:700; display:flex; justify-content:space-between; align-items:center; gap:12px; }
.qa summary::-webkit-details-marker{ display:none; }
.qa summary .pm{ flex:0 0 auto; width:24px; height:24px; border-radius:50%; display:grid; place-items:center; background:rgba(151,165,95,.25); color:var(--olive-deep); font-size:18px; transition:transform .3s var(--spring); }
.qa[open] summary .pm{ transform:rotate(45deg); }
.qa p{ margin:0; padding:0 0 18px; font-size:14.5px; color:var(--ink-soft); line-height:1.6; }

/* CTA final */
.final{ text-align:center; padding:54px 0 30px; }
.final h2{ font-size:clamp(26px,5vw,40px); font-weight:850; margin-bottom:14px; }

footer{ text-align:center; padding:30px 20px 40px; color:var(--ink-mute); font-size:12.5px; }
footer a{ color:var(--coral-deep); font-weight:600; }

/* títulos de seção */
.sec-head{ text-align:center; max-width:640px; margin:0 auto 30px; }
.sec-head h2{ font-size:clamp(24px,4.4vw,36px); font-weight:850; margin:8px 0 10px; }
.sec-head .lead{ font-size:16px; }

/* reveal */
.reveal{ opacity:0; transform:translateY(30px); transition:opacity .7s var(--ease), transform .8s var(--spring); }
.reveal.in{ opacity:1; transform:none; }

/* toast */
.toast{ position:fixed; left:50%; bottom:26px; transform:translateX(-50%); z-index:90;
  background:rgba(42,46,34,.92); color:#fff; padding:13px 22px; border-radius:999px; font-size:14px; font-weight:600;
  box-shadow:0 12px 30px -10px rgba(0,0,0,.5); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); animation:tin .4s var(--spring); }
@keyframes tin{ from{ opacity:0; transform:translate(-50%,12px);} to{ opacity:1; transform:translateX(-50%);} }

/* sticky buy bar (mobile) */
.stickybuy{ position:fixed; left:12px; right:12px; bottom:12px; z-index:55; display:none; padding:10px 12px;
  align-items:center; gap:12px; border-radius:999px; animation:drop .6s var(--spring) both; }
.stickybuy .sp{ flex:1; font-size:13px; font-weight:700; line-height:1.1; }
.stickybuy .sp small{ display:block; font-size:11px; color:var(--ink-mute); font-weight:600; }
.stickybuy .btn{ padding:13px 20px; font-size:15px; }

@media (max-width:860px){
  .hero-grid{ grid-template-columns:1fr; text-align:center; }
  .hero .lead{ max-width:none; }
  .hero-cta{ align-items:center; }
  .stage{ margin-top:22px; }
  .phone{ width:236px; }
  .hero{ padding-top:64px; }
  .cards3{ grid-template-columns:1fr; }
  .feat-grid{ grid-template-columns:1fr; }
  .steps{ grid-template-columns:1fr; }
  .incl ul{ grid-template-columns:1fr; }
  .gallery .phone.l,.gallery .phone.r{ display:none; }
  .gallery .phone.mid{ transform:rotateY(-12deg) rotateX(6deg); }
  .guarantee{ flex-direction:column; text-align:center; }
  .stickybuy{ display:flex; }
  section{ padding:36px 0; }
  .pricebox .install{ font-size:40px; white-space:nowrap; }
  .switcher{ top:10px; right:10px; }
}
@media (prefers-reduced-motion: reduce){
  *{ animation-duration:.001s !important; }
  .reveal{ opacity:1; transform:none; }
  .blob{ animation:none; }
}
