/* Web de venta: un hilo discontinuo recorre la página y une los 7 pasos; teja oscura + lino, serif editorial. Misma identidad que la ficha del 14-10 */
:root{--bg:#F6F1EA;--paper:#FFFDF9;--ink:#2A1E1A;--mut:#6B5D55;--line:#E6DCD0;--acc:#8E3B2E;--acc-bg:#F3E1DC;--on-acc:#FFFDF9;
--d:ui-serif,"New York","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;--b:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;color-scheme:light}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#171210;--paper:#211A17;--ink:#F2EAE2;--mut:#B3A69C;--line:#3A2F2A;--acc:#E19A88;--acc-bg:#3A221D;--on-acc:#171210;color-scheme:dark}}
:root[data-theme="dark"]{--bg:#171210;--paper:#211A17;--ink:#F2EAE2;--mut:#B3A69C;--line:#3A2F2A;--acc:#E19A88;--acc-bg:#3A221D;--on-acc:#171210;color-scheme:dark}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.6 var(--b);overflow-x:hidden}
a{color:inherit}
.w{max-width:1040px;margin:0 auto;padding-inline:16px}
:focus-visible{outline:3px solid var(--acc);outline-offset:3px;border-radius:6px}
/* cabecera */
header{position:sticky;top:0;z-index:5;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
header .w{display:flex;justify-content:space-between;align-items:center;min-height:64px;gap:12px}
.brand{font:700 26px var(--d);letter-spacing:.02em;text-decoration:none}.brand span{color:var(--acc)}
nav{display:flex;gap:22px;font-size:15px;font-weight:600}nav a{text-decoration:none;color:var(--mut)}nav a:hover{color:var(--ink)}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 24px;border-radius:999px;background:var(--acc);color:var(--on-acc);font:700 16px var(--b);text-decoration:none;border:2px solid var(--acc)}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn.sm{min-height:40px;padding:0 18px;font-size:14px}
@media (max-width:760px){nav{display:none}}
/* hero */
.hero{padding:72px 0 56px;position:relative}
.eyebrow{font-size:13px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--acc)}
h1{font:600 clamp(46px,9vw,96px)/.95 var(--d);margin:14px 0 20px;letter-spacing:-.01em;text-wrap:balance}
h1 em{font-style:italic;color:var(--acc)}
.lead{font-size:clamp(18px,2.4vw,21px);color:var(--mut);max-width:32em;margin:0}
.cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:18px;overflow:hidden;margin-top:52px}
.facts div{background:var(--paper);padding:20px}
.facts b{display:block;font:700 34px/1 var(--d);color:var(--acc)}
.facts span{font-size:14px;color:var(--mut)}
@media (max-width:620px){.facts{grid-template-columns:1fr}}
/* secciones */
section{padding:64px 0}
h2{font:600 clamp(36px,6vw,56px)/1 var(--d);margin:10px 0 14px;text-wrap:balance}
.sub{color:var(--mut);max-width:34em;margin:0}
/* el hilo */
.thread{position:relative;margin-top:40px;padding-left:40px}
.thread::before{content:"";position:absolute;left:13px;top:8px;bottom:8px;border-left:2px dashed var(--acc)}
.st{position:relative;background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:18px 20px;margin-bottom:12px;display:flex;justify-content:space-between;gap:16px;align-items:flex-start}
.st::before{content:attr(data-n);position:absolute;left:-40px;top:18px;width:28px;height:28px;border-radius:50%;background:var(--acc);color:var(--on-acc);font:700 13px var(--b);display:grid;place-items:center}
.st div{min-width:0}.st h3{margin:0;font:700 24px/1.1 var(--d)}.st p{margin:4px 0 0;color:var(--mut);font-size:15px}
.pr{font:700 24px var(--d);white-space:nowrap;color:var(--acc);text-align:right}
.pr small{display:block;font:500 12px var(--b);color:var(--mut)}
@media (max-width:520px){.st{flex-direction:column;gap:6px}.pr{text-align:left}}
/* packs */
.packs{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:36px;align-items:stretch}
@media (max-width:860px){.packs{grid-template-columns:1fr}}
.pk{background:var(--paper);border:1px solid var(--line);border-radius:22px;padding:26px;display:flex;flex-direction:column;gap:10px}
.pk.top{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.pk.top .mut{color:color-mix(in srgb,var(--bg) 75%,transparent)}
.pk .tag{align-self:flex-start;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:var(--acc);color:var(--on-acc);border-radius:99px;padding:4px 12px}
.pk h3{margin:0;font:600 30px/1 var(--d)}
.pk .big{font:700 54px/1 var(--d)}.pk .big small{font:500 15px var(--b)}
.mut{color:var(--mut);font-size:15px;margin:0}
.pk ul{list-style:none;padding:0;margin:6px 0 0;display:grid;gap:8px;font-size:15px}
.pk li{display:flex;gap:10px}.pk li::before{content:"";width:14px;height:0;border-top:2px dashed var(--acc);margin-top:11px;flex:none}
.pk .btn{margin-top:auto}
.pk.top .btn{background:var(--bg);color:var(--ink);border-color:var(--bg)}
/* para quién */
.who{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;margin-top:32px}
.who div{border-top:2px solid var(--acc);padding-top:12px}.who b{display:block;font:700 22px var(--d)}.who span{color:var(--mut);font-size:15px}
/* faq */
.faq{margin-top:28px;border-top:1px solid var(--line)}
details{border-bottom:1px solid var(--line);padding:18px 0}
summary{cursor:pointer;font:700 22px var(--d);list-style:none;display:flex;justify-content:space-between;gap:16px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";color:var(--acc);font:600 26px/1 var(--b)}
details[open] summary::after{content:"–"}
details p{margin:10px 0 0;color:var(--mut);max-width:44em}
/* contacto */
.contact{background:var(--acc-bg);border-radius:28px;padding:clamp(28px,5vw,52px);display:grid;grid-template-columns:1.2fr 1fr;gap:28px;align-items:center}
@media (max-width:760px){.contact{grid-template-columns:1fr}}
.contact h2{margin-top:0}
.mail{font:700 clamp(20px,3vw,26px) var(--d);overflow-wrap:anywhere}
footer{border-top:1px solid var(--line);padding:28px 0 40px;font-size:13px;color:var(--mut)}
footer .w{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}


.btn{cursor:pointer}
.keys{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-top:28px}
.keys div{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:16px 18px}
.keys b{display:block;font:700 21px/1.15 var(--d)}.keys span{font-size:14px;color:var(--mut)}
.note{margin-top:16px;font-size:14px;color:var(--mut)}
form{background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:22px;display:grid;gap:14px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:560px){.two{grid-template-columns:1fr}}
label{display:grid;gap:6px;font-size:14px;font-weight:600}
input,select,textarea{font:16px var(--b);color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:12px;min-height:48px;width:100%}
textarea{min-height:110px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:3px solid var(--acc);outline-offset:1px}
.check{display:flex;gap:10px;align-items:flex-start;font-weight:400;color:var(--mut)}
.check input{width:22px;height:22px;min-height:22px;flex:none;margin-top:1px;accent-color:var(--acc)}
.msg{margin:0;font-size:14px;color:var(--mut)}
.contact{align-items:start}
footer nav{display:flex;gap:16px;flex-wrap:wrap;font-weight:500;font-size:13px}
@media (max-width:760px){footer nav{display:flex}}
footer nav a{display:inline-flex;align-items:center;min-height:44px}
.legal{display:none;position:fixed;inset:0;z-index:20;background:var(--bg);overflow-y:auto}
.legal:target{display:block}
.legal .w{max-width:760px;padding-block:24px 64px}
.legal .top{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px}
.legal h2{font-size:clamp(36px,6vw,52px)}
.legal h3{font:700 18px var(--b);margin:26px 0 6px}
.legal p,.legal li{font-size:16px;color:var(--mut)}
.legal ul{padding-left:20px}
.legal strong{color:var(--ink)}
.legal .date{font-size:14px;margin:0}
.pr .iva,.big .iva{display:block;font-family:var(--b, inherit);font-size:13px;font-weight:500;line-height:1.35;color:var(--mut);margin-top:2px}
.big .iva{font-size:15px;margin-top:6px}
.pr small{display:block}
.pk.top .big .iva{color:inherit;opacity:.82}
.pend{font-size:clamp(17px,2.2vw,20px)!important;line-height:1.2}
.plan{display:grid;gap:22px}@media (min-width:900px){.plan{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:start}}
.plan .opts{display:grid;gap:10px}
.plan .opts label{display:grid;grid-template-columns:24px 1fr auto;gap:12px;align-items:center;background:var(--paper,#fff);border:1px solid var(--line);border-radius:14px;padding:14px 16px;cursor:pointer}
.plan .opts input{width:20px;height:20px;accent-color:var(--acc)}
.plan .opts small{display:block;color:var(--mut);font-size:13px}
.plan .opts .p{font-weight:700;text-align:right;white-space:nowrap;font-size:15px}
.plan .res{background:var(--paper,#fff);border:1px solid var(--line);border-radius:18px;padding:20px;position:sticky;top:90px}
.plan .res .tot{font-family:var(--d);font-size:clamp(30px,5vw,40px);line-height:1.1;margin:6px 0 2px}
.plan .res ol{margin:14px 0;padding-left:20px;display:grid;gap:6px}
.plan .res .warn{font-size:14px;color:var(--mut);margin-top:8px}
/* utilidades */
.hs1{margin-top:20px}

/* página 404 */
.p404{margin:0;min-height:100vh;display:grid;place-items:center;background:#F6F1EA;color:#2A1E1A;font-family:Georgia,"Times New Roman",serif;padding:24px;box-sizing:border-box}
.p404-box{max-width:520px;text-align:center}
.p404-n{font-size:72px;font-weight:800;line-height:1;margin:0 0 8px;color:#8E3B2E}
.p404 h1{font-size:28px;margin:0 auto 12px;max-width:none;text-align:center;text-transform:none;letter-spacing:normal}
.p404 p{line-height:1.55}
.p404-btn{display:inline-block;margin-top:8px;padding:12px 22px;border-radius:999px;background:#8E3B2E;color:#FFFFFF;text-decoration:none;font-weight:700;min-height:44px;box-sizing:border-box}
.p404-mail a{color:inherit}
@media (prefers-color-scheme:dark){.p404{background:#171210;color:#F6F1EA}.p404-n{color:#E08A72}.p404-btn{background:#E08A72;color:#171210}}