
/* Single committed light look (beige), no dark variant. Premium minimal: porcelain ground, hairlines, serif everywhere (Cormorant display + Newsreader text), terracotta as the single loud colour. One 12-col grid. Motion: hero line reveal, pointer parallax on arches, orbiting moon, marquee, tile hover/parallax, scroll reveals, count-up, drawer stagger, card stagger, view transitions. */
:root{
  --bg:#EADBC4; --paper:#E2D1B4; --ink:#251810; --muted:#62534A; --line:#CBB89C; --btn2:#2F4A27;
  --accent:#9C3A15; --accent-bg:#A63F19; --on-accent:#FDF5EC; --hero:#A63F19; --hero-shade:#842F12;
  --forest:#25371F; --sand:#DAC6A3; --brown:#22150F; --on-dark:#F4E8DA; --dark-line:#4A362B; --foot-accent:#E9946C;
  --scrim:rgba(34,21,15,.5);
  --disp:"Cormorant Garamond","Cormorant",Georgia,"Times New Roman",serif;
  --body:"Newsreader",Georgia,"Times New Roman",serif;
  --gut:clamp(18px,4.2vw,56px); --gap:clamp(12px,2vw,28px); --hdr:84px;
  --ease:cubic-bezier(.2,.8,.2,1);
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(env(safe-area-inset-top,0px) + var(--hdr) + 12px)}
body{margin:0;background:var(--bg);color:var(--ink);font:400 1.0625rem/1.65 var(--body);-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body.lock{overflow:hidden}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--bg)}
a{color:inherit}
h1,h2,h3,h4,p,ul{margin:0}
h1,h2,h3{text-wrap:balance;font-weight:400}
img{max-width:100%}
.skip{position:absolute;left:12px;top:-80px;z-index:200;padding:.7rem 1.2rem;border-radius:999px;background:var(--ink);color:var(--bg);font:500 .85rem var(--body);text-decoration:none;transition:top .2s}.skip:focus{top:max(12px,env(safe-area-inset-top,0px))}
.noscript-msg{margin:0;padding:1rem max(16px,env(safe-area-inset-left,0px));background:var(--paper);color:var(--ink);border-bottom:1px solid var(--line);font-size:.95rem;line-height:1.5;text-align:center}
main:focus{outline:none}
:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:4px}
.wrap{max-width:1360px;margin:0 auto;padding-inline:max(var(--gut),env(safe-area-inset-left,0px)) max(var(--gut),env(safe-area-inset-right,0px))}
.g{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap)}
.eyebrow{font:500 .72rem/1.4 var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.eyebrow b{font-weight:500;color:var(--accent);margin-right:.8em}
.sec{padding-block:clamp(3.4rem,8vw,7rem)}
h2{font:300 clamp(2.4rem,5.4vw,4.4rem)/1.02 var(--disp);letter-spacing:-.015em}
h2 em,h1 em{font-style:italic;color:var(--accent)}
.sub{margin-top:1rem;color:var(--muted);max-width:52ch}

/* section head: hairline draws itself, eyebrow left, title right */
.shead{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);row-gap:1.1rem;margin-bottom:clamp(2rem,4.5vw,3.8rem)}
.shead::before{content:"";grid-column:1/-1;height:1px;background:var(--ink);transform-origin:left;transform:scaleX(0);transition:transform 1.3s var(--ease);margin-bottom:.8rem}
.shead.in::before,.nojs .shead::before{transform:none}
.shead>.eyebrow{grid-column:1/4;padding-top:.6rem}
#categorias .shead::before{display:none}
.shead>div{grid-column:4/13}

/* reveal */
.rv{opacity:0;translate:0 28px;transition:opacity .9s var(--ease),translate .9s var(--ease);transition-delay:var(--rd,0s)}
.rv.in,.nojs .rv{opacity:1;translate:0 0}

/* buttons: fill sweeps up on hover */
.btn{--sw:var(--ink);--sw-ink:var(--bg);display:inline-flex;align-items:center;justify-content:center;gap:.7rem;min-height:50px;padding:.7rem 1.8rem;border:1px solid var(--accent-bg);border-radius:999px;background-color:var(--accent-bg);background-image:linear-gradient(var(--sw),var(--sw));background-repeat:no-repeat;background-position:left bottom;background-size:100% 0;color:var(--on-accent);font:500 .74rem var(--body);letter-spacing:.18em;text-transform:uppercase;text-decoration:none;cursor:pointer;white-space:nowrap;transition:background-size .45s var(--ease),color .45s,border-color .45s}@media (hover:hover){.btn:hover{background-size:100% 100%;color:var(--sw-ink);border-color:var(--sw)}}
.btn svg{width:16px;height:16px;flex:none;transition:translate .4s var(--ease)}@media (hover:hover){.btn:hover svg{translate:4px 0}}
.btn.line{--sw:var(--accent-bg);--sw-ink:var(--on-accent);background-color:var(--btn2);color:#F8EEE1;border-color:var(--btn2)}@media (hover:hover){.btn.line:hover{color:var(--sw-ink);border-color:var(--sw)}}
.tl{display:inline-flex;align-items:center;gap:.6rem;min-height:44px;font:500 .74rem var(--body);letter-spacing:.18em;text-transform:uppercase;text-decoration:none;background:linear-gradient(currentColor,currentColor) left calc(50% + .9em)/0 1px no-repeat;transition:background-size .45s var(--ease)}@media (hover:hover){.tl:hover{background-size:100% 1px}}

/* top bar */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:color-mix(in srgb,var(--bg) 90%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.top .wrap{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem;height:var(--hdr)}
.menu{justify-self:start;display:inline-flex;align-items:center;gap:.9rem;min-height:46px;padding:0 .2rem;border:0;background:none;color:var(--ink);font:500 .74rem var(--body);letter-spacing:.2em;text-transform:uppercase;cursor:pointer}
.bars{display:flex;flex-direction:column;gap:6px;width:24px}
.bars i{display:block;height:1.5px;background:currentColor;transition:width .4s var(--ease)}
.bars i:nth-child(2){width:60%}.bars i:nth-child(3){width:85%}@media (hover:hover){.menu:hover .bars i{width:100%}}
.brand{display:flex;align-items:center;gap:.75rem;text-decoration:none;font:400 1.65rem/1 var(--disp);letter-spacing:.02em;min-width:0}
.brand img{width:62px;height:62px;border-radius:0;display:block;flex:none}
.right{justify-self:end;display:flex;align-items:center}
.subnav{border-bottom:1px solid var(--line)}
.links{display:flex;justify-content:center;gap:clamp(1.6rem,4vw,3.2rem)}
.subnav .links{padding-block:.35rem}
.links a{font:500 .72rem var(--body);letter-spacing:.18em;text-transform:uppercase;text-decoration:none;color:var(--muted);padding:.5rem 0;background:linear-gradient(var(--ink),var(--ink)) left calc(100% - .2rem)/0 1px no-repeat;transition:background-size .4s var(--ease),color .3s}@media (hover:hover){.links a:hover{color:var(--ink);background-size:100% 1px}}
.top .btn{min-height:42px;padding:.45rem 1.3rem}

/* drawer */
.scrim{position:fixed;inset:0;z-index:55;background:var(--scrim);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);opacity:0;visibility:hidden;transition:opacity .4s,visibility .4s}
.drawer{position:fixed;top:0;bottom:0;left:0;z-index:60;width:min(92vw,440px);background:var(--paper);color:var(--ink);display:flex;flex-direction:column;transform:translateX(-102%);visibility:hidden;transition:transform .6s var(--ease),visibility .6s;padding-top:env(safe-area-inset-top,0px);padding-left:env(safe-area-inset-left,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
body.open .scrim{opacity:1;visibility:visible}
body.open .drawer{transform:none;visibility:visible}
.dh{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.1rem 1.6rem;border-bottom:1px solid var(--line)}
.dh .brand{font-size:1.2rem}.dh .brand img{width:44px;height:44px}
.x{min-height:44px;padding:0 .2rem;border:0;background:linear-gradient(currentColor,currentColor) left calc(50% + .8em)/0 1px no-repeat;color:var(--ink);font:500 .72rem var(--body);letter-spacing:.2em;text-transform:uppercase;cursor:pointer;transition:background-size .4s var(--ease)}@media (hover:hover){.x:hover{background-size:100% 1px}}
.dl{flex:1;overflow-y:auto;padding:1.6rem 1.6rem 2rem}
.dl .eyebrow{margin-bottom:.8rem}
.cl{list-style:none;padding:0;display:flex;flex-direction:column}
.cl li{border-bottom:1px solid var(--line)}
.cl a{position:relative;display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:.9rem;padding:.5rem 0;min-height:56px;text-decoration:none;transition:padding .5s var(--ease),color .3s}@media (hover:hover){.cl a:hover{padding-left:.7rem;color:var(--accent)}}
.cl .n{font:500 .7rem var(--body);letter-spacing:.12em;color:var(--muted)}
.cl img,.cl .all{width:36px;height:44px;border-radius:999px 999px 0 0;object-fit:cover;background:var(--sand);display:block;filter:grayscale(1) contrast(.95);transition:filter .5s,scale .5s var(--ease)}@media (hover:hover){.cl a:hover img{filter:none;scale:1.06}}
.cl .all{display:grid;place-items:center;filter:none;border:1px solid var(--line);background:none}
.cl .all::after{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent)}
.cl b{font:400 1.3rem/1.15 var(--disp);letter-spacing:-.005em}
.cl small{color:var(--muted);font-size:.72rem;font-variant-numeric:tabular-nums}
.cl a[aria-current="true"] b{color:var(--accent);font-style:italic}
body.open .cl li,body.open .dx a{animation:slideIn .7s var(--ease) both;animation-delay:calc(var(--i,0)*55ms + 180ms)}
@keyframes slideIn{from{opacity:0;translate:-24px 0}to{opacity:1;translate:0 0}}
.dgrp{border:1px solid var(--accent-bg);padding:0 1.1rem;margin-bottom:.9rem}
.dgrp{background:var(--accent-bg);border-color:var(--accent-bg);color:var(--on-accent)}
.dgrp .dgh,.dgrp .cl a{color:var(--on-accent)}
.dgrp .dgh small,.dgrp .dgt em,.dgrp .cl small{color:var(--on-accent);opacity:.8}
.dgrp .cl li{border-bottom-color:rgba(253,245,236,.28)}.dgrp .cl a[aria-current="true"] b{color:#F7D3B8}@media (hover:hover){.dgrp .cl a:hover{color:#F7D3B8}}
.dgt{display:flex;flex-direction:column;gap:.25rem;min-width:0}
.dgt em{font:500 .6rem/1.2 var(--body);font-style:normal;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.dgh{display:flex;align-items:center;gap:.7rem;width:100%;min-height:64px;padding:.8rem 0;border:0;background:none;color:var(--ink);cursor:pointer;text-align:left;font:400 1.6rem/1.1 var(--disp);letter-spacing:-.005em}
.dgh small{margin-left:auto;color:var(--muted);font:500 .72rem var(--body);font-variant-numeric:tabular-nums}
.dgh .chev{margin-left:.2rem;align-self:center;width:9px;height:9px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;rotate:45deg;translate:0 -2px;transition:rotate .35s var(--ease),translate .35s var(--ease)}
.dgh[aria-expanded="true"] .chev{rotate:-135deg;translate:0 2px}
.dga{text-decoration:none}
.dga .chev{rotate:-45deg;translate:0 0}
.dgb{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s var(--ease)}
.dgh[aria-expanded="true"]+.dgb{grid-template-rows:1fr}
.dgb>div{overflow:hidden;min-height:0;visibility:hidden;transition:visibility 0s .45s}
.dgh[aria-expanded="true"]+.dgb>div{visibility:visible;transition-delay:0s}
.dgb .cl{padding-bottom:.6rem}.dgb .cl li:last-child{border-bottom:0}.dgb .cl li:first-child{border-top:1px solid rgba(253,245,236,.28)}
.dgb .cl a{grid-template-columns:minmax(0,1fr) auto;min-height:42px;gap:.6rem;padding:.3rem 0}
.dgb .cl b{font-size:1.1rem}
.dgb .cl li:first-child b{font-style:italic}
.dx{display:grid;grid-template-columns:1fr 1fr;column-gap:1rem;margin-top:1.1rem}
.dl .eyebrow{font-size:.64rem}
.dx a{padding:.5rem 0;text-decoration:none;font:500 .66rem var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);min-height:44px;display:flex;align-items:center;transition:color .3s,padding .4s var(--ease)}@media (hover:hover){.dx a:hover{color:var(--accent);padding-left:.5rem}}

/* hero */
.hero{overflow:hidden}
.hero>.wrap>.g{align-items:end;padding-top:clamp(2.4rem,6vw,4.6rem);min-height:min(760px,calc(100svh - var(--hdr)))}
.hc{grid-column:1/7;padding-bottom:clamp(2.6rem,6vw,5rem);min-width:0}
.hero .eyebrow{display:flex;align-items:center;gap:.9rem;margin-bottom:1.6rem}
.hero .eyebrow::before{content:"";width:2.4rem;height:1px;background:var(--accent);transform-origin:left;animation:grow 1.2s var(--ease) .1s both}
@keyframes grow{from{transform:scaleX(0)}}
h1{font:300 clamp(3.3rem,8.4vw,7.6rem)/.92 var(--disp);letter-spacing:-.025em}
h1 .ln{display:block;overflow:hidden;padding:.06em .14em .12em 0;margin:-.06em 0 -.12em}
h1 .ln>span{display:block;transform:translateY(112%) rotate(5deg);transform-origin:0 100%;filter:blur(6px);animation:lineUp 1.5s cubic-bezier(.16,1,.3,1) forwards;animation-delay:calc(var(--i)*.15s + .25s)}
@keyframes lineUp{to{transform:none;filter:blur(0)}}
h1 .ln:nth-child(3){padding-bottom:.22em;margin-bottom:-.22em}
h1 em{position:relative;display:inline-block}
h1 em::after{content:"";position:absolute;left:.02em;right:.04em;bottom:-.02em;height:.13em;background:var(--accent);opacity:.85;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 20' preserveAspectRatio='none'%3E%3Cpath d='M2 12 C 40 3, 70 17, 110 9 S 190 4, 230 11 S 280 14, 298 6' fill='none' stroke='black' stroke-width='3.2' stroke-linecap='round'/%3E%3C/svg%3E") center/100% 100% no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 20' preserveAspectRatio='none'%3E%3Cpath d='M2 12 C 40 3, 70 17, 110 9 S 190 4, 230 11 S 280 14, 298 6' fill='none' stroke='black' stroke-width='3.2' stroke-linecap='round'/%3E%3C/svg%3E") center/100% 100% no-repeat;clip-path:inset(0 100% 0 0);animation:draw 1.3s cubic-bezier(.65,0,.2,1) 1.7s forwards}
@keyframes draw{to{clip-path:inset(0 0 0 0)}}
.lead{max-width:40ch;margin:2rem 0 2.2rem;font-size:1.2rem;color:var(--muted);animation:fadeUp 1.1s var(--ease) .75s both}
.acts{display:flex;gap:.8rem;flex-wrap:wrap;animation:fadeUp 1.1s var(--ease) .9s both}
.status{display:flex;align-items:center;gap:.7rem;margin-top:2rem;font-size:.95rem;color:var(--muted);min-height:1.6em;animation:fadeUp 1.1s var(--ease) 1.05s both}
@keyframes fadeUp{from{opacity:0;translate:0 22px}to{opacity:1;translate:0 0}}
.dot{position:relative;width:8px;height:8px;border-radius:50%;background:var(--muted);flex:none}
.dot.on{background:#5B9B45}
.dot.on::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:1px solid #5B9B45;animation:ping 2.4s ease-out infinite}
@keyframes ping{from{transform:scale(.5);opacity:.9}to{transform:scale(1.5);opacity:0}}
.arches{--mx:0;--my:0;grid-column:7/13;position:relative;height:min(640px,54vw);min-width:0}
.moon{position:absolute;right:-6%;top:2%;width:66%;aspect-ratio:1;border-radius:50%;background:var(--hero);z-index:0;translate:calc(var(--mx)*-18px) calc(var(--my)*-12px);animation:moonIn 1.9s cubic-bezier(.2,.85,.2,1) .1s both,breathe 11s ease-in-out 2.2s infinite alternate}
.moon i{position:absolute;inset:-9%;border-radius:50%;border:1px solid var(--accent);opacity:0;animation:ringIn 1.8s var(--ease) .9s both,orbit 80s linear 0s infinite}
.moon i::after{content:"";position:absolute;top:-5px;left:50%;width:10px;height:10px;margin-left:-5px;border-radius:50%;background:var(--accent)}
@keyframes ringIn{from{opacity:0;scale:.9}to{opacity:.7;scale:1}}
@keyframes orbit{to{transform:rotate(360deg)}}
@keyframes moonIn{from{transform:scale(.25);opacity:0}}
@keyframes breathe{from{scale:1}to{scale:1.04}}
.arch-row{position:absolute;inset:0;display:flex;justify-content:center;align-items:flex-end;z-index:1}
.arch-row::before{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--ink);transform-origin:left;animation:grow 1.6s cubic-bezier(.65,0,.2,1) .1s both}
.hero-arch{position:relative;height:100%;aspect-ratio:819/896;max-width:100%;--p:8;will-change:transform}
.arch.hero-arch{animation:archOpen 1.9s cubic-bezier(.7,0,.15,1) .3s both;transition:none;translate:calc(var(--mx)*8px) calc(var(--my)*4px);transform:perspective(1100px) rotateY(calc(var(--mx)*3.2deg)) rotateX(calc(var(--my)*-2.2deg))}
@keyframes archOpen{from{clip-path:inset(100% 0 0 0 round 999px 999px 0 0)}to{clip-path:inset(0 0 0 0 round 999px 999px 0 0)}}
.hero-arch::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 38%,rgba(255,255,255,.32) 50%,transparent 62%);translate:-130% 0;animation:sheen 13s ease-in-out 3.2s infinite}
@keyframes sheen{0%{translate:-130% 0}14%,100%{translate:130% 0}}
.arch.hero-arch img{animation:kb2 3s cubic-bezier(.16,1,.3,1) .3s both;translate:calc(var(--mx)*-12px) calc(var(--my)*-8px)}
@keyframes kb2{from{scale:1.38}to{scale:1.06}}
.arch{overflow:hidden;border-radius:999px 999px 0 0;background:var(--sand);animation:rise 1.4s var(--ease) both;translate:calc(var(--mx)*var(--p)*1px) calc(var(--my)*var(--p)*.5px);transition:translate .8s var(--ease)}
.arch img{width:100%;height:100%;object-fit:cover;display:block}
.a1{height:62%;--p:-16;animation-delay:.3s}.a2{height:100%;--p:10;animation-delay:.45s}.a3{height:76%;--p:22;animation-delay:.6s}
@keyframes rise{from{transform:translateY(60px);opacity:0}to{transform:none;opacity:1}}
.marq{overflow:hidden;background:var(--hero);color:var(--on-accent);border-block:1px solid var(--hero-shade);padding-block:1.05rem;white-space:nowrap}
.marq div{display:inline-flex;animation:marq 120s linear infinite}@media (hover:hover){.marq:hover div{animation-play-state:paused}}
.marq span{font:italic 300 1.7rem/1 var(--disp);padding-right:2.6rem;display:inline-flex;align-items:center;gap:2.6rem}
.marq span::after{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.6}
@keyframes marq{to{transform:translateX(-50%)}}

/* category mosaic */
.bento{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:clamp(170px,19vw,270px);gap:var(--gap)}
.tile{position:relative;display:block;overflow:hidden;background:var(--sand);text-decoration:none;color:#FFF6EC;isolation:isolate}
.tile img{position:absolute;inset:-9% 0;width:100%;height:118%;object-fit:cover;display:block;transition:transform 1.1s var(--ease)}
.tile::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(24,12,7,.08) 35%,rgba(24,12,7,.78));transition:opacity .5s}@media (hover:hover){.tile:hover img{transform:scale(1.08)}}
.tn{position:absolute;z-index:2;top:1rem;left:1.1rem;font:500 .7rem var(--body);letter-spacing:.2em}
.arr{position:absolute;z-index:2;top:.9rem;right:.9rem;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,246,236,.6);display:grid;place-items:center;transition:background .4s,color .4s,rotate .5s var(--ease),border-color .4s}
.arr svg{width:16px;height:16px}@media (hover:hover){.tile:hover .arr{background:#FFF6EC;color:#251810;rotate:45deg;border-color:#FFF6EC}}
.cap{position:absolute;z-index:2;left:1.1rem;right:1.1rem;bottom:1rem;display:flex;flex-direction:column;gap:.15rem;transition:translate .6s var(--ease)}@media (hover:hover){.tile:hover .cap{translate:0 -8px}}
.cap b{font:400 clamp(1.5rem,2.2vw,1.9rem)/1.05 var(--disp);letter-spacing:-.005em}
.cap i{font:500 .68rem var(--body);font-style:normal;letter-spacing:.2em;text-transform:uppercase;opacity:.85}
.cap::before{content:"";width:0;height:1px;background:currentColor;margin-bottom:.5rem;transition:width .7s var(--ease)}@media (hover:hover){.tile:hover .cap::before{width:3rem}}
.t-tazas .cap b{font-size:clamp(2.2rem,4vw,3.4rem);font-weight:300}
.t-tazas{grid-column:1/7;grid-row:1/3}
.t-platos{grid-column:7/10;grid-row:1}.t-bowls{grid-column:10/13;grid-row:1}.t-macetas{grid-column:7/13;grid-row:2}
.t-mates{grid-column:1/4;grid-row:3}.t-aromas{grid-column:4/7;grid-row:3}.t-mesa{grid-column:7/10;grid-row:3}.t-deco{grid-column:10/13;grid-row:3}
.t-navidad{grid-column:1/13;grid-row:4}
@supports (animation-timeline:view()){
  .tile img{animation:para linear both;animation-timeline:view();animation-range:cover}
  @keyframes para{from{translate:0 -6%}to{translate:0 6%}}
}

/* catalogue band */
.cband{background:var(--hero);color:var(--on-accent);overflow:hidden}
.cband .g{align-items:center;row-gap:2.4rem}
.cband .eyebrow{color:inherit;opacity:.8;margin-bottom:1.4rem}.cband .eyebrow b{color:inherit}
.barches{grid-column:1/6;display:grid;grid-template-columns:30% 38% 28%;gap:2.5%;align-items:end;height:clamp(240px,28vw,380px);border-bottom:1px solid var(--on-accent);min-width:0}
.barches .arch{animation:none;translate:none}
.cb{grid-column:6/13;min-width:0}
.cb h2{color:var(--on-accent)}
.cb h2 em{font-style:normal;color:inherit}
.cb h2+.btn{margin-top:2rem}
.cb .sub{color:inherit;opacity:.9;margin-bottom:2rem}
.cband .btn,.help .btn,.chead .btn{--sw:var(--on-accent);--sw-ink:var(--hero-shade);background-color:var(--btn2);color:#F8EEE1;border-color:var(--btn2)}@media (hover:hover){.cband .btn:hover,.help .btn:hover,.chead .btn:hover{border-color:var(--on-accent)}}

/* supplies + services */
.about{row-gap:2.6rem;align-items:center}
#nosotros{overflow:hidden}
.aimg{grid-column:1/6;position:relative;min-width:0}
.aimg::before{content:"";position:absolute;right:-8%;top:6%;width:62%;aspect-ratio:1;border-radius:50%;background:var(--hero);z-index:0}
.aimg .arch{position:relative;z-index:1;width:78%;height:clamp(340px,40vw,540px);animation:none;translate:none;border-radius:999px 999px 0 0}
.atxt{grid-column:7/13;min-width:0}
.lede{font:300 clamp(1.7rem,3vw,2.5rem)/1.15 var(--disp);letter-spacing:-.01em;text-wrap:balance}
.atxt .sub{margin-top:1.2rem}
.vals{list-style:none;padding:0;margin-top:2rem;border-top:1px solid var(--line)}
.abtns{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:2.2rem}
.vals li{display:grid;grid-template-columns:minmax(110px,.6fr) 2fr;gap:.3rem 1.5rem;padding:1rem 0;border-bottom:1px solid var(--line)}
.vals b{font:400 1.45rem/1.1 var(--disp);color:var(--accent)}
.vals span{color:var(--muted)}
.alt{background:var(--paper);border-block:1px solid var(--line)}
.alt .g{row-gap:3rem}
.flowlead{max-width:46ch;color:var(--muted);margin:1.2rem 0 0}
.flow{position:relative;list-style:none;padding:0;margin:0 0 clamp(2.6rem,5vw,4.4rem);display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--gap)}
.flow::before{content:"";position:absolute;top:38px;left:38px;right:calc((100% - 4*var(--gap))/5 - 38px);height:1px;background:var(--ink);opacity:.55;transform:scaleX(0);transform-origin:left;transition:transform 1.6s var(--ease) .3s}
.flow.in::before,.nojs .flow::before{transform:none}
.flow li{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:.35rem}
.flow .ic{position:relative;z-index:1;display:grid;place-items:center;width:76px;height:76px;margin-bottom:.9rem;border:1px solid var(--ink);border-radius:50%;background:var(--paper);color:var(--ink);transition:background-color .5s,color .5s,border-color .5s,transform .6s var(--ease)}
.flow .ic svg{width:38px;height:38px}@media (hover:hover){.flow li:hover .ic{background:var(--accent-bg);color:var(--on-accent);border-color:var(--accent-bg);transform:translateY(-6px) rotate(-6deg)}}
.flow b{font:400 clamp(1.5rem,2vw,1.8rem)/1.1 var(--disp);transition:color .4s}@media (hover:hover){.flow li:hover b{color:var(--accent)}}
.flow .tx{color:var(--muted);font-size:.98rem;line-height:1.55;max-width:26ch}
.svcs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap)}
.svc{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:370px;padding:2.2rem clamp(1.6rem,3vw,2.8rem);border:0;border-radius:200px 200px 0 0;overflow:hidden;isolation:isolate;background:var(--accent-bg);color:var(--on-accent);transition:translate .6s var(--ease)}
.svc::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--brown);transform:translateY(101%);transition:transform .7s var(--ease)}@media (hover:hover){.svc:hover{translate:0 -6px}}@media (hover:hover){.svc:hover::before{transform:none}}
.svc.b{background:var(--btn2)}
.svc.c{background:var(--dark-line)}
.tarifas{margin-top:clamp(2.4rem,5vw,4.2rem);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);row-gap:1.4rem;padding-top:1.8rem;border-top:1px solid var(--line)}
.tarifas>.eyebrow{grid-column:1/4;padding-top:.3rem}
.tgs{grid-column:4/13;min-width:0;display:grid;gap:1.4rem}
.tg{padding:clamp(1.4rem,2.6vw,2.2rem);border:1px solid var(--line);background:rgba(255,255,255,.28);min-width:0}
.tgt{margin:0 0 1.2rem;font:400 clamp(1.5rem,2vw,1.8rem)/1.1 var(--disp)}
.k{display:block;font:500 .66rem/1.3 var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.pp{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.4rem}
.pr{min-width:0;padding-left:1.1rem;border-left:2px solid var(--accent)}
.pr b,.deg b{display:block;margin-top:.45rem;font:300 clamp(2.3rem,4.4vw,3.4rem)/1 var(--disp);color:var(--accent);font-variant-numeric:lining-nums tabular-nums;letter-spacing:-.01em}
.pr small{display:block;margin-top:.4rem;color:var(--muted);font-size:.92rem}
.meta{list-style:none;margin:1.8rem 0 0;padding:1.2rem 0 0;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:1rem 3rem}
.meta b{display:block;margin-top:.3rem;font:400 1.4rem/1.1 var(--disp)}
.tg2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.4rem}
.deg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.deg b{margin:0 0 .45rem;font-size:clamp(1.9rem,3.2vw,2.6rem)}
.big{margin:0;font:300 clamp(1.9rem,3.2vw,2.6rem)/1 var(--disp);color:var(--accent)}
.tcap{margin:1rem 0 0;color:var(--muted);font-size:.95rem;line-height:1.5}
.tnote{margin:0;color:var(--muted);font-size:.98rem;max-width:56ch}
.tcta{margin:0}
.engs{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:clamp(1.6rem,3vw,3rem);border-top:1px solid var(--line)}
.engs li{min-width:0;display:flex}
.eng{flex:1;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:1rem;min-height:84px;padding:.85rem .5rem;border-bottom:1px solid var(--line);color:var(--ink)}
.eng .sw{width:34px;height:34px;border-radius:50%;background:var(--c);box-shadow:inset 0 0 0 1px rgba(37,24,16,.25)}
.eng .en{min-width:0}
.eng .nm{display:block;font:400 1.2rem/1.15 var(--disp)}
.eng .pl{display:flex;flex-wrap:wrap;align-items:baseline;gap:.15rem .7rem;margin-top:.3rem}
.eng .pl b{font:500 1rem var(--body);font-variant-numeric:tabular-nums;white-space:nowrap}
.eng .k{display:inline}
.eng .ctl{margin:0;padding:0;align-self:center}
.eng .ctl .add{width:auto;min-height:40px;padding:0 1rem;font-size:.66rem;letter-spacing:.12em;white-space:nowrap}
.eng .ctl .l2{display:none}
.engpeso{margin:-.2rem 0 1rem;font-size:.82rem;color:var(--muted);letter-spacing:.02em}
.ci .csw{display:block;width:64px;height:64px;grid-row:span 2;border-radius:50%;background:var(--c);box-shadow:inset 0 0 0 1px rgba(37,24,16,.25)}
@media(max-width:1000px){.engs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.engs{grid-template-columns:minmax(0,1fr)}}
.svc .sic{position:absolute;top:2.6rem;left:50%;translate:-50% 0;display:grid;place-items:center;width:84px;height:84px;border:1px solid currentColor;border-radius:50%;opacity:.95;transition:transform .7s var(--ease)}
.svc .sic svg{width:44px;height:44px}@media (hover:hover){.svc:hover .sic{transform:scale(1.08) rotate(8deg)}}
.svc .tag{font:500 .7rem var(--body);letter-spacing:.22em;text-transform:uppercase;opacity:.75;margin:0 0 .6rem}
.svc h3{font:300 clamp(1.8rem,2.6vw,2.3rem)/1.08 var(--disp)}
.svc p:last-child{margin-top:.6rem;opacity:.92}
@media (max-width:1000px){
  .flow{grid-template-columns:1fr;gap:0;padding-left:0}
  .flow::before{top:38px;bottom:38px;left:38px;right:auto;width:1px;height:auto;transform:scaleY(0);transform-origin:top}
  .flow.in::before,.nojs .flow::before{transform:none}
  .flow li{display:grid;grid-template-columns:76px minmax(0,1fr);column-gap:1.3rem;row-gap:.15rem;align-items:center;padding-bottom:1.6rem}
  .flow li:last-child{padding-bottom:0}
  .flow .ic{grid-row:span 2;margin:0}
  .flow b{align-self:end}.flow .tx{align-self:start;max-width:none}
  .svcs{grid-template-columns:1fr}
  .tarifas>.eyebrow,.tgs{grid-column:1/13}
  .tg2{grid-template-columns:minmax(0,1fr)}
  .pp .k{min-height:2.7em}.pp{gap:1rem}.pr{padding-left:.9rem}
}
@media (max-width:560px){
  .flow .ic{width:64px;height:64px}.flow .ic svg{width:32px;height:32px}
  .flow li{grid-template-columns:64px minmax(0,1fr);column-gap:1.1rem}
  .flow::before{left:32px}
  .svc{min-height:300px;border-radius:150px 150px 0 0}
}

/* visit */
.visit{row-gap:2.6rem}
.va{grid-column:1/7}.vb{grid-column:8/13}
address{font:300 clamp(2rem,4vw,3.2rem)/1.08 var(--disp);font-style:normal;margin-bottom:2rem;letter-spacing:-.01em}
table{border-collapse:collapse;width:100%;max-width:420px}
th,td{text-align:left;padding:.75rem 0;border-bottom:1px solid var(--line);font-weight:400}
th{color:var(--muted)}
tr.hoy th,tr.hoy td{color:var(--accent);font-style:italic}
.contact{display:flex;flex-direction:column;gap:.9rem;align-items:flex-start}
.num{font:300 clamp(1.9rem,3.4vw,2.6rem)/1 var(--disp);font-variant-numeric:lining-nums tabular-nums;margin-bottom:.6rem}

/* newsletter */
.news{background:var(--forest);color:var(--on-dark);padding-block:clamp(3.4rem,8vw,6.5rem)}
.news .g{align-items:end;row-gap:2rem}
.na{grid-column:1/7}.nb{grid-column:8/13}
.news .eyebrow{color:inherit;opacity:.7;margin-bottom:1.2rem}.news .eyebrow b{color:var(--foot-accent)}
.news h2{color:#FAEFE3}.news h2 em{color:var(--foot-accent)}
.news p.t{margin-top:1rem;opacity:.85;max-width:40ch}
.nf{display:flex;gap:1rem;flex-wrap:wrap;align-items:flex-end}
.nf input{flex:1 1 240px;min-width:0;min-height:52px;border:0;border-bottom:1px solid rgba(244,232,218,.55);border-radius:0;padding:.6rem 0;background:transparent;color:#FAEFE3;font:400 1.35rem var(--disp);transition:border-color .3s}
.nf input::placeholder{color:rgba(244,232,218,.55);font-style:italic}
.nf input:focus{outline:none;border-bottom-color:var(--foot-accent)}
.nf input:focus-visible{outline:none}
.news .btn{--sw:#FAEFE3;--sw-ink:var(--forest)}
.nm{min-height:1.7em;margin-top:.9rem;font-style:italic}
.nm.err{color:#FFC9B0}

/* footer */
.foot{background:var(--brown);color:var(--on-dark);padding-top:clamp(3.4rem,7vw,5.6rem);overflow:hidden}
.foot .g{row-gap:2.6rem;padding-bottom:clamp(2.6rem,5vw,4rem)}
.f1{grid-column:1/6}.f3{grid-column:6/10}.f4{grid-column:10/13}
.f2{grid-column:1/13;order:5;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:var(--gap);row-gap:0;padding-top:clamp(1.6rem,3vw,2.2rem);border-top:1px solid var(--dark-line)}
.fd summary{list-style:none;cursor:default;font:500 .7rem var(--body);letter-spacing:.22em;text-transform:uppercase;color:var(--foot-accent);margin-bottom:.7rem;pointer-events:none}
.fd summary::-webkit-details-marker{display:none}
.fd summary small{opacity:.6;letter-spacing:.1em;margin-left:.4rem;font-size:.66rem}
.foot .fd li a{padding:.14rem 0;font-size:.9rem}
.flogo{display:flex;align-items:center;gap:1.1rem}
.flogo img{width:88px;height:88px;border-radius:0;display:block;flex:none}
.flogo span{font:300 2.1rem/1 var(--disp)}
.f1 p{margin-top:1.3rem;opacity:.8;max-width:32ch;font-size:.98rem}
.foot h4{font:500 .7rem var(--body);letter-spacing:.22em;text-transform:uppercase;color:var(--foot-accent);margin-bottom:1.1rem}
.foot ul{list-style:none;padding:0;display:flex;flex-direction:column;gap:.05rem}
.foot li a{display:inline-block;padding:.28rem 0;text-decoration:none;opacity:.88;font-size:1rem;background:linear-gradient(var(--foot-accent),var(--foot-accent)) left calc(100% - .2rem)/0 1px no-repeat;transition:background-size .4s var(--ease),opacity .3s,color .3s}@media (hover:hover){.foot li a:hover{opacity:1;color:#fff;background-size:100% 1px}}
.foot .open{display:flex;align-items:center;justify-content:flex-start;gap:.7rem;width:auto;margin:1.6rem 0 0;padding:1.1rem 0 0;border-top:1px solid var(--dark-line);font-size:.95rem;text-align:left;opacity:.95}
.foot .dot{background:var(--on-dark);opacity:.5}.foot .dot.on{background:#7BC862;opacity:1}
.foot .hrs{font-size:1rem;opacity:.88;line-height:1.75}
.fb{border-top:1px solid var(--dark-line);padding-block:1.4rem calc(1.4rem + env(safe-area-inset-bottom,0px))}
.fb .wrap{display:flex;flex-wrap:wrap;gap:.6rem 2rem;justify-content:space-between;font:500 .72rem var(--body);letter-spacing:.14em;text-transform:uppercase;opacity:.75}
.fb a{text-underline-offset:5px}

/* category view */
.crumbs{display:flex;flex-wrap:wrap;gap:.2rem .7rem;font:500 .72rem var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:1.6rem}
.crumbs a{text-decoration:none}@media (hover:hover){.crumbs a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:5px}}
.crumbs [aria-current]{color:var(--accent)}
.chead{padding-block:clamp(2rem,4vw,3.2rem);background:var(--hero);color:var(--on-accent)}
.chead .crumbs,.chead .crumbs a{color:inherit;opacity:.85}.chead .crumbs [aria-current]{color:#F7D3B8;opacity:1}@media (hover:hover){.chead .crumbs a:hover{color:#fff;opacity:1}}
.chead .sub{color:inherit;opacity:.9}
.ptitle{font:300 clamp(3rem,8vw,7rem)/.95 var(--disp);letter-spacing:-.025em;text-wrap:balance;animation:fadeUp 1s var(--ease) both}
.chead .sub{animation:fadeUp 1s var(--ease) .12s both}
.filters{position:sticky;top:calc(env(safe-area-inset-top,0px) + var(--hdr));z-index:5;background:color-mix(in srgb,var(--bg) 92%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-block:1px solid var(--line)}
.filters .wrap{display:flex;flex-direction:column;gap:.2rem;padding-block:.5rem}
.frow{display:flex;gap:1.6rem;flex-wrap:wrap;align-items:flex-end}
.search,.sort{min-height:48px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;color:var(--ink);font:400 16px var(--body);padding:.5rem 0;transition:border-color .3s}
.search{flex:1 1 240px;min-width:0}
.sort{padding-right:.4rem;cursor:pointer}
.search:focus,.sort:focus{outline:none;border-bottom-color:var(--ink)}
.search::placeholder{color:var(--muted);font-style:italic}
.chips{display:flex;gap:1.5rem;overflow-x:auto;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{position:relative;flex:none;display:inline-flex;align-items:center;gap:.4rem;min-height:46px;color:var(--muted);font:500 .72rem var(--body);letter-spacing:.16em;text-transform:uppercase;text-decoration:none;white-space:nowrap;transition:color .3s}
.chip small{font-size:.7rem;opacity:.7;font-variant-numeric:tabular-nums}
.chip::after{content:"";position:absolute;left:0;right:0;bottom:6px;height:1px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}@media (hover:hover){.chip:hover{color:var(--ink)}}.chip[aria-current="page"]::after{transform:none}@media (hover:hover){.chip:hover::after{transform:none}}
.chip[aria-current="page"]{color:var(--accent)}.chip[aria-current="page"]::after{background:var(--accent)}
.count{margin:2rem 0 1.4rem;font:500 .72rem var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.grid{list-style:none;padding:0;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:3rem var(--gap)}
.m{grid-column:span 6;display:flex;flex-direction:column;min-width:0}
.m.enter{animation:cardIn .9s var(--ease) both;animation-delay:var(--d,0s)}
@keyframes cardIn{from{opacity:0;translate:0 36px}to{opacity:1;translate:0 0}}
.ph{aspect-ratio:1/1;overflow:hidden;background:var(--paper)}
.ph img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.1s var(--ease)}@media (hover:hover){.m:hover .ph img{transform:scale(1.06)}}
.cat{margin-top:1rem;display:block;font:500 .66rem var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--accent)}
.dsc{margin:-.1rem 0 .7rem;color:var(--muted);font-size:.95rem;line-height:1.45;max-width:34ch}
.cmgrid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--gap)}
.cmgrid .tile{aspect-ratio:4/5}
.cmgrid .tile .cap b{font-size:clamp(1.3rem,1.9vw,1.7rem);font-weight:400}
.trgrid{grid-template-columns:repeat(3,minmax(0,1fr))}
.cmcta{margin:clamp(1.6rem,3vw,2.4rem) 0 0}
@media (max-width:820px){.cmgrid{grid-template-columns:repeat(2,minmax(0,1fr))}.cmgrid .tile{aspect-ratio:1/1}.cmgrid .tile:last-child{grid-column:1/3;aspect-ratio:2/1}.cmgrid .tile .cap b{font-size:1.25rem}}
.m h3{font:500 clamp(1.35rem,1.8vw,1.6rem)/1.12 var(--disp);margin:.9rem 0 .4rem;text-wrap:pretty}
.cat+h3{margin-top:.3rem}
.price{font:500 1.45rem/1.2 var(--disp);color:var(--accent);font-variant-numeric:lining-nums tabular-nums}
.vars{list-style:none;padding:0;display:flex;flex-direction:column;font-size:.92rem;font-variant-numeric:lining-nums tabular-nums}
.vars li{display:flex;justify-content:space-between;gap:.8rem;border-bottom:1px solid var(--line);padding-block:.22rem}
.vars span{color:var(--muted)}
.vars b{color:var(--accent);font:500 1.1rem var(--disp)}
.ask{margin-top:auto;padding-top:.8rem}
.empty{padding:2.5rem 0}.empty p{margin-bottom:1rem;color:var(--muted)}
.help{display:flex;flex-wrap:wrap;gap:1.4rem 2rem;align-items:center;justify-content:space-between;margin-top:clamp(3rem,6vw,5rem);padding:clamp(1.8rem,4vw,3rem);background:var(--hero);color:var(--on-accent)}
.help h3{font:300 clamp(1.8rem,3vw,2.5rem)/1.08 var(--disp)}.help p{opacity:.9;margin-top:.3rem}

@media (max-width:900px){.subnav{display:none}}
@media (min-width:700px){.m{grid-column:span 4}}
@media (min-width:1040px){.m{grid-column:span 3}}
@media (max-width:900px){
  :root{--hdr:72px}
  .hc,.arches{grid-column:1/13}
  .hero>.wrap>.g{min-height:0}
  .hc{padding-bottom:2.4rem}
  .arches{height:min(400px,80vw);margin-bottom:0}
  .shead>.eyebrow,.shead>div{grid-column:1/13}
  .aimg,.atxt{grid-column:1/13}
  .aimg .arch{width:72%;height:min(380px,90vw)}
  .vals li{grid-template-columns:1fr}
  .barches,.cb,.rows,.svcs,.va,.vb,.na,.nb{grid-column:1/13}
  .barches{height:min(300px,70vw)}
  .rows li{grid-template-columns:1fr}
  .f1{grid-column:1/13}.f3{grid-column:span 6}.f4{grid-column:1/13}
  .f2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bento{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:170px}
  .t-tazas{grid-column:1/3}.t-macetas{grid-column:1/3}
  .t-platos,.t-bowls,.t-mates,.t-aromas,.t-mesa,.t-deco{grid-column:auto;grid-row:auto}
  .t-navidad{grid-column:1/3;grid-row:auto;order:8}
  .t-tazas{grid-row:span 2;order:0}.t-platos{order:1}.t-bowls{order:2}.t-macetas{grid-row:auto;order:3}
  .t-mates{order:4}.t-aromas{order:5}.t-mesa{order:6}.t-deco{order:7}
  .tile:not(.t-tazas):not(.t-macetas) .cap b{font-size:1.3rem}
  .tile:not(.t-tazas):not(.t-macetas) .arr{width:36px;height:36px;top:.6rem;right:.6rem}
  .tile:not(.t-tazas):not(.t-macetas) .cap{left:.8rem;right:.8rem;bottom:.8rem}
  .tile:not(.t-tazas):not(.t-macetas) .tn{left:.8rem;top:.8rem}
}
@media (max-width:560px){
  .menu>span:last-child{display:none}
  .top .brand span{display:none}
  .top .btn{padding:.45rem 1rem}
  .f3{grid-column:1/13}
  .marq span{font-size:1.4rem}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}
  h1 .ln>span{transform:none;filter:none}
  .rv{opacity:1;translate:0 0}
  .shead::before{transform:none}
}
::view-transition-old(root),::view-transition-new(root){animation-duration:.35s}

/* cart */
.right{gap:.8rem}
.cartbtn{position:relative;width:46px;height:46px;border-radius:50%;border:1px solid var(--ink);background:transparent;color:var(--ink);display:grid;place-items:center;cursor:pointer;transition:background .35s,color .35s}@media (hover:hover){.cartbtn:hover{background:var(--ink);color:var(--bg)}}
.cartbtn svg{width:21px;height:21px}
.cnt{position:absolute;top:-6px;right:-6px;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:var(--accent-bg);color:var(--on-accent);font:600 .7rem/20px var(--body);text-align:center;font-variant-numeric:tabular-nums}
.cnt.bump,.cartbar.bump{animation:bump .5s var(--ease)}
@keyframes bump{40%{transform:scale(1.25)}}
.cart{position:fixed;top:0;bottom:0;right:0;z-index:60;width:min(96vw,470px);background:var(--paper);color:var(--ink);display:flex;flex-direction:column;transform:translateX(102%);visibility:hidden;transition:transform .6s var(--ease),visibility .6s;padding-top:env(safe-area-inset-top,0px);padding-right:env(safe-area-inset-right,0px)}
body.cartopen .scrim{opacity:1;visibility:visible}
body.cartopen .cart{transform:none;visibility:visible}
.cart .dh{padding-block:1rem}
.ct{font:300 1.9rem/1 var(--disp)}
.cbody{flex:1;min-height:0;overflow-y:auto;padding:.4rem 1.4rem 1rem}
.cempty{padding:2.2rem 0;color:var(--muted)}
.cempty .tl{margin-top:.6rem;color:var(--ink)}
.ci{list-style:none;padding:0}
.ci li{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:.2rem 1rem;align-items:start;padding:1rem 0;border-bottom:1px solid var(--line)}
.ci img{width:64px;height:64px;object-fit:cover;display:block;background:var(--sand);grid-row:span 2}
.ci b{font:500 1.2rem/1.15 var(--disp);display:block}
.ci .cv{display:block;font-size:.85rem;color:var(--muted)}
.ci .cu{font-size:.85rem;color:var(--muted);font-variant-numeric:tabular-nums}
.ci .cs{font:500 1.2rem var(--disp);color:var(--accent);font-variant-numeric:lining-nums tabular-nums;text-align:right;white-space:nowrap}
.ci .cr{grid-column:2/4;display:flex;align-items:center;justify-content:space-between;gap:.8rem}
.stp{display:inline-flex;align-items:center;border:1px solid var(--ink);border-radius:999px}
.stp button{width:40px;height:40px;border:0;background:none;color:inherit;font:400 1.3rem/1 var(--body);cursor:pointer;border-radius:50%}@media (hover:hover){.stp button:hover{background:var(--ink);color:var(--bg)}}
.stp output{min-width:2ch;text-align:center;font:500 1rem var(--body);font-variant-numeric:tabular-nums}
.rm{border:0;background:none;color:var(--muted);font:500 .7rem var(--body);letter-spacing:.16em;text-transform:uppercase;cursor:pointer;min-height:40px;padding:0 .2rem}@media (hover:hover){.rm:hover{color:var(--accent)}}
.cfoot{border-top:1px solid var(--line);padding:1rem 1.4rem calc(1.2rem + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:.7rem;background:var(--paper)}
.ctot{display:flex;justify-content:space-between;align-items:baseline}
.ctot span{font:500 .72rem var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.ctot b{font:400 2rem/1 var(--disp);font-variant-numeric:lining-nums tabular-nums}
.cfoot label{display:flex;flex-direction:column;gap:.1rem;font:500 .68rem var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.cfoot input,.cfoot textarea{border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;color:var(--ink);font:400 16px var(--body);padding:.4rem 0;resize:none;transition:border-color .3s}
.cfoot input:focus,.cfoot textarea:focus{outline:none;border-bottom-color:var(--ink)}
.cfoot .btn{width:100%}
.crow{display:flex;gap:1.2rem;flex-wrap:wrap}
.cfine{font-size:.82rem;color:var(--muted);line-height:1.45}
.cmsg{font-size:.88rem;font-style:italic;color:var(--accent)}
.cartbar{position:fixed;left:50%;bottom:calc(14px + env(safe-area-inset-bottom,0px));translate:-50% 0;z-index:40;display:none;align-items:center;gap:1.2rem;max-width:calc(100vw - 28px);padding:.85rem 1.5rem;border:0;border-radius:999px;background:var(--accent-bg);color:var(--on-accent);box-shadow:0 14px 40px rgba(0,0,0,.28);font:500 .74rem var(--body);letter-spacing:.14em;text-transform:uppercase;cursor:pointer;white-space:nowrap}
.cartbar.show{display:flex;animation:barIn .6s var(--ease)}
.cartbar b{font:500 1.15rem var(--disp);letter-spacing:0;text-transform:none;font-variant-numeric:lining-nums tabular-nums}
@keyframes barIn{from{opacity:0;transform:translateY(30px)}}
body.open .cartbar,body.cartopen .cartbar{display:none}
body.hascart{padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.vsel{display:flex;flex-direction:column;margin-bottom:.2rem}
.vsel button{display:flex;justify-content:space-between;align-items:center;gap:.6rem;width:100%;min-height:42px;padding:.3rem .6rem;border:0;border-bottom:1px solid var(--line);background:transparent;color:inherit;font:400 .94rem var(--body);text-align:left;cursor:pointer;transition:background .3s,box-shadow .3s;font-variant-numeric:lining-nums tabular-nums}
.vsel button span{color:var(--muted)}
.vsel button b{color:var(--accent);font:500 1.15rem var(--disp)}@media (hover:hover){.vsel button:hover{background:color-mix(in srgb,var(--accent) 8%,transparent)}}
.vsel button[aria-checked="true"]{background:color-mix(in srgb,var(--accent) 14%,transparent);box-shadow:inset 3px 0 0 var(--accent)}
.vsel button[aria-checked="true"] span{color:var(--ink)}
.inq{display:inline-grid;place-items:center;min-width:1.4rem;height:1.4rem;margin-left:.4rem;border-radius:999px;background:var(--accent-bg);color:var(--on-accent);font:600 .7rem var(--body)}
.ctl{margin-top:auto;padding-top:.9rem}
.add{width:100%;min-height:48px;padding:.6rem .8rem;letter-spacing:.14em;white-space:normal}
.ctl .stp{width:100%;justify-content:space-between;min-height:48px}
.ctl .stp button{width:48px;height:46px}
button.tl{border:0;padding:0;background-color:transparent;color:var(--ink);cursor:pointer}
.cmsg:empty{display:none}
.cfoot{gap:.55rem}

[hidden]{display:none!important}
.cstep{flex:1;min-height:0;display:flex;flex-direction:column}
.cmsg.err{color:var(--err,#B3321F);font-style:normal}
.cdone .oid{font:300 clamp(2.2rem,8vw,3rem)/1 var(--disp);letter-spacing:.02em;margin:.2rem 0 1rem;color:var(--accent)}
.opay:empty{display:none}
/* pedido listo: simple y liviano */
.cbody.cdone{padding:1rem 1.6rem 2rem}
.cdone .oid{font-size:clamp(1.8rem,6.5vw,2.3rem);margin:.1rem 0 1rem}
.cdone .olead{margin:0 0 1.6rem;font-size:1rem;line-height:1.65}
.osum{display:grid;grid-template-columns:auto 1fr;gap:.45rem 1.4rem;margin:0 0 1.8rem;padding:1rem 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:.98rem}
.osum dt{margin:0;color:var(--muted)}
.osum dd{margin:0;text-align:right;line-height:1.5}
.opay{padding:0;border:0;font-size:1rem;line-height:1.5}
.opay .nt{margin:0 0 .9rem;font:500 .7rem var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.opay ol{margin:0;padding:0;list-style:none;display:grid;gap:.8rem;counter-reset:st}
.opay li{position:relative;padding-left:2.2rem;counter-increment:st}
.opay li::before{content:counter(st);position:absolute;left:0;top:.12rem;width:1.5rem;height:1.5rem;border-radius:50%;border:1px solid var(--line);color:var(--muted);display:grid;place-items:center;font:500 .78rem/1 var(--body)}
.tpay{margin:2.2rem 0 0;padding:1.6rem 0 0;border-top:1px solid var(--line);font-size:1rem;line-height:1.55}
.tpay .tk{margin:0 0 .8rem;font:500 .7rem var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.twarn{display:flex;gap:.65rem;margin:0 0 1.2rem;font-size:.95rem;line-height:1.55;color:var(--muted)}
.twarn::before{content:"";flex:none;width:6px;height:6px;margin-top:.55rem;border-radius:50%;background:var(--accent)}
.tkey{display:grid;margin-bottom:.6rem}
.krow{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:1rem;padding:.9rem 0;border-top:1px solid var(--line)}
.krow small{grid-column:1;font:500 .66rem var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.krow b{grid-column:1;display:block;font:400 clamp(1.6rem,7vw,1.95rem)/1.15 var(--disp);letter-spacing:.01em;overflow-wrap:anywhere;user-select:all;-webkit-user-select:all}
.krow:nth-child(n+2) b{font:500 1rem/1.4 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.kcp{grid-column:2;grid-row:1/3;min-height:44px;padding:0 .2rem;border:0;background:transparent;color:var(--accent);font:500 .72rem var(--body);letter-spacing:.16em;text-transform:uppercase;cursor:pointer;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.kcp.ok{color:var(--ink);text-decoration:none}
.tdl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:.3rem 1.2rem;padding:.9rem 0;border-top:1px solid var(--line);font-size:.96rem}
.tdl dt{color:var(--muted)}.tdl dd{margin:0;text-align:right;overflow-wrap:anywhere}
.tmore{border-top:1px solid var(--line)}
.tmore summary{display:flex;align-items:center;min-height:48px;cursor:pointer;color:var(--muted);font:500 .7rem var(--body);letter-spacing:.16em;text-transform:uppercase;list-style:none}
.tmore summary::-webkit-details-marker{display:none}
.tmore summary::after{content:"+";margin-left:auto;font-size:1.2rem;letter-spacing:0}
.tmore[open] summary::after{content:"\2212"}
.tmore .tdl{border-top:0;padding-top:0}
.tmsg{margin:.6rem 0 0;font-style:normal}
.oacts{display:flex;flex-wrap:wrap;gap:.2rem 1.6rem;margin-top:1.8rem;padding-top:.6rem;border-top:1px solid var(--line)}
.oacts .tl{min-height:44px;font-size:.68rem;color:var(--muted);background-image:none}
@media (max-width:360px){.krow:nth-child(n+2) b{font-size:.86rem}}
@media (max-width:560px){#waTop{display:none}}

/* mobile polish */
html{-webkit-tap-highlight-color:transparent}
a,button,summary,label,select,input[type=radio]{touch-action:manipulation}
.drawer,.cart,.cbody,.dbody{overscroll-behavior:contain}
.menu{min-width:48px;padding:0 .5rem;margin-left:-.5rem}
.fb a{display:inline-flex;align-items:center;min-height:44px}
.fb .wrap{line-height:1.5;align-items:center}
@media (max-width:900px){
  .crumbs{margin-bottom:.9rem;gap:0 .2rem}
  .crumbs a{display:inline-flex;align-items:center;min-height:40px;padding-inline:.3rem;margin-inline:-.3rem}
  .crumbs{align-items:center}
  .crumbs [aria-current]{display:inline-flex;align-items:center;min-height:40px}
  .foot li a{display:inline-flex;align-items:center;min-height:44px}
  .foot ul{gap:0}
  .f2{grid-template-columns:1fr;column-gap:0;padding-top:0;border-top:1px solid var(--dark-line)}
  .fd{border-bottom:1px solid var(--dark-line)}
  .fd summary{display:flex;align-items:center;justify-content:space-between;min-height:52px;margin:0;cursor:pointer;pointer-events:auto;font-size:.74rem}
  .fd summary::after{content:"";width:.55rem;height:.55rem;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .3s var(--ease);flex:none}
  .fd[open] summary::after{transform:rotate(-135deg) translate(-2px,-2px)}
  .fd ul{padding-bottom:.8rem}
  .foot .fd li a{font-size:1rem;padding:0}
}
@media (max-width:560px){
  .crumbs{font-size:.66rem;letter-spacing:.1em}
  .chead{padding-block:1.4rem 1.8rem}
  .chead h1{font-size:clamp(2.1rem,9.5vw,2.6rem);line-height:1.05}
  .frow{flex-wrap:nowrap;gap:1.1rem;align-items:flex-end}
  .frow .search{flex:1 1 0;min-width:0}
  .frow .sort{flex:0 0 auto;max-width:44%}
  .filters .wrap{gap:0;padding-block:.2rem}
  .add .l2{display:none}
  .add{letter-spacing:.14em}
  .fb .wrap{flex-direction:column;align-items:flex-start;gap:0}
  .cartbar{width:calc(100vw - 32px);max-width:420px;justify-content:space-between}
}
@media (max-width:360px){
  :root{--gut:16px}
  .cartbar{gap:.6rem;padding:.8rem 1.1rem;font-size:.64rem;letter-spacing:.08em}
  .cartbar b{font-size:1rem}
  .chip{letter-spacing:.12em}
  .cart,.drawer{width:100vw}
}

.marq{animation:marqIn 1.4s cubic-bezier(.16,1,.3,1) 1.3s both}
@keyframes marqIn{from{transform:translateY(100%)}}
.acts .btn{transition:background-size .45s var(--ease),color .45s,border-color .45s,translate .5s var(--ease)}
@supports (animation-timeline:view()){
  @media (prefers-reduced-motion:no-preference){
    .hc{animation:hcOut linear both;animation-timeline:view();animation-range:exit 0% exit 100%}
    .arches{animation:arOut linear both;animation-timeline:view();animation-range:exit 0% exit 100%}
  }
}
@keyframes hcOut{to{translate:0 -70px;opacity:.1}}
@keyframes arOut{to{translate:0 46px}}
@media (prefers-reduced-motion:reduce){h1 em::after{clip-path:none}.hero-arch::after{display:none}}
.opt .hint{color:var(--muted);font-size:.85rem}
/* animaciones sutiles del pedido */
@media (prefers-reduced-motion:no-preference){
  .envwrap{transition:grid-template-rows .55s var(--ease),margin-top .55s var(--ease),opacity .4s ease,visibility 0s linear .55s}
  .envwrap.on{transition:grid-template-rows .55s var(--ease),margin-top .55s var(--ease),opacity .5s ease .08s,visibility 0s}
  @keyframes stepIn{from{opacity:0;transform:translateY(8px)}}
  @keyframes idIn{from{opacity:0;letter-spacing:.16em;filter:blur(5px)}}
  @keyframes pick{50%{transform:scale(.985)}}
  .cstep:not([hidden]) .cform>*,.cstep:not([hidden]) .cdone>*{animation:stepIn .65s var(--ease) both}
  .cstep:not([hidden]) .cform>:nth-child(2){animation-delay:.06s}
  .cstep:not([hidden]) .cform>:nth-child(3){animation-delay:.12s}
  .cstep:not([hidden]) .cform>:nth-child(4){animation-delay:.18s}
  .cstep:not([hidden]) .cform>:nth-child(5){animation-delay:.24s}
  .cstep:not([hidden]) .cdone>:nth-child(2){animation-delay:.08s}
  .cstep:not([hidden]) .cdone>:nth-child(3){animation-delay:.16s}
  .cstep:not([hidden]) .cdone>:nth-child(4){animation-delay:.24s}
  .cstep:not([hidden]) .cdone>:nth-child(5){animation-delay:.32s}
  .cstep:not([hidden]) .cdone>:nth-child(6){animation-delay:.4s}
  .cstep:not([hidden]) .cdone>.oid{animation:idIn .8s var(--ease) .05s both}
  .cstep:not([hidden]) .tpay>*{animation:stepIn .6s var(--ease) both}
  .cstep:not([hidden]) .tpay>:nth-child(2){animation-delay:.5s}
  .cstep:not([hidden]) .tpay>:nth-child(3){animation-delay:.58s}
  .cstep:not([hidden]) .tpay>:nth-child(4){animation-delay:.66s}
  .cstep:not([hidden]) .tpay>:nth-child(5){animation-delay:.74s}
  .cstep:not([hidden]) .tpay>:nth-child(6){animation-delay:.82s}
  .cstep:not([hidden]) .tpay>:nth-child(7){animation-delay:.9s}
  .opt:has(input:checked){animation:pick .4s var(--ease)}
  .opt input{transition:transform .3s var(--ease)}
  .opt:has(input:checked) input{transform:scale(1.12)}
  .kcp{transition:background-color .3s,color .3s,transform .3s var(--ease)}
}
/* formulario "Tus datos": cómodo y balanceado */
.cform{display:flex;flex-direction:column}
.cbody.cform{gap:2rem;padding:1.7rem 1.6rem 2.2rem}
.fld{display:flex;flex-direction:column;gap:.6rem;font:500 .74rem var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.fld input,.fld textarea{width:100%;min-height:54px;border:1px solid var(--line);border-radius:0;background:rgba(255,255,255,.38);color:var(--ink);font:400 17px/1.4 var(--body);letter-spacing:0;text-transform:none;padding:.85rem 1rem;resize:none;transition:border-color .25s,background-color .25s,box-shadow .25s}
.fld textarea{min-height:108px}
.fld input::placeholder,.fld textarea::placeholder{color:#85766A;opacity:1}
.fld input:focus,.fld textarea:focus{outline:none;border-color:var(--ink);background:rgba(255,255,255,.62);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 16%,transparent)}
.fld input.bad{border-color:var(--err,#B3321F)}
.cform fieldset{border:0;padding:0;margin:0;display:grid;gap:.8rem}
.cform legend{padding:0;margin-bottom:1rem;font:500 .74rem var(--body);letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.opt{display:flex;align-items:flex-start;gap:.95rem;min-height:62px;padding:1.05rem 1.15rem;border:1px solid var(--line);background:rgba(255,255,255,.25);cursor:pointer;font:400 1.06rem/1.4 var(--body);transition:border-color .25s,background-color .25s}
.opt input{width:20px;height:20px;margin:.15rem 0 0;accent-color:var(--accent);flex:none}
.opt:has(input:checked){border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,transparent)}
.opt .hint{display:block;margin-top:.2rem}
#fEnvio{display:grid;grid-template-columns:minmax(0,1fr);gap:1.7rem;margin-left:0;padding:0 .35rem 0 1.2rem;border-left:2px solid var(--accent);overflow:hidden;min-height:0}
.envwrap.on #fEnvio{padding-block:.35rem}
.envwrap{display:grid;grid-template-rows:0fr;margin-top:-2rem;visibility:hidden;opacity:0}
.envwrap.on{grid-template-rows:1fr;margin-top:0;visibility:visible;opacity:1}
.fld:focus-within{color:var(--ink)}
.fld{transition:color .3s}
.fpair{display:grid;grid-template-columns:minmax(0,1fr) 8rem;gap:1.2rem}.fpair>*{min-width:0}
@media (max-width:370px){.fpair{grid-template-columns:minmax(0,1fr)}}
.cform .cfine{font-size:.95rem;line-height:1.6}
.paynote{margin:0;padding:1.3rem 1.3rem;background:rgba(34,21,15,.05);font-size:1rem;line-height:1.65}
.paynote b{color:var(--ink);font-weight:600}

.legalrow{border-top:1px solid var(--dark-line);padding-block:.9rem}
.legalrow .wrap{display:flex;flex-wrap:wrap;gap:.4rem 1.6rem;align-items:center;justify-content:space-between}
.legalrow ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:0 1.5rem}
.legalrow li a{display:inline-flex;align-items:center;min-height:44px;color:inherit;opacity:.82;font-size:.92rem;text-decoration:none;transition:opacity .3s}@media (hover:hover){.legalrow li a:hover{opacity:1;text-decoration:underline;text-underline-offset:5px}}
.foot .legalrow ul{flex-direction:row;gap:0 1.6rem}
.legalrow{padding-block:.2rem}
.foot .fb{padding-block:1rem calc(1rem + env(safe-area-inset-bottom,0px))}
.legalid{flex-basis:100%;margin:0;font-size:.82rem;opacity:.65}
.lgsec{padding-top:clamp(2rem,5vw,3.6rem)}
.prose{max-width:68ch}
.prose h2{font:400 clamp(1.4rem,2.2vw,1.8rem)/1.2 var(--disp);margin:2rem 0 .5rem}
.prose p{margin:.5rem 0;color:var(--ink)}
.prose a{color:var(--accent);text-underline-offset:4px}
.prose .lgup{color:var(--muted);font-size:.9rem}

.cintro{max-width:62ch;margin:3.5rem 0 0;padding-top:1.6rem;border-top:1px solid var(--line);color:var(--muted);font-size:1.02rem;line-height:1.7}
.cintro:empty{display:none}
