:root{
  --ink:#1B1220; --berry:#6320F1; --plum:#4A14C6; --blush:#F3EEFC;
  --paper:#FFFFFF; --muted:#8A7F86; --line:#EFE2E8; --gold:#B98A3E;
}
*{box-sizing:border-box; margin:0; padding:0}
body{font-family:'Archivo',system-ui,sans-serif; color:var(--ink); background:var(--blush); line-height:1.5}
img{display:block; max-width:100%}
a{color:inherit; text-decoration:none}
button{font-family:inherit; cursor:pointer; border:none; background:none; color:inherit}
:focus-visible{outline:2px solid var(--berry); outline-offset:2px}
@media (prefers-reduced-motion:reduce){*{animation:none!important; transition:none!important}}

.announce{background:var(--ink); color:#fff; text-align:center; font-size:12.5px; letter-spacing:.02em; padding:9px 16px}
.announce b{color:#C9B2F7; font-weight:600}

header{background:var(--paper); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:30}
.masthead{max-width:1040px; margin:0 auto; padding:18px 20px 14px; display:flex; align-items:center; justify-content:space-between; gap:16px}
.wordmark{font-family:'Bodoni Moda',serif; font-weight:800; font-size:28px; letter-spacing:.01em; line-height:1; white-space:nowrap}
.wordmark em{font-style:italic; font-weight:500; color:var(--berry)}
.header-actions{display:flex; align-items:center; gap:4px}
.header-actions .txt{font-size:13px; font-weight:600; padding:8px 10px}
.icon-btn{width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center; position:relative}
.icon-btn:hover{background:var(--blush)}
.icon-btn svg{width:22px; height:22px}
.cart-count{position:absolute; top:5px; right:5px; background:var(--berry); color:#fff; font-size:10px; font-weight:700; min-width:17px; height:17px; border-radius:9px; display:flex; align-items:center; justify-content:center; padding:0 4px}

.catnav{max-width:1040px; margin:0 auto; padding:0 20px 14px; display:flex; gap:8px; overflow-x:auto; scrollbar-width:none}
.catnav::-webkit-scrollbar{display:none}
.chip{flex:0 0 auto; padding:8px 15px; border-radius:22px; font-size:13.5px; font-weight:500; color:var(--ink); border:1px solid var(--line); background:var(--paper); white-space:nowrap}
.chip:hover{border-color:var(--berry)}
.chip.active{background:var(--ink); color:#fff; border-color:var(--ink)}

.intro{max-width:1040px; margin:0 auto; padding:38px 20px 26px; text-align:center}
.intro .eyebrow{font-size:11px; letter-spacing:.28em; text-transform:uppercase; color:var(--berry); font-weight:600; margin-bottom:14px}
.intro h1{font-family:'Bodoni Moda',serif; font-weight:500; font-size:clamp(26px,5vw,40px); line-height:1.12; max-width:16ch; margin:0 auto}
.intro .rule{width:44px; height:2px; background:var(--gold); margin:18px auto 0}
.intro p{color:var(--muted); font-size:14.5px; margin-top:14px; max-width:44ch; margin-left:auto; margin-right:auto}

.grid{max-width:1040px; margin:0 auto; padding:8px 20px 60px; display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:26px 20px}
@media(max-width:560px){.grid{grid-template-columns:1fr 1fr; gap:22px 12px; padding:8px 14px 50px}}
.card{background:var(--paper); border-radius:4px; overflow:hidden; display:flex; flex-direction:column; transition:transform .18s}
.card:hover{transform:translateY(-3px)}
.shot{aspect-ratio:3/4; position:relative; display:flex; align-items:flex-end; justify-content:center; padding:16px; overflow:hidden}
.shot img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.shot .shot-name{font-family:'Bodoni Moda',serif; font-style:italic; font-size:15px; color:rgba(27,18,32,.5); text-align:center; line-height:1.2}
.shot .wm{position:absolute; top:12px; left:0; right:0; text-align:center; font-family:'Bodoni Moda',serif; font-size:10px; letter-spacing:.3em; color:rgba(27,18,32,.28); text-transform:uppercase}
.tag{position:absolute; top:12px; right:12px; font-size:10px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:4px 9px; border-radius:2px; background:var(--ink); color:#fff; z-index:2}
.tag.ultima{background:var(--berry)}
.card-body{padding:12px 6px 4px}
.card-body .cname{font-size:14.5px; font-weight:600; line-height:1.25}
.card-body .cmeta{font-size:12.5px; color:var(--muted); margin-top:3px; display:flex; gap:8px; align-items:center}
.card-body .size-pill{border:1px solid var(--line); border-radius:3px; padding:1px 6px; font-size:11px; font-weight:600; color:var(--ink)}
.card-body .cprice{font-size:15px; font-weight:700; margin-top:8px}
.card-body .cprice .origin{font-size:11px; font-weight:500; color:var(--gold); margin-left:6px}

/* Detalle de producto (pagina) */
.detail-wrap{max-width:1040px; margin:0 auto; padding:24px 20px 60px}
.back{font-size:13px; color:var(--berry); font-weight:600; display:inline-flex; gap:5px; align-items:center; margin-bottom:16px}
.detail{background:var(--paper); border-radius:8px; overflow:hidden; display:grid; grid-template-columns:1fr}
@media(min-width:760px){.detail{grid-template-columns:1fr 1fr}}
.detail .shot{aspect-ratio:3/4}
.detail-info{padding:30px 28px}
.detail-info .dcat{font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--berry); font-weight:600}
.detail-info h1{font-family:'Bodoni Moda',serif; font-weight:500; font-size:30px; line-height:1.15; margin:8px 0 4px}
.detail-info .dprice{font-size:24px; font-weight:700; margin:12px 0}
.drow{display:flex; gap:10px; margin:16px 0; flex-wrap:wrap}
.dbit{border:1px solid var(--line); border-radius:4px; padding:8px 13px; font-size:13px}
.dbit b{display:block; font-size:11px; color:var(--muted); font-weight:600; text-transform:uppercase; margin-bottom:2px}
.ddesc{color:var(--muted); font-size:14px; margin:16px 0 22px; line-height:1.6}
.unique-note{display:flex; align-items:center; gap:8px; font-size:13px; color:var(--berry); font-weight:600; margin-bottom:20px}
.unique-note svg{width:16px; height:16px}
.btn-primary{display:block; width:100%; text-align:center; background:var(--berry); color:#fff; font-size:15.5px; font-weight:700; padding:15px; border-radius:8px}
.btn-primary:hover{background:var(--plum)}
.btn-ghost{display:block; width:100%; text-align:center; border:1.5px solid var(--line); border-radius:8px; padding:14px; font-weight:600; margin-top:10px}
.sold{background:var(--line); color:var(--muted); text-align:center; padding:15px; border-radius:8px; font-weight:600}

/* Carrito / checkout */
.page{max-width:640px; margin:0 auto; padding:24px 20px 60px}
.page h1{font-family:'Bodoni Moda',serif; font-weight:500; font-size:28px; margin-bottom:18px}
.cart-item{display:flex; gap:14px; background:var(--paper); border:1px solid var(--line); border-radius:12px; padding:12px; margin-bottom:10px; align-items:center}
.cart-item .ci-shot{width:60px; height:78px; border-radius:4px; flex:0 0 60px; overflow:hidden; position:relative}
.cart-item .ci-shot img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.cart-item .ci-info{flex:1; min-width:0}
.cart-item .ci-info b{font-size:14.5px; display:block}
.cart-item .ci-info small{color:var(--muted); font-size:12.5px}
.cart-item .ci-remove{color:var(--muted); font-size:12px; text-decoration:underline; margin-top:5px; display:inline-block}
.cart-item .ci-price{font-weight:700; text-align:right}
.summary{background:var(--paper); border:1px solid var(--line); border-radius:12px; padding:18px; margin-top:8px}
.total-row{display:flex; justify-content:space-between; align-items:baseline; margin-bottom:6px}
.total-row .tv{font-family:'Bodoni Moda',serif; font-size:26px; font-weight:700}
.foot-note{font-size:12.5px; color:var(--muted); margin:8px 0 14px}
.empty{text-align:center; color:var(--muted); padding:60px 20px}
.empty .mk{font-family:'Bodoni Moda',serif; font-style:italic; font-size:30px; color:var(--line); margin-bottom:10px}

label{display:block; font-size:12px; font-weight:600; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); margin:16px 0 7px}
input,select{width:100%; padding:12px 13px; border:1.5px solid var(--line); border-radius:9px; font-size:15px; font-family:inherit}
input:focus,select:focus{outline:none; border-color:var(--berry)}
.delivery-opt{display:flex; gap:11px; align-items:flex-start; border:1.5px solid var(--line); border-radius:10px; padding:13px; margin-bottom:9px; cursor:pointer}
.delivery-opt.sel{border-color:var(--berry); background:var(--blush)}
.delivery-opt .radio{width:20px; height:20px; border-radius:50%; border:2px solid var(--line); flex:0 0 20px; margin-top:1px; position:relative}
.delivery-opt.sel .radio{border-color:var(--berry)}
.delivery-opt.sel .radio::after{content:""; position:absolute; inset:3px; border-radius:50%; background:var(--berry)}
.delivery-opt .do-txt b{font-size:14px; display:block}
.delivery-opt .do-txt small{font-size:12.5px; color:var(--muted)}
.login-prompt{background:var(--paper); border:1px solid var(--line); border-radius:12px; padding:22px; text-align:center; margin-top:8px}
.login-prompt p{color:var(--muted); font-size:14px; margin-bottom:16px}
.mp-note{display:flex; align-items:center; justify-content:center; gap:7px; font-size:12.5px; color:var(--muted); margin-top:12px}

footer{background:var(--ink); color:#cbb8c2; padding:40px 20px; text-align:center; font-size:13px; margin-top:20px}
footer .fw{font-family:'Bodoni Moda',serif; font-size:24px; font-weight:700; color:#fff; margin-bottom:10px}
footer .fw em{font-style:italic; color:#C9B2F7; font-weight:500}
footer .flinks{display:flex; gap:20px; justify-content:center; margin:14px 0; flex-wrap:wrap}
footer .fine{color:#6f5f69; font-size:11.5px; margin-top:14px}