/* Flavor Atlas. One responsive system; no legacy cascade required. */
:root {
  --cream:#faf6ee;
  --navy:#071b2f;
  --red:#bc2c1a;
  --red-light:#f15c42;
  --muted:#53575a;
  --line:#dcd5c9;
  --white:#fff;
  --serif:"Libre Baskerville",Georgia,serif;
  --sans:"Inter",Arial,sans-serif
}

* {
  box-sizing:border-box
}

html {
  scroll-behavior:smooth;
  scroll-padding-top:24px
}

body {
  margin:0;
  background:var(--cream);
  color:var(--navy);
  font:15px/1.6 var(--sans);
  -webkit-font-smoothing:antialiased
}

button,input,select {
  font:inherit
}

button,a,input,select,summary {
  -webkit-tap-highlight-color:transparent
}

a {
  color:inherit
}

button,a {
  touch-action:manipulation
}

button {
  cursor:pointer
}

img {
  max-width:100%;
  height:auto
}

h1,h2,h3,p {
  margin:0
}

h1,h2,h3 {
  font-family:var(--serif);
  font-weight:500;
  line-height:1.2;
  letter-spacing:-.045em
}

h1 {
  font-size:clamp(36px,4.2vw,60px)
}

h2 {
  font-size:32px
}

h3 {
  font-size:22px
}

p+p {
  margin-top:16px
}

button:disabled {
  cursor:wait;
  opacity:.6
}

:focus-visible {
  outline:3px solid #0a77b8;
  outline-offset:5px
}

.icon {
  width:20px;
  height:20px;
  flex-shrink:0;
  display:inline-block;
  vertical-align:middle
}

.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap
}

.skip-link {
  position:fixed;
  z-index:100;
  top:0;
  left:16px;
  padding:12px 20px;
  background:white;
  transform:translateY(-150%)
}

.skip-link:focus {
  transform:translateY(0)
}

[hidden] {
  display:none!important
}

.site-header {
  height:92px;
  display:flex;
  align-items:center;
  gap:30px;
  padding:0 4.2%;
  border-bottom:1px solid var(--line);
  background:var(--cream);
  position:relative;
  z-index:10
}

.brand {
  display:flex;
  align-items:center;
  gap:12px;
  flex-shrink:0;
  width:286px
}

.brand img {
  display:block;
  height:auto;
  mix-blend-mode:multiply
}

.brand .brand-mark {
  width:44px;
  flex-shrink:0
}

.brand .brand-wordmark {
  width:calc(100% - 56px)
}

.site-header nav {
  display:flex;
  gap:40px;
  align-items:center;
  margin-left:auto
}

.site-header nav a {
  font:600 16px var(--serif);
  text-decoration:none;
  padding:18px 0;
  white-space:nowrap
}

.site-header nav a:hover,.site-header nav a[aria-current] {
  color:var(--red)
}

.pantry-toggle {
  border:0;
  border-left:1px solid var(--line);
  padding:12px 0 12px 26px;
  background:none;
  display:flex;
  gap:12px;
  align-items:center;
  color:var(--navy);
  font:600 16px var(--serif);
  white-space:nowrap
}

.pantry-toggle .icon {
  width:24px;
  height:24px
}

.pantry-toggle [data-pantry-count] {
  font:600 12px var(--sans);
  color:var(--red)
}

.menu-toggle {
  display:none;
  min-width:44px
}

.pantry-toggle {
  min-height:44px;
  min-width:44px
}

.atlas-hero {
  background:#041426;
  color:var(--cream);
  position:relative;
  isolation:isolate;
  min-height:536px;
  padding:60px 5.3% 0;
  display:flex;
  flex-direction:column
}

.atlas-hero__image {
  position:absolute;
  inset:0;
  z-index:-1;
  overflow:hidden
}

.atlas-hero__image img {
  height:100%;
  width:100%;
  object-fit:cover;
  object-position:center
}

.atlas-hero__copy {
  max-width:680px
}

.eyebrow {
  font:650 12px/1.5 var(--sans);
  text-transform:uppercase;
  letter-spacing:.085em;
  color:var(--red);
  margin-bottom:18px
}

.atlas-hero .eyebrow {
  color:var(--red-light);
  margin-bottom:20px
}

.atlas-hero h1 {
  font-size:clamp(48px,5.3vw,76px);
  line-height:1.08;
  letter-spacing:-.06em
}

.hero-intro {
  max-width:505px;
  font-size:17px;
  line-height:1.5;
  margin:26px 0
}

.button,.prose .efb-button {
  display:inline-flex;
  justify-content:center;
  align-items:center;
  gap:24px;
  background:var(--navy);
  color:white;
  border:1px solid transparent;
  border-radius:3px;
  padding:14px 24px;
  font:600 15px/1.3 var(--serif);
  min-height:48px;
  text-decoration:none;
  transition:background .18s,transform .18s
}

.button:hover,.prose .efb-button:hover {
  background:#193f59;
  transform:translateY(-1px)
}

.button .icon {
  filter:invert(1)
}

.button--red {
  background:var(--red);
  min-width:206px
}

.button--red:hover {
  background:#9d2417
}

.button--small {
  padding:10px 16px;
  min-height:40px;
  font-size:13px;
  gap:20px
}

.country-nav {
  display:flex;
  gap:62px;
  align-items:center;
  padding:42px 0 24px;
  margin-top:auto;
  font:22px var(--serif)
}

.country-nav a {
  text-decoration:none;
  padding:8px 0
}

.country-nav a:hover {
  color:white;
  text-decoration:underline;
  text-underline-offset:12px
}

.country-nav .spotlight-country {
  border-bottom:2px solid var(--red-light)
}

.country-nav .all-countries {
  border-left:1px solid #92969c;
  padding-left:30px;
  margin-left:-26px;
  font-size:17px;
  font-style:italic
}

.section {
  width:min(1270px,89.4%);
  margin:0 auto;
  padding:62px 0
}

.section--ruled {
  border-top:1px solid var(--line)
}

.section-heading {
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:24px;
  margin-bottom:30px
}

.section-heading .eyebrow {
  margin-bottom:12px
}

.first-shelf {
  padding-top:34px;
  padding-bottom:36px
}

.first-shelf .section-heading {
  margin-bottom:26px
}

.first-shelf h2 {
  font-size:30px
}

.finds {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:32px
}

.find {
  min-width:0;
  display:flex;
  flex-direction:column
}

.find__image {
  height:280px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#f0ede6;
  overflow:hidden;
  margin-bottom:20px;
  border-radius:2px
}

.find__image img {
  height:92%;
  width:88%;
  object-fit:contain;
  transition:transform .3s ease
}

.find__image:hover img {
  transform:scale(1.04)
}

.find__body {
  display:flex;
  flex-direction:column;
  flex:1
}

.find__origin {
  font-size:12px;
  font-weight:600;
  color:var(--red);
  margin-bottom:10px
}

.find__origin span {
  color:var(--muted);
  font-weight:400
}

.find h3 {
  margin-bottom:14px;
  font-size:23px
}

.find h3 a {
  text-decoration:none
}

.find h3 a:hover {
  text-decoration:underline;
  text-underline-offset:4px
}

.find__note {
  color:var(--muted);
  font-size:14px;
  line-height:1.55;
  margin-bottom:20px
}

.find__actions {
  margin-top:auto;
  display:flex;
  gap:14px;
  align-items:center;
  flex-wrap:wrap
}

.save {
  border:0;
  background:transparent;
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:44px;
  padding:5px 0;
  font:500 14px var(--sans);
  color:var(--navy)
}

.save:hover {
  color:var(--red)
}

.save[aria-pressed=true] {
  font-weight:650;
  color:var(--red)
}

.save[aria-pressed=true] .icon {
  content:url('icons/bookmark-fill.svg')
}

.finds--shelf {
  gap:30px
}

.find--shelf {
  display:grid;
  grid-template-columns:46% 1fr;
  gap:24px;
  border-right:1px solid var(--line);
  padding-right:24px
}

.find--shelf:last-child {
  border-right:0;
  padding-right:0
}

.find--shelf .find__image {
  height:275px;
  margin:0;
  background:transparent;
  align-self:center
}

.find--shelf .find__image img {
  width:100%;
  height:100%;
  object-fit:contain
}

.find--shelf .find__body {
  padding:6px 0 0
}

.find--shelf h3 {
  font-size:20px;
  line-height:1.25;
  margin-bottom:12px;
  letter-spacing:-.055em;
  order:-1
}

.find--shelf .find__origin {
  margin-bottom:14px
}

.find--shelf .find__note {
  font-size:13px;
  line-height:1.55;
  margin-bottom:16px
}

.find--shelf .find__actions {
  gap:3px;
  display:flex;
  align-items:flex-start;
  flex-direction:column
}

.pantry-invitation {
  display:flex;
  justify-content:center;
  align-items:center;
  gap:12px;
  text-align:center;
  color:var(--muted);
  font:17px var(--serif);
  margin-top:34px
}

.text-link {
  display:inline-flex;
  align-items:center;
  gap:14px;
  font:600 14px var(--sans);
  text-underline-offset:5px;
  white-space:nowrap
}

.craving-links {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0 32px
}

.craving-links a {
  display:flex;
  gap:16px;
  align-items:center;
  padding:24px 0;
  border-bottom:1px solid var(--line);
  text-decoration:none
}

.craving-links span {
  font:22px var(--serif)
}

.craving-links small {
  color:var(--muted);
  margin-left:auto;
  white-space:nowrap
}

.craving-links a:hover span {
  color:var(--red)
}

.editorial-note {
  border-top:1px solid var(--line);
  text-align:center;
  padding:80px 20px;
  max-width:1270px
}

.editorial-note h2 {
  font-size:44px
}

.editorial-note>p:not(.eyebrow) {
  max-width:640px;
  margin:24px auto;
  color:var(--muted)
}

.newsletter {
  display:grid;
  grid-template-columns:1fr 1.2fr;
  gap:72px;
  padding:48px;
  background:#eee9df;
  border-top:3px solid var(--red)
}

.newsletter h2 {
  font-size:38px
}

.newsletter>div>p:last-child {
  max-width:340px;
  color:var(--muted);
  margin-top:18px
}

.newsletter form {
  min-width:0
}

.newsletter form>label {
  display:block;
  font-size:13px;
  font-weight:650;
  margin-bottom:8px
}

.email-row {
  display:flex;
  gap:10px
}

.email-row input {
  min-width:0;
  width:100%;
  border:1px solid #9d9c95;
  background:var(--cream);
  padding:12px 14px;
  border-radius:2px
}

.email-row .button {
  flex-shrink:0;
  font-size:13px;
  gap:12px;
  padding:12px 14px
}

fieldset {
  border:0;
  padding:0;
  margin:22px 0 16px
}

legend {
  font-size:13px;
  font-weight:600;
  padding:0;
  margin-bottom:10px
}

.interest-checks {
  display:flex;
  flex-wrap:wrap;
  gap:10px 18px
}

.interest-checks label {
  display:flex;
  align-items:center;
  gap:5px;
  font-size:12px;
  min-height:32px;
  cursor:pointer
}

.interest-checks input {
  accent-color:var(--navy);
  width:17px;
  height:17px
}

.fine-print {
  font-size:12px;
  color:var(--muted);
  line-height:1.65
}

.form-status {
  font-size:14px;
  font-weight:600;
  margin-top:14px
}

.page-intro {
  max-width:920px;
  padding-bottom:34px
}

.page-intro .eyebrow {
  margin-bottom:18px
}

.page-intro h1 {
  margin-bottom:22px
}

.page-intro>p:not(.eyebrow) {
  max-width:680px;
  font-size:17px;
  color:var(--muted)
}

.page-intro>.button {
  margin-top:22px
}

.browse-section {
  padding-top:48px
}

.catalog-search {
  background:#eee9df;
  border:1px solid var(--line);
  padding:20px 24px;
  margin-bottom:22px
}

.search-row {
  display:flex;
  align-items:center;
  gap:14px
}

.search-row input {
  flex:1;
  min-width:0;
  width:100%;
  background:var(--cream);
  color:var(--navy);
  padding:13px 16px;
  border:1px solid #a5a399;
  border-radius:2px;
  font-size:15px
}

.filters summary {
  font-size:13px;
  font-weight:600;
  cursor:pointer;
  padding-top:16px;
  width:fit-content;
  min-height:40px
}

.filter-fields {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr)) auto;
  gap:16px;
  align-items:end;
  margin-top:16px
}

.filter-fields label {
  display:flex;
  flex-direction:column;
  gap:6px;
  font-size:12px;
  font-weight:600
}

.filter-fields select {
  width:100%;
  background:var(--cream);
  border:1px solid #a5a399;
  padding:10px 8px;
  min-height:46px;
  border-radius:2px;
  font-size:13px;
  color:var(--navy)
}

.results-heading {
  display:flex;
  align-items:center;
  gap:20px;
  margin:24px 0 32px;
  font-size:13px
}

.results-heading p+p {
  margin-top:0
}

.results-heading>p:first-child {
  margin-right:0
}

.results-heading .results-note {
  margin-left:auto;
  color:var(--muted)
}

.results-heading>a {
  color:var(--red)
}

.browse-section .finds {
  row-gap:52px
}

.pagination {
  display:flex;
  gap:8px;
  justify-content:center;
  flex-wrap:wrap;
  padding-top:46px
}

.pagination a {
  min-width:44px;
  height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--line);
  text-decoration:none
}

.pagination a[aria-current] {
  background:var(--navy);
  color:white
}

.empty-state {
  text-align:center;
  padding:64px 24px;
  background:#eee9df
}

.empty-state p {
  color:var(--muted);
  margin:16px auto 24px;
  max-width:480px
}

.directory-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:40px 32px
}

.directory-card {
  text-decoration:none;
  display:block;
  border-bottom:1px solid var(--line);
  padding-bottom:20px
}

.directory-card__image {
  height:260px;
  background:#eee9df;
  display:flex;
  justify-content:center;
  align-items:center;
  margin-bottom:20px;
  overflow:hidden
}

.directory-card img:not(.icon) {
  width:80%;
  height:85%;
  object-fit:contain;
  transition:transform .25s
}

.directory-card:hover img:not(.icon) {
  transform:scale(1.04)
}

.directory-card h2 {
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-size:26px
}

.directory-card .eyebrow {
  font-size:10px;
  margin-bottom:8px
}

.detail-section {
  padding-top:30px
}

.breadcrumbs {
  display:flex;
  gap:12px;
  align-items:center;
  font-size:12px;
  color:var(--muted);
  margin-bottom:30px
}

.product-detail {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:64px;
  align-items:start
}

.detail-image {
  background:#eee9df;
  position:sticky;
  top:30px;
  padding:32px;
  text-align:center
}

.detail-image>img {
  width:100%;
  height:560px;
  object-fit:contain
}

.image-caption {
  font-size:11px;
  color:var(--muted);
  margin:16px 0 0
}

.detail-copy h1 {
  font-size:40px;
  line-height:1.15;
  margin-bottom:24px
}

.detail-copy .lead {
  color:var(--muted);
  font-size:17px
}

.detail-copy>.button {
  margin:24px 0 12px
}

.detail-copy>.save {
  margin-top:18px
}

.tasting-notes {
  border-top:1px solid var(--line);
  padding-top:28px;
  margin-top:26px
}

.tasting-notes h2 {
  font-size:26px;
  margin-bottom:26px
}

.tasting-notes h3 {
  font:650 12px var(--sans);
  letter-spacing:.04em;
  text-transform:uppercase;
  margin-bottom:8px;
  color:var(--red)
}

.tasting-notes>div {
  margin:24px 0
}

.tasting-notes p {
  font-size:14px;
  color:var(--muted)
}

.availability-note {
  background:#eee9df;
  border-left:3px solid var(--red);
  padding:20px;
  margin:24px 0
}

.availability-note h2 {
  font-size:23px;
  margin-bottom:12px
}

.availability-note p {
  font-size:14px
}

.prose {
  max-width:860px;
  min-height:55vh
}

.prose h1 {
  margin-bottom:28px
}

.prose h2 {
  margin:40px 0 16px;
  font-size:28px
}

.prose h3 {
  margin:26px 0 12px
}

.prose p {
  margin:14px 0;
  color:var(--muted)
}

.prose nav,.prose .efb-actions {
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin:32px 0
}

.prose nav a,.prose .efb-actions>a {
  display:inline-flex;
  align-items:center;
  min-height:44px
}

.prose .efb-kicker {
  font:650 12px var(--sans);
  color:var(--red);
  text-transform:uppercase;
  letter-spacing:.08em
}

.prose .efb-json-ld {
  display:none
}

.prose .efb-source-card {
  border-bottom:1px solid var(--line);
  padding-bottom:20px
}

.prose li {
  margin-bottom:12px
}

.site-footer {
  border-top:1px solid var(--line);
  padding:42px 5.3% 24px
}

.footer-top {
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr 1fr;
  gap:40px;
  padding-bottom:42px
}

.footer-top>.brand {
  width:250px
}

.footer-top>p {
  font:21px/1.4 var(--serif)
}

.footer-top nav {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:12px;
  font-size:13px
}

.footer-top nav a {
  text-decoration:none
}

.footer-top nav a:hover {
  text-decoration:underline
}

.footer-bottom {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  border-top:1px solid var(--line);
  padding-top:24px;
  color:var(--muted);
  font-size:11px
}

.footer-bottom nav {
  display:flex;
  gap:20px
}

dialog {
  color:var(--navy);
  background:var(--cream);
  border:0;
  border-radius:4px;
  padding:32px;
  width:min(760px,calc(100% - 32px));
  max-height:calc(100dvh - 48px);
  overflow-y:auto
}

dialog::backdrop {
  background:rgb(4 16 29 / .65);
  backdrop-filter:blur(4px)
}

body:has(dialog[open]) {
  overflow:hidden
}

.pantry-header {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px
}

.pantry-header .eyebrow {
  margin-bottom:8px
}

.pantry-header h2 {
  font-size:38px
}

.icon-button {
  border:1px solid var(--line);
  background:transparent;
  min-width:44px;
  min-height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:3px
}

.pantry-help {
  font-size:13px;
  color:var(--muted);
  margin:20px 0 28px
}

.pantry-item {
  display:grid;
  grid-template-columns:90px 1fr auto;
  gap:22px;
  align-items:center;
  border-top:1px solid var(--line);
  padding:20px 0
}

.pantry-item>img {
  width:90px;
  height:100px;
  object-fit:contain
}

.pantry-item h3 {
  font-size:18px;
  line-height:1.35;
  letter-spacing:-.03em
}

.pantry-item h3 a {
  text-decoration:none
}

.pantry-item p {
  font-size:12px;
  color:var(--muted);
  margin:8px 0
}

.pantry-item .save {
  font-size:12px
}

.pantry-footer {
  padding-top:24px;
  border-top:1px solid var(--line)
}

.pantry-empty {
  padding:30px 20px;
  text-align:center;
  background:#eee9df;
  margin-bottom:24px
}

.pantry-empty h3 {
  margin-bottom:14px
}

.pantry-empty p {
  font-size:14px;
  color:var(--muted)
}

.toast {
  position:fixed;
  bottom:24px;
  left:50%;
  transform:translateX(-50%);
  z-index:40;
  background:var(--navy);
  color:white;
  max-width:calc(100% - 32px);
  width:max-content;
  padding:14px 22px;
  border-radius:3px;
  font-size:13px;
  box-shadow:0 4px 20px #0003
}

.toast:empty {
  display:none
}

.noscript-note {
  padding:16px;
  text-align:center;
  border-top:1px solid var(--line);
  font-size:12px
}

@media(min-width:1600px) {
  .site-header,.site-footer {
    padding-left:max(5.3%,calc((100% - 1440px)/2));
    padding-right:max(5.3%,calc((100% - 1440px)/2))
  }

  .atlas-hero {
    padding-left:max(5.3%,calc((100% - 1270px)/2));
    min-height:580px
  }

  .atlas-hero__image img {
    object-position:center
  }

  .atlas-hero__copy {
    max-width:710px
  }

}

@media(max-width:1150px) {
  .site-header {
    gap:20px;
    padding:0 4%
  }

  .brand {
    width:230px
  }

  .site-header nav {
    gap:22px
  }

  .site-header nav a,.pantry-toggle {
    font-size:14px
  }

  .pantry-toggle {
    padding-left:18px
  }

  .atlas-hero {
    padding-top:50px;
    min-height:510px
  }

  .atlas-hero h1 {
    font-size:60px
  }

  .atlas-hero__copy {
    max-width:565px
  }

  .country-nav {
    gap:40px;
    font-size:20px
  }

  .finds--shelf {
    gap:20px
  }

  .find--shelf {
    gap:15px;
    padding-right:18px;
    grid-template-columns:42% 1fr
  }

  .find--shelf h3 {
    font-size:17px
  }

  .find--shelf .find__image {
    height:255px
  }

  .newsletter {
    gap:36px;
    padding:32px
  }

  .email-row {
    flex-wrap:wrap
  }

  .email-row .button {
    width:100%
  }

  .product-detail {
    gap:36px
  }

  .detail-copy h1 {
    font-size:35px
  }

  .detail-image>img {
    height:460px
  }

  .footer-top {
    gap:24px
  }

  .footer-top>.brand {
    width:200px
  }

}

@media(max-width:900px) {
  .site-header {
    height:80px;
    gap:16px
  }

  .brand {
    width:210px
  }

  .menu-toggle {
    display:inline-flex;
    align-items:center;
    gap:6px;
    background:transparent;
    border:0;
    min-height:44px;
    color:var(--navy);
    font-size:13px;
    margin-left:auto
  }

  .site-header nav {
    display:none;
    position:absolute;
    top:100%;
    left:0;
    right:0;
    background:var(--cream);
    border-bottom:1px solid var(--line);
    padding:14px 6%;
    box-shadow:0 8px 12px #071b2f0a
  }

  .site-header nav.is-open {
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:0
  }

  .site-header nav a {
    font-size:18px;
    display:block;
    border-bottom:1px solid var(--line);
    padding:16px 0
  }

  .site-header nav a:last-child {
    border-bottom:0
  }

  .pantry-toggle {
    font-size:13px;
    gap:6px;
    padding-left:16px
  }

  .pantry-toggle .icon {
    width:21px;
    height:21px
  }

  .atlas-hero h1 {
    font-size:50px
  }

  .atlas-hero__copy {
    max-width:475px
  }

  .hero-intro {
    max-width:400px;
    font-size:16px
  }

  .atlas-hero {
    min-height:485px
  }

  .country-nav {
    gap:32px;
    font-size:17px
  }

  .country-nav .all-countries {
    font-size:15px;
    padding-left:22px;
    margin-left:-14px
  }

  .finds {
    gap:24px
  }

  .finds--shelf {
    grid-template-columns:1fr
  }

  .find--shelf {
    grid-template-columns:180px 1fr;
    border-right:0;
    border-bottom:1px solid var(--line);
    padding:0 0 24px;
    gap:32px
  }

  .find--shelf:last-child {
    border-bottom:0;
    padding-bottom:0
  }

  .find--shelf h3 {
    font-size:23px
  }

  .find--shelf .find__image {
    height:235px
  }

  .find--shelf .find__note {
    font-size:14px
  }

  .find--shelf .find__actions {
    flex-direction:row;
    align-items:center;
    gap:20px
  }

  .first-shelf .find__body {
    padding:12px 0
  }

  .find h3 {
    font-size:20px
  }

  .find__image {
    height:225px
  }

  .craving-links {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

  .newsletter {
    grid-template-columns:1fr;
    gap:32px
  }

  .newsletter h2 br {
    display:none
  }

  .newsletter>div>p:last-child {
    max-width:100%
  }

  .email-row {
    flex-wrap:nowrap
  }

  .email-row .button {
    width:auto
  }

  .filter-fields {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

  .filter-fields>.button {
    grid-column:2;
    justify-self:end
  }

  .directory-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

  .product-detail {
    grid-template-columns:45% 1fr;
    gap:30px
  }

  .detail-image {
    padding:18px
  }

  .detail-image>img {
    height:370px
  }

  .detail-copy h1 {
    font-size:30px
  }

  .detail-copy .lead {
    font-size:15px
  }

  .footer-top {
    grid-template-columns:1fr 1fr;
    gap:28px
  }

  .footer-bottom {
    align-items:flex-start;
    flex-direction:column;
    gap:16px
  }

}

@media(max-width:600px) {
  body {
    font-size:14px
  }

  .site-header {
    height:76px;
    padding:0 5%;
    gap:9px
  }

  .brand {
    width:clamp(155px,48.7vw,190px);
    gap:8px
  }

  .brand .brand-mark {
    width:30px
  }

  .brand .brand-wordmark {
    width:calc(100% - 38px)
  }

  .menu-toggle {
    padding:4px;
    gap:0
  }

  .menu-toggle>span {
    display:none
  }

  .menu-toggle .icon {
    width:24px;
    height:24px
  }

  .pantry-toggle {
    padding:6px 0 6px 10px;
    font-size:12px
  }

  .pantry-toggle>span:not([data-pantry-count]) {
    display:none
  }

  .pantry-toggle .icon {
    width:24px;
    height:24px
  }

  .atlas-hero {
    padding:30px 6% 0;
    min-height:0;
    display:flex
  }

  .atlas-hero__image {
    position:static;
    order:1;
    height:210px;
    margin:24px -6.82% 0;
    flex-shrink:0;
    z-index:auto
  }

  .atlas-hero__image img {
    object-fit:cover;
    object-position:right
  }

  .atlas-hero__copy {
    position:relative;
    order:0
  }

  .atlas-hero .eyebrow {
    font-size:10px;
    margin-bottom:16px
  }

  .atlas-hero h1 {
    font-size:clamp(33px,9.7vw,54px);
    letter-spacing:-.055em;
    line-height:1.13
  }

  .hero-intro {
    font-size:14px;
    line-height:1.55;
    margin:19px 0 22px;
    max-width:340px
  }

  .atlas-hero .button {
    font-size:14px;
    padding:12px 18px;
    min-height:46px;
    min-width:184px
  }

  .country-nav {
    position:static;
    order:2;
    margin:0 -6.82%;
    padding:12px 6.82% 14px;
    gap:27px;
    font-size:16px;
    overflow-x:auto;
    scrollbar-width:thin;
    white-space:nowrap;
    min-height:55px
  }

  .country-nav a {
    padding:5px 0
  }

  .country-nav .all-countries {
    padding-left:20px;
    margin-left:0;
    font-size:14px
  }

  .section {
    width:88%;
    padding:38px 0
  }

  .section-heading {
    align-items:flex-start;
    flex-direction:column;
    gap:16px;
    margin-bottom:24px
  }

  h2 {
    font-size:27px
  }

  .first-shelf {
    padding-top:32px;
    padding-bottom:28px
  }

  .first-shelf h2 {
    font-size:25px;
    max-width:330px;
    line-height:1.25
  }

  .finds {
    grid-template-columns:1fr;
    gap:34px
  }

  .finds--shelf {
    gap:24px
  }

  .find--shelf {
    grid-template-columns:40% 1fr;
    gap:20px
  }

  .find--shelf .find__image {
    height:225px
  }

  .find--shelf h3 {
    font-size:18px;
    letter-spacing:-.045em
  }

  .find--shelf .find__body {
    padding:0
  }

  .find--shelf .find__origin {
    font-size:11px;
    margin-bottom:10px
  }

  .find--shelf .find__note {
    font-size:13px;
    line-height:1.5
  }

  .find--shelf .find__actions {
    flex-direction:column;
    align-items:flex-start;
    gap:2px
  }

  .find--shelf .button--small {
    gap:16px;
    padding:10px 12px;
    min-height:40px
  }

  .pantry-invitation {
    font-size:13px;
    line-height:1.5;
    align-items:flex-start;
    margin-top:26px;
    text-align:left
  }

  .pantry-invitation .icon {
    width:18px;
    margin-top:2px
  }

  .find__image {
    height:290px;
    margin-bottom:16px
  }

  .find h3 {
    font-size:24px
  }

  .find__origin {
    font-size:12px
  }

  .find__note {
    font-size:14px
  }

  .find__actions {
    gap:22px
  }

  .find__actions .button--small {
    min-height:44px
  }

  .craving-links {
    gap:0 22px
  }

  .craving-links a {
    flex-wrap:wrap;
    gap:4px 8px;
    padding:19px 0
  }

  .craving-links span {
    font-size:18px;
    flex-basis:100%
  }

  .craving-links small {
    margin-left:0;
    font-size:11px
  }

  .craving-links .icon {
    margin-left:auto;
    width:16px
  }

  .editorial-note {
    padding:44px 0
  }

  .editorial-note h2 {
    font-size:32px
  }

  .newsletter {
    padding:26px 22px;
    margin:0 -3%;
    gap:28px
  }

  .newsletter h2 {
    font-size:30px
  }

  .newsletter .eyebrow {
    font-size:10px
  }

  .email-row {
    flex-direction:column
  }

  .email-row input {
    min-height:48px
  }

  .email-row .button {
    width:100%;
    min-height:48px
  }

  .interest-checks {
    gap:6px 14px
  }

  .interest-checks label {
    min-height:40px
  }

  .page-intro {
    padding-bottom:26px
  }

  .page-intro h1 {
    font-size:36px;
    line-height:1.15;
    margin-bottom:18px
  }

  .page-intro>p:not(.eyebrow) {
    font-size:15px
  }

  .page-intro .eyebrow {
    font-size:10px;
    margin-bottom:12px
  }

  .browse-section {
    padding-top:32px
  }

  .catalog-search {
    padding:16px;
    margin-left:-3%;
    margin-right:-3%
  }

  .search-row {
    display:grid;
    grid-template-columns:1fr auto;
    gap:10px
  }

  .search-row>.icon {
    display:none
  }

  .search-row input {
    font-size:16px;
    padding:12px 10px;
    grid-column:1
  }

  .search-row>.button {
    grid-column:2;
    min-height:44px;
    font-size:14px
  }

  .filter-fields {
    gap:12px
  }

  .filter-fields label {
    font-size:11px
  }

  .filter-fields select {
    font-size:13px;
    min-height:46px
  }

  .filter-fields>.button {
    grid-column:1/-1;
    width:100%;
    font-size:14px
  }

  .filters summary {
    min-height:44px
  }

  .results-heading {
    flex-wrap:wrap;
    gap:8px 16px;
    margin:22px 0 26px
  }

  .results-heading .results-note {
    margin-left:0;
    width:100%;
    font-size:11px
  }

  .browse-section .finds {
    row-gap:38px
  }

  .directory-grid {
    gap:30px 18px
  }

  .directory-card__image {
    height:165px;
    margin-bottom:14px
  }

  .directory-card h2 {
    font-size:19px;
    line-height:1.25;
    gap:8px
  }

  .directory-card .eyebrow {
    font-size:9px;
    letter-spacing:.03em
  }

  .directory-card h2 .icon {
    width:16px
  }

  .detail-section {
    padding-top:24px
  }

  .breadcrumbs {
    font-size:11px;
    margin-bottom:24px
  }

  .product-detail {
    grid-template-columns:1fr;
    gap:30px
  }

  .detail-image {
    position:static;
    padding:24px
  }

  .detail-image>img {
    height:260px
  }

  .detail-copy h1 {
    font-size:33px
  }

  .detail-copy .eyebrow {
    font-size:10px
  }

  .detail-copy .lead {
    font-size:16px
  }

  .merchant-button {
    width:100%;
    font-size:14px;
    gap:12px
  }

  .detail-copy>.save {
    min-height:48px
  }

  .tasting-notes h2 {
    font-size:25px
  }

  .prose h1 {
    font-size:36px
  }

  .prose h2 {
    font-size:25px
  }

  .site-footer {
    padding:32px 6% 24px
  }

  .footer-top {
    gap:28px 18px;
    padding-bottom:32px
  }

  .footer-top .brand {
    width:175px;
    grid-column:1/-1
  }

  .footer-top>p {
    font-size:24px;
    grid-column:1/-1
  }

  .footer-top nav {
    font-size:12px;
    gap:14px
  }

  .footer-bottom {
    font-size:10px
  }

  .footer-bottom nav {
    gap:18px;
    flex-wrap:wrap
  }

  dialog {
    padding:24px 20px;
    width:calc(100% - 20px);
    max-height:calc(100dvh - 24px)
  }

  .pantry-header h2 {
    font-size:32px
  }

  .pantry-header .eyebrow {
    font-size:9px
  }

  .pantry-item {
    grid-template-columns:70px 1fr;
    gap:10px 18px
  }

  .pantry-item>img {
    width:70px;
    height:95px
  }

  .pantry-item h3 {
    font-size:16px
  }

  .pantry-item>.save {
    grid-column:2;
    justify-self:start
  }

  .pantry-footer .button {
    width:100%;
    font-size:13px;
    padding:14px 10px
  }

  .toast {
    bottom:16px;
    font-size:12px;
    padding:12px 16px
  }

}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }

  *,*::before,*::after {
    transition:none!important;
    animation:none!important
  }

}

.collection-note {
  font-size:14px;
  line-height:1.6;
  color:var(--muted);
  margin-top:14px
}

.directory-card:has(.collection-note) h2 {
  font-size:24px
}

@media(max-width:600px) {
  .directory-card:has(.collection-note) h2 {
    font-size:20px
  }

  .collection-note {
    font-size:12px
  }

}

.pantry-item--unavailable {
  grid-template-columns:1fr auto
}

.pantry-item--unavailable>.save {
  grid-column:auto
}

.partner-intro {
  display:grid;
  grid-template-columns:1.15fr 1fr;
  align-items:center;
  gap:60px
}

.partner-intro h1 {
  font-size:48px
}

.partner-intro>img {
  width:100%;
  height:440px;
  object-fit:cover;
  border-radius:2px
}

.partner-requirements {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:42px
}

.partner-requirements h3 {
  font-size:25px;
  margin-bottom:18px
}

.partner-requirements p:last-child {
  color:var(--muted);
  font-size:14px
}

@media(max-width:900px) {
  .partner-intro {
    gap:30px
  }

  .partner-intro h1 {
    font-size:36px
  }

  .partner-intro>img {
    height:390px
  }

  .partner-requirements {
    gap:24px
  }

}

@media(max-width:600px) {
  .partner-intro {
    grid-template-columns:1fr;
    gap:12px
  }

  .partner-intro h1 {
    font-size:36px
  }

  .partner-intro>img {
    height:245px
  }

  .partner-requirements {
    grid-template-columns:1fr;
    gap:30px
  }

}

/* Discovery */
.browse-section{padding-top:28px;}
.browse-section .page-intro{padding:0 0 18px;margin-bottom:0;}
.browse-section .page-intro h1{font-size:clamp(2rem,4vw,3.25rem);margin-bottom:12px;}
.browse-section .catalog-search{padding:16px 20px;}
.browse-section .results-heading{margin:18px 0;}
.find__pack{margin:6px 0;font-size:.875rem;color:#575955;}
.find__image img{object-fit:contain;padding:12px;}
.product-facts{display:flex;flex-wrap:wrap;gap:12px 28px;margin:18px 0;}
.product-facts dt{color:#575955;font-size:.8125rem;text-transform:uppercase;letter-spacing:.06em;}
.product-facts dd{margin:4px 0 0;font-size:1rem;font-weight:600;}
.detail-copy h1{font-size:clamp(2rem,3.2vw,3.1rem);text-wrap:balance;}
.why-selected{padding:24px 0 8px;}
.why-selected h2{font-size:1.65rem;margin-bottom:12px;}
.why-selected p{line-height:1.65;}
.current-offer{font-size:1.5rem;font-weight:600;}
.current-offer small{display:block;font-size:.875rem;font-weight:400;}
.fine-print{font-size:.875rem;line-height:1.6;color:#515550;}
.filters summary{min-height:44px;display:flex;align-items:center;cursor:pointer;}
.tasting-flight{padding-top:36px;padding-bottom:36px;}
.flight-story{max-width:850px;font-size:1.125rem;line-height:1.65;}
.flight-plan{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin:26px 0;padding:22px 0;border-top:1px solid #dcd5ca;border-bottom:1px solid #dcd5ca;}
.flight-plan h3{margin:8px 0;font-size:1.375rem;}
.flight-plan p{margin-bottom:0;color:#515550;line-height:1.55;}
.flight-actions{display:flex;align-items:center;flex-wrap:wrap;gap:16px 24px;margin-top:24px;}
.flight-actions p{margin:0;font-size:.9375rem;}
.pantry-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0;}
.pantry-tabs button,.pantry-state,.pantry-connect button:not(.button){min-height:44px;padding:9px 14px;border:1px solid #a7a69c;background:transparent;color:#09202c;cursor:pointer;font:inherit;}
.pantry-tabs button[aria-pressed="true"]{color:#fff;background:#09202c;border-color:#09202c;}
.pantry-state{font-size:.875rem;margin:8px 0;}
.pantry-preferences,.measurement-choice{border-top:1px solid #dcd5ca;padding:14px 0;}
.pantry-preferences summary,.measurement-choice summary{min-height:44px;padding:10px 0;cursor:pointer;font-weight:600;}
.pantry-preferences fieldset{border:0;margin:4px 0 12px;padding:0;display:flex;gap:4px 16px;flex-wrap:wrap;}
.pantry-preferences legend{margin-bottom:12px;}
.pantry-preferences label,.measurement-choice label{display:flex;align-items:center;gap:8px;min-height:44px;}
.pantry-preferences input,.measurement-choice input{width:18px;height:18px;flex:0 0 auto;accent-color:#b72b18;}
.pantry-connect{border-top:1px solid #dcd5ca;padding:20px 0;}
.pantry-connect h3{font-size:1.5rem;margin:0 0 10px;}
.pantry-connect p{line-height:1.6;}
.pantry-connect [data-recovery-wrap]{margin-top:14px;}
.pantry-connect label{display:block;margin:12px 0 8px;}
#pantry-recovery{display:block;width:100%;padding:12px;margin-bottom:10px;border:1px solid #858a85;font-size:1rem;background:#fff;color:#09202c;}
.pantry-discovery-links{display:flex;flex-wrap:wrap;gap:10px 16px;margin:12px 0;}
.pantry-discovery-links a{display:inline-flex;align-items:center;min-height:44px;}
#pantry button:disabled{opacity:.65;cursor:wait;}
#pantry [hidden]{display:none !important;}
@media (max-width:760px){.browse-section{padding-top:24px;}
.browse-section .catalog-search{padding:12px;}
.flight-plan{grid-template-columns:1fr;gap:18px;}
.flight-plan > div{display:grid;grid-template-columns:62px 1fr;gap:4px 14px;align-items:baseline;}
.flight-plan .eyebrow{grid-row:span 2;}
.flight-plan h3{margin:0;}
.flight-plan p{grid-column:2;margin:0;}
.flight-actions .button{width:100%;justify-content:center;white-space:normal;}
.tasting-flight .section-heading{gap:12px;}
.product-facts{gap:12px 20px;}
.pantry-connect button{margin:4px 0;}
#pantry{max-height:calc(100dvh - 24px);}
}