/* Shared white visual identity approved for public pages. */
.public-shell { --bg: #fff; --surface: #fff; --surface-soft: #fff; --ink: #102c25; --green: #063f31; --green-2: #218654; --orange: #ff7900; --orange-text: #bb5100; --border: #e1e7e4; --radius: 7px; --small-radius: 5px; background: #fff; color: var(--ink); }
.public-shell .site-header { background: #fff; border-bottom: 1px solid #e6eae8; }
.public-shell .site-header__inner { width: calc(100% - 64px); max-width: 1464px; min-height: 90px; gap: 22px; }
.public-shell .brand { position: relative; flex: 0 0 235px; display: flex; flex-direction: column; align-items: flex-start; gap: 0; padding-left: 52px; line-height: 1.2; white-space: nowrap; }
.public-shell .brand__mark { position: absolute; left: 0; top: 0; width: 42px; height: 49px; background: transparent; border-radius: 0; }
.public-shell .brand__link { font-family: Georgia,serif; font-size: 1.27rem; font-weight: 700; color: #073e30; }
.public-shell .brand__section { font-family: Arial,sans-serif; border: 0; padding: 0; margin-top: 3px; font-size: 1.05rem; font-weight: 400; }
.public-shell .main-nav { display: flex; flex-wrap: wrap; gap: 10px 18px; justify-content: flex-start; }
.public-shell .main-nav a, .public-shell .main-nav button { color: #123f32; font-size: .8rem; }
.public-shell .main-nav .pwa-install { border: 1px solid #b9cdc1; border-radius: 5px; padding: 7px 10px; background: #fff; }
.public-shell .header-search { height: 48px; border-radius: 5px; border-color: #cfd7d3; padding: 0; gap: 5px; }
.public-shell .header-search input { border-radius: 4px; }
.public-shell .header-search button { border-radius: 4px; height: 46px; flex-basis: 44px; }
.public-shell .header-search__scanner { border-radius: 4px; background: #ff7900; border-color: #ff7900; min-height: 46px; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; width: auto; padding: 0 11px; gap: 7px; }
.public-shell .catalog-grid > .food-listing-card,
.public-shell :is(.category-directory article,.product-card,.overview-card,.dimension-grid article,.pagination,.nutrition-profile-card,.product-attentions,.quick-glycemic,.editorial-score-preview,.mobile-product-summary) { border-radius: 7px; }
.public-shell .site-footer { background: #fff; border-color: #e6eae8; }
@media (min-width: 1101px) {
 .public-shell .site-header--with-search .site-header__inner { display: grid; grid-template-columns: 235px minmax(280px,1fr) minmax(310px,420px); }
 .public-shell .site-header--with-search .brand { grid-column: 1; grid-row: 1; }
 .public-shell .site-header--with-search .main-nav { grid-column: 2; grid-row: 1; }
 .public-shell .site-header--with-search .header-search { grid-column: 3; grid-row: 1; max-width: none; width: 100%; }
}
@media (max-width: 1100px) {
 .public-shell .site-header__inner { flex-wrap: wrap; padding: 12px 0; gap: 12px; }
 .public-shell .brand { flex-basis: auto; }
 .public-shell .header-search { flex: 1 1 260px; }
 .public-shell .main-nav { width: 100%; }
}
@media (max-width: 640px) {
 .public-shell .site-header__inner { width: calc(100% - 24px); min-height: 64px; }
 .public-shell .brand { padding-left: 39px; }
 .public-shell .brand__mark { width: 32px; height: 38px; }
 .public-shell .brand__mark svg { width: 32px; height: 38px; }
 .public-shell .brand__link { font-size: 1.05rem; }
 .public-shell .brand__section { font-size: .84rem; }
 .public-shell .header-search { order: 2; flex-basis: 100%; width: 100%; max-width: none; }
 .public-shell .main-nav { order: 3; gap: 9px 13px; }
 .public-shell .main-nav a, .public-shell .main-nav button { font-size: .72rem; }
 .public-shell .header-search__scanner { min-width: 42px; }
 .public-shell.home-shell .main-nav { width: auto; flex: 1 1 100%; }
}
body.public-shell:not(.home-shell) { background: #fff; }
.public-shell .brand__mark { display: block; }
@media (max-width: 640px) {
 .public-shell .site-header .main-nav { display: flex; width: 100%; }
 .public-shell .site-header .main-nav a { display: inline-flex; min-height: 30px; padding: 3px 0; }
 .listing-view .directory-heading--split { display: flex; align-items: baseline; gap: 12px; }
 .listing-view .directory-total { white-space: nowrap; font-size: .75rem; }
 .listing-view .directory-total strong { font-size: .85rem; }
}
@media (min-width: 1101px) {
 .public-shell .site-header--with-search .site-header__inner { grid-template-columns: 235px minmax(310px,420px) minmax(280px,1fr); }
 .public-shell .site-header--with-search .header-search { grid-column: 2; }
 .public-shell .site-header--with-search .main-nav { grid-column: 3; }
}
/* Secondary wordmark: smaller and lighter, as in the approved reference. */
.public-shell .brand__section {
    font-size: .86rem;
    font-weight: 400;
    letter-spacing: .025em;
    line-height: 1.3;
    margin-top: 2px;
    color: #36594e;
}
.public-shell .brand__section strong {
    font-weight: 700;
    color: #173f34;
}
@media (max-width: 640px) {
    .public-shell .brand__section { font-size: .73rem; }
}
@media (max-width: 640px) {
 body.public-shell .site-header .site-header__inner { display: flex; flex-direction: column; align-items: stretch; height: auto; padding: 12px 0; gap: 12px; }
 body.public-shell .site-header .brand { position: relative; order: 0; width: auto; min-height: 40px; margin: 0; }
 body.public-shell .site-header .header-search { order: 1; flex: 0 0 48px; margin: 0; }
 body.public-shell .site-header .main-nav { position: static; order: 2; display: flex; flex-wrap: wrap; width: 100%; height: auto; margin: 0; padding: 0; transform: none; }
 body.public-shell .site-header .main-nav .pwa-install { position: static; margin: 0; }
}
@media (max-width: 640px) {
 body.public-shell .site-header .site-header__inner { position: relative; }
 body.public-shell .site-header .brand { padding-right: 108px; min-height: 40px; white-space: normal; }
 body.public-shell .site-header .brand__link { font-size: .94rem; }
 body.public-shell .site-header .brand__section { font-size: .68rem; }
 body.public-shell .site-header .main-nav .pwa-install {
    position: absolute;
    top: 14px;
    right: 0;
    width: 101px;
    min-height: 30px;
    padding: 5px 6px;
    font-size: .62rem;
    line-height: 1.2;
    white-space: nowrap;
    border-radius: 4px;
 }
}
/* White catalog cards lift subtly above the page. */
body.public-shell.listing-view { background:#f5f7f6; }
body.listing-view .catalog-grid > .food-listing-card { background:#fff; transition:box-shadow .18s ease,border-color .18s ease; }
@media(hover:hover) {
 body.listing-view .catalog-grid > .food-listing-card:hover { border-color:#cddbd3; box-shadow:0 5px 18px #173d2912; }
}
body.listing-view .catalog-grid > .food-listing-card:focus-within { border-color:#b4cabe; box-shadow:0 5px 18px #173d2912; }
@media(prefers-reduced-motion:reduce) { body.listing-view .catalog-grid > .food-listing-card { transition:none; } }
.public-shell .brand__mark img { display:block; width:100%; height:100%; object-fit:contain; }
/* Blend the existing favicon's near-white canvas into the white header. */
body.public-shell .site-header .brand__mark { width:42px; height:46px; border:0; border-radius:0; background:transparent; box-shadow:none; overflow:hidden; }
body.public-shell .site-header .brand__mark img { position:absolute; width:60px; height:60px; max-width:none; left:-9px; top:-7px; object-fit:contain; border:0; border-radius:0; box-shadow:none; mix-blend-mode:multiply; }
/* Quieter header identity, matching the companion radar's hierarchy. */
body.public-shell .site-header .brand { padding-left: 35px; }
body.public-shell .site-header .brand__link { font-family: Arial, sans-serif; font-size: 14px; font-weight: 600; color: #40544d; }
body.public-shell .site-header .brand__section { font-size: 10px; font-weight: 400; color: #66746e; }
body.public-shell .site-header .brand__section strong { color: #40544d; font-weight: 600; }
body.public-shell .site-header .brand__mark { width: 27px; height: 30px; top: 1px; opacity: .8; }
body.public-shell .site-header .brand__mark img { width: 39px; height: 39px; left: -6px; top: -5px; }
@media(max-width:640px) {
 body.public-shell .site-header .brand__mark { width:32px; height:38px; }
 body.public-shell .site-header .brand__mark img { width:48px; height:48px; left:-8px; top:-5px; }
}

/* Compact desktop search and vertically align the Radar mark with the wordmark. */
@media (min-width: 1101px) {
 body.public-shell .site-header--with-search .site-header__inner {
   grid-template-columns: 250px minmax(250px, 340px) minmax(0, 1fr);
   column-gap: 32px;
 }
 body.public-shell .site-header--with-search .header-search {
   width: 100%;
   max-width: 340px;
   height: 42px;
   border-radius: 999px;
 }
 body.public-shell .site-header--with-search .header-search input {
   border-radius: 999px 0 0 999px;
 }
 body.public-shell .site-header--with-search .header-search button {
   height: 40px;
   flex-basis: 40px;
   border-radius: 50%;
 }
 body.public-shell .site-header--with-search .header-search__scanner {
   min-height: 40px;
   border-radius: 999px;
 }
 body.public-shell .site-header .brand__mark {
   top: 50%;
   transform: translateY(-50%);
 }
}

/* Show the approved founders' portrait from the concept sheet without changing its pixels. */
body.public-shell .site-header .brand{padding-left:50px;min-height:40px;justify-content:center}
body.public-shell .site-header .brand__link{display:flex;align-items:center;min-height:40px;color:#c92222;font-family:Georgia,serif;font-size:22px;font-weight:700;line-height:1.1}
body.public-shell .site-header .brand__owners{display:block;position:absolute;left:0;top:50%;transform:translateY(-50%);width:38px;height:38px;overflow:hidden;border-radius:8px;background:#fff}
body.public-shell .site-header .brand__owners img{display:block;width:100%;height:100%;object-fit:cover;max-width:100%;border:0}

@media(max-width:600px){
 body.public-shell .site-header .brand{padding-right:0;white-space:normal}
 body.public-shell .site-header .brand__link{font-size:20px;max-width:100%}
}

body.public-shell .site-header .brand__name{display:block;line-height:1.02}
body.public-shell .site-header .brand__name>span{display:block}
/* Family context stays attached to the score at every viewport width. */
.public-shell .family-score-context { grid-column:1/-1; width:100%; min-width:0; flex-basis:100%; font-size:.86rem; line-height:1.5; margin:8px 0 0; }
.public-shell .family-score-context span { display:block; font-size:.78rem; color:var(--muted); margin-top:3px; }
.public-shell .recommendation-reason { margin:10px 0; line-height:1.5; font-size:.88rem; color:#3c454b; }
.public-shell .home-recent__card > .recommendation-reason { grid-column:1/-1; grid-row:2; width:100%; padding:0; margin:0; }
.public-shell .home-recent__card > .home-card__identity { grid-column:1; grid-row:1; }
.public-shell .home-recent__card > .home-card__rating { grid-column:2; grid-row:1; }
.public-shell .similar-products__grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.public-shell .curated-products { padding-top:24px; padding-bottom:36px; }
@media(max-width:700px) { .public-shell .similar-products__grid { grid-template-columns:1fr; } }
