/* Carnes El Rancho La Progreso | Sitio estático para Cloudflare Pages */
:root {
  --wine: #501a16;
  --wine-deep: #2e100f;
  --wine-light: #77251e;
  --cream: #f6ebd9;
  --paper: #f9f1e4;
  --parchment: #e7d2ad;
  --gold: #d9a35e;
  --gold-light: #f4d7a1;
  --brown: #44241b;
  --ink: #2f221c;
  --muted: #716054;
  --line: rgba(81, 42, 28, .18);
  --content: 1216px;
  --font-body: Arial, 'Segoe UI', Arial, sans-serif;
  --font-display: 'Arial Narrow', Impact, 'Arial Narrow', sans-serif;
  --font-rustic: Georgia, Georgia, serif;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 100px; }
body { margin: 0; color: var(--ink); background: var(--paper); font: 400 16px/1.65 var(--font-body); -webkit-font-smoothing: antialiased; overflow-x: clip; }
body.dialog-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; }
img, svg { display: block; }
img { max-width: 100%; }
figure, h1, h2, h3, p { margin: 0; }
::selection { background: var(--gold); color: var(--wine-deep); }
:focus-visible { outline: 3px solid #e8a637; outline-offset: 4px; }
.svg-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.icon { width: 1.25em; height: 1.25em; fill: none; stroke: currentColor; stroke-width: 1.85; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.container { width: min(var(--content), calc(100% - 72px)); margin-inline: auto; }
.skip-link { position: fixed; z-index: 9999; top: -100px; left: 16px; padding: 12px 18px; color: #fff; background: var(--wine); }
.skip-link:focus { top: 10px; }
.section-pad { padding-block: clamp(80px, 9vw, 140px); }
.section-index { display: block; text-transform: uppercase; font-size: .73rem; font-weight: 700; letter-spacing: .18em; }
.eyebrow { display: flex; align-items: center; gap: 14px; text-transform: uppercase; font: 700 .77rem/1.4 var(--font-body); letter-spacing: .18em; color: var(--wine-light); margin-bottom: 18px; }
.eyebrow-line { display: inline-block; width: 34px; height: 2px; background: currentColor; }
.section-title { font: 800 clamp(3.55rem, 7.6vw, 7rem)/.91 var(--font-display); letter-spacing: -.008em; text-transform: uppercase; text-wrap: balance; }
.section-title span { color: var(--wine-light); }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 40px; margin-bottom: 46px; }
.section-heading > div { max-width: 760px; }
.section-heading > p { max-width: 295px; font-size: 1rem; line-height: 1.7; color: var(--muted); padding-bottom: 5px; }
.section-heading .section-index { margin-bottom: 28px; color: var(--muted); }
/* Preheader & navigation */
.topline { background: var(--wine-deep); color: #f6dcbd; min-height: 37px; }
.topline-inner { min-height: 37px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.topline p { display: flex; align-items: center; gap: 12px; font-size: .65rem; letter-spacing: .14em; font-weight: 600; text-transform: uppercase; }
.small-diamond { width: 4px; height: 4px; transform: rotate(45deg); background: var(--gold); flex: none; }
.topline a { display: inline-flex; align-items: center; gap: 8px; font-size: .74rem; font-weight: 700; letter-spacing: .05em; white-space: nowrap; }
.topline a:hover { color: var(--gold-light); }
.topline .icon { width: 14px; height: 14px; }
.site-header { position: sticky; top: 0; z-index: 60; background: #fff8eb; box-shadow: 0 4px 30px rgba(39, 15, 11, .075); border-bottom: 1px solid rgba(80,26,22,.09); }
.header-inner { min-height: 88px; display: flex; align-items: center; justify-content: space-between; gap: 34px; }
.brand { display: flex; align-items: center; gap: 13px; min-width: 0; }
.brand-seal { display: grid; place-items: center; flex: none; width: 48px; height: 50px; color: var(--gold-light); background: var(--wine); border: 2px solid var(--wine); outline: 1px solid var(--gold); outline-offset: -6px; font: 900 19px/.9 var(--font-display); letter-spacing: -.06em; }
.brand-copy { display: flex; flex-direction: column; gap: 3px; }
.brand-copy strong { display: block; font: 900 25px/.9 var(--font-display); color: var(--wine); letter-spacing: .005em; white-space: nowrap; }
.brand-copy strong span { display: block; }
.brand-copy small { font: 700 .6rem/1 var(--font-body); color: #926b4f; letter-spacing: .18em; }
.main-nav { display: flex; align-items: center; justify-content: flex-end; gap: clamp(15px, 1.8vw, 27px); }
.nav-link { font: 700 .74rem/1 var(--font-body); color: var(--brown); transition: color .2s ease; }
.nav-link:hover { color: var(--wine-light); }
.nav-cta { background: var(--wine); padding: 13px 15px 13px 19px; display: inline-flex; align-items: center; gap: 10px; color: #fff4e3; font-size: .78rem; font-weight: 700; transition: background .2s ease, transform .2s ease; white-space: nowrap; }
.nav-cta:hover { background: var(--wine-light); transform: translateY(-2px); }
.nav-cta .icon { width: 16px; height: 16px; }
.menu-toggle { display: none; align-items: center; justify-content: center; width: 43px; height: 43px; border: 1px solid #c3a17f; background: transparent; color: var(--wine); border-radius: 0; }
.menu-toggle .icon { width: 23px; height: 23px; }
.menu-close-icon { display: none; }
/* Hero */
.hero { color: #ffefd7; background: radial-gradient(ellipse at 80% 25%, rgba(154, 66, 41, .34), transparent 50%), linear-gradient(116deg, #3b1211 1%, #581b16 57%, #3c1312 100%); position: relative; isolation: isolate; overflow: hidden; }
.hero::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: .2; background-image: radial-gradient(#ecd4af .45px, transparent .6px); background-size: 7px 7px; }
.hero::after { content: ''; position: absolute; inset: 12px; border: 1px solid rgba(244, 211, 156, .2); pointer-events: none; z-index: -1; }
.hero-deco { position: absolute; pointer-events: none; border: 1px solid rgba(246, 210, 157, .13); transform: rotate(45deg); }
.hero-deco-a { width: 370px; height: 370px; top: -285px; left: -190px; }
.hero-deco-b { width: 420px; height: 420px; bottom: -300px; right: -210px; }
.hero-layout { display: grid; grid-template-columns: 1.06fr .94fr; align-items: center; gap: 0; min-height: 670px; padding-top: 58px; padding-bottom: 88px; }
.hero-content { z-index: 2; min-width: 0; position: relative; padding: 45px 0 45px 0; }
.hero-kicker { display: flex; align-items: center; gap: 15px; margin-bottom: 32px; font-size: .72rem; letter-spacing: .21em; font-weight: 700; color: var(--gold-light); text-transform: uppercase; }
.kicker-line { width: 41px; height: 1px; background: var(--gold); }
.hero-pretitle { font: 900 clamp(4.4rem, 7.4vw, 7.8rem)/.84 var(--font-display); letter-spacing: .026em; color: var(--gold-light); text-transform: uppercase; }
.hero h1 { margin-top: 3px; max-width: 700px; font: 900 clamp(4.1rem, 6vw, 6.4rem)/.86 var(--font-display); letter-spacing: -.022em; text-transform: uppercase; overflow-wrap: normal; }
.hero h1 em { display: block; font-style: normal; color: transparent; -webkit-text-stroke: 1.65px #ffe1b3; font-size: .79em; line-height: 1.19; white-space: nowrap; }
.hero-description { margin: 22px 0 29px; font: 600 clamp(1.2rem, 2vw, 1.7rem)/1.35 var(--font-display); letter-spacing: .07em; color: #f5dcb6; text-transform: uppercase; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.button { min-height: 52px; padding: 14px 21px; display: inline-flex; align-items: center; justify-content: center; gap: 16px; font-size: .82rem; line-height: 1.25; font-weight: 700; transition: color .25s ease, background .25s ease, transform .25s ease, border-color .25s ease; }
.button .icon { width: 18px; height: 18px; }
.button:hover { transform: translateY(-3px); }
.button-gold { color: var(--wine-deep); background: var(--gold-light); border: 1px solid var(--gold-light); }
.button-gold:hover { background: #fff0d0; }
.button-outline-light { color: #fae7c5; border: 1px solid rgba(247, 219, 178, .62); }
.button-outline-light:hover { background: rgba(255,255,255,.1); }
.hero-signature { display: flex; align-items: center; gap: 12px; margin-top: 39px; color: #e4c39c; font: italic 19px Georgia, serif; }
.signature-line { display: inline-block; width: 27px; height: 1px; background: #a88a65; }
.hero-art { position: relative; min-width: 0; align-self: stretch; min-height: 560px; margin-left: 15px; }
.hero-art-ring { position: absolute; top: 50%; left: 51%; transform: translate(-50%, -50%); border: 1px solid rgba(233, 180, 108, .35); width: 83%; aspect-ratio: 1; border-radius: 50%; box-shadow: 0 0 0 30px rgba(233,180,108,.04), 0 0 0 65px rgba(233,180,108,.035); }
.poster { position: absolute; padding: 5px; background: var(--gold-light); box-shadow: 0 18px 38px rgba(15, 3, 3, .45); transition: transform .45s ease; }
.poster img { width: 100%; height: auto; aspect-ratio: 1/1; object-fit: cover; }
.poster-main { z-index: 3; width: min(60%, 325px); top: 11%; left: 25%; transform: rotate(-3deg); }
.poster-left { z-index: 1; width: min(45%, 245px); top: 3%; left: 0; transform: rotate(-14deg); }
.poster-right { z-index: 2; width: min(45%, 245px); right: -6%; bottom: 9%; transform: rotate(10deg); }
.hero-art:hover .poster-main { transform: rotate(-1deg) translateY(-7px); }
.hero-art:hover .poster-left { transform: rotate(-16deg) translateX(-5px); }
.hero-art:hover .poster-right { transform: rotate(13deg) translateX(4px); }
.hero-art-caption { position: absolute; bottom: 2%; left: 13%; font: 700 .7rem var(--font-body); letter-spacing: .19em; text-transform: uppercase; color: var(--gold-light); }
.hero-bottom { position: absolute; display: flex; align-items: center; gap: 14px; bottom: 25px; left: 50%; transform: translateX(-50%); color: var(--gold); }
.hero-bottom span:not(.hero-bottom-ornament) { width: 74px; height: 1px; background: rgba(246,210,157,.4); }
.hero-bottom-ornament { font-size: 9px; }
/* Moving product ribbon */
.product-ribbon { position: relative; color: var(--wine); background: #dfb678; border-block: 1px solid #b88453; overflow: hidden; }
.ribbon-track { display: flex; align-items: center; gap: 26px; width: max-content; min-height: 56px; animation: ribbon-scroll 45s linear infinite; }
.ribbon-track span { white-space: nowrap; font: 800 1.23rem/1 var(--font-display); letter-spacing: .065em; }
.ribbon-track i { display: inline-block; width: 6px; height: 6px; border: 1px solid currentColor; transform: rotate(45deg); flex: none; }
@keyframes ribbon-scroll { to { transform: translateX(-50%); } }
/* About */
.about { position: relative; background: #f9f1e4; }
.about::before { content: ''; position: absolute; inset: 0; opacity: .3; pointer-events: none; background: repeating-linear-gradient(90deg, rgba(88,39,22,.018) 0 1px, transparent 1px 6px); }
.about-layout { position: relative; display: grid; grid-template-columns: .36fr .64fr; gap: 7%; }
.section-side .section-index { margin-bottom: 38px; color: var(--wine-light); }
.rustic-mark { display: grid; place-items: center; position: relative; width: min(100%, 245px); aspect-ratio: 1; border: 1px solid rgba(80,26,22,.32); border-radius: 50%; margin-top: 50px; color: var(--wine); }
.rustic-mark::before, .rustic-mark::after { content: ''; position: absolute; inset: 11px; border: 1px solid rgba(80,26,22,.21); border-radius: 50%; }
.rustic-mark::after { inset: 25px; border-style: dashed; }
.rustic-mark span { font: 900 clamp(5rem, 9vw, 9rem)/1 var(--font-display); }
.about-main { padding-top: 34px; }
.about .section-title { max-width: 800px; }
.about-lead { max-width: 640px; color: #4e382d; font: 500 clamp(1.4rem, 2.7vw, 2.1rem)/1.5 var(--font-body); margin: 30px 0 39px; }
.about-details { border-top: 1px solid var(--line); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; padding-top: 26px; }
.detail { display: flex; flex-direction: column; gap: 7px; padding-right: 12px; }
.detail + .detail { border-left: 1px solid var(--line); padding-left: 23px; }
.detail span { text-transform: uppercase; font-size: .67rem; color: var(--muted); font-weight: 700; letter-spacing: .1em; }
.detail strong { font: 700 clamp(1.15rem, 2vw, 1.55rem)/1.1 var(--font-display); color: var(--wine); }
/* Catalog */
.catalog { background: #341512; color: #fcf0dd; position: relative; isolation: isolate; }
.catalog::before { position: absolute; content: ''; inset: 0; pointer-events: none; z-index: -1; opacity: .3; background: radial-gradient(circle at 97% 5%, #9a5638 0, transparent 38%), radial-gradient(circle at 5% 100%, #712a22 0, transparent 45%); }
.catalog .section-index { color: #c8a181; }
.catalog .eyebrow { color: #efc18d; }
.catalog .section-title span { color: var(--gold-light); }
.catalog .section-heading > p { color: #ddc8ba; }
.catalog-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 13px; }
.product-card { position: relative; display: flex; flex-direction: column; justify-content: space-between; min-width: 0; min-height: 243px; padding: 19px; border: 1px solid rgba(241,212,174,.22); background: linear-gradient(145deg, rgba(255,239,215,.065), rgba(255,239,215,.015)); transition: transform .25s ease, background .25s ease, border-color .25s ease; overflow: hidden; }
.product-card::before { content: ''; position: absolute; width: 105px; height: 105px; top: 31px; right: -64px; transform: rotate(45deg); border: 1px solid rgba(225,183,127,.15); pointer-events: none; }
.product-card:hover { transform: translateY(-5px); background: rgba(255,239,215,.1); border-color: rgba(241,212,174,.6); }
.product-card-top { display: flex; align-items: center; justify-content: space-between; }
.product-number { font: 700 1.03rem/1 var(--font-display); color: #d4ac84; }
.product-ornament { width: 35px; height: 1px; background: rgba(227,185,137,.42); }
.product-card h3 { max-width: 180px; font: 800 clamp(1.75rem, 2.4vw, 2.2rem)/.99 var(--font-display); text-transform: uppercase; letter-spacing: .007em; padding: 22px 0; overflow-wrap: break-word; }
.product-card h3 span { color: #dfb782; }
.product-link { display: flex; align-items: center; gap: 5px; justify-content: space-between; padding-top: 12px; border-top: 1px solid rgba(235,205,166,.2); color: #efcfac; font-size: .68rem; font-weight: 700; }
.product-link:hover { color: #fff; }
.product-link .icon { width: 17px; height: 17px; }
.catalog-bottom { display: flex; align-items: center; justify-content: center; gap: 24px; padding-top: 37px; }
.catalog-bottom .line-art { width: 55px; height: 1px; background: #a97049; }
.catalog-bottom a { display: inline-flex; align-items: center; gap: 14px; font-weight: 600; font-size: .85rem; color: #f3d5ae; }
.catalog-bottom a:hover { color: #fff; }
.catalog-bottom .icon { width: 18px; height: 18px; }
/* Specialty posters */
.specialties .section-title span { font-size: .79em; }
.specialties { position: relative; background: #f1e0c3; }
.specialties::before { content: ''; pointer-events: none; position: absolute; inset: 0; background-image: radial-gradient(rgba(82,36,24,.08) .6px, transparent .6px); background-size: 9px 9px; opacity: .38; }
.specialties .container { position: relative; }
.specialties-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(15px, 2.5vw, 30px); }
.specialty-card { background: #fcf3e5; padding: 9px; border: 1px solid #c4a282; box-shadow: 0 12px 30px rgba(83,39,24,.07); transition: transform .3s ease, box-shadow .3s ease; min-width: 0; }
.specialty-card:hover { transform: translateY(-6px); box-shadow: 0 23px 35px rgba(83,39,24,.15); }
.poster-button { position: relative; width: 100%; display: block; padding: 0; border: 0; background: #55211d; overflow: hidden; }
.poster-button img { width: 100%; height: auto; aspect-ratio: 1/1; object-fit: contain; transition: transform .5s ease; }
.poster-button:hover img, .poster-button:focus-visible img { transform: scale(1.045); }
.expand-pill { position: absolute; bottom: 14px; left: 50%; transform: translateX(-50%) translateY(8px); opacity: 0; display: flex; align-items: center; gap: 7px; padding: 9px 12px; white-space: nowrap; font-size: .7rem; font-weight: 700; background: #fff4df; color: var(--wine); transition: opacity .25s ease, transform .25s ease; pointer-events: none; }
.expand-pill .icon { width: 14px; height: 14px; }
.poster-button:hover .expand-pill, .poster-button:focus-visible .expand-pill { opacity: 1; transform: translateX(-50%) translateY(0); }
.specialty-card-footer { display: flex; justify-content: space-between; align-items: end; gap: 9px; padding: 20px 13px 13px; }
.specialty-card-footer div { min-width: 0; }
.specialty-card-footer span { font-size: .62rem; text-transform: uppercase; letter-spacing: .14em; color: #856c58; font-weight: 700; }
.specialty-card-footer h3 { font: 800 clamp(1.48rem, 2.4vw, 2.35rem)/1 var(--font-display); color: var(--wine); text-transform: uppercase; margin-top: 7px; }
.specialty-card-footer > a { width: 35px; height: 35px; border: 1px solid #ba9880; display: grid; place-items: center; flex: none; color: var(--wine); transition: color .2s, background .2s; }
.specialty-card-footer > a:hover { background: var(--wine); color: white; }
.specialty-card-footer > a .icon { width: 17px; height: 17px; }
/* Contact */
.contact { background: #faefe0; position: relative; }
.contact-layout { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,.9fr); align-items: center; gap: clamp(35px, 7vw, 100px); }
.contact-intro .section-index { margin-bottom: 42px; color: var(--muted); }
.contact-intro .section-title { max-width: 590px; }
.contact-intro > p:not(.eyebrow) { max-width: 410px; margin: 23px 0 30px; color: #615146; line-height: 1.8; }
.contact-owner { display: flex; gap: 18px; align-items: center; }
.contact-owner::before { content: ''; height: 36px; width: 3px; background: var(--gold); }
.contact-owner span { font-size: .72rem; text-transform: uppercase; font-weight: 700; letter-spacing: .1em; color: #937054; }
.contact-owner strong { font: 700 1.35rem var(--font-display); color: var(--wine); }
.contact-options { display: grid; gap: 15px; }
.contact-option { position: relative; display: flex; gap: 17px; align-items: center; min-height: 134px; padding: 20px 22px; background: var(--wine); color: #fff3df; transition: transform .2s, background .2s; border: 1px solid var(--wine); }
.contact-option:nth-child(2) { background: #faf1e3; color: var(--wine); }
.contact-option:hover { transform: translateX(5px); background: var(--wine-light); }
.contact-option:nth-child(2):hover { background: #edd6b6; }
.contact-option-symbol { display: grid; place-items: center; width: 51px; height: 51px; border: 1px solid rgba(249,226,196,.5); flex: none; }
.contact-option:nth-child(2) .contact-option-symbol { border-color: rgba(80,26,22,.3); }
.contact-option-symbol .icon { width: 25px; height: 25px; }
.whatsapp-icon { fill: currentColor; stroke-width: .2; }
.contact-option-copy { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.contact-option-copy small { font-size: .7rem; text-transform: uppercase; font-weight: 700; letter-spacing: .15em; opacity: .78; }
.contact-option-copy strong { font: 800 clamp(1.45rem, 2.4vw, 2.1rem)/1 var(--font-display); letter-spacing: .015em; }
.contact-option-copy em { font-size: .75rem; font-weight: 600; font-style: normal; text-decoration: underline; text-underline-offset: 4px; opacity: .92; }
.contact-option-arrow { margin-left: auto; align-self: flex-start; width: 18px; height: 18px; }
/* Footer */
.footer { background: #2a100f; color: #f4dfc0; padding-top: 53px; }
.footer-top { display: flex; align-items: center; justify-content: space-between; gap: 40px; padding-bottom: 44px; }
.footer-brand { display: flex; align-items: center; gap: 16px; }
.footer-brand .brand-seal { border-color: #a06e40; background: #471914; }
.footer-brand strong { display: block; font: 800 1.45rem/1.08 var(--font-display); letter-spacing: .03em; }
.footer-brand p { color: #be9f8c; font-size: .75rem; margin-top: 8px; }
.footer nav { display: flex; gap: 20px; flex-wrap: wrap; }
.footer nav a { font-size: .73rem; font-weight: 700; }
.footer nav a:hover, .footer-bottom a:hover { color: #ffdfa4; }
.footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; padding: 19px 0 24px; border-top: 1px solid rgba(255,224,182,.19); color: #d0b8a2; font-size: .73rem; }
.footer-bottom span span { margin-inline: 6px; color: #936e58; }
/* Sticky actions */
.floating-whatsapp { position: fixed; right: 22px; bottom: 24px; z-index: 55; display: flex; align-items: center; gap: 9px; padding: 13px 16px; color: #fff; background: #205b41; box-shadow: 0 8px 30px rgba(0,0,0,.24); font-size: .8rem; font-weight: 700; transition: transform .2s, background .2s; }
.floating-whatsapp:hover { transform: translateY(-4px); background: #184f39; }
.floating-whatsapp .icon { width: 21px; height: 21px; fill: currentColor; stroke-width: .15; }
.back-to-top { position: fixed; left: 22px; bottom: 24px; z-index: 55; display: grid; place-items: center; width: 43px; height: 43px; background: var(--gold-light); color: var(--wine); border: 1px solid #ae7f55; opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(10px); transition: opacity .2s, transform .2s, visibility .2s; box-shadow: 0 7px 20px rgba(0,0,0,.13); }
.back-to-top.visible { opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0); }
.back-to-top .icon { transform: rotate(-90deg); }
/* Lightbox */
.image-dialog { position: fixed; inset: 0; max-width: min(92vw, 850px); max-height: min(95dvh, 900px); margin: auto; padding: clamp(12px,2vw,20px); overflow: auto; border: 1px solid var(--gold-light); background: #2d100f; color: #f4ddc2; box-shadow: 0 20px 70px rgba(0,0,0,.5); }
.image-dialog::backdrop { background: rgba(13, 6, 4, .88); backdrop-filter: blur(5px); }
.dialog-image-wrap { display: flex; justify-content: center; }
.dialog-image-wrap img { display: block; object-fit: contain; width: auto; max-width: 100%; max-height: calc(95dvh - 95px); }
.dialog-close { position: sticky; z-index: 5; top: 0; margin-left: auto; margin-bottom: 5px; display: grid; place-items: center; height: 40px; width: 40px; border: 1px solid var(--gold); color: #f8ead6; background: var(--wine); }
.dialog-close:hover { background: #873223; }
.dialog-hint { padding-top: 10px; text-align: center; font-size: .7rem; color: #c6a48e; }
/* Tablet */
@media (max-width: 1160px) {
  .header-inner { gap: 18px; }
  .brand-copy strong { font-size: 23px; }
  .main-nav { gap: 15px; }
  .nav-link { font-size: .7rem; }
  .hero-layout { min-height: 600px; }
  .hero-art { min-height: 470px; }
  .poster-main { top: 15%; }
  .poster-right { bottom: 13%; }
  .hero h1 { font-size: clamp(4.1rem, 6.5vw, 6.4rem); }
  .hero-pretitle { font-size: clamp(4.4rem, 8vw, 7.8rem); }
  .catalog-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .container { width: min(var(--content), calc(100% - 40px)); }
  .topline p { font-size: .61rem; }
  .header-inner { min-height: 75px; }
  .menu-toggle { display: flex; position: relative; z-index: 75; }
  .site-header { z-index: 80; }
  .main-nav { display: none; position: absolute; top: 100%; left: 0; right: 0; z-index: 70; padding: 10px 20px 20px; background: #fff7e9; border-bottom: 2px solid #be9d76; box-shadow: 0 20px 30px rgba(32,15,12,.16); }
  .site-header.menu-open .main-nav { display: grid; grid-template-columns: 1fr; gap: 0; }
  .main-nav .nav-link { font-size: .93rem; padding: 15px 4px; border-bottom: 1px solid #e7d6bd; }
  .main-nav .nav-cta { margin-top: 14px; justify-content: center; }
  .site-header.menu-open .menu-open-icon { display: none; }
  .site-header.menu-open .menu-close-icon { display: block; }
  .hero-layout { grid-template-columns: 1fr; gap: 0; min-height: 0; padding-top: 68px; padding-bottom: 60px; }
  .hero-content { text-align: center; padding: 0; }
  .hero-kicker, .hero-actions, .hero-signature { justify-content: center; }
  .hero-pretitle { font-size: clamp(4rem, 12vw, 7.2rem); }
  .hero h1 { max-width: none; font-size: clamp(3.8rem, 11vw, 7rem); }
  .hero-description { margin: 22px 0; }
  .hero-art { width: min(100%, 550px); margin: 0 auto; min-height: 490px; }
  .poster-main { top: 13%; left: 27%; width: 52%; }
  .poster-left { top: 11%; left: 3%; width: 40%; }
  .poster-right { bottom: 9%; right: 1%; width: 40%; }
  .hero-art-caption { bottom: 5%; left: 12%; }
  .hero-bottom { display: none; }
  .about-layout { grid-template-columns: .28fr .72fr; gap: 30px; }
  .rustic-mark { margin-top: 30px; }
  .about-details { grid-template-columns: 1fr 1fr; }
  .detail:nth-child(3) { border-left: 0; padding-left: 0; }
  .catalog-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .contact-layout { gap: 35px; }
  .specialties-grid { gap: 12px; }
  .specialty-card { padding: 6px; }
  .specialty-card-footer { padding: 16px 6px 10px; }
  .footer-top { align-items: start; }
}
/* Mobile */
@media (max-width: 650px) {
  html { scroll-padding-top: 75px; }
  .topline-inner { justify-content: center; }
  .topline p { font-size: .59rem; letter-spacing: .045em; text-align: center; }
  .topline a { display: none; }
  .header-inner { min-height: 70px; }
  .brand-seal { width: 40px; height: 42px; font-size: 17px; }
  .brand { gap: 9px; }
  .brand-copy strong { font-size: clamp(17px, 4.6vw, 22px); }
  .brand-copy small { font-size: .52rem; letter-spacing: .1em; }
  .hero::after { inset: 7px; }
  .hero-layout { padding-top: 65px; padding-bottom: 60px; }
  .hero-kicker { font-size: .62rem; letter-spacing: .13em; margin-bottom: 27px; }
  .kicker-line { width: 22px; }
  .hero-pretitle { font-size: clamp(4.1rem, 18vw, 6.7rem); }
  .hero h1 { font-size: clamp(3.2rem, 14.8vw, 5.8rem); }
  .hero h1 em { -webkit-text-stroke: 1px #ffe1b3; font-size: .73em; }
  .hero-description { font-size: 1.2rem; }
  .hero-actions { flex-direction: column; align-items: stretch; max-width: 350px; margin-inline: auto; }
  .button { width: 100%; }
  .hero-signature { margin-top: 26px; }
  .hero-art { min-height: 370px; margin-top: 20px; }
  .poster { padding: 3px; }
  .poster-main { left: 25%; width: 59%; top: 15%; }
  .poster-left { left: 0%; width: 45%; top: 6%; }
  .poster-right { right: -1%; width: 45%; bottom: 7%; }
  .hero-art-caption { bottom: 1%; left: 8%; font-size: .57rem; }
  .ribbon-track { min-height: 48px; gap: 19px; }
  .ribbon-track span { font-size: 1.13rem; }
  .section-pad { padding-block: 70px; }
  .section-title { font-size: clamp(3.35rem, 15vw, 5.6rem); }
  .section-heading { display: block; margin-bottom: 32px; }
  .section-heading > p { margin-top: 18px; max-width: 490px; }
  .section-heading .section-index { margin-bottom: 20px; }
  .about-layout { display: block; }
  .section-side .section-index { margin-bottom: 17px; }
  .rustic-mark { display: none; }
  .about-main { padding-top: 0; }
  .about-lead { font-size: 1.33rem; margin: 21px 0 29px; }
  .about-details { grid-template-columns: 1fr; gap: 13px; padding-top: 20px; }
  .detail, .detail + .detail, .detail:nth-child(3) { padding: 0 0 12px; border: 0; border-bottom: 1px solid var(--line); }
  .catalog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .product-card { padding: 14px; min-height: 217px; }
  .product-card h3 { font-size: clamp(1.6rem, 6.1vw, 2.4rem); }
  .product-link { font-size: .65rem; }
  .catalog-bottom { gap: 12px; padding-top: 29px; }
  .catalog-bottom .line-art { width: 25px; }
  .catalog-bottom a { font-size: .8rem; }
  .about .section-title span { display: block; font-size: .7em; }
  .specialties .section-title span { display: block; font-size: .60em; }
  .specialties-grid { grid-template-columns: 1fr; gap: 23px; max-width: 460px; margin-inline: auto; }
  .specialty-card { padding: 9px; }
  .specialty-card-footer { padding: 20px 13px 13px; }
  .specialty-card-footer h3 { font-size: 2rem; }
  .expand-pill { opacity: 1; transform: translateX(-50%) translateY(0); }
  .contact-layout { display: block; }
  .contact-intro .section-index { margin-bottom: 23px; }
  .contact-intro > p:not(.eyebrow) { margin-bottom: 25px; }
  .contact-options { margin-top: 34px; }
  .contact-option { min-height: 119px; padding: 18px; gap: 14px; }
  .contact-option-copy strong { font-size: clamp(1.5rem, 6.8vw, 2.2rem); }
  .footer { padding-top: 39px; }
  .footer-top { display: block; padding-bottom: 28px; }
  .footer-brand { align-items: start; }
  .footer nav { margin-top: 28px; gap: 16px; }
  .footer-bottom { display: block; }
  .footer-bottom > span { display: block; margin-bottom: 5px; }
  .floating-whatsapp { bottom: 16px; right: 15px; padding: 11px 13px; }
  .back-to-top { bottom: 16px; left: 15px; }
}
@media (max-width: 370px) {
  .container { width: calc(100% - 30px); }
  .brand-copy strong { font-size: 17px; }
  .hero h1 { font-size: 14.8vw; }
  .hero-pretitle { font-size: 18vw; }
  .hero-art { min-height: 300px; }
  .product-card { padding: 11px; min-height: 190px; }
  .product-card h3 { font-size: 1.45rem; }
  .product-link { font-size: .58rem; }
  .contact-option-symbol { width: 42px; height: 42px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}