/* =========================================================
   HEXA MAG · ajustes do CEO (rodada 2)
   Logos oficiais, efeitos de brilho/pulso e animações extras
   ========================================================= */
:root{--neon:#36D7FF;--neon-glow:rgba(54,215,255,.75)}

/* ---------- Logos oficiais (máscara: a cor vem do texto em volta) ---------- */
.lg{display:inline-block;flex:none;background:currentColor;-webkit-mask:var(--lg) center/contain no-repeat;mask:var(--lg) center/contain no-repeat}
.lg--hm{--lg:url(../Midias/web/logo-hexamag.png?v=2);aspect-ratio:707/446;height:34px}
.lg--hmfull{--lg:url(../Midias/web/logo-hexamag-full.png?v=2);aspect-ratio:960/552}
.lg--fl{--lg:url(../Midias/web/logo-fortlife.png);aspect-ratio:900/141;height:17px}
.logo .lg--hm{height:34px}
.logo--ft .lg--fl{height:18px}
.logo--ft .lg--hm{height:38px}
.lg--inline{height:1.32em;vertical-align:-.3em;margin:0 .06em}
.cmp__us .lg--sm{height:32px;color:var(--deep);display:block;margin:0 auto}
.cmp__head .cmp__us{text-align:center}
.reg{font-size:.42em;vertical-align:super;margin-left:1px;font-weight:600;line-height:0}
.ft__wm{font-size:0;line-height:0;opacity:1;margin-top:56px}
.ft__wm .lg--hmfull{display:block;height:clamp(130px,25vw,320px);color:var(--lime)}

/* ---------- (1) número 6 do banner pulsando ---------- */
.num6{display:inline-block;animation:six 2.4s ease-in-out infinite;transform-origin:50% 60%}
@keyframes six{
  0%,100%{text-shadow:0 0 30px rgba(182,227,126,.35);transform:scale(1)}
  45%{text-shadow:0 0 22px rgba(182,227,126,.95),0 0 60px rgba(182,227,126,.7);transform:scale(1.06)}
  52%{opacity:.75}
  58%{opacity:1}
}

/* ---------- (2) nome do ativo de cima, acima do hexágono e do pote ---------- */
.hero__stage .crystals{pointer-events:none}
.crystal--top{transform:rotate(var(--a)) translateX(calc(var(--R) * 1.17)) rotate(calc(-1 * var(--a)))}
.crystal--top i{top:auto;bottom:31px}

/* ---------- (3) frase da farmácia embaixo dos botões de compra ---------- */
.buywrap{display:inline-flex;flex-direction:column;align-items:center;gap:9px;max-width:100%}
.buywrap--block{display:flex;width:100%}
.buywrap--block>.btn{width:100%}
.buy-note{display:flex;align-items:center;gap:6px;font-size:12.5px;line-height:1.3;color:var(--muted);font-weight:500;text-align:center}
.buy-note svg{width:15px;height:15px;flex:none;fill:none;stroke:var(--green);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.buy-note b{font-weight:700;color:var(--forest)}
.buy-note--light{color:rgba(255,255,255,.75)}
.buy-note--light svg{stroke:var(--lime-glow)}
.buy-note--light b{color:#fff}

/* ---------- (4) botões de compra piscando + brilho passando ---------- */
.btn--glow{overflow:hidden;isolation:isolate;animation:btnPulse 2.2s ease-out infinite}
.btn--glow::after{content:"";position:absolute;inset:-2px;z-index:-1;pointer-events:none;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.65) 50%,transparent 65%);transform:translateX(-130%);animation:shine 3.2s ease-in-out infinite}
@keyframes btnPulse{
  0%{box-shadow:0 12px 30px -8px rgba(125,185,85,.7),0 0 0 0 rgba(155,208,103,.65)}
  70%{box-shadow:0 12px 30px -8px rgba(125,185,85,.7),0 0 0 14px rgba(155,208,103,0)}
  100%{box-shadow:0 12px 30px -8px rgba(125,185,85,.7),0 0 0 0 rgba(155,208,103,0)}
}
@keyframes shine{0%,55%{transform:translateX(-130%)}85%,100%{transform:translateX(130%)}}

/* ---------- (4, 19, 20) faixas que passam com brilho ---------- */
.marquee{position:relative}
.marquee::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(100deg,transparent 40%,rgba(255,255,255,.28) 50%,transparent 60%);background-size:250% 100%;animation:sweep 4.5s linear infinite}
.ticker--lime .marquee::after{background-image:linear-gradient(100deg,transparent 40%,rgba(255,255,255,.55) 50%,transparent 60%)}
@keyframes sweep{from{background-position:120% 0}to{background-position:-120% 0}}
.marquee__track span{animation:twinkle 3.6s ease-in-out infinite}
.marquee__track span:nth-child(3n+2){animation-delay:1.2s}
.marquee__track span:nth-child(3n){animation-delay:2.4s}
@keyframes twinkle{0%,70%,100%{text-shadow:none}35%{text-shadow:0 0 10px currentColor}}
.ticker--lime .marquee__track span{animation-name:twinkleDark}
@keyframes twinkleDark{0%,70%,100%{text-shadow:none}35%{text-shadow:0 0 12px rgba(255,255,255,.95)}}

/* ---------- (5) economia ao lado do desconto ---------- */
.kit__deal{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;margin-top:8px}
.kit__deal .kit__off{margin-top:0}
.kit__save{font-family:var(--mono);font-size:11px;font-weight:700;padding:4px 10px;border-radius:6px;background:var(--lime);color:var(--deep);white-space:nowrap;box-shadow:0 4px 12px -4px rgba(125,185,85,.8)}
.kitrow__save{display:block;font-style:normal;font-family:var(--mono);font-size:10.5px;font-weight:700;color:var(--green);margin-top:2px;white-space:nowrap}

/* ---------- (19) "mais vendido" piscando ---------- */
.kit--hot .kit__flag{animation:flag 1.8s ease-in-out infinite}
@keyframes flag{0%,100%{box-shadow:0 0 0 0 rgba(125,185,85,0);filter:brightness(1)}50%{box-shadow:0 0 0 6px rgba(125,185,85,.25),0 0 18px rgba(125,185,85,.8);filter:brightness(1.12)}}
.kitrow--hot{animation:rowHot 2s ease-in-out infinite}
.kitrow--hot em{animation:flag 1.8s ease-in-out infinite}
@keyframes rowHot{0%,100%{box-shadow:0 0 0 0 rgba(125,185,85,0)}50%{box-shadow:0 0 0 4px rgba(125,185,85,.22),0 0 22px rgba(125,185,85,.45)}}

/* ---------- (6, 20) ícones de garantia/frete/segurança ---------- */
.assure svg{box-sizing:border-box;width:46px;height:46px;padding:11px;border-radius:14px;background:linear-gradient(145deg,var(--lime-2),var(--green));stroke:#fff;stroke-width:2;box-shadow:0 8px 18px -6px rgba(46,125,50,.6);animation:icPulse 3s ease-in-out infinite}
.assure>div:nth-child(2) svg{animation-delay:1s}
.assure>div:nth-child(3) svg{animation-delay:2s}
@keyframes icPulse{0%,100%{transform:translateY(0);box-shadow:0 8px 18px -6px rgba(46,125,50,.6),0 0 0 0 rgba(125,185,85,0)}40%{transform:translateY(-3px);box-shadow:0 12px 22px -6px rgba(46,125,50,.7),0 0 0 7px rgba(125,185,85,.18)}}
.assure--row{justify-content:center}
.assure--row>div{flex-direction:column;text-align:center;gap:8px}

/* ---------- (8) ícones dos selos ---------- */
.trust i.ic{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:linear-gradient(145deg,var(--lime-2),var(--green));box-shadow:0 4px 12px -3px rgba(46,125,50,.6);animation:icPulse 3s ease-in-out infinite}
.trust span:nth-child(2) i.ic{animation-delay:1s}
.trust span:nth-child(3) i.ic{animation-delay:2s}
.trust i.ic svg{width:16px;height:16px;stroke:#fff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;fill:none}

/* ---------- (9, 10, 11) hexágono das 6 formas ---------- */
.hexmap__orbit{stroke:rgba(182,227,126,.8);stroke-width:2.4;stroke-dasharray:3 10;stroke-linecap:round;filter:drop-shadow(0 0 5px rgba(182,227,126,.7))}
.hexmap__arrows path{fill:none;stroke:var(--lime-glow);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 4px rgba(182,227,126,.9));animation:arrowBlink 1.8s ease-in-out infinite}
@keyframes arrowBlink{0%,100%{opacity:.25}50%{opacity:1}}
.hexmap__core{animation:corePulse 2.4s ease-in-out infinite}
@keyframes corePulse{0%,100%{filter:drop-shadow(0 0 10px rgba(182,227,126,.35))}50%{filter:drop-shadow(0 0 28px rgba(182,227,126,.95))}}
.core-logo{animation:logoBlink 2.4s ease-in-out infinite}
@keyframes logoBlink{0%,100%{opacity:1}50%{opacity:.72}}
.core-reg{font-family:var(--font);font-size:11px;font-weight:700;fill:var(--forest)}
.node--sat circle{stroke:var(--neon)!important;stroke-dasharray:none!important;stroke-width:2!important}
.node .node__plus{font-size:38px;font-weight:900;fill:var(--neon)!important;filter:drop-shadow(0 0 6px var(--neon-glow));animation:neon 1.6s ease-in-out infinite}
.node--sat.is-on circle{fill:rgba(54,215,255,.16)!important}
@keyframes neon{0%,100%{opacity:1;filter:drop-shadow(0 0 4px var(--neon-glow))}50%{opacity:.55;filter:drop-shadow(0 0 14px var(--neon-glow))}}

/* ---------- (12) "+" no lugar de "E MAIS" ---------- */
.step__plus{display:block;font-size:clamp(30px,3vw,42px);line-height:1;font-weight:900;color:var(--neon);text-shadow:0 0 12px var(--neon-glow);margin-bottom:6px;animation:neonTxt 1.6s ease-in-out infinite}
@keyframes neonTxt{0%,100%{opacity:1;text-shadow:0 0 6px var(--neon-glow)}50%{opacity:.6;text-shadow:0 0 20px var(--neon-glow)}}

/* ---------- (14) calendário: cápsulas em movimento ---------- */
.calendar__t{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
.calendar__day{font-family:var(--mono);font-size:12px;font-weight:700;color:var(--muted);letter-spacing:.06em}
.calendar__day b{display:inline-block;min-width:2ch;text-align:right;color:var(--green);font-size:15px}
.day .pair svg{translate:0 0;rotate:var(--tilt,0deg);transition:fill .3s,stroke .3s;animation:capFloat 2.2s ease-in-out infinite alternate;animation-delay:calc(var(--i) * -.17s)}
.day .pair svg+svg{animation-delay:calc(var(--i) * -.17s - .55s);rotate:calc(var(--tilt,0deg) * -1)}
@keyframes capFloat{from{translate:0 2px}to{translate:0 -3px}}
.day.is-done{background:#DDEDD0}
.day.is-done svg{fill:var(--lime);stroke:var(--green)}
.day.is-done small{color:var(--green)}
.day.is-now{background:var(--lime);box-shadow:0 0 0 3px rgba(125,185,85,.3),0 8px 18px -6px rgba(46,125,50,.6);animation:dayPop .5s cubic-bezier(.3,1.6,.5,1)}
.day.is-now small{color:var(--deep)}
.day.is-now svg{fill:#fff;stroke:var(--deep)}
@keyframes dayPop{from{transform:scale(.8)}to{transform:scale(1)}}

/* ---------- (15) mini-hexágono com nomes girando ---------- */
.mh-lbl{font-family:var(--font);font-size:17px;font-weight:700;fill:var(--forest);text-anchor:middle;dominant-baseline:middle;transition:opacity .4s}
.mh-b .mh{animation:ballPulse 3s ease-in-out infinite;animation-delay:calc(var(--k) * .5s)}
@keyframes ballPulse{0%,100%{filter:drop-shadow(0 0 0 rgba(125,185,85,0))}25%{filter:drop-shadow(0 0 12px rgba(125,185,85,1))}}
.minihex[data-mode=mono] .mh-b:not(.mh--keep){opacity:.22}
.minihex[data-mode=mono] .mh--keep .mh{fill:var(--lime)!important;stroke:var(--lime-glow)!important;stroke-dasharray:none!important}
.mh-b{transition:opacity .4s}

/* ---------- (16, 17) comparativo: hexaMAG à direita, benefícios entrando piscando ---------- */
.js .versus .cmp__row{opacity:0}
.versus .cmp.is-play .cmp__row{animation:rowIn .6s ease-out forwards,allBlink 1.3s ease-in-out;animation-delay:calc(.2s + var(--r) * .65s),3.8s}
@keyframes rowIn{0%{opacity:0;transform:translateX(32px)}55%{opacity:1;transform:none}70%{opacity:.35}100%{opacity:1;transform:none}}
@keyframes allBlink{0%,100%{opacity:1}20%{opacity:.12}40%{opacity:1}60%{opacity:.12}80%{opacity:1}}
.cmp__row .ok{position:relative;overflow:hidden}
.cmp__row .ok::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(100deg,transparent 35%,rgba(255,255,255,.75) 50%,transparent 65%);transform:translateX(-120%);animation:shine 4s ease-in-out infinite;animation-delay:calc(2.5s + var(--r) * .3s)}
.cmp__row .ok i{animation:okGlow 2.4s ease-in-out infinite;animation-delay:calc(var(--r) * .3s)}
@keyframes okGlow{0%,100%{box-shadow:0 0 0 0 rgba(125,185,85,0)}50%{box-shadow:0 0 0 5px rgba(125,185,85,.25),0 0 12px rgba(125,185,85,.8)}}

/* ---------- (20) coração batendo e etiquetas em sequência ---------- */
.heart{display:inline-block;animation:beat 1.3s ease-in-out infinite;transform-origin:50% 60%}
@keyframes beat{0%,100%{transform:scale(1)}14%{transform:scale(1.22)}28%{transform:scale(1)}42%{transform:scale(1.15)}70%{transform:scale(1)}}
.tags span{transition:background .3s,color .3s;animation:tagBlink 4.8s ease-in-out infinite}
.tags span:nth-child(2){animation-delay:1.2s}
.tags span:nth-child(3){animation-delay:2.4s}
.tags span:nth-child(4){animation-delay:3.6s}
@keyframes tagBlink{0%,22%,100%{background:var(--mist);color:var(--forest);box-shadow:none}6%,16%{background:var(--lime);color:var(--deep);box-shadow:0 0 0 4px rgba(125,185,85,.22),0 0 18px rgba(125,185,85,.6)}}

/* ---------- (21) + L-Treonina no número 6 ---------- */
.stat__plus{display:block;margin-top:6px;font-weight:800;font-size:14px;color:var(--green);letter-spacing:.02em}

@media (max-width:820px){
  .kit__deal{justify-content:flex-start}
  .lg--inline{height:1.25em}
}
@media (prefers-reduced-motion:reduce){
  .num6,.btn--glow,.btn--glow::after,.marquee::after,.marquee__track span,.kit--hot .kit__flag,.kitrow--hot,.assure svg,.trust i.ic,.hexmap__arrows path,.hexmap__core,.core-logo,.node .node__plus,.step__plus,.day .pair svg,.mh-b .mh,.cmp__row .ok::after,.cmp__row .ok i,.heart,.tags span{animation:none!important}
  .js .versus .cmp__row{opacity:1}
}
.nowrap{white-space:nowrap}
/* ajustes finos */
.versus .minihex{width:min(330px,82vw)}
.mh-lbl{font-size:25px}
.cmp__row{align-items:stretch}
.cmp__row>span{display:flex;align-items:center}
.cmp__row .ok i,.cmp__row .no i{flex:none}

/* =========================================================
   Celular: espaçamento e leitura mais limpos
   ========================================================= */
@media (max-width:820px){
  /* cabeçalho: logos e botão sem aperto */
  .hdr__in{height:60px;gap:12px}
  .logo{gap:9px;min-width:0}
  .logo .lg--fl{height:12px}
  .logo .lg--hm{height:27px}
  .logo__sep{height:18px}
  .hdr .btn--sm{padding:9px 16px;font-size:12px;letter-spacing:.06em;flex:none}

  /* banner: espaço para o nome de cima e dica abaixo do "taurato" */
  .slide[data-theme=forest] .slide__in{padding-top:70px;gap:26px}
  .slide[data-theme=forest] .hero__stage{margin-bottom:58px}
  .crystal--top{transform:rotate(var(--a)) translateX(calc(var(--R) * 1.1)) rotate(calc(-1 * var(--a)))}
  .stage__hint{bottom:auto;top:calc(100% + 34px)}
  .chip{font-size:10px;letter-spacing:.1em;padding:7px 13px;margin-bottom:18px}

  /* textos com mais respiro */
  body{line-height:1.65}
  .h-sec{font-size:clamp(26px,7.4vw,32px);line-height:1.16;letter-spacing:-.025em;margin-bottom:16px}
  .h-hero{line-height:1}
  .lead{font-size:16px;line-height:1.65;margin:18px 0 26px}
  .sub{font-size:16px;line-height:1.6;margin-bottom:34px}
  .eyebrow{font-size:11px;letter-spacing:.12em;margin-bottom:12px}
  .split__txt p,.forwho p{font-size:16px;line-height:1.7;margin-bottom:16px}
  .qa p,.step p,.faq details>div{font-size:15.5px;line-height:1.65}
  .qa{padding:20px 0}
  .marquee__track span{padding:0 20px}
  .ticker{font-size:11.5px;padding:14px 0}
  .sec{padding:68px 0}
  .sec--tight{padding:56px 0}

  /* ícones da oferta alinhados numa coluna só */
  .assure{display:grid;grid-template-columns:auto;justify-content:center;justify-items:start;gap:14px}
  .assure>div{justify-content:flex-start}
  .assure--row{justify-items:center}
  .assure--row>div{flex-direction:row;text-align:left;width:100%;max-width:280px}
  .buy-note{font-size:12px;max-width:340px}

  /* hexágono das 6 formas: um pouco menor */
  .hexmap{max-height:36vh}
}
@media (max-width:380px){
  .logo .lg--fl{height:10.5px}
  .logo .lg--hm{height:24px}
  .hdr .btn--sm{padding:8px 13px;font-size:11.5px}
}

/* ---------- Selo "F" da FORTLIFE (versão verde do selo do Fort Club) ---------- */
.fbadge{position:relative;flex:none;display:inline-block;height:38px;aspect-ratio:230/253;border-radius:7px;overflow:hidden;
  background:
    linear-gradient(122deg,rgba(255,255,255,.34) 0%,rgba(255,255,255,.12) 40%,rgba(255,255,255,0) 41%),
    linear-gradient(160deg,#8ED15E 0%,#4FA83F 48%,#22742F 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45),inset 0 -2px 4px rgba(0,0,0,.18),0 5px 12px -5px rgba(11,46,24,.55)}
.fbadge::before{content:"";position:absolute;inset:0;background:#fff;-webkit-mask:url(../Midias/web/f-mark.png) center/100% 100% no-repeat;mask:url(../Midias/web/f-mark.png) center/100% 100% no-repeat}
.logo .fbadge{margin-right:-4px}
@media (max-width:820px){.fbadge{height:31px;border-radius:6px}.logo .fbadge{margin-right:-3px}}
@media (max-width:380px){.fbadge{height:27px}}

/* órbita de volta sobre os ativos, mais discreta (gira sem chamar atenção) */
.hexmap__orbit{stroke:rgba(182,227,126,.3);stroke-width:1.6;stroke-dasharray:3 9;filter:none}
.hexmap__arrows path{stroke:rgba(182,227,126,.55);stroke-width:2;filter:none;animation-name:arrowSoft}
@keyframes arrowSoft{0%,100%{opacity:.25}50%{opacity:.7}}
.core-reg{font-size:9px}

/* "Encontre também" sempre centralizado embaixo do botão */
.buywrap>.btn{align-self:center}
.step .buywrap{align-self:flex-start;margin-top:26px}
.step .buywrap>.btn{margin-top:0}

/* "+" da L-treonina desenhado no centro exato do círculo */
.node path.node__plus{fill:none!important;stroke:var(--neon);stroke-width:4.5;stroke-linecap:round;font-size:0}

/* ---------- Vídeo do CEO (destaque logo após o topo) ---------- */
.ceo{position:relative;overflow:hidden}
.ceo::before{content:"";position:absolute;inset:auto -10% -40% auto;width:60vw;height:60vw;max-width:760px;max-height:760px;border-radius:50%;background:radial-gradient(circle,rgba(125,185,85,.22),transparent 65%);pointer-events:none}
.ceo__grid{position:relative;display:grid;grid-template-columns:1.05fr .95fr;grid-template-areas:"head stage" "body stage";column-gap:72px;align-items:center}
.ceo__head{grid-area:head;align-self:end}
.ceo__stage{grid-area:stage}
.ceo__body{grid-area:body;align-self:start}
.ceo .h-sec{margin-bottom:22px}
.ceo .lg--hm{color:#fff}
.ceo__live{display:inline-block;width:8px;height:8px;border-radius:50%;background:#ff4d4d;margin-right:10px;vertical-align:1px;box-shadow:0 0 0 0 rgba(255,77,77,.6);animation:ceoLive 1.6s infinite}
@keyframes ceoLive{70%{box-shadow:0 0 0 9px rgba(255,77,77,0)}100%{box-shadow:0 0 0 0 rgba(255,77,77,0)}}
.ceo__body>p{font-size:17px;margin-bottom:22px}
.ceo__fact{display:flex;align-items:center;gap:16px;padding:14px 18px;border:1px solid rgba(182,227,126,.25);border-radius:16px;background:rgba(255,255,255,.04);margin-bottom:22px}
.ceo__fact b{flex:none;font-size:30px;line-height:1;font-weight:800;color:var(--lime-glow);letter-spacing:-.03em}
.ceo__fact span{font-size:14px;line-height:1.45}
.ceo__sign{display:flex;align-items:center;gap:12px;margin-bottom:28px;font-size:13px;line-height:1.35;color:rgba(255,255,255,.65)}
.ceo__sign b{display:block;font-size:16px;color:#fff}
.ceo__sign .fbadge{height:40px}

/* palco: celular com o vídeo vertical + hexágonos girando atrás */
.ceo__stage{position:relative;display:grid;place-items:center;padding:28px 0}
.ceo__ring{position:absolute;width:118%;max-width:560px;aspect-ratio:1;fill:none;pointer-events:none;animation:ceoSpin 40s linear infinite}
.ceo__ring polygon:first-child{stroke:rgba(182,227,126,.35);stroke-width:1.4;stroke-dasharray:3 9}
.ceo__ring polygon:last-child{stroke:rgba(182,227,126,.14);stroke-width:1}
@keyframes ceoSpin{to{transform:rotate(360deg)}}
.ceo__phone{position:relative;width:min(340px,78vw);aspect-ratio:9/16;border-radius:34px;padding:8px;background:linear-gradient(160deg,#2b4a33,#0a1f12);box-shadow:0 40px 90px -30px rgba(0,0,0,.8),0 0 0 1px rgba(182,227,126,.35),0 0 60px -10px rgba(125,185,85,.55)}
.ceo__video{display:block;width:100%;height:100%;object-fit:cover;border-radius:27px;background:#000}
.ceo__sound{position:absolute;inset:8px;border-radius:27px;display:flex;align-items:flex-end;justify-content:center;padding-bottom:14px;background:linear-gradient(180deg,rgba(6,24,13,0) 62%,rgba(6,24,13,.6));transition:opacity .35s}
.ceo__pill{display:flex;align-items:center;gap:12px;padding:6px 18px 6px 6px;border-radius:99px;background:rgba(6,24,13,.62);backdrop-filter:blur(8px);box-shadow:0 0 0 1px rgba(182,227,126,.35)}
.ceo__play{position:relative;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:linear-gradient(180deg,var(--lime-2),var(--lime));box-shadow:0 14px 34px -8px rgba(125,185,85,.9)}
.ceo__play::before,.ceo__play::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid var(--lime-glow);animation:ceoPing 2.2s ease-out infinite}
.ceo__play::after{animation-delay:1.1s}
@keyframes ceoPing{from{transform:scale(1);opacity:.8}to{transform:scale(1.7);opacity:0}}
.ceo__play svg{width:22px;height:22px;fill:var(--deep);margin-left:3px}
.ceo__cta{font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#fff}
.ceo__sound:hover .ceo__play{transform:scale(1.06)}
.ceo__play{transition:transform .25s}
.ceo__dur{position:absolute;top:20px;right:20px;font-family:var(--mono);font-size:11px;font-weight:700;color:#fff;background:rgba(6,24,13,.65);padding:4px 9px;border-radius:99px;pointer-events:none;transition:opacity .35s}
.ceo.is-sound .ceo__sound,.ceo.is-sound .ceo__dur{opacity:0;pointer-events:none}
@media (prefers-reduced-motion:reduce){.ceo__ring,.ceo__play::before,.ceo__play::after,.ceo__live{animation:none}}

@media (max-width:820px){
  .ceo__grid{grid-template-columns:1fr;grid-template-areas:"head" "stage" "body"}
  .ceo__head,.ceo__body{text-align:center}
  .ceo__stage{padding:10px 0 30px}
  .ceo__phone{width:min(300px,74vw);border-radius:30px}
  .ceo__video,.ceo__sound{border-radius:23px}
  .ceo__sound{padding-bottom:10px}
  .ceo__pill{gap:9px;padding:4px 14px 4px 4px}
  .ceo__play{width:40px;height:40px}
  .ceo__play svg{width:18px;height:18px}
  .ceo__cta{font-size:11px}
  .ceo__fact{text-align:left}
  .ceo__sign{justify-content:center;text-align:left}
  .ceo__body>p{font-size:16px}
}

/* ---------- Fotos novas (4:5) ---------- */
.split__img--45{aspect-ratio:4/5;max-width:480px}
.kit__media--photo{padding:0;aspect-ratio:1;overflow:hidden;background:#EEF3EA}
.kit__media--photo img{width:100%;height:100%;object-fit:cover;object-position:50% 58%;transition:transform .6s ease}
.kit:hover .kit__media--photo img{transform:scale(1.04)}

/* ---------- Frase da farmácia como selo azul (não clicável), mesmo brilho do botão verde ---------- */
.buy-note,.buy-note--light{position:relative;overflow:hidden;isolation:isolate;display:inline-flex;align-items:center;gap:7px;padding:8px 16px 8px 12px;border-radius:999px;
  background:linear-gradient(180deg,#6FE4FF,var(--neon));color:#04222E;font-size:11.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;white-space:nowrap;cursor:default;user-select:none;
  box-shadow:0 10px 24px -8px rgba(54,215,255,.75),inset 0 1px 0 rgba(255,255,255,.55);animation:notePulse 2.2s ease-out infinite}
.buy-note b,.buy-note--light b{color:#04222E;font-weight:800}
.buy-note svg,.buy-note--light svg{width:14px;height:14px;stroke:#04222E}
.buy-note::after{content:"";position:absolute;inset:-2px;z-index:-1;pointer-events:none;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.7) 50%,transparent 65%);transform:translateX(-130%);animation:shine 3.2s ease-in-out infinite 1.1s}
@keyframes notePulse{
  0%{box-shadow:0 10px 24px -8px rgba(54,215,255,.75),0 0 0 0 rgba(54,215,255,.6)}
  70%{box-shadow:0 10px 24px -8px rgba(54,215,255,.75),0 0 0 12px rgba(54,215,255,0)}
  100%{box-shadow:0 10px 24px -8px rgba(54,215,255,.75),0 0 0 0 rgba(54,215,255,0)}
}
.buywrap{gap:12px}
@media (max-width:820px){.buy-note,.buy-note--light{font-size:10.5px;padding:7px 14px 7px 10px;max-width:none}}
@media (prefers-reduced-motion:reduce){.buy-note,.buy-note::after{animation:none}}

/* ---------- Rodapé: logo grande do Hexa Mag à direita ---------- */
.ft__wm{display:flex;justify-content:flex-end}

/* ---------- Selo de frete grátis nas fotos dos kits ---------- */
.kit__media--photo{position:relative}
.kit__ship{position:absolute;left:12px;bottom:12px;display:inline-flex;align-items:center;gap:6px;padding:7px 12px 7px 9px;border-radius:999px;overflow:hidden;isolation:isolate;
  background:linear-gradient(180deg,#6FE4FF,var(--neon));color:#04222E;font-family:var(--mono);font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;
  box-shadow:0 8px 20px -6px rgba(54,215,255,.8),inset 0 1px 0 rgba(255,255,255,.55);animation:notePulse 2.2s ease-out infinite}
.kit__ship svg{width:15px;height:15px;fill:none;stroke:#04222E;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.kit__ship::after{content:"";position:absolute;inset:-2px;z-index:-1;pointer-events:none;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.7) 50%,transparent 65%);transform:translateX(-130%);animation:shine 3.2s ease-in-out infinite .6s}
@media (prefers-reduced-motion:reduce){.kit__ship,.kit__ship::after{animation:none}}

/* ---------- Kits no celular: foto inteira em cima, sem cortar os potes ---------- */
@media (max-width:820px){
  .kits .kit{flex-direction:column}
  .kits .kit__media--photo{width:100%;aspect-ratio:4/3;flex:none}
  .kits .kit__media--photo img{object-position:50% 50%}
  .kits .kit__media--photo img[src*="496"]{object-position:50% 40%!important}
  .kits .kit__body{padding-top:16px}
}
