/* ==========================================================================
   INTICASH — boceto Seonergy
   Sistema visual tomado de ascella.qodeinteractive.com: Poppins fino en
   versalitas espaciadas para todo lo pequeño, Italiana enorme para los
   titulares de portada, mucho blanco, retícula de producto sobre fondo
   claro, bloques de imagen escalonados y una banda beige a sangre.
   Colores de marca sacados del logo real: amarillo #F8C000 y gris #303030.
   ========================================================================== */
:root{
  --ink:#2d2d2d;
  --dark:#141414;
  --mute:#6e6e6e;
  --mute-2:#a6a6a6;
  --line:#efefef;
  --line-2:#e3e3e3;
  --cream:#f6f4f2;
  --sand:#dcd3c8;
  --sand-2:#e8e1d8;
  --yellow:#F8C000;
  --yellow-dk:#d9a800;
  --wa:#25d366;
  --ease:cubic-bezier(.22,1,.36,1);
  --gutter:clamp(18px,4vw,60px);
  --maxw:1400px;
}
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:hidden;}
body{
  margin:0;background:#fff;color:var(--ink);
  font-family:'Raleway',system-ui,-apple-system,sans-serif;
  font-size:14px;line-height:1.786;font-weight:400;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
svg{display:block;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;margin:0;padding:0;}
p{margin:0;}
button{font:inherit;color:inherit;background:none;border:none;padding:0;cursor:pointer;}
input{font:inherit;color:inherit;}
::selection{background:var(--yellow);color:var(--dark);}

h1,h2,h3,h4{margin:0;font-weight:400;color:var(--dark);line-height:1.1;}
.display{font-family:'Italiana',serif;font-weight:400;letter-spacing:-.01em;}
.caps{font-family:'Raleway',sans-serif;text-transform:uppercase;letter-spacing:.03em;}
.sec-title{font-size:clamp(1.6rem,2.6vw,2.125rem);text-transform:uppercase;letter-spacing:.005em;font-weight:400;text-align:center;line-height:1.18;}
.sec-title.sm{font-size:clamp(1.3rem,2vw,1.6875rem);letter-spacing:.015em;}
.sec-head{text-align:center;margin-bottom:clamp(34px,4vw,58px);}
.sec-head p{max-width:52ch;margin:14px auto 0;color:var(--mute);font-size:.875rem;}

.wrap{max-width:var(--maxw);margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter);}
.pad{padding-top:clamp(64px,7.5vw,120px);padding-bottom:clamp(64px,7.5vw,120px);}
section[id]{scroll-margin-top:120px;}

/* ---------- botones ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:15px 32px;border:1px solid var(--dark);background:var(--dark);color:#fff;
  font-size:.75rem;font-weight:500;letter-spacing:.03em;text-transform:uppercase;white-space:nowrap;
  transition:background-color 260ms var(--ease),color 260ms var(--ease),border-color 260ms var(--ease);
}
.btn:hover{background:var(--yellow);border-color:var(--yellow);color:var(--dark);}
.btn-light{background:#fff;border-color:#fff;color:var(--dark);}
.btn-light:hover{background:var(--dark);border-color:var(--dark);color:#fff;}
.btn-line{background:transparent;color:var(--dark);}
.btn-line:hover{background:var(--dark);color:#fff;}
.btn-line.on-dark{border-color:rgba(255,255,255,.7);color:#fff;}
.btn-line.on-dark:hover{background:#fff;border-color:#fff;color:var(--dark);}
.link{display:inline-flex;align-items:center;gap:10px;font-size:.75rem;font-weight:500;letter-spacing:.03em;text-transform:uppercase;color:var(--dark);}
.link::after{content:"";width:22px;height:1px;background:currentColor;transition:width 260ms var(--ease);}
.link:hover::after{width:36px;}

/* ==========================================================================
   CABECERA
   ========================================================================== */
.topbar{background:var(--cream);font-size:.75rem;letter-spacing:.02em;color:var(--ink);}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;height:36px;}
.topbar a{font-weight:500;border-bottom:1px solid var(--yellow-dk);}
.topbar .r{display:flex;gap:22px;}
#hdr{position:sticky;top:0;z-index:70;background:#fff;transition:box-shadow 300ms var(--ease);}
#hdr.stuck{box-shadow:0 1px 20px rgba(20,20,20,.08);}
.bar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:96px;}
.bar .l,.bar .r{display:flex;align-items:center;gap:24px;font-size:.75rem;letter-spacing:.03em;text-transform:uppercase;font-weight:500;}
.bar .r{justify-content:flex-end;}
.bar .ico{display:inline-flex;align-items:center;gap:8px;color:var(--dark);position:relative;}
.bar .ico svg{width:17px;height:17px;stroke-width:1.4;}
.bar .ico .n{position:absolute;top:-8px;right:-11px;width:16px;height:16px;border-radius:50%;background:var(--yellow);color:var(--dark);font-size:.58rem;display:grid;place-items:center;font-weight:600;}
.brand img{height:44px;width:auto;}
.nav{display:flex;justify-content:center;gap:clamp(16px,2.1vw,34px);height:54px;align-items:center;border-top:1px solid var(--line);}
.nav a{font-size:.75rem;letter-spacing:.015em;text-transform:uppercase;font-weight:500;color:var(--dark);position:relative;padding:4px 0;white-space:nowrap;}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;background:var(--dark);transform:scaleX(0);transform-origin:left;transition:transform 300ms var(--ease);}
.nav a:hover::after,.nav a.on::after{transform:scaleX(1);}
.nav a.new{color:var(--yellow-dk);}
.burger{display:none;width:40px;height:40px;align-items:center;justify-content:center;}
.burger span{display:block;width:20px;height:1.5px;background:var(--dark);position:relative;}
.burger span::before,.burger span::after{content:"";position:absolute;left:0;width:20px;height:1.5px;background:var(--dark);}
.burger span::before{top:-6px;} .burger span::after{top:6px;}
#menu{position:fixed;inset:0;z-index:90;background:#fff;padding:22px var(--gutter) 60px;overflow-y:auto;
  opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity 260ms var(--ease),transform 360ms var(--ease),visibility 260ms;}
#menu.on{opacity:1;visibility:visible;transform:none;}
.m-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:26px;}
#menu li{border-bottom:1px solid var(--line);}
#menu li a{display:block;padding:15px 0;font-size:.9375rem;letter-spacing:.015em;text-transform:uppercase;font-weight:500;color:var(--dark);}
.m-cta{display:grid;gap:10px;margin-top:26px;}

/* ==========================================================================
   PORTADA
   ========================================================================== */
.hero{position:relative;height:clamp(460px,46vw,660px);overflow:hidden;background:#3b3f3a;}
.hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% 40%;}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,20,20,.55) 0%,rgba(20,20,20,.25) 45%,rgba(20,20,20,0) 75%);}
.hero .wrap{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;color:#fff;}
.hero .eyebrow{font-size:.75rem;letter-spacing:.03em;text-transform:uppercase;font-weight:500;margin-bottom:22px;opacity:.9;max-width:none;}
.hero h1{font-size:clamp(3.2rem,7.4vw,6.6rem);color:#fff;line-height:.98;max-width:9ch;text-shadow:0 2px 30px rgba(0,0,0,.25);}
.hero p{max-width:42ch;margin:20px 0 32px;font-size:.875rem;opacity:.92;}
.hero .cta{display:flex;gap:12px;flex-wrap:wrap;}

/* ==========================================================================
   PRODUCTO
   ========================================================================== */
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.8vw,30px);}
.grid-5{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(12px,1.6vw,26px);}
.prod{position:relative;}
.prod .ph{position:relative;background:var(--cream);overflow:hidden;aspect-ratio:1/1.03;}
.prod .ph img{width:100%;height:100%;object-fit:cover;mix-blend-mode:multiply;transition:transform 900ms var(--ease);}
.prod:hover .ph img{transform:scale(1.05);}
.prod .tag{position:absolute;top:12px;left:12px;background:var(--yellow);color:var(--dark);font-size:.6875rem;font-weight:600;letter-spacing:.03em;padding:4px 10px;}
.prod .tag.out{background:var(--dark);color:#fff;}
.prod .acts{position:absolute;right:12px;top:12px;display:flex;flex-direction:column;gap:8px;opacity:0;transform:translateX(6px);transition:opacity 260ms var(--ease),transform 260ms var(--ease);}
.prod:hover .acts{opacity:1;transform:none;}
.prod .acts span{width:32px;height:32px;background:#fff;display:grid;place-items:center;color:var(--dark);box-shadow:0 6px 14px -8px rgba(0,0,0,.3);}
.prod .acts svg{width:14px;height:14px;stroke-width:1.5;}
.prod .wa{position:absolute;left:0;right:0;bottom:0;background:var(--dark);color:#fff;font-size:.75rem;letter-spacing:.03em;text-transform:uppercase;font-weight:500;padding:12px;text-align:center;transform:translateY(100%);transition:transform 300ms var(--ease);display:flex;align-items:center;justify-content:center;gap:8px;}
.prod .wa svg{width:13px;height:13px;}
.prod:hover .wa{transform:none;}
.prod .bd{padding-top:14px;}
.prod .bd b{display:block;font-size:.9375rem;font-weight:500;letter-spacing:.015em;text-transform:uppercase;color:var(--dark);line-height:1.45;}
.prod .bd i{display:block;font-style:normal;font-size:.75rem;letter-spacing:.03em;color:var(--mute);margin-top:4px;}
.prod .bd .pr{margin-top:8px;font-size:.875rem;font-weight:500;color:var(--dark);}
.prod .bd .pr s{color:var(--mute-2);font-weight:300;margin-right:8px;}
.prod .bd .pr em{font-style:normal;font-size:.75rem;color:var(--mute);letter-spacing:.03em;}

/* ==========================================================================
   CATEGORÍAS ESCALONADAS
   ========================================================================== */
.stag{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,70px);max-width:980px;margin:0 auto;}
.stag .col{display:flex;flex-direction:column;gap:clamp(40px,5vw,80px);}
.stag .col.b{padding-top:clamp(50px,7vw,110px);}
.tile{position:relative;display:block;overflow:hidden;aspect-ratio:414/503;background:var(--cream);}
.tile img{width:100%;height:100%;object-fit:cover;transition:transform 1000ms var(--ease);}
.tile:hover img{transform:scale(1.05);}
.tile .lab{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);color:#fff;font-size:clamp(1.1rem,1.9vw,1.6875rem);letter-spacing:.015em;text-transform:uppercase;font-weight:400;white-space:nowrap;text-shadow:0 1px 20px rgba(0,0,0,.35);}
.tile .lab::before{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:calc(100% + 60px);height:calc(100% + 40px);border:1px solid rgba(255,255,255,.75);}
.tile .lab.dark{color:var(--dark);text-shadow:none;}
.tile .lab.dark::before{border-color:rgba(20,20,20,.55);}
.more{text-align:center;padding:0 10px;}
.more .init{font-family:'Italiana',serif;font-size:7rem;line-height:.8;color:var(--sand);margin-bottom:-38px;position:relative;z-index:0;}
.more .sig{font-family:'Italiana',serif;font-size:2.2rem;position:relative;z-index:1;color:var(--dark);}
.more h4{font-size:1.6875rem;letter-spacing:.015em;text-transform:uppercase;margin:22px 0 14px;}
.more p{color:var(--mute);font-size:.875rem;max-width:38ch;margin:0 auto 22px;}

/* ==========================================================================
   BANDA BEIGE — CADENAS
   ========================================================================== */
.band{position:relative;background:linear-gradient(115deg,#e6dfd5 0%,#d6ccbf 55%,#e2dbd1 100%);overflow:hidden;}
.band::before{content:"";position:absolute;right:-10%;top:-30%;width:60%;height:160%;background:radial-gradient(closest-side,rgba(255,255,255,.45),rgba(255,255,255,0));pointer-events:none;}
.band .wrap{position:relative;z-index:1;}
.band .title{text-align:center;font-size:clamp(3rem,6.6vw,5.4rem);color:#fff;margin-bottom:clamp(24px,3vw,44px);text-shadow:0 1px 24px rgba(90,70,50,.18);}
.band-grid{display:grid;grid-template-columns:240px 1.2fr 1fr;gap:clamp(18px,3vw,44px);align-items:center;}
.band .card{background:#fff;padding:12px;aspect-ratio:240/306;}
.band .card img{width:100%;height:100%;object-fit:cover;}
.band .big{aspect-ratio:447/420;overflow:hidden;background:#fff;}
.band .big img{width:100%;height:100%;object-fit:cover;object-position:12% 50%;}
.band .txt{color:var(--dark);}
.band .txt .ey{font-size:.75rem;letter-spacing:.03em;text-transform:uppercase;font-weight:500;margin-bottom:12px;}
.band .txt h3{font-size:1.6875rem;letter-spacing:.015em;text-transform:uppercase;margin-bottom:16px;}
.band .txt p{font-size:.875rem;max-width:38ch;margin-bottom:26px;color:#4b463f;}
.band .arr{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;display:grid;place-items:center;color:#fff;opacity:.75;transition:opacity 200ms;}
.band .arr:hover{opacity:1;}
.band .arr.l{left:clamp(6px,1.5vw,24px);} .band .arr.r{right:clamp(6px,1.5vw,24px);}
.band .arr svg{width:22px;height:22px;stroke-width:1.2;}

/* ==========================================================================
   PROMOS (dos piezas)
   ========================================================================== */
.promos{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,1.8vw,30px);}
.promo{position:relative;overflow:hidden;aspect-ratio:542/369;background:var(--cream);display:flex;align-items:flex-end;}
.promo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1000ms var(--ease);}
.promo:hover img{transform:scale(1.04);}
.promo .in{position:relative;z-index:1;padding:clamp(20px,2.6vw,36px);}
.promo.a::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(248,192,0,.92) 0%,rgba(248,192,0,.6) 45%,rgba(248,192,0,0) 75%);}
.promo.a .in{color:var(--dark);}
.promo.a h4{font-size:1.375rem;letter-spacing:.015em;text-transform:uppercase;max-width:16ch;line-height:1.3;}
.promo.a p{font-size:.875rem;margin:10px 0 20px;max-width:32ch;}
.promo.b{align-items:center;justify-content:center;text-align:center;}
.promo.b::after{content:"";position:absolute;inset:0;background:rgba(20,20,20,.38);}
.promo.b .in{color:#fff;}
.promo.b .ey{font-size:.75rem;letter-spacing:.03em;text-transform:uppercase;font-weight:500;}
.promo.b h4{font-size:clamp(2.6rem,4.6vw,4rem);color:#fff;margin:6px 0 16px;}

/* ==========================================================================
   MARCAS
   ========================================================================== */
.brands{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:clamp(28px,5vw,80px);}
.brands span{font-family:'Italiana',serif;font-size:1.7rem;letter-spacing:.06em;color:var(--dark);opacity:.72;}
.brands span.sans{font-family:'Raleway',sans-serif;font-weight:600;font-size:1.05rem;letter-spacing:.05em;text-transform:uppercase;}

/* ==========================================================================
   OPINIONES
   ========================================================================== */
.kind{position:relative;background:var(--cream);overflow:hidden;}
.kind>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.9;}
.kind::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(246,244,242,.7),rgba(246,244,242,.35));}
.kind .wrap{position:relative;z-index:1;}
.reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.8vw,30px);}
.rev{background:#fff;padding:clamp(24px,2.6vw,40px);}
.stars{display:flex;gap:3px;color:var(--yellow-dk);margin-bottom:16px;}
.stars svg{width:12px;height:12px;}
.rev p{font-size:.875rem;color:var(--ink);margin-bottom:22px;}
.rev b{display:block;font-size:.875rem;font-weight:600;color:var(--dark);}
.rev i{display:block;font-style:normal;font-size:.8125rem;color:var(--mute);margin-top:2px;}
.nota{margin-top:18px;text-align:center;font-size:.68rem;color:var(--mute);letter-spacing:.06em;}

/* ==========================================================================
   INSTAGRAM
   ========================================================================== */
.insta{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(10px,1.4vw,24px);}
.insta a{position:relative;display:block;aspect-ratio:1/1.05;overflow:hidden;background:var(--cream);}
.insta img{width:100%;height:100%;object-fit:cover;transition:transform 900ms var(--ease);}
.insta a:hover img{transform:scale(1.05);}
.insta a::after{content:"";position:absolute;inset:0;background:rgba(20,20,20,0);transition:background-color 300ms;}
.insta a:hover::after{background:rgba(20,20,20,.18);}
.insta-story{position:relative;text-align:center;margin-top:-14px;pointer-events:none;}
.insta-story .big{font-size:clamp(3rem,7.4vw,6.4rem);color:#e6e1da;line-height:1;}
.insta-story .h{margin-top:14px;font-size:.75rem;letter-spacing:.03em;text-transform:uppercase;font-weight:500;color:var(--dark);pointer-events:auto;}

/* ==========================================================================
   SUCURSALES  (bloque propio sobre crema, retícula 3×3 exacta)
   ========================================================================== */
.suc{background:var(--cream);}
.cities{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-bottom:clamp(26px,3vw,40px);}
.cities button{
  font-size:.75rem;letter-spacing:.03em;text-transform:uppercase;font-weight:500;
  padding:9px 20px;border:1px solid var(--line-2);background:#fff;color:var(--dark);
  transition:background-color 220ms var(--ease),color 220ms var(--ease),border-color 220ms var(--ease);
}
.cities button.on,.cities button:hover{background:var(--dark);border-color:var(--dark);color:#fff;}
.stores{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,1.4vw,20px);}
.store{
  background:#fff;padding:clamp(22px,2.2vw,30px);display:flex;flex-direction:column;
  transition:box-shadow 260ms var(--ease),transform 260ms var(--ease);
}
.store:hover{transform:translateY(-3px);box-shadow:0 18px 36px -28px rgba(20,20,20,.4);}
.store .city{font-size:.75rem;letter-spacing:.03em;text-transform:uppercase;font-weight:500;color:var(--yellow-dk);margin-bottom:6px;}
.store b{font-size:.9375rem;font-weight:500;letter-spacing:.015em;text-transform:uppercase;color:var(--dark);line-height:1.4;}
.store .addr{font-size:.875rem;color:var(--mute);margin-top:6px;flex:1;}
.store .tel{
  display:inline-flex;align-items:center;gap:8px;align-self:flex-start;margin-top:16px;
  font-size:.875rem;color:var(--dark);border-bottom:1px solid var(--yellow);padding-bottom:2px;
}
.store .tel svg{width:13px;height:13px;stroke-width:1.6;color:var(--yellow-dk);}

/* ==========================================================================
   FRANJA DE CONTACTO  (el "get in touch" de la referencia)
   ========================================================================== */
.touch{border-top:1px solid var(--line);}
.touch-grid{display:grid;grid-template-columns:1fr 1.25fr 1fr;gap:clamp(28px,5vw,70px);text-align:center;align-items:start;}
.touch h4{font-size:1rem;letter-spacing:.015em;text-transform:uppercase;margin-bottom:16px;}
.touch .sm{font-size:.875rem;color:var(--mute);line-height:1.95;}
.touch .sm b{font-weight:500;color:var(--dark);}
.touch .sm a{border-bottom:1px solid var(--line-2);}
.news form{display:flex;border-bottom:1px solid var(--dark);margin-top:6px;}
.news input{flex:1;min-width:0;border:0;background:transparent;padding:12px 0;font-size:.875rem;}
.news input:focus{outline:0;}
.news button{font-size:.75rem;letter-spacing:.03em;text-transform:uppercase;font-weight:500;color:var(--dark);padding:0 0 0 14px;}
.news .nt{font-size:.8125rem;color:var(--mute);margin-top:10px;}
.soc{display:flex;gap:10px;justify-content:center;}
.soc a{width:40px;height:40px;border:1px solid var(--line-2);display:grid;place-items:center;color:var(--dark);transition:background-color 220ms,color 220ms,border-color 220ms;}
.soc a:hover{background:var(--dark);border-color:var(--dark);color:#fff;}
.soc svg{width:15px;height:15px;stroke-width:1.6;}

/* ==========================================================================
   PIE
   ========================================================================== */
.site-footer{padding-top:clamp(34px,4vw,58px);padding-bottom:26px;}
.f-grid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:clamp(24px,4vw,60px);padding-bottom:40px;border-bottom:1px solid var(--line);}
.f-brand img{height:38px;width:auto;margin-bottom:16px;}
.f-brand h4{font-size:1rem;letter-spacing:.015em;text-transform:uppercase;margin-bottom:14px;}
.f-brand p{font-size:.875rem;color:var(--mute);line-height:1.85;max-width:40ch;}
.f-brand p b{font-weight:500;color:var(--dark);}
.pay{margin-top:22px;}
.pay .lab{display:block;font-size:.8125rem;color:var(--mute);margin-bottom:10px;}
.pay .logos{display:flex;gap:10px;align-items:center;flex-wrap:wrap;}
.pay .logos img{height:46px;width:auto;border-radius:4px;}
.pay .txt{display:block;font-size:.8125rem;color:var(--mute);margin-top:12px;}
.f-col h5{margin:0 0 18px;font-size:.75rem;letter-spacing:.03em;text-transform:uppercase;font-weight:500;color:var(--dark);}
.f-col li{margin-bottom:9px;}
.f-col a{font-size:.8125rem;color:var(--mute);transition:color 200ms;}
.f-col a:hover{color:var(--dark);}
.f-bottom{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;padding-top:24px;font-size:.8125rem;color:var(--mute);}

/* ---------- whatsapp flotante ---------- */
.wa-float{position:fixed;left:22px;bottom:22px;z-index:60;width:54px;height:54px;border-radius:50%;background:var(--wa);color:#fff;display:grid;place-items:center;box-shadow:0 14px 30px -12px rgba(37,211,102,.7);transition:transform 200ms var(--ease);}
.wa-float:hover{transform:translateY(-3px);}
.wa-float svg{width:26px;height:26px;}

/* ---------- aparición ---------- */
.rv{opacity:0;transform:translateY(18px);transition:opacity 800ms var(--ease),transform 800ms var(--ease);}
.rv.in{opacity:1;transform:none;}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none;}*{scroll-behavior:auto!important;}}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media(max-width:1180px){
  .grid-5{grid-template-columns:repeat(3,1fr);}
  .band-grid{grid-template-columns:200px 1fr 1fr;}
}
@media(max-width:960px){
  .topbar .r{display:none;}
  .bar{grid-template-columns:auto 1fr auto;height:74px;}
  .bar .l{display:none;}
  .burger{display:flex;}
  .brand{justify-self:center;}
  .brand img{height:36px;}
  .bar .r .txt{display:none;}
  .nav{display:none;}
  .grid-4{grid-template-columns:repeat(2,1fr);}
  .stag{grid-template-columns:1fr;}
  .stag .col.b{padding-top:0;}
  .band-grid{grid-template-columns:1fr 1fr;}
  .band .card{display:none;}
  .promos{grid-template-columns:1fr;}
  .reviews{grid-template-columns:1fr;}
  .insta{grid-template-columns:repeat(2,1fr);}
  .stores{grid-template-columns:repeat(2,1fr);}
  .touch-grid{grid-template-columns:1fr;}
  .f-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:620px){
  .grid-5{grid-template-columns:repeat(2,1fr);}
  .band-grid{grid-template-columns:1fr;}
  .band .big{aspect-ratio:4/3;}
  .stores{grid-template-columns:1fr;}
  .f-grid{grid-template-columns:1fr;}
  .hero h1{max-width:none;}
  .promo{aspect-ratio:4/3;}
}

/* ==========================================================================
   TIENDA — componentes que el boceto no traía (ficha, colección, carrito,
   blog, cuenta). Mismo sistema: Poppins fino en versalitas, Italiana para
   los titulares, amarillo #F8C000 solo como acento.
   ========================================================================== */

/* ---------- utilidades ---------- */
.vh{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}
.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--dark);color:#fff;padding:12px 20px;font-size:.75rem;letter-spacing:.03em;text-transform:uppercase;}
.skip:focus{left:0;}
:focus-visible{outline:2px solid var(--yellow-dk);outline-offset:2px;}
.hide{display:none!important;}
.rte{font-size:.875rem;line-height:1.9;color:var(--ink);}
.rte h2,.rte h3,.rte h4{margin:1.6em 0 .6em;letter-spacing:.015em;text-transform:uppercase;font-size:1.0625rem;}
.rte p{margin:0 0 1.1em;}
.rte a{border-bottom:1px solid var(--yellow);}
.rte ul,.rte ol{margin:0 0 1.1em;padding-left:1.1em;}
.rte ul{list-style:disc;} .rte ol{list-style:decimal;}
.rte li{margin-bottom:.4em;}
.rte img{margin:1.4em 0;}
.rte blockquote{margin:1.4em 0;padding-left:20px;border-left:2px solid var(--yellow);color:var(--mute);}
.rte table{width:100%;border-collapse:collapse;font-size:.8125rem;}
.rte td,.rte th{border-bottom:1px solid var(--line);padding:9px 8px;text-align:left;}

/* ---------- migas ---------- */
.crumbs{font-size:.6875rem;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);padding:22px 0 0;}
.crumbs a:hover{color:var(--dark);}
.crumbs span{margin:0 7px;opacity:.5;}
@media(max-width:760px){.crumbs{display:none;}}

/* ---------- cabecera de página ---------- */
.page-head{text-align:center;padding:clamp(34px,4.4vw,64px) 0 clamp(26px,3vw,42px);}
.page-head .ey{font-size:.75rem;letter-spacing:.03em;text-transform:uppercase;font-weight:500;color:var(--yellow-dk);margin-bottom:12px;}
.page-head h1{font-size:clamp(1.7rem,3vw,2.375rem);text-transform:uppercase;letter-spacing:.005em;line-height:1.15;}
.page-head h1.display{font-family:'Italiana',serif;text-transform:none;letter-spacing:-.01em;font-size:clamp(2.4rem,5vw,4rem);}
.page-head .sub{max-width:56ch;margin:14px auto 0;color:var(--mute);font-size:.875rem;}

/* ---------- barra de colección ---------- */
.col-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  padding:14px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:clamp(26px,3vw,44px);}
.col-bar .count{font-size:.75rem;letter-spacing:.03em;text-transform:uppercase;color:var(--mute);}
.col-bar .tools{display:flex;align-items:center;gap:18px;}
.sel{position:relative;display:inline-flex;align-items:center;}
.sel select{appearance:none;border:0;background:transparent;padding:6px 26px 6px 0;font-size:.75rem;letter-spacing:.03em;text-transform:uppercase;font-weight:500;color:var(--dark);cursor:pointer;}
.sel select:focus{outline:0;}
.sel::after{content:"";position:absolute;right:8px;top:50%;width:6px;height:6px;border-right:1px solid var(--dark);border-bottom:1px solid var(--dark);transform:translateY(-70%) rotate(45deg);pointer-events:none;}
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px;}
.filters details{border:1px solid var(--line-2);background:#fff;}
.filters summary{list-style:none;cursor:pointer;padding:9px 18px;font-size:.75rem;letter-spacing:.03em;text-transform:uppercase;font-weight:500;}
.filters summary::-webkit-details-marker{display:none;}
.filters .body{padding:4px 18px 16px;min-width:220px;}
.filters label{display:flex;align-items:center;gap:9px;font-size:.8125rem;color:var(--ink);padding:5px 0;cursor:pointer;}
.filters input{accent-color:var(--yellow-dk);}
.active-filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px;}
.chip{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line-2);padding:6px 12px;font-size:.75rem;letter-spacing:.02em;}
.chip:hover{border-color:var(--dark);}

/* ---------- paginación ---------- */
.pag{display:flex;justify-content:center;align-items:center;gap:6px;margin-top:clamp(40px,5vw,70px);}
.pag a,.pag span{min-width:38px;height:38px;display:grid;place-items:center;font-size:.8125rem;border:1px solid transparent;color:var(--mute);}
.pag a:hover{border-color:var(--line-2);color:var(--dark);}
.pag .cur{border-color:var(--dark);color:var(--dark);font-weight:500;}

/* ---------- estado vacío ---------- */
.empty{text-align:center;padding:clamp(50px,7vw,110px) 0;}
.empty .init{font-family:'Italiana',serif;font-size:6rem;line-height:.8;color:var(--sand);margin-bottom:-26px;}
.empty h3{font-size:1.375rem;letter-spacing:.015em;text-transform:uppercase;margin:20px 0 12px;}
.empty p{color:var(--mute);font-size:.875rem;max-width:44ch;margin:0 auto 24px;}

/* ==========================================================================
   FICHA DE PRODUCTO
   ========================================================================== */
.pdp{display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(28px,4.6vw,74px);align-items:start;padding-top:clamp(20px,2.4vw,34px);}
.gal{position:sticky;top:120px;}
.gal .main{position:relative;background:var(--cream);aspect-ratio:1/1.03;overflow:hidden;}
.gal .main img{width:100%;height:100%;object-fit:cover;}
.gal .main .tag{position:absolute;top:14px;left:14px;background:var(--yellow);color:var(--dark);font-size:.6875rem;font-weight:600;letter-spacing:.03em;padding:5px 11px;}
.gal .thumbs{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:10px;}
.gal .thumbs button{aspect-ratio:1/1.03;background:var(--cream);overflow:hidden;border:1px solid transparent;transition:border-color 200ms var(--ease);}
.gal .thumbs button.on{border-color:var(--dark);}
.gal .thumbs img{width:100%;height:100%;object-fit:cover;}
.pdp-info .vendor{font-size:.75rem;letter-spacing:.03em;text-transform:uppercase;font-weight:500;color:var(--mute);}
.pdp-info h1{font-size:clamp(1.375rem,2.3vw,1.875rem);letter-spacing:.015em;text-transform:uppercase;line-height:1.3;margin:10px 0 0;}
.pdp-price{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin:18px 0 6px;font-size:1.375rem;font-weight:500;color:var(--dark);}
.pdp-price s{font-size:1rem;font-weight:300;color:var(--mute-2);}
.pdp-price .save{background:var(--yellow);color:var(--dark);font-size:.6875rem;font-weight:600;letter-spacing:.03em;padding:4px 10px;}
.pdp-taxes{font-size:.75rem;color:var(--mute);letter-spacing:.02em;}
.pdp-sep{height:1px;background:var(--line);margin:26px 0;}
.opt{margin-bottom:22px;}
.opt .lab{font-size:.75rem;letter-spacing:.03em;text-transform:uppercase;font-weight:500;margin-bottom:10px;}
.opt .lab em{font-style:normal;color:var(--mute);font-weight:400;text-transform:none;letter-spacing:0;margin-left:6px;}
.opt .vals{display:flex;flex-wrap:wrap;gap:8px;}
.opt input{position:absolute;opacity:0;pointer-events:none;}
.opt label{display:inline-flex;align-items:center;justify-content:center;min-width:46px;padding:10px 16px;border:1px solid var(--line-2);
  font-size:.8125rem;letter-spacing:.02em;cursor:pointer;transition:border-color 200ms var(--ease),background-color 200ms var(--ease),color 200ms var(--ease);}
.opt label:hover{border-color:var(--dark);}
.opt input:checked+label{background:var(--dark);border-color:var(--dark);color:#fff;}
.opt input:disabled+label{color:var(--mute-2);border-color:var(--line);text-decoration:line-through;cursor:not-allowed;}
.opt input:focus-visible+label{outline:2px solid var(--yellow-dk);outline-offset:2px;}
.buy{display:flex;gap:10px;align-items:stretch;margin-top:6px;}
.qty{display:inline-flex;align-items:center;border:1px solid var(--line-2);}
.qty button{width:40px;height:100%;min-height:50px;display:grid;place-items:center;color:var(--dark);font-size:1rem;}
.qty button:hover{color:var(--yellow-dk);}
.qty input{width:40px;text-align:center;border:0;background:transparent;font-size:.875rem;-moz-appearance:textfield;}
.qty input::-webkit-outer-spin-button,.qty input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.buy .btn{flex:1;min-height:50px;}
.buy .btn[disabled]{background:var(--line-2);border-color:var(--line-2);color:var(--mute);cursor:not-allowed;}
.btn-wa{background:var(--wa);border-color:var(--wa);color:#fff;margin-top:10px;width:100%;min-height:50px;}
.btn-wa:hover{background:#1fb955;border-color:#1fb955;color:#fff;}
.btn-wa svg{width:15px;height:15px;}
.pdp-points{margin-top:26px;display:grid;gap:12px;}
.pdp-points li{display:flex;gap:11px;align-items:flex-start;font-size:.8125rem;color:var(--ink);}
.pdp-points svg{width:15px;height:15px;flex:none;margin-top:3px;color:var(--yellow-dk);stroke-width:1.6;}
.acc{border-top:1px solid var(--line);margin-top:30px;}
.acc details{border-bottom:1px solid var(--line);}
.acc summary{list-style:none;cursor:pointer;padding:16px 0;display:flex;align-items:center;justify-content:space-between;
  font-size:.75rem;letter-spacing:.03em;text-transform:uppercase;font-weight:500;color:var(--dark);}
.acc summary::-webkit-details-marker{display:none;}
.acc summary::after{content:"";width:8px;height:8px;border-right:1px solid var(--dark);border-bottom:1px solid var(--dark);transform:rotate(45deg);transition:transform 260ms var(--ease);}
.acc details[open] summary::after{transform:rotate(-135deg);}
.acc .body{padding:0 0 20px;}
@media(max-width:900px){
  .pdp{grid-template-columns:1fr;gap:26px;}
  .gal{position:static;}
  .gal .thumbs{grid-template-columns:repeat(5,1fr);}
}

/* ==========================================================================
   CARRITO
   ========================================================================== */
.cart-line{display:grid;grid-template-columns:96px 1fr auto;gap:18px;padding:22px 0;border-bottom:1px solid var(--line);align-items:start;}
.cart-line .ph{background:var(--cream);aspect-ratio:1/1.03;overflow:hidden;}
.cart-line .ph img{width:100%;height:100%;object-fit:cover;}
.cart-line b{display:block;font-size:.875rem;font-weight:500;letter-spacing:.015em;text-transform:uppercase;line-height:1.45;}
.cart-line .var{font-size:.75rem;color:var(--mute);letter-spacing:.02em;margin-top:4px;}
.cart-line .rm{font-size:.75rem;color:var(--mute);letter-spacing:.03em;text-transform:uppercase;margin-top:12px;display:inline-block;border-bottom:1px solid var(--line-2);}
.cart-line .rm:hover{color:var(--dark);border-color:var(--dark);}
.cart-line .money{font-size:.875rem;font-weight:500;text-align:right;white-space:nowrap;}
.cart-line .qty{margin-top:10px;}
.cart-line .qty button{min-height:36px;width:32px;}
.cart-foot{display:grid;grid-template-columns:1fr 380px;gap:clamp(24px,4vw,60px);margin-top:34px;align-items:start;}
.cart-note textarea{width:100%;border:1px solid var(--line-2);background:transparent;padding:12px 14px;font-size:.875rem;min-height:96px;resize:vertical;}
.cart-note textarea:focus{outline:0;border-color:var(--dark);}
.cart-sum .row{display:flex;justify-content:space-between;gap:14px;padding:9px 0;font-size:.875rem;color:var(--mute);}
.cart-sum .row.tot{border-top:1px solid var(--line);margin-top:8px;padding-top:16px;font-size:1.0625rem;font-weight:500;color:var(--dark);}
.cart-sum .nt{font-size:.75rem;color:var(--mute);margin:10px 0 18px;}
.cart-sum .btn{width:100%;min-height:52px;}
@media(max-width:820px){.cart-foot{grid-template-columns:1fr;}.cart-line{grid-template-columns:76px 1fr;}.cart-line .money{grid-column:2;text-align:left;}}

/* ---------- cajón del carrito ---------- */
#drawer{position:fixed;inset:0;z-index:95;visibility:hidden;}
#drawer.on{visibility:visible;}
#drawer .veil{position:absolute;inset:0;background:rgba(20,20,20,.35);opacity:0;transition:opacity 300ms var(--ease);}
#drawer.on .veil{opacity:1;}
#drawer .panel{position:absolute;top:0;right:0;bottom:0;width:min(420px,92vw);background:#fff;display:flex;flex-direction:column;
  transform:translateX(102%);transition:transform 380ms var(--ease);}
#drawer.on .panel{transform:none;}
#drawer .hd{display:flex;align-items:center;justify-content:space-between;padding:22px 24px;border-bottom:1px solid var(--line);}
#drawer .hd h3{font-size:.9375rem;letter-spacing:.03em;text-transform:uppercase;font-weight:500;}
#drawer .bodyw{flex:1;overflow-y:auto;padding:0 24px;}
#drawer .ft{border-top:1px solid var(--line);padding:20px 24px 24px;}
#drawer .x{width:34px;height:34px;display:grid;place-items:center;}
#drawer .x svg{width:16px;height:16px;stroke-width:1.5;}

/* ---------- buscador ---------- */
#seek{position:fixed;inset:0;z-index:92;background:rgba(255,255,255,.98);opacity:0;visibility:hidden;transition:opacity 240ms var(--ease),visibility 240ms;padding-top:14vh;}
#seek.on{opacity:1;visibility:visible;}
#seek form{max-width:720px;margin:0 auto;padding:0 var(--gutter);display:flex;border-bottom:1px solid var(--dark);}
#seek input{flex:1;min-width:0;border:0;background:transparent;padding:14px 0;font-family:'Italiana',serif;font-size:clamp(1.6rem,3.4vw,2.4rem);}
#seek input:focus{outline:0;}
#seek .x{position:absolute;top:24px;right:var(--gutter);width:38px;height:38px;display:grid;place-items:center;}
#seek .x svg{width:18px;height:18px;stroke-width:1.4;}
#seek .hint{max-width:720px;margin:16px auto 0;padding:0 var(--gutter);font-size:.75rem;letter-spacing:.03em;text-transform:uppercase;color:var(--mute);}

/* ==========================================================================
   BLOG
   ========================================================================== */
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.4vw,40px);}
.post .ph{background:var(--cream);aspect-ratio:3/2;overflow:hidden;}
.post .ph img{width:100%;height:100%;object-fit:cover;transition:transform 900ms var(--ease);}
.post:hover .ph img{transform:scale(1.04);}
.post .meta{font-size:.6875rem;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);margin:16px 0 8px;}
.post h3{font-size:1.0625rem;letter-spacing:.015em;text-transform:uppercase;line-height:1.45;}
.post p{font-size:.875rem;color:var(--mute);margin-top:8px;}
.article{max-width:760px;margin:0 auto;}
.article .cover{background:var(--cream);aspect-ratio:16/9;overflow:hidden;margin-bottom:clamp(26px,3vw,44px);}
.article .cover img{width:100%;height:100%;object-fit:cover;}
@media(max-width:900px){.posts{grid-template-columns:repeat(2,1fr);}}
@media(max-width:620px){.posts{grid-template-columns:1fr;}}

/* ==========================================================================
   FORMULARIOS Y CUENTA
   ========================================================================== */
.form{max-width:520px;margin:0 auto;}
.form.wide{max-width:760px;}
.fld{margin-bottom:18px;}
.fld label{display:block;font-size:.75rem;letter-spacing:.03em;text-transform:uppercase;font-weight:500;margin-bottom:8px;}
.fld input,.fld textarea,.fld select{width:100%;border:1px solid var(--line-2);background:transparent;padding:13px 14px;font-size:.875rem;}
.fld textarea{min-height:130px;resize:vertical;}
.fld input:focus,.fld textarea:focus,.fld select:focus{outline:0;border-color:var(--dark);}
.form .btn{width:100%;min-height:50px;}
.form .alt{text-align:center;font-size:.8125rem;color:var(--mute);margin-top:18px;}
.form .alt a{border-bottom:1px solid var(--line-2);color:var(--dark);}
.msg{padding:14px 16px;font-size:.8125rem;margin-bottom:20px;border-left:2px solid var(--yellow);background:var(--cream);}
.msg.err{border-color:#c0392b;}
.msg ul{list-style:disc;padding-left:18px;}
.acct{display:grid;grid-template-columns:220px 1fr;gap:clamp(24px,4vw,60px);align-items:start;}
.acct nav a{display:block;padding:9px 0;font-size:.75rem;letter-spacing:.03em;text-transform:uppercase;font-weight:500;color:var(--mute);}
.acct nav a:hover,.acct nav a.on{color:var(--dark);}
.tbl{width:100%;border-collapse:collapse;font-size:.8125rem;}
.tbl th{text-align:left;font-size:.6875rem;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);font-weight:500;padding:0 10px 12px 0;border-bottom:1px solid var(--line);}
.tbl td{padding:14px 10px 14px 0;border-bottom:1px solid var(--line);}
@media(max-width:760px){.acct{grid-template-columns:1fr;}.acct nav{display:flex;gap:18px;flex-wrap:wrap;border-bottom:1px solid var(--line);padding-bottom:10px;}}

/* ---------- avisos ---------- */
#toast{position:fixed;right:22px;bottom:22px;z-index:120;background:var(--dark);color:#fff;padding:14px 20px;font-size:.8125rem;
  letter-spacing:.02em;opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity 240ms var(--ease),transform 240ms var(--ease);}
#toast.on{opacity:1;transform:none;}

/* enlace que cubre la foto de la tarjeta, por debajo de acciones y WhatsApp */
.prod .ph .ovl{position:absolute;inset:0;z-index:1;}
.prod .ph .tag,.prod .ph .acts,.prod .ph .wa{z-index:2;}
.prod .ph .placeholder{width:100%;height:100%;}
.prod .ph .placeholder svg{width:100%;height:100%;fill:#dcd6cf;background:var(--cream);}
.prod .bd b a:hover{text-decoration:underline;text-underline-offset:3px;}

/* ---------- cabecera móvil: el botón de menú vive dentro de .l, que el
   boceto ocultaba entero; lo devolvemos con el buscador al lado ---------- */
@media(max-width:960px){
  .bar .l{display:flex;gap:6px;}
  .bar .l .txt{display:none;}
  .bar .l .ico svg{width:19px;height:19px;}
}

/* aspa de cierre del menú móvil (el boceto giraba el burger y salían tres rayas) */
#menuClose span{transform:rotate(45deg);}
#menuClose span::before{top:0;transform:rotate(90deg);}
#menuClose span::after{display:none;}

/* el título de la tarjeta es un h3 (antes era <b>): mismos estilos */
.prod .bd h3{display:block;margin:0;font-size:.9375rem;font-weight:500;letter-spacing:.015em;text-transform:uppercase;color:var(--dark);line-height:1.45;}
.prod .bd h3 a:hover{text-decoration:underline;text-underline-offset:3px;}

/* boletín: input elástico y botón pegado a la derecha; el aviso baja de línea */
.news form{flex-wrap:wrap;}
.news form .nt{flex-basis:100%;margin-top:8px;}

/* ==========================================================================
   CABECERA EN UNA SOLA FILA  (petición del cliente, 10/09/2026)
   Buscar · logo · menú · iconos, todo a la misma altura.
   ========================================================================== */
#hdr{border-bottom:1px solid var(--line);}
.bar{display:flex;align-items:center;gap:clamp(12px,1.8vw,30px);height:84px;}
.bar .l{flex:none;gap:10px;}
.brand{flex:none;display:flex;align-items:center;}
.bar .nav{flex:1;min-width:0;height:auto;border-top:0;justify-content:center;gap:clamp(9px,1.3vw,26px);}
.bar .r{flex:none;margin-left:auto;}
@media(max-width:1240px){
  .bar{gap:14px;}
  .bar .nav{gap:clamp(8px,1vw,14px);}
  .bar .nav a{font-size:.6875rem;}
}
@media(max-width:1080px){
  .bar .l .txt{display:none;}
}
@media(max-width:960px){
  .bar{height:74px;gap:8px;}
  .bar .nav{display:none;}
  .brand{flex:1;justify-content:center;}
}

/* el titular de Instagram pisaba la última fila de fotos */
.insta-story{margin-top:clamp(20px,2.6vw,34px);}
@media(max-width:1100px){
  .bar{gap:10px;}
  .bar .nav{gap:7px;}
  .bar .nav a{font-size:.625rem;letter-spacing:.01em;}
}

/* ==========================================================================
   TIPOGRAFÍA  (petición del cliente, 10/09/2026)
   Serif elegante para los titulares y Raleway para todo lo demás.
   Los nombres de producto, precios, menú y etiquetas siguen en palo seco
   en versalitas, como en la referencia que mandó el cliente.
   ========================================================================== */
body{font-family:'Raleway',system-ui,-apple-system,sans-serif;font-size:14.5px;}
.caps,.brands span.sans{font-family:'Raleway',sans-serif;}

/* titulares de sección y de página, en serif y caja normal */
.sec-title{
  font-family:'Italiana',serif;
  text-transform:none;
  letter-spacing:.01em;
  font-size:clamp(2rem,3.4vw,2.875rem);
  line-height:1.12;
}
.sec-title.sm{font-size:clamp(1.65rem,2.6vw,2.25rem);letter-spacing:.015em;}
.page-head h1{
  font-family:'Italiana',serif;
  text-transform:none;
  letter-spacing:.01em;
  font-size:clamp(2.1rem,3.6vw,3rem);
  line-height:1.12;
}
.sec-head p{margin-top:16px;}

/* ---------- banda: las fotos ya no van enmarcadas en blanco ---------- */
.band .card{background:transparent;padding:0;overflow:hidden;}
.band .big{background:transparent;}

/* ---------- marcas: carrusel (se activa solo si no caben) ---------- */
.brands-wrap{position:relative;}
.brands{flex-wrap:nowrap;overflow-x:auto;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none;padding:4px 0;}
.brands::-webkit-scrollbar{display:none;}
.brands>*{flex:none;}
.brands img{height:clamp(28px,3.4vw,44px);width:auto;opacity:.72;transition:opacity 240ms var(--ease);}
.brands img:hover{opacity:1;}
.b-arr{position:absolute;top:50%;transform:translateY(-50%);width:34px;height:34px;display:grid;place-items:center;
  background:#fff;border:1px solid var(--line-2);color:var(--dark);z-index:2;transition:border-color 200ms,color 200ms;}
.b-arr:hover{border-color:var(--dark);}
.b-arr svg{width:15px;height:15px;stroke-width:1.4;}
.b-arr.l{left:-6px;} .b-arr.r{right:-6px;}
.b-arr[hidden]{display:none;}
@media(max-width:620px){.b-arr{display:none;}.brands{justify-content:flex-start;}}

/* ---------- nombres de producto: caja alta y baja, no versalitas ---------- */
.prod .bd h3,
.prod .bd b,
.pdp-info h1,
.cart-line b,
.crumbs .cur{text-transform:none;}
.prod .bd h3,.prod .bd b{letter-spacing:.005em;line-height:1.5;}
.pdp-info h1{letter-spacing:0;line-height:1.24;font-size:clamp(1.5rem,2.5vw,2.0625rem);}
.cart-line b{letter-spacing:.005em;}
.crumbs .cur{letter-spacing:.02em;}

/* ---------- portada: mismo aire arriba y abajo de cada titulo ---------- */
.pad{padding-top:clamp(56px,6.4vw,92px);padding-bottom:clamp(56px,6.4vw,92px);}
.sec-head{margin-bottom:clamp(56px,6.4vw,92px);}

/* ---------- bloque "mas categorias": Inticash baja del pie de la I ---------- */
.more .init{margin-bottom:-6px;}
.more .sig{display:block;}

/* ---------- pie con el mismo fondo que la banda de cadenas y dijes ---------- */
.site-footer{background:linear-gradient(115deg,#e6dfd5 0%,#d6ccbf 55%,#e2dbd1 100%);}
.site-footer .f-grid{border-bottom-color:rgba(20,20,20,.14);}
.site-footer .f-brand p,
.site-footer .f-col a,
.site-footer .f-bottom{color:#5a5147;}
.site-footer .f-col a:hover{color:var(--dark);}

/* ---------- "mas categorias" centrado en el hueco de su columna ---------- */
.stag .col.a .more{flex:1;display:flex;flex-direction:column;justify-content:center;}
@media(max-width:860px){.stag .col.a .more{flex:none;display:block;}}

/* ---------- carrusel de marcas: que los 8 logos quepan en escritorio ---------- */
.brands{gap:clamp(18px,2.2vw,38px);}
.brands img{height:clamp(22px,2.2vw,32px);}

/* ---------- barra superior con dos mensajes ---------- */
.topbar .l{display:flex;align-items:center;gap:0;flex-wrap:wrap;min-width:0;}
.topbar .l .m+.m{position:relative;padding-left:15px;margin-left:13px;}
.topbar .l .m+.m::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:1px;height:11px;background:rgba(20,20,20,.22);}
@media(max-width:860px){
  .topbar .wrap{height:auto;min-height:36px;padding-top:7px;padding-bottom:7px;}
  .topbar{font-size:.6875rem;}
  .topbar .l{gap:2px 0;}
}
@media(max-width:560px){
  .topbar .l .m+.m{padding-left:0;margin-left:0;flex-basis:100%;}
  .topbar .l .m+.m::before{display:none;}
}

/* ---------- pie: enlaces de interés en la barra inferior ---------- */
.f-bottom{flex-direction:column;align-items:stretch;gap:16px;}
.f-legal{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 0;}
.f-legal li{position:relative;padding:0 14px;}
.f-legal li+li::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:1px;height:11px;background:rgba(20,20,20,.2);}
.f-legal a{color:#5a5147;}
.f-legal a:hover{color:var(--dark);}
.f-meta{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;}
@media(max-width:620px){
  .f-legal{flex-direction:column;align-items:flex-start;gap:9px;}
  .f-legal li{padding:0;}
  .f-legal li+li::before{display:none;}
  .f-meta{justify-content:flex-start;flex-direction:column;gap:4px;}
}

/* ==========================================================================
   TARJETA DE PRODUCTO — invitación a comprar  (petición del cliente, 25/09/2026)
   Al acercar el ratón aparece "Añadir al carrito" debajo del precio, como en
   la referencia de Cartier que mandó Yesenia. El hueco está reservado siempre,
   así la retícula no da saltos. En táctil no hay hover: se ve siempre.
   ========================================================================== */
.btn-sm{width:100%;min-height:40px;padding:11px 16px;font-size:.6875rem;letter-spacing:.07em;}
.prod .bd .add{
  margin-top:14px;
  opacity:0;visibility:hidden;transform:translateY(5px);
  transition:opacity 240ms var(--ease),transform 240ms var(--ease),visibility 240ms;
}
.prod:hover .bd .add,
.prod:focus-within .bd .add{opacity:1;visibility:visible;transform:none;}
.prod .bd .add form{margin:0;}
.prod a{-webkit-tap-highlight-color:transparent;}
@media(hover:none){
  .prod .bd .add{opacity:1;visibility:visible;transform:none;margin-top:12px;}
  .prod .bd .add .btn-sm{min-height:38px;padding:10px 12px;font-size:.625rem;letter-spacing:.05em;}
}

/* ==========================================================================
   PORTADA CON BANNER DE CAMPAÑA  (cliente, 05/10/2026)
   El banner viene de diseño con su propio titular, botón y letra legal, así
   que no se puede recortar nada: la sección toma la altura natural de la
   imagen y se sirve una por tramo de pantalla con <picture>.
   ========================================================================== */
.hero.plain{height:auto;background:transparent;}
.hero.plain picture{display:block;}
.hero.plain img{position:static;width:100%;height:auto;object-fit:initial;}
.hero.plain::after{display:none;}
.hero.plain .full{position:absolute;inset:0;z-index:2;}

/* ---------- botón de WhatsApp al final de una página ---------- */
.page-cta{max-width:760px;margin:clamp(30px,3.6vw,48px) auto 0;}
.page-cta .btn-wa{width:100%;min-height:52px;}

/* ---------- blog: tarjeta sin foto (el relleno de Shopify se desbordaba) ---------- */
.post .ph{display:block;}
.post .ph .placeholder{display:block;width:100%;height:100%;}
.post .ph .placeholder svg{width:100%;height:100%;fill:#dcd6cf;background:var(--cream);}
.article .cover .placeholder,.article .cover .placeholder svg{width:100%;height:100%;fill:#dcd6cf;background:var(--cream);}

/* ---------- aire entre el contenido y el pie (franja de contacto + pie) ---------- */
.shopify-section-group-footer-group{margin-top:50px;}

/* ---------- portada: slider de banners (06/10/2026) ---------- */
.hero.plain[data-slider]{touch-action:pan-y;}
.hero.plain .slides{display:grid;}
/* la caja toma la altura de la diapositiva activa (la fija el JS); sin JS, la de la más alta */
.hero.plain[data-slider] .slides{overflow:hidden;transition:height 620ms var(--ease);}
.hero.plain .slide{grid-area:1/1;position:relative;display:flex;align-items:flex-start;justify-content:center;}
.hero.plain[data-slider] .slide{opacity:0;visibility:hidden;pointer-events:none;transition:opacity 620ms var(--ease),visibility 620ms;}
.hero.plain[data-slider] .slide.on{opacity:1;visibility:visible;pointer-events:auto;}
.hero.plain .slide picture{display:block;width:100%;}
.hero.plain .slide img{display:block;width:100%;height:auto;}

.hero .s-arr{position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  width:44px;height:44px;display:grid;place-items:center;border:0;cursor:pointer;
  border-radius:50%;background:rgba(255,255,255,.82);color:#141414;
  box-shadow:0 2px 14px rgba(0,0,0,.18);
  transition:background-color 220ms var(--ease),opacity 220ms var(--ease);}
.hero .s-arr:hover{background:#fff;}
.hero .s-arr:focus-visible{outline:2px solid #fff;outline-offset:3px;}
.hero .s-arr.l{left:clamp(10px,2vw,28px);}
.hero .s-arr.r{right:clamp(10px,2vw,28px);}
.hero .s-arr svg{width:18px;height:18px;}

.hero .s-dots{position:absolute;left:0;right:0;bottom:clamp(12px,1.6vw,22px);z-index:3;
  display:flex;justify-content:center;gap:9px;}
.hero .s-dots button{width:9px;height:9px;padding:0;border:0;border-radius:50%;cursor:pointer;
  background:rgba(255,255,255,.5);box-shadow:0 0 0 1px rgba(0,0,0,.22);
  transition:background-color 220ms var(--ease),transform 220ms var(--ease);}
.hero .s-dots button[aria-selected="true"]{background:#fff;transform:scale(1.35);}
.hero .s-dots button:focus-visible{outline:2px solid #fff;outline-offset:3px;}

/* en movil se pasa deslizando: las flechas estorban sobre la imagen */
@media(max-width:767px){
  .hero .s-arr{display:none;}
  .hero .s-dots{bottom:8px;gap:7px;}
  .hero .s-dots button{width:7px;height:7px;}
}
@media(prefers-reduced-motion:reduce){
  .hero.plain[data-slider] .slide,.hero.plain[data-slider] .slides{transition:none;}
}