/* =====================================================================
   APSELA · camada premium (lux)
   Carregada DEPOIS de apsela.css. Não altera o HTML-base nem o JS:
   refina tokens, tipografia, superfícies e componentes.
   Referências: Seed (contenção, respiro, vidro sobre foto, tabela
   comparativa) e Metza (buybox de kits, cards macios, CTA escuro
   com seta em círculo, títulos em duas cores).
   Para voltar ao visual anterior: remova o <link> deste arquivo.
   ===================================================================== */

:root {
  /* paleta: vinho profundo + porcelana + champagne; o framboesa vira acento */
  --vinho: #4A0A1C;
  --vinho-2: #6B1231;
  --vinho-3: #8A1C43;
  --noite: #2B0611;
  --framb: #BE3A63;
  --framb-2: #D2557E;
  --rosa: #EBA3B8;
  --rosa-2: #F4C6D3;
  --blush: #F6E2E7;
  --blush-2: #FBF1F3;
  --creme: #FCF8F4;
  --papel: #F5EDE8;
  --porc: #FFFFFF;
  --champ: #C29A68;
  --champ-l: rgba(194, 154, 104, .45);
  --ink: #2A0811;
  --txt: #5D4750;
  --muted: #94808A;
  --line: rgba(74, 10, 28, .09);
  --line-2: rgba(74, 10, 28, .18);
  --line-l: rgba(255, 228, 236, .16);

  --ff-a: 'Cormorant Garamond', 'Italiana', Georgia, serif;

  --r: 34px;
  --r-lg: 26px;
  --r-md: 18px;
  --r-sm: 12px;
  --sh: 0 1px 2px rgba(74, 10, 28, .04), 0 28px 56px -34px rgba(74, 10, 28, .34);
  --sh-2: 0 1px 2px rgba(74, 10, 28, .05), 0 40px 80px -40px rgba(74, 10, 28, .45);
  --ease: cubic-bezier(.22, .8, .16, 1);
}

body { background: var(--creme); color: var(--txt); font-feature-settings: "ss01", "kern"; text-rendering: optimizeLegibility; }
::selection { background: var(--rosa-2); color: var(--vinho); }

/* ---------- ritmo ---------- */
.sec { padding: 76px 0; }

/* ---------- tipografia ---------- */
.h-xl, .h-l, .h-m { letter-spacing: -.012em; color: var(--ink); }
.h-xl { font-size: clamp(46px, 12vw, 104px); line-height: .96; }
.h-l { font-size: clamp(38px, 9.6vw, 74px); line-height: 1; }

/* a segunda voz deixa de gritar: itálico editorial no lugar da caixa-alta pesada */
.x {
  display: block; margin-top: .06em;
  font-family: var(--ff-a); font-style: italic; font-weight: 500;
  text-transform: none; letter-spacing: -.012em; line-height: .98;
  font-size: .9em; color: var(--framb);
}
.dark .x { color: var(--rosa); }
.pink .x { color: var(--framb); }

.refrao { line-height: 1.04; }
.refrao b {
  font-family: var(--ff-a); font-style: italic; font-weight: 500;
  text-transform: none; letter-spacing: -.01em;
  font-size: .8em; line-height: 1.05; color: var(--framb); margin-top: .18em;
}
.dark .refrao b { color: var(--rosa); }

.lab { font-size: 10.5px; font-weight: 600; letter-spacing: .28em; gap: 14px; color: var(--vinho); }
.lab::before { font-family: var(--ff-a); font-style: italic; font-weight: 500; font-size: 19px; color: var(--framb); }
.lab::after { flex-basis: 96px; background: var(--champ-l); }
.dark .lab::after { background: rgba(235, 163, 184, .28); }

.tx { line-height: 1.68; }
.tx b, .tx strong { font-weight: 600; }
.three { font-weight: 600; letter-spacing: .26em; font-size: 10.5px; gap: 8px 16px; }
.three i { width: 4px; height: 4px; background: var(--champ); transform: rotate(45deg); border-radius: 0; }
.dark .three i { background: var(--champ); }
.small { color: var(--muted); }

.quote { font-family: var(--ff-a) !important; font-style: italic; font-weight: 500; font-size: 28px !important; border-left: 1px solid var(--champ) !important; padding-left: 18px !important; color: var(--vinho) !important; }

/* ---------- botões: escuro, contido, seta em círculo ---------- */
.btn {
  min-height: 58px; padding: 0 8px 0 30px; gap: 20px;
  background: var(--vinho); color: var(--creme);
  font-size: 12px; font-weight: 600; letter-spacing: .2em;
  box-shadow: 0 1px 0 rgba(255, 255, 255, .08) inset, 0 18px 34px -20px rgba(74, 10, 28, .85);
  transition: transform .5s var(--ease), background .4s var(--ease), box-shadow .5s var(--ease);
}
.btn::after {
  width: 42px; height: 42px; border-radius: 50%;
  -webkit-mask: none; mask: none;
  background: var(--framb) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / 17px no-repeat;
  transition: transform .5s var(--ease), background-color .4s;
}
.btn:hover { transform: translateY(-2px); background: var(--noite); box-shadow: 0 1px 0 rgba(255, 255, 255, .08) inset, 0 26px 40px -22px rgba(74, 10, 28, .95); }
.btn:hover::after { transform: translateX(3px); background-color: var(--framb-2); }
.btn-block { padding-left: 34px; justify-content: space-between; }
.btn-block::before { content: ''; width: 42px; flex: 0 0 auto; }

/* sobre fundos escuros o CTA vira porcelana */
.dark .btn, .btn-light { background: var(--creme); color: var(--vinho); box-shadow: 0 20px 36px -22px rgba(0, 0, 0, .7); }
.dark .btn::after, .btn-light::after {
  background: var(--vinho) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / 17px no-repeat;
}
.dark .btn:hover, .btn-light:hover { background: #fff; color: var(--vinho); }
.dark .btn:hover::after, .btn-light:hover::after { background-color: var(--framb); }

.btn-sm { min-height: 42px; padding: 0 5px 0 20px; gap: 12px; font-size: 10.5px; letter-spacing: .2em; box-shadow: none; }
.btn-sm::after { width: 32px; height: 32px; background-size: 14px; }

.note { font-size: 12.5px; letter-spacing: .01em; }
.note b { font-weight: 600; }

/* ---------- faixa e topo ---------- */
.tick { background: var(--noite); color: rgba(246, 226, 231, .82); height: 36px; }
.tick span { font-size: 10px; font-weight: 600; letter-spacing: .28em; gap: 30px; padding-right: 30px; }
.tick span::after { width: 4px; height: 4px; border-radius: 0; transform: rotate(45deg); background: var(--champ); }

.nav { background: rgba(252, 248, 244, .82); backdrop-filter: saturate(1.4) blur(18px); -webkit-backdrop-filter: saturate(1.4) blur(18px); border-bottom-color: rgba(74, 10, 28, .07); }
.nav-links { font-weight: 500; letter-spacing: .02em; color: var(--ink); }
.nav-links a { position: relative; padding: 6px 0; }
.nav-links a::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--framb); transform: scaleX(0); transform-origin: right; transition: transform .5s var(--ease); }
.nav-links a:hover { color: var(--vinho); }
.nav-links a:hover::after { transform: scaleX(1); transform-origin: left; }
.nav-safe { font-weight: 600; letter-spacing: .04em; }

/* ---------- painéis ---------- */
.panel { border-radius: var(--r); }
.dark {
  background:
    radial-gradient(120% 80% at 88% -10%, rgba(160, 38, 82, .55) 0%, rgba(160, 38, 82, 0) 58%),
    radial-gradient(90% 70% at -5% 110%, rgba(120, 20, 58, .55) 0%, rgba(120, 20, 58, 0) 62%),
    linear-gradient(180deg, #4E0B1E 0%, #3A0716 100%);
  color: var(--creme);
  position: relative; isolation: isolate;
}
.dark::before {
  content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: .5; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .09 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.dark .tx { color: rgba(255, 240, 244, .76); }
.wm { opacity: .045; }

/* o painel rosa-choque vira um blush editorial */
.pink {
  background:
    radial-gradient(80% 90% at 100% 0%, rgba(255, 255, 255, .7) 0%, rgba(255, 255, 255, 0) 60%),
    linear-gradient(160deg, #F7E6EA 0%, #F2D6DE 55%, #ECC8D3 100%);
  color: var(--ink);
}
.pink .h-xl, .pink .h-l, .pink .h-m { color: var(--ink); }
.pink .tx { color: var(--txt); }
.pink .tx b { color: var(--ink); }
.pink .lab { color: var(--vinho); }
.pink .lab::before { color: var(--framb); }
.pink .lab::after { background: rgba(74, 10, 28, .16); }
.pink .rot { background: rgba(255, 255, 255, .6); border: 1px solid rgba(255, 255, 255, .8); }
.pink .rot-c { color: var(--vinho); }
.pink .rot-c span:last-child { color: var(--framb); }
.pink .btn-light { background: var(--vinho); color: var(--creme); }
.pink .btn-light::after { background-color: var(--framb); }

/* ---------- moldura de rótulo: papel macio, cantos suaves ---------- */
.rot { padding: 8px 8px 0; border: 0; border-radius: var(--r-lg); background: var(--porc); box-shadow: var(--sh); }
.rot-i { border-radius: calc(var(--r-lg) - 8px); isolation: isolate; }
.rot-i > img, .rot-i > video { transition: transform 1.6s var(--ease); }
.rot-c { padding: 11px 8px 10px; font-size: 9.5px; font-weight: 600; letter-spacing: .24em; }
.dark .rot { background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .1); box-shadow: 0 40px 70px -40px rgba(0, 0, 0, .6); }

/* selo K-beauty com aro champagne */
.kb { background: var(--creme); box-shadow: 0 0 0 1px var(--champ-l), 0 0 0 7px rgba(252, 248, 244, .22), var(--sh-2); }
.kb small { font-weight: 700; letter-spacing: .16em; }

.trust span { font-weight: 500; }
.trust span::before { background-color: var(--vinho); }

/* ---------- cards de dor ---------- */
.dor { gap: 10px; }
.dor li { border: 1px solid var(--line); border-radius: var(--r-md); background: var(--porc); font-weight: 500; box-shadow: 0 1px 2px rgba(74, 10, 28, .03); transition: transform .4s var(--ease), box-shadow .4s var(--ease), border-color .4s; }
.dor li:hover { transform: translateY(-2px); border-color: rgba(190, 58, 99, .28); box-shadow: var(--sh); }
.dor li::before { background: var(--blush); color: var(--framb); font-weight: 500; }

/* ---------- lupa ---------- */
.lupa { gap: 10px; }
.lupa-s { border-radius: var(--r-md); }
.lupa-t, .ba-t { border-radius: 999px; padding: 6px 11px; font-weight: 700; letter-spacing: .18em; font-size: 9.5px; background: rgba(252, 248, 244, .92); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.lupa-t-b, .ba-t-b { background: var(--vinho); color: var(--creme); }
.lupa-c { border-radius: 12px; background: rgba(252, 248, 244, .86); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); font-weight: 600; }
.lupa-z { border-width: 2px; box-shadow: 0 0 0 1px var(--champ-l), 0 18px 30px -12px rgba(42, 8, 17, .55); }

/* ---------- pad check ---------- */
.pc-box { border-radius: 28px; background: rgba(255, 255, 255, .78); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border: 1px solid rgba(255, 255, 255, .9); box-shadow: var(--sh-2); }
.pc-ring { border-color: var(--champ-l); }
.pc-msg { font-family: var(--ff-a); font-style: italic; font-weight: 500; font-size: 25px; }
.pc-range { background: linear-gradient(90deg, var(--blush) 0%, var(--blush-2) 100%); box-shadow: inset 0 0 0 1px var(--line); }
.pc-range::-webkit-slider-thumb { background-color: var(--vinho); border-color: #fff; box-shadow: 0 12px 22px -10px rgba(74, 10, 28, .7); }
.pc-range::-moz-range-thumb { background: var(--vinho); }
.pc-meter { font-weight: 600; letter-spacing: .02em; }

.passos { gap: 10px; }
.passo { border-radius: var(--r-md); background: rgba(255, 255, 255, .62); border: 1px solid rgba(255, 255, 255, .85); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); padding: 14px 16px; }
.passo > b { font-family: var(--ff-a); font-style: italic; font-weight: 500; font-size: 30px; color: var(--framb); }

/* ---------- antes e depois ---------- */
.ba-line { width: 1px; background: rgba(255, 255, 255, .9); }
.ba-knob { width: 46px; height: 46px; margin: -23px 0 0 -23px; background: rgba(252, 248, 244, .9); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); box-shadow: 0 0 0 1px rgba(255, 255, 255, .7), 0 14px 26px -10px rgba(42, 8, 17, .55); }

/* ---------- trilho e depoimentos ---------- */
.rail { gap: 14px; padding-bottom: 18px; }
.dots i { width: 5px; height: 5px; }
.dots i.on { width: 22px; background: var(--vinho); }
.rail-hint { font-weight: 500; letter-spacing: .02em; }

.rv { border-radius: var(--r-lg); border: 1px solid var(--line); padding: 22px; box-shadow: 0 1px 2px rgba(74, 10, 28, .03); }
.rv-av { background: linear-gradient(135deg, var(--blush) 0%, var(--rosa-2) 100%); font-family: var(--ff-a); font-style: italic; font-size: 21px; }
.rv-n { font-weight: 600; }
.rv-st { color: var(--champ); letter-spacing: 3px; font-size: 11.5px; }
.rv-v { color: #4F7D63; font-weight: 600; font-size: 10px; letter-spacing: .04em; }
.rv-t { margin-top: 14px; font-size: 15px; line-height: 1.6; color: var(--ink); }
.rv-t b { color: var(--vinho); font-weight: 600; background: linear-gradient(transparent 62%, rgba(235, 163, 184, .35) 62%); }

/* ---------- oferta (todas as caixas de compra) ---------- */
.of-box, .of2-box, .ofx-box { border: 0 !important; border-radius: 30px; background: var(--porc); box-shadow: var(--sh-2); }
.of-vis { border-radius: 30px !important; }
.kits { gap: 12px; }
.kit { border: 1px solid var(--line-2); border-radius: var(--r-md); background: var(--porc); padding: 14px 16px; transition: border-color .3s, background .3s, box-shadow .4s var(--ease), transform .4s var(--ease); }
.kit:hover { border-color: rgba(74, 10, 28, .32); }
.kit.on { border: 1.5px solid var(--vinho); background: linear-gradient(180deg, #FFFFFF 0%, var(--blush-2) 100%); box-shadow: 0 22px 40px -28px rgba(74, 10, 28, .55); }
.kit-r { border-width: 1.5px; }
.kit.on .kit-r { border-color: var(--vinho); background: radial-gradient(circle, var(--vinho) 0 40%, #fff 46%); }
.kit-n { font-weight: 600; letter-spacing: -.005em; }
.kit-s b { color: var(--framb); font-weight: 600; }
.kit-v { font-weight: 700; letter-spacing: -.01em; }
.kit-flag { top: -11px; right: 16px; border-radius: 999px; padding: 5px 11px; font-weight: 700; letter-spacing: .18em; font-size: 9px; background: var(--framb); }
.kit-flag-alt { background: var(--vinho); }

.gifts { gap: 8px; }
.gift { border: 1px solid var(--line); border-radius: var(--r-sm); font-weight: 600; background: var(--porc); }
.gift.on { border-color: rgba(190, 58, 99, .45); background: var(--blush-2); }
.gift-lock { border-radius: 999px; padding: 2px 7px; font-weight: 700; }

.price-big { letter-spacing: -.01em; }
.price-big small { font-weight: 600; }
.price-off { border-radius: 999px; padding: 3px 9px; font-weight: 700; background: var(--framb); }
.price-r b.eco { color: var(--framb); }

.safe { gap: 8px; }
.safe span { border-radius: var(--r-sm); background: var(--papel); font-weight: 600; letter-spacing: .01em; }
.safe .ico { color: var(--vinho); }

.checks li::before { background-color: var(--blush); }

/* ---------- pra quem é ---------- */
.quem { gap: 12px; }
.quem > div { border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--porc); padding: 22px 22px 14px; }
.quem .sim { border-color: rgba(190, 58, 99, .3); background: linear-gradient(180deg, var(--porc) 0%, var(--blush-2) 100%); box-shadow: var(--sh); }
.quem h3 { font-weight: 700; letter-spacing: .24em; font-size: 10px; }
.quem li { font-weight: 500; }

/* ---------- faq ---------- */
.faq-q { font-weight: 600; font-size: 16px; padding: 22px 0; letter-spacing: -.005em; }
.faq-ico { width: 32px; height: 32px; border: 1px solid var(--line-2); color: var(--vinho); font-size: 18px; font-weight: 300; transition: transform .5s var(--ease), background .3s, color .3s; }
.faq-q:hover .faq-ico { border-color: var(--vinho); }
.faq-i.on .faq-ico { background: var(--vinho); border-color: var(--vinho); color: #fff; }
.faq-a > div { line-height: 1.7; }

/* ---------- rodapé e barra ---------- */
.foot-logo { opacity: .96; }
.foot-row { letter-spacing: .01em; }
.bar { background: rgba(43, 6, 17, .9); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); box-shadow: 0 0 0 1px rgba(255, 255, 255, .06), 0 24px 44px -18px rgba(20, 2, 8, .8); }
.bar .btn { background: var(--creme); color: var(--vinho); padding: 0 5px 0 18px; min-height: 46px; gap: 10px; }
.bar .btn::after { width: 36px; height: 36px; background: var(--vinho) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / 15px no-repeat; }

.vid-play { box-shadow: 0 0 0 1px rgba(255, 255, 255, .5), 0 0 0 12px rgba(252, 248, 244, .18); background: rgba(252, 248, 244, .9); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.vid-play::before { border-left-color: var(--vinho); }

/* ---------- componentes próprios das páginas ---------- */
/* vendas */
.tl { gap: 12px; }
.tl > div { border: 1px solid var(--line) !important; border-radius: var(--r-md); background: var(--porc) !important; }
.tl b { font-weight: 700 !important; letter-spacing: .2em !important; }
.stat { border: 0 !important; border-radius: var(--r-lg); background: var(--porc) !important; box-shadow: var(--sh); padding: 20px 22px !important; }
.stat b, .stat-row b { color: var(--vinho) !important; }
.pick { gap: 8px; }
.pick button { border-radius: 999px !important; padding: 9px 16px !important; font-weight: 600 !important; border-color: var(--line-2) !important; transition: .3s; }
.pick button.on { background: var(--vinho) !important; border-color: var(--vinho) !important; }
.pil > div { border-radius: 22px !important; border: 1px solid rgba(255, 255, 255, .1) !important; background: rgba(255, 255, 255, .045); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); padding: 20px 20px 16px !important; }
.pil h3 { font-weight: 600 !important; text-transform: none !important; letter-spacing: -.005em !important; font-size: 20px !important; }
.pil b.n { font-family: var(--ff-a) !important; font-style: italic; font-weight: 500 !important; }
.pil small { font-weight: 600 !important; letter-spacing: .18em !important; border-top-color: rgba(255, 255, 255, .1) !important; }
.jar-hint { font-weight: 600 !important; letter-spacing: .26em !important; color: rgba(235, 163, 184, .8) !important; }
.seal30 { border-color: var(--champ-l) !important; box-shadow: inset 0 0 0 6px rgba(255, 255, 255, .03); }
.seal30 b { font-family: var(--ff-a) !important; font-style: italic; font-weight: 500 !important; }
.seal30 span { font-weight: 600 !important; letter-spacing: .28em !important; }

/* oferta */
.gal .rot { padding-bottom: 8px; }
.gal-tag { border-radius: 999px; padding: 6px 12px !important; font-weight: 700 !important; letter-spacing: .16em !important; background: var(--vinho) !important; }
.gal-th { gap: 10px !important; }
.gal-th button { border-radius: 14px; border: 1px solid var(--line) !important; transition: opacity .3s, border-color .3s; }
.gal-th button.on { border-color: var(--vinho) !important; }
.gar-mini { border-radius: var(--r-md); border-color: var(--line) !important; }
.gar-mini b.n { font-family: var(--ff-a) !important; font-style: italic; color: var(--vinho) !important; }
.tabs { border-top-color: var(--line) !important; }
.tabs-h button { font-weight: 600 !important; letter-spacing: .2em !important; }
.tabs-h button.on { border-bottom-color: var(--vinho) !important; }
.tab-l li span:last-child { font-weight: 700 !important; letter-spacing: .16em !important; }
.stat-row { gap: 10px !important; }
.stat-row > div { border: 0 !important; border-radius: var(--r-md); background: var(--porc) !important; box-shadow: var(--sh); }
.err { gap: 10px !important; }
.err li { border-radius: var(--r-md); border-color: var(--line) !important; background: var(--porc) !important; }
.err li.ok { border-color: rgba(190, 58, 99, .4) !important; background: linear-gradient(180deg, var(--porc), var(--blush-2)) !important; box-shadow: var(--sh); }
.err li.ok > i { background: var(--vinho) !important; }
.err li b { font-weight: 600 !important; }
.dg-l b { font-weight: 600 !important; letter-spacing: .1em !important; }
.dg-l::after { background: var(--champ) !important; }

/* advertorial */
.mot { border-bottom-color: var(--line) !important; }
.mot-n { font-family: var(--ff-a) !important; font-style: italic; font-weight: 400; color: var(--framb) !important; }
.mot-tags span { border-radius: 999px; font-weight: 600 !important; letter-spacing: .18em !important; border-color: var(--line-2) !important; padding: 7px 12px !important; }
.mot .pc-box { border-radius: 28px; }
.hero-n { font-family: var(--ff-a) !important; font-style: italic; }

/* quiz: tokens que faltavam + cantos macios no lugar dos cantos retos */
.q-top { background: rgba(252, 248, 244, .82) !important; }
.q-bar { height: 3px !important; }
.q-q em { font-family: var(--ff-a); font-style: italic !important; font-weight: 500; color: var(--framb); }
.q .q-opt { border-radius: var(--r-md) !important; border: 1px solid var(--line-2); font-weight: 500; padding: 15px 16px; transition: border-color .3s, background .3s, box-shadow .4s var(--ease), transform .15s; }
.q .q-opt:hover { border-color: rgba(74, 10, 28, .32); }
.q .q-opt.on { border-color: var(--vinho); box-shadow: 0 18px 34px -24px rgba(74, 10, 28, .6); }
.q .q-ico { font-family: var(--ff-a); font-style: italic; font-size: 19px; }
.q .q-opt.on .q-ico { background: var(--vinho) !important; border-color: var(--vinho); }
.q .q-card { border-radius: var(--r-md) !important; padding: 5px; }
.q .q-card img { border-radius: calc(var(--r-md) - 5px); }
.q .q-card::after { border-radius: calc(var(--r-md) - 5px); }
.q .q-card.on { border-color: var(--vinho) !important; box-shadow: 0 18px 34px -22px rgba(74, 10, 28, .7); }
.q .q-card.on .q-tick { background: var(--vinho); }
.q .q-media .ba, .q .q-media .arch { border-radius: var(--r-lg) !important; }
.q .q-res { border-radius: var(--r-lg) !important; }
.q .q-tag { border-radius: 999px; font-weight: 700; letter-spacing: .16em; }
.q .pc-box { border-radius: var(--r-lg); }
.q .q-load .seal { box-shadow: 0 0 0 1px var(--champ-l), var(--sh-2); }
.q .q-load .seal b { font-family: var(--ff-a); font-style: italic; font-weight: 500; }
.q .q-load-ring { border-color: var(--champ-l); }

/* ---------- entrada suave (o JS já marca .in; antes nada animava) ---------- */
.lux-js [data-r] { opacity: 0; transform: translateY(22px); transition: opacity 1.1s var(--ease), transform 1.2s var(--ease); }
.lux-js [data-r].in { opacity: 1; transform: none; }

@media (hover: hover) {
  .rot:hover .rot-i > img { transform: scale(1.035); }
}

/* ---------- tabela comparativa (nova, página de vendas) ---------- */
.cmp { padding: 64px 0; }
.cmp .h-l { margin-top: 16px; }
.cmp-sub { margin-top: 16px; max-width: 520px; }
.cmp-wrap { margin-top: 30px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.cmp-wrap::-webkit-scrollbar { display: none; }
.cmp-t { width: 100%; min-width: 620px; border-collapse: separate; border-spacing: 0; border-radius: 28px; background: rgba(255, 255, 255, .045); border: 1px solid rgba(255, 255, 255, .1); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.cmp-t th, .cmp-t td { padding: 17px 14px; text-align: center; font-size: 13.5px; line-height: 1.35; color: rgba(255, 240, 244, .62); border-bottom: 1px solid rgba(255, 255, 255, .07); }
.cmp-t tr:last-child td { border-bottom: 0; }
.cmp-t thead th { padding-top: 22px; padding-bottom: 18px; font-size: 10px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: rgba(255, 240, 244, .7); }
.cmp-t td:first-child, .cmp-t th:first-child { text-align: left; padding-left: 24px; color: var(--creme); font-weight: 500; font-size: 14.5px; }
.cmp-t .me { position: relative; background: rgba(252, 248, 244, .96); color: var(--vinho); font-weight: 600; border-bottom-color: rgba(74, 10, 28, .07); }
.cmp-t thead .me { border-radius: 20px 20px 0 0; text-transform: none; letter-spacing: 0; }
.cmp-t tr:last-child .me { border-radius: 0 0 20px 20px; }
.cmp-t thead .me svg { width: 74px; margin: 0 auto; color: var(--vinho); }
.cmp-y, .cmp-n { display: inline-flex; width: 24px; height: 24px; border-radius: 50%; vertical-align: middle; }
.cmp-y { background: var(--vinho) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center / 13px no-repeat; }
.cmp-n { border: 1px solid rgba(255, 240, 244, .28); background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F6D5DE' stroke-opacity='.6' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M8 12h8'/%3E%3C/svg%3E") center / 14px no-repeat; }
.cmp-note { margin-top: 16px; font-size: 11.5px; color: rgba(255, 228, 236, .5); }
.cmp-hint { display: block; margin-top: 10px; font-size: 11px; font-weight: 500; color: rgba(255, 228, 236, .55); }
.cmp .wm { width: 150%; left: -25%; top: 20%; }

@media (min-width: 768px) {
  :root { --r: 46px; }
  .sec { padding: 136px 0; }
  .h-xl { font-size: clamp(64px, 8.4vw, 112px); }
  .lab { font-size: 11px; }
  .nav-in { height: 78px; }
  .nav-links { gap: 38px; font-size: 13.5px; }
  .dor { gap: 12px; }
  .rv { width: 360px; }
  .quem { gap: 16px; }
  .kit { padding: 16px 20px; }
  .rail { gap: 18px; }
  .cmp { padding: 120px 0; }
  .cmp-hint { display: none; }
  .cmp-t th, .cmp-t td { padding: 19px 18px; font-size: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  .lux-js [data-r] { opacity: 1; transform: none; }
}

/* ---------- ajustes pós-verificação ---------- */
/* "sim" das alternativas em tom claro (vinho sobre vinho sumia) */
.cmp-t td:not(.me) .cmp-y { background-color: rgba(255, 240, 244, .16); box-shadow: inset 0 0 0 1px rgba(255, 240, 244, .22); }
/* no celular a 1ª coluna fica presa enquanto a tabela desliza */
@media (max-width: 767px) {
  .cmp-t th:first-child, .cmp-t td:first-child { position: sticky; left: 0; z-index: 2; background: #470A1B; min-width: 150px; padding-left: 18px; box-shadow: 10px 0 18px -14px rgba(0, 0, 0, .6); }
  .cmp-t thead th:first-child { border-top-left-radius: 28px; }
  .cmp-t tr:last-child td:first-child { border-bottom-left-radius: 28px; }
  .btn { font-size: 11px; letter-spacing: .12em; padding-left: 22px; gap: 12px; }
  .btn::after { width: 40px; height: 40px; }
  .btn-block { padding-left: 24px; }
  .btn-block::before { display: none; }
}