/* ==========================================================================
   1. VARIABLES & FONTS
   ========================================================================== */
@font-face {
  font-family: "ZicateSans";
  src: url("../assets/fonts/ZicateSans.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}

@font-face {
  font-family: "ZicateSerifSource4";
  src: url("../assets/fonts/ZicateSerifSource4.woff2") format("woff2");
  font-weight: 200 900;
  font-style: normal;
  font-display: swap;
}

:root {
  --dark: #0b0906; --dark2: #11100d; --cream: #f8f1e8; --cream2: #fffaf3;
  --panel: #f5ecdf; --ink: #211e1a; --muted: #655f58; --muted2: #7a7268;
  --gold: #b77a2c; --gold2: #cc9b59; --line: #dfccb0;
  --hero-image-max: 1902px; --hero-ratio: 1902 / 704;
  --section-4-5-height: 648px;
  --font-sans: "ZicateSans", Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --font-serif: "ZicateSerifSource4", Georgia, "Times New Roman", serif;
}

/* ==========================================================================
   2. GLOBALS & TYPOGRAPHY
   ========================================================================== */
* { box-sizing: border-box; }

html {
  margin: 0;
  max-width: 100%;
  overflow-x: clip;
  background: var(--dark);
}

body {
  margin: 0;
  min-width: 320px;
  max-width: 100%;
  overflow-x: clip;
  background: var(--dark);
  color: var(--ink);
  font-family: var(--font-sans);
  letter-spacing: 0;
  font-optical-sizing: auto;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a { color: inherit; text-decoration: none; }
.nowrap { white-space: nowrap; }
.center { text-align: center; }

.light { background: linear-gradient(180deg, #fffaf3, #f5ebdc); }

.container { width: min(1268px, calc(100% - 56px)); margin: 0 auto; position: relative; }

.serif, .stepnum { font-family: var(--font-serif); font-weight: 400; letter-spacing: -.028em; }

.hospitality h2, .human h2, .scale h2, .road h2, .intelligence h2, .beverage h2 {
  font-family: var(--font-serif); font-weight: 620; letter-spacing: -.014em; line-height: 1.075;
}

.statement h1 {
  font-family: var(--font-serif); font-weight: 620; letter-spacing: -.010em; margin: 0; 
  color: #f5efe7; text-shadow: 0 2px 16px rgba(0,0,0,.55);
  display: block; width: 100%; text-align: center;
  font-size: 53px; line-height: 1.07;
}
.statement h1 span { 
  display: block; width: 100%; text-align: center;
  color: var(--gold); font-weight: 600; font-size: 51px; 
}

@media (min-width: 1201px) {
  html[lang="en"] .statement h1 span { white-space: nowrap; }
}

.hospitality h2 span, .human h2 span, .scale h2 span, .road h2 span { font-weight: 600; color: var(--gold); }

.feature h3, .bev-card h3, .scale-card h3, .road-item h3, .form h4, .partner-card h4 {
  font-family: var(--font-serif); font-weight: 620; letter-spacing: -.006em; line-height: 1.12;
}

.eyebrow { font-family: var(--font-sans); font-size: 12.6px; font-weight: 760; letter-spacing: .15em; line-height: 1.15; text-transform: uppercase; color: var(--gold); }
.zmark { display: flex; align-items: center; justify-content: center; gap: 18px; margin: 22px 0 20px; color: var(--gold); font-family: var(--font-serif); font-size: 20px; font-weight: 600; letter-spacing: .28em; }
.zmark:before, .zmark:after { content: ""; width: 54px; height: 1px; background: var(--gold); }

/* ==========================================================================
   3. NAVIGATION & FOOTER
   ========================================================================== */
.nav { height: 62px; background: linear-gradient(90deg, #080605 0%, #120e0a 58%, #080605 100%); border-bottom: 1px solid rgba(190, 132, 52, .28); position: relative; z-index: 5; }
.nav .inner { height: 62px; width: min(1320px, calc(100% - 56px)); margin: 0 auto; display: flex; align-items: center; justify-content: space-between; }
.logo { color: var(--gold); font-family: var(--font-sans); font-size: 31px; font-weight: 650; letter-spacing: .32em; line-height: 1; white-space: nowrap; display: flex; align-items: center; }
.logo-img { display: block; width: auto; height: 34px; }
.navlinks { display: flex; gap: 42px; color: #f1e8dc; font-family: var(--font-sans); font-size: 16px; text-shadow: 0 2px 10px #000; }
.lang-switch { display: flex; align-items: center; gap: 12px; color: #f1e8dc; font-family: var(--font-sans); font-size: 13.5px; font-weight: 750; letter-spacing: .14em; text-transform: uppercase; }
.lang-switch a { color: #c7bba9; transition: color .18s ease; }
.lang-switch a:hover, .lang-switch a.active { color: var(--gold2); }
.lang-switch span { color: #7b6750; }

.footer { height: 70px; background: linear-gradient(90deg, #070504, #0f0d0b, #070504); border-top: 1px solid rgba(185, 125, 45, .45); color: #d8cabc; }
.footer .container { height: 70px; display: flex; align-items: center; justify-content: space-between; }
.footer .logo { font-size: 24px; }
.footer-links { display: flex; gap: 36px; font-family: var(--font-sans); font-size: 13px; }
.footer-links span:nth-child(4)::after { content: ""; }
.copyright { font-size: 11px; color: #9e9284; }

/* ==========================================================================
   4. HERO & STATEMENT
   ========================================================================== */
.hero { width: 100%; height: auto; min-height: 0; max-height: none; aspect-ratio: auto; position: relative; background: #0b0906; overflow: hidden; display: flex; justify-content: center; align-items: flex-start; border-bottom: 1px solid rgba(181, 118, 42, .45); }
.hero::before { content: ""; position: absolute; inset: -28px; background-image: url("../assets/hero-1440.webp"); background-size: cover; background-position: center center; filter: blur(26px) brightness(.46) saturate(1.04); transform: scale(1.04); opacity: .95; pointer-events: none; }
.hero picture { position: relative; z-index: 1; display: block; width: min(100%, var(--hero-image-max)); margin: 0 auto; }
.hero img { width: 100%; height: auto; max-width: 100%; object-fit: contain; object-position: center center; display: block; }
.hero:after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: clamp(72px, 10vw, 170px); background: linear-gradient(0deg, rgba(10, 8, 5, .50), rgba(10, 8, 5, 0)); pointer-events: none; z-index: 2; }

.statement { 
  position: relative; background: radial-gradient(circle at 50% 0%, rgba(173, 111, 36, .16), transparent 40%), linear-gradient(180deg, #12100e 0%, #070605 100%); 
  color: #efe7db; border-bottom: 1px solid rgba(192, 135, 56, .35); overflow: hidden; min-height: 390px; 
  display: block; 
}
.statement:before { content: ""; position: absolute; inset: 0; background: linear-gradient(145deg, rgba(255, 255, 255, .045), transparent 30%, rgba(255, 255, 255, .025) 72%, transparent), radial-gradient(circle at 40% 35%, rgba(255, 255, 255, .035), transparent 35%); opacity: .9; }

.statement .container { 
  position: relative; display: block; width: min(1268px, calc(100% - 56px)); margin: 0 auto; padding: 64px 0 72px; box-sizing: border-box; 
}
.statement .copy { display: block; margin: 0 auto; max-width: 1160px; text-align: center; }
.statement p { display: block; max-width: 880px; margin: 0 auto; font-size: 17.6px; line-height: 1.72; text-align: center; }

.actions { position: absolute; right: 0; bottom: 46px; width: 286px; display: flex; flex-direction: column; align-items: stretch; justify-content: center; z-index: 2; gap: 16px; }
.actions a { cursor: pointer; }
.btn { height: 50px; width: 100%; padding: 0 22px; white-space: nowrap; display: flex; align-items: center; justify-content: center; gap: 18px; font-family: var(--font-sans); font-size: 13.2px; font-weight: 760; letter-spacing: .025em; }
.btn.gold { color: #fff; background: linear-gradient(180deg, #d19742, #a66a21); box-shadow: 0 10px 24px rgba(0, 0, 0, .35); }
.btn.outline { color: var(--gold2); border: 2px solid #8c5f28; background: rgba(0, 0, 0, .18); }
.btn b { font-size: 19px; font-weight: 500; }
.statement .actions { display: none; } 

/* ==========================================================================
   5. SECTIONS BASE LAYOUT
   ========================================================================== */
section.hospitality, section.intelligence, section.human, section.beverage, section.scale, section.road, section.contact {
  height: var(--section-4-5-height); min-height: var(--section-4-5-height); display: flex; align-items: center; overflow: hidden; padding: 0;
}

.hospitality .container, .intelligence .container, .human .container, .beverage .container, .scale .container, .road .container, .contact .container {
  width: min(1320px, calc(100% - 56px)); margin: 0 auto;
}

.icon { border: 2px solid var(--gold2); border-radius: 50%; display: grid; place-items: center; color: var(--gold); }

/* Hospitality */
.hospitality .split { display: grid; grid-template-columns: 550px 1fr; gap: 78px; align-items: center; }
.hospitality h2 { font-size: 52px; max-width: 560px; margin: 18px 0 25px; }
.hospitality p { font-size: 18px; line-height: 1.72; color: #5d564f; margin: 0; max-width: 560px; }
.venue-img { height: 384px; border-radius: 5px; overflow: hidden; box-shadow: 0 22px 55px rgba(56, 35, 15, .18); border: 1px solid rgba(174, 123, 55, .22); }
.venue-img picture, .human-img picture, .road-img picture { display: block; width: 100%; height: 100%; }
.bev-card picture { display: block; width: 100%; }
.venue-img img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Intelligence */
.intelligence { background: linear-gradient(180deg, #f9f3ea, #f5ecdf); }
.intelligence h2 { font-size: 50px; line-height: 1.08; margin-top: 14px; }
.features { margin-top: 44px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.feature { min-height: 184px; border: 1px solid var(--line); border-radius: 15px; background: rgba(255, 252, 247, .76); display: grid; grid-template-columns: 72px 1fr; gap: 22px; align-items: center; padding: 30px 28px; }
.feature .icon { width: 72px; height: 72px; }

/* Feature titles can wrap naturally. */
.feature h3 { font-size: 21px; line-height: 1.16; margin: 0 0 10px; color: #2d2823; }
.feature p { font-size: 16.2px; line-height: 1.58; color: #5f5851; margin: 0; max-width: 300px; }

/* Human */
.human { background: linear-gradient(180deg, #fffaf3, #f7efe4); }
.human .split { display: grid; grid-template-columns: 590px 1fr; gap: 78px; align-items: center; }
.human h2 { font-size: 48px; max-width: 590px; margin: 14px 0 24px; }
.human p { font-size: 17.4px; line-height: 1.65; color: #5d564f; margin: 0; max-width: 585px; }
.human-img { height: 350px; border-radius: 5px; overflow: hidden; box-shadow: 0 22px 55px rgba(56, 35, 15, .18); }
.human-img img { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; }
.mini-grid { margin-top: 34px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; }
.mini { padding: 0 18px; text-align: center; border-right: 1px solid #d7c4aa; }
.mini:first-child { padding-left: 0; }
.mini:last-child { border-right: 0; padding-right: 0; }
.mini svg { width: 40px; height: 40px; color: var(--gold); margin-bottom: 10px; stroke-width: 2.1; }
.mini h4 { font-family: var(--font-sans); font-size: 14.2px; font-weight: 780; letter-spacing: .01em; line-height: 1.23; margin: 0 0 9px; }
.mini p { font-size: 15.4px; line-height: 1.54; color: #5f5851; margin: 0; }

/* Beverage */
.beverage { background: #fbf7ef; }
.beverage .center { text-align: center; max-width: 1220px; margin: 0 auto; }
.beverage h2 { font-size: 50px; line-height: 1.08; margin: 14px 0 0; }
.beverage .sub { font-size: 17.4px; font-weight: 700; color: #5c554e; margin-top: 16px; margin-bottom: 10px; line-height: 1.50; }
.bev-grid { margin-top: 42px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; text-align: left; max-width: 1040px; margin: 0 auto; }
.bev-card { border: 1px solid var(--line); border-radius: 13px; overflow: hidden; background: rgba(255, 255, 255, .65); box-shadow: 0 16px 34px rgba(71, 47, 19, .065); }
.bev-card img { width: 100%; height: 170px; object-fit: cover; display: block; }
.bev-copy { padding: 24px 28px 28px; }
.bev-card h3 { font-size: 24px; line-height: 1.02; margin: 0 0 10px; color: #2d2823; }
.bev-card p { font-size: 16px; line-height: 1.58; color: #5f5851; margin: 0; }

/* Scale */
.scale { background: linear-gradient(180deg, #fffaf3, #f2e7d7); }
.scale h2 { font-size: 54px; line-height: 1.07; margin: 14px 0 22px; }
.scale .lead { font-size: 18.4px; line-height: 1.68; color: #625a53; max-width: 820px; margin: 0 0 44px;text-align: left; }
.scale-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; max-width: 1180px; margin: 0 auto; }
.scale-card { padding: 0 8px; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 12px; }
.scale-card .icon { width: 68px; height: 68px; border-width: 1.8px; margin-bottom: 10px; background: rgba(255, 250, 243, .48); }
.scale-card h3 { font-size: 20px; line-height: 1.12; margin: 0 0 8px; color: #2b2621; }
.scale-card p { font-size: 15px; line-height: 1.56; color: #5f5851; margin: 0; max-width: 220px; }

/* Road */
.road { background: linear-gradient(180deg, #f7efe4, #efe2d0); }
.road-layout { display: grid; grid-template-columns: 635px 1fr; gap: 82px; align-items: center; }
.road h2 { font-size: 46px; line-height: 1.08; margin: 14px 0 30px; max-width: 600px; }
.road-flow { max-width: 610px; }
.road-item { padding: 0; }
.road-item h3 { font-size: 24px; line-height: 1.12; margin: 0 0 8px; color: #211e1a; }
.road-item p { font-size: 16px; line-height: 1.58; color: #5f5851; margin: 0; max-width: 565px; }
.down-arrow { font-family: var(--font-serif); color: var(--gold); font-size: 24px; line-height: 1; margin: 10px 0; }
.road-img { height: 418px; overflow: hidden; border-radius: 5px; box-shadow: 0 22px 55px rgba(56, 35, 15, .18); border: 1px solid rgba(0, 0, 0, .15); }
.road-img img { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; }

/* Contact */
.contact { background: #efe2d0; padding: 0 0 28px; }
.contact-panel { display: grid; grid-template-columns: 500px 1fr; gap: 120px; padding: 58px 68px; align-items: center; background: linear-gradient(90deg, #efe6d7 0%, #f8f1e7 100%); border: 1px solid #dbc7aa; box-shadow: 0 12px 34px rgba(61, 39, 17, .07); }
.contact h3 { font-size: 13px; margin: 0 0 20px; letter-spacing: .13em; }
.contact p { font-size: 16.8px; line-height: 1.76; color: #5f5851; margin: 0; max-width: 500px; }
.form { display: block; padding-left: 8px; position: relative; }
.form h4 { font-size: 34px; line-height: 1.08; margin: 0 0 24px; color: #1f1b17; text-transform: none; }
.fields { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 16px; }
.field { width: 100%; height: 42px; border: 1px solid #c9b9a4; background: rgba(255, 255, 255, .55); padding: 9px 12px; color: #5f5851; font-size: 15px; line-height: 1.2; font-family: var(--font-sans); outline: none; display: flex; align-items: center; }
.field::placeholder { color: #7c746b; opacity: 1; }
textarea.field { resize: vertical; min-height: 74px; }
.field.full { grid-column: 1 / 3; height: 92px; align-items: flex-start; padding-top: 12px; }

.contact .direct-inquiry {
  margin-top: 18px;
  max-width: 560px;
  color: #756c62;
}
.contact .direct-inquiry a {
  color: #9a641f;
  font-weight: 760;
  text-decoration: none;
}

.captcha-wrap {
  margin: 18px 0 0;
  min-height: 78px;
}

.contact .form-note {
  margin: 16px 0 0;
  max-width: 390px;
  font-size: 12px;
  line-height: 1.5;
  color: #7c746b;
}
html[lang="de"] .contact .form-note {
  max-width: 420px;
}
.form-result {
  display: none;
  margin: 16px 0 0;
  max-width: 430px;
  padding: 14px 16px;
  border-radius: 16px;
  font-size: 15px;
  line-height: 1.55;
  font-weight: 650;
}
.w-form-done {
  display: block;
  color: #7b551f;
  background: rgba(189, 132, 47, .16);
  border: 1px solid rgba(189, 132, 47, .42);
  box-shadow: 0 12px 34px rgba(96, 58, 18, .08);
}
.w-form-fail {
  display: block;
  color: #8a3e32;
  background: rgba(154, 76, 61, .10);
  border: 1px solid rgba(154, 76, 61, .28);
}

.send:disabled {
  cursor: wait;
  opacity: .68;
}

.send { margin-top: 18px; margin-left: auto; display: block; border: 0; background: linear-gradient(180deg, #bd842f, #a46a20); height: 46px; width: 226px; color: #fff; text-transform: uppercase; letter-spacing: .05em; font-weight: 780; font-size: 12.6px; cursor: pointer; font-family: var(--font-sans); }
input[type="hidden"] { display: none; }

/* ==========================================================================
   6. GLOBAL DE (GERMAN) OVERRIDES
   ========================================================================== */
html[lang="de"] .nav .inner { width: min(1280px, calc(100% - 56px)); }
html[lang="de"] .navlinks { gap: 24px; font-size: 13px; }
html[lang="de"] .logo { letter-spacing: .22em; }
html[lang="de"] .statement h1 { font-size: 49px; line-height: 1.07; }
html[lang="de"] .statement h1 span { font-size: 48px; white-space: normal; }
html[lang="de"] .statement p { max-width: 930px; margin: 0 auto; }
html[lang="de"] .hospitality .split { grid-template-columns: 555px 1fr; gap: 64px; }
html[lang="de"] .hospitality h2 { font-size: 49px; line-height: 1.08; max-width: 570px; }
html[lang="de"] .hospitality p { font-size: 16.8px; line-height: 1.62; max-width: 555px; }
html[lang="de"] .intelligence h2 { font-size: 45px; }
html[lang="de"] .beverage h2 { font-size: 43px; }
html[lang="de"] .feature { padding: 28px 28px; gap: 22px; }
html[lang="de"] .feature h3 { font-size: 20px; line-height: 1.16; }
html[lang="de"] .feature p { font-size: 15.3px; line-height: 1.52; max-width: 310px; }
html[lang="de"] .human .split { grid-template-columns: 590px 1fr; gap: 68px; }
html[lang="de"] .human h2 { font-size: 42px; line-height: 1.08; max-width: 590px; }
html[lang="de"] .human p { font-size: 16.2px; line-height: 1.58; max-width: 560px; }
html[lang="de"] .mini h4 { font-size: 13.2px; }
html[lang="de"] .mini p { font-size: 14px; line-height: 1.45; }
html[lang="de"] .beverage .sub { font-size: 16.4px; line-height: 1.55; }
html[lang="de"] .scale h2 { font-size: 47px; }
html[lang="de"] .scale .lead { font-size: 16.8px; line-height: 1.58; max-width: 880px; }
html[lang="de"] .scale-grid { gap: 28px; }
html[lang="de"] .scale-card h3 { font-size: 19px; }
html[lang="de"] .scale-card p { font-size: 14.2px; line-height: 1.46; max-width: 195px; }
html[lang="de"] .road-layout { grid-template-columns: 625px 1fr; gap: 70px; }
html[lang="de"] .road h2 { font-size: 42px; max-width: 620px; }
html[lang="de"] .road-flow { max-width: 610px; }
html[lang="de"] .road-item h3 { font-size: 22px; }
html[lang="de"] .road-item p { font-size: 15.2px; line-height: 1.48; }
html[lang="de"] .contact-panel { grid-template-columns: 500px 1fr; gap: 92px; }
html[lang="de"] .contact p { font-size: 16.2px; line-height: 1.64; }
html[lang="de"] .form h4 { font-size: 33px; }


/* German page typography refinements */
html[lang="de"] h1,
html[lang="de"] h2,
html[lang="de"] h3,
html[lang="de"] h4 {
  text-wrap: balance;
}

html[lang="de"] p,
html[lang="de"] .sub {
  text-wrap: pretty;
}

html[lang="de"] .eyebrow {
  letter-spacing: .14em;
}

html[lang="de"] .feature:nth-child(3) h3,
html[lang="de"] .scale-card h3 {
  letter-spacing: -.01em;
}

html[lang="de"] .human h2 span {
  display: block;
}

html[lang="de"] .scale-card p {
  max-width: 215px;
}

/* ==========================================================================
   7. MEDIA QUERIES (PURE DOWNWARD CASCADE)
   ========================================================================== */
@media (max-width: 1200px) {
  .statement .container { padding: 76px 0; }
  .actions { position: static; transform: none; margin: 32px auto 0; flex-direction: row; width: auto; justify-content: center; }
  
  /* Reduce complex grids on tablet-sized screens. */
  .hospitality .split, .human .split, .road-layout,
  html[lang="de"] .hospitality .split, html[lang="de"] .human .split, html[lang="de"] .road-layout, html[lang="de"] .contact-panel {
    grid-template-columns: 1fr; gap: 42px;
  }
  
  .contact-panel { padding: 48px 42px; gap: 60px; grid-template-columns: 1fr; }
  .venue-img, .human-img, .road-img { height: 380px; }
  .road-flow { max-width: 760px; }
  
  .features, .bev-grid { grid-template-columns: repeat(2, 1fr); }
  .scale-grid { grid-template-columns: repeat(2, 1fr); gap: 40px; }
  
  section.hospitality, section.intelligence, section.human, section.beverage, section.scale, section.road, section.contact { height: auto; min-height: 0; padding: 76px 0; overflow: visible; display: block; }
  
  html[lang="de"] .navlinks { gap: 20px; font-size: 13px; }
}

@media (max-width: 900px) {
  body { width: auto; }
  
  .container, 
  .hospitality .container, .intelligence .container, .human .container, .beverage .container, .scale .container, .road .container, .contact .container, 
  .statement .container { width: calc(100% - 36px); }
  
  .nav { height: auto; }
  .nav .inner, html[lang="de"] .nav .inner { width: calc(100% - 36px); height: auto; padding: 18px 0; align-items: center; flex-direction: row; gap: 18px; }
  .logo { font-size: 26px; }
  .logo-img { height: 30px; }
  .navlinks { flex-wrap: wrap; gap: 14px 20px; font-size: 14px; }
  .lang-switch { font-size: 12px; gap: 10px; }
  
  .hero { height: auto; min-height: 0; aspect-ratio: auto; }
  .hero picture { width: 100%; }
  .hero img { width: 100%; height: auto; }
  
  .statement { padding: 70px 0; min-height: auto; display: block; }
  .statement .container { padding: 0; }
  .statement h1 { font-size: 39px; line-height: 1.08; }
  .statement h1 span { font-size: 39px; white-space: normal; }
  html[lang="de"] .statement h1 { font-size: 34px; }
  html[lang="de"] .statement h1 span { font-size: 34px; }
  .statement p { font-size: 16.5px; line-height: 1.65; max-width: 100%; padding: 0 16px; }
  .statement .copy { max-width: 760px; }
  .actions { flex-direction: column; width: 286px; margin: 32px auto 0; }
  .actions .btn { width: 100%; }
  
  .hospitality, .intelligence, .human, .beverage, .scale, .road, .contact { padding: 70px 0; display: block; height: auto; min-height: 0; overflow: visible; }
  .hospitality h2, .human h2, .scale h2, .road h2, .intelligence h2, .beverage h2 { font-size: 37px; line-height: 1.10; }
  
  .hospitality p, .human p, .scale .lead, .contact p { font-size: 16.2px; line-height: 1.72; }
  .feature p, .bev-card p, .scale-card p, .road-item p, .mini p { font-size: 15.3px; line-height: 1.62; }
  
  .features, .bev-grid, .scale-grid { grid-template-columns: 1fr; gap: 20px; }
  .feature { grid-template-columns: 72px 1fr; padding: 24px; min-height: auto; }
  
  .feature .icon { width: 72px; height: 72px; }
  .scale-card .icon { width: 68px; height: 68px; }
  
  .mini-grid { grid-template-columns: 1fr; gap: 22px; }
  /* Reset the desktop mini-card spacing for mobile. */
  .mini,
  .mini:first-child,
  .mini:last-child { border-right: 0; border-bottom: 1px solid #d7c4aa; padding-bottom: 22px; padding-left: 0; padding-right: 0;}
  .mini:last-child { border-bottom: 0; padding-bottom: 0;}
  
  .venue-img, .human-img, .road-img { height: 320px; }
  .fields { grid-template-columns: 1fr; }
  .field.full { grid-column: auto; }
  
  .footer { height: auto; }
  .footer .container { height: auto; padding: 26px 0; gap: 18px; align-items: flex-start; flex-direction: column; }
  .footer-links { flex-wrap: wrap; gap: 16px 24px; }
  /* Center feature cards on mobile. */
  .feature {grid-template-columns: 1fr; text-align: center; justify-items: center; padding: 32px 20px; gap: 16px;}
  .feature h3, 
  .feature p {text-align: center; margin-left: auto; margin-right: auto;}
  .nowrap { white-space: normal; }
  .human .mini-grid .mini h4,
  .human .mini-grid .mini p {text-align: center; max-width: none; width: 100%; margin: 0 auto; }
  .mini-grid .mini:first-child,
  .mini-grid .mini:last-child {padding-left: 0; padding-right: 0;}
  .contact-panel {padding: 46px 24px; gap: 36px;}
  .form {padding-left: 0; width: 100%; max-width: 100%; margin: 0 auto;}
  .fields {width: 100%;}
  .field {width: 100%;}
  .send {margin-left: 0; margin-right: auto;}
}

@media (max-width: 520px) {
  .hero { 
    height: auto; 
    min-height: auto; 
    padding: 0; 
  }
  .hero::before {
    display: none; 
  }
  .hospitality h2, .human h2, .scale h2, .intelligence h2, .beverage h2, .road h2 { font-size: 31px; }
  .venue-img, .human-img, .road-img { height: 240px; }
  .feature { grid-template-columns: 1fr; text-align: center; justify-items: center; }

  html[lang="de"] .hospitality h2, 
  html[lang="de"] .human h2, 
  html[lang="de"] .scale h2, 
  html[lang="de"] .intelligence h2, 
  html[lang="de"] .beverage h2, 
  html[lang="de"] .road h2 { 
    font-size: 28px;
  }
  html[lang="de"] p {
    overflow-wrap: break-word;
    hyphens: auto;
  }
}
/* ==========================================================================
   12. LEGAL PAGES
   ========================================================================== */
.footer-links a { color: #d8cabc; transition: color .18s ease; }
.footer-links a:hover { color: var(--gold2); }

.legal-page { background: var(--dark); }
.legal-hero { position: relative; padding: 82px 0 76px; background: radial-gradient(circle at 50% 0%, rgba(183, 122, 44, .18), transparent 42%), linear-gradient(180deg, #14110d 0%, #070605 100%); color: #f5efe7; border-bottom: 1px solid rgba(192, 135, 56, .35); }
.legal-hero h1 { margin: 10px 0 16px; font-size: clamp(44px, 7vw, 74px); line-height: 1.02; color: #f5efe7; }
.legal-hero p { max-width: 780px; margin: 0; color: #d8cabc; font-size: 17px; line-height: 1.65; }
.legal-content { padding: 72px 0 86px; }
.legal-wrap { max-width: 980px; }
.legal-card { padding: clamp(28px, 5vw, 58px); background: rgba(255, 250, 243, .78); border: 1px solid rgba(183, 122, 44, .22); box-shadow: 0 22px 70px rgba(52, 34, 14, .12); }
.legal-card h2 { margin: 34px 0 12px; font-family: var(--font-serif); font-size: 28px; line-height: 1.15; font-weight: 620; letter-spacing: -.008em; color: #2d241b; }
.legal-card h2:first-child { margin-top: 0; }
.legal-card p, .legal-card li { color: #514a42; font-size: 16.5px; line-height: 1.76; }
.legal-card p { margin: 0 0 18px; }
.legal-card ul { margin: 0 0 22px; padding-left: 22px; }
.legal-card a { color: var(--gold); border-bottom: 1px solid rgba(183, 122, 44, .34); }
.legal-note { margin-top: 42px; color: #83786d; font-size: 13px; }

@media (max-width: 760px) {
  .legal-hero { padding: 58px 0 54px; }
  .legal-content { padding: 42px 0 58px; }
  .legal-card { padding: 26px 22px; }
  .legal-card h2 { font-size: 24px; }
  .legal-card p, .legal-card li { font-size: 15.5px; }
}


@media (max-width: 520px) {
  html[lang="de"] .eyebrow {
    letter-spacing: .11em;
  }

  html[lang="de"] .scale-card h3 {
    font-size: 20px;
  }
}