
@font-face{font-family:"Libre Caslon Text";src:url("../fonts/LibreCaslonText.woff2") format("woff2");font-weight:400 700;font-display:swap}
@font-face{font-family:"Work Sans";src:url("../fonts/WorkSans.woff2") format("woff2");font-weight:100 900;font-display:swap}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:#FBF5E6;color:#20140D;font:400 16px/1.6 "Work Sans",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:"Libre Caslon Text",Georgia,serif;font-weight:600;margin:0}
a{color:inherit}img{display:block;max-width:100%;height:auto}
.bx{max-width:1200px;margin:0 auto;padding:0 40px}
.kick{display:block;font:600 12px/16px "Work Sans";letter-spacing:.12em;text-transform:uppercase;color:#A63D14}
.on-dark .kick{color:#F2A81D}
.skip{position:absolute;left:-9999px;top:8px;background:#20140D;color:#FBF5E6;padding:10px 14px;z-index:100}.skip:focus{left:12px}
a:focus-visible,input:focus-visible,summary:focus-visible,button:focus-visible,label:focus-within{outline:3px solid #20140D;outline-offset:3px}
.on-dark a:focus-visible,.on-dark input:focus-visible,.ctabar a:focus-visible,.foot a:focus-visible{outline-color:#F2A81D}
section[id]{scroll-margin-top:84px}
/* CTA */
.cta{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:52px;padding:0 26px;border-radius:6px;background:#0F7A3E;color:#fff;font:600 16px/1 "Work Sans";text-decoration:none;white-space:nowrap}
.cta:hover{background:#0B6733}.cta.sm{height:44px;padding:0 18px;font-size:15px}.cta.full{width:100%}
.lnk{font-weight:600;text-decoration:underline;text-underline-offset:4px}
/* header */
.hd{position:sticky;top:0;z-index:50;background:#FBF5E6;border-bottom:1px solid #E3D6BA;box-shadow:0 2px 10px rgba(32,20,13,.06)}
.hd .bx{display:flex;align-items:center;height:84px}.hd .brand-logo{line-height:0;display:flex;align-items:center;padding-right:32px;margin-right:32px;border-right:1px solid #D9C9A8;height:44px}.hd .brand-logo img{height:48px;width:228px}.hd .bx>*{flex:none}
.hd nav.main{display:flex;gap:32px;margin:0 auto 0 0}.hd nav.main a{text-decoration:none;font-weight:400;font-size:14px;color:#5A4332;white-space:nowrap;padding:6px 0;border-bottom:2px solid transparent}.hd nav.main a:hover{color:#A63D14;border-bottom-color:#A63D14}
.hd .tel{font-weight:500;font-size:14px;color:#5A4332;white-space:nowrap;margin-right:20px}.hd .tel:hover{color:#A63D14}
.hd .lang{margin-right:20px}.lang{display:flex;border:1px solid #B9A687;border-radius:999px;overflow:hidden}.lang a{padding:5px 9px;font:600 11px/1 "Work Sans";letter-spacing:.06em;text-decoration:none;color:#5A4332}.lang a.on{background:#20140D;color:#FBF5E6}.lang a:not(.on):hover{color:#A63D14}
.hd .cta.sm{height:44px;padding:0 20px;font-size:15px}
/* hero */
.hero{position:relative;color:#FBF5E6;overflow:hidden}
.hero .bgimg,.hero .bgimg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(32,20,13,.92) 0%,rgba(32,20,13,.84) 50%,rgba(32,20,13,.55) 100%)}
.hero .bx{position:relative;z-index:1;display:grid;grid-template-columns:7fr 5fr;gap:72px;align-items:center;padding-top:88px;padding-bottom:96px}
.hero h1{font-size:58px;line-height:63px;letter-spacing:-.015em;margin:16px 0 22px}
.hero .sub{font-size:19px;line-height:31px;color:#EFE4CC;max-width:580px;margin:0 0 28px}
.ticks{list-style:none;padding:0;margin:0 0 34px;display:grid;gap:12px}.ticks li{display:flex;gap:12px;align-items:center;font-size:16px}.ticks .ic{color:#F2A81D;flex:none}
.mini{display:flex;gap:16px;align-items:center}.mini img{width:96px;height:88px;object-fit:cover;border-radius:6px}.mini b{display:block;font-weight:600}.mini .lnk{color:#FBF5E6;font-size:15px}
.credit{position:absolute;right:14px;bottom:10px;z-index:1;font-size:11px;color:#E6D9BC;background:rgba(32,20,13,.85);padding:3px 8px;border-radius:3px}
.form{background:#fff;color:#20140D;border-radius:10px;padding:32px;box-shadow:0 30px 60px rgba(0,0,0,.25)}
.form h2{font-size:28px;line-height:34px}.form .s{color:#5A4332;font-size:15px;margin:6px 0 22px}
.form label.l{display:block;font-weight:600;font-size:14px;margin:0 0 6px}
.form input[type=text],.form input[type=tel]{width:100%;height:48px;border:1.5px solid #8C7A68;border-radius:6px;padding:0 14px;font:16px "Work Sans";color:#20140D;margin-bottom:16px;background:#fff}
.form fieldset{border:0;padding:0;margin:0 0 22px}.form legend{font-weight:600;font-size:14px;margin-bottom:10px;padding:0}
.seg{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.seg label{display:flex;align-items:center;justify-content:center;gap:8px;height:46px;border:1.5px solid #8C7A68;border-radius:6px;font-weight:500;cursor:pointer}
.seg input{accent-color:#0F7A3E;width:18px;height:18px;margin:0}.seg label:has(input:checked){border-color:#0F7A3E;background:#EAF4EE}
.form .alt{margin:14px 0 0;text-align:center;font-size:14px}.form .fine{margin:8px 0 0;text-align:center;font-size:13px;color:#5A4332}
/* pasos */
.steps{background:#F1E5C8;border-bottom:1px solid #E3D6BA}.steps ol{list-style:none;margin:0;padding:40px 0;display:grid;grid-template-columns:repeat(3,1fr)}
.steps li{display:flex;gap:18px;padding:0 32px;border-left:1px solid #D9C9A8}.steps li:first-child{border-left:0;padding-left:0}
.steps .n{font:600 40px/1 "Libre Caslon Text";color:#A63D14}.steps h2,.steps h3{font-size:21px;line-height:27px;margin:4px 0 6px}.steps p{margin:0;color:#5A4332;font-size:15px}
/* secciones */
.sec{padding:104px 0}.sec.alt{background:#F1E5C8}
.head{text-align:center;max-width:700px;margin:0 auto 52px}.head h2{font-size:40px;line-height:46px;letter-spacing:-.01em;margin:12px 0 14px}.head p{margin:0;color:#5A4332;font-size:18px;line-height:30px}
/* simulador */
.sim{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;background:#fff;border:1px solid #E3D6BA;border-radius:12px;padding:40px}
.sim h3{font-size:22px;margin:0 0 6px}.sim .stp{display:flex;gap:12px;align-items:center;font-weight:600;margin:0 0 12px}.sim .stp i{font-style:normal;display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#20140D;color:#FBF5E6;font-size:14px}
.up{display:flex;align-items:center;justify-content:center;gap:10px;height:52px;border:1.5px dashed #8C7A68;border-radius:8px;font-weight:600;cursor:pointer;margin-bottom:8px}.up:hover{background:#FBF5E6}
.up input{position:absolute;width:1px;height:1px;opacity:0}.hint{font-size:13px;color:#5A4332;margin:0 0 26px}
.ctl{min-width:0}.sty3{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:24px}.sty3 label{display:flex;gap:10px;align-items:flex-start;padding:12px;border:1.5px solid #8C7A68;border-radius:8px;cursor:pointer}
.sty3 b{display:block;font-weight:600}.sty3 small{display:block;font-size:13px;line-height:18px;color:#5A4332}.sty3 input{accent-color:#0F7A3E;width:18px;height:18px;margin:2px 0 0;flex:none}.sty3 label:has(input:checked){border-color:#0F7A3E;background:#EAF4EE}
.fmt{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:8px}.fmt label{display:flex;align-items:center;justify-content:center;gap:6px;height:52px;padding:0 6px;border:1.5px solid #8C7A68;border-radius:8px;font-weight:600;font-size:14px;cursor:pointer;white-space:nowrap}
.fmt input{accent-color:#0F7A3E;width:18px;height:18px;margin:0}.fmt label:has(input:checked){border-color:#0F7A3E;background:#EAF4EE}
.fmt label.dis{border-style:dashed;color:#6E5D4F;background:#F4EFE6;cursor:not-allowed}.note{min-height:22px;margin:0 0 18px;font-size:14px;font-weight:600;color:#A63D14}
.stage{position:relative;border-radius:10px;background:linear-gradient(#F7F0DF,#EADCBC);padding:36px 24px 64px;min-height:600px;display:flex;flex-direction:column;justify-content:flex-end}
.shelf{position:relative;display:flex;justify-content:center;align-items:flex-end;gap:40px}.shelf::before{content:"";position:absolute;left:0;right:0;bottom:46px;height:3px;background:#C9B48C}
.pkw{display:flex;flex-direction:column;align-items:center;cursor:pointer}.pkw .pk{opacity:.5;transition:opacity .2s}.pkw.on .pk,.pkw:hover .pk{opacity:1}
.pkw .pk{display:block;filter:drop-shadow(0 10px 10px rgba(32,20,13,.25))}.pkw .cap{display:block;height:46px;padding-top:10px;text-align:center;font-size:14px;line-height:18px}.pkw .cap small{display:block;color:#5A4332;font-size:13px}.pkw.on .cap b{color:#0B6733}
.pkw.dis{cursor:not-allowed}.pkw.dis .pk,.pkw.dis:hover .pk{opacity:.3;filter:grayscale(1)}
.caps{display:none}.shelf+.sel{margin:14px 0 0;text-align:center;font:600 16px/24px "Work Sans"}
.stage .tag{position:absolute;left:14px;bottom:14px;background:rgba(32,20,13,.82);color:#FBF5E6;font-size:13px;padding:6px 10px;border-radius:4px}
.dims{display:flex;justify-content:center;gap:36px;margin-top:10px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.spec{margin-top:48px;display:grid;grid-template-columns:7fr 5fr;gap:24px}.spec h3,.req h3{font-size:22px;line-height:29px;margin:0 0 16px}
.stab,.lab{background:#fff;border:1px solid #E3D6BA;border-radius:10px;padding:28px}
.stab table{width:100%;border-collapse:collapse}.stab th,.stab td{padding:14px 10px;border-bottom:1px solid #E3D6BA;text-align:center;font-size:15px}.stab thead th{font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:#5A4332;font-weight:600}
.stab tbody th{text-align:left}.stab thead th:first-child{text-align:left}.stab tbody th b{display:block;font:600 19px/24px "Libre Caslon Text"}.stab tbody th span{color:#5A4332;font-weight:400;font-size:14px}
.stab td.y{color:#0F7A3E;font-size:18px}.stab td.n{color:#6E5D4F}.fn{margin:12px 0 0;font-size:14px;color:#5A4332}
.lab{display:grid;gap:14px;align-content:start}.lab h3{margin-bottom:2px}.opt{border:1.5px solid #D9C9A8;border-radius:8px;padding:16px 18px}.opt .on{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#A63D14;font-weight:600}
.opt h4{font:600 19px/25px "Libre Caslon Text";margin:4px 0 4px}.opt p{margin:0;color:#5A4332;font-size:15px}.opt .pr{margin:2px 0 4px;color:#20140D;font-size:15px}.opt .pr b{font:600 22px/28px "Libre Caslon Text";color:#A63D14;margin-right:6px}
.req{margin-top:40px}.req .facts{margin-top:0;border-top:0;padding-top:0}.req .facts>div{background:#fff;border:1px solid #E3D6BA;border-left:4px solid #A63D14;border-radius:8px;padding:18px 20px}.req .facts b{font:600 22px/28px "Libre Caslon Text"}
/* tarjetas */
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.card{background:#fff;border:1px solid #E3D6BA;border-radius:10px;overflow:hidden}.card picture img{width:100%;aspect-ratio:4/3;object-fit:cover}
.card .t{padding:22px 22px 24px}.card h3{font-size:21px;line-height:27px;margin:0 0 8px}.card p{margin:0;color:#5A4332;font-size:15px;line-height:24px}
.facts{margin-top:40px;display:grid;grid-template-columns:repeat(3,1fr);gap:24px;border-top:1px solid #D9C9A8;padding-top:26px}.facts b{display:block;margin-bottom:6px}.facts span{color:#5A4332;font-size:15px}
/* elaboración */
.brew{display:grid;grid-template-columns:6fr 5fr;gap:64px;align-items:center}.brew figure{margin:0}.brew img{border-radius:10px}.brew figcaption{font-size:12px;color:#5A4332;margin-top:8px}
.brew h2{font-size:40px;line-height:46px;letter-spacing:-.01em;margin:12px 0 18px}.brew .lead{color:#5A4332;font-size:18px;line-height:30px;margin:0 0 28px}
.tr{display:grid;gap:22px}.tr>div{display:flex;gap:14px}.tr .ic{flex:none;color:#A63D14;margin-top:2px}.tr h3{font-size:19px;margin:0 0 4px}.tr p{margin:0;color:#5A4332;font-size:15px}
/* faq */
.faq{max-width:820px;margin:0 auto}.faq details{border-bottom:1px solid #D9C9A8}.faq details:first-child{border-top:1px solid #D9C9A8}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 4px;font:600 18px/26px "Work Sans"}
.faq summary::-webkit-details-marker{display:none}.faq summary::after{content:"+";font:400 28px/1 "Work Sans";color:#5A4332}.faq details[open] summary::after{content:"–"}
.faq .a{padding:0 4px 22px;color:#5A4332;font-size:16px;line-height:26px;margin:0}
/* final */
.end{position:relative;color:#FBF5E6;text-align:center;overflow:hidden}.end .bgimg,.end .bgimg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.end::after{content:"";position:absolute;inset:0;background:rgba(32,20,13,.86)}.end .bx{position:relative;z-index:1;padding:110px 40px 120px}
.end h2{font-size:44px;line-height:50px;margin:12px 0 14px}.end p{color:#EFE4CC;font-size:18px;margin:0 0 30px}.end .row{display:flex;justify-content:center;gap:28px;align-items:center}.end .lnk{color:#FBF5E6}
/* pie + barra */
.foot{background:#20140D;color:#E6D9BC;padding:56px 0 120px;font-size:14px}.foot .bx{display:grid;grid-template-columns:2fr 1fr 2fr;gap:40px}.foot .brand-logo img{height:40px;width:auto}
.foot nav{display:grid;gap:8px}.foot a{color:#FBF5E6}.foot .cr{grid-column:1/-1;border-top:1px solid #3A2A1F;padding-top:18px;font-size:12px;color:#CBBE9F}
.ctabar{position:fixed;left:0;right:0;bottom:0;z-index:60;background:#1F3A2B;color:#FBF5E6}.ctabar .bx{display:flex;align-items:center;gap:24px;height:68px}.ctabar p{margin:0}.ctabar .tel{color:#FBF5E6;font-weight:600;margin-left:auto}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ===== Desarrollo: añadidos ===== */
.form .err{display:none;color:#A63D14;font-size:13px;font-weight:600;margin:-10px 0 14px}.form .inv+.err{display:block}.form input.inv{border-color:#A63D14}
.form button.cta{border:0;cursor:pointer}
.note.ok{color:#0B6733}
.wa-status{margin:10px 0 0;text-align:center;font-size:14px}
.cta[aria-disabled]{opacity:.6}
.stab{overflow-x:auto}

/* ----- encabezado: escritorio vs. móvil ----- */
.dk{display:flex;align-items:center;flex:1 1 auto!important}.mb-btn,.mb-panel,.m-cta,.ctabar .tel .m{display:none}
/* ----- tablet (768–1180), interpolado entre escritorio y móvil ----- */
@media (max-width:1180px){
 .hd .brand-logo{padding-right:20px;margin-right:20px}.hd .brand-logo img{width:190px;height:40px}.hd nav.main{gap:20px}
 .hero .bx{gap:40px}.hero h1{font-size:46px;line-height:52px}.cards{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:1023px) and (min-width:768px){
 .bx{padding:0 28px}.hd .dk .cta{display:none}.hd .lang{margin-left:auto;margin-right:0}
 .hero .bx{grid-template-columns:minmax(0,1fr)}.sim,.spec,.brew{grid-template-columns:1fr}.stage{min-height:0}
 .steps ol{grid-template-columns:1fr;gap:20px}.steps li{border:0;padding:0}.foot .bx{grid-template-columns:1fr 1fr}
}
/* ===== móvil (≤767 px) — reglas de mobile.html / mobile_en.html ("móvil 390") ===== */
@media (max-width:767px){
.dk{display:none}.mb-btn{display:inline-flex}.mb-panel:not([hidden]){display:block}.m-cta{display:block}
.ctabar .tel .d{display:none}.ctabar .tel .m{display:inline}
.hd .bx{position:relative}.hero .bx{grid-template-columns:minmax(0,1fr)}.mini>div{min-width:0}
body{font-size:16px;line-height:26px}.bx{padding:0 20px}
.hd .bx{height:64px;justify-content:space-between}.hd .brand-logo{border:0;padding:4px 0;margin:0;height:auto;min-height:44px}.hd .brand-logo img{height:36px;width:171px}
.mb-btn{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border:1px solid #D9C9A8;border-radius:8px;background:#fff;color:#20140D;cursor:pointer}
.mb-btn .x{display:none}.mb-btn[aria-expanded=true] .x{display:block}.mb-btn[aria-expanded=true] .h{display:none}
.mb-panel{position:absolute;left:0;right:0;top:64px;background:#FBF5E6;border-bottom:1px solid #E3D6BA;box-shadow:0 12px 24px rgba(32,20,13,.12);padding:8px 20px 22px}.mb-panel[hidden]{display:none}
.mb-panel nav.main{display:grid;gap:0;margin:0}.mb-panel nav.main a{display:flex;align-items:center;min-height:52px;border-bottom:1px solid #E3D6BA;font-size:17px;color:#20140D;text-decoration:none;padding:0}
.mb-panel .mrow{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:16px 0}.mb-panel .mrow a.lnk{display:inline-flex;align-items:center;min-height:44px}
.mb-panel .lang a{padding:14px 16px;font-size:13px}.mb-panel .cta{width:100%}
.hero .bx{grid-template-columns:1fr;gap:28px;padding-top:32px;padding-bottom:40px}
.hero::after{background:linear-gradient(180deg,rgba(32,20,13,.86),rgba(32,20,13,.92))}
.hero h1{font-size:34px;line-height:40px;margin:12px 0 14px}.hero .sub{font-size:17px;line-height:27px;margin-bottom:20px}
.hero .kick{font-size:11px;line-height:16px}.m-cta{margin:0 0 22px}.m-cta .cta{width:100%;height:56px}
.ticks li{font-size:15px}.mini{margin-top:6px}.mini .lnk{display:inline-flex;min-height:44px;align-items:center}
.form{padding:22px 18px}.form input[type=text]{height:52px;font-size:16px}.seg{grid-template-columns:1fr}.seg label{height:52px;justify-content:flex-start;padding:0 16px}
.form .alt{line-height:28px}.form .alt a{display:inline-block;padding:8px 0}
.credit{position:static;display:block;margin:0;border-radius:0;text-align:right}
.steps ol{grid-template-columns:1fr;padding:28px 0;gap:22px}.steps li{border:0;padding:0}
.sec{padding:64px 0}.head{margin-bottom:32px}.head h2,.brew h2{font-size:30px;line-height:36px}.head p{font-size:16px;line-height:26px}
.sim{grid-template-columns:1fr;padding:20px 16px;gap:28px}.sty3{grid-template-columns:1fr}.sty3 label{min-height:56px;align-items:center}
.fmt{grid-template-columns:1fr}.fmt label{height:52px;justify-content:flex-start;padding:0 16px;font-size:16px}.up{height:56px}
.stage{min-height:0;padding:22px 10px 56px;order:-1}.shelf{gap:16px}.shelf::before{bottom:56px}
.pkw[data-k=c12] .pk{width:78px;height:145px}.pkw[data-k=c16] .pk{width:78px;height:186px}.pkw[data-k=bot] .pk{width:72px;height:270px}
.pkw .cap{height:56px;font-size:13px;min-width:44px}.pkw .cap small{font-size:12px}
.cards{grid-template-columns:1fr;gap:18px}.spec{grid-template-columns:1fr;margin-top:32px}.stab,.lab{padding:18px 14px}
.stab th,.stab td{padding:12px 4px;font-size:13px}.stab thead th{font-size:10px;letter-spacing:.02em}.stab tbody th b{font-size:17px}
.req .facts{grid-template-columns:1fr;gap:12px}
.brew{grid-template-columns:1fr;gap:28px}.tr>div>div{display:block}.tr h3{margin-bottom:2px}
.faq summary{min-height:56px;padding:14px 4px;font-size:17px}
.end .bx{padding:64px 20px 72px}.end h2{font-size:32px;line-height:38px}.end .row{flex-direction:column;gap:12px}.end .row .cta{width:100%}.end .row .lnk{display:inline-flex;min-height:44px;align-items:center}
.foot{padding:44px 0 110px}.foot .bx{grid-template-columns:1fr;gap:24px}.foot nav a,.foot p a{display:inline-flex;min-height:44px;align-items:center}
.ctabar .bx{height:72px;gap:10px;padding:0 12px}.ctabar p{display:none}.ctabar .tel{margin:0;display:inline-flex;align-items:center;justify-content:center;min-width:48px;height:48px;border:1px solid rgba(251,245,230,.5);border-radius:8px;padding:0 14px;gap:6px;font-size:15px;white-space:nowrap}.ctabar .cta{flex:1;height:52px}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}html{scroll-behavior:auto}}
.ctabar .tel{white-space:nowrap}
/* QA M3: objetivos táctiles ≥ 24 px (móvil ya usa 44 px) */
@media (min-width:768px){
.lang a{display:inline-flex;align-items:center;min-height:24px;min-width:24px;justify-content:center}
.mini .lnk{display:inline-flex;align-items:center;min-height:24px}
.form .alt a{display:inline-block;padding:4px 0;line-height:16px}
}
