/* ============ RESET / BASE ============ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased}
body{
  font-family:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  background:#fff;color:var(--text-dark);line-height:1.55;
  overflow-x:hidden;
}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}

:root{
  /* 🇨🇳 Paleta Mandarim Imperial & Tradicional */
  --china-red:#DE2910;
  --china-red-dark:#991B1B;
  --china-red-light:#EF4444;
  --china-red-soft:#FFF1F0;
  --china-gold:#FFDE00;
  --china-gold-dark:#D97706;
  --china-gold-light:#FDE047;
  --china-gold-soft:#FFFBEB;
  --china-jade:#0D9488;
  --china-jade-soft:#F0FDFA;
  --china-ink:#151625;
  --china-ink-dark:#0C0D17;
  --china-ink-light:#25273C;
  --china-ink-soft:#F5EFF2;

  /* Aliases para compatibilidade total */
  --japan-red:var(--china-red);
  --japan-red-dark:var(--china-red-dark);
  --japan-red-light:var(--china-red-light);
  --japan-red-soft:var(--china-red-soft);
  --japan-navy:var(--china-ink);
  --japan-navy-dark:var(--china-ink-dark);
  --japan-navy-light:var(--china-ink-light);
  --japan-navy-soft:var(--china-ink-soft);
  --sakura:var(--china-red-light);
  --sakura-soft:var(--china-red-soft);

  /* Backgrounds de papel de arroz tradicional / xuan paper */
  --bg-white:#ffffff;
  --bg-cream:#FDF9F3;
  --bg-soft:#FAF6EF;
  --bg-parchment:#F6F0E4;
  --bg-navy-tint:#F5EFF2;
  --bg-red-tint:#FFF4F4;

  /* Texto - tinta nanquim */
  --text-dark:#141522;
  --text:#383A52;
  --text-muted:#666880;
  --text-soft:#9CA0B4;

  /* Borders / shadows */
  --border:rgba(20,21,34,.10);
  --border-strong:rgba(20,21,34,.22);
  --border-gold:rgba(217,119,6,.35);
  --shadow-soft:0 8px 24px rgba(20,21,34,.06);
  --shadow-md:0 14px 30px rgba(20,21,34,.12);
  --shadow-red:0 14px 32px rgba(222,41,16,.24);
  --shadow-gold:0 10px 26px rgba(217,119,6,.20);

  /* Accent gold (bônus / estrelas) */
  --gold:#D97706;
  --gold-soft:#FFFBEB;

  /* CTA = vermelho chinês imperial VIBRANTE */
  --cta-from:#FF3B30;
  --cta-to:#DE2910;
  --cta-shadow:rgba(222,41,16,.40);
}

/* ============ TOP BAR ============ */
.top-bar{
  background:linear-gradient(90deg,#151625 0%,#2A1015 50%,#0C0D17 100%);
  color:#fff;text-align:center;
  padding:10px 16px;font-size:13px;font-weight:700;
  letter-spacing:.2px;
  display:flex;align-items:center;justify-content:center;
  border-bottom:2px solid #D97706;
  box-shadow:0 2px 10px rgba(0,0,0,.25);
}
.top-bar strong{font-weight:800;color:#FFDE00}
.top-bar-content{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:center}

/* ============ CHINESE CULTURAL ORNAMENTS ============ */
.lantern-mini{
  width:16px;height:24px;
  vertical-align:middle;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.3));
  display:inline-block;
}
.brand-seal{
  width:36px;height:36px;
  vertical-align:middle;
  margin-left:8px;
  transform:rotate(-3deg);
  filter:drop-shadow(0 2px 6px rgba(185,28,28,.35));
  display:inline-block;
}
.brand-chinese{
  font-family:'Noto Sans SC',serif;
  font-size:18px;
  font-weight:700;
  color:#DE2910;
  letter-spacing:2px;
  margin-left:6px;
}
.huiwen-bar{
  height:10px;
  background-image:url('assets/huiwen-border.svg');
  background-repeat:repeat-x;
  background-size:auto 10px;
  opacity:.65;
  margin:20px 0;
}

/* ============ CHINESE PROVERB QUOTE BANNER ============ */
.chinese-quote-banner{
  background:linear-gradient(135deg,#181015 0%,#2C1218 50%,#12131F 100%);
  color:#fff;
  border:1.5px solid rgba(217,119,6,.45);
  border-radius:20px;
  padding:32px 24px;
  margin:40px auto 0;
  max-width:760px;
  position:relative;
  overflow:hidden;
  box-shadow:0 18px 40px rgba(0,0,0,.35);
  text-align:center;
}
.chinese-quote-banner::before{
  content:"";
  position:absolute;
  top:0;left:0;right:0;
  height:6px;
  background-image:url('assets/huiwen-border.svg');
  background-repeat:repeat-x;
  background-size:auto 6px;
  opacity:.85;
}
.chinese-quote-banner::after{
  content:"";
  position:absolute;
  bottom:0;left:0;right:0;
  height:6px;
  background-image:url('assets/huiwen-border.svg');
  background-repeat:repeat-x;
  background-size:auto 6px;
  opacity:.85;
}
.chinese-quote-hanzi{
  font-family:'Noto Sans SC',serif;
  font-size:clamp(22px,4vw,30px);
  font-weight:900;
  color:#FFDE00;
  letter-spacing:4px;
  margin-bottom:8px;
  text-shadow:0 2px 12px rgba(255,222,0,.35);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
}
.chinese-quote-hanzi .lantern-mini{
  width:20px;height:30px;
}
.chinese-quote-pinyin{
  font-size:13.5px;
  color:#FBBF24;
  letter-spacing:1px;
  margin-bottom:12px;
  font-style:italic;
  font-weight:500;
}
.chinese-quote-translation{
  font-size:16px;
  color:#FDF9F3;
  line-height:1.6;
  max-width:580px;
  margin:0 auto;
  font-weight:600;
}
.chinese-quote-author{
  display:block;
  font-size:12px;
  color:rgba(255,255,255,.65);
  margin-top:10px;
  text-transform:uppercase;
  letter-spacing:1.2px;
}

/* ============ PAIN RESOLVER CHINESE ============ */
.pain-resolver-chinese{
  text-align:left;
  background:linear-gradient(135deg,#FFFDF9 0%,#FFF5F2 100%);
  border:1.5px solid rgba(222,41,16,.35);
  border-left:5px solid var(--china-red);
  padding:20px 24px;
  border-radius:14px;
  margin:24px auto 0;
  max-width:580px;
  box-shadow:0 8px 24px rgba(222,41,16,.08);
  display:flex;
  align-items:center;
  gap:18px;
}
.pain-resolver-chinese .seal-icon{
  width:52px;height:52px;
  flex-shrink:0;
  filter:drop-shadow(0 3px 6px rgba(185,28,28,.35));
}
.pain-resolver-chinese-text{
  font-size:14.5px;
  line-height:1.55;
  color:var(--china-ink);
}
.pain-resolver-chinese-text strong{
  color:var(--china-red);
}

/* ============ LEARN CHINESE TAG ============ */
.learn-chinese-tag{
  display:inline-flex;
  align-items:center;
  gap:6px;
  background:#FFF5F2;
  color:var(--china-red-dark);
  font-family:'Noto Sans SC',sans-serif;
  font-size:12px;
  font-weight:700;
  letter-spacing:.5px;
  padding:3px 10px;
  border-radius:6px;
  border:1px solid rgba(222,41,16,.25);
  margin-bottom:10px;
}
.learn-chinese-tag .hanzi{
  font-weight:900;
  color:var(--china-red);
}

/* ============ TRANSLUCENT MANDARIN ELEMENTS ============ */
.translucent-hanzi{
  position:absolute;
  font-family:'Noto Sans SC',serif;
  font-weight:900;
  color:rgba(255,255,255,.055);
  line-height:1;
  pointer-events:none;
  user-select:none;
  z-index:0;
  will-change:transform;
}
.translucent-hanzi.gold{
  color:rgba(255,222,0,.08);
}
.translucent-hanzi.crimson{
  color:rgba(222,41,16,.05);
}
@keyframes hanziDrift{
  0%{transform:translate(0, 0) rotate(0deg)}
  50%{transform:translate(8px, -12px) rotate(1.5deg)}
  100%{transform:translate(0, 0) rotate(0deg)}
}
.hanzi-drift{
  animation:hanziDrift 18s ease-in-out infinite;
}
.translucent-chinese-pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:rgba(255,255,255,.10);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border:1px solid rgba(255,222,0,.35);
  padding:5px 16px;
  border-radius:999px;
  color:#FFDE00;
  font-family:'Noto Sans SC',sans-serif;
  font-size:12.5px;
  font-weight:800;
  letter-spacing:.8px;
  margin-bottom:14px;
  box-shadow:0 4px 16px rgba(0,0,0,.20);
}
.translucent-chinese-pill .hanzi-glyph{
  font-size:14px;
  color:#FFDE00;
  font-weight:900;
}
.th-top-left{top:15px;left:10px;font-size:clamp(110px,16vw,220px)}
.th-top-right{top:15px;right:10px;font-size:clamp(110px,16vw,220px)}
.th-bottom-left{bottom:15px;left:10px;font-size:clamp(110px,16vw,220px)}
.th-bottom-right{bottom:15px;right:10px;font-size:clamp(110px,16vw,220px)}
.th-center{top:50%;left:50%;transform:translate(-50%,-50%);font-size:clamp(150px,22vw,300px)}
.th-mid-left{top:50%;left:2%;transform:translateY(-50%);font-size:clamp(90px,14vw,170px)}
.th-mid-right{top:50%;right:2%;transform:translateY(-50%);font-size:clamp(90px,14vw,170px)}

/* ============ PRICING SEAL ============ */
.pricing-seal{
  position:absolute;
  top:16px;
  right:16px;
  width:64px;
  height:64px;
  transform:rotate(-8deg);
  filter:drop-shadow(0 4px 10px rgba(185,28,28,.35));
  z-index:4;
  pointer-events:none;
  animation:sealFloat 4s ease-in-out infinite;
}
@keyframes sealFloat{
  0%,100%{transform:rotate(-8deg) translateY(0)}
  50%{transform:rotate(-5deg) translateY(-4px)}
}

/* ============ IMPERIAL GUARANTEE BOX ============ */
.guarantee-box-imperial{
  max-width:780px;
  margin:36px auto 0;
  background:linear-gradient(135deg,#FFFDF8 0%,#FFF7ED 100%);
  border:2px solid #D97706;
  border-radius:20px;
  padding:32px 28px;
  box-shadow:0 14px 34px rgba(217,119,6,.14);
  display:flex;
  align-items:center;
  gap:24px;
  position:relative;
  overflow:hidden;
}
.guarantee-box-imperial::before{
  content:"";
  position:absolute;
  top:0;left:0;right:0;
  height:5px;
  background-image:url('assets/huiwen-border.svg');
  background-repeat:repeat-x;
  background-size:auto 5px;
  opacity:.7;
}
.guarantee-seal-wrap{
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
}
.guarantee-seal-wrap img{
  width:92px;height:92px;
  filter:drop-shadow(0 4px 12px rgba(185,28,28,.30));
  transform:rotate(-4deg);
}
.guarantee-info h3{
  font-size:20px;
  font-weight:900;
  color:var(--china-ink);
  margin-bottom:6px;
}
.guarantee-info h3 strong{
  color:var(--china-red);
}
.guarantee-info p{
  font-size:14px;
  line-height:1.6;
  color:var(--text);
  margin:0;
}
@media (max-width:640px){
  .guarantee-box-imperial{
    flex-direction:column;
    text-align:center;
    padding:28px 20px;
    gap:16px;
  }
}

/* ============ FLAG ICON (Bandeira da China) ============ */
.flag-icon{
  display:inline-block;
  vertical-align:-2px;
  width:18px;
  height:12px;
  border-radius:2px;
  box-shadow:0 1px 3px rgba(0,0,0,.25);
  margin-right:6px;
  object-fit:cover;
}
.kicker .flag-icon{
  vertical-align:-1.5px;
  width:16px;
  height:11px;
}
.top-bar .flag-icon{
  vertical-align:-2px;
  width:18px;
  height:12px;
}
.jlpt-tag .flag-icon, .hsk-tag .flag-icon{
  vertical-align:-1px;
  width:15px;
  height:10px;
  margin-right:4px;
}
.ideal-flag .flag-icon{
  width:58px;
  height:38px;
  border-radius:6px;
  box-shadow:0 6px 16px rgba(222,41,16,.35);
  margin:0 auto 6px;
  display:block;
}
.receive-badge .flag-icon{
  vertical-align:-2px;
  width:16px;
  height:11px;
}
.material-eyebrow .flag-icon{
  vertical-align:-2px;
  width:16px;
  height:11px;
}
.plan-title .flag-icon{
  vertical-align:-2px;
  width:22px;
  height:15px;
  margin-right:6px;
}

/* ============ HERO (Estilo Tinta & Nuvem Auspiciosa) ============ */
.hero{
  background:
    radial-gradient(circle at 10% 15%, rgba(222,41,16,.04) 0%, transparent 45%),
    radial-gradient(circle at 90% 85%, rgba(217,119,6,.05) 0%, transparent 45%),
    #FFFDF9;
  padding:36px 20px 60px;
  text-align:center;
  position:relative;
  overflow:hidden;
  border-bottom:1px solid rgba(217,119,6,.20);
}
.hero::before, .hero::after{
  content:"";
  position:absolute;
  width:140px;height:70px;
  background-image:url('assets/cloud-pattern.svg');
  background-repeat:no-repeat;
  background-size:contain;
  opacity:.4;
  pointer-events:none;
  z-index:0;
}
.hero::before{
  top:24px;left:20px;
}
.hero::after{
  bottom:36px;right:20px;
  transform:scaleX(-1);
}
.hero-inner{max-width:780px;margin:0 auto;position:relative;z-index:1}
.brand{
  font-family:'Outfit',sans-serif;
  font-size:26px;font-weight:900;letter-spacing:.5px;
  color:var(--china-ink);
  margin-bottom:18px;
  text-transform:uppercase;
  display:flex;align-items:center;justify-content:center;
  flex-wrap:wrap;gap:4px;
}
.kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:linear-gradient(135deg,#DE2910,#991B1B);
  color:#fff;
  padding:7px 18px;border-radius:999px;
  font-size:11.5px;font-weight:800;letter-spacing:.9px;
  margin-bottom:14px;
  box-shadow:0 6px 18px rgba(222,41,16,.35);
  border:1px solid rgba(255,222,0,.35);
}
.hero h1{
  font-size:clamp(28px,5vw,42px);
  font-weight:900;line-height:1.15;
  margin-bottom:14px;color:var(--text-dark);
}
.hl{color:var(--japan-red)}
.sub{
  color:var(--text);font-size:15px;
  max-width:620px;margin:0 auto 22px;
}
.hero-img-wrap{
  margin:18px auto 24px;
  max-width:600px;
  position:relative;
}
.hero-img-wrap img{
  width:100%;border-radius:0;
  filter:none;
}
.cta-primary{
  display:inline-block;
  background:linear-gradient(180deg,var(--cta-from) 0%,var(--cta-to) 100%);
  color:#fff;font-weight:900;font-size:16px;
  padding:18px 26px;border-radius:14px;
  box-shadow:0 14px 30px var(--cta-shadow), inset 0 1px 0 rgba(255,255,255,.25);
  text-transform:uppercase;letter-spacing:.5px;
  transition:transform .15s ease, box-shadow .15s ease;
  animation:pulse 2.4s ease-in-out infinite;
}
.cta-primary:hover{transform:translateY(-2px);box-shadow:0 18px 38px var(--cta-shadow)}
.cta-primary.small{padding:14px 20px;font-size:14px;margin:8px 0 18px}
@keyframes pulse{
  0%,100%{box-shadow:0 14px 30px var(--cta-shadow), inset 0 1px 0 rgba(255,255,255,.25);}
  50%{box-shadow:0 18px 42px var(--cta-shadow), inset 0 1px 0 rgba(255,255,255,.25);}
}
.social-proof{
  margin-top:22px;font-size:14px;color:var(--text);
  display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;
}
.stars{color:var(--gold);letter-spacing:2px}
.trust-row{color:var(--text-muted);font-size:13px;margin-top:8px}

/* ============ SECTIONS ============ */
.section{padding:64px 20px;position:relative}
.section-light{background:var(--bg-soft);color:var(--text-dark)}
.section-dark{background:var(--bg-red-tint);color:var(--text-dark)}
.section-darker{background:var(--bg-navy-tint);color:var(--text-dark)}

/* Dobra Vermelha 1: Problema / Desafios do Mandarim */
.section-chinese-red{
  background:
    radial-gradient(circle at 15% 20%, rgba(255, 222, 0, 0.08) 0%, transparent 40%),
    radial-gradient(circle at 85% 80%, rgba(0, 0, 0, 0.45) 0%, transparent 45%),
    linear-gradient(145deg, #991B1B 0%, #7F1D1D 50%, #450A0A 100%);
  color:#fff;
  position:relative;
  overflow:hidden;
  border-top:2.5px solid #D97706;
  border-bottom:2.5px solid #D97706;
  padding:72px 20px;
}
.section-chinese-red .section-title{
  color:#fff;
  text-shadow:0 2px 14px rgba(0,0,0,.5);
}
.section-chinese-red .section-sub{
  color:#FEF08A;
  font-weight:600;
}
.section-chinese-red .pain-list li{
  background:rgba(255,255,255,.09);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border:1.5px solid rgba(255,222,0,.25);
  color:#fff;
  box-shadow:0 8px 24px rgba(0,0,0,.25);
}
.section-chinese-red .pain-list li::before{
  content:"✕";
  color:#FFDE00;
  font-weight:900;
}
.section-chinese-red .pain-resolver-chinese{
  background:linear-gradient(135deg, #FFFDF8 0%, #FFF5EB 100%);
  border:2px solid #FFDE00;
  box-shadow:0 12px 34px rgba(0,0,0,.4);
}

/* Dobra Vermelha 2: Urgência / Timer */
.section-urgency{
  background:
    radial-gradient(circle at 20% 30%, rgba(255, 222, 0, 0.12) 0%, transparent 45%),
    radial-gradient(circle at 80% 70%, rgba(0, 0, 0, 0.4) 0%, transparent 45%),
    linear-gradient(135deg, #DE2910 0%, #B91C1C 45%, #7F1D1D 100%);
  color:#fff;
  position:relative;
  overflow:hidden;
  border-top:2.5px solid #FFDE00;
  border-bottom:2.5px solid #FFDE00;
  padding:64px 20px;
}
.section-urgency .section-title{
  color:#fff;
  text-shadow:0 2px 14px rgba(0,0,0,.45);
}
.section-urgency .section-sub{
  color:#FEF08A;
  font-weight:600;
}

/* Dobra Vermelha 3: Oferta / Pricing */
.section-pricing-red{
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 222, 0, 0.12) 0%, transparent 45%),
    radial-gradient(circle at 10% 90%, rgba(0, 0, 0, 0.55) 0%, transparent 40%),
    linear-gradient(160deg, #881337 0%, #7F1D1D 40%, #450A0A 100%);
  color:#fff;
  position:relative;
  overflow:hidden;
  border-top:2.5px solid #D97706;
  border-bottom:2.5px solid #D97706;
  padding:80px 20px;
}
.section-pricing-red .section-title{
  color:#fff;
  text-shadow:0 2px 14px rgba(0,0,0,.5);
}
.section-pricing-red .section-sub{
  color:#FEF08A;
  font-weight:600;
}
.section-pricing-red .plan-card.basic{
  background:#fff;
  border:2px solid rgba(255,222,0,.35);
  box-shadow:0 16px 40px rgba(0,0,0,.40);
}
.section-pricing-red .plan-card.premium{
  background:#fff;
  border:3px solid #DE2910;
  box-shadow:0 24px 50px rgba(0,0,0,.55), 0 0 0 2px #FFDE00;
}
.section-pricing-red .guarantee-box-imperial{
  background:rgba(255,255,255,.97);
  border:2px solid #FFDE00;
  box-shadow:0 16px 40px rgba(0,0,0,.45);
}
.section-pricing-red .payment-foot .trust-row{
  color:#FEE2E2;
}

.section-bonus{
  background:
    radial-gradient(circle at 80% 20%,rgba(239,184,73,.10),transparent 50%),
    var(--bg-cream);
  color:var(--text-dark);
}
.container{max-width:1100px;margin:0 auto}
.container.narrow{max-width:760px}
.center{text-align:center}

.section-title{
  font-size:clamp(24px,4vw,34px);
  font-weight:900;text-align:center;
  margin-bottom:10px;line-height:1.2;color:var(--text-dark);
}
.section-sub{
  text-align:center;color:var(--text-muted);
  max-width:620px;margin:0 auto 36px;font-size:15px;
}

/* ============ SECTION HSK (Trilha Oficial dos Níveis) ============ */
.hsk-tag, .jlpt-tag{
  display:inline-flex;
  align-items:center;
  gap:5px;
  background:linear-gradient(90deg, #991B1B, #DE2910);
  color:#FFDE00;
  font-weight:900;
  font-size:11.5px;
  padding:4px 10px;
  border-radius:6px;
  letter-spacing:.5px;
  margin-bottom:12px;
  border:1px solid rgba(255,222,0,.35);
  box-shadow:0 3px 8px rgba(153,27,27,.25);
}
.section-hsk, .section-jlpt{
  background:
    radial-gradient(circle at 10% 20%, rgba(217,119,6,.04) 0%, transparent 40%),
    radial-gradient(circle at 90% 80%, rgba(222,41,16,.04) 0%, transparent 40%),
    var(--bg-soft);
  padding:80px 20px;
  border-bottom:1px solid rgba(217,119,6,.15);
}
.hsk-head, .jlpt-head{text-align:center;margin-bottom:60px}

.hsk-timeline, .jlpt-timeline {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  max-width: 1120px;
  margin: 0 auto;
  position: relative;
  padding-top: 10px;
  padding-bottom: 20px;
}
/* The main horizontal gold/red line */
.hsk-timeline::before, .jlpt-timeline::before {
  content: "";
  position: absolute;
  top: 29px; /* Centers with 38px medallion */
  left: 5%;
  right: 5%;
  height: 4px;
  background: linear-gradient(90deg, rgba(222,41,16,0.2) 0%, #D97706 50%, rgba(222,41,16,0.2) 100%);
  border-radius: 4px;
  z-index: 1;
}
.timeline-step {
  flex: 1;
  min-width: 190px;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  z-index: 2;
}
/* The Imperial Medallion Node */
.tl-node {
  width: 38px;
  height: 38px;
  background: linear-gradient(135deg, #DE2910 0%, #991B1B 100%);
  border-radius: 50%;
  border: 2.5px solid #FFDE00;
  box-shadow: 0 0 0 3px rgba(222,41,16,0.25), 0 6px 14px rgba(222,41,16,0.3);
  margin-bottom: 20px;
  position: relative;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFDE00;
  font-family: 'Noto Sans SC', sans-serif;
  font-weight: 900;
  font-size: 16px;
  line-height: 1;
  transition: transform .2s ease;
}
.timeline-step:hover .tl-node {
  transform: scale(1.12);
  box-shadow: 0 0 0 4px rgba(255,222,0,0.4), 0 8px 18px rgba(222,41,16,0.4);
}
/* Title Badge */
.timeline-step h3 {
  background: #fff;
  padding: 14px 16px;
  border-radius: 12px;
  font-size: 14.5px;
  font-weight: 800;
  color: var(--text-dark);
  box-shadow: 0 6px 16px rgba(26,26,46,0.05);
  border: 1px solid rgba(217,119,6,0.15);
  margin-bottom: 16px;
  width: 100%;
  text-align: center;
  line-height: 1.3;
}
/* Content Card */
.timeline-step ul {
  width: 100%;
  background: #fff;
  padding: 24px 20px;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(26,26,46,0.04);
  border: 1px solid rgba(26,26,46,0.03);
  list-style: none;
  margin: 0;
  text-align: left;
  flex-grow: 1;
}
.timeline-step ul li {
  position: relative;
  padding-left: 22px;
  margin-bottom: 14px;
  font-size: 14px;
  color: var(--text-muted);
  line-height: 1.4;
  font-weight: 500;
}
.timeline-step ul li:last-child {
  margin-bottom: 0;
}
.timeline-step ul li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: var(--china-red);
  font-weight: 900;
  font-size: 13px;
  top: 1px;
}

@media (max-width: 768px) {
  .hsk-timeline, .jlpt-timeline {
    flex-direction: column;
    gap: 32px;
    padding-left: 10px;
  }
  .hsk-timeline::before, .jlpt-timeline::before {
    top: 24px; bottom: 40px;
    left: 28px;
    width: 4px; height: auto;
    right: auto;
    background: linear-gradient(180deg, rgba(222,41,16,0.2) 0%, #D97706 50%, rgba(222,41,16,0.2) 100%);
  }
  .timeline-step {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
  }
  .tl-node {
    margin: 0;
    position: absolute;
    left: 9px; top: 12px;
  }
  .timeline-step h3 {
    width: calc(100% - 56px);
    margin-left: 56px;
    margin-bottom: 12px;
    text-align: left;
  }
  .timeline-step ul {
    width: calc(100% - 56px);
    margin-left: 56px;
  }
}

/* ============ SECTION MATERIAL (Showcase / Mostruário) ============ */
.section-material{
  background:
    radial-gradient(circle at 10% 15%, rgba(222,41,16,.04) 0%, transparent 45%),
    radial-gradient(circle at 90% 85%, rgba(217,119,6,.05) 0%, transparent 45%),
    #FFFDF9;
  padding:44px 0 48px;
  overflow:hidden;
  position:relative;
  border-bottom:1.5px solid rgba(217,119,6,.15);
}
.material-head{
  text-align:center;
  max-width:780px;
  margin:0 auto 20px;
  padding:0 20px;
  position:relative;
  z-index:2;
}
.material-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:linear-gradient(135deg, #FFF5F2 0%, #FFFDF9 100%);
  color:var(--china-red);
  font-weight:800;font-size:11.5px;letter-spacing:1.2px;
  padding:7px 18px;border-radius:999px;
  border:1.5px solid rgba(222,41,16,.30);
  box-shadow:0 4px 14px rgba(222,41,16,.10);
  margin-bottom:16px;
}
.material-eyebrow .lantern-mini{
  width:14px;height:20px;
}

/* ============ FEEDBACKS SECTION (Identidade Chinesa & Depoimentos) ============ */
.section-feedback {
  background: 
    radial-gradient(circle at 10% 20%, rgba(222, 41, 16, 0.05) 0%, transparent 40%),
    radial-gradient(circle at 90% 80%, rgba(217, 119, 6, 0.05) 0%, transparent 40%),
    #FFFDF9;
  padding: 84px 20px;
  overflow: hidden;
  position: relative;
  border-top: 1.5px solid rgba(217, 119, 6, 0.20);
  border-bottom: 1.5px solid rgba(217, 119, 6, 0.20);
}
.feedback-header {
  text-align: center;
  max-width: 780px;
  margin: 0 auto 36px;
  position: relative;
  z-index: 2;
}
.feedback-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: linear-gradient(135deg, #FFF5F2 0%, #FFFDF9 100%);
  color: var(--china-red);
  border: 1.5px solid rgba(222, 41, 16, 0.35);
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  padding: 7px 20px;
  border-radius: 999px;
  margin-bottom: 18px;
  box-shadow: 0 4px 16px rgba(222, 41, 16, 0.12);
}
.feedback-eyebrow .lantern-mini {
  width: 15px;
  height: 22px;
}
.feedback-title {
  font-size: clamp(28px, 4.8vw, 44px);
  font-weight: 900;
  color: var(--china-ink);
  line-height: 1.25;
  margin-bottom: 14px;
  font-family: 'Outfit', 'Inter', system-ui, sans-serif;
  letter-spacing: -0.5px;
}
.feedback-hl {
  display: inline-block;
  background: linear-gradient(135deg, rgba(222, 41, 16, 0.08) 0%, rgba(217, 119, 6, 0.12) 100%);
  color: var(--china-red);
  padding: 2px 14px;
  border-radius: 8px;
  border: 2px solid var(--china-red);
  box-shadow: 0 4px 16px rgba(222, 41, 16, 0.14);
  font-style: normal;
  font-weight: 900;
}
.feedback-chinese-sub {
  display: block;
  font-family: 'Noto Sans SC', serif;
  font-size: 15px;
  font-weight: 700;
  color: var(--gold);
  letter-spacing: 3px;
  margin-top: 10px;
  text-transform: uppercase;
}
.feedback-sub {
  color: var(--text);
  font-size: 15.5px;
  line-height: 1.6;
  max-width: 640px;
  margin: 0 auto;
}
.feedback-sub strong {
  color: var(--china-red);
  font-weight: 800;
}

/* ============ FEEDBACK MARQUEE & CARDS ============ */
.feedback-marquee {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding: 12px 0 24px;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 4%, #000 96%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 4%, #000 96%, transparent 100%);
}
.feedback-track {
  display: flex;
  gap: 20px;
  width: max-content;
  animation: feedbackScroll 42s linear infinite;
  will-change: transform;
}
.feedback-marquee:hover .feedback-track {
  animation-play-state: paused;
}
@keyframes feedbackScroll {
  from { transform: translateX(0); }
  to { transform: translateX(calc(-50% - 10px)); }
}

.feedback-card {
  flex: 0 0 auto;
  width: clamp(310px, 32vw, 380px);
  background: #ffffff;
  border-radius: 18px;
  padding: 28px 24px 24px;
  border: 1.5px solid rgba(217, 119, 6, 0.18);
  box-shadow: 0 10px 26px rgba(20, 21, 34, 0.05);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
  position: relative;
  overflow: hidden;
}
.feedback-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3.5px;
  background: linear-gradient(90deg, var(--china-red) 0%, #FFDE00 50%, var(--china-red) 100%);
  opacity: 0.9;
}
.feedback-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 18px 40px rgba(222, 41, 16, 0.14);
  border-color: rgba(222, 41, 16, 0.4);
}

.card-stars {
  color: #F59E0B;
  font-size: 16px;
  letter-spacing: 3px;
  margin-bottom: 16px;
  line-height: 1;
}
.card-quote {
  font-size: 14px;
  line-height: 1.62;
  color: #383A52;
  font-style: italic;
  margin-bottom: 24px;
  flex-grow: 1;
}

.card-author {
  display: flex;
  align-items: center;
  gap: 12px;
  border-top: 1px solid rgba(20, 21, 34, 0.06);
  padding-top: 18px;
}
.card-avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: linear-gradient(135deg, #FFF1F0 0%, #FEE2E2 100%);
  color: var(--china-red);
  font-weight: 900;
  font-size: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border: 1.5px solid rgba(222, 41, 16, 0.3);
  box-shadow: 0 3px 8px rgba(222, 41, 16, 0.15);
  letter-spacing: 0.5px;
}
.card-user-info {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.card-name-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.card-name {
  font-size: 14.5px;
  font-weight: 800;
  color: #1F1B24;
}
.card-verified {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  background: #EDFAF1;
  color: #16A34A;
  border: 1px solid #B8EFC8;
  font-size: 10.5px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 999px;
  line-height: 1.2;
}
.card-meta {
  font-size: 12px;
  color: #7A7C93;
  line-height: 1.35;
}

/* ============ DOUBLE-ROW MARQUEE (Mostruário Compacto) ============ */
.marquee-double-wrap {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  position: relative;
  overflow: hidden;
  padding: 2px 0 6px;
}

.marquee-row {
  position: relative;
  overflow: hidden;
  width: 100%;
  display: flex;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 5%, #000 95%, transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0%, #000 5%, #000 95%, transparent 100%);
}

.marquee-track-left,
.marquee-track-right {
  display: flex;
  gap: 14px;
  width: max-content;
  will-change: transform;
}

/* Linha de Cima: desliza continuamente para a ESQUERDA */
.marquee-track-left {
  animation: marqueeScrollLeft 32s linear infinite;
}

/* Linha de Baixo: desliza continuamente para a DIREITA */
.marquee-track-right {
  animation: marqueeScrollRight 32s linear infinite;
}

/* Pausa suave ao passar o mouse para inspecionar os detalhes */
.marquee-row:hover .marquee-track-left,
.marquee-row:hover .marquee-track-right {
  animation-play-state: paused;
}

/* Card individual do mapa mental — Formato QUADRADO COMPACTO (1:1) */
.marquee-card {
  flex: 0 0 auto;
  width: clamp(160px, 16vw, 210px);
  aspect-ratio: 1 / 1;
  border-radius: 12px;
  overflow: hidden;
  background: #FFFFFF;
  box-shadow: 0 6px 18px rgba(26, 26, 46, 0.08), 0 2px 4px rgba(222, 41, 16, 0.04);
  border: 1px solid rgba(222, 41, 16, 0.12);
  transition: transform 0.25s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.25s ease, border-color 0.25s ease;
  user-select: none;
  display: flex;
  align-items: center;
  justify-content: center;
}

.marquee-card:hover {
  transform: translateY(-4px) scale(1.03);
  box-shadow: 0 12px 28px rgba(222, 41, 16, 0.16), 0 3px 8px rgba(217, 119, 6, 0.12);
  border-color: rgba(222, 41, 16, 0.40);
}

.marquee-card img {
  width: 100%;
  height: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  display: block;
  pointer-events: none;
}

/* Keyframes simétricos para loop infinito sem cortes (gap: 14px -> metade = 7px) */
@keyframes marqueeScrollLeft {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(calc(-50% - 7px));
  }
}

@keyframes marqueeScrollRight {
  0% {
    transform: translateX(calc(-50% - 7px));
  }
  100% {
    transform: translateX(0);
  }
}

.material-note {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 16px;
  font-size: 13px;
  font-weight: 600;
  color: var(--china-ink-light);
  text-align: center;
  padding: 0 16px;
}
.material-note .seal-dot {
  width: 7px;
  height: 7px;
  background: var(--china-red);
  border-radius: 50%;
  display: inline-block;
}

/* Compatibilidade com classes anteriores */
.marquee {
  position: relative;
  overflow: hidden;
  width: 100%;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 5%, #000 95%, transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0%, #000 5%, #000 95%, transparent 100%);
}
.marquee-track {
  display: flex;
  gap: 18px;
  width: max-content;
  animation: marqueeScrollLeft 32s linear infinite;
  will-change: transform;
}
.marquee-item {
  flex: 0 0 auto;
  width: clamp(280px, 32vw, 440px);
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 12px 28px rgba(26,26,46,.08);
  border: 1px solid var(--border);
}
.marquee-item img {
  width: 100%;
  height: auto;
  display: block;
}

@media (max-width: 768px) {
  .marquee-double-wrap {
    gap: 8px;
    padding: 2px 0 8px;
  }
  .marquee-track-left,
  .marquee-track-right {
    gap: 8px;
  }
  .marquee-card {
    width: clamp(125px, 38vw, 165px);
    aspect-ratio: 1 / 1;
    border-radius: 9px;
  }
  @keyframes marqueeScrollLeft {
    0% {
      transform: translateX(0);
    }
    100% {
      transform: translateX(calc(-50% - 4px));
    }
  }
  @keyframes marqueeScrollRight {
    0% {
      transform: translateX(calc(-50% - 4px));
    }
    100% {
      transform: translateX(0);
    }
  }
}


/* ============ PAIN LIST ============ */
.pain-list{
  list-style:none;display:grid;gap:12px;
  margin:14px auto 20px;max-width:560px;
}
.pain-list li{
  background:#fff;
  border:1.5px solid var(--japan-red-soft);
  padding:14px 16px;border-radius:12px;
  font-size:15px;color:var(--text-dark);
  display:flex;gap:10px;align-items:flex-start;
  box-shadow:0 4px 10px rgba(232,0,63,.06);
}
.pain-list li::before{content:"✕";color:var(--japan-red);font-weight:800;margin-top:1px;flex-shrink:0}
.pain-resolver{
  text-align:center;color:var(--text);font-size:15px;
  background:var(--japan-navy-soft);
  border:1.5px solid rgba(26,26,46,.18);
  padding:14px 18px;border-radius:12px;margin-top:18px;
  max-width:560px;margin-left:auto;margin-right:auto;
}

/* ============ LEARN GRID ============ */
.learn-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:16px;
}
.learn-card{
  background:#fff;
  border:1.5px solid var(--border);
  padding:22px;border-radius:14px;
  transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease;
  box-shadow:var(--shadow-soft);
}
.learn-card:hover{
  transform:translateY(-3px);
  border-color:var(--japan-navy);
  box-shadow:var(--shadow-md);
}
.learn-emoji{
  font-size:28px;display:flex;align-items:center;justify-content:center;
  width:54px;height:54px;border-radius:14px;
  background:linear-gradient(135deg,var(--japan-navy-soft),var(--japan-red-soft));
  margin-bottom:14px;
}
.learn-card h3{font-size:16px;margin-bottom:6px;color:var(--text-dark)}
.learn-card p{font-size:13.5px;color:var(--text-muted)}

/* ============ COUNTDOWN ============ */
.countdown{
  display:flex;justify-content:center;align-items:center;gap:14px;
  margin:20px 0 14px;
  position:relative;z-index:2;
}
.cd-box{
  background:rgba(255,255,255,.14);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border:2px solid #FFDE00;
  border-radius:16px;padding:16px 22px;
  min-width:104px;text-align:center;
  box-shadow:0 12px 28px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.3);
  transition:transform .2s ease;
}
.cd-box:hover{transform:translateY(-2px)}
.cd-box span{
  display:block;font-size:42px;font-weight:900;line-height:1;
  font-variant-numeric:tabular-nums;color:#FFDE00;
  text-shadow:0 0 16px rgba(255,222,0,.55);
}
.cd-box small{display:block;font-size:11.5px;color:#FFFBEB;letter-spacing:.8px;margin-top:6px;font-weight:700;text-transform:uppercase}
.cd-colon{font-size:36px;font-weight:900;color:#FFDE00;text-shadow:0 0 12px rgba(255,222,0,.5)}
.cd-note{color:#fff;margin-top:12px;font-size:14.5px;position:relative;z-index:2}
.cd-note strong{color:#FFDE00;text-decoration:underline}

/* ============ IDEAL v2 ============ */
.section-ideal{
  background:
    radial-gradient(circle at 90% 0%,rgba(26,26,46,.08),transparent 50%),
    radial-gradient(circle at 0% 100%,rgba(232,0,63,.08),transparent 50%),
    #fff;
  color:var(--text-dark);
}
.ideal-head{text-align:center;margin-bottom:30px}
.ideal-flag{
  display:inline-block;font-size:30px;margin-bottom:10px;
  filter:drop-shadow(0 4px 10px rgba(232,0,63,.25));
}
.ideal-grid-v2{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:18px;
}
.ideal-card-v2{
  background:#fff;
  border:1.5px solid var(--border);
  padding:24px 22px;border-radius:18px;
  box-shadow:var(--shadow-soft);
  position:relative;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.ideal-card-v2:hover{
  transform:translateY(-4px);
  box-shadow:var(--shadow-md);
  border-color:var(--japan-navy);
}
.ideal-icon{
  font-size:34px;line-height:1;
  width:54px;height:54px;border-radius:14px;
  background:linear-gradient(135deg,var(--japan-red-soft),var(--japan-navy-soft));
  display:flex;align-items:center;justify-content:center;
  margin-bottom:14px;
}
.ideal-card-v2 h3{font-size:16.5px;color:var(--text-dark);margin-bottom:6px;font-weight:800}
.ideal-card-v2 p{font-size:14px;color:var(--text-muted);line-height:1.5}
.cta-block-v2{
  text-align:center;margin-top:40px;
  background:
    radial-gradient(circle at 10% 20%, rgba(255,222,0,.15) 0%, transparent 40%),
    linear-gradient(135deg,#DE2910 0%,#B91C1C 45%,#7F1D1D 100%);
  padding:40px 24px;border-radius:22px;
  color:#fff;
  border:2px solid #FFDE00;
  box-shadow:0 24px 45px rgba(153,27,27,.45);
  position:relative;
  overflow:hidden;
}
.cta-block-v2 h3{font-size:22px;margin-bottom:8px;color:#fff;font-weight:900}
.cta-block-v2 p{color:#ffccd6;font-size:14px;margin-bottom:16px}
.cta-block-v2 .trust-row{color:#ffaabb}

/* ============ RECEIVE (split layout w/ image) ============ */
.receive-split{
  max-width:1000px;margin:0 auto;
  display:grid;grid-template-columns:1.05fr 1fr;gap:36px;align-items:center;
}
@media (max-width:780px){
  .receive-split{grid-template-columns:1fr;gap:20px}
}
.receive-image{
  display:flex;align-items:center;justify-content:center;
}
.receive-image img{
  width:100%;max-width:480px;
  mix-blend-mode: multiply;
}
.receive-content{}
.receive-card{
  max-width:680px;margin:0 auto;
  background:#fff;
  border:1.5px solid var(--border);
  border-radius:18px;padding:30px;
  position:relative;
  box-shadow:var(--shadow-soft);
}
.receive-badge{
  display:inline-block;
  background:linear-gradient(90deg,var(--japan-red),var(--japan-red-light));
  color:#fff;font-weight:800;font-size:12px;
  padding:6px 14px;border-radius:999px;letter-spacing:.6px;
  margin-bottom:16px;
  box-shadow:0 6px 14px rgba(232,0,63,.28);
}
.receive-card h3,
.receive-content h3{font-size:24px;margin-bottom:14px;color:var(--text-dark)}
.receive-list{list-style:none;display:grid;gap:10px;margin-bottom:14px}
.receive-list li{
  padding-left:28px;position:relative;font-size:14.5px;color:var(--text);
}
.receive-list li::before{
  content:"✓";position:absolute;left:0;top:0;
  color:#fff;font-weight:900;
  width:20px;height:20px;border-radius:999px;background:var(--japan-navy);
  display:flex;align-items:center;justify-content:center;font-size:12px;
}
.receive-foot{color:var(--text-muted);font-size:13px}

/* ============ BONUSES ============ */
.bonus-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:18px;
}
.bonus-card{
  background:#fff;
  border:1.5px solid var(--border);
  border-radius:18px;padding:22px;
  text-align:center;position:relative;
  transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease;
  box-shadow:var(--shadow-soft);
}
.bonus-card.hot{border-color:var(--japan-red)}
.bonus-card:hover{
  transform:translateY(-4px);
  box-shadow:var(--shadow-md);
}
.bonus-tag{
  position:absolute;top:-12px;left:50%;transform:translateX(-50%);
  background:linear-gradient(90deg,var(--japan-red),var(--japan-red-light));
  color:#fff;font-weight:900;font-size:11px;
  padding:5px 12px;border-radius:999px;letter-spacing:.5px;
  white-space:nowrap;
  box-shadow:0 6px 14px rgba(232,0,63,.32);
}
.bonus-card img{
  width:100%;max-width:200px;margin:0 auto 14px;
  mix-blend-mode: multiply;
}
.bonus-card h3{font-size:15px;margin-bottom:8px;line-height:1.3;color:var(--text-dark)}
.bonus-card p{color:var(--text-muted);font-size:13px;margin-bottom:14px;min-height:36px}
.bonus-price{display:flex;flex-direction:column;align-items:center;gap:4px}
.strike{text-decoration:line-through;color:var(--text-soft);font-size:13px}
.free{
  background:linear-gradient(90deg,var(--japan-navy),var(--japan-navy-light));
  color:#fff;font-weight:900;font-size:12px;
  padding:5px 12px;border-radius:999px;letter-spacing:.5px;
  box-shadow:0 4px 10px rgba(26,26,46,.28);
}

/* ============ PRICING ============ */
.separate-box{
  max-width:560px;margin:0 auto 28px;text-align:center;
  background:#fff;
  border:1.5px solid var(--border);
  border-radius:14px;padding:18px;
  box-shadow:var(--shadow-soft);
}
.separate-box p{margin:4px 0;color:var(--text);font-size:14px}
.separate-math strong.big{color:var(--japan-red);font-size:18px}
.separate-arrow{color:var(--text-muted);font-size:13px;margin-top:10px!important}

.plans-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));
  gap:20px;align-items:stretch;
}
.plan-card{
  background:#fff;
  border:1.5px solid var(--border);
  border-radius:20px;padding:26px 22px;
  position:relative;
  display:flex;flex-direction:column;
  box-shadow:var(--shadow-soft);
  color:var(--text-dark);
}
.plan-card.premium{
  border:2.5px solid var(--japan-red);
  background:#fff;
  box-shadow:0 24px 48px rgba(232,0,63,.18);
}
.ribbon{
  position:absolute;top:-14px;left:50%;transform:translateX(-50%);
  background:linear-gradient(90deg,var(--japan-red),var(--japan-red-light));
  color:#fff;font-weight:900;font-size:12px;
  padding:7px 16px;border-radius:999px;letter-spacing:.6px;white-space:nowrap;
  box-shadow:0 8px 16px rgba(232,0,63,.32);
}
.plan-label{
  display:inline-block;font-size:12px;font-weight:800;
  letter-spacing:1.4px;color:var(--text-muted);margin-bottom:10px;
}
.plan-card.premium .plan-label{color:var(--japan-red)}
.plan-title{font-size:18px;margin-bottom:8px;line-height:1.3;color:var(--text-dark)}
.plan-list{list-style:none;display:grid;gap:9px;margin:14px 0}
.plan-list li{
  font-size:14px;padding-left:26px;position:relative;color:var(--text);
}
.plan-list li.ok::before{
  content:"✓";position:absolute;left:0;top:1px;
  width:18px;height:18px;border-radius:999px;background:var(--japan-navy);
  color:#fff;font-weight:900;display:flex;align-items:center;justify-content:center;font-size:11px;
}
.plan-list li.locked{color:var(--text-soft)}
.plan-list li.locked::before{
  content:"🔒";position:absolute;left:0;top:0;font-size:14px;
}
.bonus-list-mini{
  background:linear-gradient(180deg,var(--japan-navy-soft),#f0e8ed);
  border:1.5px solid rgba(26,26,46,.18);
  border-radius:12px;padding:14px;margin:10px 0;
}
.bonus-list-mini p{font-size:13.5px;color:var(--text-dark);margin:5px 0}
.plan-price-label{color:var(--text-muted);font-size:13px;margin-top:14px}
.plan-price{
  font-size:42px;font-weight:900;color:var(--text-dark);
  line-height:1;margin:4px 0;
}
.plan-card.premium .plan-price{color:var(--japan-red)}
.plan-foot{color:var(--text-muted);font-size:13px;margin-bottom:10px}
.plan-savings{
  background:var(--japan-navy-soft);color:var(--japan-navy);
  display:inline-block;padding:6px 12px;border-radius:999px;
  font-weight:800;font-size:13px;margin-bottom:14px;
  border:1px solid rgba(26,26,46,.20);
}
.plan-warn{
  color:var(--japan-red);font-size:12px;text-align:center;margin-top:auto;padding-top:14px;
  font-weight:600;
}

/* basic plan nudge -> aponta pro premium */
.basic-nudge{
  margin-top:14px;padding:12px 14px;
  background:var(--japan-navy-soft);
  border:1.5px dashed var(--japan-navy);
  border-radius:12px;
  display:flex;align-items:center;gap:10px;
  position:relative;
}
.basic-nudge .nudge-arrow{
  font-size:30px;font-weight:900;
  color:var(--japan-red);
  line-height:1;flex-shrink:0;
  animation:arrowBump 1.4s ease-in-out infinite;
}
.basic-nudge p{
  font-size:13px;line-height:1.4;color:var(--japan-navy-dark);margin:0;
}
.basic-nudge strong{color:var(--japan-red)}
@keyframes arrowBump{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(5px)}
}

/* premium price block — centralizado, parcelamento */
.premium-price-block{
  text-align:center;
  margin:14px 0 16px;
}
.premium-price-block .plan-price-label{
  margin:0 0 6px;
}
.premium-price-block .plan-price-label s{
  color:var(--text-soft);text-decoration:line-through;
  text-decoration-color:var(--japan-red);text-decoration-thickness:2px;
}
.premium-price-block .plan-price{
  margin:0 0 6px;text-align:center;
}
.plan-installments{
  color:var(--text);font-size:13.5px;line-height:1.4;
  margin:0;
}
.plan-installments strong{color:var(--japan-red);font-weight:800}
.cta-secondary{
  display:inline-block;text-align:center;
  background:#fff;color:var(--text-dark);
  border:1.5px solid var(--border-strong);
  padding:14px 18px;border-radius:12px;
  font-weight:700;font-size:14px;
  transition:all .2s ease;margin-top:auto;
}
.cta-secondary:hover{border-color:var(--japan-navy);background:var(--japan-navy-soft);color:var(--japan-navy)}
.plan-card .cta-primary{margin-top:auto;display:block;text-align:center}

.payment-foot{text-align:center;margin-top:36px}
.payment-title{color:var(--text-muted);font-size:13px;margin-bottom:12px}

/* ============ PREMIUM / BASIC COVER ============ */
.premium-cover,.basic-cover{
  margin:-6px -10px 6px;
  display:flex;align-items:center;justify-content:center;
  padding:8px 0 14px;
  position:relative;
}
.premium-cover img{
  width:88%;max-width:340px;height:auto;
  mix-blend-mode: multiply;
}
.basic-cover img{
  width:62%;max-width:200px;height:auto;
  mix-blend-mode: multiply;
}

/* ============ FAQ ============ */
.faq{display:grid;gap:10px}
.faq details{
  background:#fff;border:1.5px solid var(--border);border-radius:12px;
  padding:0;overflow:hidden;
  box-shadow:var(--shadow-soft);
}
.faq summary{
  list-style:none;cursor:pointer;
  padding:18px 22px;font-weight:700;font-size:15px;color:var(--text-dark);
  display:flex;justify-content:space-between;align-items:center;gap:12px;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"+";font-size:22px;font-weight:300;color:var(--japan-red);
  transition:transform .2s ease;flex-shrink:0;
}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{
  padding:0 22px 18px;color:var(--text);font-size:14px;line-height:1.55;
}

/* ============ FOOTER ============ */
.footer{
  background:linear-gradient(180deg,#1a1a2e 0%,#0f0f1a 100%);
  color:#d5ccd4;padding:40px 20px 30px;
}
.footer-brand{
  font-family:'Outfit',sans-serif;color:#fff;
  font-size:20px;letter-spacing:1px;margin-bottom:6px;
}
.footer-tag{font-size:13px;margin-bottom:14px;color:#c5bbc4}
.footer-legal{font-size:11px;color:#a5a0ad;line-height:1.55;margin-bottom:14px;max-width:520px;margin-left:auto;margin-right:auto}
.footer-copy{font-size:11px;color:#8680a0}

/* ============ CTA VIP — pulse mais forte ============ */
.cta-vip{
  animation:vipPulse 1.6s ease-in-out infinite !important;
  position:relative;
}
.cta-vip::before{
  content:"";
  position:absolute;inset:-4px;
  border-radius:18px;
  background:linear-gradient(90deg,var(--japan-red),var(--japan-red-light),var(--japan-red));
  z-index:-1;
  opacity:.7;
  animation:vipGlow 2s ease-in-out infinite;
  filter:blur(8px);
}
@keyframes vipPulse{
  0%,100%{transform:translateY(0);box-shadow:0 14px 30px var(--cta-shadow), inset 0 1px 0 rgba(255,255,255,.25)}
  50%{transform:translateY(-2px);box-shadow:0 22px 48px rgba(232,0,63,.55), inset 0 1px 0 rgba(255,255,255,.32)}
}
@keyframes vipGlow{
  0%,100%{opacity:.5}
  50%{opacity:.85}
}

/* ============ MOBILE TUNING ============ */
@media (max-width:480px){
  .hero{padding:24px 16px 44px}
  .hero h1{font-size:26px}
  .section{padding:48px 16px}
  .section-feedback{padding:48px 16px}
  .feedback-card{width:290px;padding:22px 18px}
  .feedback-title{font-size:26px}
  .cd-box{min-width:78px;padding:12px 14px}
  .cd-box span{font-size:30px}
  .plan-price{font-size:36px}
}