/* SOREVIA_HOME_USABILITY_V1
 * Readability and component tokens for the audited home view only.
 * Other routes retain their existing styles, images and behaviour.
 */
body:has(#storefront) {
  --home-text-xs: .75rem;
  --home-text-sm: .875rem;
  --home-text-base: 1rem;
  --home-text-card: 1.25rem;
  --home-text-lg: 1.5rem;
  --home-text-xl: 2rem;
  --home-text-2xl: 3rem;
  --home-text-display: 4rem;
  --home-ink: #191a17;
  --home-muted: #625d55;
  --home-paper: #f4f0ea;
  --home-inverse-muted: #c2c1b5;
  --home-accent: #3e4936;
  --home-line: #c8c1b5;
  --home-radius-sm: .25rem;
  --home-radius-control: .5rem;
  --home-radius-card: .75rem;
  --home-radius-pill: 9999px;
}

/* 1–3: one type scale, semantic text colours and four corner treatments. */
#storefront { --ink:var(--home-ink); --muted:var(--home-muted); font-size:var(--home-text-base); color:var(--home-ink); }
#storefront :is(.store-kicker,.store-float-edition strong,.store-float-edition span,.store-hero-caption,.store-category-count,.store-season-label span,.store-season-label small,.store-product-badge,.store-catalog-note) { font-size:var(--home-text-xs); line-height:1.5; }
#storefront :is(.store-float-shop h1,.store-category-top p,.store-category-body p,.store-season-copy p,.store-benefit p,.store-product-type,.store-product-meta,.store-about p,.store-empty) { font-size:var(--home-text-sm); line-height:1.6; }
#storefront .store-category-body h3 { font-size:var(--home-text-lg); line-height:1.25; }
#storefront .store-product-info h3 { font-size:var(--home-text-card); line-height:1.3; min-height:0; }
#storefront .store-product-price { font-size:var(--home-text-base); color:var(--home-ink); }
#storefront .store-product-price.upcoming { font-size:var(--home-text-xs); color:var(--home-muted); }
#storefront .store-heading { font-size:var(--home-text-2xl); line-height:1.15; }
#storefront #season-title { font-size:var(--home-text-display); text-transform:none; max-width:none; }
#storefront .store-about .store-heading { font-size:var(--home-text-xl); }
#storefront :is(.store-kicker,.store-float-edition span,.store-hero-caption,.store-season-copy p,.store-season-label small,.store-benefit p,.store-product-type,.store-product-meta,.store-catalog-note,.store-about p,.store-empty) { color:var(--home-muted); }
#storefront .store-categories { color:var(--home-paper); }
#storefront .store-categories :is(.store-kicker,.store-category-top p,.store-category-body p) { color:var(--home-inverse-muted); }
#storefront :is(.store-category-count,.store-season-label span) { color:var(--home-ink); }
#storefront .store-category-count { background:var(--home-paper); }
#storefront .store-season-label { background:var(--home-paper); flex-wrap:wrap; }
#storefront :is(.store-category-card,.store-product-card,.store-float-card,.store-season-art,.store-empty) { border-radius:var(--home-radius-card); }
#storefront :is(.store-category-image,.store-product-media,.store-season-label,.store-benefit>svg) { border-radius:var(--home-radius-control); }
#storefront :is(.store-category-count,.store-product-badge) { border-radius:var(--home-radius-sm); }
#storefront .store-benefit>svg { color:var(--home-muted); }

/* 4: shared action controls; composite cards and image buttons keep their layout. */
#storefront :is(.store-btn,.store-card-action) {
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  min-height:44px; max-width:100%; padding:.625rem 1rem;
  font-size:var(--home-text-sm); font-weight:600; line-height:1.5;
  letter-spacing:.02em; text-transform:none; white-space:normal; text-align:center;
  border:1px solid var(--home-ink); border-radius:var(--home-radius-control);
  color:var(--home-paper); background:var(--home-ink); box-shadow:none;
}
#storefront :is(.store-btn,.store-card-action):hover { background:var(--home-accent); border-color:var(--home-accent); color:var(--home-paper); box-shadow:none; }
#storefront :is(.store-btn.outline,.store-card-action.preview) { background:transparent; color:var(--home-ink); border-color:var(--home-muted); }
#storefront :is(.store-btn.outline,.store-card-action.preview):hover { background:var(--home-paper); color:var(--home-ink); }
#storefront .store-btn.light { background:var(--home-paper); border-color:var(--home-paper); color:var(--home-ink); }
#storefront .store-link { font-size:var(--home-text-sm); min-height:44px; line-height:1.5; padding:.5rem 0; gap:.5rem; letter-spacing:.02em; text-transform:none; white-space:normal; color:var(--home-ink); }
#storefront .store-link:hover { opacity:1; text-decoration:underline; }
#storefront .store-filter { font-size:var(--home-text-sm); line-height:1.5; min-height:44px; padding:.625rem .875rem; border-radius:var(--home-radius-pill); border-color:var(--home-muted); background:transparent; color:var(--home-muted); }
#storefront .store-filter:hover { color:var(--home-ink); border-color:var(--home-ink); }
#storefront .store-filter[aria-pressed="true"] { background:var(--home-ink); color:var(--home-paper); border-color:var(--home-ink); }
#storefront .store-save { width:44px; height:44px; top:.5rem; right:.5rem; border-radius:var(--home-radius-pill); background:var(--home-paper); color:var(--home-ink); }
#storefront .store-save svg { width:18px; height:18px; }
#storefront .store-save[aria-pressed="true"] svg { color:var(--home-ink); fill:currentColor; }
#storefront :is(button,a):focus-visible,
body:has(#storefront) :is(.sv-header,.site-footer) :is(button,a,input):focus-visible {
  outline:2px solid var(--home-ink); outline-offset:3px;
  box-shadow:0 0 0 5px var(--home-paper);
}
#storefront .store-product-open:focus-visible { outline-offset:-4px; }

/* 5: readable announcement with wrapping instead of clipping. */
body#screen-shield:has(#storefront) > header {
  font-size:var(--home-text-sm); line-height:1.5; letter-spacing:.06em;
  color:var(--home-paper); flex-wrap:wrap; gap:.5rem 1rem;
}
body#screen-shield:has(#storefront) > header > .text-center { min-width:0; overflow:visible; white-space:normal; }

/* 6–8: sentence case and a caption that participates in layout at any text size. */
#storefront .store-float-shop h1 { text-transform:none; letter-spacing:.02em; }
#storefront .store-float-edition span { text-transform:none; letter-spacing:.04em; }
#storefront .store-hero {
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  align-content:end; align-items:end; gap:1rem;
  height:auto; min-height:clamp(510px,51vw,730px);
  padding:clamp(20rem,30vw,34rem) max(1rem,6%) 1rem;
}
#storefront .store-float-card { position:relative; inset:auto; min-width:0; max-width:100%; overflow-wrap:anywhere; }
#storefront .store-float-shop { justify-self:start; }
#storefront .store-float-edition { justify-self:end; }
#storefront .store-hero-caption { position:static; transform:none; grid-column:1/-1; width:100%; white-space:normal; text-transform:none; letter-spacing:.04em; text-align:center; }

/* 9–11: the category heading and descriptions share readable roles. */
#storefront #category-label { font-size:var(--home-text-base); line-height:1.5; letter-spacing:.04em; text-transform:none; }
#storefront .store-category-top { flex-wrap:wrap; }
#storefront .store-category-top p { letter-spacing:normal; }
#storefront .store-category-body .store-category-action {
  /* Two legacy mobile rules use !important. Scope this exception to this view. */
  font-size:var(--home-text-sm)!important;
  line-height:1.5; letter-spacing:.02em; text-transform:none; gap:.75rem;
}
#storefront .store-category-action b { font-size:var(--home-text-card); flex-shrink:0; }

/* 12–16: headings remain semantic; all product categories use the same rule. */
#storefront .store-benefit strong { font-size:var(--home-text-xs); line-height:1.5; letter-spacing:.03em; }
#storefront .store-benefit > div { min-width:0; }
#storefront .store-benefit-grid { grid-template-columns:repeat(auto-fit,minmax(min(100%,10rem),1fr)); }
#storefront .store-product-type { text-transform:none; letter-spacing:.02em; }
#storefront .store-product-meta { min-height:0; white-space:normal; }
#storefront :is(.store-product-type,.store-product-meta,.store-product-info h3,.store-benefit p,.store-benefit strong) { overflow-wrap:anywhere; }
#storefront .store-section-head { flex-wrap:wrap; align-items:end; }
#storefront .store-section-head > div { min-width:0; }
#storefront .store-product-grid {
  --home-card-gap:1.25rem; gap:var(--home-card-gap);
  grid-template-columns:repeat(auto-fit,minmax(min(100%,max(12rem,calc((100% - 3 * var(--home-card-gap))/4))),1fr));
}
#storefront .store-product-card { display:flex; flex-direction:column; }
#storefront .store-product-media { flex-shrink:0; }
#storefront .store-product-info { flex:1; display:flex; flex-direction:column; }
#storefront .store-product-bottom { margin-top:auto; flex-wrap:wrap; gap:.75rem; }
#storefront .store-product-badge { top:auto; bottom:.5rem; left:.5rem; max-width:calc(100% - 1rem); letter-spacing:.02em; text-transform:none; background:var(--home-paper); color:var(--home-ink); }
#storefront .store-product-badge.available { background:var(--home-ink); color:var(--home-paper); }

/* Include the homepage header/footer in the shared scale, without changing other routes. */
body:has(#storefront) .sv-header { color:var(--home-ink); }
body:has(#storefront) .sv-header .sv-header-brand { font-size:var(--home-text-xl); }
body:has(#storefront) .sv-menu-trigger span { font-size:var(--home-text-xs); }
body:has(#storefront) .sv-header .sv-menu-links a { font-size:var(--home-text-base); }
body:has(#storefront) .sv-header .sv-header-badge { font-size:var(--home-text-xs); line-height:1.5; height:auto; min-width:18px; background:var(--home-ink); color:var(--home-paper); }
body:has(#storefront) .site-footer { font-size:var(--home-text-sm); color:var(--home-paper); }
body:has(#storefront) .site-footer h3 { font-size:var(--home-text-xl); }
body:has(#storefront) .site-footer h4 { font-size:var(--home-text-sm); color:var(--home-paper); }
body:has(#storefront) .site-footer :is(p,li,a,label) { color:var(--home-inverse-muted); }
body:has(#storefront) .site-footer a:hover { color:var(--home-paper); }
body:has(#storefront) .site-footer :is(.sv-footer-bottom,.sv-footer-bottom p,.sv-newsletter-note) { font-size:var(--home-text-xs); line-height:1.7; }
body:has(#storefront) .site-footer .sv-newsletter label { font-size:var(--home-text-sm); }
body:has(#storefront) .site-footer .sv-newsletter input { font-size:var(--home-text-base); border-radius:var(--home-radius-control); color:var(--home-paper); }
body:has(#storefront) .site-footer .sv-newsletter button { min-height:44px; font-size:var(--home-text-sm); line-height:1.5; letter-spacing:.02em; text-transform:none; border-radius:var(--home-radius-control); background:var(--home-paper); color:var(--home-ink); }

@media(max-width:800px) {
  #storefront #season-title { font-size:var(--home-text-2xl); }
  #storefront .store-product-grid { --home-card-gap:.75rem; grid-template-columns:repeat(auto-fit,minmax(min(100%,max(8rem,calc((100% - var(--home-card-gap))/2))),1fr)); }
  #storefront .store-card-action { padding:.625rem .5rem; }
}
@media(max-width:650px) {
  body:has(#storefront) .sv-header .sv-header-brand { font-size:var(--home-text-lg); }
}
@media(max-width:600px) {
  #storefront .store-hero { min-height:0; padding-top:clamp(15rem,65vw,24rem); gap:.75rem; }
  #storefront .store-float-card { padding:.875rem; }
  #storefront .store-float-edition strong { letter-spacing:.04em; }
  #storefront .store-heading { font-size:var(--home-text-xl); }
  #storefront .store-product-bottom { flex-direction:column; align-items:stretch; }
  #storefront .store-season-label { align-items:start; gap:.25rem .75rem; }
}
@media(forced-colors:active) {
  #storefront :is(button,a):focus-visible { outline:2px solid Highlight; box-shadow:none; }
}