:root{
  --bg:#fbf8f2;--surface:#fff;--ink:#1f1a17;--muted:#6f655e;--line:#e9e1d8;
  --brand:#8c4d2e;--brand-ink:#fff;--dark:#17110e;--ok:#2f6b4f;--warn:#9a5b12;--err:#9f342d;
  --radius:22px;--shadow:0 18px 60px rgba(40,26,18,.10);
  --font:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:clip}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);line-height:1.55;-webkit-font-smoothing:antialiased}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer}
a{color:inherit}
img{max-width:100%;display:block}
.hidden{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:3px solid var(--brand);outline-offset:2px}

/* Cabecera */
.announcement{background:var(--dark);color:#fff;text-align:center;padding:9px 16px;font-size:13px}
.announcement a{color:#f3c79c;text-decoration:underline}
.header{position:sticky;top:0;z-index:40;background:rgba(251,248,242,.9);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.nav{max-width:1200px;margin:auto;padding:14px 22px;display:flex;align-items:center;gap:20px}
.logo{font-weight:900;letter-spacing:-.04em;font-size:22px;text-decoration:none}
.logo i{font-style:normal;color:var(--brand)}
.logo img{display:block;height:30px;width:auto}
.logo-pie{display:block;height:24px;width:auto;margin-bottom:10px}
.navlinks{display:flex;gap:20px;margin-left:auto;color:var(--muted);font-size:14px}
.navlinks a{text-decoration:none}
.navlinks a:hover{color:var(--ink)}
.btn{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:11px 16px;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;font-weight:600;font-size:14px}
.btn.primary{background:var(--dark);color:#fff;border-color:var(--dark)}
.btn.brand{background:var(--brand);color:var(--brand-ink);border-color:var(--brand)}
.btn.ghost{background:transparent}
.btn.full{width:100%}
.btn:disabled{opacity:.55;cursor:not-allowed}
.count{min-width:20px;height:20px;border-radius:99px;background:var(--brand);color:#fff;font-size:11px;display:grid;place-items:center;padding:0 6px}

/* Hero */
.hero{max-width:1200px;margin:auto;padding:64px 22px 36px;display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
.eyebrow{display:inline-flex;gap:8px;font-size:12px;text-transform:uppercase;letter-spacing:.16em;font-weight:800;color:var(--brand)}
.hero h1{font-size:clamp(42px,6.4vw,80px);line-height:.95;letter-spacing:-.06em;margin:16px 0 22px}
.hero p{font-size:18px;color:var(--muted);max-width:620px}
.hero-cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}
.trust{display:flex;gap:18px;flex-wrap:wrap;margin-top:26px;color:var(--muted);font-size:13px}
.trust span:before{content:'✓';color:var(--brand);font-weight:900;margin-right:6px}
.hero-stack{height:470px;position:relative}
.hero-stack img{position:absolute;width:240px;aspect-ratio:7/10;object-fit:cover;border-radius:10px 16px 16px 10px;box-shadow:0 35px 80px rgba(31,18,12,.25)}
.hero-stack img:nth-child(1){right:14%;top:10px;transform:rotate(5deg);z-index:3}
.hero-stack img:nth-child(2){left:6%;top:80px;transform:rotate(-8deg);z-index:2}
.hero-stack img:nth-child(3){right:0;top:130px;transform:rotate(13deg);z-index:1}

/* Franja de pasos */
.value-strip{background:var(--dark);color:#fff}
.values{max-width:1200px;margin:auto;padding:32px 22px;display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.value b{display:block;margin-bottom:5px}
.value span{color:#cfc5bd;font-size:13px}

/* Catálogo */
.section{max-width:1200px;margin:auto;padding:58px 22px}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:22px}
.section h2{font-size:clamp(32px,5vw,52px);letter-spacing:-.05em;line-height:1;margin:6px 0 0}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0 28px}
.chip{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:8px 13px;color:var(--muted);font-size:14px}
.chip[aria-pressed=true]{background:var(--dark);color:#fff;border-color:var(--dark)}
.search{min-width:240px;border:1px solid var(--line);background:#fff;border-radius:999px;padding:11px 16px}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:28px 18px}
.card{position:relative;display:flex;flex-direction:column}
.cover-wrap{background:#eee6dd;border-radius:18px;padding:14px;aspect-ratio:1/1.3;display:grid;place-items:center;transition:.25s;border:0;width:100%}
.card:hover .cover-wrap{transform:translateY(-4px);box-shadow:var(--shadow)}
.cover{width:88%;height:auto;aspect-ratio:7/10;object-fit:cover;border-radius:6px 12px 12px 6px;box-shadow:0 22px 38px rgba(30,20,14,.25);background:#d8cbbd}
.badge{position:absolute;top:12px;left:12px;z-index:3;background:#fff;border-radius:999px;padding:6px 10px;font-size:11px;font-weight:800;box-shadow:0 4px 16px rgba(0,0,0,.08)}
.info{padding:14px 4px 0;display:flex;flex-direction:column;flex:1}
.cat{font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}
.name{font-size:17px;font-weight:800;letter-spacing:-.02em;margin:3px 0 4px;line-height:1.25}
.meta{font-size:13px;color:var(--muted)}
.price{font-weight:900}
.rating{font-size:13px;font-weight:700;color:var(--ink);margin:2px 0 4px}
.rating span[aria-hidden]{color:#c8902e;letter-spacing:1px}
.rating i{font-style:normal;color:#e2d8cc}
.calificar{flex-basis:100%;display:flex;align-items:center;gap:2px;margin-top:6px}
.calificar .fine{margin-right:8px}
.estrella{border:0;background:none;padding:2px 3px;font-size:26px;line-height:1;color:#e2d8cc;transition:color .12s,transform .12s}
.estrella.on{color:#c8902e}
.estrella:hover{transform:scale(1.15)}
.card-actions{display:flex;gap:7px;margin-top:12px}
.card-actions .btn{padding:9px 12px;font-size:13px;flex:1}
.empty{padding:50px;text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:var(--radius);grid-column:1/-1}

/* Preguntas frecuentes */
.faq{max-width:820px}
.faq details{border-bottom:1px solid var(--line);padding:16px 0}
.faq summary{font-weight:700;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq summary::after{content:'+';color:var(--brand);font-weight:900}
.faq details[open] summary::after{content:'–'}
.faq p{color:var(--muted);margin:10px 0 0}

/* Pie */
.footer{border-top:1px solid var(--line)}
.footer-in{max-width:1200px;margin:auto;padding:40px 22px 80px;display:grid;grid-template-columns:2fr 1fr 1fr;gap:30px;color:var(--muted);font-size:13px}
.footer b{color:var(--ink);display:block;margin-bottom:10px}
.footer a{display:block;margin:4px 0;text-decoration:none}
.footer a:hover{color:var(--ink);text-decoration:underline}
.arrepentimiento{display:inline-block!important;margin-top:14px!important;border:2px solid var(--brand);color:var(--brand);font-weight:800;border-radius:999px;padding:8px 14px}
.data-fiscal{margin-top:16px}

/* Carrito, modal y checkout */
.backdrop{position:fixed;inset:0;background:rgba(20,14,11,.46);backdrop-filter:blur(4px);z-index:70;opacity:0;pointer-events:none;transition:.2s}
.backdrop.open{opacity:1;pointer-events:auto}
.drawer{position:fixed;right:0;top:0;bottom:0;width:min(460px,100%);background:#fff;z-index:80;transform:translateX(105%);transition:.28s;display:flex;flex-direction:column}
.drawer.open{transform:none}
.drawer-head{padding:20px 22px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}
.drawer-body{padding:12px 22px;overflow:auto;flex:1}
.drawer-foot{padding:18px 22px;border-top:1px solid var(--line)}
.line-item{display:grid;grid-template-columns:52px 1fr auto;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);align-items:center}
.line-item img{width:52px;height:auto;aspect-ratio:7/10;object-fit:cover;border-radius:4px}
.remove{border:0;background:none;color:var(--err);padding:0;font-size:13px}
.total-row{display:flex;justify-content:space-between;margin:7px 0}
.total-row.big{font-size:20px;font-weight:900;margin:12px 0}
.fine{font-size:12px;color:var(--muted)}
.icon-btn{border:1px solid var(--line);background:#fff;border-radius:999px;width:40px;height:40px;display:grid;place-items:center}

.modal{position:fixed;z-index:90;left:50%;top:50%;transform:translate(-50%,-46%) scale(.98);width:min(940px,calc(100% - 28px));max-height:90vh;overflow:auto;background:#fff;border-radius:28px;box-shadow:0 35px 100px rgba(0,0,0,.3);opacity:0;pointer-events:none;transition:.2s}
.modal.open{opacity:1;pointer-events:auto;transform:translate(-50%,-50%) scale(1)}
.modal-close{position:sticky;top:14px;float:right;margin:14px;z-index:4}
.product-grid{display:grid;grid-template-columns:.9fr 1.1fr}
.product-visual{background:#eee6dd;padding:50px;display:grid;place-items:center}
.product-visual .cover{width:min(380px,90%)}
.product-copy{padding:52px 44px}
.product-copy h2{font-size:40px;letter-spacing:-.05em;line-height:1.02;margin:10px 0 12px}
.product-copy p{color:var(--muted)}
.bullets{padding:0;list-style:none;margin:22px 0}
.bullets li{padding:9px 0;border-bottom:1px solid var(--line)}
.bullets li:before{content:'✓';font-weight:900;color:var(--brand);margin-right:9px}

.checkout{position:fixed;inset:0;z-index:100;background:var(--bg);overflow:auto;display:none}
.checkout.open{display:block}
.checkout-top{max-width:1080px;margin:auto;padding:20px 22px;display:flex;justify-content:space-between;align-items:center}
.checkout-grid{max-width:1080px;margin:auto;padding:10px 22px 80px;display:grid;grid-template-columns:1.1fr .9fr;gap:40px}
.checkout h1{font-size:40px;letter-spacing:-.05em;margin:0 0 16px}
.panel{background:#fff;border:1px solid var(--line);border-radius:24px;padding:24px}
.panel h3{margin:0 0 14px}
.field{margin-bottom:14px}
.field label{display:block;font-size:13px;font-weight:700;margin-bottom:6px}
.field input,.field textarea{width:100%;border:1px solid var(--line);border-radius:12px;padding:12px 13px;background:#fff}
.field input:focus,.field textarea:focus{border-color:var(--brand);outline:none}
.check{display:flex;gap:10px;align-items:flex-start;font-size:14px;margin:14px 0}
.check input{margin-top:4px;width:18px;height:18px;flex:none}
.pay-option{border:2px solid var(--brand);border-radius:16px;padding:14px;display:flex;justify-content:space-between;align-items:center;margin:14px 0}
.mp{font-weight:900;color:#0a7fd1}
.alert{border-radius:14px;padding:12px 14px;font-size:14px;margin:12px 0}
.alert.err{background:#fbecea;color:var(--err)}
.alert.ok{background:#e7f2ec;color:var(--ok)}
.alert.warn{background:#fdf2e0;color:var(--warn)}

.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,20px);background:var(--dark);color:#fff;padding:11px 16px;border-radius:999px;z-index:250;opacity:0;pointer-events:none;transition:.2s;font-size:14px}
.toast.show{opacity:1;transform:translate(-50%,0)}
.mobile-buy{display:none;position:fixed;left:10px;right:10px;bottom:10px;z-index:55;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);border:1px solid var(--line);padding:8px;border-radius:999px;box-shadow:0 15px 50px rgba(0,0,0,.14)}

/* Páginas simples (legales, gracias, arrepentimiento) */
.page{max-width:820px;margin:auto;padding:48px 22px 80px}
.page h1{font-size:clamp(34px,5vw,48px);letter-spacing:-.04em;line-height:1.05;margin:8px 0 18px}
.page h2{font-size:22px;margin:34px 0 8px;letter-spacing:-.02em}
.page p,.page li{color:#3c342f}
.page .lead{font-size:18px;color:var(--muted)}
.download-list{list-style:none;padding:0;margin:18px 0}
.download-list li{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;padding:14px 0;border-bottom:1px solid var(--line)}
.spinner{width:22px;height:22px;border:3px solid var(--line);border-top-color:var(--brand);border-radius:50%;animation:gira 1s linear infinite;display:inline-block;vertical-align:middle;margin-right:8px}
@keyframes gira{to{transform:rotate(360deg)}}

@media(max-width:960px){
  .grid{grid-template-columns:repeat(3,1fr)}
  .hero{grid-template-columns:1fr}
  .hero-stack{height:360px}
  .values{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:700px){
  .announcement{font-size:12px}
  .nav{padding:11px 16px}
  .navlinks{display:none}
  .nav .btn{margin-left:auto}
  .hero{padding:40px 16px 20px;gap:20px}
  .hero h1{font-size:46px}
  .hero-stack{height:290px}
  .hero-stack img{width:160px}
  .hero-stack img:nth-child(3){right:12px}
  .section{padding:42px 16px}
  .section-head{display:block}
  .search{width:100%;min-width:0;margin-top:14px}
  .grid{grid-template-columns:repeat(2,1fr);gap:22px 10px}
  .cover-wrap{padding:12px;border-radius:14px}
  .cover{width:90%}
  .name{font-size:14px}
  .card-actions{flex-direction:column}
  .values{padding:28px 16px}
  .footer-in{grid-template-columns:1fr 1fr;padding:30px 16px 96px}
  .footer-in>div:first-child{grid-column:1/-1}
  .product-grid{grid-template-columns:1fr}
  .product-visual{padding:58px 24px 24px}
  .modal-close{margin-bottom:-60px}
  .product-copy{padding:26px 20px 30px}
  .product-copy h2{font-size:30px}
  .checkout-grid{grid-template-columns:1fr;padding:6px 16px 70px;gap:16px}
  .checkout-grid>div:last-child{order:-1}
  .checkout h1{font-size:32px}
  .mobile-buy{display:block}
  .page{padding:32px 16px 70px}
}