:root {
  --bg: #f7f5f0;
  --black: #111;
  --white: #fff;
  --accent: #e8ff47;
  --accent2: #ff6b35;
  --gray: #f0ede8;
  --gray2: #e5e2dc;
  --muted: #888;
  --border: #ddd;
  --text: #222;
  --card: #fff;
  --tab-supp: #111;
  --tab-nutr: #1a3a2a;
  --tab-fit: #1a1a3a;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior: smooth; }
body { background:var(--bg); color:var(--text); font-family:'Epilogue',sans-serif; min-height:100vh; }

/* NAV */
nav {
  display:flex; justify-content:space-between; align-items:center;
  padding:18px 48px; background:var(--black); position:sticky; top:0; z-index:200;
  border-bottom:2px solid #222;
}
.logo { font-family:'Outfit',sans-serif; font-size:22px; font-weight:800; color:var(--white); letter-spacing:-0.5px; }
.logo em { color:var(--accent); font-style:normal; }
.nav-tag { font-size:11px; font-weight:600; letter-spacing:2px; text-transform:uppercase; color:#555; }
.nav-cta {
  background:var(--accent); color:var(--black); border:none;
  padding:9px 18px; border-radius:100px;
  font-family:'Outfit',sans-serif; font-size:13px; font-weight:800;
  cursor:pointer; opacity:0; pointer-events:none;
  transition:all 0.3s cubic-bezier(0.4,0,0.2,1); transform:translateX(10px);
}
.nav-cta.show { opacity:1; pointer-events:auto; transform:translateX(0); }
.nav-cta:hover { background:#d4eb30; transform:scale(1.04); }
@media(max-width:520px){ .nav-cta { padding:8px 14px; font-size:12px; } }

/* HERO */
.hero {
  min-height:92vh; display:flex; align-items:center; justify-content:center;
  text-align:center; padding:60px 24px;
  background:var(--black);
  position:relative; overflow:hidden;
}
.hero::before {
  content:''; position:absolute; inset:0;
  background:
    radial-gradient(ellipse 60% 50% at 20% 30%, #e8ff4715 0%, transparent 60%),
    radial-gradient(ellipse 50% 60% at 80% 70%, #ff6b3520 0%, transparent 60%),
    radial-gradient(ellipse 80% 60% at 50% 120%, #e8ff4720 0%, transparent 70%);
  animation: meshShift 20s ease-in-out infinite;
}
.hero::after {
  content:''; position:absolute; inset:0;
  background: radial-gradient(circle at 30% 20%, rgba(232,255,71,0.08) 0%, transparent 50%);
  animation: meshShift2 25s ease-in-out infinite reverse;
  pointer-events:none;
}
@keyframes meshShift {
  0%,100% { transform:translate(0,0) rotate(0deg); }
  50% { transform:translate(-30px,20px) rotate(2deg); }
}
@keyframes meshShift2 {
  0%,100% { transform:translate(0,0); }
  50% { transform:translate(40px,-20px); }
}
.hero-inner { position:relative; z-index:1; max-width:780px; }
.hero-badge {
  display:inline-flex; align-items:center; gap:8px;
  background:#1a1a1a; border:1px solid #333; border-radius:100px;
  padding:8px 18px; margin-bottom:36px;
  font-size:12px; font-weight:600; letter-spacing:1.5px; text-transform:uppercase; color:#888;
}
.hero-badge span { color:var(--accent); }
h1 {
  font-family:'Outfit',sans-serif; font-size:clamp(52px,9vw,110px);
  font-weight:800; line-height:0.92; letter-spacing:-2px;
  color:var(--white); margin-bottom:28px;
}
h1 em { color:var(--accent); font-style:normal; display:block; }
.hero p { font-size:18px; color:#777; font-weight:300; line-height:1.7; max-width:500px; margin:0 auto 48px; }
.btn-hero {
  display:inline-block; background:var(--accent); color:var(--black);
  font-family:'Outfit',sans-serif; font-size:16px; font-weight:700;
  padding:18px 44px; border-radius:100px; cursor:pointer; border:none;
  transition:all 0.2s; letter-spacing:-0.3px;
}
.btn-hero:hover { transform:scale(1.03); background:#d4eb30; }

.hero-features { display:flex; justify-content:center; gap:32px; margin-top:48px; flex-wrap:wrap; }
.hf { text-align:center; }
.hf-num { font-family:'Outfit',sans-serif; font-size:32px; font-weight:800; color:var(--accent); }
.hf-lbl { font-size:12px; color:#555; font-weight:500; margin-top:2px; }

/* QUIZ */
#quiz-section { display:none; background:var(--bg); min-height:100vh; padding:60px 24px; }
.quiz-inner { max-width:640px; margin:0 auto; }
.q-progress { display:flex; gap:6px; margin-bottom:36px; align-items:center; }
.q-dot { height:4px; flex:1; background:var(--gray2); border-radius:3px; transition:background 0.4s, transform 0.3s; position:relative; overflow:hidden; }
.q-dot.done { background:var(--black); }
.q-dot.active { background:linear-gradient(90deg, var(--accent2), var(--accent)); transform:scaleY(1.4); }
.q-counter { font-family:'Outfit',sans-serif; font-size:11px; font-weight:700; color:var(--muted); margin-left:14px; letter-spacing:0.5px; flex-shrink:0; min-width:34px; text-align:right; }

.q-step { display:none; animation:fadeUp 0.35s ease; }
.q-step.active { display:block; }
@keyframes fadeUp { from{opacity:0;transform:translateY(14px)} to{opacity:1;transform:translateY(0)} }

.q-label { font-size:11px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--accent2); margin-bottom:10px; }
.q-title { font-family:'Outfit',sans-serif; font-size:clamp(28px,5vw,42px); font-weight:800; margin-bottom:8px; line-height:1.1; letter-spacing:-1px; }
.q-sub { font-size:15px; color:var(--muted); margin-bottom:32px; font-weight:300; }

.opts { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.opts.c1 { grid-template-columns:1fr; }
.opts.c3 { grid-template-columns:1fr 1fr 1fr; }
.opt {
  background:var(--white); border:2px solid var(--border); border-radius:14px;
  padding:18px 20px; cursor:pointer; transition:all 0.18s; position:relative;
  text-align:left;
}
.opt:hover { border-color:var(--black); transform:translateY(-2px); box-shadow:0 8px 24px rgba(0,0,0,0.08); }
.opt.sel { border-color:var(--black); background:var(--black); color:var(--white); }
.opt.sel .opt-desc { color:#aaa; }
.opt-ico { font-size:26px; margin-bottom:8px; display:block; }
.opt-title { font-weight:700; font-size:15px; margin-bottom:3px; font-family:'Outfit',sans-serif; }
.opt-desc { font-size:13px; color:var(--muted); line-height:1.4; }
.opt.sel::after {
  content:'✓'; position:absolute; top:12px; right:14px;
  width:22px; height:22px; background:var(--accent); color:var(--black);
  border-radius:50%; font-size:11px; font-weight:900; line-height:22px; text-align:center;
}

/* Number inputs for height/weight */
.num-inputs { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.num-field label { display:block; font-size:12px; font-weight:700; letter-spacing:1px; text-transform:uppercase; color:var(--muted); margin-bottom:8px; }
.num-field input {
  width:100%; background:var(--white); border:2px solid var(--border); border-radius:12px;
  padding:16px 20px; font-family:'Outfit',sans-serif; font-size:24px; font-weight:700;
  color:var(--black); outline:none; transition:border-color 0.2s;
}
.num-field input:focus { border-color:var(--black); }
.num-field span { display:block; font-size:12px; color:var(--muted); margin-top:6px; }

.q-nav { display:flex; justify-content:space-between; align-items:center; margin-top:28px; }
.btn-back2 {
  background:none; border:2px solid var(--border); color:var(--muted);
  padding:12px 24px; border-radius:100px; font-family:'Epilogue',sans-serif;
  font-size:14px; font-weight:600; cursor:pointer; transition:all 0.2s;
}
.btn-back2:hover { border-color:var(--black); color:var(--black); }
.btn-next2 {
  background:var(--black); color:var(--white); border:none;
  padding:14px 32px; border-radius:100px; font-family:'Outfit',sans-serif;
  font-size:15px; font-weight:700; cursor:pointer; transition:all 0.2s; margin-left:auto;
}
.btn-next2:hover { background:#333; transform:translateY(-1px); }
.btn-next2:disabled { opacity:0.25; cursor:not-allowed; transform:none; }

/* LOADING */
#loading { display:none; min-height:100vh; align-items:center; justify-content:center; flex-direction:column; gap:20px;
  background:linear-gradient(135deg,#0a0a0a 0%,#1a1a1a 50%,#0a0a0a 100%); padding:24px; position:relative; overflow:hidden; }
#loading::before {
  content:''; position:absolute; inset:0;
  background: radial-gradient(ellipse 50% 40% at 50% 50%, rgba(232,255,71,0.08) 0%, transparent 60%);
  animation: pulse-bg 3s ease-in-out infinite;
}
@keyframes pulse-bg { 0%,100% { opacity:0.5; } 50% { opacity:1; } }
#loading.active { display:flex; }
.load-inner { position:relative; z-index:1; max-width:380px; width:100%; }
.load-ring { width:64px; height:64px; border:3px solid #222; border-top-color:var(--accent); border-radius:50%; animation:spin 0.9s linear infinite; margin:0 auto 32px; }
@keyframes spin { to{transform:rotate(360deg)} }
.load-title { color:#fff; font-family:'Outfit',sans-serif; font-size:24px; font-weight:800; text-align:center; margin-bottom:6px; letter-spacing:-0.5px; }
.load-sub { color:#666; font-size:13px; text-align:center; margin-bottom:32px; }
.load-steps { display:flex; flex-direction:column; gap:10px; }
.load-step {
  display:flex; align-items:center; gap:12px; padding:12px 16px;
  background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.06);
  border-radius:12px; color:#666; font-size:14px; font-weight:500;
  opacity:0.5; transition:all 0.4s;
}
.load-step.active { opacity:1; color:#fff; background:rgba(232,255,71,0.06); border-color:rgba(232,255,71,0.2); }
.load-step.done { opacity:1; color:#aaa; }
.load-step-ico {
  width:24px; height:24px; border-radius:50%; flex-shrink:0;
  background:rgba(255,255,255,0.06); display:flex; align-items:center; justify-content:center;
  font-size:11px; font-weight:800; color:#444; transition:all 0.3s;
}
.load-step.active .load-step-ico { background:var(--accent); color:#000; }
.load-step.done .load-step-ico { background:rgba(74,222,128,0.2); color:#4ade80; }
.load-step.done .load-step-ico::before { content:'✓'; }
.load-step.done .load-step-num { display:none; }

/* RESULTS */
#results { display:none; background:var(--bg); }
#results.active { display:block; }

.results-hero {
  background:linear-gradient(180deg, #1a1a1a 0%, #0a0a0a 100%);
  padding:56px 24px 48px; text-align:center; position:relative; overflow:hidden;
}
.results-hero::before {
  content:''; position:absolute; inset:0;
  background: radial-gradient(ellipse 60% 40% at 50% 0%, rgba(232,255,71,0.1) 0%, transparent 60%);
  pointer-events:none;
}
.results-hero > * { position:relative; z-index:1; }
.results-hero h2 { font-family:'Outfit',sans-serif; font-size:clamp(36px,6vw,64px); font-weight:800; color:var(--white); letter-spacing:-1.5px; margin-bottom:10px; }
.results-hero h2 em { color:var(--accent); font-style:normal; }
.results-hero p { color:#888; font-size:15px; }
.profile-chips { display:flex; justify-content:center; gap:10px; margin-top:22px; flex-wrap:wrap; }
.chip { display:inline-flex; align-items:center; gap:7px; background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.1); border-radius:100px; padding:8px 16px; font-size:13px; font-weight:600; color:#bbb; transition:all 0.2s; }
.chip:hover { background:rgba(255,255,255,0.08); border-color:rgba(255,255,255,0.2); }
.chip.primary { background:rgba(232,255,71,0.1); border-color:rgba(232,255,71,0.3); color:var(--accent); font-weight:700; }
.chip-ico { font-size:14px; }

/* PLAN TABS */
/* INTEGRATED DASHBOARD — overview hub */
.dashboard {
  background:linear-gradient(180deg,#0a0a0a 0%,#000 100%);
  padding:56px 24px 64px; border-bottom:1px solid #1a1a1a;
  position:relative; overflow:hidden;
}
.dashboard::before {
  content:''; position:absolute; top:-30%; left:50%; transform:translateX(-50%);
  width:800px; height:600px; border-radius:50%;
  background:radial-gradient(ellipse at center, rgba(232,255,71,0.08) 0%, transparent 60%);
  pointer-events:none;
}
.dashboard-inner { max-width:1000px; margin:0 auto; position:relative; z-index:1; }
.dashboard-eyebrow { text-align:center; font-size:11px; font-weight:700; letter-spacing:2.5px; text-transform:uppercase; color:var(--accent2); margin-bottom:14px; }
.dashboard-title { text-align:center; font-family:'Outfit',sans-serif; font-size:clamp(28px,5vw,42px); font-weight:800; letter-spacing:-1.2px; line-height:1.1; color:#fff; margin-bottom:12px; }
.dashboard-sub { text-align:center; font-size:14px; color:#888; line-height:1.6; max-width:520px; margin:0 auto 36px; }

.dash-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
@media(max-width:1000px){ .dash-grid { grid-template-columns:repeat(2,1fr); } }
.dash-card {
  background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:18px; padding:22px 22px 18px;
  cursor:pointer; transition:all 0.3s cubic-bezier(0.4,0,0.2,1);
  position:relative; overflow:hidden;
  display:flex; flex-direction:column;
}
.dash-card:hover { background:rgba(255,255,255,0.07); border-color:rgba(255,255,255,0.18); transform:translateY(-4px); }
.dash-card.active { border-color:var(--accent); background:rgba(232,255,71,0.06); box-shadow:0 12px 40px rgba(232,255,71,0.15); }
.dash-card.active::before { content:''; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--accent); }
.dash-card-head { display:flex; align-items:center; gap:10px; margin-bottom:14px; }
.dash-card-ico {
  width:42px; height:42px; border-radius:50%;
  background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.08);
  display:flex; align-items:center; justify-content:center; font-size:22px;
  flex-shrink:0;
}
.dash-card.active .dash-card-ico { background:rgba(232,255,71,0.12); border-color:rgba(232,255,71,0.25); }
.dash-card-title { font-family:'Outfit',sans-serif; font-size:14px; font-weight:800; color:#fff; letter-spacing:-0.2px; }
.dash-card-sub { font-size:11px; color:#666; text-transform:uppercase; letter-spacing:1px; font-weight:600; margin-top:2px; }
.dash-card-stats { display:flex; flex-direction:column; gap:8px; margin-bottom:14px; flex:1; }
.dash-stat { display:flex; align-items:baseline; gap:8px; }
.dash-stat-num { font-family:'Outfit',sans-serif; font-size:22px; font-weight:800; color:var(--accent); letter-spacing:-0.5px; line-height:1; }
.dash-stat-lbl { font-size:11px; color:#888; }
.dash-card-cta {
  display:inline-flex; align-items:center; justify-content:space-between;
  font-family:'Outfit',sans-serif; font-size:12px; font-weight:700; color:#fff;
  padding-top:12px; border-top:1px solid rgba(255,255,255,0.08);
  letter-spacing:0.3px;
}
.dash-card-cta::after { content:'→'; transition:transform 0.2s; }
.dash-card:hover .dash-card-cta::after { transform:translateX(4px); }
.dash-card.active .dash-card-cta { color:var(--accent); }

@media(max-width:600px){ .dash-grid { grid-template-columns:1fr; } }

/* PLAN SECTIONS — only active visible (tabbed) */
.plan-section { display:none; padding:48px 24px 80px; max-width:900px; margin:0 auto; }
.plan-section.active { display:block; animation:fadeSlide 0.4s cubic-bezier(0.4,0,0.2,1); }
@keyframes fadeSlide { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }

/* SECTION HEADER */
.sec-header { margin-bottom:32px; padding-bottom:20px; border-bottom:1px solid var(--gray2); }
.sec-header h3 { font-family:'Outfit',sans-serif; font-size:36px; font-weight:800; letter-spacing:-1.5px; margin-bottom:8px; line-height:1; }
.sec-header h3::before { content:''; display:inline-block; width:5px; height:32px; background:var(--accent); margin-right:14px; vertical-align:-5px; border-radius:3px; }
.sec-header p { color:var(--muted); font-size:15px; line-height:1.6; padding-left:19px; }

/* ---- SUPPLEMENTS PLAN ---- */
.view-toggle { display:flex; gap:8px; margin-bottom:24px; }
.vtog { background:var(--white); border:2px solid var(--border); border-radius:100px; padding:8px 18px; font-size:13px; font-weight:600; cursor:pointer; transition:all 0.2s; color:var(--muted); font-family:'Epilogue',sans-serif; }
.vtog.active { background:var(--black); border-color:var(--black); color:var(--white); }

.supp-intro { background:var(--white); border-radius:14px; padding:18px 22px; margin-bottom:28px; border-left:4px solid var(--accent); font-size:14px; line-height:1.6; color:#444; }

.legend { display:flex; gap:20px; margin-bottom:20px; flex-wrap:wrap; }
.leg-item { display:flex; align-items:center; gap:7px; font-size:12px; color:var(--muted); font-weight:500; }
.leg-dot { width:10px; height:10px; border-radius:3px; }
.leg-dot.ess { background:var(--black); }
.leg-dot.opt { background:var(--gray2); border:1px solid var(--border); }

.time-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:28px; }
.tslot { border-radius:20px; overflow:hidden; transition:all 0.25s cubic-bezier(0.4,0,0.2,1); box-shadow:0 4px 16px rgba(0,0,0,0.04); border:1px solid var(--border); }
.tslot:hover { transform:translateY(-3px); box-shadow:0 16px 32px rgba(0,0,0,0.1); border-color:transparent; }
.tslot-head { padding:18px 18px 14px; display:flex; align-items:center; gap:12px; position:relative; overflow:hidden; }
.tslot-head::after { content:''; position:absolute; bottom:0; left:18px; right:18px; height:1px; background:rgba(0,0,0,0.06); }
.tslot.morning .tslot-head { background:linear-gradient(135deg,#fef9e7 0%,#fde68a 100%); }
.tslot.pre .tslot-head     { background:linear-gradient(135deg,#fef3ef 0%,#fed7aa 100%); }
.tslot.post .tslot-head    { background:linear-gradient(135deg,#f0fef4 0%,#bbf7d0 100%); }
.tslot.night .tslot-head   { background:linear-gradient(135deg,#f0f0ff 0%,#ddd6fe 100%); }
.tslot-body { background:var(--white); border-top:1px solid var(--gray); padding:14px 12px; }
.tslot-ico { font-size:26px; width:44px; height:44px; background:rgba(255,255,255,0.85); border-radius:14px; display:flex; align-items:center; justify-content:center; flex-shrink:0; box-shadow:0 2px 8px rgba(0,0,0,0.06); }
.tslot-lbl { font-family:'Outfit',sans-serif; font-size:15px; font-weight:800; letter-spacing:-0.3px; line-height:1.1; }
.tslot-sub { font-size:11px; color:var(--muted); margin-top:3px; font-weight:500; }

.spill {
  border-radius:14px; padding:14px; margin-bottom:10px; cursor:pointer;
  transition:all 0.2s cubic-bezier(0.4, 0, 0.2, 1); border:1.5px solid transparent;
  position:relative; overflow:hidden;
}
.spill::before {
  content:''; position:absolute; left:0; top:0; bottom:0; width:0;
  background:var(--black); transition:width 0.2s;
}
.spill:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(0,0,0,0.08); border-color:rgba(0,0,0,0.15); }
.spill:hover::before { width:3px; }
.spill.morning { background:#fef9e7; }
.spill.pre     { background:#fef3ef; }
.spill.post    { background:#f0fef4; }
.spill.night   { background:#f0f0ff; }
.spill.opt-pill { opacity:0.55; }
.spill.opt-pill:hover { opacity:1; }
.spill-name { display:flex; align-items:center; gap:8px; }
.spill-name-ico { font-size:18px; line-height:1; }
/* PURCHASE SECTION (donde comprar — al final del plan) */
#purchase-section { margin-top:48px; padding-top:36px; border-top:2px solid var(--gray2); }
.purchase-section-title { font-family:'Outfit',sans-serif; font-size:24px; font-weight:800; letter-spacing:-0.8px; margin-bottom:18px; }
.purchase-section-title::before { content:'🛒'; margin-right:10px; }

/* STACK HERO V2 — premium */
.stack-hero.v2 {
  background:radial-gradient(ellipse at top right, rgba(232,255,71,0.12) 0%, transparent 60%),
             linear-gradient(160deg, #0a0a0a 0%, #1a1a1a 100%);
  border-radius:24px; padding:32px; margin-bottom:24px;
  position:relative; overflow:hidden;
  box-shadow:0 24px 60px rgba(0,0,0,0.18), 0 0 0 1px rgba(232,255,71,0.08);
}
.stack-hero.v2::before {
  content:''; position:absolute; inset:0;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='60' height='60'><circle cx='30' cy='30' r='1' fill='%23e8ff47' opacity='0.04'/></svg>");
  pointer-events:none;
}
.stack-hero.v2 > * { position:relative; z-index:1; }
.stack-hero-eyebrow { font-size:11px; font-weight:800; letter-spacing:2.5px; text-transform:uppercase; color:rgba(232,255,71,0.7); margin-bottom:18px; }
.stack-hero-composition { display:flex; flex-direction:column; gap:8px; margin-bottom:20px; padding-bottom:20px; border-bottom:1px solid rgba(255,255,255,0.06); }
.stack-icons-row { display:flex; gap:6px; flex-wrap:wrap; }
.stack-icon {
  width:42px; height:42px; border-radius:50%;
  background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.1);
  display:inline-flex; align-items:center; justify-content:center;
  font-size:20px; transition:all 0.2s; cursor:default;
}
.stack-icon:hover { transform:scale(1.1); background:rgba(232,255,71,0.1); border-color:rgba(232,255,71,0.3); }
.stack-hero-count { font-size:13px; color:#999; }
.stack-hero-count strong { color:var(--accent); }
.stack-hero-price-headline { display:flex; align-items:baseline; gap:14px; margin-bottom:18px; flex-wrap:wrap; }
.stack-hero-price-big {
  font-family:'Outfit',sans-serif; font-size:56px; font-weight:800; color:#fff;
  letter-spacing:-2px; line-height:1; transition:all 0.3s;
  background:linear-gradient(135deg, #fff 0%, var(--accent) 100%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.stack-hero-price-meta { font-size:14px; color:#888; }
.stack-hero-price-meta strong { color:#fff; }
.store-segs { display:grid; grid-template-columns:repeat(3, 1fr); gap:6px; margin-bottom:20px; padding:4px; background:rgba(255,255,255,0.04); border-radius:14px; border:1px solid rgba(255,255,255,0.06); }
.store-seg {
  background:transparent; border:none; padding:10px 12px; border-radius:10px;
  cursor:pointer; transition:all 0.2s;
  display:flex; flex-direction:column; gap:2px; align-items:center;
  font-family:inherit; position:relative;
}
.store-seg:hover { background:rgba(255,255,255,0.04); }
.store-seg.active { background:linear-gradient(135deg, rgba(232,255,71,0.15), rgba(232,255,71,0.08)); box-shadow:0 0 0 1px rgba(232,255,71,0.3); }
.store-seg-name { font-size:11px; color:#888; font-weight:700; text-transform:uppercase; letter-spacing:0.5px; }
.store-seg.active .store-seg-name { color:#fff; }
.store-seg-price { font-family:'Outfit',sans-serif; font-size:16px; font-weight:800; color:#ccc; }
.store-seg.active .store-seg-price { color:var(--accent); }
.store-seg-badge { position:absolute; top:-7px; right:-7px; background:var(--accent); color:#000; font-size:8px; font-weight:800; padding:2px 6px; border-radius:100px; letter-spacing:0.5px; text-transform:uppercase; }
.stack-hero-cta-v2 {
  width:100%; background:var(--accent); color:#000; border:none;
  padding:16px 22px; border-radius:14px;
  font-family:'Outfit',sans-serif; font-size:15px; font-weight:800;
  cursor:pointer; transition:all 0.2s;
  box-shadow:0 8px 24px rgba(232,255,71,0.2);
}
.stack-hero-cta-v2:hover { background:#d4eb30; transform:translateY(-2px); box-shadow:0 12px 32px rgba(232,255,71,0.3); }
.stack-trust { display:flex; gap:6px; justify-content:center; flex-wrap:wrap; margin-top:14px; font-size:11px; color:#666; font-weight:600; }
@media(max-width:600px){
  .stack-hero.v2 { padding:24px; }
  .stack-hero-price-big { font-size:44px; }
  .store-segs { grid-template-columns:1fr 1fr 1fr; }
}

/* STACK HERO (top of supps tab — quick buy CTA) */
.stack-hero { background:linear-gradient(135deg,#1a1a1a 0%,#000 100%); border-radius:20px; padding:24px; margin-bottom:24px; position:relative; overflow:hidden; }
.stack-hero::before { content:''; position:absolute; top:-50%; right:-30%; width:300px; height:300px; border-radius:50%; background:radial-gradient(circle,rgba(232,255,71,0.15) 0%,transparent 70%); pointer-events:none; }
.stack-hero-top { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; position:relative; z-index:1; flex-wrap:wrap; }
.stack-hero-info { flex:1; min-width:200px; }
.stack-hero-label { font-size:11px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; color:rgba(232,255,71,0.7); margin-bottom:6px; }
.stack-hero-title { font-family:'Outfit',sans-serif; font-size:24px; font-weight:800; color:#fff; letter-spacing:-0.5px; margin-bottom:4px; }
.stack-hero-sub { font-size:13px; color:#aaa; }
.stack-hero-price-block { text-align:right; }
.stack-hero-price { font-family:'Outfit',sans-serif; font-size:36px; font-weight:800; color:var(--accent); letter-spacing:-1px; line-height:1; }
.stack-hero-price-sub { font-size:11px; color:#888; margin-top:4px; }
.stack-hero-savings { display:inline-block; background:rgba(34,197,94,0.15); border:1px solid rgba(34,197,94,0.3); color:#4ade80; padding:5px 11px; border-radius:100px; font-size:11px; font-weight:700; margin-top:6px; }
.stack-hero-cta { width:100%; background:var(--accent); color:var(--black); border:none; padding:16px 22px; border-radius:14px; font-family:'Outfit',sans-serif; font-size:15px; font-weight:800; cursor:pointer; margin-top:18px; display:flex; align-items:center; justify-content:center; gap:8px; transition:all 0.2s; position:relative; z-index:1; }
.stack-hero-cta:hover { background:#d4eb30; transform:translateY(-1px); box-shadow:0 12px 32px rgba(232,255,71,0.3); }
.trust-row { display:flex; justify-content:center; gap:18px; margin-top:14px; flex-wrap:wrap; position:relative; z-index:1; }
.trust-item { font-size:11px; color:#888; font-weight:500; letter-spacing:0.3px; }
.stack-hero-stores-mini { display:flex; gap:8px; margin-top:12px; flex-wrap:wrap; position:relative; z-index:1; }
.stack-hero-store-mini { background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.08); color:#aaa; padding:8px 14px; border-radius:10px; font-size:12px; cursor:pointer; flex:1; min-width:100px; transition:all 0.2s; text-align:center; }
.stack-hero-store-mini:hover { background:rgba(255,255,255,0.08); color:#fff; border-color:rgba(255,255,255,0.2); }
.stack-hero-store-mini-name { font-weight:700; font-family:'Outfit',sans-serif; font-size:11px; letter-spacing:0.5px; text-transform:uppercase; }
.stack-hero-store-mini-price { font-size:15px; font-weight:800; color:#fff; margin-top:2px; }

/* COMPARISON TABLE */
.compare-section { background:#fff; border:1px solid var(--border); border-radius:16px; padding:20px; margin-bottom:24px; }
.compare-toggle { background:none; border:none; width:100%; display:flex; justify-content:space-between; align-items:center; cursor:pointer; font-family:'Outfit',sans-serif; font-size:15px; font-weight:800; color:var(--black); padding:0; }
.compare-toggle::after { content:'▾'; transition:transform 0.2s; color:var(--muted); }
.compare-toggle.open::after { transform:rotate(180deg); }
.compare-body { display:none; margin-top:16px; }
.compare-body.open { display:block; animation:fadeUp 0.3s ease; }
.compare-row { display:grid; grid-template-columns:1fr auto auto; gap:14px; align-items:center; padding:14px 0; border-bottom:1px solid var(--gray); }
.compare-row:last-child { border-bottom:none; }
.compare-row.total { font-family:'Outfit',sans-serif; font-weight:800; font-size:15px; color:var(--black); padding-top:18px; border-top:2px solid var(--black); }
.compare-row.best-row { background:linear-gradient(90deg,rgba(232,255,71,0.05),transparent); margin:0 -10px; padding:14px 10px; border-radius:8px; }
.compare-store-name { font-weight:600; }
.compare-store-name .best-badge { display:inline-block; background:var(--accent); color:#000; font-size:9px; font-weight:800; padding:2px 7px; border-radius:100px; margin-left:8px; letter-spacing:0.5px; }
.compare-price { font-family:'Outfit',sans-serif; font-size:18px; font-weight:800; color:var(--black); }
.compare-cta { background:var(--black); color:#fff; border:none; padding:8px 16px; border-radius:100px; font-family:'Outfit',sans-serif; font-size:12px; font-weight:700; cursor:pointer; text-decoration:none; display:inline-block; transition:all 0.2s; }
.compare-cta:hover { background:#333; }
.compare-cta.best { background:var(--accent); color:#000; }

/* DISCOUNT CARDS — sutiles, no agresivas */
.discounts-section { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:8px; margin:16px 0; }
.discounts-title { font-size:11px; color:var(--muted); text-transform:uppercase; letter-spacing:1px; font-weight:700; margin:24px 0 8px; }
.discount-card { background:#fff; border:1px solid #f5d574; border-radius:10px; padding:12px 14px; transition:all 0.2s; }
.discount-card:hover { border-color:#f59e0b; transform:translateY(-1px); }
.discount-card-store { font-family:'Outfit',sans-serif; font-size:10px; font-weight:700; letter-spacing:0.8px; text-transform:uppercase; color:#92400e; margin-bottom:4px; }
.discount-card-code { font-family:'Outfit',sans-serif; font-size:14px; font-weight:800; color:var(--black); letter-spacing:0.3px; margin-bottom:2px; cursor:pointer; user-select:all; }
.discount-card-desc { font-size:11px; color:#666; line-height:1.4; }
.discount-card-copy { font-size:9px; color:#92400e; font-weight:600; margin-top:4px; opacity:0.7; }

/* STICKY CART BAR (mobile) */
.sticky-cart { display:none; position:fixed; bottom:0; left:0; right:0; background:rgba(15,15,15,0.78); backdrop-filter:blur(16px) saturate(160%); -webkit-backdrop-filter:blur(16px) saturate(160%); padding:14px 18px; z-index:300; border-top:1px solid rgba(255,255,255,0.08); box-shadow:0 -8px 24px rgba(0,0,0,0.4); }
@media(max-width:700px) { .sticky-cart.show { display:flex; align-items:center; gap:14px; animation:slideUp 0.3s ease; } }
.sticky-cart-info { flex:1; }
.sticky-cart-label { font-size:10px; color:#888; text-transform:uppercase; letter-spacing:1px; font-weight:700; }
.sticky-cart-price { font-family:'Outfit',sans-serif; font-size:20px; font-weight:800; color:var(--accent); }
.sticky-cart-cta { background:var(--accent); color:#000; border:none; padding:11px 20px; border-radius:100px; font-family:'Outfit',sans-serif; font-size:13px; font-weight:800; cursor:pointer; }

.spill-tag { font-size:9px; font-weight:800; letter-spacing:1.2px; text-transform:uppercase; padding:3px 8px; border-radius:6px; display:inline-block; margin-bottom:6px; }
.spill-tag.ess { background:var(--black); color:var(--accent); }
.spill-tag.rec { background:#fff7ed; color:#9a3412; border:1px solid #fed7aa; }
.spill-tag.opt { background:rgba(0,0,0,0.08); color:var(--muted); }
.spill-name { font-size:14px; font-weight:800; color:var(--black); margin-bottom:3px; font-family:'Outfit',sans-serif; letter-spacing:-0.2px; padding-right:18px; }
.spill-dose { font-size:11px; color:var(--muted); font-weight:500; margin-bottom:8px; }
.spill-popular { display:inline-block; background:rgba(0,0,0,0.06); color:var(--black); font-size:8px; font-weight:700; padding:2px 6px; border-radius:4px; letter-spacing:0.5px; margin-left:6px; vertical-align:middle; }
.spill-bottom { display:flex; justify-content:space-between; align-items:center; gap:6px; padding-top:8px; border-top:1px solid rgba(0,0,0,0.06); }
.spill-price-block { line-height:1.1; }
.spill-price { font-family:'Outfit',sans-serif; font-size:14px; font-weight:800; color:var(--black); }
.spill-price-store { font-size:10px; color:var(--accent2); font-weight:700; text-transform:uppercase; letter-spacing:0.3px; }
.spill-reviews { font-size:10px; color:var(--muted); margin-top:2px; }
.spill-buy { background:var(--black); color:var(--accent); border:none; width:30px; height:30px; border-radius:50%; font-size:14px; font-weight:800; cursor:pointer; flex-shrink:0; transition:all 0.2s; display:flex; align-items:center; justify-content:center; }
.spill-buy:hover { background:var(--accent); color:var(--black); transform:scale(1.1); }
.slot-empty { font-size:12px; color:#ccc; text-align:center; padding:20px 0; }

/* SUPP DETAIL */
.supp-detail {
  background:linear-gradient(135deg,#fff 0%,#f9f9f5 100%);
  border:2px solid var(--black); border-radius:20px;
  padding:0; margin-bottom:28px; display:none; animation:fadeUp 0.25s cubic-bezier(0.4,0,0.2,1);
  overflow:hidden; box-shadow:0 20px 60px rgba(0,0,0,0.12);
}
.supp-detail.open { display:block; }
.sd-head {
  display:flex; justify-content:space-between; align-items:flex-start;
  padding:24px 24px 20px; gap:16px;
  background:linear-gradient(135deg,#1a1a1a 0%,#000 100%); color:#fff;
}
.sd-head-info { flex:1; min-width:0; }
.sd-name { font-family:'Outfit',sans-serif; font-size:28px; font-weight:800; letter-spacing:-0.8px; line-height:1.1; color:#fff; }
.sd-evidence { display:inline-flex; align-items:center; gap:6px; background:rgba(232,255,71,0.12); border:1px solid rgba(232,255,71,0.25); border-radius:100px; padding:4px 12px; margin-top:10px; font-size:11px; font-weight:700; color:var(--accent); letter-spacing:0.5px; text-transform:uppercase; }
.sd-evidence-dot { width:6px; height:6px; background:var(--accent); border-radius:50%; }
.sd-close { background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.1); color:#888; width:34px; height:34px; border-radius:8px; cursor:pointer; font-size:16px; transition:all 0.2s; flex-shrink:0; }
.sd-close:hover { border-color:#fff; color:#fff; background:rgba(255,255,255,0.1); }
.sd-body { padding:20px 24px 24px; }
.sd-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:16px; }
.sd-block { background:#fff; border:1px solid var(--border); border-radius:12px; padding:14px 16px; transition:all 0.2s; }
.sd-block:hover { border-color:var(--black); transform:translateY(-1px); box-shadow:0 4px 12px rgba(0,0,0,0.04); }
.sd-block.full { grid-column:1/-1; }
.sd-lbl { font-size:10px; font-weight:800; letter-spacing:1.5px; text-transform:uppercase; color:var(--accent2); margin-bottom:6px; display:flex; align-items:center; gap:6px; }
.sd-lbl-ico { font-size:14px; }
.sd-val { font-size:14px; color:var(--black); line-height:1.6; font-weight:500; }
.sd-warn { font-size:12px; color:#c0392b; background:#fdf0ef; border:1px solid #f5c6c6; border-radius:10px; padding:12px 16px; margin-bottom:16px; }
.sd-stores-title { font-size:11px; font-weight:800; letter-spacing:2px; text-transform:uppercase; color:var(--muted); margin-bottom:12px; display:flex; align-items:center; gap:8px; }
.sd-stores-title::before { content:''; width:14px; height:2px; background:var(--accent2); }
.store-row { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.store-card2 { display:flex; flex-direction:column; align-items:center; gap:3px; background:var(--gray); border:2px solid var(--border); border-radius:10px; padding:12px 8px; text-decoration:none; transition:all 0.2s; position:relative; }
.store-card2:hover { border-color:var(--black); transform:translateY(-1px); }
.store-card2.best { border-color:var(--black); background:var(--black); }
.best-tag { position:absolute; top:-8px; left:50%; transform:translateX(-50%); background:var(--accent); color:var(--black); font-size:9px; font-weight:800; padding:2px 8px; border-radius:100px; white-space:nowrap; letter-spacing:1px; text-transform:uppercase; }
.sc2-name { font-size:11px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:1px; }
.store-card2.best .sc2-name { color:#888; }
.sc2-price { font-size:18px; font-weight:700; color:var(--black); font-family:'Outfit',sans-serif; }
.store-card2.best .sc2-price { color:var(--white); }
.sc2-cta { font-size:11px; color:var(--muted); }
.store-card2.best .sc2-cta { color:var(--accent); }

.supp-total { background:var(--black); color:var(--white); border-radius:14px; padding:20px 24px; display:flex; justify-content:space-between; align-items:center; margin-top:8px; }
.st-lbl { font-size:13px; color:#666; margin-bottom:4px; }
.st-amt { font-family:'Outfit',sans-serif; font-size:36px; font-weight:800; color:var(--accent); letter-spacing:-1px; }
.btn-buy { background:var(--accent); color:var(--black); border:none; padding:14px 28px; border-radius:100px; font-family:'Outfit',sans-serif; font-size:14px; font-weight:700; cursor:pointer; transition:all 0.2s; }
.btn-buy:hover { background:#d4eb30; }

/* ---- NUTRITION PLAN ---- */
.macro-hero {
  background:linear-gradient(135deg, #1a1a1a 0%, #0a0a0a 100%);
  border-radius:20px; padding:32px 24px; margin-bottom:32px;
  position:relative; overflow:hidden;
}
.macro-hero::before {
  content:''; position:absolute; top:-50%; right:-20%;
  width:300px; height:300px; border-radius:50%;
  background:radial-gradient(circle, rgba(232,255,71,0.12) 0%, transparent 70%);
  pointer-events:none;
}
.macro-hero-title { color:#fff; font-family:'Outfit',sans-serif; font-size:14px; font-weight:600; text-align:center; margin-bottom:24px; letter-spacing:1px; text-transform:uppercase; opacity:0.7; }
.macro-cards { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; position:relative; z-index:1; }
.macro-card { background:rgba(255,255,255,0.04); backdrop-filter:blur(10px); border:1px solid rgba(255,255,255,0.08); border-radius:16px; padding:20px 12px; text-align:center; transition:all 0.3s; }
.macro-card:hover { transform:translateY(-3px); border-color:rgba(255,255,255,0.2); background:rgba(255,255,255,0.08); }
.macro-donut { position:relative; width:80px; height:80px; margin:0 auto 12px; }
.macro-donut svg { transform:rotate(-90deg); width:100%; height:100%; }
.macro-donut-bg { fill:none; stroke:rgba(255,255,255,0.08); stroke-width:6; }
.macro-donut-fg { fill:none; stroke-width:6; stroke-linecap:round; transition:stroke-dashoffset 1.2s cubic-bezier(0.4, 0, 0.2, 1); }
.macro-donut-num { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.macro-num { font-family:'Outfit',sans-serif; font-size:22px; font-weight:800; color:#fff; letter-spacing:-0.5px; line-height:1; }
.macro-unit { font-size:10px; color:rgba(255,255,255,0.5); margin-top:2px; }
.macro-lbl { font-size:11px; font-weight:700; letter-spacing:1px; text-transform:uppercase; color:rgba(255,255,255,0.6); margin-top:6px; }
.macro-card.kcal .macro-donut-fg { stroke:var(--accent); }
.macro-card.kcal .macro-num { color:var(--accent); }
.macro-card.prot .macro-donut-fg { stroke:#4ade80; }
.macro-card.prot .macro-num { color:#4ade80; }
.macro-card.carb .macro-donut-fg { stroke:#60a5fa; }
.macro-card.carb .macro-num { color:#60a5fa; }
.macro-card.fat  .macro-donut-fg { stroke:#fb923c; }
.macro-card.fat  .macro-num { color:#fb923c; }
.macro-hero-formula { text-align:center; margin-top:18px; font-size:11px; color:rgba(255,255,255,0.5); letter-spacing:0.3px; position:relative; z-index:1; }
.macro-hero-formula strong { color:rgba(232,255,71,0.8); font-weight:700; }

.meal-plan { margin-bottom:32px; }
.meal-plan h4 { font-family:'Outfit',sans-serif; font-size:22px; font-weight:800; margin-bottom:20px; letter-spacing:-0.5px; }
.meal-card {
  background:var(--white); border:1px solid var(--border); border-radius:18px; padding:0;
  margin-bottom:14px; overflow:hidden; transition:all 0.3s; position:relative;
}
.meal-card:hover { transform:translateY(-2px); box-shadow:0 12px 32px rgba(0,0,0,0.08); border-color:transparent; }
.meal-banner {
  padding:18px 20px 16px; display:flex; align-items:center; gap:14px;
  position:relative; overflow:hidden;
}
.meal-banner::before {
  content:''; position:absolute; inset:0; opacity:0.15;
  pointer-events:none;
}
.meal-card.morning .meal-banner::before { background:linear-gradient(135deg,#fef3c7 0%,#fde68a 100%); }
.meal-card.morning .meal-banner { background:linear-gradient(135deg,#fff7ed 0%,#fef3c7 100%); }
.meal-card.snack   .meal-banner { background:linear-gradient(135deg,#fdf2f8 0%,#fce7f3 100%); }
.meal-card.lunch   .meal-banner { background:linear-gradient(135deg,#fef2f2 0%,#fee2e2 100%); }
.meal-card.pre     .meal-banner { background:linear-gradient(135deg,#fef3c7 0%,#fde68a 100%); }
.meal-card.during  .meal-banner { background:linear-gradient(135deg,#dbeafe 0%,#bfdbfe 100%); }
.meal-card.post    .meal-banner { background:linear-gradient(135deg,#dcfce7 0%,#bbf7d0 100%); }
.meal-card.dinner  .meal-banner { background:linear-gradient(135deg,#ede9fe 0%,#ddd6fe 100%); }
.meal-card.tea     .meal-banner { background:linear-gradient(135deg,#fef3c7 0%,#fed7aa 100%); }
.meal-icon {
  font-size:32px; width:52px; height:52px; border-radius:50%;
  background:rgba(255,255,255,0.9); display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 12px rgba(0,0,0,0.06); flex-shrink:0;
}
.meal-info { flex:1; min-width:0; }
.meal-time { font-family:'Outfit',sans-serif; font-size:16px; font-weight:800; color:var(--black); letter-spacing:-0.3px; line-height:1.2; }
.meal-time-sub { font-size:11px; color:#888; font-weight:600; margin-top:2px; letter-spacing:0.3px; text-transform:uppercase; }
.meal-kcal-badge {
  background:rgba(0,0,0,0.08); padding:6px 12px; border-radius:100px;
  font-size:13px; color:var(--black); font-weight:700; font-family:'Outfit',sans-serif;
  flex-shrink:0;
}
.meal-items { padding:14px 20px 20px; display:flex; flex-direction:column; gap:0; }
.meal-item { display:flex; justify-content:space-between; align-items:center; padding:10px 0; border-bottom:1px solid var(--gray); font-size:14px; }
.meal-item:last-child { border-bottom:none; }
.meal-item-name { color:var(--black); font-weight:500; }
.meal-item-macros {
  font-size:11px; color:var(--muted); background:var(--gray); padding:3px 10px; border-radius:100px;
  font-weight:600; white-space:nowrap; margin-left:12px;
}

.recipe-tip { background:#fff8f0; border:1px solid #ffe4cc; border-radius:12px; padding:16px 18px; margin-bottom:12px; font-size:14px; line-height:1.6; color:#555; }
.recipe-tip strong { color:var(--accent2); }

.nutr-affiliate { margin-top:32px; }
.nutr-affiliate h4 { font-family:'Outfit',sans-serif; font-size:16px; font-weight:800; margin-bottom:12px; letter-spacing:-0.3px; }
.app-cards { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.app-card { background:var(--white); border:1px solid var(--border); border-radius:12px; padding:16px 18px; text-decoration:none; display:block; transition:all 0.2s; cursor:pointer; }
.app-card:hover { border-color:var(--black); transform:translateY(-2px); box-shadow:0 6px 20px rgba(0,0,0,0.07); }
.app-card-name { font-family:'Outfit',sans-serif; font-size:15px; font-weight:700; color:var(--black); margin-bottom:3px; }
.app-card-desc { font-size:12px; color:var(--muted); }
.app-card-comm { font-size:11px; font-weight:700; color:var(--accent2); margin-top:6px; }

/* ---- FITNESS PLAN ---- */
.week-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:8px; margin-bottom:32px; }
.day-card { border-radius:14px; padding:14px 8px; text-align:center; border:1.5px solid var(--border); background:var(--white); cursor:pointer; transition:all 0.25s cubic-bezier(0.4,0,0.2,1); position:relative; overflow:hidden; }
.day-card:hover { border-color:var(--black); transform:translateY(-3px); box-shadow:0 8px 20px rgba(0,0,0,0.08); }
.day-card.active { border-color:var(--black); background:linear-gradient(135deg,#1a1a1a 0%,#000 100%); color:var(--white); transform:translateY(-3px); box-shadow:0 12px 28px rgba(0,0,0,0.2); }
.day-card.active .day-ico { transform:scale(1.15); }
.day-card.rest { background:var(--gray); }
.day-card.rest .day-type { color:var(--muted); }
.day-card.rest.active { background:linear-gradient(135deg,#444 0%,#222 100%); }
.day-name { font-family:'Outfit',sans-serif; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:1px; margin-bottom:8px; }
.day-ico { font-size:24px; margin-bottom:6px; transition:transform 0.25s; display:inline-block; }
.day-type { font-size:10px; font-weight:600; color:var(--muted); }
.day-card.active .day-type { color:var(--accent); }

.workout-card { background:var(--white); border:1px solid var(--border); border-radius:18px; overflow:hidden; margin-bottom:14px; transition:all 0.3s; }
.workout-card:hover { transform:translateY(-2px); box-shadow:0 12px 32px rgba(0,0,0,0.08); border-color:transparent; }
.wc-header { padding:16px 22px; background:linear-gradient(135deg,#1a1a1a 0%,#000 100%); display:flex; justify-content:space-between; align-items:center; gap:12px; }
.wc-name { font-family:'Outfit',sans-serif; font-size:16px; font-weight:800; color:var(--white); letter-spacing:-0.3px; flex:1; }
.wc-sets { font-size:12px; color:var(--accent); background:rgba(232,255,71,0.12); padding:5px 12px; border-radius:20px; font-weight:700; flex-shrink:0; border:1px solid rgba(232,255,71,0.2); }
.wc-layout { display:grid; grid-template-columns:200px 1fr; gap:0; align-items:start; }
.wc-gif-wrap { background:#fff; display:flex; align-items:center; justify-content:center; width:200px; height:200px; position:relative; overflow:hidden; flex-shrink:0; }
.wc-gif { width:200px; height:200px; object-fit:contain; display:block; }
.wc-gif-placeholder { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; color:var(--muted); font-size:13px; width:200px; height:200px; padding:20px; text-align:center; background:#fff; }
.wc-gif-placeholder span { font-size:32px; }
.wc-gif-loading { position:absolute; inset:0; background:var(--gray); display:flex; align-items:center; justify-content:center; }
.wc-gif-spinner { width:28px; height:28px; border:2px solid #ddd; border-top-color:var(--black); border-radius:50%; animation:spin 0.7s linear infinite; }
.wc-body { padding:18px 20px; }
.wc-desc { font-size:14px; color:#444; line-height:1.6; margin-bottom:14px; }
.wc-steps { margin-bottom:14px; }
.wc-step { font-size:13px; color:#555; line-height:1.5; padding:6px 0; border-bottom:1px solid var(--gray); display:flex; gap:10px; }
.wc-step:last-child { border-bottom:none; }
.wc-step-num { font-family:'Outfit',sans-serif; font-weight:800; color:var(--black); font-size:13px; flex-shrink:0; width:20px; }
.wc-meta { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px; }
.wc-tag { background:var(--gray); border-radius:6px; padding:5px 10px; font-size:11px; font-weight:600; color:var(--muted); }
.wc-tag.muscle { background:#f0f8f0; color:#2d6a2d; }
.wc-actions { display:flex; gap:8px; flex-wrap:wrap; }
.wc-yt { display:inline-flex; align-items:center; gap:6px; background:#ff0000; color:var(--white); border:none; padding:8px 14px; border-radius:8px; font-family:'Epilogue',sans-serif; font-size:12px; font-weight:700; cursor:pointer; text-decoration:none; transition:opacity 0.2s; }
.wc-yt:hover { opacity:0.85; }
@media(max-width:600px){ .wc-layout { grid-template-columns:1fr; } .wc-gif { height:220px; width:100%; } }

.equip-recs { margin-top:32px; }
.equip-recs h4 { font-family:'Outfit',sans-serif; font-size:16px; font-weight:800; margin-bottom:12px; letter-spacing:-0.3px; }
.equip-grid { display:flex; flex-direction:column; gap:8px; }

/* AFFILIATE CARDS — contextual */
.aff-card {
  display:flex; align-items:center; gap:14px;
  background:var(--white); border:1.5px solid var(--border); border-radius:12px;
  padding:14px 16px; cursor:pointer; transition:all 0.2s; text-decoration:none;
}
.aff-card:hover { border-color:var(--black); transform:translateY(-1px); box-shadow:0 6px 20px rgba(0,0,0,0.07); }
.aff-ico { font-size:28px; flex-shrink:0; }
.aff-info { flex:1; min-width:0; }
.aff-name { font-family:'Outfit',sans-serif; font-size:14px; font-weight:700; color:var(--black); margin-bottom:2px; }
.aff-why { font-size:12px; color:var(--muted); line-height:1.4; }
.aff-right { flex-shrink:0; text-align:right; }
.aff-price { font-family:'Outfit',sans-serif; font-size:14px; font-weight:700; color:var(--black); }
.aff-tag { font-size:11px; font-weight:700; color:var(--accent2); margin-top:2px; }

.aff-strip { display:flex; flex-direction:column; gap:8px; margin:12px 0; }
.aff-strip--inline { margin:8px 0 16px; }
.aff-section-title { font-family:'Outfit',sans-serif; font-size:14px; font-weight:800; color:var(--black); margin:24px 0 10px; }

/* Nutrition tip box */
.nutr-tip { display:flex; align-items:flex-start; gap:10px; background:#fffbf0; border:1px solid #ffe4a0; border-radius:10px; padding:12px 14px; margin-bottom:12px; font-size:13px; color:#555; line-height:1.5; }
.nutr-tip-ico { font-size:18px; flex-shrink:0; }

/* Workout affiliate inline */
.wc-aff { margin-top:12px; padding-top:12px; border-top:1px solid var(--gray); display:flex; flex-direction:column; gap:8px; }
.aff-card--equip { border-color:var(--accent2); background:#fffaf8; flex-wrap:wrap; }
.aff-card--equip:hover { border-color:var(--accent2); box-shadow:0 6px 20px rgba(255,107,53,0.12); }
.aff-eq-stats { margin-top:5px; min-width:0; }
.aff-eq-count { display:block; font-size:11px; font-weight:800; color:var(--accent2); }
.aff-eq-exs { display:block; font-size:10px; color:var(--muted); margin-top:1px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:220px; }
.btn-equip-buy { display:block; margin-top:6px; background:var(--accent2); color:#fff; border:none; padding:6px 10px; border-radius:999px; font-family:'Outfit',sans-serif; font-size:11px; font-weight:700; cursor:pointer; text-decoration:none; text-align:center; white-space:nowrap; transition:opacity 0.2s; }
.btn-equip-buy:hover { opacity:0.85; }
.wc-aff .aff-right { flex-shrink:0; min-width:80px; }

/* Shopping list */
.shop-wrap { background:var(--white); border:1.5px solid var(--border); border-radius:18px; padding:24px; margin:28px 0; }
.shop-header { margin-bottom:18px; }
.shop-title { font-family:'Outfit',sans-serif; font-size:20px; font-weight:800; letter-spacing:-0.4px; }
.shop-sub { font-size:12px; color:var(--muted); margin-top:4px; }

.shop-diet-row { display:flex; gap:8px; align-items:center; flex-wrap:wrap; padding:14px; background:var(--gray); border-radius:12px; margin-bottom:20px; }
.shop-diet-lbl { font-size:11px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:1px; }
.shop-diet-btn { background:#fff; border:1px solid var(--border); padding:6px 14px; border-radius:100px; font-family:'Outfit',sans-serif; font-size:12px; font-weight:700; color:var(--muted); cursor:pointer; transition:all 0.2s; }
.shop-diet-btn:hover { border-color:var(--black); color:var(--black); }
.shop-diet-btn.active { background:var(--black); color:var(--accent); border-color:var(--black); }

.shop-cats { display:flex; flex-direction:column; gap:20px; }
.shop-section { background:#fafaf7; border-radius:12px; padding:14px 16px; }
.shop-cat-title { font-family:'Outfit',sans-serif; font-size:13px; font-weight:800; color:var(--black); letter-spacing:0.3px; margin-bottom:10px; display:flex; align-items:center; gap:8px; }
.shop-section-ico { font-size:18px; }
.shop-items { display:flex; flex-direction:column; gap:0; }
.shop-item {
  display:flex; align-items:center; gap:10px;
  padding:10px 4px; cursor:pointer; transition:all 0.15s;
  border-bottom:1px solid #ececea; user-select:none;
}
.shop-item:last-child { border-bottom:none; }
.shop-item:hover { background:rgba(0,0,0,0.02); }
.shop-check {
  width:18px; height:18px; border-radius:5px; border:2px solid var(--border);
  background:#fff; flex-shrink:0; display:flex; align-items:center; justify-content:center;
  transition:all 0.15s; position:relative;
}
.shop-check::after { content:''; opacity:0; }
.shop-item.checked .shop-check { background:#22c55e; border-color:#22c55e; }
.shop-item.checked .shop-check::after { content:'✓'; color:#fff; font-size:11px; font-weight:800; opacity:1; line-height:1; }
.shop-item.checked .shop-item-name { text-decoration:line-through; color:var(--muted); }
.shop-item.checked .shop-item-qty { opacity:0.5; }
.shop-item-name { flex:1; font-size:14px; color:var(--text); }
.shop-item-qty { color:var(--accent2); font-size:12px; font-weight:700; font-family:'Outfit',sans-serif; white-space:nowrap; }

.shop-aff-section { margin-top:20px; padding-top:18px; border-top:1px solid var(--gray); }
.shop-aff-grid { display:flex; flex-direction:column; gap:8px; margin-top:10px; }

.shop-actions-bar { display:flex; gap:8px; flex-wrap:wrap; margin-top:20px; }
.btn-copy { background:var(--black); color:var(--white); border:none; padding:11px 18px; border-radius:999px; font-family:'Outfit',sans-serif; font-size:13px; font-weight:700; cursor:pointer; transition:all 0.2s; flex:1; min-width:120px; }
.btn-copy:hover { background:#333; }
.btn-copy.copied { background:#22c55e; }
.btn-whatsapp-shop { background:#25d366; color:#fff; border:none; padding:11px 18px; border-radius:999px; font-family:'Outfit',sans-serif; font-size:13px; font-weight:700; cursor:pointer; display:inline-flex; align-items:center; gap:6px; justify-content:center; flex:1; min-width:120px; transition:all 0.2s; }
.btn-whatsapp-shop:hover { background:#1ebe5d; }

.shop-note { margin-top:18px; font-size:12px; color:var(--muted); line-height:1.5; padding-top:16px; border-top:1px solid var(--gray); }

/* Testimonials */
.testimonials { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:40px; }
.testi { background:rgba(255,255,255,0.07); border:1px solid rgba(255,255,255,0.12); border-radius:12px; padding:16px; text-align:left; }
.testi-text { font-size:13px; color:#ccc; line-height:1.6; margin-bottom:10px; }
.testi-author { font-size:12px; color:var(--accent); font-weight:700; }

/* Social proof bar */
.social-proof { display:flex; align-items:center; gap:10px; justify-content:center; margin:20px 0; font-size:13px; color:#aaa; }
.social-proof-dot { width:8px; height:8px; border-radius:50%; background:var(--accent); display:inline-block; animation:pulse 2s infinite; }
@keyframes pulse { 0%,100%{opacity:1}50%{opacity:.4} }

/* Sexo inline en Q5 */
.sexo-row { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:20px; }
.sexo-btn { background:var(--white); border:1.5px solid var(--border); border-radius:12px; padding:14px; font-size:15px; cursor:pointer; transition:all 0.2s; font-family:'Epilogue',sans-serif; }
.sexo-btn.sel { border-color:var(--black); background:var(--black); color:var(--white); }
.sexo-btn:hover:not(.sel) { border-color:#999; }
.sexo-label { font-size:12px; color:var(--muted); text-transform:uppercase; letter-spacing:.5px; font-weight:700; margin-top:20px; margin-bottom:6px; }

/* WhatsApp share */
.btn-whatsapp { display:inline-flex; align-items:center; gap:8px; background:#25d366; color:#fff; border:none; padding:12px 20px; border-radius:999px; font-family:'Outfit',sans-serif; font-size:14px; font-weight:700; cursor:pointer; transition:all 0.2s; text-decoration:none; }
.btn-whatsapp:hover { background:#1ebe5d; transform:scale(1.03); }
.btn-whatsapp-icon { display:inline-flex; align-items:center; justify-content:center; width:42px; height:42px; background:#25d366; color:#fff; border:none; border-radius:50%; cursor:pointer; transition:all 0.2s; flex-shrink:0; }
.btn-whatsapp-icon:hover { background:#1ebe5d; transform:scale(1.05); }
.results-actions { display:flex; gap:12px; justify-content:center; align-items:center; flex-wrap:wrap; margin-top:20px; }
#hero-push { display:flex; flex-direction:column; align-items:center; gap:4px; }

/* HERO PUSH CTA */
.btn-hero-push {
  display:inline-flex; align-items:center; gap:9px;
  background:var(--accent); color:var(--black); border:none;
  padding:12px 22px; border-radius:999px;
  font-family:'Outfit',sans-serif; font-size:14px; font-weight:800; letter-spacing:-0.2px;
  cursor:pointer; transition:all 0.2s;
  box-shadow:0 4px 18px rgba(232,255,71,0.25);
}
.btn-hero-push:hover { transform:translateY(-1px); box-shadow:0 6px 22px rgba(232,255,71,0.4); }
.btn-hero-push.enabled {
  background:rgba(232,255,71,0.12); color:var(--accent);
  border:1px solid rgba(232,255,71,0.35); box-shadow:none;
}
.btn-hero-push.enabled:hover { background:rgba(232,255,71,0.18); }
.bhp-ico { font-size:16px; }
.bhp-dot { width:7px; height:7px; border-radius:50%; background:#22c55e; box-shadow:0 0 0 0 rgba(34,197,94,0.6); animation:bhp-pulse 2s infinite; margin-left:2px; }
@keyframes bhp-pulse { 0%{box-shadow:0 0 0 0 rgba(34,197,94,0.6)} 70%{box-shadow:0 0 0 8px rgba(34,197,94,0)} 100%{box-shadow:0 0 0 0 rgba(34,197,94,0)} }
.bhp-sub { font-size:11px; color:#888; }

/* Restore plan banner */
.restore-banner { background:#fffbf0; border-bottom:1px solid #ffe4a0; padding:14px 24px; display:flex; justify-content:center; align-items:center; gap:16px; width:100%; font-size:14px; position:sticky; top:0; z-index:190; }
.restore-banner strong { font-family:'Outfit',sans-serif; }
.btn-restore { background:var(--black); color:var(--white); border:none; padding:8px 16px; border-radius:999px; font-size:13px; font-weight:700; cursor:pointer; font-family:'Outfit',sans-serif; }

/* Email modal */
.email-modal { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.6); z-index:1000; align-items:center; justify-content:center; padding:20px; }
.email-modal.open { display:flex; }
.email-modal-inner { background:var(--white); border-radius:20px; padding:36px; max-width:420px; width:100%; text-align:center; position:relative; }
.email-modal-close { position:absolute; top:14px; right:18px; background:none; border:none; font-size:22px; cursor:pointer; color:var(--muted); line-height:1; }
.email-modal h3 { font-family:'Outfit',sans-serif; font-size:22px; font-weight:800; margin:12px 0 8px; }
.email-modal p { color:var(--muted); font-size:14px; line-height:1.6; margin-bottom:20px; }
.email-form { display:flex; flex-direction:column; gap:10px; }
.email-input { border:1.5px solid var(--border); border-radius:10px; padding:12px 16px; font-size:15px; font-family:'Epilogue',sans-serif; outline:none; }
.email-input:focus { border-color:var(--black); }
.btn-email-submit { background:var(--black); color:var(--accent); border:none; padding:14px; border-radius:10px; font-family:'Outfit',sans-serif; font-size:15px; font-weight:700; cursor:pointer; }
.btn-email-submit:hover { background:#222; }
.email-skip { margin-top:10px; font-size:12px; color:var(--muted); cursor:pointer; text-decoration:underline; }

/* WHAT YOU GET */
.what-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.what-card { background:#fff; border:1px solid var(--border); border-radius:20px; padding:32px 26px; transition:all 0.3s; position:relative; overflow:hidden; }
.what-card::before { content:''; position:absolute; left:0; top:0; right:0; height:4px; background:linear-gradient(90deg,var(--accent2),var(--accent)); }
.what-card:hover { transform:translateY(-4px); box-shadow:0 20px 40px rgba(0,0,0,0.08); border-color:transparent; }
.what-card.supps::before { background:linear-gradient(90deg,#f59e0b,#dc2626); }
.what-card.nutr::before  { background:linear-gradient(90deg,#4ade80,#16a34a); }
.what-card.fit::before   { background:linear-gradient(90deg,#60a5fa,#7c3aed); }
.what-ico { font-size:44px; margin-bottom:20px; }
.what-card h3 { font-family:'Outfit',sans-serif; font-size:22px; font-weight:800; margin-bottom:10px; letter-spacing:-0.5px; line-height:1.1; }
.what-card p { color:#666; font-size:14px; line-height:1.6; margin-bottom:18px; }
.what-card ul { list-style:none; padding:0; }
.what-card ul li { font-size:13px; color:var(--black); padding:8px 0; padding-left:22px; position:relative; border-top:1px solid var(--gray); }
.what-card ul li:first-child { border-top:none; }
.what-card ul li::before { content:'✓'; position:absolute; left:0; color:var(--accent2); font-weight:800; }

/* HOW IT WORKS */
.how-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; position:relative; }
.how-step { text-align:center; position:relative; padding:0 12px; }
.how-num {
  width:46px; height:46px; border-radius:50%;
  background:var(--black); color:var(--accent);
  font-family:'Outfit',sans-serif; font-size:18px; font-weight:800;
  display:flex; align-items:center; justify-content:center;
  margin:0 auto 18px;
}
.how-ico { font-size:48px; margin-bottom:12px; }
.how-step h4 { font-family:'Outfit',sans-serif; font-size:18px; font-weight:800; margin-bottom:8px; letter-spacing:-0.3px; }
.how-step p { font-size:14px; color:#666; line-height:1.6; }

@media(max-width:760px){
  .what-grid { grid-template-columns:1fr; gap:14px; }
  .how-steps { grid-template-columns:1fr; gap:36px; }
}

/* FAQ */
.faq-item { border-bottom:1px solid var(--border); padding:20px 0; cursor:pointer; }
.faq-item:first-child { border-top:1px solid var(--border); }
.faq-q { display:flex; justify-content:space-between; align-items:center; gap:16px; font-family:'Outfit',sans-serif; font-size:17px; font-weight:700; color:var(--black); }
.faq-icon { font-size:20px; color:var(--muted); transition:transform 0.2s; flex-shrink:0; }
.faq-item.open .faq-icon { transform:rotate(45deg); color:var(--black); }
.faq-a { display:none; font-size:14px; color:#555; line-height:1.7; padding-top:14px; }
.faq-item.open .faq-a { display:block; }

/* RECIPE MODAL */
.recipe-modal { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.7); z-index:1100; padding:20px; overflow-y:auto; }
.recipe-modal.open { display:flex; align-items:flex-start; justify-content:center; animation:fadeUp 0.25s ease; }
.recipe-modal-inner { background:#fff; border-radius:24px; max-width:680px; width:100%; overflow:hidden; margin:auto; box-shadow:0 24px 60px rgba(0,0,0,0.4); }
.recipe-img-wrap { position:relative; width:100%; height:200px; background:linear-gradient(135deg,#f7f5f0,#e5e2dc); overflow:hidden; flex-shrink:0; }
.recipe-img-wrap img { width:100%; height:100%; object-fit:cover; display:block; }
.recipe-img-fallback { width:100%; height:100%; display:flex; align-items:center; justify-content:center; font-size:80px; }
.recipe-close { position:absolute; top:12px; right:12px; background:rgba(0,0,0,0.7); color:#fff; border:none; width:34px; height:34px; border-radius:50%; font-size:16px; cursor:pointer; backdrop-filter:blur(8px); transition:all 0.2s; z-index:2; }
.recipe-close:hover { background:#000; transform:scale(1.05); }
.recipe-body { padding:22px 26px 28px; }
.recipe-meta { display:flex; gap:12px; flex-wrap:wrap; margin-bottom:14px; }
.recipe-meta-tag { display:inline-flex; align-items:center; gap:5px; background:var(--gray); padding:5px 11px; border-radius:100px; font-size:12px; font-weight:600; color:var(--black); }
.recipe-meta-tag.kcal { background:rgba(255,107,53,0.1); color:var(--accent2); }
.recipe-name { font-family:'Outfit',sans-serif; font-size:28px; font-weight:800; letter-spacing:-0.8px; line-height:1.1; margin-bottom:18px; }
.recipe-macros { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-bottom:22px; padding:14px; background:var(--gray); border-radius:12px; }
.recipe-macro { text-align:center; }
.recipe-macro-num { font-family:'Outfit',sans-serif; font-size:18px; font-weight:800; color:var(--black); }
.recipe-macro-lbl { font-size:10px; color:var(--muted); text-transform:uppercase; letter-spacing:0.5px; font-weight:600; margin-top:2px; }
.recipe-section-title { font-family:'Outfit',sans-serif; font-size:14px; font-weight:800; text-transform:uppercase; letter-spacing:1px; color:var(--accent2); margin:18px 0 10px; }
.recipe-ingredients { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:8px; }
.recipe-ingredient { display:flex; justify-content:space-between; align-items:baseline; padding:10px 14px; background:var(--gray); border-radius:10px; font-size:13px; }
.recipe-ingredient-qty { color:var(--accent2); font-weight:700; font-family:'Outfit',sans-serif; font-size:12px; }
.recipe-steps { display:flex; flex-direction:column; gap:10px; counter-reset:step; }
.recipe-step { display:flex; gap:12px; align-items:flex-start; }
.recipe-step::before { counter-increment:step; content:counter(step); flex-shrink:0; width:24px; height:24px; background:var(--black); color:var(--accent); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:800; font-family:'Outfit',sans-serif; }
.recipe-step-text { font-size:14px; color:#444; line-height:1.6; padding-top:1px; }
.meal-card { cursor:pointer; }
.meal-card-recipes-btn { display:inline-flex; align-items:center; gap:6px; font-size:11px; font-weight:700; color:var(--accent2); margin-top:10px; }

@media(max-width:600px){
  .recipe-modal { padding:0; }
  .recipe-modal-inner { border-radius:0; min-height:100vh; }
  .recipe-ingredients { grid-template-columns:1fr; }
  .recipe-img-wrap { height:160px; }
  .recipe-body { padding:18px 20px 24px; }
  .recipe-name { font-size:22px; }
}

/* Tab hint */
.tab-hint { display:none; text-align:center; font-size:12px; color:var(--muted); padding:8px; background:var(--black); letter-spacing:0.3px; animation:fadeIn 0.5s 1.5s both; }
@keyframes fadeIn { from{opacity:0} to{opacity:1} }
@media(max-width:700px){ .tab-hint { display:block; } }

/* WHY THIS PLAN */
.why-section { margin-top:32px; background:#fff; border:1px solid var(--border); border-radius:18px; padding:28px; }
.why-section h4 { font-family:'Outfit',sans-serif; font-size:20px; font-weight:800; margin-bottom:16px; letter-spacing:-0.5px; display:flex; align-items:center; gap:10px; }
.why-section h4::before { content:'🧬'; }
.why-list { display:flex; flex-direction:column; gap:14px; }
.why-item { display:flex; gap:12px; align-items:flex-start; }
.why-item-num { font-family:'Outfit',sans-serif; flex-shrink:0; width:28px; height:28px; background:var(--accent); color:var(--black); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:800; }
.why-item-text { font-size:14px; color:#444; line-height:1.6; flex:1; min-width:0; }
.why-item-text strong { color:var(--black); font-weight:700; }
.why-source { margin-top:18px; padding-top:14px; border-top:1px solid var(--gray); font-size:12px; color:var(--muted); }

/* WHY V2 — dynamic plan-aware reasons */
.why-intro { font-size:13px; color:var(--muted); margin:-6px 0 18px; padding:10px 14px; background:var(--gray); border-radius:10px; }
.why-intro strong { color:var(--black); font-weight:700; }
.why-section-title { font-family:'Outfit',sans-serif; font-size:13px; font-weight:800; text-transform:uppercase; letter-spacing:0.5px; color:var(--muted); margin:22px 0 10px; }
.why-section-title:first-child { margin-top:0; }
.why-context { font-size:14px; color:#333; line-height:1.65; padding:14px 16px; background:linear-gradient(135deg,#f7fff0,#fff); border:1px solid var(--border); border-left:3px solid var(--accent); border-radius:10px; }
.why-item-ico { flex-shrink:0; width:36px; height:36px; display:flex; align-items:center; justify-content:center; font-size:20px; background:var(--gray); border-radius:10px; }
.why-item.demographic .why-item-ico { background:linear-gradient(135deg,#fff4d9,#ffe9a8); }
.why-item-title { font-family:'Outfit',sans-serif; font-size:15px; font-weight:800; color:var(--black); margin-bottom:4px; letter-spacing:-0.2px; }
.why-item-desc { font-size:13px; color:#555; line-height:1.55; margin-bottom:6px; }
.why-item-meta { font-size:12px; color:var(--muted); display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.why-pill { display:inline-block; padding:2px 8px; border-radius:100px; font-family:'Outfit',sans-serif; font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:0.4px; }
.why-pill.essential { background:var(--black); color:var(--accent); }
.why-pill.recommended { background:#fff4d9; color:#8a6800; }
.why-meta-text { font-weight:600; color:#333; }

/* ADAPTATION BANNER */
.adapt-banner { display:none; align-items:center; gap:14px; background:linear-gradient(135deg,#1a1a1a,#000); color:#fff; padding:14px 20px; border-radius:14px; margin:0 24px 16px; max-width:900px; margin:16px auto; position:relative; }
.adapt-banner.show { display:flex; }
.adapt-banner-text { flex:1; font-size:14px; color:#ccc; }
.adapt-banner-text strong { color:var(--accent); }
.adapt-banner-cta { background:var(--accent); color:#000; border:none; padding:9px 18px; border-radius:100px; font-family:'Outfit',sans-serif; font-size:13px; font-weight:800; cursor:pointer; transition:all 0.2s; }
.adapt-banner-cta:hover { background:#d4eb30; transform:scale(1.03); }
.adapt-banner-close { background:none; border:none; color:#666; cursor:pointer; padding:4px 8px; font-size:14px; }
.adapt-banner-close:hover { color:#fff; }

.adapt-modal { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.7); z-index:1300; padding:20px; overflow-y:auto; }
.adapt-modal.open { display:flex; align-items:flex-start; justify-content:center; }
.adapt-modal-inner { background:#fff; border-radius:20px; max-width:560px; width:100%; padding:32px; margin:auto; }
.adapt-section-title { font-family:'Outfit',sans-serif; font-size:11px; font-weight:800; letter-spacing:1.5px; text-transform:uppercase; color:var(--accent2); margin-bottom:10px; }
.adapt-insights { display:flex; flex-direction:column; gap:8px; }
.adapt-insight { display:flex; justify-content:space-between; padding:10px 14px; background:var(--gray); border-radius:10px; font-size:13px; }
.adapt-insight-lbl { color:var(--muted); }
.adapt-insight-val { font-family:'Outfit',sans-serif; font-weight:800; color:var(--black); }
.adapt-recs { display:flex; flex-direction:column; gap:10px; }
.adapt-rec { padding:14px 16px; background:linear-gradient(135deg,#fffbf0,#fff5d4); border:1px solid #ffe4a0; border-radius:12px; }
.adapt-rec-title { font-family:'Outfit',sans-serif; font-weight:800; font-size:14px; margin-bottom:4px; }
.adapt-rec-reason { font-size:13px; color:#666; line-height:1.5; }
.adapt-actions { display:flex; gap:8px; margin-top:24px; }
.adapt-btn { flex:1; padding:12px 18px; border-radius:100px; font-family:'Outfit',sans-serif; font-size:14px; font-weight:800; cursor:pointer; border:none; transition:all 0.2s; }
.adapt-btn-skip { background:#fff; border:1.5px solid var(--border); color:var(--muted); }
.adapt-btn-skip:hover { border-color:var(--black); color:var(--black); }
.adapt-btn-apply { background:var(--black); color:var(--accent); }
.adapt-btn-apply:hover { background:#222; }

/* PREFERENCES Q7 */
.pref-section { margin-top:24px; }
.pref-section-title { font-family:'Outfit',sans-serif; font-size:13px; font-weight:800; color:var(--black); margin-bottom:10px; letter-spacing:-0.2px; }
.pref-pills { display:flex; flex-wrap:wrap; gap:8px; }
.pref-pill {
  background:#fff; border:1.5px solid var(--border);
  padding:10px 14px; border-radius:100px;
  font-family:'Epilogue',sans-serif; font-size:13px; font-weight:600; color:var(--black);
  cursor:pointer; transition:all 0.15s;
}
.pref-pill:hover { border-color:var(--black); transform:translateY(-1px); }
.pref-pill.sel { background:var(--black); color:var(--accent); border-color:var(--black); }

/* MEAL LOG (food diary) */
.meal-log-summary { background:linear-gradient(135deg,#fff7ed 0%,#ffe4c4 100%); border-radius:14px; padding:16px 20px; margin-bottom:20px; display:flex; align-items:center; gap:14px; }
.meal-log-icon { width:48px; height:48px; border-radius:50%; background:#fff; display:flex; align-items:center; justify-content:center; font-size:24px; flex-shrink:0; }
.meal-log-info { flex:1; }
.meal-log-stat { font-family:'Outfit',sans-serif; font-size:18px; font-weight:800; color:var(--black); letter-spacing:-0.4px; }
.meal-log-progress { font-size:12px; color:#9a3412; font-weight:600; margin-top:2px; }
.meal-log-streak { background:rgba(0,0,0,0.06); padding:6px 12px; border-radius:100px; font-family:'Outfit',sans-serif; font-size:12px; font-weight:800; color:var(--black); }
.meal-log-streak-flame { color:#f97316; margin-right:2px; }

.meal-eaten-btn {
  display:inline-flex; align-items:center; gap:6px;
  background:transparent; border:1.5px solid var(--border);
  padding:6px 12px; border-radius:100px;
  font-family:'Outfit',sans-serif; font-size:11px; font-weight:700; color:var(--muted);
  cursor:pointer; transition:all 0.15s; margin-top:10px;
}
.meal-eaten-btn:hover { border-color:var(--black); color:var(--black); }
.meal-eaten-btn.eaten { background:#22c55e; border-color:#22c55e; color:#fff; }
.meal-eaten-btn.eaten::before { content:'✓ '; }

/* PROGRESS TAB */
.prog-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:28px; }
.prog-stat { background:#fff; border:1px solid var(--border); border-radius:14px; padding:16px; text-align:center; transition:all 0.2s; }
.prog-stat:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(0,0,0,0.06); border-color:transparent; }
.prog-stat-label { font-size:10px; color:var(--muted); text-transform:uppercase; letter-spacing:1px; font-weight:700; margin-bottom:6px; }
.prog-stat-value { font-family:'Outfit',sans-serif; font-size:28px; font-weight:800; color:var(--black); letter-spacing:-0.8px; line-height:1; }
.prog-stat-delta { font-size:12px; margin-top:4px; font-weight:700; }
.prog-stat-delta.up { color:#22c55e; }
.prog-stat-delta.down { color:#22c55e; }
.prog-stat-delta.bad-up { color:#ef4444; }
.prog-stat-empty { color:var(--muted); font-size:14px; font-weight:500; padding-top:6px; }

.prog-add { background:#fff; border:1px solid var(--border); border-radius:18px; padding:24px; margin-bottom:28px; }
.prog-add-title { font-family:'Outfit',sans-serif; font-size:16px; font-weight:800; margin-bottom:16px; }
.prog-form { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:16px; }
.prog-field label { display:block; font-size:11px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:0.5px; margin-bottom:6px; }
.prog-field input { width:100%; padding:10px 14px; border:1.5px solid var(--border); border-radius:10px; font-family:'Outfit',sans-serif; font-size:18px; font-weight:700; color:var(--black); outline:none; transition:border-color 0.2s; }
.prog-field input:focus { border-color:var(--black); }
.prog-save { background:var(--black); color:var(--accent); border:none; padding:13px 24px; border-radius:100px; font-family:'Outfit',sans-serif; font-size:14px; font-weight:800; cursor:pointer; transition:all 0.2s; }
.prog-save:hover { background:#222; transform:translateY(-1px); }
.prog-save.saved { background:#22c55e; color:#fff; }

.prog-chart { background:#fff; border:1px solid var(--border); border-radius:18px; padding:24px; margin-bottom:18px; }
.prog-chart-head { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:18px; }
.prog-chart-title { font-family:'Outfit',sans-serif; font-size:16px; font-weight:800; }
.prog-chart-range { font-size:11px; color:var(--muted); }
.prog-chart svg { width:100%; height:auto; }
.prog-chart-line { fill:none; stroke:var(--accent2); stroke-width:2.5; stroke-linejoin:round; stroke-linecap:round; }
.prog-chart-area { fill:url(#prog-grad); opacity:0.2; }
.prog-chart-dot { fill:var(--accent2); }
.prog-chart-axis { stroke:var(--gray2); stroke-width:1; }
.prog-chart-label { font-size:10px; fill:var(--muted); font-family:'Outfit',sans-serif; }
.prog-chart-empty { text-align:center; padding:40px 20px; color:var(--muted); font-size:14px; }

/* PUSH PREFS */
.push-prefs { background:linear-gradient(135deg,#1a1a1a,#000); color:#fff; border-radius:16px; padding:24px; margin-top:28px; }
.push-prefs-title { font-family:'Outfit',sans-serif; font-size:16px; font-weight:800; letter-spacing:-0.3px; margin-bottom:6px; color:#fff; display:flex; align-items:center; gap:8px; }
.push-prefs-sub { font-size:13px; color:#888; margin-bottom:18px; line-height:1.5; }
.push-toggle-btn { background:var(--accent); color:#000; border:none; padding:11px 22px; border-radius:100px; font-family:'Outfit',sans-serif; font-size:13px; font-weight:800; cursor:pointer; transition:all 0.2s; }
.push-toggle-btn:hover { background:#d4eb30; transform:scale(1.03); }
.push-toggle-btn.enabled { background:rgba(34,197,94,0.15); color:#4ade80; border:1px solid rgba(34,197,94,0.3); }
.push-status { font-size:12px; color:#aaa; margin-top:10px; display:flex; align-items:center; gap:6px; }
.push-status-dot { width:8px; height:8px; border-radius:50%; background:#666; }
.push-status-dot.on { background:#22c55e; box-shadow:0 0 8px rgba(34,197,94,0.5); }

/* PROGRESS TOOLS (afiliados sutiles) */
.prog-tools-section { margin-top:28px; padding-top:24px; border-top:1px solid var(--gray2); }
.prog-tools-title { font-family:'Outfit',sans-serif; font-size:16px; font-weight:800; letter-spacing:-0.3px; margin-bottom:6px; }
.prog-tools-sub { font-size:13px; color:var(--muted); margin-bottom:16px; }
.prog-tools-grid { display:flex; flex-direction:column; gap:8px; }

/* PHOTOS */
.prog-photos-row { display:flex; gap:10px; margin-bottom:8px; flex-wrap:wrap; }
.prog-photo-btn { flex:1; min-width:140px; cursor:pointer; padding:14px; border:2px dashed var(--border); border-radius:12px; text-align:center; font-family:'Outfit',sans-serif; font-size:13px; font-weight:700; color:var(--muted); background:#fafaf7; transition:all 0.2s; display:inline-flex; align-items:center; justify-content:center; gap:8px; }
.prog-photo-btn:hover { border-color:var(--black); color:var(--black); background:#fff; }
.prog-photo-btn.has-photo { border-color:#22c55e; background:#f0fdf4; color:#15803d; border-style:solid; }
.prog-photo-hint { font-size:11px; color:var(--muted); margin-bottom:14px; padding:0 4px; }

.prog-photo-thumbs { display:flex; gap:6px; margin-top:6px; }
.prog-photo-thumb { width:50px; height:50px; border-radius:8px; object-fit:cover; cursor:pointer; border:2px solid var(--border); transition:all 0.15s; }
.prog-photo-thumb:hover { border-color:var(--black); transform:scale(1.05); }

.prog-compare-cta { background:var(--black); color:var(--accent); border:none; padding:14px 20px; border-radius:12px; font-family:'Outfit',sans-serif; font-size:14px; font-weight:800; cursor:pointer; width:100%; margin-bottom:24px; display:inline-flex; align-items:center; justify-content:center; gap:8px; transition:all 0.2s; }
.prog-compare-cta:hover { background:#222; }

/* LIGHTBOX */
.photo-lightbox { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.92); z-index:1200; padding:20px; overflow-y:auto; }
.photo-lightbox.open { display:flex; align-items:center; justify-content:center; }
.photo-lightbox-inner { max-width:1200px; width:100%; position:relative; }
.photo-lightbox img { max-width:100%; max-height:85vh; display:block; margin:0 auto; border-radius:12px; }
.photo-lightbox-close { position:absolute; top:0; right:0; background:rgba(255,255,255,0.1); color:#fff; border:none; width:40px; height:40px; border-radius:50%; font-size:18px; cursor:pointer; }
.photo-lightbox-meta { color:#fff; text-align:center; margin-top:14px; font-family:'Outfit',sans-serif; font-size:14px; }

/* COMPARE */
.photo-compare { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.photo-compare-side { text-align:center; }
.photo-compare-side img { width:100%; max-height:70vh; object-fit:contain; border-radius:12px; }
.photo-compare-label { color:#fff; font-family:'Outfit',sans-serif; font-size:13px; font-weight:700; margin-bottom:10px; }
.photo-compare-date { color:#aaa; font-size:11px; margin-top:6px; }
@media(max-width:600px){ .photo-compare { grid-template-columns:1fr; } }

.prog-history { background:#fff; border:1px solid var(--border); border-radius:18px; padding:24px; }
.prog-history-title { font-family:'Outfit',sans-serif; font-size:16px; font-weight:800; margin-bottom:16px; }
.prog-history-row { display:grid; grid-template-columns:90px repeat(auto-fit, minmax(60px,1fr)) 32px; gap:10px; padding:10px 0; border-bottom:1px solid var(--gray); align-items:center; font-size:13px; }
.prog-history-row:last-child { border-bottom:none; }
.prog-history-row.head { color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:1px; font-weight:700; padding-bottom:8px; }
.prog-history-date { font-weight:600; }
.prog-history-cell { color:var(--black); font-family:'Outfit',sans-serif; font-weight:700; }
.prog-history-del { background:none; border:none; color:var(--muted); cursor:pointer; padding:4px 8px; border-radius:6px; transition:all 0.15s; }
.prog-history-del:hover { background:#fee; color:#ef4444; }

@media(max-width:760px){
  .prog-stats { grid-template-columns:repeat(2,1fr); }
  .prog-form { grid-template-columns:repeat(2,1fr); }
  .prog-history-row { grid-template-columns:60px 1fr 1fr 24px; gap:6px; }
}

/* WORKOUT LOG (per-exercise sets) */
.wc-log { margin-top:12px; padding-top:12px; border-top:1px solid var(--gray); }
.wc-log-toggle { background:none; border:none; padding:6px 0; cursor:pointer; font-family:'Outfit',sans-serif; font-size:12px; font-weight:700; color:var(--accent2); display:inline-flex; align-items:center; gap:4px; }
.wc-log-toggle::after { content:'▾'; transition:transform 0.2s; }
.wc-log-toggle.open::after { transform:rotate(180deg); }
.wc-log-body { display:none; margin-top:10px; }
.wc-log-body.open { display:block; animation:fadeUp 0.2s ease; }
.wc-log-prev { font-size:11px; color:var(--muted); margin-bottom:8px; padding:6px 10px; background:#fffbf0; border:1px solid #ffe4a0; border-radius:8px; }
.wc-log-prev strong { color:var(--black); }
.wc-log-sets { display:flex; flex-direction:column; gap:6px; }
.wc-log-set { display:flex; align-items:center; gap:8px; }
.wc-log-set-n { font-family:'Outfit',sans-serif; font-size:11px; font-weight:800; width:18px; color:var(--muted); flex-shrink:0; text-align:center; }
.wc-log-set input { flex:1; min-width:0; padding:6px 10px; border:1.5px solid var(--border); border-radius:8px; font-size:13px; font-family:'Outfit',sans-serif; font-weight:700; outline:none; transition:border-color 0.2s; -moz-appearance:textfield; }
.wc-log-set input:focus { border-color:var(--black); }
.wc-log-set input::-webkit-inner-spin-button { -webkit-appearance:none; }
.wc-log-set input.weight { color:#222; }
.wc-log-set input.reps { color:#222; }
.wc-log-set-x { color:var(--muted); font-size:11px; font-weight:600; flex-shrink:0; }
.wc-log-save { background:var(--black); color:var(--accent); border:none; padding:8px 14px; border-radius:100px; font-family:'Outfit',sans-serif; font-size:11px; font-weight:800; cursor:pointer; margin-top:10px; transition:all 0.2s; }
.wc-log-save:hover { background:#222; }
.wc-log-save.saved { background:#22c55e; color:#fff; }

/* REST TIMER (floating) */
.rest-timer { position:fixed; bottom:24px; right:24px; z-index:400; background:linear-gradient(135deg,#1a1a1a 0%,#000 100%); color:#fff; border-radius:20px; padding:18px 22px; box-shadow:0 16px 40px rgba(0,0,0,0.4); min-width:220px; display:none; }
.rest-timer.show { display:block; animation:slideUp 0.3s ease; }
.rest-timer.ending { animation:rest-pulse 0.5s infinite; }
@keyframes rest-pulse { 0%,100% { transform:scale(1); } 50% { transform:scale(1.03); box-shadow:0 16px 50px rgba(232,255,71,0.4); } }
.rest-timer-label { font-size:10px; color:#888; text-transform:uppercase; letter-spacing:1.5px; font-weight:700; margin-bottom:4px; }
.rest-timer-display { font-family:'Outfit',sans-serif; font-size:42px; font-weight:800; color:var(--accent); letter-spacing:-1px; line-height:1; }
.rest-timer-bar { height:4px; background:rgba(255,255,255,0.1); border-radius:100px; margin-top:10px; overflow:hidden; }
.rest-timer-bar-fill { height:100%; background:linear-gradient(90deg,var(--accent2),var(--accent)); border-radius:100px; transition:width 0.3s linear; }
.rest-timer-actions { display:flex; gap:6px; margin-top:12px; }
.rest-btn { flex:1; background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.1); color:#aaa; padding:6px 10px; border-radius:8px; font-family:'Outfit',sans-serif; font-size:11px; font-weight:700; cursor:pointer; transition:all 0.15s; }
.rest-btn:hover { background:rgba(255,255,255,0.1); color:#fff; }
.rest-btn.cancel { color:#fc8b8b; }

/* Rest picker (replaces in workout card) */
.rest-picker { display:flex; gap:6px; flex-wrap:wrap; margin-top:8px; }
.rest-pick-btn { background:#fff; border:1.5px solid var(--border); color:var(--black); padding:7px 12px; border-radius:100px; font-family:'Outfit',sans-serif; font-size:11px; font-weight:700; cursor:pointer; transition:all 0.15s; }
.rest-pick-btn:hover { border-color:var(--black); background:var(--black); color:var(--accent); }

/* PROGRESS TRACKING */
.progress-bar { background:rgba(255,255,255,0.05); border:1px solid rgba(232,255,71,0.15); border-radius:14px; padding:14px 18px; margin-bottom:24px; display:flex; align-items:center; gap:14px; }
.progress-bar-info { flex:1; }
.progress-bar-label { font-family:'Outfit',sans-serif; font-size:13px; color:#999; font-weight:600; margin-bottom:6px; letter-spacing:0.3px; }
.progress-bar-track { background:rgba(255,255,255,0.08); height:8px; border-radius:100px; overflow:hidden; position:relative; }
.progress-bar-fill { background:linear-gradient(90deg,var(--accent2),var(--accent)); height:100%; border-radius:100px; width:0%; transition:width 0.5s cubic-bezier(0.4,0,0.2,1); }
.progress-bar-pct { font-family:'Outfit',sans-serif; font-size:22px; font-weight:800; color:var(--accent); min-width:60px; text-align:right; letter-spacing:-0.5px; }

.wc-check { display:inline-flex; align-items:center; gap:8px; background:transparent; border:1.5px solid var(--border); padding:8px 14px; border-radius:100px; cursor:pointer; font-family:'Outfit',sans-serif; font-size:12px; font-weight:700; color:var(--muted); transition:all 0.2s; }
.wc-check:hover { border-color:var(--black); color:var(--black); }
.wc-check.done { background:#22c55e; border-color:#22c55e; color:#fff; }
.wc-check.done::before { content:'✓ '; }

/* PRINT */
@media print {
  nav, .restore-banner, .hero-section, .faq-section, #faq-section, #quiz-section, #loading,
  .plan-tabs, .results-actions, .tab-hint, .bottom-cta, .site-footer,
  .cookie-banner, .email-modal, .btn-restart2, .vtog, .view-toggle,
  .day-card:not(.active), .aff-card, .aff-strip, .nutr-affiliate, .equip-recs,
  .shop-actions, .nutr-tip, .aff-disclosure, .supp-detail .sd-close, .wc-actions, .wc-aff,
  .results-hero .btn-hero, .btn-whatsapp, .restore-banner, .results-hero p {
    display:none !important;
  }
  body { background:#fff !important; color:#000 !important; font-size:12px; }
  .plan-section { display:block !important; padding:0 !important; max-width:none !important; page-break-after:always; }
  .plan-section:last-child { page-break-after:auto; }
  .plan-section h3, .sec-header h3 { font-size:24px !important; color:#000 !important; }
  .results-hero { padding:20px 0 !important; background:#fff !important; color:#000; }
  .results-hero h2 { color:#000 !important; font-size:32px !important; }
  .profile-chips { gap:6px !important; }
  .chip { background:#eee !important; color:#000 !important; border:none !important; }
  .macro-hero { background:#fff !important; border:1px solid #000; padding:16px !important; }
  .macro-hero-title { color:#000 !important; }
  .macro-card { background:#fff !important; border:1px solid #ddd !important; }
  .macro-num { color:#000 !important; }
  .macro-lbl { color:#666 !important; }
  .meal-card, .workout-card, .tslot { box-shadow:none !important; border:1px solid #ddd !important; page-break-inside:avoid; }
  .wc-header { background:#000 !important; }
  a { color:#000 !important; text-decoration:none !important; }
  .day-card.active { background:#000 !important; }
}

/* FOOTER */
.site-footer { background:#0a0a0a; color:#888; padding:60px 24px 30px; }
.footer-inner { max-width:1100px; margin:0 auto; display:grid; grid-template-columns:1fr 2fr; gap:60px; }
.footer-logo { font-family:'Outfit',sans-serif; font-size:24px; font-weight:800; color:#fff; margin-bottom:12px; }
.footer-logo em { color:var(--accent); font-style:normal; }
.footer-tagline { font-size:13px; color:#666; line-height:1.6; max-width:340px; }
.footer-cols { display:grid; grid-template-columns:1fr 1fr; gap:40px; }
.footer-col { display:flex; flex-direction:column; gap:10px; }
.footer-h { font-family:'Outfit',sans-serif; font-size:12px; font-weight:800; letter-spacing:1.5px; text-transform:uppercase; color:#fff; margin-bottom:6px; }
.footer-col a { color:#888; text-decoration:none; font-size:14px; transition:color 0.2s; }
.footer-col a:hover { color:var(--accent); }
.footer-bottom { max-width:1100px; margin:48px auto 0; padding-top:24px; border-top:1px solid #1a1a1a; font-size:12px; color:#666; text-align:center; line-height:1.6; }
@media(max-width:700px){
  .footer-inner { grid-template-columns:1fr; gap:40px; }
  .footer-cols { grid-template-columns:1fr 1fr; }
}

/* Aff disclosure inline */
.aff-disclosure { font-size:11px; color:var(--muted); background:#fffbf0; border:1px solid #ffe4a0; border-radius:8px; padding:10px 14px; margin-bottom:16px; line-height:1.5; }

/* Cookie banner */
.cookie-banner { position:fixed; bottom:20px; left:20px; right:20px; max-width:480px; margin:0 auto; background:#111; color:#fff; padding:18px 22px; border-radius:14px; box-shadow:0 12px 40px rgba(0,0,0,0.3); z-index:500; display:none; }
.cookie-banner.show { display:block; animation:slideUp 0.4s cubic-bezier(0.4,0,0.2,1); }
@keyframes slideUp { from { transform:translateY(100px); opacity:0; } to { transform:translateY(0); opacity:1; } }
.cookie-banner p { font-size:13px; line-height:1.6; color:#ccc; margin-bottom:12px; }
.cookie-banner a { color:var(--accent); text-decoration:underline; }
.cookie-banner-actions { display:flex; gap:8px; }
.btn-cookie { flex:1; padding:9px 14px; border-radius:8px; border:none; font-family:'Outfit',sans-serif; font-size:13px; font-weight:700; cursor:pointer; transition:all 0.2s; }
.btn-cookie-ok { background:var(--accent); color:var(--black); }
.btn-cookie-ok:hover { background:#d4eb30; }

/* BOTTOM CTA */
.bottom-cta { background:var(--black); padding:60px 24px; text-align:center; }
.bottom-cta h3 { font-family:'Outfit',sans-serif; font-size:36px; font-weight:800; color:var(--white); letter-spacing:-1px; margin-bottom:12px; }
.bottom-cta p { color:#666; font-size:15px; margin-bottom:28px; }
.btn-restart2 { background:var(--accent); color:var(--black); border:none; padding:16px 36px; border-radius:100px; font-family:'Outfit',sans-serif; font-size:15px; font-weight:700; cursor:pointer; transition:all 0.2s; }
.btn-restart2:hover { background:#d4eb30; transform:scale(1.03); }

@media(max-width:700px){
  nav { padding:16px 20px; }
  .opts { grid-template-columns:1fr; }
  .opts.c3 { grid-template-columns:1fr 1fr; }
  .time-grid { grid-template-columns:1fr 1fr; }
  .macro-cards { grid-template-columns:1fr 1fr; }
  .week-grid { grid-template-columns:repeat(4,1fr); }
  .equip-grid { grid-template-columns:1fr 1fr; }
  .app-cards { grid-template-columns:1fr; }
  .sd-grid { grid-template-columns:1fr; }
  .num-inputs { grid-template-columns:1fr; }
  .supp-total { flex-direction:column; gap:16px; text-align:center; }
}
@media(max-width:480px){
  h1 { font-size:46px; }
  .week-grid { grid-template-columns:repeat(4,1fr); }
  .store-row { grid-template-columns:1fr 1fr 1fr; }
}

/* ============== MOTION SYSTEM ============== */
/* Reveal on scroll / mount — applied via JS adding .is-visible */
.reveal { opacity:0; transform:translateY(18px); transition:opacity 0.6s cubic-bezier(0.22,1,0.36,1), transform 0.6s cubic-bezier(0.22,1,0.36,1); will-change:opacity,transform; }
.reveal.is-visible { opacity:1; transform:translateY(0); }
.reveal-stagger > * { opacity:0; transform:translateY(14px); transition:opacity 0.5s cubic-bezier(0.22,1,0.36,1), transform 0.5s cubic-bezier(0.22,1,0.36,1); }
.reveal-stagger.is-visible > * { opacity:1; transform:translateY(0); }
.reveal-stagger.is-visible > *:nth-child(1) { transition-delay:.04s; }
.reveal-stagger.is-visible > *:nth-child(2) { transition-delay:.10s; }
.reveal-stagger.is-visible > *:nth-child(3) { transition-delay:.16s; }
.reveal-stagger.is-visible > *:nth-child(4) { transition-delay:.22s; }
.reveal-stagger.is-visible > *:nth-child(5) { transition-delay:.28s; }
.reveal-stagger.is-visible > *:nth-child(6) { transition-delay:.34s; }
.reveal-stagger.is-visible > *:nth-child(7) { transition-delay:.40s; }
.reveal-stagger.is-visible > *:nth-child(8) { transition-delay:.46s; }
.reveal-stagger.is-visible > *:nth-child(n+9) { transition-delay:.52s; }

/* Click micro-bounce on any [data-press] */
[data-press]:active { transform:scale(0.96); transition:transform 0.08s ease-out; }

/* Inline SVG icon system */
.icon { width:1em; height:1em; display:inline-block; vertical-align:-0.15em; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }
.icon-lg { width:1.25em; height:1.25em; }
.icon-xl { width:1.6em; height:1.6em; }

/* Skeleton shimmer */
.skel { position:relative; overflow:hidden; background:linear-gradient(90deg, #ececec 0%, #f5f5f5 50%, #ececec 100%); background-size:200% 100%; animation:shimmer 1.4s linear infinite; border-radius:8px; color:transparent !important; }
.skel * { visibility:hidden; }
@keyframes shimmer { 0% { background-position:200% 0; } 100% { background-position:-200% 0; } }

/* Glassmorphism utility */
.glass { background:rgba(255,255,255,0.72); backdrop-filter:blur(14px) saturate(140%); -webkit-backdrop-filter:blur(14px) saturate(140%); border:1px solid rgba(255,255,255,0.6); }
.glass-dark { background:rgba(15,15,15,0.6); backdrop-filter:blur(14px) saturate(140%); -webkit-backdrop-filter:blur(14px) saturate(140%); border:1px solid rgba(255,255,255,0.08); }

/* Confetti canvas (full viewport overlay) */
.confetti-canvas { position:fixed; inset:0; pointer-events:none; z-index:9999; }

/* Quiz step slide transitions */
.q-step { transition:opacity 0.35s cubic-bezier(0.22,1,0.36,1), transform 0.35s cubic-bezier(0.22,1,0.36,1); }
.q-step:not(.active) { display:none; }
.q-step.active.q-enter-fwd { animation:qSlideInRight 0.4s cubic-bezier(0.22,1,0.36,1); }
.q-step.active.q-enter-back { animation:qSlideInLeft 0.4s cubic-bezier(0.22,1,0.36,1); }
@keyframes qSlideInRight { from{opacity:0; transform:translateX(40px)} to{opacity:1; transform:translateX(0)} }
@keyframes qSlideInLeft { from{opacity:0; transform:translateX(-40px)} to{opacity:1; transform:translateX(0)} }

/* Donut chart animation */
.donut-progress { transition:stroke-dashoffset 1.2s cubic-bezier(0.22,1,0.36,1); }

/* Adapt banner: slide-down + bounce */
.adapt-banner.show { animation:adaptIn 0.5s cubic-bezier(0.34,1.56,0.64,1); }
@keyframes adaptIn { 0%{opacity:0; transform:translateY(-20px)} 100%{opacity:1; transform:translateY(0)} }

/* Profile chips premium tilt */
.chip { transition:transform 0.25s cubic-bezier(0.22,1,0.36,1), background 0.25s, border-color 0.25s; }
.chip:hover { transform:translateY(-2px) rotate(-1.5deg); }
.chip.primary:hover { transform:translateY(-2px) rotate(1.5deg); }

/* Conic-gradient animated border on primary CTAs */
.cta-glow { position:relative; isolation:isolate; }
.cta-glow::before {
  content:''; position:absolute; inset:-2px; border-radius:inherit; z-index:-1;
  background:conic-gradient(from 0deg, transparent 0%, var(--accent) 25%, transparent 50%, var(--accent) 75%, transparent 100%);
  animation:ctaSpin 3.5s linear infinite; opacity:0.6;
}
@keyframes ctaSpin { to{transform:rotate(360deg)} }

/* Reduced motion: disable everything */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration:0.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.01ms !important;
    scroll-behavior:auto !important;
  }
  .reveal, .reveal-stagger > * { opacity:1 !important; transform:none !important; }
  .skel { animation:none !important; background:#ececec !important; }
}
