/* KULTURBRÜCKE — Flavour Atlas / cinematic food discovery */
.food-atlas-section { position: relative; isolation: isolate; }
.food-atlas-heading { max-width: 64rem; margin-bottom: clamp(1.5rem, 3vw, 2.4rem); }
.food-atlas-heading h2 { max-width: 14ch; }
.food-atlas-hero { position: relative; min-height: clamp(320px, 40vw, 540px); overflow: hidden; border: 1px solid rgb(174 228 255 / 35%); border-radius: clamp(1.1rem, 2.4vw, 2rem); background: #071a31; box-shadow: 0 30px 80px rgb(0 7 22 / 25%), inset 0 1px 0 rgb(255 255 255 / 15%); }
.food-atlas-hero__image, .food-atlas-hero__shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.food-atlas-hero__image { object-fit: cover; object-position: center 54%; transform: scale(1.015); }
.food-atlas-hero__shade { background: linear-gradient(90deg, rgb(3 15 31 / 88%) 0%, rgb(3 17 35 / 55%) 42%, rgb(3 17 35 / 5%) 100%), linear-gradient(0deg, rgb(3 15 32 / 74%), transparent 42%); }
.food-atlas-hero__copy { position: absolute; z-index: 1; left: clamp(1.2rem, 5vw, 4.5rem); bottom: clamp(1.4rem, 5vw, 4rem); width: min(60%, 42rem); }
.food-atlas-hero__eyebrow, .food-atlas-toolbar__intro > p, .food-atlas-compare__heading > p:first-child { margin: 0 0 .7rem; color: #9ce8ff; font-size: .68rem; font-weight: 850; letter-spacing: .19em; }
.food-atlas-hero__copy h3 { max-width: 12ch; margin: 0; color: #f7fcff; font-family: Georgia, "Times New Roman", serif; font-size: clamp(2.5rem, 5.4vw, 5.4rem); font-weight: 500; letter-spacing: -.045em; line-height: .99; text-wrap: balance; text-shadow: 0 8px 35px rgb(0 0 0 / 45%); }
.food-atlas-hero__countries { display: flex; align-items: center; gap: .8rem; margin-top: 1.5rem; color: #e0f6ff; font-size: .69rem; font-weight: 850; letter-spacing: .14em; }
.food-atlas-hero__countries i { width: clamp(2.2rem, 5vw, 4rem); height: 2px; background: linear-gradient(90deg, #e9c68d, #78e4ff); box-shadow: 0 0 14px rgb(109 222 255 / 75%); }
.food-atlas-hero__index { position: absolute; right: 1.35rem; bottom: 1.2rem; color: rgb(237 250 255 / 75%); font-size: .67rem; font-weight: 800; letter-spacing: .16em; }
.food-atlas-toolbar { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin: clamp(2.2rem, 5vw, 4.2rem) 0 1.3rem; }
.food-atlas-toolbar__intro > p { margin-bottom: .35rem; font-size: .61rem; }
.food-atlas-toolbar__intro h3 { margin: 0; color: #f3faff; font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.75rem, 3vw, 2.6rem); font-weight: 500; letter-spacing: -.03em; }
.food-atlas-filters { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; padding: .35rem; border: 1px solid rgb(153 223 255 / 24%); border-radius: 999px; background: rgb(7 28 51 / 73%); box-shadow: inset 0 1px 0 rgb(255 255 255 / 9%); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); }
.food-atlas-filter { min-height: 2.55rem; padding: .55rem .95rem; border: 1px solid transparent; border-radius: 999px; color: #c3deed; background: transparent; font: inherit; font-size: .78rem; font-weight: 720; cursor: pointer; transition: color 180ms ease, background 180ms ease, border-color 180ms ease; }
.food-atlas-filter:hover { color: white; background: rgb(119 214 255 / 10%); }
.food-atlas-filter.is-active, .food-atlas-filter[aria-pressed="true"] { border-color: rgb(141 223 255 / 44%); color: #f4fbff; background: linear-gradient(135deg, rgb(54 151 204 / 43%), rgb(12 63 102 / 65%)); box-shadow: 0 0 22px rgb(65 184 239 / 12%), inset 0 1px 0 rgb(255 255 255 / 12%); }
.food-atlas-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(.8rem, 1.7vw, 1.3rem); }
.food-dish-card { min-width: 0; overflow: hidden; border: 1px solid rgb(152 223 255 / 23%); border-radius: 1.25rem; background: linear-gradient(160deg, rgb(25 73 107 / 62%), rgb(4 23 45 / 88%)); box-shadow: 0 16px 40px rgb(0 7 22 / 23%), inset 0 1px 0 rgb(255 255 255 / 10%); -webkit-backdrop-filter: blur(16px) saturate(130%); backdrop-filter: blur(16px) saturate(130%); transition: transform 240ms ease, border-color 240ms ease, box-shadow 240ms ease; }
.food-dish-card:hover { transform: translateY(-5px); border-color: rgb(137 224 255 / 56%); box-shadow: 0 25px 54px rgb(0 8 28 / 35%), 0 0 25px rgb(69 193 249 / 12%); }
.food-dish-card[hidden] { display: none !important; }
.food-dish-card__button { display: flex; width: 100%; height: 100%; min-width: 0; flex-direction: column; padding: 0; border: 0; color: inherit; background: transparent; font: inherit; text-align: left; cursor: pointer; }
.food-dish-card__image-wrap { position: relative; display: block; overflow: hidden; width: 100%; aspect-ratio: 4 / 3; background: #0a2946; }
.food-dish-card__image { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 650ms cubic-bezier(.2,.7,.2,1), filter 350ms ease; }
.food-dish-card:hover .food-dish-card__image { transform: scale(1.055); filter: saturate(1.08); }
.food-dish-card__image-wrap::after { position: absolute; inset: 45% 0 0; content: ""; background: linear-gradient(0deg, rgb(2 13 27 / 66%), transparent); pointer-events: none; }
.food-dish-card__image-index { position: absolute; z-index: 1; left: .85rem; bottom: .7rem; color: #effaff; font-size: .59rem; font-weight: 850; letter-spacing: .14em; }
.food-dish-card__open { position: absolute; z-index: 1; top: .7rem; right: .7rem; display: grid; width: 2.2rem; height: 2.2rem; place-items: center; border: 1px solid rgb(220 247 255 / 53%); border-radius: 50%; color: #fff; background: rgb(3 24 45 / 61%); font-size: 1rem; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.food-dish-card__body { display: flex; flex: 1; flex-direction: column; align-items: flex-start; padding: 1rem 1rem 1.1rem; }
.food-dish-card__country { display: block; margin-bottom: .55rem; color: #94e4ff; font-size: .56rem; font-weight: 850; letter-spacing: .12em; line-height: 1.4; }
.food-dish-card__title { display: block; color: #f6fbff; font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.22rem, 1.7vw, 1.65rem); font-weight: 500; letter-spacing: -.025em; line-height: 1.1; }
.food-dish-card__summary { display: block; min-height: 4.5em; margin-top: .6rem; color: #d1e4f0; font-size: .79rem; line-height: 1.6; }
.food-dish-card__cta { display: flex; align-items: center; justify-content: space-between; width: 100%; margin-top: auto; padding-top: .85rem; color: #9ce8ff; font-size: .74rem; font-weight: 800; }
.food-dish-card__cta b { display: inline-grid; width: 1.65rem; height: 1.65rem; place-items: center; border: 1px solid rgb(135 222 255 / 35%); border-radius: 50%; font-size: .95rem; font-weight: 500; transition: transform 180ms ease; }
.food-dish-card:hover .food-dish-card__cta b { transform: translateX(3px); }
.food-dish-card__button:focus-visible, .food-atlas-filter:focus-visible { outline: 3px solid #e1f8ff; outline-offset: 4px; border-radius: .4rem; }
.food-atlas-compare { display: grid; grid-template-columns: minmax(14rem, .72fr) minmax(0, 1.28fr); align-items: center; gap: clamp(1rem, 3vw, 2.8rem); margin-top: clamp(2.5rem, 5vw, 4.5rem); padding: clamp(1rem, 2.4vw, 2rem); border: 1px solid rgb(149 222 255 / 24%); border-radius: 1.5rem; background: linear-gradient(130deg, rgb(30 85 120 / 36%), rgb(4 22 43 / 82%)); box-shadow: inset 0 1px 0 rgb(255 255 255 / 9%), 0 20px 48px rgb(0 8 23 / 18%); }
.food-atlas-compare__heading > p:first-child { margin-bottom: .55rem; font-size: .61rem; }
.food-atlas-compare__heading h3 { margin: 0; color: #f6fbff; font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.6rem, 2.5vw, 2.35rem); font-weight: 500; letter-spacing: -.03em; line-height: 1.08; }
.food-atlas-compare__heading > p:last-child { margin: .75rem 0 0; color: #d0e5f1; font-size: .9rem; line-height: 1.7; }
.food-atlas-compare__visual { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: .85rem; }
.food-atlas-compare__dish { position: relative; overflow: hidden; min-width: 0; border: 1px solid rgb(167 229 255 / 29%); border-radius: 1rem; background: #08213a; box-shadow: 0 14px 28px rgb(0 5 20 / 22%); }
.food-atlas-compare__dish img { display: block; width: 100%; aspect-ratio: 5 / 4; object-fit: cover; }
.food-atlas-compare__dish span { display: block; padding: .7rem .8rem 0; color: #91e3ff; font-size: .54rem; font-weight: 850; letter-spacing: .12em; }
.food-atlas-compare__dish strong { display: block; padding: .2rem .8rem .85rem; color: #f4fbff; font-family: Georgia, "Times New Roman", serif; font-size: clamp(1rem, 1.5vw, 1.35rem); font-weight: 500; }
.food-atlas-compare__bridge { display: flex; align-items: center; gap: .25rem; color: #a5eeff; text-shadow: 0 0 14px rgb(94 219 255 / 70%); }
.food-atlas-compare__bridge i { width: clamp(1rem, 2vw, 2.1rem); height: 2px; background: linear-gradient(90deg, #e9c68d, #72e7ff); box-shadow: 0 0 12px rgb(102 220 255 / 85%); }
.food-atlas-note { max-width: 68rem; margin: 1rem auto 0; color: #aecbdb; font-size: .74rem; line-height: 1.65; text-align: center; }

/* Dish dialog */
.food-experience { position: fixed; inset: 0; width: 100vw; max-width: none; height: 100vh; height: 100dvh; max-height: none; margin: 0; padding: 0; overflow: auto; border: 0; border-radius: 0; color: #f4faff; background: #06182d; overscroll-behavior: contain; scrollbar-color: rgb(127 223 255 / 48%) rgb(3 18 36 / 48%); }
.food-experience[open] { display: block; }
.food-experience::backdrop { background: rgb(1 10 25 / 91%); -webkit-backdrop-filter: blur(9px); backdrop-filter: blur(9px); }
.food-experience__backdrop { position: fixed; inset: 0; z-index: 0; pointer-events: none; background-image: linear-gradient(105deg, rgb(2 13 29 / 84%), rgb(2 17 35 / 53%) 55%, rgb(2 17 35 / 42%)), url("../assets/food/food-bridge.webp"); background-position: center; background-size: cover; filter: saturate(.88); transform: scale(1.02); }
.food-experience__inner { position: relative; z-index: 1; display: grid; grid-template-rows: auto 1fr auto; gap: clamp(.9rem, 2vh, 1.5rem); width: min(100%, 1480px); min-height: 100%; margin-inline: auto; padding: clamp(.8rem, 2.2vw, 1.8rem) clamp(.8rem, 3.5vw, 3.5rem) 1rem; }
.food-experience__topbar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.food-experience__brand { display: flex; align-items: center; gap: .65rem; }
.food-experience__brand > span { display: grid; width: 2.5rem; height: 2.5rem; place-items: center; border: 1px solid rgb(150 226 255 / 40%); border-radius: .8rem; color: #adf0ff; background: linear-gradient(145deg, rgb(73 178 225 / 35%), rgb(5 34 64 / 78%)); box-shadow: 0 0 22px rgb(59 195 250 / 14%); font-size: 1.3rem; }
.food-experience__brand strong { display: block; color: #fff; font-size: .83rem; letter-spacing: .16em; }
.food-experience__brand small { display: block; margin-top: .2rem; color: #afd6e9; font-size: .59rem; letter-spacing: .12em; }
.food-experience__close { display: grid; width: 2.9rem; height: 2.9rem; flex: 0 0 auto; place-items: center; border: 1px solid rgb(205 238 255 / 38%); border-radius: 50%; color: white; background: rgb(4 23 44 / 74%); cursor: pointer; transition: transform 180ms ease, border-color 180ms ease, background 180ms ease; }
.food-experience__close:hover { transform: rotate(90deg); border-color: #a6edff; background: rgb(24 88 130 / 78%); }
.food-experience__close span { margin-top: -.1em; font-size: 2rem; font-weight: 300; line-height: 1; }
.food-experience__layout { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); align-items: center; gap: clamp(1rem, 3vw, 3rem); width: 100%; max-width: 1250px; margin: auto; }
.food-experience__visual { position: relative; min-width: 0; overflow: hidden; margin: 0; border: 1px solid rgb(180 232 255 / 36%); border-radius: 1.5rem; background: #0a2743; box-shadow: 0 24px 65px rgb(0 5 20 / 38%), inset 0 1px 0 rgb(255 255 255 / 14%); }
.food-experience__visual img { display: block; width: 100%; max-height: min(64vh, 680px); aspect-ratio: 5 / 4; object-fit: cover; }
.food-experience__visual figcaption { padding: .75rem 1rem; color: #bfdcea; background: rgb(3 20 39 / 78%); font-size: .68rem; line-height: 1.5; }
.food-experience__glass { min-width: 0; padding: clamp(1rem, 2.2vw, 1.8rem); border: 1px solid rgb(190 236 255 / 38%); border-radius: 1.55rem; background: linear-gradient(145deg, rgb(12 45 72 / 78%), rgb(3 19 40 / 83%)); box-shadow: 0 27px 80px rgb(0 6 23 / 42%), inset 0 1px 0 rgb(255 255 255 / 16%), inset 0 0 45px rgb(70 178 225 / 7%); -webkit-backdrop-filter: blur(25px) saturate(145%); backdrop-filter: blur(25px) saturate(145%); }
.food-experience__eyebrow { margin: 0 0 .65rem; color: #93e4ff; font-size: .63rem; font-weight: 850; letter-spacing: .16em; }
.food-experience__glass h2 { margin: 0; color: #fff; font-family: Georgia, "Times New Roman", serif; font-size: clamp(2.2rem, 4vw, 4rem); font-weight: 500; letter-spacing: -.04em; line-height: 1; }
.food-experience__lead { max-width: 46rem; margin: .8rem 0 1.1rem; color: #e0f0f8; font-size: clamp(.94rem, 1.35vw, 1.1rem); line-height: 1.65; }
.food-experience__detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .9rem; }
.food-experience__detail-grid section { min-width: 0; padding: .85rem .9rem; border: 1px solid rgb(156 221 255 / 20%); border-radius: .9rem; background: rgb(3 22 42 / 35%); }
.food-experience__detail-grid section:first-child { grid-column: 1 / -1; }
.food-experience__label { margin: 0 0 .4rem; color: #98e4ff; font-size: .58rem; font-weight: 850; letter-spacing: .14em; }
.food-experience__detail-grid section > p:last-child { margin: 0; color: #d5e8f2; font-size: .82rem; line-height: 1.65; }
.food-experience__note { display: flex; gap: .7rem; margin-top: .85rem; padding: .75rem .85rem; border: 1px solid rgb(118 214 255 / 24%); border-radius: .9rem; background: linear-gradient(115deg, rgb(37 114 158 / 27%), rgb(4 32 57 / 38%)); }
.food-experience__note span { color: #a5edff; text-shadow: 0 0 12px rgb(102 221 255 / 70%); }
.food-experience__note p { margin: 0; color: #d4e7f1; font-size: .77rem; line-height: 1.55; }
.food-experience__sources { display: grid; grid-template-columns: auto 1fr; align-items: start; gap: .8rem; margin-top: 1rem; padding-top: .85rem; border-top: 1px solid rgb(195 234 255 / 18%); }
.food-experience__sources h3 { margin: .1rem 0 0; color: #a4eaff; font-size: .68rem; font-weight: 820; }
.food-experience__sources ul { display: grid; gap: .4rem; margin: 0; padding: 0; list-style: none; }
.food-experience__source-link { display: inline-flex; align-items: center; gap: .45rem; color: #e0f5ff; font-size: .72rem; line-height: 1.5; text-decoration-color: rgb(153 223 255 / 55%); text-underline-offset: .2em; }
.food-experience__source-link:hover { color: white; text-decoration-thickness: 2px; }
.food-experience__source-arrow { color: #9ae8ff; }
.food-experience__footer { display: flex; justify-content: space-between; gap: .8rem; max-width: 1250px; width: 100%; margin: 0 auto; color: #bad7e6; font-size: .62rem; line-height: 1.5; }
.food-experience__footer span:last-child { color: #cbe6f2; text-align: right; }
.food-experience button:focus-visible, .food-experience a:focus-visible { outline: 3px solid #e1f8ff; outline-offset: 3px; }
@media (max-width: 1050px) {
  .food-atlas-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .food-atlas-compare { grid-template-columns: minmax(0, .75fr) minmax(0, 1.25fr); }
  .food-experience__layout { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 1rem; }
  .food-experience__detail-grid { gap: .6rem; }
}
@media (max-width: 700px) {
  .food-atlas-hero { min-height: 430px; }
  .food-atlas-hero__image { object-position: 51% center; }
  .food-atlas-hero__shade { background: linear-gradient(90deg, rgb(2 13 29 / 72%), rgb(2 15 32 / 18%)), linear-gradient(0deg, rgb(2 13 30 / 82%), transparent 75%); }
  .food-atlas-hero__copy { left: 1.1rem; bottom: 1.5rem; width: calc(100% - 2.2rem); }
  .food-atlas-hero__copy h3 { max-width: 10ch; font-size: clamp(2.75rem, 13vw, 4.8rem); }
  .food-atlas-toolbar { align-items: flex-start; flex-direction: column; }
  .food-atlas-filters { width: 100%; justify-content: space-between; border-radius: 1rem; }
  .food-atlas-filter { flex: 1 1 auto; min-width: 0; min-height: 2.7rem; padding-inline: .45rem; font-size: .72rem; }
  .food-atlas-grid { grid-template-columns: minmax(0, 1fr); gap: .9rem; }
  .food-dish-card { border-radius: 1.1rem; }
  .food-dish-card__button { display: grid; grid-template-columns: 42% minmax(0, 1fr); min-height: 150px; }
  .food-dish-card__image-wrap { height: 100%; min-height: 150px; aspect-ratio: auto; }
  .food-dish-card__body { padding: .8rem; }
  .food-dish-card__summary { min-height: 0; margin-top: .4rem; font-size: .75rem; }
  .food-dish-card__cta { padding-top: .55rem; font-size: .68rem; }
  .food-atlas-compare { grid-template-columns: minmax(0, 1fr); gap: 1rem; padding: 1rem; }
  .food-atlas-compare__visual { gap: .4rem; }
  .food-atlas-compare__dish span { padding-inline: .55rem; font-size: .48rem; }
  .food-atlas-compare__dish strong { padding-inline: .55rem; font-size: .95rem; }
  .food-atlas-compare__bridge { gap: .1rem; }
  .food-atlas-compare__bridge i { width: .7rem; }
  .food-experience__inner { gap: .85rem; padding: .65rem .65rem max(.8rem, env(safe-area-inset-bottom)); }
  .food-experience__topbar { position: sticky; top: 0; z-index: 3; padding: .2rem 0 .45rem; background: linear-gradient(180deg, rgb(3 18 37 / 84%), transparent); }
  .food-experience__brand > span { width: 2.2rem; height: 2.2rem; }
  .food-experience__brand strong { font-size: .72rem; }
  .food-experience__brand small { font-size: .52rem; }
  .food-experience__close { width: 2.6rem; height: 2.6rem; }
  .food-experience__layout { grid-template-columns: minmax(0, 1fr); gap: .8rem; }
  .food-experience__visual { border-radius: 1rem; }
  .food-experience__visual img { max-height: 34vh; aspect-ratio: 16 / 9; }
  .food-experience__visual figcaption { padding: .5rem .7rem; font-size: .59rem; }
  .food-experience__glass { padding: .9rem; border-radius: 1rem; }
  .food-experience__glass h2 { font-size: clamp(2.15rem, 10vw, 3.3rem); }
  .food-experience__lead { margin: .6rem 0 .85rem; font-size: .9rem; }
  .food-experience__detail-grid { grid-template-columns: 1fr; gap: .55rem; }
  .food-experience__detail-grid section:first-child { grid-column: auto; }
  .food-experience__detail-grid section { padding: .7rem .75rem; }
  .food-experience__detail-grid section > p:last-child { font-size: .79rem; }
  .food-experience__sources { grid-template-columns: 1fr; gap: .45rem; }
  .food-experience__footer { flex-direction: column; gap: .2rem; font-size: .57rem; }
  .food-experience__footer span:last-child { text-align: left; }
}
@media (max-width: 360px) {
  .food-dish-card__button { grid-template-columns: 39% minmax(0, 1fr); }
  .food-dish-card__title { font-size: 1.12rem; }
  .food-dish-card__country { font-size: .49rem; letter-spacing: .08em; }
  .food-atlas-filter { font-size: .66rem; }
}
@media (prefers-reduced-motion: reduce) {
  .food-dish-card, .food-dish-card__image, .food-dish-card__cta b, .food-atlas-filter, .food-experience__close { transition: none !important; }
  .food-dish-card:hover { transform: none; }
  .food-dish-card:hover .food-dish-card__image { transform: none; }
}
@media (forced-colors: active) {
  .food-dish-card, .food-atlas-compare, .food-atlas-hero, .food-experience__glass, .food-experience__detail-grid section { border: 1px solid CanvasText; }
  .food-atlas-filter[aria-pressed="true"] { outline: 2px solid Highlight; }
  .food-experience__sources a, .food-experience__lead, .food-experience__detail-grid section > p:last-child { color: CanvasText; }
}
