@import url('/assets/visual-system.css?v=3');

/* Aggressive mobile and homepage polish.
 * Isolated from the site-wide audit layer so these refinements remain easy to review and reverse.
 */

/* Keep first-party page shells inside the visual viewport without masking overflow bugs. */
.refreshed-header,main,footer{max-width:100%;box-sizing:border-box}
.home-page main>*,.recipes-page main>*{min-width:0;max-width:100%;box-sizing:border-box}

/* Kit loads reCAPTCHA as a fixed badge. Google attribution is rendered inline beside the form,
 * so remove the injected badge from layout entirely rather than leaving an invisible overflow box. */
.grecaptcha-badge{display:none!important}
.recaptcha-disclosure{margin:10px 0 0;font-size:.74rem;line-height:1.35;color:#746b73}
.recaptcha-disclosure a{color:inherit;text-decoration:underline;text-underline-offset:2px}

/* About 15% more visual mass, without changing established touch-target dimensions. */
.refreshed-header .refresh-nav-control img{transform:scale(1.15);transform-origin:center}
.taxonomy-browse-artwork{transform:scale(1.15);transform-origin:center}
.icon-action-search img{transform:scale(1.08)}
.icon-action-filter img{transform:scale(1.20)}
.icon-action-send img{transform:scale(1.10)}

/* Aggressive homepage edit: one strong discovery path, one recipe showcase, newsletter, CTA. */
.home-page .category-card:nth-child(n+7){display:none!important}
.home-page .home-recipe-grid .recipe-card:nth-child(n+7){display:none!important}
.home-page .home-recipe-grid + .section-head,
.home-page .home-recipe-grid + .section-head + .home-recipe-grid{display:none!important}
.home-feature-strip{display:none!important}

/* Region cards use undistorted circular Fresh & Fun map badges and a visible localized label. */
.region-icon-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:12px!important}
.region-icon-item:nth-child(n+7){display:none!important}
.region-icon-item{min-width:0!important;min-height:0!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:7px!important;padding:10px 6px!important}
.region-icon-item .region-silhouette{width:88px!important;height:88px!important;max-width:100%!important;object-fit:contain!important;filter:drop-shadow(0 7px 9px rgba(50,35,45,.14))!important}
.region-card-label{display:block;max-width:100%;font-size:.8rem;font-weight:800;line-height:1.1;text-align:center;color:var(--plum)}

/* Seasons stay as the compact second discovery axis; holidays remain available in /recipes filters. */
.seasonal-panel .holiday-divider,.seasonal-panel .holiday-icon-grid{display:none!important}
.season-icon-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.home-explore-panel{min-width:0!important}

/* Long catalogues collapse to 24 cards on phones, then reveal in-place on demand. */
.catalogue-card-deferred{display:none!important}
.catalogue-load-more{display:none;margin:18px auto 32px;min-height:46px;padding:10px 18px;border:1px solid rgba(64,38,75,.18);border-radius:999px;background:#fffaf2;color:var(--plum);font:inherit;font-weight:800;cursor:pointer;box-shadow:0 6px 18px rgba(64,38,75,.07)}
.catalogue-load-more:hover{background:#fff4e8;border-color:rgba(64,38,75,.3)}
.catalogue-load-more:focus-visible{outline:2px solid var(--plum);outline-offset:3px}
@media(max-width:620px){
  .catalogue-load-more:not([hidden]){display:block}
}

/* The final header control sits at the viewport edge. Anchor its desktop tooltip to the
 * control's right edge so long localized labels cannot widen the document while hidden. */
@media(min-width:1121px){
  .refreshed-header .refresh-nav-control:last-child[data-tooltip]::after{
    left:auto;
    right:0;
    transform:translateY(-3px);
  }
  .refreshed-header .refresh-nav-control:last-child[data-tooltip]:hover::after,
  .refreshed-header .refresh-nav-control:last-child[data-tooltip]:focus-visible::after{
    transform:translateY(0);
  }
}

/* Hidden nowrap tooltips still participate in overflow calculations. Below the four-column/tablet
 * breakpoint, icon controls already carry accessible names and visible discovery labels, so keep
 * those decorative pseudo-elements out of layout instead of masking their overflow at page level. */
@media(max-width:1120px){
  .refreshed-header .refresh-nav-control[data-tooltip]::before,
  .refreshed-header .refresh-nav-control[data-tooltip]::after,
  .taxonomy-browse-item[data-tooltip]::before,.taxonomy-browse-item[data-tooltip]::after,
  .region-icon-item[data-tooltip]::before,.region-icon-item[data-tooltip]::after,
  .season-icon-item[data-tooltip]::before,.season-icon-item[data-tooltip]::after,
  .holiday-icon-item[data-tooltip]::before,.holiday-icon-item[data-tooltip]::after{display:none!important}
}

@media(max-width:700px){
  .home-page .home-brand-banner,.home-page .home-hero,.taxonomy-browse,.section-head,.category-card-grid,.home-explore-grid,.home-recipe-grid,.newsletter-signup,.home-cta{max-width:calc(100vw - 24px)!important;margin-left:auto!important;margin-right:auto!important}
  .taxonomy-browse{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .region-icon-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important}
  .region-icon-item{padding:8px 3px!important;gap:5px!important}
  .region-icon-item .region-silhouette{width:76px!important;height:76px!important}
  .region-card-label{font-size:.72rem}
  .home-explore-grid{gap:12px!important}
  .home-explore-panel{padding:14px!important}
  .home-explore-panel header{margin-bottom:6px!important}
  .season-icon-item .season-artwork{width:74px!important;height:74px!important}
  .newsletter-signup{padding:20px!important}
  .home-cta{padding-left:24px!important;padding-right:24px!important}
}

@media(max-width:420px){
  .refreshed-header{padding-left:8px!important;padding-right:8px!important}
  .refresh-nav{min-width:0!important;gap:2px!important}
  .refreshed-header .refresh-nav-control{min-width:42px!important;width:42px!important;flex:0 0 42px!important}
  .home-page .home-brand-banner,.home-page .home-hero,.taxonomy-browse,.section-head,.category-card-grid,.home-explore-grid,.home-recipe-grid,.newsletter-signup,.home-cta{max-width:calc(100vw - 20px)!important}
  .region-icon-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .region-icon-item .region-silhouette{width:70px!important;height:70px!important}
  .season-icon-item .season-artwork{width:68px!important;height:68px!important}
}