/* A browser storefront, with tenant colors supplied by scoped theme.css. */
:root {
  color-scheme: dark;
  --tenant-background: oklch(18% .012 115);
  --tenant-surface: oklch(23% .012 115);
  --tenant-text: oklch(95% .012 115);
  --tenant-muted: oklch(77% .015 115);
  --tenant-accent: oklch(81% .12 112);
  --tenant-accent-text: oklch(18% .012 115);
  --tenant-accent-foreground: oklch(85% .1 112);
  --tenant-border: color-mix(in oklch, var(--tenant-text) 22%, var(--tenant-background));
  --tenant-radius: 16px;
  --tenant-font: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --tenant-display-font: var(--tenant-font);
  --page-width: 1320px;
  --space: clamp(20px, 4vw, 64px);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 110px; }
body { margin: 0; color: var(--tenant-text); background: var(--tenant-background); font: 16px/1.6 var(--tenant-font); }
[hidden] { display: none !important; }
button, input, select, textarea { font: inherit; }
button, input, select, textarea, summary, a { -webkit-tap-highlight-color: transparent; }
button, a, summary, input, select, textarea { touch-action: manipulation; }
a { color: inherit; text-underline-offset: 4px; }
a:hover { text-decoration-thickness: 2px; }
button { cursor: pointer; }
button:disabled { cursor: wait; opacity: .55; }
:focus-visible { outline: 3px solid var(--tenant-accent); outline-offset: 5px; }
img, video, svg { max-width: 100%; }
img, video { display: block; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { line-height: 1.15; overflow-wrap: anywhere; }
h1 { font: 800 clamp(2.1rem, 4.4vw, 3.6rem)/1.08 var(--tenant-display-font); letter-spacing: -.035em; margin-bottom: 18px; }
h2 { font-size: 1.65rem; letter-spacing: -.025em; }
h3 { font-size: 1.15rem; }
p { max-width: 72ch; }
small, .muted, .eyebrow, .empty-note { color: var(--tenant-muted); }
.eyebrow { font-size: .85rem; font-weight: 650; letter-spacing: .04em; margin-bottom: 12px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; top: 12px; left: 16px; padding: 12px 20px; background: var(--tenant-accent); color: var(--tenant-accent-text); z-index: 50; transform: translateY(-200%); }
.skip-link:focus { transform: none; }
.site-header { position: relative; z-index: 10; background: var(--tenant-background); border-bottom: 1px solid var(--tenant-border); }
.header-inner { max-width: var(--page-width); padding: 18px var(--space); margin: auto; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.brand { display: flex; align-items: center; gap: 14px; text-decoration: none; min-height: 48px; font-weight: 750; line-height: 1.25; }
.brand-logo { display: grid; place-items: center; width: 58px; height: 58px; flex-shrink: 0; }
.brand-logo img { width: 58px; height: 58px; object-fit: contain; }
.brand small, .brand-region { display: block; margin-top: 5px; color: var(--tenant-muted); font-size: .8rem; font-weight: 500; }
.site-nav, .header-nav { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.site-nav a, .header-nav a { display: inline-flex; align-items: center; min-height: 44px; padding: 10px 14px; border-radius: 8px; text-decoration: none; font-size: .94rem; font-weight: 600; }
.site-nav a:hover, .header-nav a:hover { background: color-mix(in oklch, var(--tenant-text) 8%, var(--tenant-background)); }
.site-nav a[aria-current], .header-nav a[aria-current] { color: var(--tenant-accent-foreground); background: var(--tenant-background); }
.region-link { color: var(--tenant-muted); }
main, .main-content { max-width: var(--page-width); margin: auto; padding: 40px var(--space) 80px; min-height: 65vh; }
.page-intro, .catalog-hero { padding: 20px 0 30px; }
.page-intro p, .catalog-hero p { color: var(--tenant-muted); margin-bottom: 0; }
.catalog-hero { display: block; position: relative; isolation: isolate; overflow: hidden; padding: 28px 24px; margin-bottom: 16px; border-radius: var(--tenant-radius); }
.catalog-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background-image: var(--tenant-background-image, none); background-position: center; background-size: cover; opacity: var(--tenant-background-opacity, .14); filter: blur(var(--tenant-background-blur, 0px)); }
.catalog-hero .hero-image, .hero-logo { width: clamp(90px, 12vw, 170px); height: clamp(90px, 12vw, 170px); object-fit: contain; }
.category-nav { display: flex; gap: 8px; overflow-x: auto; padding: 4px 4px 14px; margin: 0 -4px 16px; }
.category-nav a { flex-shrink: 0; min-height: 44px; display: inline-flex; align-items: center; padding: 8px 18px; border: 1px solid var(--tenant-border); border-radius: 99px; text-decoration: none; font-size: .88rem; font-weight: 650; }
.category-nav a[aria-current], .category-nav a:hover { background: var(--tenant-accent); color: var(--tenant-accent-text); border-color: var(--tenant-accent); }
#catalog-filters { display: grid; grid-template-columns: minmax(200px, 2fr) repeat(3, minmax(120px, 1fr)) auto; gap: 14px; align-items: end; padding: 20px 0 28px; }
label, .field { display: block; font-size: .88rem; font-weight: 600; }
label input, label select, label textarea, .field input, .field select { margin-top: 7px; }
input:not([type=checkbox]):not([type=radio]), select, textarea { width: 100%; min-height: 48px; padding: 11px 13px; background: var(--tenant-surface); color: var(--tenant-text); border: 1px solid var(--tenant-border); border-radius: 9px; }
input::placeholder, textarea::placeholder { color: var(--tenant-muted); opacity: .8; }
input[type=search] { appearance: none; }
textarea { resize: vertical; min-height: 140px; }
select { text-overflow: ellipsis; }
button, .button, .btn { display: inline-flex; justify-content: center; align-items: center; gap: 9px; min-height: 44px; padding: 10px 18px; border: 1px solid var(--tenant-border); border-radius: 9px; background: var(--tenant-surface); color: var(--tenant-text); font-weight: 650; text-decoration: none; transition: background-color 160ms ease-out, opacity 160ms ease-out, transform 160ms ease-out; }
button:hover, .button:hover, .btn:hover { background: color-mix(in oklch, var(--tenant-text) 12%, var(--tenant-surface)); }
.primary, .button-primary, button[type=submit] { background: var(--tenant-accent); border-color: var(--tenant-accent); color: var(--tenant-accent-text); }
.primary:hover, .button-primary:hover, button[type=submit]:hover { background: color-mix(in oklch, var(--tenant-accent) 85%, var(--tenant-text)); }
.secondary { background: transparent; }
.catalog-meta { display: flex; justify-content: space-between; align-items: baseline; padding: 6px 0 18px; }
#catalog-count { color: var(--tenant-muted); font-size: .9rem; }
.product-grid, #product-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 24px; }
.product-card { min-width: 0; position: relative; }
.product-media { display: block; position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: var(--tenant-surface); border-radius: var(--tenant-radius); isolation: isolate; }
.product-media img, .product-media video { width: 100%; height: 100%; object-fit: cover; transition: transform 200ms ease-out; }
.product-media:hover img { transform: scale(1.025); }
.product-card h2 { font-size: 1.12rem; line-height: 1.35; margin: 8px 0 10px; }
.product-card h2 a { text-decoration: none; }
.product-card h2 a { display: flex; align-items: center; min-height: 44px; }
.product-card h2 a:hover { text-decoration: underline; }
.product-card .product-category { margin: 17px 0 4px; font-size: .78rem; color: var(--tenant-muted); }
.product-card .product-description { color: var(--tenant-muted); font-size: .88rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.product-card-body, .product-body { padding: 0 2px; }
.product-tags, .tags { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 12px; }
.tag, .farm, .product-tags span, .tags span { display: inline-flex; padding: 3px 9px; font-size: .75rem; line-height: 1.7; font-weight: 650; border: 1px solid var(--tenant-border); border-radius: 5px; }
.farm { color: var(--tenant-muted); }
.product-card-footer, .product-footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 16px; }
.price, .product-price, .offer-price { font-weight: 750; font-size: 1.15rem; letter-spacing: -.025em; }
.price small, .product-price small { font-size: .8rem; font-weight: 500; letter-spacing: 0; }
del { color: var(--tenant-muted); font-size: .9rem; font-weight: 400; margin-right: 7px; }
[data-like] { min-width: 64px; min-height: 44px; padding: 8px 12px; background: transparent; border-radius: 99px; font-size: .85rem; }
[data-like] svg { width: 20px; height: 20px; stroke: currentColor; fill: none; stroke-width: 1.7; }
[data-like][aria-pressed=true] { color: var(--tenant-accent-foreground); border-color: var(--tenant-accent); }
[data-like][aria-pressed=true] svg { fill: currentColor; }
[data-like][aria-pressed=true] svg path { fill: currentColor; }
.media-fallback { display: grid; place-items: center; height: 100%; min-height: 100px; color: var(--tenant-muted); font-size: .85rem; padding: 20px; text-align: center; }
.brand-logo .media-fallback { min-height: 0; font-size: .55rem; padding: 2px; }
.empty-state, #catalog-empty { margin: 32px 0; padding: 50px 24px; text-align: center; background: var(--tenant-surface); border-radius: var(--tenant-radius); }
.empty-state p, #catalog-empty p { margin: 0 auto 24px; color: var(--tenant-muted); }
.breadcrumb, .back-link { display: inline-flex; align-items: center; min-height: 44px; gap: 8px; color: var(--tenant-muted); margin-bottom: 24px; font-size: .9rem; }
.product-detail, .detail-layout { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 70px); align-items: start; }
.product-detail .product-media, .detail-media .product-media { aspect-ratio: 1 / 1; }
.product-detail h1 { font-size: clamp(1.9rem, 3.1vw, 2.8rem); }
.product-detail .product-description, .detail-description { white-space: pre-line; color: var(--tenant-muted); overflow-wrap: anywhere; }
.product-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 16px; }
.gallery-item { margin: 0; background: var(--tenant-surface); overflow: hidden; border-radius: calc(var(--tenant-radius) / 2); }
.gallery-item img, .gallery-item video { width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; }
.gallery-item a { display: block; }
.gallery-item figcaption { padding: 8px 12px; font-size: .75rem; color: var(--tenant-muted); }
.detail-heading, .product-heading { display: flex; gap: 16px; justify-content: space-between; align-items: start; }
.detail-heading [data-like] { flex-shrink: 0; }
.type-field { max-width: 400px; margin: 24px 0; }
#product-type { margin-bottom: 24px; }
.offer, .offer-row { padding: 24px 0; border-top: 1px solid var(--tenant-border); }
.offer h3, .offer-row h3 { margin-bottom: 9px; }
.offer p, .offer-row p { font-size: .9rem; color: var(--tenant-muted); margin-bottom: 12px; }
.offer-heading { display: flex; justify-content: space-between; align-items: start; gap: 18px; }
.offer-price { white-space: nowrap; }
.discount, .discount-label { display: inline-block; padding: 2px 8px; color: var(--tenant-accent-foreground); font-size: .8rem; border: 1px solid var(--tenant-border); border-radius: 4px; margin-bottom: 10px; }
.order-choices { margin: 14px 0 0; }
summary { cursor: pointer; min-height: 44px; padding: 10px 0; font-weight: 650; }
.order-choices summary { padding: 10px 16px; border: 1px solid var(--tenant-border); border-radius: 9px; }
.order-choices[open] summary { margin-bottom: 14px; }
.order-choices a, .contact-link { display: flex; align-items: center; min-height: 48px; gap: 8px; padding: 10px 12px; border-radius: 8px; }
.order-choices a:hover, .contact-link:hover { background: var(--tenant-surface); }
.order-choices [data-copy-order] { margin: 8px 0; }
.order-note { font-size: .85rem; color: var(--tenant-muted); }
.info-layout, .info-grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: 60px; }
.info-section { padding: 28px 0; border-top: 1px solid var(--tenant-border); }
.info-section h2 { margin-bottom: 20px; }
dl { margin: 0; }
dt { font-size: .85rem; color: var(--tenant-muted); margin-top: 18px; }
dd { margin: 4px 0 0; white-space: pre-line; overflow-wrap: anywhere; }
dd ul { margin: 0; padding-left: 20px; }
.contact-list { display: grid; gap: 8px; padding: 0; list-style: none; }
.contact-list a { display: flex; flex-direction: column; justify-content: center; min-height: 64px; padding: 14px 18px; border: 1px solid var(--tenant-border); border-radius: 10px; text-decoration: none; }
.contact-list a:hover { background: var(--tenant-surface); }
.contact-list small { overflow-wrap: anywhere; }
.map-section { margin-top: 38px; }
.map-panel { background: var(--tenant-surface); padding: 24px; border-radius: var(--tenant-radius); }
.reviews-layout { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr); gap: clamp(32px, 6vw, 84px); align-items: start; }
#review-summary { color: var(--tenant-muted); font-size: 1.1rem; }
.review { padding: 28px 0; border-top: 1px solid var(--tenant-border); }
.review-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.review-header h3 { margin: 0; font-size: 1rem; }
.review-rating { font-size: .9rem; font-weight: 750; white-space: nowrap; }
.review-comment { margin: 14px 0 12px; white-space: pre-line; overflow-wrap: anywhere; }
.review time { font-size: .8rem; }
.review-editor, .review-form-panel { background: var(--tenant-surface); padding: 28px; border-radius: var(--tenant-radius); }
#review-form { display: grid; gap: 20px; }
#review-form fieldset { padding: 0; border: 0; margin: 0; }
#review-form legend { font-size: .88rem; font-weight: 650; margin-bottom: 10px; }
.rating-options, .rating-group { display: flex; flex-wrap: wrap; gap: 6px; }
.rating-options label, .rating-group label { display: inline-flex; gap: 7px; min-height: 44px; align-items: center; justify-content: center; border: 1px solid var(--tenant-border); padding: 8px 10px; border-radius: 8px; }
.rating-options label:has(:checked), .rating-group label:has(:checked) { color: var(--tenant-accent-foreground); border-color: var(--tenant-accent); }
input[type=radio], input[type=checkbox] { accent-color: var(--tenant-accent); width: 18px; height: 18px; flex-shrink: 0; margin: 0; }
.checkbox-label, .check-label { display: flex; align-items: center; gap: 12px; min-height: 44px; }
#delete-review { margin-top: 24px; padding-top: 24px; border-top: 1px solid var(--tenant-border); }
#delete-review button { margin-top: 12px; background: transparent; color: var(--tenant-text); }
#site-status { position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%); width: max-content; max-width: min(620px, calc(100% - 32px)); padding: 14px 20px; background: var(--tenant-surface); color: var(--tenant-text); border: 1px solid var(--tenant-border); border-radius: 12px; box-shadow: 0 10px 40px oklch(12% .012 115 / .3); z-index: 30; font-size: .94rem; }
#site-status[data-error=true] { border-color: var(--tenant-text); }
#site-status:empty { display: none; }
.site-footer { max-width: var(--page-width); margin: auto; padding: 28px var(--space) 42px; border-top: 1px solid var(--tenant-border); display: flex; justify-content: space-between; gap: 24px; color: var(--tenant-muted); font-size: .85rem; }
.site-footer a { min-height: 44px; display: inline-flex; align-items: center; }
.error-page, .maintenance-page { max-width: 680px; padding-top: 80px; padding-bottom: 100px; }
.error-page p, .maintenance-page p { color: var(--tenant-muted); }
.root-site, body[data-page=root], body[data-page=selector] { --tenant-accent: oklch(86% .15 111); --tenant-background: oklch(17% .018 116); --tenant-surface: oklch(24% .02 116); --tenant-text: oklch(95% .02 115); --tenant-muted: oklch(77% .025 115); }
.root-header { padding: 24px var(--space); max-width: var(--page-width); margin: auto; display: flex; justify-content: space-between; align-items: center; gap: 24px; }
.wordmark { font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif; font-weight: 900; font-size: 1.7rem; letter-spacing: -.015em; text-decoration: none; }
.root-layout, .selector-layout { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(40px, 7vw, 100px); align-items: center; }
.root-intro h1 { font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif; font-size: clamp(3.3rem, 7vw, 6.3rem); font-weight: 900; letter-spacing: -.025em; text-transform: uppercase; max-width: 9ch; }
.root-intro p { color: var(--tenant-muted); font-size: 1.1rem; max-width: 35ch; }
.region-art { max-width: 340px; opacity: .8; margin: 36px 0 0; }
.region-list { list-style: none; padding: 0; margin: 0; }
.region-list a { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 22px 4px; min-height: 90px; border-bottom: 1px solid var(--tenant-border); text-decoration: none; font-size: clamp(1.4rem, 2.7vw, 2.2rem); font-weight: 750; letter-spacing: -.035em; }
.region-list li:first-child a { border-top: 1px solid var(--tenant-border); }
.region-list a:hover { color: var(--tenant-accent); padding-left: 12px; }
.region-list a span:last-child, .region-list .arrow { font-size: 1.8rem; font-weight: 400; }
.root-note { font-size: .85rem; color: var(--tenant-muted); margin-top: 24px; }
body[data-density=compact] .product-grid { gap: 24px 16px; }
body[data-density=compact] .product-card h2 { font-size: 1rem; }
/* The server templates also remain useful with JavaScript disabled. */
.brand-image { object-fit: contain; width: 58px; height: 58px; }
.region-label { display: block; color: var(--tenant-muted); font-size: .8rem; font-weight: 500; margin-top: 4px; }
.region-switch { display: inline-flex; align-items: center; min-height: 44px; font-size: .84rem; gap: 6px; color: var(--tenant-muted); }
.search-field input, .filter-field select, .form-field input, .form-field textarea, .type-form select { margin-top: 7px; }
.filter-reset { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; font-size: .88rem; }
.product-card-media { position: relative; }
.product-card-media .like-button { position: absolute; right: 12px; top: 12px; background: var(--tenant-background); border-color: var(--tenant-border); }
.product-card-media .like-button:hover { background: var(--tenant-surface); }
.product-photo-link { display: block; }
.card-price { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin-top: 16px; }
.card-price .detail-link { display: inline-flex; align-items: center; min-height: 44px; margin-top: 4px; width: 100%; font-size: .85rem; color: var(--tenant-muted); }
.card-price .discount-label { margin-bottom: 0; }
.media-placeholder { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; min-height: 170px; gap: 12px; color: var(--tenant-muted); }
.media-placeholder span { font-size: 1.6rem; font-weight: 800; }
.product-gallery { display: block; margin-top: 0; }
.product-cover .product-media { aspect-ratio: 1; }
.gallery-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 16px; }
.gallery-item .product-media { aspect-ratio: 1; }
.gallery-item video.media-content { object-fit: contain; }
.type-form { margin-top: 24px; }
.type-form select { margin-bottom: 12px; }
.type-form button { margin-bottom: 24px; }
.page-heading { padding: 18px 0 32px; }
.page-heading p:last-child { color: var(--tenant-muted); }
.review-item { padding: 28px 0; border-top: 1px solid var(--tenant-border); }
.review-heading { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.review-item time { color: var(--tenant-muted); font-size: .8rem; }
.checkbox-field { display: flex; align-items: center; gap: 12px; min-height: 44px; }
.review-ownership-note, .product-contact-note { font-size: .85rem; color: var(--tenant-muted); }
.root-main { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(40px, 7vw, 100px); align-items: center; padding-top: 80px; padding-bottom: 90px; }
.root-brand { display: inline-flex; align-items: center; min-height: 44px; font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif; font-weight: 900; font-size: 1.8rem; text-decoration: none; }
.root-header-note { color: var(--tenant-muted); font-size: .85rem; }
.region-number { color: var(--tenant-muted); font-size: .8rem !important; font-weight: 500; letter-spacing: 0; }
.region-name { flex: 1; }
.region-list .region-action { color: var(--tenant-muted); font-size: .85rem; font-weight: 500; letter-spacing: 0; }
.region-list a:first-child { border-top: 1px solid var(--tenant-border); }
.root-footer { max-width: var(--page-width); margin: auto; padding: 28px var(--space); border-top: 1px solid var(--tenant-border); display: flex; justify-content: space-between; gap: 20px; color: var(--tenant-muted); font-size: .85rem; }
@media (min-width: 1500px) { .product-grid, #product-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 1000px) {
  #catalog-filters { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #catalog-filters .search-field { grid-column: 1 / -1; }
  .product-grid, #product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .header-inner { flex-wrap: wrap; }
  .info-layout, .info-grid { gap: 32px; }
  .reviews-layout { gap: 32px; }
}
@media (max-width: 700px) {
  :root { --space: 20px; }
  .header-inner { padding-top: 14px; padding-bottom: 12px; gap: 12px; }
  .brand-logo, .brand-logo img { width: 44px; height: 44px; }
  .brand-image { width: 44px; height: 44px; }
  .brand { font-size: .95rem; gap: 10px; }
  .site-nav, .header-nav { width: 100%; justify-content: space-between; gap: 0; }
  .site-nav a, .header-nav a { padding: 10px; font-size: .83rem; }
  main, .main-content { padding-top: 24px; padding-bottom: 54px; }
  .catalog-hero { padding-top: 8px; grid-template-columns: 1fr; }
  .catalog-hero .hero-image, .hero-logo { display: none; }
  #catalog-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  #catalog-filters .search-field { grid-column: 1 / -1; }
  #catalog-filters select { font-size: .88rem; }
  .product-grid, #product-grid { gap: 28px 14px; }
  .product-media { aspect-ratio: 1; border-radius: min(var(--tenant-radius), 14px); }
  .product-card h2 { font-size: .97rem; }
  .product-card .product-description { font-size: .8rem; }
  .product-card .product-category { font-size: .68rem; margin-top: 12px; }
  .product-card-footer, .product-footer { flex-wrap: wrap; gap: 6px; }
  .price, .product-price { font-size: .98rem; }
  .product-tags, .tags { gap: 4px; }
  .tag, .farm, .product-tags span, .tags span { font-size: .68rem; padding: 2px 6px; }
  [data-like] { padding: 8px 10px; min-width: 58px; }
  .product-detail, .detail-layout, .info-layout, .info-grid, .reviews-layout, .root-layout, .selector-layout { grid-template-columns: 1fr; gap: 32px; }
  .root-main { grid-template-columns: 1fr; gap: 32px; padding-top: 30px; padding-bottom: 60px; }
  .header-inner { display: grid; grid-template-columns: minmax(0, 1fr) auto; }
  .region-switch { font-size: .74rem; }
  .site-nav { grid-column: 1 / -1; }
  .offer-heading { flex-wrap: wrap; gap: 8px; }
  .review-editor, .review-form-panel { padding: 22px; }
  .site-footer { flex-direction: column; gap: 8px; }
  .site-footer p { margin-bottom: 0; }
  .root-header { padding-top: 20px; padding-bottom: 16px; }
  .root-intro h1 { font-size: 3.6rem; max-width: 12ch; }
  .region-art { max-width: 170px; margin-top: 20px; }
  .region-list a { min-height: 76px; padding-top: 18px; padding-bottom: 18px; }
}
@media (max-width: 350px) {
  :root { --space: 14px; }
  .product-grid, #product-grid { grid-template-columns: 1fr; }
  .site-nav a, .header-nav a { padding: 10px 6px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}
body[data-motion=false] *, body[data-motion=false] *::before, body[data-motion=false] *::after { transition: none !important; animation: none !important; }


/* The regional website follows the configured Mini App appearance. */
.leaf-rain {
    position: fixed;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;
}
.leaf-rain .leaf {
    position: absolute;
    top: -10vh;
    will-change: transform, opacity;
    animation-name: leafFall;
    /* Slight ease so leaves aren't falling on perfect rails — real leaves
       decelerate and accelerate as air currents shift. */
    animation-timing-function: cubic-bezier(0.42, 0.1, 0.58, 0.92);
    animation-iteration-count: infinite;
    /* Subtle drop-shadow only — per-leaf blur is applied by JS for parallax
       depth-of-field (smaller/farther leaves look softer). */
    /* drop-shadow removed: will-change:transform + filter creates rectangular composite shadow */
}
/* S-shaped side-to-side drift with multiple waypoints for a natural flutter. */
@keyframes leafFall {
    0%   { transform: translate3d(0,                                           -10vh, 0)
                      rotate(0deg); }
    20%  { transform: translate3d(calc(var(--drift, 0px) *  0.55),              15vh, 0)
                      rotate(calc(var(--spin, 180deg) * 0.18)); }
    40%  { transform: translate3d(calc(var(--drift, 0px) * -0.35),              40vh, 0)
                      rotate(calc(var(--spin, 180deg) * 0.42)); }
    60%  { transform: translate3d(calc(var(--drift, 0px) *  0.7),               65vh, 0)
                      rotate(calc(var(--spin, 180deg) * 0.62)); }
    80%  { transform: translate3d(calc(var(--drift, 0px) * -0.15),              90vh, 0)
                      rotate(calc(var(--spin, 180deg) * 0.82)); }
    100% { transform: translate3d(var(--drift, 0px),                           115vh, 0)
                      rotate(var(--spin, 180deg)); }
}
.leaf-rain .leaf-flight-ltr { animation-name: leafFlyLtr; }
.leaf-rain .leaf-flight-rtl {
    animation-name: leafFlyRtl;
}
.leaf-rain .leaf-flight-flipped { --flight-facing: -1; }
/* Horizontal flight gets explicit paths in both directions. Mirroring lives
   at the end of each transform list, so it flips only the artwork's heading
   and never the translated coordinate system. The uneven bob waypoints,
   slight pitch changes, and per-pass altitude drift mimic powered flight
   without making the aircraft float like leaves. */
@keyframes leafFlyLtr {
    0%   { transform: translate3d(var(--flight-start), 0, 0)
                      rotate(0deg) scaleX(var(--flight-facing)); }
    14%  { transform: translate3d(14vw, calc(var(--bob-soft-neg) + var(--lane-drift-quarter)), 0)
                      rotate(var(--tilt-neg)) scaleX(var(--flight-facing)); }
    29%  { transform: translate3d(29vw, calc(var(--bob-soft) + var(--lane-drift-quarter)), 0)
                      rotate(var(--tilt)) scaleX(var(--flight-facing)); }
    43%  { transform: translate3d(43vw, calc(var(--bob-neg) + var(--lane-drift-half)), 0)
                      rotate(var(--tilt-neg)) scaleX(var(--flight-facing)); }
    57%  { transform: translate3d(57vw, calc(var(--bob-soft) + var(--lane-drift-half)), 0)
                      rotate(var(--tilt)) scaleX(var(--flight-facing)); }
    71%  { transform: translate3d(71vw, calc(var(--bob) + var(--lane-drift-three-quarter)), 0)
                      rotate(var(--tilt)) scaleX(var(--flight-facing)); }
    86%  { transform: translate3d(86vw, calc(var(--bob-soft-neg) + var(--lane-drift-three-quarter)), 0)
                      rotate(var(--tilt-neg)) scaleX(var(--flight-facing)); }
    100% { transform: translate3d(var(--flight-end), var(--lane-drift), 0)
                      rotate(0deg) scaleX(var(--flight-facing)); }
}
@keyframes leafFlyRtl {
    0%   { transform: translate3d(var(--flight-end), 0, 0)
                      rotate(0deg) scaleX(var(--flight-facing)); }
    14%  { transform: translate3d(86vw, calc(var(--bob-soft-neg) + var(--lane-drift-quarter)), 0)
                      rotate(var(--tilt)) scaleX(var(--flight-facing)); }
    29%  { transform: translate3d(71vw, calc(var(--bob-soft) + var(--lane-drift-quarter)), 0)
                      rotate(var(--tilt-neg)) scaleX(var(--flight-facing)); }
    43%  { transform: translate3d(57vw, calc(var(--bob-neg) + var(--lane-drift-half)), 0)
                      rotate(var(--tilt)) scaleX(var(--flight-facing)); }
    57%  { transform: translate3d(43vw, calc(var(--bob-soft) + var(--lane-drift-half)), 0)
                      rotate(var(--tilt-neg)) scaleX(var(--flight-facing)); }
    71%  { transform: translate3d(29vw, calc(var(--bob) + var(--lane-drift-three-quarter)), 0)
                      rotate(var(--tilt-neg)) scaleX(var(--flight-facing)); }
    86%  { transform: translate3d(14vw, calc(var(--bob-soft-neg) + var(--lane-drift-three-quarter)), 0)
                      rotate(var(--tilt)) scaleX(var(--flight-facing)); }
    100% { transform: translate3d(var(--flight-start), var(--lane-drift), 0)
                      rotate(0deg) scaleX(var(--flight-facing)); }
}

.leaf-rain { z-index: 1; }
.leaf-rain[data-paused=true] .leaf { animation-play-state: paused; }
body[data-region] { isolation: isolate; overflow-x: clip; }
.website-background { position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background: var(--tenant-background-image, none) center center / cover no-repeat;
  opacity: var(--tenant-background-opacity, .35); filter: blur(var(--tenant-background-blur, 0px)); }
body[data-region] .site-main, body[data-region] .site-footer { position: relative; z-index: 2; }
body[data-region] h1, body[data-region] h2, body[data-region] h3,
body[data-region] .brand-text, body[data-region] .price {
  font-family: var(--tenant-display-font); font-weight: 700; letter-spacing: .025em;
}
body[data-region] h1 { line-height: 1.15; }
body[data-region] .brand-text { font-size: 1.4rem; }
body[data-region] .region-label { font: 500 .8rem/1.3 var(--tenant-font); letter-spacing: 0; }
body[data-region] .site-header, body[data-region] .site-nav, body[data-region] .product-card,
body[data-region] .offer, body[data-region] .offer-row, body[data-region] .contact-list a, body[data-region] .review-editor,
body[data-region] .review-item, body[data-region] .review, body[data-region] .info-section, body[data-region] .map-section,
body[data-region] .catalog-filters, body[data-region] .empty-state {
  background: var(--glass-bg); border: 1px solid var(--glass-border);
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(165%);
  backdrop-filter: blur(var(--glass-blur)) saturate(165%);
  box-shadow: inset 0 1.5px 0 var(--glass-hi), inset 0 0 0 1px rgba(255,255,255,.04),
    inset 0 -14px 26px -14px var(--glass-occ), var(--elev-2);
  border-radius: var(--r-lg, 22px);
}
body[data-region] .site-header { width: min(var(--page-width), calc(100% - 32px)); margin: 16px auto 0; position: relative; z-index: 20; }
body[data-region] .header-inner { padding: 12px 20px; }
body[data-region] .site-nav { position: fixed; z-index: 40; left: 50%; bottom: calc(12px + env(safe-area-inset-bottom));
  transform: translateX(-50%); width: min(430px, calc(100% - 24px)); display: flex; flex-wrap: nowrap;
  gap: 6px; padding: 8px; border-radius: var(--r-xl, 28px); box-shadow: inset 0 1.5px 0 var(--glass-hi), var(--elev-3); }
body[data-region] .site-nav a { flex: 1; display: flex; flex-direction: column; justify-content: center; gap: 4px;
  min-height: 58px; border-radius: var(--r-md, 16px); padding: 6px 10px; font-size: .78rem; }
body[data-region] .site-nav svg { fill: none; stroke: currentColor; stroke-width: 2px; stroke-linecap: round; stroke-linejoin: round; }
body[data-region] .site-nav a[aria-current] { background: linear-gradient(90deg,var(--tenant-fade-1),var(--tenant-fade-2),var(--tenant-fade-3),var(--tenant-fade-4));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22); color: var(--tenant-cta-ink); }
body[data-region] .site-nav a[aria-current] svg { filter: drop-shadow(0 0 8px rgba(var(--tenant-accent-rgb),.45)); }
body[data-region] .site-header::after, body[data-region] .site-nav::after, body[data-region] .offer::after, body[data-region] .offer-row::after,
body[data-region] .contact-list a::after { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background: linear-gradient(115deg,transparent 30%,rgba(255,255,255,.16) 47%,rgba(255,255,255,.03) 53%,transparent 67%);
  mix-blend-mode: screen; opacity: .7; }
body[data-region] .site-header > *, body[data-region] .site-nav > * { position: relative; z-index: 1; }
body[data-region] .site-main { padding-top: 28px; padding-bottom: 50px; }
body[data-region] .site-footer { padding-bottom: 130px; border-color: var(--glass-border); }
body[data-region] #site-status { bottom: calc(108px + env(safe-area-inset-bottom)); z-index: 50; }
body[data-region] .catalog-hero { display: flex; align-items: center; justify-content: flex-start; gap: 26px; padding: 18px 8px 30px; }
body[data-region] .catalog-hero > div { min-width: 0; flex: 1; overflow-wrap: anywhere; }
body[data-region] .catalog-hero::before { display: none; }
body[data-region] .hero-logo { display: block; flex: 0 0 auto; width: 150px; height: 150px; object-fit: contain; }
body[data-region] .catalog-hero h1 { font-size: clamp(2.2rem, 4vw, 3.6rem); margin-bottom: 10px; }
body[data-region] .catalog-hero p { text-shadow: 0 1px 3px var(--tenant-ink-shadow); }
body[data-region] .category-nav a { background: var(--glass-bg); border-color: var(--glass-border);
  box-shadow: inset 0 1px 0 var(--glass-hi), var(--elev-1); }
body[data-region] .category-nav a[aria-current], body[data-region] button[type=submit],
body[data-region] .button-primary { background: linear-gradient(90deg,var(--tenant-fade-1),var(--tenant-fade-2),var(--tenant-fade-3),var(--tenant-fade-4));
  border: 0; color: var(--tenant-cta-ink); box-shadow: inset 0 1.5px 0 rgba(255,255,255,.7),
    inset 0 -9px 16px -8px rgba(0,0,0,.4), 0 12px 26px -10px rgba(var(--tenant-accent-rgb),.45); }
body[data-region] .price { font-size: 1.7rem; font-variant-numeric: tabular-nums;
  background-image: linear-gradient(90deg,var(--tenant-fade-1),var(--tenant-fade-2),var(--tenant-fade-3),var(--tenant-fade-4));
  -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 1px 1px rgba(0,0,0,.5)); }
body[data-region] .brand-text { background-image: linear-gradient(135deg,var(--tenant-fade-1),var(--tenant-fade-2),var(--tenant-fade-3),var(--tenant-fade-4));
  -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 1px 1px rgba(0,0,0,.5)); }
body[data-region] .region-label { color: var(--tenant-muted); -webkit-text-fill-color: var(--tenant-muted); }
body[data-region] #catalog-filters { padding: 20px; margin-bottom: 24px; }
body[data-region] input:not([type=checkbox]):not([type=radio]), body[data-region] select,
body[data-region] textarea { background: color-mix(in srgb,var(--tenant-surface) 82%,transparent); border-color: var(--glass-border);
  border-radius: var(--r-sm,12px); box-shadow: inset 0 2px 5px rgba(0,0,0,.2); }
body[data-region] .product-grid { gap: 22px; }
body[data-region] .product-card { overflow: hidden; padding: 14px; }
body[data-region] .product-media { border-radius: var(--r-md,16px); }
body[data-region] .product-card h2 { font-size: 1.55rem; line-height: 1.25; }
body[data-region] .product-card-body { padding: 2px 3px 0; }
body[data-region] .product-card-media .like-button { background: color-mix(in srgb,var(--tenant-surface) 70%,transparent);
  border-color: var(--glass-border); -webkit-backdrop-filter: blur(var(--glass-blur)); backdrop-filter: blur(var(--glass-blur)); }
body[data-region] .detail-link { justify-content: center; padding: 9px 14px; border-radius: var(--r-sm,12px);
  background: var(--glass-bg); border: 1px solid var(--glass-border); text-decoration: none; }
body[data-region] .tag, body[data-region] .product-tag { background: rgba(var(--tenant-tag-rgb),.14); border-color: rgba(var(--tenant-tag-rgb),.35); color: var(--tenant-text); border-radius: var(--r-xs,10px); }
body[data-region] .farm, body[data-region] .farm-label { background: rgba(var(--tenant-farm-rgb),.14); border-color: rgba(var(--tenant-farm-rgb),.35); border-radius: var(--r-xs,10px); }
body[data-region] .offer, body[data-region] .offer-row { position: relative; padding: 20px; margin-bottom: 16px; }
body[data-region] .offer h3, body[data-region] .offer-row h3 { font-size: 1.65rem; }
body[data-region] .contact-list a { position: relative; overflow: hidden; }
body[data-region] .order-choices { position: relative; z-index: 1; }
body[data-region] .order-choices summary { background: var(--glass-bg); border-color: var(--glass-border); border-radius: var(--r-sm,12px); }
body[data-region] .info-section { padding: 24px; margin-bottom: 20px; }
body[data-region] .review-item, body[data-region] .review { padding: 24px; margin-bottom: 18px; }
body[data-region] .review-heading h3, body[data-region] .review-header h3 { font-family: var(--tenant-font); font-size: 1rem; letter-spacing: 0; }
body[data-region] .review-editor { padding: 26px; }
body[data-region] .map-section { padding: 24px; }
body[data-region][data-density=compact] .product-card { padding: 12px; }
body[data-region][data-density=spacious] .product-card { padding: 22px; }
body[data-region] button, body[data-region] .button { border-radius: var(--r-sm,12px); }
body[data-region] button:active, body[data-region] .button:active { transform: translateY(1px) scale(.98); }
@media (max-width: 700px) {
  body[data-region] { --space: 16px; }
  body[data-region] .site-header { margin-top: 12px; width: calc(100% - 24px); }
  body[data-region] .header-inner { display: flex; flex-wrap: nowrap; padding: 12px 14px; gap: 10px; }
  body[data-region] .brand { min-width: 0; }
  body[data-region] .brand-text { font-size: 1.1rem; }
  body[data-region] .region-switch { flex-shrink: 0; font-size: .65rem; }
  body[data-region] .catalog-hero { align-items: center; gap: 15px; padding: 14px 0 24px; }
  body[data-region] .hero-logo { width: 90px; height: 90px; }
  body[data-region] .catalog-hero h1 { font-size: 2rem; }
  body[data-region] .hero-subtitle { font-size: .85rem; }
  body[data-region] .eyebrow { font-size: .72rem; margin-bottom: 8px; }
  body[data-region] #catalog-filters { padding: 16px; }
  body[data-region] .product-grid { gap: 14px; }
  body[data-region] .product-card { padding: 10px; }
  body[data-region] .product-card h2 { font-size: 1.12rem; }
  body[data-region] .product-card .price { font-size: 1.22rem; }
  body[data-region] .product-card [data-like] { min-width: 44px; padding: 7px; gap: 4px; }
  body[data-region] .product-card-media .like-button { right: 5px; top: 5px; }
  body[data-region] .product-tags span { padding: 3px 5px; }
  body[data-region] .site-footer { padding-bottom: 115px; }
}
@media (prefers-reduced-motion: reduce) { .leaf-rain { display: none !important; } }
body[data-motion=false] .leaf-rain { display: none !important; }