/* ════════ Para ti, Maria — guía interactiva ════════ */
:root{
  --cream:#fbf3ea; --cream2:#f7ebe0; --blush:#f1ddd2;
  --plum:#6d2840; --plum-d:#4f1c2e; --plum-soft:#8a3a54;
  --gold:#c0934c; --gold-l:#dcb878; --gold-bg:#f5e7cf; --gold-d:#9c7634;
  --rose:#dd9c8e; --rose-bg:#f7e3dc;
  --ink:#3a2a2c; --muted:#94797a; --line:#ead8cd;
  --ok:#4a7d5e; --ok-bg:#e7f1e8; --no:#bb4b54; --no-bg:#f8e3e2;
  --shadow:0 18px 50px -22px rgba(80,28,46,.45);
  --shadow-s:0 8px 24px -12px rgba(80,28,46,.32);
  --r:24px;
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;}
html{scroll-behavior:smooth;}
body{
  font-family:"Mulish",system-ui,sans-serif;color:var(--ink);
  background:var(--cream);line-height:1.55;font-size:16px;
  overflow-x:hidden;
}
/* warm grain + glow backdrop */
body::before{
  content:"";position:fixed;inset:0;z-index:-2;
  background:
    radial-gradient(120% 80% at 85% -5%, rgba(220,184,120,.22), transparent 55%),
    radial-gradient(110% 70% at -10% 12%, rgba(221,156,142,.20), transparent 55%),
    radial-gradient(120% 90% at 50% 108%, rgba(109,40,64,.16), transparent 60%),
    var(--cream);
}
body::after{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.045'/%3E%3C/svg%3E");
}
em{font-style:italic;}
.hidden{display:none!important;}

main{max-width:480px;margin:0 auto;padding:0 22px 60px;}

/* reading progress */
.progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:60;background:transparent;}
.progress span{display:block;height:100%;width:0;
  background:linear-gradient(90deg,var(--gold-l),var(--plum));transition:width .1s linear;}

/* topbar */
.topbar{position:sticky;top:0;z-index:50;max-width:480px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 22px;backdrop-filter:blur(10px);
  background:linear-gradient(var(--cream),rgba(251,243,234,.72));
}
.brand{font-family:"Fraunces",serif;font-size:16px;color:var(--plum);display:flex;align-items:center;gap:7px;}
.brand .dot{color:var(--gold);font-size:15px;}
.brand em{font-weight:500;}
.lang{display:flex;background:var(--blush);border-radius:30px;padding:3px;gap:2px;}
.lang button{border:0;background:transparent;font-family:"Mulish";font-weight:800;font-size:12px;
  letter-spacing:.5px;color:var(--plum-soft);padding:5px 12px;border-radius:30px;cursor:pointer;transition:.25s;}
.lang button.on{background:var(--plum);color:#fff;box-shadow:var(--shadow-s);}

/* reveal animation */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s cubic-bezier(.2,.7,.2,1) var(--d,0s),transform .7s cubic-bezier(.2,.7,.2,1) var(--d,0s);}
.reveal.in{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none;}}

/* ════ HERO ════ */
.hero{position:relative;text-align:center;padding:46px 4px 40px;
  display:flex;flex-direction:column;align-items:center;}
.hero>*{max-width:100%;}
.hero .glow{position:absolute;top:-30px;left:50%;transform:translateX(-50%);
  width:300px;height:300px;border-radius:50%;z-index:-1;filter:blur(20px);
  background:radial-gradient(circle,rgba(220,184,120,.4),transparent 65%);}
.eyebrow{font-size:12px;font-weight:800;letter-spacing:3px;text-transform:uppercase;color:var(--gold);}
.hello{font-family:"Fraunces",serif;font-style:italic;font-size:21px;color:var(--plum-soft);margin-top:14px;}
.hello span{font-style:normal;}
.hero h1{font-family:"Fraunces",serif;font-weight:600;font-size:42px;line-height:1.08;
  letter-spacing:-.5px;color:var(--plum-d);margin:6px 0 0;}
.sub{color:var(--muted);font-size:15.5px;max-width:330px;margin:16px auto 0;}
.cta{display:inline-flex;align-items:center;gap:10px;margin-top:28px;
  font-family:"Mulish";font-weight:800;font-size:15px;letter-spacing:.3px;
  color:#fff;background:linear-gradient(135deg,var(--plum-soft),var(--plum-d));
  padding:15px 30px;border-radius:40px;text-decoration:none;box-shadow:var(--shadow);
  transition:transform .25s,box-shadow .25s;}
.cta i{font-style:normal;transition:transform .3s;}
.cta:active{transform:scale(.96);}
.cta:hover i{transform:translateY(3px);}
.cta.solid{background:linear-gradient(135deg,var(--gold-l),var(--gold));color:var(--plum-d);}
.hero-chip{display:inline-block;margin-top:22px;font-size:13px;font-weight:700;color:var(--plum);
  background:rgba(255,255,255,.6);border:1px solid var(--line);padding:8px 16px;border-radius:30px;}

/* sections */
.sec{padding:42px 0 8px;}
.label{display:flex;align-items:center;gap:10px;font-family:"Mulish";font-weight:800;
  font-size:12px;letter-spacing:2.5px;text-transform:uppercase;color:var(--plum-soft);margin-bottom:16px;}
.label b{display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:30px;
  padding:0 8px;border-radius:10px;background:var(--plum);color:var(--gold-l);font-size:13px;}
h2.big{font-family:"Fraunces",serif;font-weight:600;font-size:34px;line-height:1.1;color:var(--plum-d);letter-spacing:-.4px;}
h2.mid{font-family:"Fraunces",serif;font-weight:600;font-size:28px;line-height:1.12;color:var(--plum-d);}
.para{color:var(--ink);font-size:16px;margin-top:14px;}
.hint{color:var(--muted);font-size:14px;margin:6px 0 18px;font-style:italic;}

/* assurance cards */
.assure{display:flex;flex-direction:column;gap:12px;margin-top:24px;}
.acard{display:flex;align-items:center;gap:16px;background:rgba(255,255,255,.7);
  border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;box-shadow:var(--shadow-s);}
.acard .ico{font-size:28px;flex-shrink:0;width:52px;height:52px;display:flex;align-items:center;justify-content:center;
  background:var(--gold-bg);border-radius:16px;}
.acard h3{font-family:"Fraunces",serif;font-weight:600;font-size:17px;color:var(--plum);}
.acard p{font-size:13.5px;color:var(--muted);}

/* steps */
.steps-sec{padding-top:26px;}
.steps{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:6px;}
.step{position:relative;background:linear-gradient(160deg,var(--plum),var(--plum-d));color:#fff;
  border-radius:20px;padding:18px 16px 16px;box-shadow:var(--shadow-s);overflow:hidden;}
.step .sn{position:absolute;top:10px;right:14px;font-family:"Fraunces",serif;font-size:30px;
  font-weight:600;color:rgba(220,184,120,.32);}
.step .se{font-size:26px;}
.step p{font-weight:700;font-size:14px;margin-top:8px;line-height:1.25;}

/* shots */
.shots{display:flex;flex-direction:column;gap:12px;}
.shot{background:rgba(255,255,255,.72);border:1px solid var(--line);border-radius:var(--r);
  box-shadow:var(--shadow-s);overflow:hidden;transition:border-color .3s;}
.shot.open{border-color:var(--gold);}
.shot .sh{display:flex;align-items:center;gap:14px;padding:16px 18px;cursor:pointer;user-select:none;}
.shot .snum{font-family:"Fraunces",serif;font-weight:600;font-size:18px;color:var(--gold);
  width:34px;height:34px;flex-shrink:0;display:flex;align-items:center;justify-content:center;
  background:var(--gold-bg);border-radius:11px;}
.shot .sti{flex:1;}
.shot .sti b{font-family:"Fraunces",serif;font-weight:600;font-size:17.5px;color:var(--plum-d);display:block;line-height:1.15;}
.shot .scue{font-size:13px;color:var(--rose);font-weight:700;}
.shot .chev{color:var(--plum-soft);font-size:18px;transition:transform .35s;flex-shrink:0;}
.shot.open .chev{transform:rotate(180deg);}
.shot .sbody{max-height:0;overflow:hidden;transition:max-height .4s ease;}
.shot .sbody-in{padding:0 18px 18px;}
.shot p.sd{font-size:14.5px;color:var(--ink);margin-bottom:14px;}
.imgslot{position:relative;width:100%;aspect-ratio:4/5;border-radius:16px;overflow:hidden;background:var(--blush);}
.imgslot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:2;}
.imgslot .ph{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
  background:repeating-linear-gradient(135deg,var(--blush),var(--blush) 14px,var(--cream2) 14px,var(--cream2) 28px);color:var(--plum-soft);}
.imgslot .ph span{font-size:30px;opacity:.7;}
.imgslot .ph p{font-size:12px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;opacity:.75;}

/* levels — scripts de venta */
.ladder-note{display:flex;gap:8px;align-items:center;background:var(--gold-bg);border:1px solid #e9d3a6;
  border-radius:14px;padding:11px 15px;font-size:13.5px;font-weight:700;color:#8a5a2a;margin:14px 0 18px;}
.levels{display:flex;flex-direction:column;gap:12px;}
.lvl{position:relative;background:rgba(255,255,255,.74);border:1px solid var(--line);border-radius:var(--r);
  box-shadow:var(--shadow-s);overflow:hidden;transition:border-color .3s;}
.lvl::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--rose);z-index:1;}
.lvl[data-lv="1"]::before{background:#e9bba8;}
.lvl[data-lv="2"]::before{background:#dd9c8e;}
.lvl[data-lv="3"]::before{background:#c9707a;}
.lvl[data-lv="4"]::before{background:#9c4256;}
.lvl[data-lv="5"]::before{background:var(--plum-d);}
.lvl[data-lv="6"]::before{background:var(--gold-l);}
.lvl.open{border-color:var(--plum-soft);}
.lvtop{cursor:pointer;}
.lvh{display:flex;align-items:center;gap:12px;padding:14px 16px 9px 22px;user-select:none;}
.taphint{font-size:11.5px;font-weight:800;letter-spacing:.3px;color:var(--plum-soft);padding:0 16px 13px 22px;}
.lvl.open .taphint{display:none;}
.lvl.opt{border-style:dashed;border-color:var(--gold-l);}
.lvl.opt .lnum{background:linear-gradient(135deg,var(--gold-l),var(--gold));color:var(--plum-d);}
.imgslot video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:3;background:#000;}
.lnum{font-family:"Fraunces",serif;font-weight:600;font-size:17px;color:#fff;width:34px;height:34px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;border-radius:11px;background:linear-gradient(135deg,var(--plum-soft),var(--plum-d));}
.lti{flex:1;min-width:0;}
.lti b{font-family:"Fraunces",serif;font-weight:600;font-size:16px;color:var(--plum-d);display:block;line-height:1.15;}
.meter{display:flex;gap:4px;margin-top:6px;}
.meter i{width:15px;height:5px;border-radius:3px;background:var(--blush);}
.meter i.on{background:linear-gradient(90deg,var(--rose),var(--plum));}
.dur{font-size:11px;font-weight:800;letter-spacing:.3px;color:var(--gold-d);background:var(--gold-bg);
  padding:5px 9px;border-radius:20px;white-space:nowrap;flex-shrink:0;}
.lvl .chev{color:var(--plum-soft);font-size:18px;transition:transform .35s;flex-shrink:0;}
.lvl.open .chev{transform:rotate(180deg);}
.lvl .sbody{max-height:0;overflow:hidden;transition:max-height .4s ease;}
.lvl .sbody-in{padding:2px 18px 18px 22px;}
.lvl p.sd{font-size:14.5px;color:var(--ink);margin-bottom:12px;line-height:1.45;}
.lvl .sd .lbl{display:block;font-family:"Mulish";font-weight:800;font-size:11px;letter-spacing:.6px;
  text-transform:uppercase;color:var(--plum-soft);margin-bottom:3px;}
.lframe{font-size:13px;color:var(--plum);background:var(--rose-bg);border-radius:11px;padding:9px 13px;margin-bottom:14px;line-height:1.4;}
.lframe b{color:var(--no);}
.exgrid{display:grid;gap:10px;grid-template-columns:1fr;margin-top:2px;}
.exgrid.multi{grid-template-columns:1fr 1fr;}
.exgrid.multi .imgslot{aspect-ratio:3/4;}

/* rules */
.rules{display:flex;flex-direction:column;gap:14px;}
.rule{border-radius:var(--r);padding:18px 20px;box-shadow:var(--shadow-s);}
.rule.do{background:var(--ok-bg);border:1px solid #c8e0cd;}
.rule.dont{background:var(--no-bg);border:1px solid #f0cdcb;}
.rule h3{font-family:"Fraunces",serif;font-weight:600;font-size:20px;display:flex;align-items:center;gap:10px;margin-bottom:12px;}
.rule.do h3{color:var(--ok);} .rule.dont h3{color:var(--no);}
.rule h3 span:first-child{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:15px;color:#fff;}
.rule.do h3 span:first-child{background:var(--ok);} .rule.dont h3 span:first-child{background:var(--no);}
.rule ul{list-style:none;}
.rule li{font-size:14.5px;padding:8px 0;border-bottom:1px solid rgba(0,0,0,.05);padding-left:24px;position:relative;line-height:1.4;}
.rule li:last-child{border-bottom:0;}
.rule li::before{position:absolute;left:0;top:8px;font-weight:800;}
.rule.do li::before{content:"✓";color:var(--ok);} .rule.dont li::before{content:"✕";color:var(--no);}

/* gallery */
.gallery{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.gtile{position:relative;aspect-ratio:1;border-radius:18px;overflow:hidden;background:var(--blush);cursor:pointer;}
.gtile:nth-child(3n){aspect-ratio:1/1.3;}
.gtile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:2;}
.gtile .ph{position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:center;font-size:24px;
  background:repeating-linear-gradient(135deg,var(--blush),var(--blush) 12px,var(--cream2) 12px,var(--cream2) 24px);color:var(--plum-soft);opacity:.8;}

/* checklist */
.check-head{margin-bottom:18px;}
.pbar{height:10px;border-radius:10px;background:var(--blush);overflow:hidden;margin:12px 0 8px;}
.pbar span{display:block;height:100%;width:0;border-radius:10px;
  background:linear-gradient(90deg,var(--gold-l),var(--ok));transition:width .5s cubic-bezier(.2,.8,.2,1);}
.cprog{font-size:14px;color:var(--muted);font-weight:600;}
.cprog b{color:var(--plum);font-size:17px;font-family:"Fraunces",serif;}
.checklist{display:flex;flex-direction:column;gap:10px;}
.citem{display:flex;align-items:center;gap:14px;background:rgba(255,255,255,.7);
  border:1px solid var(--line);border-radius:18px;padding:15px 16px;cursor:pointer;transition:.25s;user-select:none;}
.citem .box{width:26px;height:26px;border-radius:9px;border:2px solid var(--rose);flex-shrink:0;
  display:flex;align-items:center;justify-content:center;color:#fff;font-size:15px;transition:.25s;}
.citem .ctxt{font-size:14.5px;font-weight:600;line-height:1.3;transition:.25s;}
.citem.done{background:var(--ok-bg);border-color:#c8e0cd;}
.citem.done .box{background:var(--ok);border-color:var(--ok);}
.citem.done .ctxt{color:var(--muted);text-decoration:line-through;}

/* send */
.send-card{text-align:center;background:linear-gradient(165deg,#fff,var(--cream2));
  border:1px solid var(--line);border-radius:28px;padding:34px 24px 30px;box-shadow:var(--shadow);}
.big-emoji{font-size:46px;display:block;margin-bottom:8px;}
.send-card .para{color:var(--muted);max-width:300px;margin:10px auto 22px;}
.send-card .cta{margin-top:0;}
.tiny{font-size:13px;color:var(--muted);margin-top:18px;font-style:italic;}

/* footer */
footer{text-align:center;padding:46px 0 10px;color:var(--muted);}
.fmoon{color:var(--gold);font-size:24px;}
footer .t{font-family:"Fraunces",serif;font-style:italic;font-size:17px;color:var(--plum-soft);margin:8px 0 6px;}
.fmeta{font-size:11px;letter-spacing:2px;text-transform:uppercase;opacity:.7;}

/* lightbox */
.lightbox{position:fixed;inset:0;z-index:100;background:rgba(58,28,38,.92);backdrop-filter:blur(6px);
  display:none;align-items:center;justify-content:center;padding:24px;}
.lightbox.show{display:flex;}
.lightbox img{max-width:100%;max-height:86vh;border-radius:16px;box-shadow:0 30px 80px rgba(0,0,0,.5);}
.lb-close{position:absolute;top:18px;right:20px;background:rgba(255,255,255,.15);border:0;color:#fff;
  width:44px;height:44px;border-radius:50%;font-size:26px;cursor:pointer;line-height:1;}

@media(min-width:481px){
  body::before{background:
    radial-gradient(60% 50% at 85% -5%, rgba(220,184,120,.22), transparent 55%),
    radial-gradient(55% 45% at -10% 12%, rgba(221,156,142,.20), transparent 55%),
    var(--cream);}
  main{box-shadow:0 0 90px -30px rgba(80,28,46,.3);background:rgba(251,243,234,.4);}
}