@font-face{font-family:"Playfair Display";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/playfair-display-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Playfair Display";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/playfair-display-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Playfair Display";font-style:italic;font-weight:400;font-display:swap;src:url(fonts/playfair-display-latin-400-italic.woff2) format("woff2")}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/montserrat-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/montserrat-latin-500-normal.woff2) format("woff2")}
body{margin:0}img{max-width:100%}[hidden]{display:none!important}

/* Layout: editorial de lujo. Cabecera mínima con marca espaciada, portada asimétrica con arco, catálogo en paneles altos sin cajas, ritual en tres pasos, carrito lateral que arma el pedido de WhatsApp. Fondo vainilla. */
:root{
  --bg:#fcf8e8; --surface:#fffdf3; --fg:#2b2415; --muted:#7d7357; --line:#ebe2c3;
  --accent:#8f6d2a; --btn-bg:#2b2415; --btn-fg:#fcf8e8; --tint-l:88%; --glow:rgba(143,109,42,.10);
  --display:"Playfair Display", "Times New Roman", Georgia, serif;
  --body:"Montserrat", "Helvetica Neue", Arial, sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;font-size:106.25%}
body{background:var(--bg);color:var(--fg);font-family:var(--body);font-weight:400;font-size:1rem;line-height:1.65;
  padding-left:max(16px, env(safe-area-inset-left, 0px));padding-right:max(16px, env(safe-area-inset-right, 0px));padding-block:0 40px}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top, 0px);background:var(--bg);z-index:30}
.wrap{max-width:1180px;margin:0 auto}
button{font:inherit;color:inherit;cursor:pointer}
a{color:inherit}
:focus-visible{outline:1px solid var(--accent);outline-offset:3px}
h1,h2,h3{font-family:var(--display);font-weight:400;margin:0;text-wrap:balance}
.eyebrow{font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;color:var(--accent);font-weight:400;margin:0}

header.top{position:sticky;top:env(safe-area-inset-top, 0px);z-index:20;background:#03130b;border-bottom:1px solid #1e3a2d;--fg:#ece8de;--muted:#b9b08f;--accent:#cdb98a;color:var(--fg);
  margin-inline:calc(-1 * max(16px, env(safe-area-inset-left, 0px)));padding-inline:max(16px, env(safe-area-inset-left, 0px))}
.bar{max-width:1180px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px;padding-block:0}
.nav{display:flex;gap:28px;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase}
.nav a{text-decoration:none;color:var(--muted)}
.nav a:hover{color:var(--fg)}
.brand{font-family:var(--display);font-style:italic;font-size:2.2rem;font-weight:400;letter-spacing:-.01em;line-height:1;text-align:center}
.brand img{display:block;height:128px;width:auto;margin:0 auto;border-radius:3px}
header .brand img{border-radius:0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 22%,#000 78%,transparent),linear-gradient(transparent,#000 14%,#000 86%,transparent);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent,#000 22%,#000 78%,transparent),linear-gradient(transparent,#000 14%,#000 86%,transparent);mask-composite:intersect}
.bar .right{align-items:center;gap:18px}
.sbtn{background:none;border:0;color:var(--fg);padding:6px;display:flex;align-items:center;gap:10px;font:inherit;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;opacity:.85}
.sbtn:hover,.sbtn[aria-expanded="true"]{opacity:1;color:var(--accent)}
@media (max-width:640px){.slab{display:none}}
.sp{border-top:1px solid #1e3a2d;padding:14px 0 18px}
.sp[hidden]{display:none}
.sp-in{max-width:620px;margin:0 auto}
.sp input{width:100%;box-sizing:border-box;background:#0a2217;border:1px solid #2b4a3b;color:var(--fg);font:inherit;font-size:1rem;padding:12px 16px;border-radius:2px;outline:none}
.sp input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}
.sp input:focus{border-color:var(--accent)}
.sp input::placeholder{color:var(--muted);opacity:.8}
.sres{list-style:none;margin:8px 0 0;padding:0;max-height:min(60vh,420px);overflow:auto}
.sres a{display:flex;align-items:center;gap:14px;padding:8px 6px;text-decoration:none;color:var(--fg);border-radius:2px}
.sres a:hover,.sres a:focus{background:#0e2b1e;outline:none}
.sres img{width:52px;height:52px;object-fit:cover;border-radius:2px;background:#fffdf3;flex:none}
.sres .sn{display:block;font-family:var(--display);font-size:1.15rem;line-height:1.2}
.sres .sh{display:block;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:3px}
.sres .sx{padding:10px 6px;color:var(--muted);font-size:.9rem}
.cartbtn{background:none;border:0;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;display:flex;gap:8px;align-items:center;padding:6px 0}
.cartbtn b{font-weight:400;color:var(--accent);font-variant-numeric:tabular-nums}
.bar > *{flex:1}
.bar .brand{flex:0 0 auto}
.bar .right{display:flex;justify-content:flex-end}

.hero{display:grid;grid-template-columns:1fr 1.15fr;gap:40px;align-items:center;padding-block:72px 80px}
.hero h1{font-size:clamp(2.7rem,6.4vw,5rem);line-height:1.08;letter-spacing:-.01em;margin-block:22px 26px}
.hero h1 em{font-style:italic;color:var(--accent)}
.hero .lead{max-width:42ch;color:var(--muted);font-size:1.02rem;margin:0 0 36px}
.cta{display:inline-block;background:var(--btn-bg);color:var(--btn-fg);text-decoration:none;padding:15px 34px;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;font-weight:400}
.cta.ghost{background:none;color:var(--fg);border:1px solid var(--line);margin-left:10px}
.arch{position:relative;aspect-ratio:1/1;width:min(100%,600px);justify-self:end;margin:0 6px 0 0;padding:5px;border-radius:50%;
  background:linear-gradient(135deg,#f3e3b4 0%,#c9a24e 28%,#8f6d2a 52%,#e2c887 78%,#a8812f 100%);
  box-shadow:0 0 0 9px var(--bg),0 0 0 10px #b8923f,0 24px 60px rgba(60,40,10,.22)}
.arch-logo{width:100%;height:100%;display:block;border-radius:50%;object-fit:cover}

.promises{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));border-block:1px solid var(--line)}
.promises div{padding:22px 20px;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);min-width:0}
.promises div + div{border-left:1px solid var(--line)}
.promises b{display:block;color:var(--fg);font-weight:400;margin-bottom:2px}

.shop-head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:20px;padding-block:96px 28px}
.shop-head h2{font-size:clamp(2.4rem,5vw,3.6rem);line-height:1}
.tabs{display:flex;flex-wrap:wrap;gap:6px 26px}
.tab{background:none;border:0;border-bottom:1px solid transparent;padding:6px 0;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.tab[aria-pressed="true"]{color:var(--fg);border-bottom-color:var(--accent)}
.nf{margin:-12px 0 36px;padding:20px 0 4px;border-top:1px solid var(--line)}
.nf-h{display:flex;align-items:baseline;gap:18px;margin-bottom:14px}
.nf-t{font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--fg)}
.nf-clear,.nf-more{background:none;border:0;padding:0;font:inherit;font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);border-bottom:1px solid currentColor;cursor:pointer}
.nf-clear[hidden]{display:none}
.nf-chips{display:flex;flex-wrap:wrap;gap:8px}
.nchip{background:none;border:1px solid var(--line);color:var(--muted);font:inherit;font-size:.82rem;padding:7px 14px;border-radius:999px;cursor:pointer;transition:border-color .2s,color .2s,background .2s}
.nchip:hover{border-color:var(--accent);color:var(--fg)}
.nchip[aria-pressed="true"]{background:var(--btn-bg);border-color:var(--btn-bg);color:var(--btn-fg)}
.nf-more{margin-top:14px}
.nf-more[hidden]{display:none}
.nf-count{margin:14px 0 0;font-size:.88rem;color:var(--muted);min-height:1.3em}
.catnote{margin:0 0 40px;color:var(--muted);max-width:60ch;min-height:1.6em;font-family:var(--display);font-size:1.25rem;font-style:italic}

.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:56px 32px}
.card{display:flex;flex-direction:column;min-width:0}
.pic{aspect-ratio:1/1;background:var(--surface);border:1px solid var(--line);overflow:hidden}
.pic img{width:100%;height:100%;object-fit:cover;display:block}
@media (prefers-reduced-motion:no-preference){ .pic img{transition:transform .8s ease} .card:hover .pic img{transform:scale(1.04)} }
.info{padding-top:18px;display:flex;flex-direction:column;gap:6px;flex:1}
.house{font-size:.66rem;letter-spacing:.3em;text-transform:uppercase;color:var(--accent)}
.card h3{font-size:1.9rem;line-height:1.05}
.family{font-family:var(--display);font-style:italic;font-size:1.1rem;color:var(--muted)}
.notes{margin:2px 0 0;font-size:.8rem;color:var(--muted);letter-spacing:.04em}
.sizes{display:flex;flex-wrap:wrap;gap:4px 18px;margin-top:auto;padding-top:14px}
.size{background:none;border:0;border-bottom:1px solid transparent;padding:3px 0;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
span.size{cursor:default}
.size[aria-pressed="true"]{color:var(--fg);border-bottom-color:var(--accent)}
.buy{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--line);margin-top:14px;padding-top:14px}
html.pl .price,html.pl .dprice,html.pl .pricelist b,html.pl .lp{visibility:hidden}
.price{font-family:var(--display);font-size:1.7rem;font-weight:400;font-variant-numeric:lining-nums tabular-nums}
.add{background:#c9a65e;color:#241c10;border:1px solid #c9a65e;padding:11px 20px;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;font-weight:500;cursor:pointer;transition:background-color .45s ease,border-color .45s ease,color .45s ease}
.add:hover:not(:disabled),.add:focus-visible:not(:disabled){background:#0b3526;border-color:#0b3526;color:#f3e3b4}

.card h3 a{color:inherit;text-decoration:none}
.card h3 a:hover{color:var(--accent)}
a.pic{display:block}
a.brand{text-decoration:none;color:inherit}
#catalogo,#ritual{scroll-margin-top:72px}

.crumbs{display:flex;flex-wrap:wrap;gap:6px 12px;padding-block:32px 0;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.crumbs a{text-decoration:none}
.crumbs a:hover{color:var(--fg)}
.crumbs [aria-current]{color:var(--fg)}
.detail{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:start;padding-block:28px 24px}
.detail .pic{position:sticky;top:calc(env(safe-area-inset-top, 0px) + 96px)}
.gal{overflow:hidden}
.detail .pic.gal{position:sticky}
.gal-track{display:flex;width:100%;height:100%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
.gal-track::-webkit-scrollbar{display:none}
.gal-slide{flex:0 0 100%;height:100%;scroll-snap-align:center;background:var(--surface)}
.gal .gal-slide img{object-fit:contain;cursor:zoom-in}
.gal-nav{position:absolute;top:50%;translate:0 -50%;width:44px;height:44px;border:1px solid var(--line);border-radius:50%;background:color-mix(in srgb,var(--bg) 82%,transparent);color:var(--fg);font-size:1.7rem;line-height:1;cursor:pointer;display:grid;place-items:center;padding:0 0 3px}
.gal-nav.prev{left:12px}.gal-nav.next{right:12px}
.gal-nav:hover{border-color:var(--accent);color:var(--accent)}
.gal-dots{position:absolute;left:0;right:0;bottom:12px;display:flex;justify-content:center;gap:4px}
.gal-dots button{width:24px;height:24px;border:0;background:none;padding:0;cursor:pointer;display:grid;place-items:center}
.gal-dots button::before{content:"";width:8px;height:8px;border-radius:50%;border:1px solid var(--accent);background:transparent}
.gal-dots button[aria-current="true"]::before{background:var(--accent)}
.lightbox{position:fixed;inset:0;z-index:100;background:rgba(5,9,7,.94);display:grid;place-items:center;padding:16px;cursor:zoom-out}
.lightbox img{max-width:calc(100vw - 32px);max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);object-fit:contain}
.lightbox button{position:absolute;top:12px;right:16px;width:44px;height:44px;border:0;background:none;color:#ece8de;font-size:2.2rem;cursor:pointer}
@media (prefers-reduced-motion:reduce){.gal-track{scroll-behavior:auto}}
.dinfo{display:flex;flex-direction:column;gap:10px;min-width:0}
.dinfo h1{font-size:clamp(2.6rem,5vw,4.2rem);line-height:1}
.dinfo .family{font-size:1.35rem}
.dprice{font-family:var(--display);font-size:2.6rem;font-variant-numeric:lining-nums tabular-nums;margin-top:10px}
.ddesc{margin:6px 0 10px;color:var(--muted);max-width:52ch}
.dlabel{font-size:.68rem;letter-spacing:.28em;text-transform:uppercase;color:var(--muted);margin-top:8px}
.dinfo .sizes{margin-top:0;padding-top:4px}
.dinfo .size{font-size:.86rem;padding:6px 0}
.dbtns{display:flex;flex-wrap:wrap;gap:12px;margin-block:18px 10px}
.btn{display:inline-block;text-align:center;text-decoration:none;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;padding:16px 30px;border:1px solid var(--btn-bg);background:var(--btn-bg);color:var(--btn-fg);font-weight:400}
.btn{transition:background-color .45s ease,border-color .45s ease,color .45s ease}
.btn[data-add]:not(:disabled){background:#c9a65e;border-color:#c9a65e;color:#241c10}
.btn:not(.ghost):hover:not(:disabled){background:#0b3526;border-color:#0b3526;color:#f3e3b4}
.btn.ghost{background:none;color:var(--fg);border-color:var(--fg)}
.facts{margin:18px 0 0;border-top:1px solid var(--line)}
.facts > div{display:grid;grid-template-columns:150px minmax(0,1fr);gap:12px;padding-block:14px;border-bottom:1px solid var(--line)}
.facts dt{font-size:.68rem;letter-spacing:.17em;text-transform:uppercase;color:var(--muted);padding-top:3px}
.facts dd{margin:0}
.chips,.pricelist{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.chips li{border:1px solid var(--line);padding:3px 12px;font-size:.84rem;letter-spacing:.04em}
.pricelist{flex-direction:column;gap:6px;max-width:300px}
.pricelist li{display:flex;justify-content:space-between;gap:16px;font-variant-numeric:lining-nums tabular-nums}
.pricelist li.sel{color:var(--accent)}
.pricelist b{font-weight:400}
.related{padding-block:80px 0}
.related h2{font-size:clamp(2rem,4vw,2.8rem);margin-block:12px 36px}
@media (max-width:820px){
  .detail{grid-template-columns:1fr;gap:32px}
  .detail .pic{position:static}
  .detail .pic.gal{position:relative;top:auto}
  .facts > div{grid-template-columns:1fr;gap:4px}
  .related{padding-top:64px}
}

.ritual{padding-block:120px 0}
.ritual h2{font-size:clamp(2.4rem,5vw,3.6rem);line-height:1;margin-block:16px 48px;max-width:16ch}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:0;border-top:1px solid var(--line)}
.step{padding:28px 28px 8px 0;min-width:0}
.step + .step{padding-left:28px;border-left:1px solid var(--line)}
.step .n{font-family:var(--display);font-size:2.6rem;color:var(--accent);font-weight:400;line-height:1}
.step h3{font-size:1.6rem;margin-block:10px 8px}
.step p{margin:0;color:var(--muted);font-size:.92rem;max-width:34ch}
.sample{margin-top:64px;font-size:.76rem;letter-spacing:.06em;color:var(--muted)}

footer{margin-top:40px;border-top:1px solid var(--line);padding-block:40px 8px;display:flex;flex-wrap:wrap;gap:24px 48px;justify-content:space-between;align-items:end}
footer .brand{font-size:2.2rem;color:var(--fg);margin-bottom:6px}
footer p{margin:6px 0 0;color:var(--muted);font-size:.84rem}
footer .contact{display:flex;flex-direction:column;gap:8px;align-items:flex-end}
footer .contact a{color:var(--fg);text-transform:none;letter-spacing:.04em;text-decoration:none;border-bottom:1px solid var(--line)}
footer .contact a:hover{color:var(--accent);border-bottom-color:var(--accent)}
@media (max-width:640px){footer .contact{align-items:flex-start}}
footer .wa-num{font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}

.scrim{position:fixed;inset:0;background:rgba(4,8,6,.6);z-index:40}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(440px,100%);background:var(--surface);border-left:1px solid var(--line);z-index:50;display:flex;flex-direction:column;
  padding:calc(24px + env(safe-area-inset-top, 0px)) max(24px, env(safe-area-inset-right, 0px)) calc(24px + env(safe-area-inset-bottom, 0px)) 24px}
.dhead{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px}
.dhead h2{font-size:2.1rem}
.x{background:none;border:0;font-size:1.1rem;padding:6px 8px}
.lines{flex:1;overflow-y:auto;min-height:0;display:flex;flex-direction:column;padding-block:8px}
.empty{color:var(--muted);padding-block:24px;font-family:var(--display);font-style:italic;font-size:1.2rem}
.line{display:grid;grid-template-columns:1fr auto;gap:4px 12px;border-bottom:1px solid var(--line);padding-block:16px}
.line .nm{font-family:var(--display);font-size:1.35rem;line-height:1.1;min-width:0}
.line .sz{font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.line .lp{font-variant-numeric:tabular-nums;text-align:right}
.qty{display:flex;align-items:center;gap:10px}
.qty button{width:28px;height:28px;border:1px solid var(--line);background:transparent}
.qty span{min-width:18px;text-align:center;font-variant-numeric:tabular-nums}
.rm{background:none;border:0;color:var(--muted);text-decoration:underline;font-size:.78rem;justify-self:end}
.checkout{border-top:1px solid var(--line);padding-top:16px;display:flex;flex-direction:column;gap:12px}
.total{display:flex;justify-content:space-between;align-items:baseline;font-family:var(--display);font-size:1.6rem;font-variant-numeric:lining-nums tabular-nums}
.total span:first-child{font-family:var(--body);font-size:.74rem;letter-spacing:.17em;text-transform:uppercase;color:var(--muted)}
label{font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);display:flex;flex-direction:column;gap:6px}
input,select{font:inherit;font-size:.95rem;letter-spacing:0;text-transform:none;font-weight:400;background:var(--bg);color:var(--fg);border:1px solid var(--line);border-radius:0;padding:11px 12px;width:100%}
.wa{display:block;width:100%;border:0;cursor:pointer;text-align:center;text-decoration:none;background:var(--btn-bg);color:var(--btn-fg);padding:16px;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;font-weight:400}
.wa[aria-disabled="true"]{opacity:.4;pointer-events:none}
.done{padding-block:28px;display:flex;flex-direction:column;gap:12px}
.done h3{font-size:1.7rem}
.done p{margin:0;color:var(--muted)}
.done a{align-self:flex-start}
.size[data-out]{text-decoration:line-through;opacity:.5}
.add:disabled,.btn:disabled{opacity:.45;cursor:not-allowed}
.fine{font-size:.76rem;color:var(--muted);margin:0}
.copy{background:none;border:0;text-decoration:underline;color:var(--muted);font-size:.78rem;padding:0;text-align:left}

@media (max-width:820px){
  .hero{grid-template-columns:1fr;gap:40px;padding-block:44px 56px}
  .arch{width:min(100%,440px);justify-self:center;margin:10px auto 0}
  .nav{display:none}
  .promises div + div{border-left:0;border-top:1px solid var(--line)}
  .step + .step{padding-left:0;border-left:0;border-top:1px solid var(--line);margin-top:20px;padding-top:28px}
  .cta.ghost{margin:10px 0 0}
  .shop-head{padding-top:72px}
  .ritual{padding-top:88px}
  .brand img{height:84px}
}
