:root{--blue:#b85b12;--blue2:#d8871d;--light:#fff8ea;--line:#ead7b8;--text:#542b12;--muted:#826b59;--brand-brown:#682d0b;--brand-orange:#c9650d;--brand-gold:#e5a126;--brand-cream:#fff8e8}
body{color:var(--text)}
.topbar{background:linear-gradient(90deg,var(--brand-brown),var(--brand-orange),var(--brand-brown))}
.main-nav a,.eyebrow,h1,h2,h3,.product-name,.benefit strong{color:var(--brand-brown)}
.hero-copy{background:linear-gradient(135deg,#fffaf0,#f9ead0)}
.hero-brand{background:radial-gradient(circle at 50% 38%,#fff7df 0,#f2d391 48%,#d7982c 100%)}
.hero-brand p{color:var(--brand-brown)}
.primary-btn,.add-btn,.checkout-btn{background:linear-gradient(135deg,var(--brand-orange),#e38b18);border-color:var(--brand-orange);box-shadow:0 8px 20px rgba(180,83,12,.2)}
.primary-btn:hover,.add-btn:hover,.checkout-btn:hover{background:var(--brand-brown)}
.benefit-icon{border-color:var(--brand-orange);color:var(--brand-orange);background:var(--brand-cream)}
.category-filter button.active,.category-filter button:hover{background:var(--brand-brown);border-color:var(--brand-brown);color:#fff}
.product-price,.price{color:var(--brand-orange)}
.cart-button{min-width:178px;padding:9px 14px 9px 10px;border:1px solid #e1bb78;border-radius:16px;background:linear-gradient(135deg,#fffaf0,#f7e2b7);box-shadow:0 8px 22px rgba(104,45,11,.12);color:var(--brand-brown);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.cart-button:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(104,45,11,.18);border-color:var(--brand-gold)}
.cart-button:before{content:"🛒";display:grid;place-items:center;width:40px;height:40px;flex:0 0 40px;border-radius:12px;background:linear-gradient(135deg,var(--brand-orange),var(--brand-gold));color:#fff;font-size:20px;box-shadow:inset 0 1px rgba(255,255,255,.35)}
.cart-button span{color:var(--brand-brown);line-height:1.15}.cart-button small{color:var(--brand-orange);font-weight:700}.cart-button>b{display:none}
.cart-drawer header{background:linear-gradient(135deg,var(--brand-brown),var(--brand-orange))}.cart-drawer h2,.cart-drawer h3{color:var(--brand-brown)}.cart-drawer .price,.cart-total strong{color:var(--brand-orange)}
@media(max-width:720px){.cart-button{min-width:50px;width:50px;height:50px;padding:5px;border-radius:15px}.cart-button:before{width:38px;height:38px}.cart-button span{display:none}}

/* Desktop: keep both hero columns independent so the copy never covers the logo. */
@media(min-width:721px){
  .hero{background:linear-gradient(90deg,#fbf6ec 0 50%,#f1dfbd 50% 100%)}
  .hero-copy{width:min(980px,100%);box-sizing:border-box;background:transparent;padding:88px 540px 70px 20px}
  .hero-art{inset:0 0 0 50%;background:radial-gradient(circle at 50% 45%,#fff8e8 0 12%,#f2ddb7 50%,#e7c98f 100%)}
  .hero-brand{background:transparent}
  .hero-art img{max-width:56%;max-height:58%;object-fit:contain}
  .hero-art p{max-width:290px;color:#682d0b}
}

/* Cleaner commerce header: no redundant search, brand first, order action second. */
.search{display:none!important}
.main-nav{border-top:0!important}
.cart-button{min-width:190px;padding:10px 12px;border:1px solid #682d0b;border-radius:10px;background:#682d0b;box-shadow:0 7px 18px rgba(57,25,9,.16);color:#fff;gap:11px}
.cart-button:hover{transform:translateY(-1px);border-color:#8b3f0d;background:#8b3f0d;box-shadow:0 10px 24px rgba(57,25,9,.22)}
.cart-button:before{content:"";width:38px;height:38px;flex:0 0 38px;border-radius:8px;background-color:#c9650d;background-repeat:no-repeat;background-position:center;background-size:21px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='20' r='1'/%3E%3Ccircle cx='19' cy='20' r='1'/%3E%3Cpath d='M3 4h2l2.4 11.2a2 2 0 0 0 2 1.6h7.7a2 2 0 0 0 2-1.6L21 8H6'/%3E%3C/svg%3E")}
.cart-button span{color:#fff;font-size:13px;font-weight:700;letter-spacing:.01em}.cart-button small{color:#f4c477;font-size:12px;font-weight:700}.cart-button>b{display:none}
.cart-drawer header{background:#682d0b}
.drawer{width:min(480px,100%);box-shadow:-18px 0 50px rgba(35,18,8,.18)}
.drawer-head{background:#4b2410;padding:25px 28px;border-bottom:4px solid #c9650d}
.drawer-head h2{color:#fff}.drawer-head p,.drawer-head .checkout-label{color:#f2c47b}

@media(min-width:721px){
  .store-header{grid-template-columns:1fr auto;height:130px}
  .brand{grid-area:1/1;justify-self:start;width:190px;height:112px;overflow:hidden;position:relative}
  .store-header .brand img{width:190px!important;height:190px!important;max-width:none!important;object-fit:contain!important;position:absolute;top:0;left:0;transform:translateY(-39px)!important}
  .cart-button{grid-area:1/2;justify-self:end}
}

/* Give the brand enough visual weight without cropping the artwork. */
@media(min-width:721px){
  .store-header{height:152px}
  .store-header .brand{width:240px;height:136px;overflow:visible}
  .store-header .brand img{position:static!important;width:240px!important;height:136px!important;max-width:100%!important;transform:scale(1.45)!important;transform-origin:center!important;object-fit:contain!important}
  .hero-art img{max-width:68%;max-height:68%}
}

@media(max-width:720px){
  .hero{margin-top:0}
  .main-nav{top:80px;padding-top:20px}
  .cart-button{min-width:48px;width:48px;height:48px;padding:5px;border-radius:10px}
  .cart-button:before{width:36px;height:36px;flex-basis:36px}
}

footer{background:#4b2410;grid-template-columns:1.1fr .65fr .65fr 1fr 1fr;gap:30px}
footer h4{color:#fff}
footer a,footer p{color:#f2dfcc}
footer .socials{gap:9px}
footer .social-link{width:fit-content;min-width:154px;box-sizing:border-box;display:flex;flex-direction:row!important;align-items:center;gap:9px;padding:7px 11px;border:1px solid rgba(255,255,255,.18);border-radius:8px;background:rgba(255,255,255,.07);color:#fff;line-height:1.2;transition:background .2s ease,border-color .2s ease,transform .2s ease}
footer .social-link:hover{background:#c9650d;border-color:#df8a34;transform:translateX(2px)}
footer .social-link img{width:18px;height:18px;object-fit:contain}
footer .social-link span{font-size:10px;font-weight:600}

@media(max-width:1050px) and (min-width:721px){footer{grid-template-columns:1fr 1fr 1fr;padding-inline:32px}.brand.inverse{grid-column:auto}}

/* Product purchase dialog inspired by Modelo 2. */
.image-modal{background:rgba(42,25,18,.82)}
.product-detail{width:min(900px,94vw);min-height:550px;box-shadow:0 28px 80px rgba(30,16,10,.35)}
.detail-photo{background:#f3ede4}
.detail-copy{padding:66px 45px 36px}
.detail-copy>span{color:#9b4920;letter-spacing:.16em;text-transform:uppercase;font-size:9px}
.detail-copy>h2{color:#321a10;font-family:Georgia,"Times New Roman",serif;font-size:38px;font-weight:500}
.detail-copy>p{color:#765f54;line-height:1.75}
.detail-copy>small{margin-top:auto;color:#9a806f;letter-spacing:.09em;text-transform:uppercase}
.detail-copy>strong{color:#23140d;font-size:30px}
.modal-close{width:38px!important;height:38px!important;background:#692d20!important;color:#fff!important;box-shadow:none!important}
.detail-buy{display:grid;grid-template-columns:1fr 144px;gap:14px;margin-top:15px}
.detail-quantity{grid-column:2;width:144px;height:46px;border-color:#dfd2c5}
.detail-quantity button{width:42px;background:#f5efe9;color:#692d20;cursor:pointer}
.detail-quantity b{min-width:58px;color:#321a10;font-size:12px}
.detail-add{grid-column:1/-1;width:100%;height:54px;background:#692d20;border-radius:0;padding-inline:18px}
.detail-add:hover{background:#8d3b26}
.detail-add b{color:#f2bf52}

@media(max-width:720px){.detail-buy{display:flex}.detail-quantity{width:100%}.detail-copy>h2{font-size:30px}}
.whatsapp:disabled{opacity:.42;cursor:not-allowed;filter:grayscale(.25);box-shadow:none}
.order-form select{width:100%;margin-top:6px;padding:12px 38px 12px 12px;border:1px solid var(--line);border-radius:4px;background:#fff;color:var(--text);font:inherit;appearance:auto}
.order-form select:focus{outline:2px solid rgba(201,101,13,.2);border-color:var(--brand-orange)}
.order-form .payment-help{display:block;margin-top:5px;color:var(--muted);font-size:9px;line-height:1.5}
.cart-thumb{overflow:hidden;border:1px solid #ead7b8;border-radius:8px;background:#f7f0e5!important}
.cart-thumb img{width:100%;height:100%;padding:4px;object-fit:contain;display:block}
.cart-thumb-placeholder{display:grid;place-items:center;width:100%;height:100%;background:linear-gradient(145deg,#fbf5eb,#ead8bf);color:#a97852;font-family:Georgia,serif;font-size:20px;font-weight:700}
.cart-product .stepper{width:max-content}
.cart-line{grid-template-columns:64px minmax(0,1fr) auto;align-items:start}
.cart-thumb{width:64px;height:64px}
@media(max-width:720px){.cart-line{grid-template-columns:60px minmax(0,1fr)}.cart-thumb{width:60px;height:60px}.cart-product .stepper{width:max-content}}

/* Framed catalog cards with breathing room around real product photography. */
.product-card{border:1px solid #ead9c4;border-radius:12px;padding:10px;background:#fff;box-shadow:0 5px 18px rgba(75,36,16,.06);overflow:hidden;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.product-card:hover{transform:translateY(-3px);border-color:#d8b387;box-shadow:0 12px 28px rgba(75,36,16,.11)}
.product-image{border-radius:8px;background:#f6f2ec}
.product-image>span{z-index:3;top:10px;left:10px;padding:5px 8px;border:1px solid #e4c8a9;border-radius:5px;background:#fffaf4;color:#9b4920;font-weight:700;letter-spacing:.04em}
.image-zoom{display:grid;place-items:center}
.image-zoom img{width:78%;height:78%;padding:0;transform:none!important}
.image-zoom:hover img{transform:scale(1.03)!important}
.product-info{padding:15px 4px 4px}

@media(max-width:720px){.product-card{padding:7px;border-radius:10px}.image-zoom img{width:82%;height:82%}}

/* Give the catalog its own visual stage so products stand out. */
.products{position:relative;background:linear-gradient(180deg,#fbf6ee 0%,#f4e7d6 100%);box-shadow:0 0 0 100vmax #f7eddf;clip-path:inset(0 -100vmax);padding-top:76px}
.products:before{content:"";position:absolute;top:0;left:0;width:86px;height:5px;border-radius:0 0 8px 8px;background:linear-gradient(90deg,#682d0b,#d98222)}
.products .section-title h2{font-family:Georgia,"Times New Roman",serif;color:#4b2410;font-size:32px;font-weight:500}
.catalog-tools{padding:17px 0 24px;border-top:1px solid rgba(104,45,11,.1)}
.filters button{background:rgba(255,255,255,.68);border-color:#dec6aa;color:#6b452f}
.filters button.active{background:#682d0b;border-color:#682d0b;color:#fff;box-shadow:0 5px 14px rgba(75,36,16,.16)}
.product-card{border-color:rgba(204,161,113,.55);box-shadow:0 9px 24px rgba(75,36,16,.09)}
.product-card:hover{box-shadow:0 17px 36px rgba(75,36,16,.16)}
.product-image{background:linear-gradient(145deg,#fffaf2,#eee1d1)}
.product-image>div{color:#b89d83}
.product-bottom>strong{color:#4b2410;font-size:17px}
.add{height:35px;border-color:#8d3b18;background:#8d3b18;color:#fff;border-radius:6px;padding-inline:13px;box-shadow:0 5px 12px rgba(104,45,11,.14)}
.add:hover{background:#c56213;border-color:#c56213}

@media(max-width:720px){.products{padding-top:58px}.products .section-title h2{font-size:27px}.catalog-tools{padding-top:12px}}

/* Stable full-width catalog surface: one background, centered 980px content. */
.products{max-width:none!important;width:100%;margin:0!important;box-shadow:none!important;clip-path:none!important;background:linear-gradient(180deg,#fbf6ee 0%,#f5eadb 100%)}
.products:before{display:none!important}
@media(min-width:721px){.products{padding:72px max(20px,calc((100% - 980px)/2)) 85px}}
@media(max-width:720px){.products{padding:58px 14px 68px}}

/* Purpose-built mobile composition. */
@media(max-width:720px){
  html,body{max-width:100%;overflow-x:hidden}
  .topbar{height:28px;padding:0 12px;justify-content:center;font-size:8px}
  .topbar span:first-child{display:none}
  .store-header{height:82px;padding:0 16px}
  .menu-button{color:#682d0b;font-size:21px}
  .brand{width:auto;height:auto;overflow:visible}
  .store-header .brand img{position:static!important;width:112px!important;height:70px!important;transform:scale(1.32)!important;transform-origin:center!important;object-fit:contain!important}
  .cart-button{width:44px;height:44px;min-width:44px;padding:4px;border-radius:11px}
  .cart-button:before{width:34px;height:34px;flex-basis:34px;background-size:18px}
  .main-nav{top:110px;padding:18px 20px;gap:18px;border-bottom:1px solid #ead7b8;box-shadow:0 12px 25px rgba(75,36,16,.12)}

  .hero{display:flex;flex-direction:column;min-height:0;margin-top:0;background:#fbf6ec;overflow:hidden}
  .hero-copy{order:1;width:100%;box-sizing:border-box;padding:45px 24px 38px;background:linear-gradient(145deg,#fffaf1,#f8ead5)}
  .hero-copy .eyebrow{font-size:9px;letter-spacing:.11em}
  .hero-copy h1{margin:14px 0 17px;font-size:39px;line-height:1.04}
  .hero-copy p{max-width:none;font-size:13px;line-height:1.68}
  .hero-actions{margin-top:25px}
  .hero-actions a{display:inline-flex;align-items:center;justify-content:space-between;gap:18px;width:190px;height:50px;padding:0 18px 0 20px;border:1px solid #a74612;border-radius:9px;background:linear-gradient(135deg,#c95c0a 0%,#9d3d08 100%);box-shadow:0 10px 22px rgba(139,58,11,.22);font-size:11px;letter-spacing:.035em}
  .hero-actions a:after{content:'→';font-size:19px;font-weight:400;line-height:1;transition:transform .2s ease}
  .hero-actions a:active:after{transform:translateX(3px)}
  .hero-art{order:2;position:relative!important;inset:auto!important;top:auto!important;left:auto!important;width:100%;height:245px;background:radial-gradient(circle at 50% 45%,#fff6df 0,#f2d79f 52%,#e6c37c 100%)}
  .hero-art img{width:250px!important;height:198px!important;object-fit:contain}
  .hero-art p{margin:-18px 0 0!important;color:#682d0b;font-size:11px!important}

  .benefits{display:grid;grid-template-columns:1fr;padding:10px 20px;background:#fff}
  .benefits article{padding:15px 0;border-bottom:1px solid #ead7b8}
  .benefits article:last-child{border-bottom:0}

  .categories{padding:28px 14px}
  .category-grid{gap:12px}
  .category-grid>button{min-height:180px;border-radius:10px;overflow:hidden}

  .products{width:100%;padding:48px 14px 64px}
  .products .section-title.row{display:flex;align-items:flex-end;gap:12px}
  .products .section-title h2{font-size:28px;line-height:1.1}
  .products .section-title a{font-size:9px}
  .catalog-tools{display:flex;flex-direction:column;align-items:stretch;gap:12px;padding:14px 0 20px}
  .filters{display:flex;flex-wrap:wrap;gap:7px;width:100%}
  .filters button{flex:0 0 auto;padding-inline:11px}
  .catalog-tools>span{align-self:flex-end}
  .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .product-card{min-width:0;padding:7px}
  .product-image>span{top:7px;left:7px;padding:4px 6px;font-size:7px}
  .product-info{padding:12px 2px 3px}
  .product-info h3{font-size:12px}
  .product-bottom{gap:7px}
  .product-bottom>strong{font-size:15px}
  .add{height:34px}

  .image-modal{padding:12px;align-items:center}
  .product-detail{width:calc(100vw - 24px);max-width:440px;max-height:calc(100dvh - 24px);min-height:0;border-radius:14px;overflow:auto;box-shadow:0 18px 55px rgba(28,14,8,.4)}
  .detail-photo{height:31vh;min-height:210px;max-height:285px;padding:14px}
  .detail-photo img{max-width:82%;max-height:94%;object-fit:contain}
  .detail-copy{padding:24px 20px 20px}
  .detail-copy>span{font-size:8px}
  .detail-copy>h2{margin:8px 0 12px;font-size:31px;line-height:1.05}
  .detail-copy>p{margin-bottom:18px;font-size:12px;line-height:1.6}
  .detail-copy>small{margin-top:0;font-size:8px}
  .detail-copy>strong{margin:5px 0 12px;font-size:27px}
  .detail-buy{gap:9px;margin-top:0}
  .detail-quantity{height:46px}
  .detail-quantity button{min-width:48px;font-size:20px}
  .detail-quantity b{font-size:12px}
  .detail-add{min-height:50px;height:50px;font-size:11px}
  .detail-cart-link{width:100%;margin-top:2px;padding:8px 0 2px;border:0!important;background:transparent!important;color:#7a321f;font-size:10px;font-weight:700;text-align:left;text-decoration:underline;text-underline-offset:3px;box-shadow:none!important;outline:0}
  .modal-close{top:10px!important;right:10px!important;width:36px!important;height:36px!important}

  .how{grid-template-columns:1fr;padding:52px 24px}
  .how h2{font-size:34px}
  footer{grid-template-columns:1fr!important;gap:28px!important;padding:42px 24px!important}
  footer .brand.inverse{width:auto;height:auto;overflow:visible}
  footer .brand.inverse img{position:static!important;width:170px!important;height:100px!important;transform:none!important;object-fit:contain!important}
  footer .social-link{width:100%;max-width:240px;min-width:0}
  .wa-float{right:12px;bottom:12px}
}
