@font-face { font-family: "Readex Pro"; src: url("./assets/fonts/readex-pro-400.ttf") format("truetype"); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: "Readex Pro"; src: url("./assets/fonts/readex-pro-500.ttf") format("truetype"); font-style: normal; font-weight: 500; font-display: swap; }
@font-face { font-family: "Readex Pro"; src: url("./assets/fonts/readex-pro-600.ttf") format("truetype"); font-style: normal; font-weight: 600; font-display: swap; }
@font-face { font-family: "Readex Pro"; src: url("./assets/fonts/readex-pro-700.ttf") format("truetype"); font-style: normal; font-weight: 700; font-display: swap; }
@font-face { font-family: "DM Mono"; src: url("./assets/fonts/dm-mono-400.ttf") format("truetype"); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: "DM Mono"; src: url("./assets/fonts/dm-mono-500.ttf") format("truetype"); font-style: normal; font-weight: 500; font-display: swap; }

:root {
  --paper: #f7f4ee;
  --paper-deep: #ebe4d8;
  --white: #fffdf8;
  --ink: #183a2f;
  --ink-soft: #315247;
  --ink-muted: #66776e;
  --line: rgba(24, 58, 47, .15);
  --red: #c9362d;
  --red-deep: #9e2d27;
  --apricot: #e4aa75;
  --gold: #d7b45e;
  --page: min(1240px, calc(100% - 64px));
  --radius-small: 8px;
  --radius-card: 14px;
  --ease: cubic-bezier(.2, .76, .25, 1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 116px; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: "Readex Pro", sans-serif; font-size: 15px; line-height: 1.7; text-align: right; }
body.modal-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
img { display: block; width: 100%; max-width: 100%; }
button:focus-visible, a:focus-visible { outline: 3px solid rgba(201, 54, 45, .45); outline-offset: 4px; }
.page-shell { width: var(--page); margin-inline: auto; }

.skip-link { position: fixed; top: 12px; right: 12px; z-index: 100; padding: 10px 14px; color: var(--white); background: var(--ink); border-radius: var(--radius-small); transform: translateY(-180%); transition: transform .2s var(--ease); }
.skip-link:focus { transform: translateY(0); }
.utility-bar { color: rgba(255,255,255,.78); background: var(--ink); font-size: .67rem; }
.utility-bar__inner { min-height: 35px; display: flex; align-items: center; gap: 10px; }
.utility-bar b { color: var(--gold); direction: ltr; font-family: "DM Mono", monospace; font-weight: 500; }
.utility-bar__divider { width: 1px; height: 12px; background: rgba(255,255,255,.25); }
.utility-bar a { margin-right: auto; color: white; border-bottom: 1px solid rgba(255,255,255,.45); }
.utility-bar i, .text-link i, .button i, .follow__links i, .header-whatsapp i, .mobile-menu__cta i { margin-right: 4px; font-family: "DM Mono", monospace; font-size: .9em; font-style: normal; }

.site-header { position: sticky; top: 0; z-index: 30; border-bottom: 1px solid var(--line); background: rgba(247,244,238,.94); backdrop-filter: blur(16px); }
.header__inner { min-height: 76px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; column-gap: 42px; }
.brand { display: inline-flex; align-items: center; gap: 10px; width: fit-content; }
.brand__mark { flex: 0 0 43px; width: 43px; height: 43px; overflow: hidden; border: 1px solid rgba(24,58,47,.18); border-radius: 50%; background: var(--white); }
.brand__mark img { width: 100%; height: 100%; object-fit: cover; }
.brand__wordmark { display: grid; align-content: center; gap: 2px; line-height: 1; }
.brand__wordmark strong { font-family: "DM Mono", monospace; font-size: .91rem; font-weight: 500; letter-spacing: .1em; direction: ltr; }
.brand__wordmark small { color: var(--ink-muted); font-size: .55rem; }
.desktop-nav { display: flex; justify-content: center; align-items: center; gap: clamp(20px, 3vw, 42px); color: var(--ink-soft); font-size: .75rem; font-weight: 500; }
.desktop-nav a { position: relative; padding: 9px 0; }
.desktop-nav a::after { position: absolute; right: 0; bottom: 2px; left: 0; height: 2px; content: ""; background: var(--red); transform: scaleX(0); transform-origin: right; transition: transform .2s var(--ease); }
.desktop-nav a:hover { color: var(--ink); }
.desktop-nav a:hover::after { transform: scaleX(1); }
.header__actions { display: flex; align-items: center; gap: 12px; }
.header-catalog { color: var(--ink-soft); border-bottom: 1px solid var(--line); font-size: .69rem; font-weight: 600; }
.header-whatsapp, .mobile-menu__cta { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 9px 13px; color: white; background: var(--red); border: 1px solid var(--red); border-radius: var(--radius-small); font-size: .68rem; font-weight: 600; transition: transform .2s var(--ease), background .2s var(--ease); }
.header-whatsapp:hover, .mobile-menu__cta:hover { background: var(--red-deep); transform: translateY(-2px); }
.menu-toggle { display: none; width: 43px; height: 43px; padding: 8px; border: 1px solid var(--line); border-radius: var(--radius-small); background: transparent; cursor: pointer; }
.menu-toggle span { display: block; width: 19px; height: 1.5px; margin: 4px auto; background: var(--ink); transition: transform .2s var(--ease), opacity .2s var(--ease); }
.menu-toggle.is-open span:nth-child(1) { transform: translateY(5.5px) rotate(45deg); }
.menu-toggle.is-open span:nth-child(2) { opacity: 0; }
.menu-toggle.is-open span:nth-child(3) { transform: translateY(-5.5px) rotate(-45deg); }
.brand-note { display: flex; align-items: center; gap: 8px; min-height: 26px; color: #7a776e; font-size: .52rem; line-height: 1.4; }
.brand-note span { color: var(--red-deep); font-family: "DM Mono", monospace; font-size: .49rem; }
.mobile-menu { display: none; }

.hero { overflow: hidden; position: relative; border-bottom: 1px solid var(--line); background: var(--paper); }
.hero::before { position: absolute; top: -300px; left: -230px; width: 660px; height: 660px; border: 1px solid rgba(24,58,47,.08); border-radius: 50%; content: ""; }
.hero::after { position: absolute; right: 7%; bottom: 70px; width: 122px; height: 122px; border: 18px solid rgba(201,54,45,.13); border-radius: 50%; content: ""; }
.hero__grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, .93fr) minmax(430px, 1.07fr); align-items: center; gap: clamp(50px, 7vw, 120px); min-height: 620px; padding-block: 74px; }
.eyebrow, .section-tag { display: flex; align-items: center; gap: 10px; margin: 0 0 18px; color: var(--red-deep); font-family: "DM Mono", monospace; font-size: .65rem; font-weight: 500; letter-spacing: .04em; }
.eyebrow span { display: inline-block; width: 25px; height: 2px; background: var(--red); }
.hero h1, .catalog h2, .ferment h2, .order h2, .delivery h2, .follow h2 { margin: 0; font-size: clamp(2.9rem, 5.8vw, 6.15rem); font-weight: 600; letter-spacing: -.08em; line-height: 1.06; text-wrap: balance; }
h1 em, h2 em { color: var(--red); font-style: normal; }
.hero__lead { max-width: 455px; margin: 25px 0 28px; color: var(--ink-muted); font-size: .94rem; line-height: 2; text-wrap: pretty; }
.hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 10px 17px; border: 1px solid transparent; border-radius: var(--radius-small); font-size: .75rem; font-weight: 600; cursor: pointer; transition: transform .2s var(--ease), color .2s var(--ease), background .2s var(--ease), border-color .2s var(--ease); }
.button:hover { transform: translateY(-2px); }
.button--red { color: white; background: var(--red); box-shadow: 8px 10px 0 rgba(24,58,47,.1); }
.button--red:hover { background: var(--red-deep); }
.button--quiet { color: var(--ink); border-color: var(--ink); background: transparent; }
.button--quiet:hover { color: var(--red); border-color: var(--red); }
.button--cream { color: var(--ink); background: var(--paper); }
.button--cream:hover { background: white; }
.button--green { color: white; background: var(--ink); }
.button--green:hover { background: var(--ink-soft); }
.button--primary { color: white; background: var(--red); box-shadow: 5px 6px 0 rgba(24,58,47,.11); }
.button--primary:hover { background: var(--red-deep); }
.hero__facts { display: flex; max-width: 485px; margin: 49px 0 0; padding-top: 17px; border-top: 1px solid var(--line); }
.hero__facts div { display: grid; flex: 1; gap: 2px; padding-left: 16px; border-left: 1px solid var(--line); }
.hero__facts div:last-child { padding-left: 0; border-left: 0; }
.hero__facts dt { color: var(--ink-muted); font-size: .57rem; }
.hero__facts dd { margin: 0; color: var(--ink); font-size: .69rem; font-weight: 600; }
.hero__visual { position: relative; min-height: 480px; }
.hero-shot { position: absolute; margin: 0; overflow: hidden; background: var(--paper-deep); }
.hero-shot img { width: 100%; height: 100%; object-fit: cover; transition: transform .55s var(--ease); }
.hero-shot:hover img { transform: scale(1.045); }
.hero-shot--main { top: 24px; right: 5%; width: 62%; height: 410px; border-radius: 160px 160px 12px 12px; box-shadow: 16px 18px 0 var(--ink); transform: rotate(2deg); }
.hero-shot--jam { top: 0; left: 3%; width: 32%; aspect-ratio: 1; border: 7px solid var(--paper); border-radius: 12px; box-shadow: 7px 8px 0 var(--red); transform: rotate(-5deg); }
.hero-shot--sauce { right: 0; bottom: 0; width: 39%; aspect-ratio: 1.08; border: 7px solid var(--paper); border-radius: 12px; box-shadow: 8px 9px 0 var(--gold); transform: rotate(-4deg); }
.hero__visual-label { position: absolute; bottom: 44px; left: 4%; margin: 0; color: var(--ink); font-size: .63rem; line-height: 1.6; transform: rotate(-7deg); }
.hero__visual-label span { display: block; margin-bottom: 4px; color: var(--red); font-family: "DM Mono", monospace; font-size: .58rem; letter-spacing: .08em; }

.catalog { padding: 116px 0 124px; background: var(--white); }
.catalog__layout { display: grid; grid-template-columns: minmax(250px, .72fr) minmax(0, 1.52fr); gap: clamp(42px, 7vw, 118px); align-items: start; }
.catalog__intro { position: sticky; top: 123px; max-width: 330px; }
.section-tag { margin-bottom: 13px; }
.section-tag span { color: var(--red); }
.catalog h2, .order h2, .delivery h2, .follow h2 { font-size: clamp(2.6rem, 4.3vw, 4.55rem); }
.catalog__intro > p:not(.section-tag) { margin: 22px 0 17px; color: var(--ink-muted); font-size: .78rem; line-height: 1.9; }
.text-link { display: inline-flex; align-items: center; color: var(--ink); border-bottom: 1px solid var(--red); font-size: .72rem; font-weight: 600; transition: color .2s var(--ease); }
.text-link:hover { color: var(--red); }
.catalog__intro-note { margin-top: 36px; padding: 14px 15px; border: 1px solid rgba(24,58,47,.12); border-radius: 12px; color: var(--ink-muted); background: var(--paper); font-size: .63rem; line-height: 1.75; }
.catalog__intro-note span { display: block; margin-bottom: 3px; color: var(--red-deep); font-family: "DM Mono", monospace; font-size: .58rem; }
.catalog__heading { display: flex; align-items: baseline; justify-content: space-between; gap: 18px; padding: 0 0 17px; border-bottom: 1px solid var(--line); }
.catalog__heading p { margin: 0; color: var(--ink); font-size: .91rem; font-weight: 600; }
.catalog__heading span { color: var(--ink-muted); font-size: .59rem; }
.catalog__content { min-width: 0; }
.category-filter { display: flex; align-items: center; gap: 7px; min-width: 0; margin: 14px 0 25px; overflow-x: auto; padding: 5px 6px 10px; border: 1px solid rgba(24,58,47,.1); border-radius: 999px; background: var(--paper); scrollbar-width: none; scroll-snap-type: x proximity; }
.category-filter::-webkit-scrollbar { display: none; }
.category-filter__button { min-height: 37px; white-space: nowrap; padding: 7px 12px; border: 1px solid transparent; border-radius: 999px; color: var(--ink-soft); background: transparent; font-size: .65rem; cursor: pointer; scroll-snap-align: start; transition: transform .2s var(--ease), background .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease); }
.category-filter__button span { margin-right: 4px; color: var(--red); font-family: "DM Mono", monospace; font-size: .58rem; }
.category-filter__button:hover { transform: translateY(-1px); }
.category-filter__button:hover, .category-filter__button.is-active { color: white; border-color: var(--ink); background: var(--ink); box-shadow: 0 4px 10px rgba(24,58,47,.12); }
.category-filter__button:hover span, .category-filter__button.is-active span { color: var(--gold); }
.product-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 15px; row-gap: 28px; }
.product-card { position: relative; display: grid; min-width: 0; overflow: hidden; border: 1px solid rgba(24,58,47,.11); border-radius: 16px; background: var(--white); box-shadow: 0 7px 0 rgba(24,58,47,.045); transition: transform .24s var(--ease), box-shadow .24s var(--ease), border-color .24s var(--ease); }
.product-card:hover { border-color: rgba(24,58,47,.24); box-shadow: 0 12px 22px rgba(24,58,47,.1); transform: translateY(-4px); }
.product-card__image { position: relative; overflow: hidden; aspect-ratio: 1 / .92; background: var(--paper-deep); }
.product-card__image::after { position: absolute; inset: 0; content: ""; border: 1px solid transparent; transition: border-color .2s var(--ease); }
.product-card:hover .product-card__image::after { border-color: rgba(24,58,47,.32); }
.product-card__image img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s var(--ease); }
.product-card:hover .product-card__image img { transform: scale(1.035); }
.product-card__badge { position: absolute; right: 10px; bottom: 10px; padding: 5px 8px; color: var(--ink); border: 1px solid rgba(24,58,47,.1); border-radius: 999px; background: rgba(255,253,248,.94); box-shadow: 0 3px 8px rgba(24,58,47,.08); font-family: "DM Mono", monospace; font-size: .55rem; }
.product-card__body { display: grid; min-height: 145px; align-content: start; gap: 7px; padding: 13px 13px 14px; }
.product-card__meta { display: inline-flex; width: fit-content; padding: 3px 7px; color: var(--red-deep); border-radius: 999px; background: rgba(201,54,45,.08); font-family: "DM Mono", monospace; font-size: .53rem; }
.product-card h3 { min-height: 2.95em; margin: 0; color: var(--ink); font-size: .8rem; font-weight: 600; line-height: 1.5; text-wrap: pretty; }
.product-card__bottom { display: flex; align-items: end; justify-content: space-between; gap: 8px; margin-top: auto; padding-top: 11px; border-top: 1px solid var(--line); }
.product-card__price { display: grid; min-width: 0; gap: 1px; color: var(--ink); line-height: 1.3; }
.product-card__price small { color: var(--ink-muted); font-size: .53rem; }
.product-card__price strong { color: var(--ink); font-family: "DM Mono", monospace; font-size: .71rem; font-weight: 500; white-space: nowrap; }
.product-card__action { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; gap: 5px; min-height: 40px; padding: 7px 10px; border: 1px solid var(--ink); border-radius: 999px; color: var(--ink); background: transparent; font-size: .6rem; cursor: pointer; transition: transform .2s var(--ease), color .2s var(--ease), background .2s var(--ease), border-color .2s var(--ease); }
.product-card__action b { font-family: "DM Mono", monospace; font-size: .8rem; font-weight: 400; }
.product-card__action:hover { color: white; border-color: var(--red); background: var(--red); transform: translateY(-2px); }
.catalog-empty { padding: 36px 20px; border: 1px dashed var(--line); color: var(--ink-muted); font-size: .78rem; text-align: center; }

.ferment { overflow: hidden; background: var(--ink); color: white; }
.ferment__layout { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr); align-items: center; min-height: 604px; }
.ferment__copy { padding: 72px 0 72px clamp(35px, 7vw, 110px); }
.section-tag--light { color: var(--gold); }
.section-tag--light span { color: var(--gold); }
.ferment h2 { color: white; font-size: clamp(2.7rem, 5vw, 5.35rem); }
.ferment h2 em { color: var(--gold); }
.ferment__copy > p:not(.section-tag) { max-width: 450px; margin: 25px 0 27px; color: rgba(255,255,255,.67); font-size: .83rem; line-height: 2; }
.ferment__facts { max-width: 490px; margin: 0 0 30px; border-top: 1px solid rgba(255,255,255,.18); }
.ferment__facts div { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 11px 0; border-bottom: 1px solid rgba(255,255,255,.18); }
.ferment__facts dt { color: rgba(255,255,255,.49); font-size: .68rem; }
.ferment__facts dd { margin: 0; color: white; font-family: "DM Mono", monospace; font-size: .66rem; font-weight: 500; }
.ferment__art { position: relative; align-self: stretch; min-height: 530px; overflow: hidden; background: var(--apricot); }
.ferment__circle { position: absolute; top: -100px; left: -70px; width: 470px; height: 470px; border: 44px solid rgba(255,253,248,.46); border-radius: 50%; }
.ferment__art figure { position: absolute; top: 12%; right: 18%; width: 56%; height: 71%; margin: 0; overflow: hidden; border: 10px solid var(--paper); border-radius: 52% 52% 10px 10px; box-shadow: 18px 20px 0 rgba(24,58,47,.82); transform: rotate(-4deg); }
.ferment__art figure img { width: 100%; height: 100%; object-fit: cover; }
.ferment__stamp { position: absolute; bottom: 14%; left: 10%; display: grid; place-content: center; width: 94px; height: 94px; color: var(--ink); border: 5px solid var(--paper); border-radius: 50%; background: var(--gold); font-size: .68rem; line-height: 1.25; text-align: center; transform: rotate(8deg); }
.ferment__stamp b { color: var(--red-deep); font-size: .88rem; }

.order { padding: 116px 0; background: var(--paper); }
.order__lead { display: flex; align-items: end; justify-content: space-between; gap: 48px; padding-bottom: 42px; border-bottom: 1px solid var(--line); }
.order__lead > p { max-width: 350px; margin: 0 0 7px; color: var(--ink-muted); font-size: .78rem; line-height: 1.95; }
.order__steps { display: grid; grid-template-columns: repeat(3, 1fr); }
.order-step { padding: 27px 26px 25px 0; border-left: 1px solid var(--line); background: rgba(255,253,248,.5); transition: background .2s var(--ease), transform .2s var(--ease); }
.order-step:first-child { padding-right: 0; }
.order-step:last-child { border-left: 0; }
.order-step:hover { background: var(--white); transform: translateY(-3px); }
.order-step > span { display: grid; place-items: center; width: 38px; height: 38px; color: white; border-radius: 50%; background: var(--red); box-shadow: 0 5px 0 rgba(24,58,47,.11); font-family: "DM Mono", monospace; font-size: .75rem; }
.order-step h3 { margin: 12px 0 6px; font-size: .91rem; font-weight: 600; }
.order-step p { max-width: 220px; margin: 0; color: var(--ink-muted); font-size: .7rem; line-height: 1.8; }

.delivery { padding: 0 0 116px; background: var(--paper); }
.delivery__grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(380px, 1.1fr); overflow: hidden; border-radius: 22px; background: var(--red); box-shadow: 0 14px 0 rgba(24,58,47,.08); }
.delivery__title { min-height: 392px; padding: 55px clamp(28px, 5vw, 65px); color: white; }
.section-tag--red { color: rgba(255,255,255,.75); }
.section-tag--red span { color: var(--gold); }
.delivery h2 { color: white; margin-bottom: 28px; }
.delivery h2 em { color: var(--gold); }
.delivery__details { display: grid; align-content: center; gap: 0; padding: 46px clamp(26px, 5vw, 65px); background: var(--ink); }
.delivery-item { display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: 14px; padding: 16px 0; border-bottom: 1px solid rgba(255,255,255,.16); }
.delivery-item > span { align-self: start; color: var(--gold); font-family: "DM Mono", monospace; font-size: .65rem; }
.delivery-item small { display: block; color: rgba(255,255,255,.48); font-size: .59rem; }
.delivery-item strong { color: white; font-size: .8rem; font-weight: 600; }
.delivery-item b { color: var(--gold); font-family: "DM Mono", monospace; font-size: .61rem; font-weight: 500; text-align: left; }
.delivery__details > p { margin: 17px 0 0; color: rgba(255,255,255,.54); font-size: .61rem; }

.follow { padding: 88px 0; background: var(--white); border-top: 1px solid var(--line); }
.follow__layout { display: flex; align-items: end; justify-content: space-between; gap: 55px; }
.follow h2 { font-size: clamp(2.4rem, 4vw, 4.2rem); }
.follow__links { min-width: min(100%, 485px); }
.follow__links a { display: grid; grid-template-columns: 1fr auto 22px; align-items: center; gap: 15px; min-height: 56px; margin-bottom: 8px; padding: 8px 14px; border: 1px solid var(--line); border-radius: 14px; background: var(--paper); transition: transform .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease), box-shadow .2s var(--ease); }
.follow__links a:first-child { border-top: 1px solid var(--line); }
.follow__links a:hover { color: var(--red); border-color: rgba(201,54,45,.35); box-shadow: 0 8px 18px rgba(24,58,47,.08); transform: translateX(-4px); }
.follow__links span { font-size: .75rem; font-weight: 600; }
.follow__links b { color: var(--ink-muted); font-family: "DM Mono", monospace; font-size: .6rem; font-weight: 400; direction: ltr; }
.follow__links i { color: var(--red); font-style: normal; }

.site-footer { color: white; background: var(--ink); }
.footer__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 50px; padding: 52px 0 47px; }
.brand--footer .brand__mark { border-color: rgba(255,255,255,.3); }
.brand--footer .brand__wordmark small { color: rgba(255,255,255,.53); }
.footer__brand p { margin: 15px 0 0; color: rgba(255,255,255,.56); font-size: .67rem; }
.footer__brand .footer__notice { max-width: 385px; margin-top: 17px; color: rgba(255,255,255,.42); font-size: .56rem; line-height: 1.75; }
.footer__notice span { display: block; margin-bottom: 3px; color: var(--gold); font-family: "DM Mono", monospace; font-size: .52rem; }
.footer__links { display: flex; flex-wrap: wrap; justify-content: end; gap: 9px 26px; max-width: 450px; color: rgba(255,255,255,.72); font-size: .69rem; }
.footer__links a:hover { color: var(--gold); }
.footer__bottom { display: flex; justify-content: space-between; gap: 20px; padding: 16px 0 21px; border-top: 1px solid rgba(255,255,255,.16); color: rgba(255,255,255,.43); font-size: .57rem; }

.modal { position: fixed; inset: 0; z-index: 50; display: grid; place-items: center; padding: 20px; visibility: hidden; opacity: 0; transition: opacity .2s var(--ease), visibility .2s var(--ease); }
.modal.is-open { visibility: visible; opacity: 1; }
.modal__backdrop { position: absolute; inset: 0; background: rgba(16,43,34,.75); backdrop-filter: blur(5px); }
.modal__panel { position: relative; z-index: 1; width: min(830px, 100%); max-height: min(730px, calc(100vh - 40px)); overflow-y: auto; background: var(--white); box-shadow: 16px 19px 0 rgba(0,0,0,.17); transform: translateY(14px) scale(.987); transition: transform .24s var(--ease); }
.modal.is-open .modal__panel { transform: translateY(0) scale(1); }
.modal__close { position: absolute; top: 13px; left: 13px; z-index: 2; display: grid; place-content: center; width: 42px; height: 42px; border: 1px solid var(--line); border-radius: 50%; color: var(--ink); background: rgba(255,253,248,.95); font-size: 1.45rem; line-height: 1; cursor: pointer; }
.modal-product { display: grid; grid-template-columns: .86fr 1.14fr; min-height: 480px; }
.modal-product__image { min-height: 100%; background: var(--paper-deep); }
.modal-product__image img { width: 100%; height: 100%; object-fit: cover; }
.modal-product__body { padding: 48px 38px 34px; }
.modal-product__category { margin: 0 0 8px; color: var(--red-deep); font-family: "DM Mono", monospace; font-size: .6rem; }
.modal-product h2 { margin: 0; font-size: clamp(1.85rem, 3vw, 2.8rem); font-weight: 600; letter-spacing: -.07em; line-height: 1.2; }
.modal-product__description { margin: 14px 0 19px; color: var(--ink-muted); font-size: .78rem; line-height: 1.85; }
.modal-product__info { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 0; padding: 14px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.modal-product__info div { display: grid; gap: 2px; }
.modal-product__info dt { color: var(--ink-muted); font-size: .6rem; }
.modal-product__info dd { margin: 0; color: var(--ink); font-size: .68rem; font-weight: 600; }
.option-label { display: block; margin: 18px 0 8px; font-size: .7rem; font-weight: 600; }
.option-group { display: flex; flex-wrap: wrap; gap: 7px; }
.option-group button { min-height: 39px; padding: 7px 10px; border: 1px solid var(--line); border-radius: 7px; color: var(--ink); background: white; font-size: .65rem; cursor: pointer; transition: color .18s var(--ease), background .18s var(--ease), border-color .18s var(--ease); }
.option-group button:hover, .option-group button.is-selected, .option-group button[aria-pressed="true"] { color: white; border-color: var(--ink); background: var(--ink); }
.modal-product__purchase { display: flex; align-items: center; gap: 14px; margin-top: 23px; }
.modal-product__price { flex: 1; color: var(--red); font-family: "DM Mono", monospace; font-size: .87rem; font-weight: 500; }
.modal-product__purchase .button { white-space: nowrap; }
.modal-product__checkout { margin-top: 24px; padding: 16px; border: 1px solid rgba(24,58,47,.14); border-radius: 12px; background: var(--paper); }
.checkout-summary__heading { display: flex; align-items: center; gap: 9px; padding-bottom: 10px; color: var(--ink); border-bottom: 1px solid var(--line); font-size: .75rem; }
.checkout-summary__heading span { color: var(--red); font-family: "DM Mono", monospace; font-size: .67rem; }
.checkout-summary__line { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 9px 0; color: var(--ink-muted); border-bottom: 1px solid rgba(24,58,47,.1); font-size: .64rem; }
.checkout-summary__line b, .checkout-summary__line strong { color: var(--ink); font-size: .68rem; font-weight: 600; text-align: left; }
.checkout-summary__line--price { padding-top: 12px; }
.checkout-summary__line--price strong { color: var(--red); font-family: "DM Mono", monospace; font-size: .83rem; }
.checkout-summary__line--delivery { border-bottom: 0; }
.checkout-summary__line--delivery b { color: var(--ink-soft); font-family: "DM Mono", monospace; font-size: .62rem; font-weight: 500; }
.button--checkout { width: 100%; min-height: 52px; gap: 8px; margin-top: 8px; border-radius: 10px; box-shadow: 0 7px 0 rgba(24,58,47,.14); }
.button--checkout:hover { box-shadow: 0 4px 0 rgba(24,58,47,.14); }
.button--checkout:active { box-shadow: 0 2px 0 rgba(24,58,47,.14); transform: translateY(4px); }
.checkout-summary__note { margin: 11px 1px 0; color: var(--ink-muted); font-size: .59rem; line-height: 1.7; text-align: center; }
.modal-product__notice { margin: 12px 0 0; padding: 9px 11px; color: #75583f; background: #f4e3cf; font-size: .64rem; line-height: 1.65; }
.floating-whatsapp { position: fixed; bottom: 21px; left: 21px; z-index: 20; display: inline-flex; align-items: center; gap: 8px; min-height: 46px; padding: 10px 13px; color: white; background: var(--red); box-shadow: 7px 8px 0 rgba(24,58,47,.18); font-size: .68rem; font-weight: 600; transition: transform .2s var(--ease), background .2s var(--ease); }
.floating-whatsapp:hover { background: var(--red-deep); transform: translateY(-3px); }
.floating-whatsapp b { font-family: "DM Mono", monospace; font-size: .83rem; font-weight: 400; }

@media (max-width: 980px) {
  :root { --page: min(760px, calc(100% - 48px)); }
  .desktop-nav, .header-catalog { display: none; }
  .header__inner { grid-template-columns: 1fr auto; }
  .menu-toggle { display: block; }
  .mobile-menu { position: absolute; top: 100%; right: 0; left: 0; display: block; visibility: hidden; padding: 12px 0 20px; border-bottom: 1px solid var(--line); background: var(--white); box-shadow: 0 16px 26px rgba(24,58,47,.1); opacity: 0; transform: translateY(-9px); transition: opacity .2s var(--ease), visibility .2s var(--ease), transform .2s var(--ease); }
  .mobile-menu.is-open { visibility: visible; opacity: 1; transform: translateY(0); }
  .mobile-menu__inner { display: grid; }
  .mobile-menu a { display: flex; align-items: center; min-height: 46px; border-bottom: 1px solid var(--line); font-size: .76rem; font-weight: 600; }
  .mobile-menu .mobile-menu__cta { justify-content: center; min-height: 44px; margin-top: 13px; border: 0; }
  .hero__grid { grid-template-columns: 1fr; min-height: auto; gap: 44px; padding-block: 60px 72px; }
  .hero__visual { width: min(100%, 600px); margin: 0 auto; }
  .catalog__layout { grid-template-columns: 1fr; gap: 38px; }
  .catalog__intro { position: static; max-width: 500px; }
  .catalog__intro-note { margin-top: 25px; }
  .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ferment__layout { grid-template-columns: 1fr; }
  .ferment__copy { padding: 65px 0; }
  .ferment__art { min-height: 450px; }
  .delivery__grid { grid-template-columns: 1fr; }
  .delivery__title { min-height: 350px; }
}

@media (max-width: 650px) {
  :root { --page: calc(100% - 32px); }
  body { font-size: 14px; }
  .utility-bar__inner { justify-content: center; gap: 7px; font-size: .55rem; }
  .utility-bar__divider { display: none; }
  .utility-bar a { margin-right: 2px; }
  .header__inner { min-height: 68px; gap: 12px; }
  .brand__mark { flex-basis: 39px; width: 39px; height: 39px; }
  .brand__wordmark strong { font-size: .78rem; }
  .brand__wordmark small { font-size: .49rem; }
  .header-whatsapp { min-height: 37px; padding-inline: 10px; font-size: .61rem; }
  .brand-note { align-items: flex-start; min-height: 30px; padding-block: 4px; font-size: .48rem; }
  .hero::before { top: -90px; left: -245px; width: 470px; height: 470px; }
  .hero::after { right: 5%; bottom: 61px; width: 81px; height: 81px; border-width: 12px; }
  .hero__grid { gap: 34px; padding-block: 42px 50px; }
  .eyebrow { margin-bottom: 14px; font-size: .56rem; }
  .hero h1 { font-size: clamp(2.72rem, 13.3vw, 4.15rem); }
  .hero__lead { margin: 18px 0 22px; font-size: .8rem; line-height: 1.9; }
  .hero__actions { display: grid; grid-template-columns: 1fr; }
  .hero__actions .button { width: 100%; min-height: 50px; }
  .hero__facts { margin-top: 34px; }
  .hero__facts div { padding-left: 9px; }
  .hero__facts dt { font-size: .51rem; }
  .hero__facts dd { font-size: .59rem; }
  .hero__visual { min-height: 317px; }
  .hero-shot--main { top: 17px; right: 8%; width: 68%; height: 270px; border-radius: 90px 90px 10px 10px; box-shadow: 10px 11px 0 var(--ink); }
  .hero-shot--jam { width: 30%; border-width: 5px; box-shadow: 5px 6px 0 var(--red); }
  .hero-shot--sauce { width: 42%; border-width: 5px; box-shadow: 5px 6px 0 var(--gold); }
  .hero__visual-label { bottom: 8px; left: 1%; font-size: .51rem; }
  .catalog { padding: 74px 0 80px; }
  .catalog h2, .order h2, .delivery h2, .follow h2 { font-size: clamp(2.25rem, 11vw, 3.5rem); }
  .catalog__intro > p:not(.section-tag) { max-width: 385px; margin: 17px 0 14px; font-size: .72rem; }
  .catalog__heading { display: block; padding-bottom: 13px; }
  .catalog__heading p { font-size: .78rem; }
  .catalog__heading span { display: block; margin-top: 3px; font-size: .53rem; }
  .category-filter { margin-inline: -16px; padding-inline: 16px; }
  .category-filter__button { min-height: 42px; font-size: .59rem; }
  .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 10px; }
  .product-card__body { min-height: 116px; padding-top: 9px; }
  .product-card__meta { font-size: .48rem; }
  .product-card h3 { font-size: .69rem; }
  .product-card__price { font-size: .57rem; }
  .product-card__action { min-width: 30px; min-height: 30px; }
  .ferment__copy { padding: 50px 0; }
  .ferment h2 { font-size: clamp(2.4rem, 11vw, 3.85rem); }
  .ferment__copy > p:not(.section-tag) { margin: 19px 0 22px; font-size: .75rem; }
  .ferment__facts dd { font-size: .58rem; }
  .ferment__copy .button { width: 100%; min-height: 50px; }
  .ferment__art { min-height: 340px; }
  .ferment__circle { top: -70px; left: -80px; width: 320px; height: 320px; border-width: 31px; }
  .ferment__art figure { top: 12%; right: 20%; width: 56%; height: 69%; border-width: 7px; box-shadow: 10px 11px 0 rgba(24,58,47,.82); }
  .ferment__stamp { width: 74px; height: 74px; border-width: 4px; font-size: .56rem; }
  .ferment__stamp b { font-size: .7rem; }
  .order { padding: 76px 0; }
  .order__lead { display: block; padding-bottom: 28px; }
  .order__lead > p { margin: 16px 0 0; font-size: .73rem; }
  .order__steps { grid-template-columns: 1fr; }
  .order-step, .order-step:first-child { display: grid; grid-template-columns: 47px 1fr; column-gap: 5px; padding: 20px 0; border-bottom: 1px solid var(--line); border-left: 0; }
  .order-step:last-child { border-bottom: 0; }
  .order-step > span { grid-row: span 2; font-size: 1rem; }
  .order-step h3 { margin: 0 0 5px; font-size: .81rem; }
  .order-step p { max-width: none; font-size: .66rem; }
  .delivery { padding-bottom: 76px; }
  .delivery__title { min-height: 310px; padding: 42px 24px; }
  .delivery__title .button { width: 100%; min-height: 50px; }
  .delivery__details { padding: 30px 24px; }
  .delivery-item { grid-template-columns: 28px 1fr; gap: 10px; }
  .delivery-item b { grid-column: 2; margin-top: -9px; text-align: right; }
  .delivery__details > p { font-size: .56rem; }
  .follow { padding: 65px 0; }
  .follow__layout { display: block; }
  .follow__links { margin-top: 28px; }
  .follow__links a { grid-template-columns: 1fr 22px; min-height: 55px; }
  .follow__links b { display: none; }
  .footer__top { display: block; padding: 43px 0 35px; }
  .footer__links { justify-content: flex-start; margin-top: 31px; gap: 9px 22px; }
  .footer__bottom { display: block; line-height: 1.8; }
  .footer__bottom span { display: block; }
  .modal { align-items: end; padding: 0; }
  .modal__panel { width: 100%; max-height: min(92dvh, 760px); border-radius: 18px 18px 0 0; box-shadow: 0 -12px 40px rgba(0,0,0,.22); }
  .modal__panel::before { display: block; width: 42px; height: 4px; margin: 9px auto 0; border-radius: 99px; background: rgba(24,58,47,.2); content: ""; }
  .modal__close { top: 13px; left: 13px; width: 42px; height: 42px; }
  .modal-product { grid-template-columns: 1fr; }
  .modal-product__image { min-height: 165px; max-height: 208px; }
  .modal-product__body { padding: 23px 18px 25px; }
  .modal-product h2, .modal-product__category, .modal-product__description { text-align: center; }
  .modal-product__info { grid-template-columns: 1fr; gap: 8px; }
  .modal-product__info div { justify-items: center; text-align: center; }
  .option-label { text-align: center; }
  .option-group { justify-content: center; }
  .option-group button { min-height: 43px; }
  .modal-product__purchase { flex-direction: column; align-items: stretch; gap: 9px; }
  .modal-product__purchase .button { width: 100%; min-height: 50px; }
  .modal-product__price { text-align: center; }
  .modal-product__checkout { margin: 22px -18px 0; padding: 14px 18px calc(17px + env(safe-area-inset-bottom)); border-right: 0; border-bottom: 0; border-left: 0; border-radius: 0; }
  .checkout-summary__heading { font-size: .78rem; }
  .checkout-summary__line { padding-block: 10px; font-size: .68rem; }
  .checkout-summary__line b, .checkout-summary__line strong { font-size: .72rem; }
  .checkout-summary__line--price strong { font-size: .9rem; }
  .button--checkout { min-height: 54px; font-size: .82rem; }
  .checkout-summary__note { font-size: .63rem; }
  .floating-whatsapp { bottom: max(15px, env(safe-area-inset-bottom)); left: max(15px, env(safe-area-inset-left)); min-height: 47px; }
}

@media (min-width: 651px) and (max-width: 980px) {
  .header-whatsapp { min-height: 43px; font-size: .72rem; }
  .product-grid { gap: 24px 18px; }
  .product-card__body { min-height: 138px; padding-top: 13px; }
  .product-card__meta { font-size: .59rem; }
  .product-card h3 { font-size: .84rem; }
  .product-card__price { font-size: .69rem; }
  .product-card__action { min-width: 38px; min-height: 38px; }
}

@media (max-width: 650px) {
  .site-header { box-shadow: 0 3px 14px rgba(24,58,47,.06); }
  .utility-bar__inner { min-height: 38px; font-size: .62rem; }
  .header__inner { min-height: 66px; }
  .header__actions { gap: 8px; }
  .header-whatsapp { min-height: 43px; padding-inline: 12px; font-size: .68rem; }
  .menu-toggle { width: 44px; height: 44px; }
  .mobile-menu a { min-height: 50px; font-size: .82rem; }
  .mobile-menu .mobile-menu__cta { min-height: 48px; }
  .hero__grid { gap: 29px; padding-block: 35px 48px; }
  .eyebrow { font-size: .64rem; }
  .hero__lead { max-width: 350px; font-size: .88rem; line-height: 1.95; }
  .hero__actions { gap: 10px; }
  .hero__actions .button { min-height: 52px; font-size: .8rem; }
  .hero__facts { gap: 0; margin-top: 30px; padding-top: 14px; }
  .hero__facts div { gap: 4px; padding-left: 8px; }
  .hero__facts dt { font-size: .59rem; }
  .hero__facts dd { font-size: .7rem; }
  .hero__visual { min-height: 342px; }
  .hero-shot--main { top: 18px; right: 8%; width: 69%; height: 282px; }
  .hero-shot--jam { top: 2px; left: 1%; width: 31%; }
  .hero-shot--sauce { right: 0; bottom: 7px; width: 39%; }
  .hero__visual-label { bottom: 3px; left: 1%; font-size: .57rem; }
  .catalog { padding: 66px 0 76px; }
  .catalog__layout { gap: 31px; }
  .catalog__intro > p:not(.section-tag) { font-size: .8rem; }
  .catalog__heading p { font-size: .91rem; }
  .catalog__heading span { font-size: .62rem; }
  .category-filter { margin-top: 17px; margin-bottom: 27px; }
  .category-filter__button { min-height: 44px; padding-inline: 14px; font-size: .67rem; }
  .product-grid { gap: 24px 13px; }
  .product-card__image { aspect-ratio: 1 / .86; }
  .product-card__badge { right: 7px; bottom: 7px; padding: 5px 6px; font-size: .58rem; }
  .product-card__body { min-height: 145px; gap: 7px; padding-top: 11px; }
  .product-card__meta { font-size: .61rem; }
  .product-card h3 { min-height: 3.15em; font-size: .84rem; line-height: 1.55; }
  .product-card__bottom { padding-top: 10px; }
  .product-card__price { font-size: .7rem; }
  .product-card__action { min-width: 56px; min-height: 40px; padding-inline: 8px; }
  .product-card__action span { font-size: 0; }
  .product-card__action span::after { content: "عرض"; font-size: .63rem; }
  .ferment__copy { padding-block: 54px; }
  .ferment__copy > p:not(.section-tag) { font-size: .82rem; }
  .ferment__facts dt { font-size: .72rem; }
  .ferment__facts dd { font-size: .68rem; }
  .ferment__copy .button { min-height: 52px; font-size: .8rem; }
  .order__lead > p { font-size: .8rem; }
  .order-step { min-height: 104px; }
  .order-step h3 { font-size: .9rem; }
  .order-step p { font-size: .73rem; }
  .delivery__title .button { min-height: 52px; font-size: .8rem; }
  .delivery-item { padding-block: 19px; }
  .delivery-item small { font-size: .66rem; }
  .delivery-item strong { font-size: .87rem; }
  .delivery-item b { font-size: .68rem; }
  .follow__links a { min-height: 61px; }
  .follow__links span { font-size: .82rem; }
  .footer__brand .footer__notice { font-size: .62rem; }
  .modal__panel { max-height: min(94dvh, 800px); overscroll-behavior: contain; padding-bottom: env(safe-area-inset-bottom); }
  .modal__close { width: 44px; height: 44px; }
  .modal-product__image { min-height: 145px; max-height: 175px; }
  .modal-product__body { padding: 21px 20px 28px; }
  .modal-product h2 { font-size: 2rem; }
  .modal-product__category { font-size: .67rem; }
  .modal-product__description { font-size: .8rem; }
  .modal-product__info dt { font-size: .65rem; }
  .modal-product__info dd { font-size: .74rem; }
  .option-label { font-size: .78rem; }
  .option-group { gap: 8px; }
  .option-group button { min-height: 44px; padding-inline: 12px; font-size: .73rem; }
  .modal-product__checkout { position: sticky; bottom: 0; z-index: 3; margin: 22px -20px 0; padding: 14px 20px calc(17px + env(safe-area-inset-bottom)); border-top: 1px solid rgba(24,58,47,.16); background: rgba(255,253,248,.98); box-shadow: 0 -12px 24px rgba(24,58,47,.1); }
  .modal-product__price { font-size: .94rem; }
  .button--checkout { min-height: 54px; }
  .floating-whatsapp { min-height: 50px; padding-inline: 15px; font-size: .74rem; }
}

@media (max-width: 420px) {
  .utility-bar__inner { justify-content: space-between; gap: 8px; }
  .utility-bar__inner > span:nth-of-type(3) { display: none; }
  .utility-bar a { margin-right: 0; }
  .header-whatsapp { padding-inline: 10px; font-size: .64rem; }
  .header-whatsapp i { display: none; }
  .brand { gap: 8px; }
  .brand__wordmark small { display: none; }
  .hero h1 { font-size: clamp(2.64rem, 13vw, 3.55rem); }
  .hero__lead { font-size: .84rem; }
  .hero__visual { min-height: 326px; }
  .hero-shot--main { height: 266px; }
  .product-grid { gap: 22px 11px; }
  .product-card__body { min-height: 149px; }
  .product-card h3 { font-size: .8rem; }
  .product-card__price { font-size: .67rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* UX expansion — conversion, discovery, and phone-first product decisions */
.hero__promise { display: grid; gap: 3px; max-width: 480px; margin: 0 0 25px; padding: 11px 14px; border-right: 3px solid var(--red); color: var(--ink-soft); background: rgba(255,253,248,.58); font-size: .71rem; line-height: 1.75; }
.hero__promise strong { color: var(--ink); font-size: .75rem; }
.hero__promise span { color: var(--ink-muted); }
.trust-strip { border-bottom: 1px solid var(--line); background: var(--white); }
.trust-strip__grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.trust-strip__grid > div { display: grid; gap: 2px; min-height: 108px; padding: 22px 22px 19px 0; border-left: 1px solid var(--line); }
.trust-strip__grid > div:first-child { padding-right: 0; }
.trust-strip__grid > div:last-child { border-left: 0; }
.trust-strip__grid span { color: var(--red); font-family: "DM Mono", monospace; font-size: .57rem; }
.trust-strip__grid strong { color: var(--ink); font-size: .78rem; }
.trust-strip__grid small { color: var(--ink-muted); font-size: .6rem; }
.featured-strip { margin-bottom: 46px; padding: 18px; border: 1px solid rgba(24,58,47,.12); border-radius: 18px; background: var(--paper); }
.featured-strip__heading { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-bottom: 16px; }
.featured-strip__heading .section-tag { margin-bottom: 8px; }
.featured-strip__heading h2 { margin: 0; font-size: clamp(1.55rem, 3vw, 2.4rem); line-height: 1; }
.featured-strip__heading > p { max-width: 240px; margin: 0 0 4px; color: var(--ink-muted); font-size: .62rem; line-height: 1.8; }
.featured-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.featured-item { display: grid; grid-template-columns: 54px 1fr 17px; align-items: center; gap: 10px; min-width: 0; padding: 8px; border: 1px solid rgba(24,58,47,.12); border-radius: 12px; background: var(--white); transition: transform .2s var(--ease), border-color .2s var(--ease), box-shadow .2s var(--ease); }
.featured-item:hover { border-color: rgba(201,54,45,.4); box-shadow: 0 7px 16px rgba(24,58,47,.08); transform: translateY(-2px); }
.featured-item__image { width: 54px; height: 54px; overflow: hidden; border-radius: 9px; background: var(--paper-deep); }
.featured-item__image img { width: 100%; height: 100%; object-fit: cover; }
.featured-item__copy { display: grid; min-width: 0; gap: 1px; }
.featured-item__copy small { color: var(--red-deep); font-size: .48rem; }
.featured-item__copy strong { overflow: hidden; color: var(--ink); font-size: .66rem; text-overflow: ellipsis; white-space: nowrap; }
.featured-item__copy em { color: var(--ink-muted); font-family: "DM Mono", monospace; font-size: .53rem; font-style: normal; }
.featured-item > b { color: var(--red); font-family: "DM Mono", monospace; font-size: .8rem; }
.catalog-controls { display: grid; grid-template-columns: minmax(220px, .8fr) 1.4fr; gap: 10px; margin: 16px 0 10px; }
.search-field { position: relative; display: grid; gap: 4px; }
.search-field > span, .filter-controls label { color: var(--ink-muted); font-size: .56rem; }
.search-field input, .filter-controls select { width: 100%; min-height: 42px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: var(--white); font: inherit; font-size: .67rem; outline: none; }
.search-field input { padding: 8px 12px; padding-left: 38px; }
.search-field input:focus, .filter-controls select:focus { border-color: var(--red); box-shadow: 0 0 0 3px rgba(201,54,45,.1); }
.search-field button { position: absolute; bottom: 7px; left: 7px; display: grid; place-items: center; width: 27px; height: 27px; border: 0; border-radius: 50%; color: var(--ink); background: var(--paper); cursor: pointer; }
.filter-controls { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.filter-controls label { display: grid; gap: 4px; }
.filter-controls select { padding: 7px 10px; }
.product-card__chips { position: absolute; top: 9px; right: 9px; left: 9px; display: flex; flex-wrap: wrap; gap: 5px; }
.product-card__chip { padding: 4px 7px; border: 1px solid rgba(24,58,47,.12); border-radius: 999px; color: var(--ink); background: rgba(255,253,248,.93); box-shadow: 0 3px 8px rgba(24,58,47,.07); font-size: .5rem; line-height: 1.2; }
.product-card__chip--featured { color: #795919; background: rgba(215,180,94,.9); }
.product-card__chip--new { color: white; border-color: var(--red); background: var(--red); }
.product-card__chip--hot { color: var(--red-deep); background: rgba(255,239,228,.95); }
.product-card__chip--available { color: var(--ink-soft); background: rgba(232,243,231,.96); }
.product-card__body { min-height: 244px; }
.product-card__description { display: -webkit-box; min-height: 2.8em; margin: -1px 0 0; overflow: hidden; color: var(--ink-muted); font-size: .61rem; line-height: 1.55; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; }
.product-card__spec { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 8px; border: 1px solid rgba(24,58,47,.08); border-radius: 8px; background: var(--paper); }
.product-card__spec span { color: var(--ink-muted); font-size: .52rem; }
.product-card__spec strong { overflow: hidden; color: var(--ink); font-family: "DM Mono", monospace; font-size: .53rem; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.product-card__bottom { display: grid; align-items: stretch; gap: 9px; }
.product-card__price { grid-template-columns: 1fr auto; align-items: end; gap: 2px 8px; }
.product-card__price small { grid-column: 1; font-size: .5rem; }
.product-card__price strong { grid-column: 2; grid-row: 1 / span 2; font-size: .7rem; }
.product-card__actions { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.product-card__order, .product-card__action { display: inline-flex; align-items: center; justify-content: center; min-width: 0; min-height: 39px; padding: 7px 6px; border: 1px solid var(--red); border-radius: 9px; font-size: .58rem; font-weight: 600; white-space: nowrap; }
.product-card__order { color: white; background: var(--red); transition: transform .2s var(--ease), background .2s var(--ease); }
.product-card__order:hover { background: var(--red-deep); transform: translateY(-2px); }
.product-card__order i { margin-right: 4px; font-family: "DM Mono", monospace; font-style: normal; font-size: .75rem; }
.product-card__action { color: var(--ink); border-color: var(--ink); background: transparent; cursor: pointer; transition: transform .2s var(--ease), color .2s var(--ease), background .2s var(--ease); }
.product-card__action:hover { color: white; background: var(--ink); transform: translateY(-2px); }
.product-card__action b { margin-right: 4px; }
.modal-product__gallery { min-width: 0; background: var(--paper-deep); }
.modal-product__gallery .modal-product__image { min-height: 430px; }
.modal-product__image-note { margin: 0; padding: 7px 14px 12px; color: var(--ink-muted); background: var(--paper-deep); font-size: .55rem; text-align: center; }
.modal-product__thumbs { display: flex; gap: 7px; padding: 10px 14px 14px; background: var(--paper-deep); }
.modal-product__thumbs button { width: 48px; height: 48px; padding: 0; overflow: hidden; border: 2px solid transparent; border-radius: 7px; background: var(--white); cursor: pointer; }
.modal-product__thumbs button.is-selected { border-color: var(--red); }
.modal-product__thumbs img { width: 100%; height: 100%; object-fit: cover; }
.modal-product__recommendations { margin-top: 20px; padding-top: 15px; border-top: 1px solid var(--line); }
.modal-product__recommendations-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 9px; }
.modal-product__recommendations-heading span { color: var(--red); font-family: "DM Mono", monospace; font-size: .55rem; }
.modal-product__recommendations-heading strong { font-size: .7rem; }
.modal-product__recommendations-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; }
.modal-product__recommendations-grid button { display: grid; gap: 5px; padding: 5px; border: 1px solid var(--line); border-radius: 8px; color: var(--ink); background: var(--paper); cursor: pointer; text-align: right; }
.modal-product__recommendations-grid button:hover { border-color: var(--red); }
.modal-product__recommendations-grid img { aspect-ratio: 1 / .82; border-radius: 5px; object-fit: cover; }
.modal-product__recommendations-grid span { overflow: hidden; font-size: .53rem; text-overflow: ellipsis; white-space: nowrap; }
.mobile-bottom-nav { display: none; }

@media (max-width: 980px) {
  .catalog-controls { grid-template-columns: 1fr; }
  .featured-strip__heading { align-items: start; }
}
@media (max-width: 650px) {
  html { scroll-padding-bottom: 80px; }
  .hero__promise { margin-bottom: 20px; font-size: .68rem; }
  .trust-strip__grid { grid-template-columns: repeat(2, 1fr); }
  .trust-strip__grid > div, .trust-strip__grid > div:first-child { min-height: 88px; padding: 14px 13px; border-bottom: 1px solid var(--line); }
  .trust-strip__grid > div:nth-child(odd) { border-left: 1px solid var(--line); }
  .trust-strip__grid > div:nth-child(even) { border-left: 0; }
  .trust-strip__grid strong { font-size: .68rem; }
  .trust-strip__grid small { font-size: .53rem; }
  .featured-strip { margin-bottom: 31px; padding: 13px; border-radius: 14px; }
  .featured-strip__heading { display: block; margin-bottom: 13px; }
  .featured-strip__heading h2 { font-size: 1.8rem; }
  .featured-strip__heading > p { max-width: 100%; margin-top: 8px; font-size: .56rem; }
  .featured-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
  .featured-item { grid-template-columns: 43px 1fr 12px; gap: 7px; padding: 6px; }
  .featured-item__image { width: 43px; height: 43px; }
  .featured-item__copy strong { font-size: .56rem; }
  .featured-item__copy em { font-size: .48rem; }
  .catalog-controls { gap: 8px; margin-top: 13px; }
  .filter-controls { grid-template-columns: repeat(3, 1fr); gap: 5px; }
  .filter-controls select { min-height: 40px; padding: 6px 5px; font-size: .57rem; }
  .search-field input { min-height: 44px; font-size: .64rem; }
  .product-card__body { min-height: 285px; padding: 11px 11px 12px; }
  .product-card__description { font-size: .57rem; }
  .product-card__spec { padding: 5px 6px; }
  .product-card__spec span { font-size: .48rem; }
  .product-card__spec strong { font-size: .48rem; }
  .product-card__price small { font-size: .48rem; }
  .product-card__price strong { font-size: .62rem; }
  .product-card__order, .product-card__action { min-height: 42px; font-size: .54rem; }
  .modal-product__gallery .modal-product__image { min-height: 165px; max-height: 208px; }
  .modal-product__thumbs { padding-bottom: 10px; }
  .modal-product__recommendations-grid span { font-size: .5rem; }
  .site-footer { padding-bottom: 75px; }
  .mobile-bottom-nav { position: fixed; right: 10px; bottom: max(10px, env(safe-area-inset-bottom)); left: 10px; z-index: 25; display: grid; grid-template-columns: 1fr 1fr 1fr; min-height: 61px; overflow: hidden; border: 1px solid rgba(24,58,47,.18); border-radius: 15px; background: rgba(255,253,248,.96); box-shadow: 0 10px 26px rgba(24,58,47,.18); backdrop-filter: blur(16px); }
  .mobile-bottom-nav a { display: grid; align-content: center; justify-items: center; gap: 1px; color: var(--ink-soft); border-left: 1px solid var(--line); font-size: .6rem; font-weight: 600; }
  .mobile-bottom-nav a:last-child { border-left: 0; }
  .mobile-bottom-nav small { color: var(--ink-muted); font-size: .47rem; font-weight: 400; }
  .mobile-bottom-nav__cta { color: white !important; background: var(--red); }
  .mobile-bottom-nav__cta small { color: rgba(255,255,255,.72); }
  .floating-whatsapp { bottom: calc(max(10px, env(safe-area-inset-bottom)) + 72px); min-height: 43px; padding-inline: 11px; font-size: .62rem; }
}
@media (max-width: 370px) {
  .product-card__body { min-height: 300px; padding-inline: 9px; }
  .product-card__actions { grid-template-columns: 1fr; }
  .product-card__action { min-height: 36px; }
  .filter-controls { grid-template-columns: 1fr; }
  .filter-controls label { grid-template-columns: 62px 1fr; align-items: center; }
}

@media (max-width: 650px) {
  .hero__grid { gap: 22px; padding-block: 28px 30px; }
  .hero h1 { font-size: clamp(2.52rem, 12.8vw, 3.55rem); }
  .hero__lead { margin: 15px 0; font-size: .78rem; line-height: 1.8; }
  .hero__promise { gap: 1px; margin-bottom: 15px; padding: 8px 10px; font-size: .6rem; line-height: 1.55; }
  .hero__promise strong { font-size: .65rem; }
  .hero__actions .button { min-height: 48px; }
  .hero__facts { margin-top: 19px; padding-top: 11px; }
  .hero__visual { min-height: 270px; }
  .hero-shot--main { height: 226px; }
  .hero-shot--sauce { bottom: 0; }
}

@media (max-width: 650px) {
  .modal-product__checkout { padding-top: 9px; padding-bottom: calc(10px + env(safe-area-inset-bottom)); }
  .checkout-summary__heading, .checkout-summary__line--delivery, .checkout-summary__note { display: none; }
  .checkout-summary__line { min-height: 31px; padding-block: 5px; }
  .checkout-summary__line--price { padding-top: 5px; }
  .button--checkout { min-height: 51px; margin-top: 7px; }
}

.search-field button[hidden] { display: none; }
@media (max-width: 650px) {
  .floating-whatsapp { display: none; }
}

/* Surface polish — controlled radii, denser cards, calmer motion */
:root { --radius-panel: 20px; --radius-control: 11px; --shadow-card: 0 10px 24px rgba(24,58,47,.08); }
.catalog { scroll-margin-top: 104px; }
.featured-strip { border-radius: var(--radius-panel); box-shadow: 0 9px 0 rgba(24,58,47,.035); }
.featured-item { border-radius: 14px; }
.catalog-controls { padding: 12px; border: 1px solid rgba(24,58,47,.1); border-radius: 16px; background: rgba(247,244,238,.72); }
.search-field input, .filter-controls select { border-radius: var(--radius-control); transition: border-color .2s var(--ease), box-shadow .2s var(--ease), background .2s var(--ease); }
.category-filter { border-radius: 16px; box-shadow: inset 0 1px 0 rgba(255,255,255,.75); }
.product-grid { padding-bottom: 18px; }
.product-card { border-radius: var(--radius-panel); box-shadow: 0 5px 0 rgba(24,58,47,.035), 0 11px 22px rgba(24,58,47,.055); isolation: isolate; contain: layout paint style; transition: transform .26s var(--ease), box-shadow .26s var(--ease), border-color .26s var(--ease); animation: card-reveal .34s var(--ease) both; }
.product-card:hover { box-shadow: 0 8px 0 rgba(24,58,47,.045), var(--shadow-card); transform: translateY(-5px); }
.product-card:focus-within { border-color: rgba(201,54,45,.48); box-shadow: 0 0 0 3px rgba(201,54,45,.1), var(--shadow-card); }
.product-card__image { border-bottom: 1px solid rgba(24,58,47,.08); }
.product-card__chips { top: 10px; right: 10px; left: 10px; }
.product-card__chip { backdrop-filter: blur(8px); }
.product-card__body { gap: 8px; padding: 14px; }
.product-card__spec { border-radius: var(--radius-control); }
.product-card__bottom { padding-top: 9px; border-top-color: rgba(24,58,47,.1); }
.product-card__actions { gap: 7px; }
.product-card__order, .product-card__action { border-radius: var(--radius-control); transition: transform .18s var(--ease), background .18s var(--ease), color .18s var(--ease), box-shadow .18s var(--ease); }
.product-card__order { box-shadow: 0 3px 0 rgba(142,43,37,.22); }
.product-card__order:active, .product-card__action:active { transform: translateY(2px); }
.product-card__order:active { box-shadow: 0 1px 0 rgba(142,43,37,.22); }
.modal__panel { border-radius: var(--radius-panel); }
@keyframes card-reveal { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@supports (content-visibility: auto) { .product-card { content-visibility: auto; contain-intrinsic-size: auto 390px; } }

@media (max-width: 650px) {
  .catalog-controls { padding: 9px; border-radius: 14px; }
  .product-grid { gap: 18px 11px; padding-bottom: 96px; }
  .product-card { border-radius: 17px; box-shadow: 0 4px 0 rgba(24,58,47,.035), 0 8px 18px rgba(24,58,47,.06); }
  .product-card__body { min-height: 244px; gap: 6px; padding: 10px; }
  .product-card__description { min-height: 2.55em; line-height: 1.48; }
  .product-card__spec { padding: 4px 6px; border-radius: 9px; }
  .product-card__bottom { gap: 6px; padding-top: 7px; }
  .product-card__actions { gap: 5px; }
  .product-card__order, .product-card__action { min-height: 40px; border-radius: 9px; }
  .mobile-bottom-nav { right: 12px; bottom: max(8px, env(safe-area-inset-bottom)); left: 12px; min-height: 57px; border-radius: 18px; box-shadow: 0 8px 22px rgba(24,58,47,.16); }
}

.product-card__quick-order { display: none; }
@media (max-width: 650px) {
  .product-card__quick-order { position: absolute; bottom: 8px; left: 8px; z-index: 2; display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 7px 9px; border: 1px solid rgba(255,255,255,.58); border-radius: 10px; color: white; background: var(--red); box-shadow: 0 4px 0 rgba(142,43,37,.22); font-size: .54rem; font-weight: 600; transition: transform .18s var(--ease), background .18s var(--ease); }
  .product-card__quick-order:active { transform: translateY(2px); background: var(--red-deep); box-shadow: 0 1px 0 rgba(142,43,37,.22); }
  .product-card__quick-order i { margin-right: 4px; font-family: "DM Mono", monospace; font-size: .7rem; font-style: normal; }
  .product-card__body { min-height: 228px; }
  .product-card__actions { grid-template-columns: 1fr; }
  .product-card__actions .product-card__order { display: none; }
  .product-card__actions .product-card__action { min-height: 44px; font-size: .6rem; }
}

@media (max-width: 650px) { .product-card__quick-order { min-height: 44px; } }

/* Category rows — horizontal discovery with smooth, touch-friendly motion */
.product-grid { display: grid; gap: 42px; }
.product-category-section { min-width: 0; }
.product-category-section--filtered { padding-top: 3px; }
.product-category-heading { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin-bottom: 14px; }
.product-category-heading .section-tag { margin-bottom: 7px; }
.product-category-heading h3 { margin: 0; color: var(--ink); font-size: clamp(1.2rem, 2vw, 1.7rem); line-height: 1.1; }
.product-row-tools { display: flex; align-items: center; gap: 6px; color: var(--ink-muted); font-size: .55rem; white-space: nowrap; }
.product-row-tools button { display: grid; place-items: center; width: 29px; height: 29px; border: 1px solid var(--line); border-radius: 50%; color: var(--ink); background: var(--white); cursor: pointer; font-family: "DM Mono", monospace; font-size: 1rem; line-height: 1; transition: color .18s var(--ease), background .18s var(--ease), border-color .18s var(--ease), transform .18s var(--ease); }
.product-row-tools button:hover { border-color: var(--red); color: white; background: var(--red); transform: translateY(-2px); }
.product-row-tools button:active { transform: translateY(1px); }
.product-row { display: flex; align-items: stretch; gap: 16px; min-width: 0; padding: 5px 4px 17px; overflow-x: auto; overscroll-behavior-inline: contain; scroll-behavior: smooth; scroll-snap-type: inline mandatory; scrollbar-color: rgba(24,58,47,.3) transparent; scrollbar-width: thin; direction: rtl; }
.product-row::-webkit-scrollbar { height: 6px; }
.product-row::-webkit-scrollbar-track { background: transparent; }
.product-row::-webkit-scrollbar-thumb { border-radius: 999px; background: rgba(24,58,47,.25); }
.product-row:focus-visible { outline: 3px solid rgba(201,54,45,.18); outline-offset: 5px; }
.product-row .product-card { flex: 0 0 clamp(220px, 28vw, 270px); scroll-snap-align: start; }
.product-row .product-card:hover { transform: translateY(-4px); }
.product-category-section--filtered .product-row { padding-top: 3px; }

@media (max-width: 980px) {
  .product-grid { gap: 35px; }
  .product-row { gap: 13px; }
  .product-row .product-card { flex-basis: 245px; }
}
@media (max-width: 650px) {
  .product-grid { gap: 31px; }
  .product-category-heading { align-items: center; margin-bottom: 10px; }
  .product-category-heading h3 { font-size: 1.15rem; }
  .product-category-heading .section-tag { margin-bottom: 5px; font-size: .52rem; }
  .product-row-tools { gap: 4px; font-size: .49rem; }
  .product-row-tools button { width: 27px; height: 27px; }
  .product-row { gap: 11px; margin-inline: -4px; padding: 4px 4px 15px; }
  .product-row .product-card { flex-basis: min(280px, 77vw); }
}
@media (max-width: 370px) {
  .product-row .product-card { flex-basis: min(258px, 78vw); }
  .product-row-tools > span { display: none; }
}

.product-grid { grid-template-columns: minmax(0, 1fr); }

.product-row { direction: ltr; scroll-snap-type: x mandatory; }
.product-row .product-card { direction: rtl; }

/* Mobile scrolling — native momentum, gentle snap, and controlled overscroll */
html { scroll-behavior: smooth; }
.product-row { -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; scroll-padding-inline: 8px; scroll-snap-type: x proximity; scroll-snap-stop: normal; }
.product-row .product-card { scroll-snap-align: start; }
@media (max-width: 650px) {
  .product-row { touch-action: pan-x pan-y; will-change: scroll-position; scrollbar-width: none; }
  .product-row::-webkit-scrollbar { display: none; width: 0; height: 0; }
  .product-row .product-card { scroll-snap-stop: normal; }
  .mobile-bottom-nav { -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .product-row { scroll-behavior: auto; scroll-snap-type: none; }
}

.mobile-bottom-nav { backdrop-filter: blur(16px); }

/* Independent category sections — clear rhythm and hierarchy */
.product-grid { gap: 25px; }
.product-category-section { scroll-margin-top: 116px; padding: 21px 18px 7px; border: 1px solid rgba(24,58,47,.12); border-radius: 24px; background: linear-gradient(145deg, rgba(255,253,248,.98), rgba(247,244,238,.88)); box-shadow: 0 7px 0 rgba(24,58,47,.035), 0 14px 26px rgba(24,58,47,.045); }
.product-category-section:nth-child(even) { background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(242,238,229,.78)); }
.product-category-section--pickles { border-top: 3px solid #d7b45e; }
.product-category-section--jams { border-top: 3px solid #b85b70; }
.product-category-section--sauces { border-top: 3px solid var(--red); }
.product-category-section--fermented { border-top: 3px solid var(--ink); }
.product-category-section--pantry { border-top: 3px solid #9b9a62; }
.product-category-heading { align-items: start; padding-bottom: 13px; border-bottom: 1px solid rgba(24,58,47,.1); }
.product-category-heading__copy { min-width: 0; }
.product-category-heading__copy h3 { margin-top: 1px; }
.product-category-heading__copy > p:last-child { max-width: 420px; margin: 7px 0 0; color: var(--ink-muted); font-size: .61rem; line-height: 1.65; }
.product-category-section .product-row { padding-top: 16px; }
.product-category-section--filtered { padding-top: 21px; }
.product-category-section--filtered .product-row { padding-top: 16px; }
@media (max-width: 650px) {
  .product-grid { gap: 19px; }
  .product-category-section { padding: 15px 11px 4px; border-radius: 18px; box-shadow: 0 4px 0 rgba(24,58,47,.03), 0 9px 18px rgba(24,58,47,.045); }
  .product-category-section--pickles, .product-category-section--jams, .product-category-section--sauces, .product-category-section--fermented, .product-category-section--pantry { border-top-width: 2px; }
  .product-category-heading { padding-bottom: 10px; }
  .product-category-heading__copy > p:last-child { max-width: 220px; margin-top: 5px; font-size: .52rem; line-height: 1.5; }
  .product-category-section .product-row, .product-category-section--filtered .product-row { padding-top: 12px; }
}

/* Hero v2 — editorial pantry board */
.hero__content { position: relative; max-width: 560px; padding: clamp(24px, 4vw, 42px); border: 1px solid rgba(24,58,47,.14); border-radius: 26px; background: rgba(255,253,248,.82); box-shadow: 0 8px 0 rgba(24,58,47,.045), 0 18px 35px rgba(24,58,47,.065); backdrop-filter: blur(8px); }
.hero__content::before { position: absolute; top: 0; right: 28px; left: 28px; height: 3px; border-radius: 0 0 8px 8px; content: ""; background: var(--red); }
.hero__topline { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.hero__topline .eyebrow { margin: 0; }
.hero__counter { color: var(--ink-muted); direction: ltr; font-family: "DM Mono", monospace; font-size: .59rem; letter-spacing: .04em; }
.hero__counter b { color: var(--red); font-weight: 500; }
.hero__heading { padding-top: 24px; }
.hero__label { margin: 0 0 7px; color: var(--red-deep); font-family: "DM Mono", monospace; font-size: .58rem; letter-spacing: .06em; }
.hero__content h1 { margin: 0; font-size: clamp(3rem, 5.4vw, 5.4rem); letter-spacing: -.09em; line-height: 1.02; text-wrap: balance; }
.hero__content .hero__lead { max-width: 435px; margin: 21px 0 0; font-size: .86rem; line-height: 1.9; }
.hero__content .hero__promise { max-width: none; margin: 23px 0 21px; padding: 11px 14px; border: 1px solid rgba(201,54,45,.2); border-right: 3px solid var(--red); border-radius: 10px; background: rgba(247,244,238,.72); }
.hero__content .hero__actions { gap: 9px; }
.hero__content .button { min-height: 46px; border-radius: 10px; }
.hero__route { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 22px; padding-top: 14px; border-top: 1px solid var(--line); }
.hero__route span { color: var(--ink-muted); font-size: .56rem; }
.hero__route strong { color: var(--ink-soft); font-size: .6rem; font-weight: 600; }
.hero__route i { margin-inline: 4px; color: var(--red); font-family: "DM Mono", monospace; font-style: normal; }
.hero__content .hero__facts { max-width: none; margin-top: 20px; padding-top: 14px; }
.hero__content .hero__facts div { padding-left: 12px; }
.hero__content .hero__facts dt { font-size: .54rem; }
.hero__content .hero__facts dd { font-size: .65rem; }

/* Shared editorial surfaces for section introductions */
.catalog__intro, .order__lead, .follow__layout { position: relative; padding: 24px; border: 1px solid rgba(24,58,47,.12); border-radius: 20px; background: rgba(247,244,238,.62); box-shadow: 0 5px 0 rgba(24,58,47,.035); }
.catalog__intro::before, .order__lead::before, .follow__layout::before { position: absolute; top: 0; right: 22px; width: 42px; height: 3px; border-radius: 0 0 6px 6px; content: ""; background: var(--red); }
.catalog__intro { max-width: 360px; }
.order__lead { padding: 24px 28px; }
.follow__layout { align-items: center; padding-block: 26px; }
.catalog__intro-note { margin-top: 26px; }
.order__lead { border-bottom: 1px solid rgba(24,58,47,.12); }
.trust-strip__grid > div { transition: background .2s var(--ease), transform .2s var(--ease); }
.trust-strip__grid > div:hover { background: var(--paper); transform: translateY(-2px); }
.product-category-section { transition: transform .24s var(--ease), box-shadow .24s var(--ease), border-color .24s var(--ease); }
.product-category-section:hover { box-shadow: 0 9px 0 rgba(24,58,47,.04), 0 18px 30px rgba(24,58,47,.065); transform: translateY(-2px); }
.delivery__grid { border: 1px solid rgba(24,58,47,.1); }
.delivery__title { position: relative; }
.delivery__title::after { position: absolute; right: clamp(28px, 5vw, 65px); bottom: 28px; width: 42px; height: 3px; border-radius: 4px; content: ""; background: var(--gold); }

@media (max-width: 980px) {
  .hero__content { max-width: 680px; margin-inline: auto; }
  .catalog__intro { max-width: 560px; }
}
@media (max-width: 650px) {
  .hero__grid { gap: 25px; padding-block: 28px 44px; }
  .hero__content { padding: 21px 17px 18px; border-radius: 20px; box-shadow: 0 5px 0 rgba(24,58,47,.04), 0 12px 24px rgba(24,58,47,.055); }
  .hero__content::before { right: 18px; left: 18px; height: 2px; }
  .hero__topline { padding-bottom: 13px; }
  .hero__topline .eyebrow { font-size: .56rem; }
  .hero__counter { font-size: .52rem; }
  .hero__heading { padding-top: 17px; }
  .hero__label { font-size: .53rem; }
  .hero__content h1 { font-size: clamp(2.56rem, 12.8vw, 3.65rem); line-height: 1.04; }
  .hero__content .hero__lead { margin-top: 15px; font-size: .74rem; line-height: 1.8; }
  .hero__content .hero__promise { margin: 16px 0; padding: 9px 10px; font-size: .59rem; line-height: 1.55; }
  .hero__content .hero__promise strong { font-size: .64rem; }
  .hero__content .hero__actions { display: grid; grid-template-columns: 1fr; }
  .hero__content .button { width: 100%; min-height: 47px; font-size: .7rem; }
  .hero__route { align-items: start; display: grid; gap: 4px; margin-top: 16px; padding-top: 11px; }
  .hero__route strong { font-size: .55rem; line-height: 1.7; }
  .hero__content .hero__facts { margin-top: 14px; padding-top: 11px; }
  .hero__content .hero__facts div { padding-left: 7px; }
  .hero__content .hero__facts dt { font-size: .48rem; }
  .hero__content .hero__facts dd { font-size: .59rem; }
  .catalog__intro, .order__lead, .follow__layout { padding: 18px 15px; border-radius: 16px; }
  .catalog__intro::before, .order__lead::before, .follow__layout::before { right: 15px; width: 32px; height: 2px; }
  .catalog__intro { max-width: none; }
  .order__lead { border-bottom: 1px solid rgba(24,58,47,.12); }
  .follow__layout { padding-block: 19px; }
  .delivery__title::after { right: 24px; bottom: 21px; width: 32px; height: 2px; }
  .product-category-section:hover { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .trust-strip__grid > div, .product-category-section { transition: none; }
}


/* ThreeUI Community adaptation: Complete Shelf rows + Animated Top Dock motion.
   Source: https://github.com/MengTo/threeui (MIT). Adapted to YARAWIC colors and RTL. */
:root { --shelf-accent: #c87046; --shelf-shadow: rgba(24,58,47,.11); }
.desktop-nav--dock { position: relative; gap: 4px; padding: 5px; border: 1px solid rgba(24,58,47,.12); border-radius: 999px; background: rgba(255,253,248,.72); box-shadow: inset 2px 3px 12px rgba(255,255,255,.68), 0 5px 16px rgba(24,58,47,.05); backdrop-filter: blur(14px); }
.desktop-nav--dock a { min-height: 36px; padding: 8px 14px; border-radius: 999px; transition: color .24s var(--ease), background .24s var(--ease), transform .24s var(--ease), box-shadow .24s var(--ease); }
.desktop-nav--dock a::after { display: none; }
.desktop-nav--dock a::before { position: absolute; inset: 2px; z-index: -1; border-radius: inherit; content: ""; background: radial-gradient(circle at 50% 0, rgba(200,112,70,.22), transparent 62%); opacity: 0; transform: scale(.7); transition: opacity .3s var(--ease), transform .45s var(--ease); }
.desktop-nav--dock a:hover, .desktop-nav--dock a:focus-visible { color: var(--ink); background: rgba(255,255,255,.86); box-shadow: 0 5px 13px rgba(24,58,47,.09); }
.desktop-nav--dock a:hover::before, .desktop-nav--dock a:focus-visible::before { opacity: 1; transform: scale(1); }
.product-category-section { border-color: color-mix(in srgb, var(--shelf-accent) 22%, var(--line)); background: linear-gradient(145deg, rgba(255,253,248,.98), rgba(247,240,231,.9)); }
.product-category-section::before { display: block; width: 40px; height: 3px; margin-bottom: 13px; border-radius: 0 0 8px 8px; content: ""; background: var(--shelf-accent); }
.product-category-section--pickles::before { background: #d7b45e; }
.product-category-section--jams::before { background: #b85b70; }
.product-category-section--sauces::before { background: var(--red); }
.product-category-section--fermented::before { background: var(--ink); }
.product-category-section--pantry::before { background: #9b9a62; }
.product-category-section .product-row { margin-inline: -4px; border-bottom: 1px solid rgba(200,112,70,.22); }
.product-category-section .product-row .product-card { box-shadow: 0 5px 0 rgba(24,58,47,.045), 0 12px 22px rgba(24,58,47,.06); }
.product-category-section .product-row .product-card:hover { box-shadow: 0 8px 0 rgba(24,58,47,.055), 0 17px 28px var(--shelf-shadow); }
.category-filter { border-color: rgba(200,112,70,.25); box-shadow: inset 2px 3px 12px rgba(255,255,255,.72), 0 5px 15px rgba(24,58,47,.04); }
.category-filter__button.is-active { box-shadow: 0 5px 14px rgba(24,58,47,.15), inset 2px 3px 12px rgba(255,255,255,.08); }
.button--red, .button--green, .header-whatsapp, .mobile-bottom-nav__cta { position: relative; overflow: hidden; isolation: isolate; }
.button--red::before, .button--green::before, .header-whatsapp::before, .mobile-bottom-nav__cta::before { position: absolute; top: -90%; left: 50%; z-index: -1; width: 180%; height: 280%; border-radius: 50%; content: ""; background: conic-gradient(from 180deg, transparent 0 45%, rgba(255,255,255,.18) 50%, transparent 56% 100%); animation: threeui-button-glow 3.6s linear infinite; }
@keyframes threeui-button-glow { to { transform: rotate(360deg); } }
@media (max-width: 980px) { .desktop-nav--dock { display: none; } }
@media (max-width: 650px) {
  .product-category-section::before { width: 30px; height: 2px; margin-bottom: 9px; }
  .product-category-section .product-row { margin-inline: -4px; }
  .mobile-bottom-nav { border-color: rgba(200,112,70,.26); background: rgba(255,253,248,.84); backdrop-filter: blur(18px); }
  .mobile-bottom-nav a { transition: transform .24s var(--ease), color .24s var(--ease), background .24s var(--ease); }
  .mobile-bottom-nav a:active { transform: translateY(2px) scale(.98); }
}
@media (prefers-reduced-motion: reduce) {
  .button--red::before, .button--green::before, .header-whatsapp::before, .mobile-bottom-nav__cta::before { animation: none; }
}