/* =========================================================
       HERO
    ========================================================= */

    .hero {
      min-height: 100vh;
      position: relative;
      overflow: hidden;
      background:
        radial-gradient(
          circle at 5% 0%,
          rgba(210, 10, 91, 0.16),
          transparent 35%
        ),
        var(--bg);
    }
/* subtle grain */
    .hero::before {
      content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
      opacity: 0.17;
      z-index: 1;

      background-image:
        url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='.08'/%3E%3C/svg%3E");
    }
/* =========================================================
       FULL-BLEED HERO IMAGE (right half, top → bottom)
    ========================================================= */

    .hero-bg-image {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      width: 56%;
      z-index: 0;
      overflow: hidden;
    }
.hero-bg-image img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transform: scale(1.02);
      transition: transform 1.4s cubic-bezier(.2,.7,.2,1);
    }
.hero-bg-image:hover img {
      transform: scale(1.05);
    }
/* Fade from paper (left) into image (right) */
    .hero-bg-image::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 2;
      background:
        linear-gradient(
          to right,
          var(--bg) 0%,
          rgba(245, 243, 238, 0.92) 8%,
          rgba(245, 243, 238, 0.55) 18%,
          rgba(245, 243, 238, 0.15) 30%,
          transparent 45%
        ),
        linear-gradient(
          to bottom,
          rgba(13, 25, 21, 0.02) 0%,
          rgba(13, 25, 21, 0.18) 100%
        );
      pointer-events: none;
    }
.hero-inner {
      width: min(calc(100% - 48px), var(--container));
      margin: 0 auto;
      position: relative;
      z-index: 3;
    }
/* =========================================================
       NAVBAR
    ========================================================= */

    .navbar {
      height: 104px;

      display: grid;
      grid-template-columns: 1fr auto 1fr;
      align-items: center;

      border-bottom: 1px solid var(--line);
    }
.brand {
      display: flex;
      align-items: center;
      gap: 14px;
      width: fit-content;
    }
.brand-logo {
      height: 48px;
      width: auto;
      display: block;
    }
.nav-links {
      display: flex;
      align-items: center;
      gap: 38px;
    }
.nav-links a {
      position: relative;
      font-size: 14px;
      color: #626c68;

      transition:
        color 0.3s ease,
        transform 0.3s ease;
    }
.nav-links a::after {
      content: "";
      position: absolute;

      left: 0;
      bottom: -7px;

      width: 100%;
      height: 1px;

      background: var(--dark);

      transform: scaleX(0);
      transform-origin: right;

      transition: transform 0.3s ease;
    }
.nav-links a:hover {
      color: var(--dark);
    }
.nav-links a:hover::after {
      transform: scaleX(1);
      transform-origin: left;
    }
.nav-action {
      justify-self: end;
    }
.nav-btn {
      min-height: 52px;

      padding: 0 24px;

      display: inline-flex;
      align-items: center;
      gap: 13px;

      background: var(--dark);
      color: white;

      border-radius: 100px;

      font-size: 13px;
      font-weight: 600;

      transition:
        transform 0.3s ease,
        background 0.3s ease;
    }
.nav-btn:hover {
      transform: translateY(-2px);
      background: #293632;
    }
.nav-btn svg {
      width: 17px;
    }
/* =========================================================
       HERO MAIN GRID
    ========================================================= */

    .hero-grid {
      min-height: calc(100vh - 104px);

      display: grid;
      grid-template-columns:
        minmax(460px, 0.88fr)
        minmax(600px, 1.12fr);

      gap: 64px;

      align-items: center;

      padding: 62px 0 72px;
    }
/* =========================================================
       LEFT CONTENT
    ========================================================= */

    .hero-content {
      position: relative;
      z-index: 4;
      max-width: 675px;
    }
.eyebrow {
      display: flex;
      align-items: center;
      gap: 12px;

      margin-bottom: 30px;

      color: var(--mint-dark);

      font-size: 11px;
      font-weight: 600;

      letter-spacing: 0.2em;
      text-transform: uppercase;
    }
.eyebrow-dot {
      width: 7px;
      height: 7px;
      background: var(--mint);
      border-radius: 50%;

      box-shadow: 0 0 0 7px rgba(210, 10, 91, 0.15);
    }
.hero-title {
      font-family: "Playfair Display", serif;
      font-weight: 400;

      font-size: clamp(65px, 5.1vw, 94px);
      line-height: 0.94;
      letter-spacing: -0.065em;

      color: var(--dark);
    }
.hero-title .accent {
      color: var(--mint-dark);
      font-style: italic;
    }
.hero-title-line {
      display: block;
    }
.hero-description {
      max-width: 620px;

      margin-top: 34px;

      font-family: "Manrope", sans-serif;

      font-size: 17px;
      line-height: 1.75;

      color: var(--text-soft);
    }
.hero-description strong {
      color: var(--dark);
      font-weight: 600;
    }
/* =========================================================
       ACTION BUTTONS
    ========================================================= */

    .hero-actions {
      display: flex;
      align-items: center;
      gap: 14px;

      margin-top: 34px;
    }
.btn {
      min-height: 58px;

      padding: 0 24px;

      border-radius: 100px;

      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 11px;

      border: 1px solid transparent;

      font-size: 13px;
      font-weight: 600;

      transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        background 0.3s ease;
    }
.btn svg {
      width: 17px;
      height: 17px;
    }
.btn-primary {
      background: var(--mint);
      color: #10231f;
      padding-left: 28px;
      padding-right: 24px;
    }
.btn-primary:hover {
      transform: translateY(-3px);

      box-shadow:
        0 15px 30px rgba(210, 10, 91, 0.18);
    }
.btn-outline {
      background: rgba(255,255,255,0.5);

      border-color: rgba(22, 33, 30, 0.14);

      color: var(--dark);

      backdrop-filter: blur(10px);
    }
.btn-outline:hover {
      background: white;
      transform: translateY(-3px);
    }
/* =========================================================
       RIGHT VISUAL COLUMN — carries the live card only
    ========================================================= */

    .hero-visual {
      position: relative;
      height: min(720px, calc(100vh - 165px));
      min-height: 590px;
    }
/* =========================================================
       LIVE CARD — small, subtle, not an eye-catcher
    ========================================================= */

    .live-card {
      width: 300px;

      position: absolute;

      right: 0;
      bottom: 24px;

      z-index: 5;

      background: rgba(253, 252, 248, 0.88);

      border: 1px solid rgba(255,255,255,0.6);

      border-radius: 18px;

      overflow: hidden;

      box-shadow:
        0 20px 40px rgba(13, 25, 21, 0.14),
        0 3px 8px rgba(13, 25, 21, 0.04);

      backdrop-filter: blur(20px);
      -webkit-backdrop-filter: blur(20px);
    }
/* =========================================================
       LIVE CARD HEADER
    ========================================================= */

    .live-header {
      padding: 14px 16px 12px;

      display: flex;
      justify-content: space-between;
      align-items: center;

      border-bottom: 1px solid rgba(22,33,30,0.07);
    }
.live-header-left {
      display: flex;
      flex-direction: column;
      gap: 4px;
    }
.live-label {
      display: flex;
      align-items: center;
      gap: 6px;

      color: var(--mint-dark);

      font-size: 8px;
      font-weight: 600;

      letter-spacing: 0.18em;
      text-transform: uppercase;
    }
.live-pulse {
      width: 6px;
      height: 6px;

      background: #d20a5b;

      border-radius: 50%;

      position: relative;
    }
.live-pulse::after {
      content: "";

      position: absolute;

      inset: -3px;

      border: 1px solid rgba(95, 198, 161, 0.5);

      border-radius: 50%;

      animation: pulse 2s infinite;
    }
.live-date {
      font-family: "Playfair Display", serif;

      font-size: 12px;
      color: var(--dark);
    }
.live-clock {
      font-family: "Playfair Display", serif;

      font-size: 18px;

      letter-spacing: -0.03em;

      color: var(--dark);
    }
/* =========================================================
       LOCATION LIST — compact
    ========================================================= */

    .location-list {
      padding: 4px 6px 4px;
    }
.location {
      min-height: 42px;

      padding: 7px 9px;

      display: grid;
      grid-template-columns: 22px 1fr auto;
      align-items: center;

      gap: 8px;

      border-radius: 10px;

      transition:
        background 0.25s ease;
    }
.location:hover {
      background: rgba(210, 10, 91, 0.11);
    }
.location-index {
      font-family: "Playfair Display", serif;

      font-size: 10px;
      color: #96a09c;
    }
.location-main {
      padding-right: 8px;
      min-width: 0;
    }
.location-name {
      font-size: 11px;
      font-weight: 600;

      line-height: 1.2;

      color: var(--dark);

      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
.location-address {
      margin-top: 2px;

      color: #a2aba8;

      font-size: 8px;
      font-weight: 500;

      letter-spacing: 0.06em;

      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
.location-status {
      display: flex;
      align-items: center;
      gap: 5px;

      font-size: 9px;
      font-weight: 500;

      white-space: nowrap;

      color: #39443f;
    }
.status-dot.closing {
      background: #d9a260;

      box-shadow:
        0 0 0 3px rgba(217, 162, 96, 0.14);
    }
/* =========================================================
       LIVE CARD FOOTER
    ========================================================= */

    .live-footer {
      min-height: 38px;

      padding: 0 14px;

      display: flex;
      align-items: center;
      justify-content: space-between;

      background: rgba(232, 239, 235, 0.5);

      border-top: 1px solid rgba(22,33,30,0.06);
    }
.live-footer-note {
      display: flex;
      align-items: center;
      gap: 6px;

      font-size: 8px;

      color: #7e8985;

      letter-spacing: 0.06em;
      text-transform: uppercase;
    }
.live-footer-note svg {
      width: 11px;
      height: 11px;

      color: var(--mint-dark);
    }
/* =========================================================
       SECTION · SOFORTHILFE (Quick Help)
    ========================================================= */

    .quick-help {
      padding: 24px 24px 0;
      background: #f5f3ee;
    }
.quick-help-inner {
      width: min(100%, 1460px);
      margin: 0 auto;

      position: relative;
      overflow: hidden;

      padding: 54px 58px 28px;

      border-radius: 30px;

      background:
        radial-gradient(
          circle at 85% 0%,
          rgba(210, 10, 91, 0.18),
          transparent 33%
        ),
        linear-gradient(
          135deg,
          #fdfcf8 0%,
          #f5f2eb 100%
        );

      border: 1px solid rgba(22, 33, 30, 0.08);

      box-shadow:
        0 24px 70px rgba(27, 39, 35, 0.05);
    }
/* decorative accent rings */

    .quick-help-inner::before {
      content: "";
      position: absolute;

      width: 320px;
      height: 320px;

      border-radius: 50%;

      right: -130px;
      top: -180px;

      border: 1px solid rgba(210, 10, 91, 0.22);

      pointer-events: none;
    }
.quick-help-inner::after {
      content: "";
      position: absolute;

      width: 190px;
      height: 190px;

      border-radius: 50%;

      right: -40px;
      top: -95px;

      border: 1px solid rgba(210, 10, 91, 0.18);

      pointer-events: none;
    }
/* section label */

    .quick-help-label {
      display: inline-flex;
      align-items: center;
      gap: 10px;

      margin-bottom: 30px;

      font-family: "DM Sans", sans-serif;
      font-size: 10px;
      font-weight: 600;

      letter-spacing: 0.18em;
      text-transform: uppercase;

      color: #a80846;
    }
.quick-help-dot {
      width: 7px;
      height: 7px;

      border-radius: 50%;

      background: #d20a5b;

      box-shadow:
        0 0 0 6px rgba(210, 10, 91, 0.14);
    }
/* main grid */

    .quick-help-content {
      display: grid;

      grid-template-columns:
        minmax(0, 1.15fr)
        minmax(390px, 0.85fr);

      gap: 70px;

      align-items: center;
    }
/* copy column */

    .quick-help-copy {
      max-width: 750px;
    }
.quick-help-kicker {
      margin-bottom: 14px;

      font-family: "DM Sans", sans-serif;

      font-size: 12px;
      font-weight: 600;

      letter-spacing: 0.08em;
      text-transform: uppercase;

      color: #85908c;
    }
.quick-help-copy h2 {
      margin: 0;

      font-family: "Playfair Display", serif;
      font-weight: 400;

      font-size: clamp(43px, 4vw, 68px);
      line-height: 1.02;

      letter-spacing: -0.045em;

      color: #18221f;
    }
.accent-script {
      font-style: italic;

      color: #dc845f;

      position: relative;
    }
.accent-script::after {
      content: "";

      position: absolute;

      left: 3%;
      right: 0;

      bottom: 3px;

      height: 7px;

      background: rgba(220, 132, 95, 0.16);

      border-radius: 20px;

      z-index: -1;
    }
.quick-help-copy p {
      max-width: 660px;

      margin-top: 24px;

      font-family: "Manrope", sans-serif;

      font-size: 16px;
      line-height: 1.75;

      color: #65716c;
    }
/* action cards */

    .quick-help-actions {
      display: flex;
      flex-direction: column;
      gap: 13px;
    }
.help-card {
      min-height: 92px;

      display: grid;

      grid-template-columns:
        50px
        1fr
        42px;

      gap: 16px;

      align-items: center;

      padding: 16px 18px;

      border-radius: 20px;

      background: rgba(255,255,255,0.76);

      border: 1px solid rgba(22, 33, 30, 0.09);

      color: #18221f;

      text-decoration: none;

      box-shadow:
        0 12px 35px rgba(31, 44, 39, 0.04);

      transition:
        transform 0.3s ease,
        background 0.3s ease,
        box-shadow 0.3s ease;
    }
.help-card:hover {
      transform: translateY(-3px);

      background: #ffffff;

      box-shadow:
        0 20px 45px rgba(31, 44, 39, 0.08);
    }
.help-card-icon {
      width: 50px;
      height: 50px;

      display: grid;
      place-items: center;

      border-radius: 15px;

      background: #fce4ee;

      color: #a80846;
    }
.help-card-icon svg {
      width: 20px;
      height: 20px;

      stroke-width: 1.7;
    }
/* SOS variant — warmer accent, echoes the "SOS" nature */
    .help-card.help-card-sos .help-card-icon {
      background: rgba(220, 132, 95, 0.14);
      color: #c96940;
    }
.help-card-copy {
      display: flex;
      flex-direction: column;
      gap: 5px;
      min-width: 0;
    }
.help-card-label {
      font-family: "DM Sans", sans-serif;

      font-size: 10px;
      font-weight: 600;

      letter-spacing: 0.08em;
      text-transform: uppercase;

      color: #8b9591;
    }
.help-card-copy strong {
      font-family: "DM Sans", sans-serif;

      font-size: 15px;
      font-weight: 600;
    }
.help-card-arrow {
      width: 40px;
      height: 40px;

      display: grid;
      place-items: center;

      border-radius: 50%;

      border: 1px solid rgba(22, 33, 30, 0.12);

      transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease;
    }
.help-card:hover .help-card-arrow {
      background: #18221f;
      color: #ffffff;

      transform: rotate(4deg);
    }
.help-card-arrow svg {
      width: 16px;
      height: 16px;
    }
/* bottom status line */

    .quick-help-status {
      margin-top: 38px;

      padding-top: 22px;

      display: flex;
      align-items: center;
      gap: 26px;

      border-top: 1px solid rgba(22, 33, 30, 0.08);

      font-family: "DM Sans", sans-serif;

      font-size: 11px;

      color: #727d79;
    }
/* =========================================================
       SECTION · STANDORTE (Locations)
       — headline zentriert, Cards standalone, Slide-Ins
    ========================================================= */

    .locations-section {
      background: #f5f3ee;
      padding: clamp(70px, 7vw, 110px) 24px;
    }
.locations-container {
      width: min(1460px, 100%);
      margin: 0 auto;
    }
/* centered heading block */

    .locations-heading {
      max-width: 820px;
      margin: 0 auto clamp(38px, 4vw, 56px);
      text-align: center;
    }
.locations-kicker {
      display: block;
      margin-bottom: 18px;

      font-family: "DM Sans", sans-serif;

      font-size: 11px;
      font-weight: 600;

      letter-spacing: 0.14em;
      text-transform: uppercase;

      color: #8a938f;
    }
.locations-heading h2 {
      margin: 0;

      font-family: "Playfair Display", serif;
      font-weight: 400;

      font-size: clamp(44px, 4vw, 62px);
      line-height: 0.98;
      letter-spacing: -0.048em;

      color: #18221f;
    }
.locations-heading h2 em {
      font-weight: 400;
      font-style: italic;
      color: #a80846;
    }
.locations-heading p {
      max-width: 620px;
      margin: 26px auto 0;

      font-family: "Manrope", sans-serif;

      font-size: 16px;
      line-height: 1.75;

      color: #65706c;
    }
/* grid — standalone cards with gap */

    .location-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 18px;
    }
/* CARD */

    .location-card {
      display: flex;
      flex-direction: column;

      background: #fffefb;

      border: 1px solid rgba(24, 34, 31, 0.08);
      border-radius: 24px;

      overflow: hidden;

      box-shadow: 0 12px 30px rgba(24, 34, 31, 0.04);

      /* initial hidden state for scroll-in animation */
      opacity: 0;

      transition:
        transform 0.9s cubic-bezier(.2,.7,.2,1),
        opacity 0.9s ease,
        box-shadow 0.35s ease;
    }
/* direction of entry per card */
    .location-card[data-anim="from-left"]   { transform: translateX(-70px); }
.location-card[data-anim="from-right"]  { transform: translateX(70px); }
.location-card[data-anim="from-top"]    { transform: translateY(-70px); }
.location-card[data-anim="from-bottom"] { transform: translateY(70px); }
/* resting state after scroll-in */
    .location-card.in-view {
      opacity: 1;
      transform: none;
    }
/* hover only after cards have arrived */
    .location-card.in-view:hover {
      transform: translateY(-6px);
      box-shadow: 0 24px 55px rgba(24, 34, 31, 0.10);
    }
/* subtle featured accent — Bahnhof-Apotheke */
    .location-card.location-card-featured {
      background:
        linear-gradient(180deg,
          rgba(224, 240, 236, 0.55) 0%,
          #fffefb 45%
        );
    }
/* image */
    .location-image {
      aspect-ratio: 3 / 2;
      overflow: hidden;
      background: #ece9e1;
      position: relative;
    }
.location-image img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      transition: transform 1.4s cubic-bezier(.2,.7,.2,1);
    }
.location-card.in-view:hover .location-image img {
      transform: scale(1.06);
    }
/* subtle vignette on image */
    .location-image::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg,
        rgba(13, 25, 21, 0) 60%,
        rgba(13, 25, 21, 0.10) 100%);
      pointer-events: none;
    }
/* card body */
    .location-body {
      padding: 18px 18px 18px;
      display: flex;
      flex-direction: column;
      flex: 1;
    }
/* top row — only status now */
    .locations-section .location-card-top {
      display: flex;
      align-items: center;
      justify-content: flex-end;

      margin-bottom: 12px;
    }
.locations-section .location-status {
      display: flex;
      align-items: center;
      gap: 8px;

      font-family: "DM Sans", sans-serif;

      font-size: 9px;
      font-weight: 600;

      letter-spacing: 0.13em;
      text-transform: uppercase;

      color: #a80846;
    }
.locations-section .location-status .status-dot {
      width: 7px;
      height: 7px;

      border-radius: 50%;

      background: #d20a5b;

      box-shadow: 0 0 0 4px rgba(99, 190, 160, 0.14);
    }
/* main content */
    .locations-section .location-card-main {
      flex: 1;
    }
.locations-section .location-area {
      display: block;
      margin-bottom: 10px;

      font-family: "DM Sans", sans-serif;

      font-size: 9px;
      font-weight: 600;

      letter-spacing: 0.16em;
      text-transform: uppercase;

      color: #8e9894;
    }
.locations-section .location-card h3 {
      margin: 0 0 14px;

      font-family: "Playfair Display", serif;
      font-weight: 400;

      font-size: clamp(26px, 1.9vw, 34px);
      line-height: 0.98;
      letter-spacing: -0.035em;

      color: #18221f;
    }
.locations-section .location-card p {
      max-width: 280px;
      margin: 0;

      font-family: "Manrope", sans-serif;

      font-size: 13px;
      line-height: 1.55;

      color: #65706c;
    }
.locations-section .location-card p em {
      font-family: "Playfair Display", serif;
      font-style: italic;
      font-size: 14px;

      color: #a80846;
    }
/* special row */
    .locations-section .location-special {
      margin-top: 18px;
      padding: 11px 0;

      display: flex;
      align-items: center;
      gap: 11px;

      border-top: 1px solid rgba(24, 34, 31, 0.08);
      border-bottom: 1px solid rgba(24, 34, 31, 0.08);
    }
.locations-section .location-special svg {
      width: 16px;
      height: 16px;
      stroke-width: 1.6;
      color: #a80846;
      flex-shrink: 0;
    }
.locations-section .location-special div {
      display: flex;
      flex-direction: column;
      gap: 2px;
    }
.locations-section .location-special span {
      font-family: "DM Sans", sans-serif;

      font-size: 8px;
      letter-spacing: 0.12em;
      text-transform: uppercase;

      color: #939c98;
    }
.locations-section .location-special strong {
      font-family: "DM Sans", sans-serif;

      font-size: 11px;
      font-weight: 600;

      color: #18221f;
    }
/* hours */
    .locations-section .location-hours {
      margin-top: 14px;

      display: flex;
      flex-direction: column;
      gap: 3px;
    }
.locations-section .location-hours span {
      font-family: "DM Sans", sans-serif;

      font-size: 8px;
      letter-spacing: 0.12em;
      text-transform: uppercase;

      color: #9ba39f;
    }
.locations-section .location-hours strong {
      font-family: "Playfair Display", serif;
      font-weight: 400;

      font-size: 16px;

      color: #18221f;
    }
/* cta */
    .locations-section .location-link {
      margin-top: 16px;

      min-height: 44px;

      padding-left: 16px;
      padding-right: 6px;

      display: flex;
      align-items: center;
      justify-content: space-between;

      border-radius: 100px;

      background: #fff;
      border: 1px solid rgba(24, 34, 31, 0.10);

      color: #18221f;

      font-family: "DM Sans", sans-serif;
      font-size: 11px;
      font-weight: 600;

      text-decoration: none;

      transition:
        background 0.3s ease,
        color 0.3s ease;
    }
.locations-section .location-link-icon {
      width: 32px;
      height: 32px;

      display: grid;
      place-items: center;

      border-radius: 50%;

      background: #fce4ee;
      color: #a80846;

      transition:
        transform 0.3s ease,
        background 0.3s ease,
        color 0.3s ease;
    }
.locations-section .location-link-icon svg {
      width: 13px;
    }
.locations-section .location-link:hover {
      background: #18221f;
      color: #fff;
    }
.locations-section .location-link:hover .location-link-icon {
      background: #d20a5b;
      color: #18221f;
      transform: rotate(8deg);
    }
/* =========================================================
       SECTION · SAME-DAY-LIEFERUNG
       — badge, centered heading, live day-timeline, compact cards
    ========================================================= */

    .same-day {
      padding: clamp(80px, 8vw, 130px) 24px;

      background:
        radial-gradient(
          circle at 95% 5%,
          rgba(135, 203, 192, 0.15),
          transparent 28%
        ),
        #f5f3ee;
    }
.same-day-inner {
      width: min(1460px, 100%);
      margin: 0 auto;
    }
/* centered heading + badge */

    .same-day-heading {
      max-width: 820px;
      margin: 0 auto clamp(40px, 4vw, 56px);
      text-align: center;

      display: flex;
      flex-direction: column;
      align-items: center;
    }
.same-day-badge {
      display: inline-flex;
      align-items: center;
      gap: 9px;

      padding: 9px 18px;

      border-radius: 100px;

      background: rgba(135, 203, 192, 0.14);
      border: 1px solid rgba(77, 151, 139, 0.28);

      color: #a80846;

      font-family: "DM Sans", sans-serif;
      font-size: 10px;
      font-weight: 600;
      letter-spacing: 0.16em;
      text-transform: uppercase;

      margin-bottom: 26px;
    }
.same-day-badge svg {
      width: 13px;
      height: 13px;
      stroke-width: 2;
    }
.same-day-heading h2 {
      margin: 0;

      font-family: "Playfair Display", serif;
      font-weight: 400;

      font-size: clamp(48px, 4.4vw, 70px);
      line-height: 0.98;
      letter-spacing: -0.048em;

      color: #18221f;
    }
.same-day-heading h2 em {
      font-style: italic;
      font-weight: 400;
      color: #a80846;
    }
.same-day-heading p {
      max-width: 620px;
      margin: 22px auto 0;

      font-family: "Manrope", sans-serif;
      font-size: 15px;
      line-height: 1.7;
      color: #65706c;
    }
/* top row */
    .ds-topline {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;

      margin-bottom: 26px;
    }
.ds-state {
      display: flex;
      align-items: center;
      gap: 10px;

      font-family: "DM Sans", sans-serif;
      font-size: 10px;
      font-weight: 600;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: #a80846;

      transition: color 0.4s ease;
    }
.ds-pulse {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: #d20a5b;
      box-shadow: 0 0 0 5px rgba(210, 10, 91, 0.16);
      position: relative;
      transition: background 0.4s ease, box-shadow 0.4s ease;
    }
.ds-pulse::after {
      content: "";
      position: absolute;
      inset: -5px;
      border-radius: 50%;
      border: 1px solid rgba(210, 10, 91, 0.55);
      animation: dsPulse 2.4s cubic-bezier(.2,.7,.2,1) infinite;
    }
.ds-countdown {
      display: inline-flex;
      align-items: baseline;
      gap: 8px;

      font-family: "DM Sans", sans-serif;
      font-size: 12px;
      color: #949d99;
    }
.ds-countdown strong {
      font-family: "Playfair Display", serif;
      font-size: 22px;
      font-weight: 400;
      color: #18221f;
      letter-spacing: -0.01em;
      font-variant-numeric: tabular-nums;

      transition: color 0.4s ease;
    }
/* the timeline itself */
    .ds-timeline {
      position: relative;
      padding-top: 26px;    /* space for the moving now-label above */
      padding-bottom: 34px; /* space for the fixed deadline-flag label below */
    }
.ds-track {
      position: relative;
      height: 8px;

      background: #e6e4dd;
      border-radius: 100px;

      overflow: visible;
    }
/* subtle hour ticks in the track background */
    .ds-track::before {
      content: "";
      position: absolute;
      inset: 0;
      border-radius: inherit;
      background-image: repeating-linear-gradient(
        90deg,
        transparent 0,
        transparent calc(100% / 14 - 1px),
        rgba(24, 34, 31, 0.10) calc(100% / 14 - 1px),
        rgba(24, 34, 31, 0.10) calc(100% / 14)
      );
      pointer-events: none;
    }
.ds-fill {
      position: absolute;
      left: 0;
      top: 0;
      height: 100%;
      width: 0%;

      border-radius: inherit;

      background: linear-gradient(90deg, #d20a5b 0%, #dc845f 100%);

      transition:
        width 1.4s cubic-bezier(.2,.7,.2,1),
        background 0.6s ease;
    }
/* deadline flag — fixed at 17:00 position (9/14 = 64.29%) */
    .ds-deadline-flag {
      position: absolute;
      top: 50%;
      left: 64.29%;
      transform: translate(-50%, -50%);

      pointer-events: none;

      z-index: 2;
    }
.ds-flag-mark {
      width: 2px;
      height: 22px;
      background: #18221f;
      margin: 0 auto;
      border-radius: 2px;
    }
.ds-flag-label {
      position: absolute;
      top: 20px;
      left: 50%;
      transform: translateX(-50%);

      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 2px;

      white-space: nowrap;
      padding-top: 6px;
    }
.ds-flag-label strong {
      font-family: "Playfair Display", serif;
      font-size: 14px;
      font-weight: 400;
      color: #18221f;
      letter-spacing: 0.01em;
      font-variant-numeric: tabular-nums;
    }
.ds-flag-label span {
      font-family: "DM Sans", sans-serif;
      font-size: 8px;
      font-weight: 600;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: #8a9490;
    }
/* live now-marker */
    .ds-now-marker {
      position: absolute;
      top: 50%;
      left: 0%;
      transform: translate(-50%, -50%);

      width: 18px;
      height: 18px;

      border-radius: 50%;

      background: #fff;
      border: 3px solid #dc845f;

      box-shadow: 0 0 0 5px rgba(220, 132, 95, 0.18);

      transition:
        left 1.4s cubic-bezier(.2,.7,.2,1),
        border-color 0.4s ease,
        box-shadow 0.4s ease;

      z-index: 3;
    }
.ds-now-marker::after {
      content: "";
      position: absolute;
      inset: -6px;
      border-radius: 50%;
      border: 1px solid rgba(220, 132, 95, 0.55);
      animation: dsPulse 2.4s cubic-bezier(.2,.7,.2,1) infinite;
    }
/* floating "now" label above marker */
    .ds-now-label {
      position: absolute;
      bottom: calc(100% + 8px);
      left: 50%;
      transform: translateX(-50%);

      padding: 3px 8px;

      border-radius: 100px;

      background: #18221f;
      color: #fff;

      font-family: "DM Sans", sans-serif;
      font-size: 10px;
      font-weight: 600;
      letter-spacing: 0.04em;
      font-variant-numeric: tabular-nums;

      white-space: nowrap;

      transition: background 0.4s ease;
    }
.ds-now-label::after {
      content: "";
      position: absolute;
      bottom: -3px;
      left: 50%;
      transform: translateX(-50%) rotate(45deg);
      width: 6px;
      height: 6px;
      background: #18221f;

      transition: background 0.4s ease;
    }
/* scale under timeline */
    .ds-scale {
      display: flex;
      justify-content: space-between;

      margin-top: 12px;
      padding: 0 2px;

      font-family: "DM Sans", sans-serif;
      font-size: 9px;
      font-weight: 600;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: #a0a8a4;
    }
.deadline-strip.past-deadline .ds-state {
      color: #c8321f;
    }
.deadline-strip.past-deadline .ds-pulse {
      background: #dc4a2a;
      box-shadow: 0 0 0 5px rgba(220, 74, 42, 0.15);
    }
.deadline-strip.past-deadline .ds-pulse::after {
      border-color: rgba(220, 74, 42, 0.55);
    }
.deadline-strip.past-deadline .ds-fill {
      background: linear-gradient(90deg, #dc845f 0%, #c8321f 100%);
    }
.deadline-strip.past-deadline .ds-now-marker {
      border-color: #c8321f;
      box-shadow: 0 0 0 5px rgba(200, 50, 31, 0.18);
    }
.deadline-strip.past-deadline .ds-now-marker::after {
      border-color: rgba(200, 50, 31, 0.55);
    }
.deadline-strip.past-deadline .ds-now-label,
    .deadline-strip.past-deadline .ds-now-label::after {
      background: #c8321f;
    }
.deadline-strip.past-deadline .ds-countdown strong {
      color: #c8321f;
    }
/* =========================================================
       DELIVERY PROCESS CARDS · compact, no numbers
    ========================================================= */

    .delivery-process {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 16px;
    }
.delivery-step {
      position: relative;
      display: flex;
      flex-direction: column;

      padding: 26px 24px 22px;

      border-radius: 22px;
      border: 1px solid rgba(24, 34, 31, 0.08);

      background: rgba(255, 255, 255, 0.62);

      transition:
        transform 0.35s ease,
        background 0.35s ease,
        box-shadow 0.35s ease;
    }
.delivery-step:hover {
      transform: translateY(-6px);
      background: #fffefb;
      box-shadow: 0 22px 50px rgba(31, 44, 39, 0.08);
    }
.delivery-step-featured {
      background: rgba(255, 255, 255, 0.62);
    }
.delivery-step-featured:hover {
      background: #fffefb;
    }

/* icon becomes the anchor now that numbers are gone */
    .delivery-step .step-icon-big {
      width: 56px;
      height: 56px;

      display: grid;
      place-items: center;

      border-radius: 18px;

      background: #fce4ee;
      color: #a80846;

      margin-bottom: 24px;

      transition: transform 0.4s ease;
    }
.delivery-step:hover .step-icon-big {
      transform: translateY(-2px) rotate(-3deg);
    }
.delivery-step .step-icon-big svg {
      width: 24px;
      height: 24px;
      stroke-width: 1.6;
    }
.delivery-step-featured .step-icon-big {
      background: rgba(220, 132, 95, 0.16);
      color: #c96940;
    }
.delivery-step .step-content {
      flex: 1;
    }
.delivery-step .step-kicker {
      display: block;
      margin-bottom: 10px;

      font-family: "DM Sans", sans-serif;
      font-size: 9px;
      font-weight: 600;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: #a80846;
    }
.delivery-step h3 {
      margin: 0 0 14px;

      font-family: "Playfair Display", serif;
      font-weight: 400;
      font-size: clamp(28px, 2.2vw, 36px);
      line-height: 0.98;
      letter-spacing: -0.038em;
      color: #18221f;
    }
.delivery-step p {
      margin: 0;
      max-width: 320px;

      font-family: "Manrope", sans-serif;
      font-size: 13.5px;
      line-height: 1.62;
      color: #65706c;
    }
.delivery-step .step-footer {
      margin-top: 22px;
      padding-top: 14px;

      display: flex;
      align-items: center;
      justify-content: space-between;

      border-top: 1px solid rgba(24, 34, 31, 0.08);

      font-family: "DM Sans", sans-serif;
      font-size: 10px;
      font-weight: 600;
      letter-spacing: 0.06em;
      color: #18221f;
    }
.delivery-step .step-footer svg {
      width: 15px;
      height: 15px;
      color: #a80846;
    }
/* =========================================================
       BOTTOM CTA · freistehender Text + Button (kein Container)
    ========================================================= */

    .same-day-bottom {
      margin: 44px auto 0;

      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 22px;
      text-align: center;
    }
.same-day-note {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 6px;
    }
.same-day-note span {
      font-family: "DM Sans", sans-serif;
      font-size: 10px;
      font-weight: 600;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: #909995;
    }
.same-day-note strong {
      font-family: "Playfair Display", serif;
      font-size: clamp(22px, 2vw, 28px);
      font-weight: 400;
      line-height: 1.2;
      letter-spacing: -0.02em;
      color: #18221f;
      max-width: 24ch;
    }
.same-day-cta {
      min-height: 50px;

      padding: 4px 6px 4px 22px;

      display: inline-flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;

      border-radius: 100px;
      background: #18221f;
      color: #fff;

      text-decoration: none;

      font-family: "DM Sans", sans-serif;
      font-size: 12px;
      font-weight: 600;
      letter-spacing: 0.02em;

      transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        background 0.3s ease;
    }
.same-day-cta:hover {
      transform: translateY(-3px);
      background: #223028;
      box-shadow: 0 14px 30px rgba(24, 34, 31, 0.18);
    }
.same-day-cta .cta-circle {
      width: 38px;
      height: 38px;

      display: grid;
      place-items: center;

      border-radius: 50%;
      background: #d20a5b;
      color: #18221f;

      transition: transform 0.3s ease;
    }
.same-day-cta:hover .cta-circle {
      transform: rotate(8deg);
    }
.same-day-cta .cta-circle svg {
      width: 15px;
      height: 15px;
    }
/* =========================================================
       SECTION · LEISTUNGEN (Services Bento)
       — kompakt, refined, ohne Grid-Löcher
    ========================================================= */

    .services-section {
      padding: clamp(70px, 7vw, 100px) 24px clamp(80px, 8vw, 115px);

      background:
        radial-gradient(
          circle at 92% 8%,
          rgba(210, 10, 91, 0.12),
          transparent 30%
        ),
        #f5f3ee;
    }
.services-shell {
      width: min(1380px, 100%);
      margin: 0 auto;
    }
/* Intro — centered headline block */

    .services-intro {
      max-width: 780px;
      margin: 0 auto clamp(36px, 4vw, 50px);
      text-align: center;
    }
.services-kicker {
      display: block;
      margin-bottom: 14px;

      font-family: "DM Sans", sans-serif;
      font-size: 10px;
      font-weight: 600;
      letter-spacing: 0.15em;
      text-transform: uppercase;
      color: #8c9591;
    }
.services-intro-right h2 {
      margin: 0;

      font-family: "Playfair Display", serif;
      font-weight: 400;

      font-size: clamp(42px, 3.8vw, 62px);
      line-height: 0.98;
      letter-spacing: -0.045em;

      color: #18221f;
    }
.services-intro-right h2 em {
      font-style: italic;
      font-weight: 400;
      color: #a80846;
    }
.services-intro-right p {
      max-width: 620px;
      margin: 18px auto 0;

      font-family: "Manrope", sans-serif;
      font-size: 14.5px;
      line-height: 1.65;
      color: #69736f;
    }
/* Bento grid — 12 col, no gaps */

    .services-bento-grid {
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      grid-auto-flow: dense;
      gap: 12px;
    }
/* Base tile */

    .service-tile {
      position: relative;
      grid-column: span 4;

      min-height: 235px;

      padding: 22px;

      display: flex;
      flex-direction: column;

      border-radius: 20px;

      background: rgba(255, 255, 255, 0.78);
      border: 1px solid rgba(24, 34, 31, 0.07);

      box-shadow: 0 10px 26px rgba(30, 42, 38, 0.03);

      overflow: hidden;

      transition:
        transform 0.3s cubic-bezier(.2,.7,.2,1),
        box-shadow 0.3s ease,
        background 0.3s ease;
    }
.service-tile:hover {
      transform: translateY(-4px);
      background: #fffefb;
      box-shadow: 0 20px 40px rgba(30, 42, 38, 0.08);
    }
/* Widths */

    .service-tile-wide     { grid-column: span 8; }
.service-tile-featured { grid-column: span 4; }
.service-tile-dark     { grid-column: span 4; }
/* Full-width closing tile */
    .service-tile-full {
      grid-column: span 12;
      min-height: unset;
    }
/* Featured variant — mint tint, subtle */
    .service-tile-featured {
      background:
        linear-gradient(155deg,
          rgba(210, 10, 91, 0.22) 0%,
          rgba(228, 241, 238, 0.55) 55%,
          rgba(255, 254, 251, 0.35) 100%
        );
      border-color: rgba(78, 152, 140, 0.18);
    }
/* Dark variant — deep green with mint accents */
    .service-tile-dark {
      background:
        linear-gradient(155deg,
          #1a2622 0%,
          #253430 100%
        );
      color: #fff;
      border-color: rgba(255, 255, 255, 0.08);
    }
/* keep dark on hover (statt generisches white-hover) — nur tiefer */
    .service-tile-dark:hover {
      background:
        linear-gradient(155deg,
          #0f1815 0%,
          #1a2622 100%
        );
      box-shadow: 0 24px 44px rgba(15, 24, 21, 0.35);
    }
.service-tile-dark::after {
      /* subtle mint corner glow */
      content: "";
      position: absolute;
      right: -50px;
      bottom: -50px;
      width: 180px;
      height: 180px;
      border-radius: 50%;
      background: radial-gradient(circle,
        rgba(210, 10, 91, 0.18) 0%,
        transparent 70%);
      pointer-events: none;
      transition: background 0.4s ease;
    }
.service-tile-dark:hover::after {
      background: radial-gradient(circle,
        rgba(210, 10, 91, 0.28) 0%,
        transparent 70%);
    }
/* Top row (icon + optional badge) */

    .services-section .tile-top {
      position: relative;
      z-index: 2;

      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;

      margin-bottom: 26px;
    }
.services-section .tile-icon {
      width: 42px;
      height: 42px;

      display: grid;
      place-items: center;

      border-radius: 13px;

      background: #e4f1ee;
      color: #a80846;

      transition: transform 0.35s ease;
    }
.service-tile:hover .tile-icon {
      transform: translateY(-1px) rotate(-3deg);
    }
.services-section .tile-icon svg {
      width: 18px;
      height: 18px;
      stroke-width: 1.7;
    }
.service-tile-dark .tile-icon {
      background: rgba(210, 10, 91, 0.14);
      color: #d20a5b;
    }
.service-tile-featured .tile-icon {
      background: rgba(255, 255, 255, 0.62);
      color: #a80846;
    }
/* Badge */

    .services-section .tile-badge {
      padding: 6px 10px;

      border-radius: 999px;

      font-family: "DM Sans", sans-serif;
      font-size: 8px;
      font-weight: 600;
      letter-spacing: 0.14em;
      text-transform: uppercase;

      color: #a80846;
      background: rgba(210, 10, 91, 0.14);
    }
.services-section .tile-badge-apricot {
      background: rgba(217, 130, 95, 0.14);
      color: #c96940;
    }
/* Body */

    .services-section .tile-body {
      position: relative;
      z-index: 2;
      flex: 1;
    }
.services-section .tile-eyebrow {
      display: block;
      margin-bottom: 8px;

      font-family: "DM Sans", sans-serif;
      font-size: 8px;
      font-weight: 600;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: #8e9793;
    }
.service-tile h3 {
      margin: 0 0 10px;

      font-family: "Playfair Display", serif;
      font-weight: 400;

      font-size: clamp(24px, 1.9vw, 32px);
      line-height: 1.02;
      letter-spacing: -0.035em;

      color: #18221f;
    }
.service-tile h3 em {
      font-style: italic;
      font-weight: 400;
      color: #a80846;
    }
.service-tile p {
      max-width: 44ch;
      margin: 0;

      font-family: "Manrope", sans-serif;
      font-size: 13px;
      line-height: 1.55;
      color: #69736f;
    }
.service-tile-dark h3 { color: #fff; }
.service-tile-dark h3 em { color: #d20a5b; }
.service-tile-dark p,
    .service-tile-dark .tile-eyebrow { color: rgba(255, 255, 255, 0.62); }
/* Pills row (only in Hautanalyse tile) */

    .services-section .tile-pills {
      position: relative;
      z-index: 2;

      display: flex;
      flex-wrap: wrap;
      gap: 6px;

      margin-top: 14px;
    }
.services-section .tile-pills span {
      display: inline-flex;
      align-items: center;
      gap: 6px;

      padding: 6px 10px;

      border-radius: 999px;

      background: rgba(210, 10, 91, 0.15);

      font-family: "DM Sans", sans-serif;
      font-size: 9px;
      font-weight: 600;
      letter-spacing: 0.02em;
      color: #18221f;
    }
.services-section .tile-pills svg {
      width: 12px;
      height: 12px;
      color: #a80846;
    }
/* CTA link */

    .services-section .tile-link {
      position: relative;
      z-index: 2;

      margin-top: 20px;

      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;

      font-family: "DM Sans", sans-serif;
      font-size: 9px;
      font-weight: 600;
      letter-spacing: 0.08em;
      text-transform: uppercase;

      color: #18221f;
      text-decoration: none;
    }
.services-section .tile-link > span:last-child {
      width: 32px;
      height: 32px;

      display: grid;
      place-items: center;

      border-radius: 50%;

      background: #fff;
      border: 1px solid rgba(24, 34, 31, 0.09);

      color: #18221f;

      transition:
        transform 0.25s ease,
        background 0.25s ease,
        color 0.25s ease;
    }
.services-section .tile-link svg {
      width: 12px;
      height: 12px;
    }
.service-tile:hover .tile-link > span:last-child {
      transform: rotate(8deg);
      background: #18221f;
      color: #fff;
    }
.services-section .tile-link-light {
      color: #fff;
    }
.service-tile-dark .tile-link > span:last-child {
      background: #d20a5b;
      color: #18221f;
      border-color: transparent;
    }
.service-tile-dark:hover .tile-link > span:last-child {
      background: #fff;
    }
/* Full-width Hautanalyse tile — horizontal layout */

    .service-tile-full {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 32px;
      align-items: center;
      padding: 24px 26px;
    }
.service-tile-full .tile-top {
      margin-bottom: 18px;
      justify-content: flex-start !important;
    }
.service-tile-full .tile-content-left {
      display: flex;
      flex-direction: column;
    }
.service-tile-full .tile-content-right {
      display: flex;
      flex-direction: column;
      align-items: flex-end;
      gap: 14px;
    }
.service-tile-full .tile-pills {
      margin-top: 0;
    }
.service-tile-full .tile-link {
      margin-top: 0;
    }
/* =========================================================
       SECTION · REVIEWS (Was Menschen über uns sagen)
       — namespaced, no :root leak, no chapter marker, centered
    ========================================================= */

    .reviews-section {
      padding: clamp(80px, 8vw, 120px) 24px;

      background:
        radial-gradient(
          circle at 88% 0%,
          rgba(136, 203, 192, 0.12),
          transparent 29%
        ),
        #f5f3ee;
    }
.reviews-wrap {
      width: min(1400px, 100%);
      margin: 0 auto;
    }
/* Header · centered */

    .reviews-header {
      max-width: 820px;
      margin: 0 auto clamp(44px, 5vw, 60px);
      text-align: center;
    }
/* Google line — Brand + Rating, centered, subtle */

    .reviews-section .reviews-google-line {
      display: inline-flex;
      align-items: center;
      gap: 16px;

      padding: 8px 16px;

      border-radius: 999px;
      background: rgba(255, 255, 255, 0.65);
      border: 1px solid rgba(25, 35, 31, 0.08);

      margin-bottom: 28px;
    }
.reviews-section .google-icon {
      width: 16px;
      height: 16px;
      flex-shrink: 0;
    }
.reviews-section .google-rating {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      font-family: "DM Sans", sans-serif;
    }
.reviews-section .google-rating strong {
      font-family: "Playfair Display", serif;
      font-size: 15px;
      font-weight: 400;
      color: #19231f;
      line-height: 1;
    }
.reviews-section .rating-stars {
      color: #e0a65c;
      font-size: 11px;
      letter-spacing: 1px;
      line-height: 1;
    }
.reviews-section .google-rating .review-count {
      font-size: 10px;
      color: #929b97;
      font-weight: 500;
    }
/* Headline */

    .reviews-section .reviews-header h2 {
      margin: 0;

      font-family: "Playfair Display", serif;
      font-weight: 400;

      font-size: clamp(42px, 4vw, 62px);
      line-height: 0.99;
      letter-spacing: -0.048em;

      color: #19231f;
    }
.reviews-section .reviews-header h2 em {
      font-style: italic;
      font-weight: 400;
      color: #a80846;
    }
.reviews-section .reviews-header > p {
      max-width: 620px;
      margin: 22px auto 0;

      font-family: "Manrope", sans-serif;
      font-size: 14.5px;
      line-height: 1.65;
      color: #68736f;
    }
/* Review grid */

    .reviews-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 14px;
    }
/* Review card */

    .review-card {
      display: flex;
      flex-direction: column;

      min-height: 320px;
      padding: 24px;

      border-radius: 22px;

      background: rgba(255, 255, 255, 0.72);
      border: 1px solid rgba(25, 35, 31, 0.09);

      box-shadow: 0 12px 30px rgba(30, 42, 38, 0.03);

      transition:
        transform 0.3s ease,
        background 0.3s ease,
        box-shadow 0.3s ease;
    }
.review-card-soft {
      background:
        linear-gradient(145deg, #e9f3f0, #faf8f2);
    }
.review-card:hover {
      transform: translateY(-4px);
      background: #fffefa;
      box-shadow: 0 22px 45px rgba(30, 42, 38, 0.06);
    }
/* Card top */

    .reviews-section .review-top {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 18px;

      margin-bottom: 22px;
    }
.reviews-section .review-google {
      display: flex;
      align-items: center;
      gap: 7px;

      font-family: "DM Sans", sans-serif;
      font-size: 9px;
      font-weight: 500;
      color: #868f8b;
    }
.reviews-section .review-google svg {
      width: 15px;
      height: 15px;
      flex-shrink: 0;
    }
.reviews-section .review-stars {
      color: #e0a65c;
      font-size: 11px;
      letter-spacing: 1.5px;
      line-height: 1;
    }
/* Quote */

    .reviews-section .review-card blockquote {
      flex: 1;
      margin: 0;

      font-family: "Playfair Display", serif;
      font-weight: 400;

      font-size: clamp(19px, 1.6vw, 24px);
      line-height: 1.32;
      letter-spacing: -0.02em;

      color: #19231f;
    }
/* Bottom */

    .reviews-section .review-bottom {
      margin-top: 24px;
      padding-top: 16px;

      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      gap: 16px;

      border-top: 1px solid rgba(25, 35, 31, 0.09);
    }
.reviews-section .review-person {
      display: flex;
      flex-direction: column;
      gap: 3px;
    }
.reviews-section .review-person strong {
      font-family: "DM Sans", sans-serif;
      font-size: 11px;
      font-weight: 600;
      color: #19231f;
    }
.reviews-section .review-person span {
      font-family: "DM Sans", sans-serif;
      font-size: 9px;
      color: #929b97;
    }
.reviews-section .review-context {
      display: flex;
      align-items: center;
      gap: 6px;
      color: #a80846;
    }
.reviews-section .review-context svg {
      width: 13px;
      height: 13px;
      stroke-width: 1.7;
    }
.reviews-section .review-context span {
      font-family: "DM Sans", sans-serif;
      font-size: 8px;
      font-weight: 600;
      letter-spacing: 0.09em;
      text-transform: uppercase;
    }
/* Standalone CTA (centered, no card) */

    .reviews-section .reviews-cta-wrap {
      display: flex;
      justify-content: center;
      margin-top: 32px;
    }
.reviews-section .reviews-link {
      min-height: 56px;

      padding: 5px 7px 5px 24px;

      display: inline-flex;
      align-items: center;
      gap: 18px;

      border-radius: 999px;

      background: #19231f;
      color: #fff;

      font-family: "DM Sans", sans-serif;
      font-size: 13px;
      font-weight: 600;
      letter-spacing: 0.01em;
      text-decoration: none;

      box-shadow: 0 14px 30px rgba(25, 35, 31, 0.14);

      transition:
        transform 0.3s ease,
        background 0.3s ease,
        box-shadow 0.3s ease;
    }
.reviews-section .reviews-link:hover {
      transform: translateY(-3px);
      background: #253430;
      box-shadow: 0 20px 40px rgba(25, 35, 31, 0.22);
    }
.reviews-section .reviews-link .reviews-link-google {
      width: 18px;
      height: 18px;
      flex-shrink: 0;
    }
.reviews-section .reviews-link .reviews-link-arrow {
      width: 44px;
      height: 44px;

      display: grid;
      place-items: center;

      border-radius: 50%;

      background: #d20a5b;
      color: #19231f;

      transition: transform 0.3s ease, background 0.3s ease;
    }
.reviews-section .reviews-link:hover .reviews-link-arrow {
      transform: rotate(8deg);
      background: #fff;
    }
.reviews-section .reviews-link .reviews-link-arrow svg {
      width: 16px;
      height: 16px;
    }
/* =========================================================
       SECTION · KARRIERE (v2 — photo + dark promise card)
       :root leaks entfernt, generische Klassen namespaced
    ========================================================= */

    

/* Head · centered */

    




/* Stage — photo + promise */

    
/* Photo */

    








/* Promise card */

    
/* Benefits (2x2 grid inside dark card) */

    






/* Roles */

    

/* CTA */

    




/* Facts — refined cards, prominente Icons, count-up */

    

/* subtle mint corner glow revealed on hover */
    


/* icon — big, gradient tile with subtle depth */
    


/* number + label stack */
    


/* hairline divider above label */
    
/* =========================================================
       SECTION · JOURNAL (Blog · 3 Cards + centered CTA)
    ========================================================= */

    .journal-section {
      padding: clamp(80px, 8vw, 120px) 24px;
      background: #f5f3ee;
    }
.journal-wrap {
      width: min(1380px, 100%);
      margin: 0 auto;
    }
/* Header · centered */

    .journal-head {
      max-width: 780px;
      margin: 0 auto clamp(40px, 4vw, 56px);
      text-align: center;
    }
.journal-section .journal-kicker {
      display: block;
      margin-bottom: 14px;

      font-family: "DM Sans", sans-serif;
      font-size: 10px;
      font-weight: 600;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: #a80846;
    }
.journal-section .journal-head h2 {
      margin: 0;

      font-family: "Playfair Display", serif;
      font-weight: 400;

      font-size: clamp(42px, 4vw, 62px);
      line-height: 0.98;
      letter-spacing: -0.048em;

      color: #19231f;
    }
.journal-section .journal-head h2 em {
      font-style: italic;
      font-weight: 400;
      color: #a80846;
    }
.journal-section .journal-head p {
      max-width: 620px;
      margin: 22px auto 0;

      font-family: "Manrope", sans-serif;
      font-size: 14.5px;
      line-height: 1.65;
      color: #68736f;
    }
/* Grid — 3 cards */

    .journal-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 20px;
    }
/* Article card */

    .journal-card {
      display: flex;
      flex-direction: column;

      border-radius: 22px;
      overflow: hidden;

      background: #fffefb;
      border: 1px solid rgba(25, 35, 31, 0.07);

      box-shadow: 0 10px 26px rgba(30, 42, 38, 0.03);

      text-decoration: none;
      color: inherit;

      transition:
        transform 0.3s cubic-bezier(.2,.7,.2,1),
        box-shadow 0.3s ease,
        border-color 0.3s ease;
    }
.journal-card:hover {
      transform: translateY(-5px);
      border-color: rgba(76, 150, 138, 0.20);
      box-shadow: 0 22px 44px rgba(30, 42, 38, 0.08);
    }
/* image */
    .journal-card-image {
      aspect-ratio: 4 / 3;
      overflow: hidden;
      position: relative;
      background: #e4e0d5;
    }
.journal-card-image img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      transition: transform 1.4s cubic-bezier(.2,.7,.2,1);
    }
.journal-card:hover .journal-card-image img {
      transform: scale(1.05);
    }
/* category badge on image */
    .journal-card-badge {
      position: absolute;
      top: 14px;
      left: 14px;

      display: inline-flex;
      align-items: center;
      gap: 6px;

      padding: 6px 11px;

      border-radius: 999px;

      background: rgba(255, 255, 255, 0.9);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);

      font-family: "DM Sans", sans-serif;
      font-size: 9px;
      font-weight: 600;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: #a80846;
    }
.journal-card-badge svg {
      width: 11px;
      height: 11px;
      stroke-width: 2;
    }
/* body */
    .journal-card-body {
      display: flex;
      flex-direction: column;
      gap: 12px;
      padding: 22px 22px 20px;
      flex: 1;
    }
.journal-card-meta {
      display: flex;
      align-items: center;
      gap: 10px;

      font-family: "DM Sans", sans-serif;
      font-size: 10px;
      font-weight: 600;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: #929b97;
    }
.journal-card-meta svg {
      width: 12px;
      height: 12px;
      stroke-width: 1.7;
      color: #a80846;
    }
.journal-card h3 {
      margin: 0;

      font-family: "Playfair Display", serif;
      font-weight: 400;

      font-size: clamp(20px, 1.8vw, 26px);
      line-height: 1.15;
      letter-spacing: -0.02em;

      color: #19231f;

      transition: color 0.25s ease;
    }
.journal-card:hover h3 {
      color: #a80846;
    }
.journal-card p {
      margin: 0;

      font-family: "Manrope", sans-serif;
      font-size: 13.5px;
      line-height: 1.6;
      color: #68736f;
    }
/* read-more inline link */
    .journal-card-more {
      margin-top: auto;
      padding-top: 14px;

      display: flex;
      align-items: center;
      gap: 8px;

      font-family: "DM Sans", sans-serif;
      font-size: 10px;
      font-weight: 600;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: #19231f;

      transition: gap 0.25s ease;
    }
.journal-card:hover .journal-card-more {
      gap: 12px;
    }
.journal-card-more svg {
      width: 14px;
      height: 14px;
      stroke-width: 2;
      color: #a80846;
    }
/* Bottom CTA — freistehender Text + zentrierter Button */

    .journal-bottom {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 20px;

      margin-top: 44px;
      text-align: center;
    }
.journal-bottom-note {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 6px;
    }
.journal-bottom-note span {
      font-family: "DM Sans", sans-serif;
      font-size: 10px;
      font-weight: 600;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: #909995;
    }
.journal-bottom-note strong {
      font-family: "Playfair Display", serif;
      font-size: clamp(22px, 2vw, 28px);
      font-weight: 400;
      line-height: 1.2;
      letter-spacing: -0.02em;
      color: #19231f;
      max-width: 26ch;
    }
.journal-bottom-note strong em {
      font-style: italic;
      color: #a80846;
    }
.journal-cta {
      min-height: 52px;

      padding: 5px 7px 5px 24px;

      display: inline-flex;
      align-items: center;
      gap: 18px;

      border-radius: 999px;

      background: #19231f;
      color: #fff;

      text-decoration: none;

      font-family: "DM Sans", sans-serif;
      font-size: 12px;
      font-weight: 600;
      letter-spacing: 0.02em;

      box-shadow: 0 12px 26px rgba(25, 35, 31, 0.12);

      transition:
        transform 0.3s ease,
        background 0.3s ease,
        box-shadow 0.3s ease;
    }
.journal-cta:hover {
      transform: translateY(-3px);
      background: #253430;
      box-shadow: 0 18px 36px rgba(25, 35, 31, 0.22);
    }
.journal-cta > svg {
      width: 15px;
      height: 15px;
      stroke-width: 1.8;
    }
.journal-cta-arrow {
      width: 40px;
      height: 40px;

      display: grid;
      place-items: center;

      border-radius: 50%;

      background: #d20a5b;
      color: #19231f;

      transition: transform 0.3s ease, background 0.3s ease;
    }
.journal-cta:hover .journal-cta-arrow {
      transform: rotate(8deg);
      background: #fff;
    }
.journal-cta-arrow svg {
      width: 15px;
      height: 15px;
      stroke-width: 2;
    }
/* =========================================================
       SECTION · CLOSING / KONTAKT
       — :root leak entfernt, footer-Semantik, kompakter Padding
    ========================================================= */

    .closing-section {
      padding: clamp(80px, 8vw, 120px) 24px 24px;
      background: #f3f1ea;
    }
.closing-shell {
      width: min(1440px, 100%);
      margin: 0 auto;
    }
/* Stage (main card) */

    .closing-stage {
      position: relative;
      overflow: hidden;

      min-height: 640px;

      display: grid;
      grid-template-columns: minmax(500px, 1.08fr) minmax(460px, 0.92fr);
      align-items: center;
      gap: 60px;

      padding: clamp(50px, 5vw, 80px);

      border-radius: 34px;

      background:
        radial-gradient(circle at 85% 12%,
          rgba(137, 204, 192, 0.20),
          transparent 26%
        ),
        radial-gradient(circle at 10% 100%,
          rgba(218, 132, 95, 0.08),
          transparent 30%
        ),
        #fffdf8;

      border: 1px solid rgba(24, 34, 31, 0.09);

      box-shadow: 0 26px 70px rgba(28, 40, 35, 0.05);
    }
/* subtle grain */
    .closing-stage::before {
      content: "";
      position: absolute;
      inset: 0;
      opacity: 0.16;
      pointer-events: none;

      background-image:
        url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.07'/%3E%3C/svg%3E");
    }
/* Copy column */

    .closing-copy {
      max-width: 700px;
      position: relative;
      z-index: 3;
    }
.closing-eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 10px;

      margin-bottom: 26px;

      font-family: "DM Sans", sans-serif;
      font-size: 10px;
      font-weight: 600;
      letter-spacing: 0.15em;
      text-transform: uppercase;
      color: #4c958a;
    }
.closing-dot {
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: #d20a5b;
      box-shadow: 0 0 0 6px rgba(99, 195, 159, 0.13);
    }
.closing-copy h2 {
      margin: 0;

      font-family: "Playfair Display", serif;
      font-weight: 400;

      font-size: clamp(48px, 4.4vw, 74px);
      line-height: 0.96;
      letter-spacing: -0.05em;

      color: #18221f;
    }
.closing-copy h2 em {
      display: block;
      margin-top: 6px;

      font-style: italic;
      font-weight: 400;
      color: #4c958a;
    }
.closing-copy p {
      max-width: 580px;
      margin: 26px 0 0;

      font-family: "Manrope", sans-serif;
      font-size: 15px;
      line-height: 1.7;
      color: #68726e;
    }
/* Actions */

    .closing-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 12px;

      margin-top: 32px;
    }
.closing-primary {
      min-width: 300px;
      min-height: 64px;

      padding: 6px 16px 6px 6px;

      display: grid;
      grid-template-columns: 50px 1fr 18px;
      gap: 13px;
      align-items: center;

      border-radius: 999px;

      background: #18221f;
      color: #fff;

      text-decoration: none;

      transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        background 0.3s ease;
    }
.closing-primary:hover {
      transform: translateY(-3px);
      background: #253430;
      box-shadow: 0 18px 38px rgba(24, 34, 31, 0.18);
    }
.closing-primary-icon {
      width: 50px;
      height: 50px;

      display: grid;
      place-items: center;

      border-radius: 50%;

      background: #d20a5b;
      color: #fff;
    }
.closing-primary-icon svg {
      width: 17px;
      height: 17px;
      stroke-width: 1.7;
    }
.closing-primary-copy {
      display: flex;
      flex-direction: column;
      gap: 3px;
    }
.closing-primary-copy small {
      font-family: "DM Sans", sans-serif;
      font-size: 9px;
      font-weight: 500;
      letter-spacing: 0.05em;
      color: rgba(255, 255, 255, 0.5);
    }
.closing-primary-copy strong {
      font-family: "DM Sans", sans-serif;
      font-size: 14px;
      font-weight: 600;
      letter-spacing: 0.01em;
    }
.closing-primary-arrow {
      width: 15px;
      height: 15px;
      color: rgba(255, 255, 255, 0.75);
    }
/* Secondary */

    .closing-secondary {
      min-height: 64px;

      padding: 0 8px 0 22px;

      display: inline-flex;
      align-items: center;
      gap: 20px;

      border-radius: 999px;

      border: 1px solid rgba(24, 34, 31, 0.09);
      background: rgba(255, 255, 255, 0.58);

      color: #18221f;

      font-family: "DM Sans", sans-serif;
      font-size: 11px;
      font-weight: 600;
      letter-spacing: 0.02em;
      text-decoration: none;

      transition: background 0.3s ease, transform 0.3s ease;
    }
.closing-secondary:hover {
      background: #fff;
      transform: translateY(-3px);
    }
.closing-secondary > span {
      width: 46px;
      height: 46px;

      display: grid;
      place-items: center;

      border-radius: 50%;

      background: #dfeeea;
      color: #4c958a;
    }
.closing-secondary svg {
      width: 15px;
      height: 15px;
      stroke-width: 1.8;
    }
/* Visual right side */

    .closing-visual {
      position: relative;
      min-height: 480px;

      display: grid;
      place-items: center;

      z-index: 2;
    }
/* Orbits */

    .closing-orbit {
      position: absolute;
      border-radius: 50%;
      border: 1px solid rgba(210, 10, 91, 0.13);
    }
.closing-orbit-one { width: 400px; height: 400px; }
.closing-orbit-two { width: 300px; height: 300px; }
/* Center card — vertically & horizontally centered content */

    .closing-center-card {
      position: relative;
      z-index: 3;

      width: 270px;
      height: 270px;

      padding: 32px 28px;

      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 6px;

      text-align: center;

      border-radius: 50%;

      background:
        radial-gradient(circle at 65% 20%,
          rgba(137, 204, 192, 0.18),
          transparent 40%
        ),
        #18221f;

      color: #fff;

      box-shadow: 0 28px 60px rgba(24, 34, 31, 0.18);
    }
.closing-center-icon {
      width: 42px;
      height: 42px;

      margin-bottom: 12px;

      display: grid;
      place-items: center;

      border-radius: 50%;

      background: rgba(137, 204, 192, 0.14);
      color: #d20a5b;
    }
.closing-center-icon svg {
      width: 17px;
      height: 17px;
      stroke-width: 1.7;
    }
.closing-center-card > span {
      font-family: "DM Sans", sans-serif;
      font-size: 8px;
      font-weight: 600;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: #d20a5b;
    }
.closing-center-card strong {
      margin-top: 4px;

      font-family: "Playfair Display", serif;
      font-weight: 400;
      font-size: 26px;
      line-height: 1.05;
      letter-spacing: -0.02em;
    }
.closing-center-card small {
      max-width: 22ch;
      margin-top: 10px;

      font-family: "Manrope", sans-serif;
      font-size: 10.5px;
      line-height: 1.5;
      color: rgba(255, 255, 255, 0.6);
    }
/* Floating info-cards */

    .closing-floating {
      position: absolute;

      min-width: 160px;
      min-height: 60px;

      padding: 10px 14px;

      display: flex;
      align-items: center;
      gap: 11px;

      border-radius: 16px;

      background: rgba(255, 255, 255, 0.85);
      border: 1px solid rgba(255, 255, 255, 0.75);
      backdrop-filter: blur(16px);
      -webkit-backdrop-filter: blur(16px);

      box-shadow: 0 16px 36px rgba(25, 35, 31, 0.07);

      color: #18221f;
    }
.closing-floating > svg {
      width: 17px;
      height: 17px;
      color: #4c958a;
      stroke-width: 1.7;
      flex-shrink: 0;
    }
.closing-floating > span {
      display: flex;
      flex-direction: column;
      gap: 2px;

      font-family: "DM Sans", sans-serif;
      font-size: 11px;
      font-weight: 600;
    }
.closing-floating small {
      font-size: 8px;
      font-weight: 500;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: #919a96;
    }
.closing-floating-one   { top: 20px;    left: -10px; }
.closing-floating-two   { top: 130px;   right: -10px; }
.closing-floating-three { bottom: 30px; left: 10px; }
.closing-floating-four  { bottom: 40px; right: -5px; }
/* Footer strip */

    .closing-bottom {
      min-height: 74px;

      margin-top: 14px;
      padding: 18px 20px;

      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 24px;

      border-top: 1px solid rgba(24, 34, 31, 0.09);

      color: #18221f;
    }
.closing-bottom-left {
      display: flex;
      flex-direction: column;
      gap: 3px;
    }
.closing-bottom-left span {
      font-family: "DM Sans", sans-serif;
      font-size: 8px;
      font-weight: 600;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: #4c958a;
    }
.closing-bottom-left strong {
      font-family: "Playfair Display", serif;
      font-size: 16px;
      font-weight: 400;
      letter-spacing: -0.01em;
    }
.closing-bottom-links {
      display: flex;
      align-items: center;
      gap: 24px;
    }
.closing-bottom-links a {
      font-family: "DM Sans", sans-serif;
      font-size: 10px;
      font-weight: 500;
      color: #919a96;
      text-decoration: none;

      transition: color 0.25s ease;
    }
.closing-bottom-links a:hover {
      color: #18221f;
    }
.sos-standort-actions .btn-call {
  background: #18221f;
  color: #fff;
}
.sos-standort-actions .btn-call:hover {
  background: #253430;
  transform: translateY(-2px);
}
.sos-standort-actions .btn-route {
  background: #fff;
  border: 1px solid rgba(24, 34, 31, 0.12);
  color: #18221f;
}
.sos-standort-actions .btn-route:hover {
  background: #f5f3ee;
  transform: translateY(-2px);
}


/* ==== @media (aus shared.css umverteilt) ==== */
@media (max-width: 1180px) {

      .navbar {
        grid-template-columns: 1fr auto;
      }

      .nav-links {
        display: none;
      }

      .hero-grid {
        grid-template-columns: 1fr 1fr;

        gap: 35px;
      }

      .hero-title {
        font-size: clamp(58px, 6vw, 78px);
      }

      .hero-bg-image {
        width: 52%;
      }

    }

@media (max-width: 900px) {

      .hero-inner {
        width: min(calc(100% - 30px), var(--container));
      }

      .navbar {
        height: 86px;
      }

      .brand-logo {
        height: 42px;
      }

      .nav-btn {
        min-height: 46px;
        padding: 0 18px;
      }

      .hero-grid {
        display: flex;
        flex-direction: column;

        align-items: stretch;

        padding-top: 56px;
      }

      .hero-content {
        max-width: 760px;
      }

      .hero-description {
        max-width: 650px;
      }

      /* On tablet+mobile the full-bleed image becomes a normal top-band */
      .hero-bg-image {
        position: relative;
        width: 100%;
        height: 480px;
        top: auto;
        right: auto;
        bottom: auto;
      }

      .hero-bg-image::before {
        background:
          linear-gradient(
            to bottom,
            transparent 60%,
            rgba(245, 243, 238, 0.85) 100%
          );
      }

      .hero-visual {
        width: 100%;
        height: 480px;
        min-height: unset;
      }

      .live-card {
        right: 16px;
        bottom: 16px;
      }

    }

@media (max-width: 620px) {

      .hero-inner {
        width: calc(100% - 24px);
      }

      .brand-logo {
        height: 36px;
      }

      .nav-btn {
        font-size: 0;
        width: 46px;
        padding: 0;
      }

      .nav-btn svg {
        margin: auto;
      }

      .hero-grid {
        padding-top: 42px;
        gap: 40px;
      }

      .eyebrow {
        margin-bottom: 23px;
      }

      .hero-title {
        font-size: clamp(50px, 15vw, 68px);
      }

      .hero-description {
        margin-top: 26px;

        font-size: 15px;
      }

      .hero-actions {
        align-items: stretch;
        flex-direction: column;
      }

      .btn {
        width: 100%;
      }

      .hero-bg-image,
      .hero-visual {
        height: 400px;
      }

      .live-card {
        width: 260px;
        right: 12px;
        bottom: 12px;
      }

    }

@media (max-width: 1000px) {

      .quick-help-inner {
        padding: 46px 38px 26px;
      }

      .quick-help-content {
        grid-template-columns: 1fr;
        gap: 36px;
      }

      .quick-help-actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
      }

    }

@media (max-width: 680px) {

      .quick-help {
        padding: 12px 12px 0;
      }

      .quick-help-inner {
        padding: 34px 20px 22px;

        border-radius: 24px;
      }

      .quick-help-copy h2 {
        font-size: 42px;
      }

      .quick-help-copy p {
        font-size: 14px;
      }

      .quick-help-actions {
        grid-template-columns: 1fr;
      }

      .quick-help-status {
        align-items: flex-start;
        flex-direction: column;

        gap: 12px;
      }

      .status-divider {
        display: none;
      }

    }

@media (prefers-reduced-motion: reduce) {
      .location-card,
      .location-card[data-anim] {
        opacity: 1;
        transform: none;
        transition: box-shadow 0.35s ease;
      }
    }

@media (max-width: 1100px) {
      .location-grid {
        grid-template-columns: repeat(2, 1fr);
      }
    }

@media (max-width: 700px) {
      .locations-section {
        padding-left: 14px;
        padding-right: 14px;
      }

      .locations-heading h2 {
        font-size: 46px;
      }

      .location-grid {
        grid-template-columns: 1fr;
      }

      /* on mobile: no dramatic slide, just fade in */
      .location-card[data-anim] {
        transform: translateY(30px);
      }
    }

@media (max-width: 1050px) {
      .delivery-process {
        grid-template-columns: 1fr;
      }
      .ds-topline {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
      }
    }

@media (max-width: 700px) {
      .same-day {
        padding-left: 14px;
        padding-right: 14px;
      }
      .same-day-heading h2 { font-size: 44px; }

      .deadline-strip {
        padding: 22px 18px 18px;
      }

      .ds-flag-label strong { font-size: 12px; }

      .same-day-bottom {
        max-width: 100%;
        padding: 22px 20px 20px;
      }
    }

@media (max-width: 1050px) {
      .service-tile,
      .service-tile-wide,
      .service-tile-featured,
      .service-tile-dark {
        grid-column: span 6;
      }

      .service-tile-full {
        grid-column: span 12;
        grid-template-columns: 1fr;
        gap: 20px;
      }

      .service-tile-full .tile-content-right {
        align-items: flex-start;
      }
    }

@media (max-width: 700px) {
      .services-section {
        padding-left: 14px;
        padding-right: 14px;
      }

      .services-intro-right h2 {
        font-size: 38px;
      }

      .services-bento-grid {
        display: flex;
        flex-direction: column;
      }

      .service-tile {
        min-height: auto;
        padding: 20px;
        border-radius: 18px;
      }

      .service-tile .tile-top {
        margin-bottom: 22px;
      }
    }

@media (max-width: 1000px) {
      .reviews-grid {
        grid-template-columns: 1fr;
      }
    }

@media (max-width: 680px) {
      .reviews-section {
        padding-left: 14px;
        padding-right: 14px;
      }
      .reviews-section .reviews-header h2 {
        font-size: 38px;
      }
      .review-card {
        padding: 20px;
        min-height: auto;
      }
      .reviews-section .review-bottom {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
      }    }





@media (max-width: 1000px) {
      .journal-grid {
        grid-template-columns: 1fr 1fr;
      }
      .journal-card:nth-child(3) {
        grid-column: span 2;
      }
    }

@media (max-width: 680px) {
      .journal-section {
        padding-left: 14px;
        padding-right: 14px;
      }
      .journal-section .journal-head h2 {
        font-size: 38px;
      }
      .journal-grid {
        grid-template-columns: 1fr;
      }
      .journal-card:nth-child(3) {
        grid-column: auto;
      }
    }

@media (max-width: 1050px) {
      .city-faq__inner {
        grid-template-columns: 1fr;
        gap: 56px;
      }

      .city-faq__intro-content {
        max-width: 680px;
      }

      .city-faq__contact {
        max-width: 680px;
      }
    }

@media (max-width: 680px) {
      .city-faq {
        padding-left: 14px;
        padding-right: 14px;
      }

      .city-faq__intro-content h2 {
        font-size: 40px;
      }

      .city-faq__contact {
        margin-top: 32px;
        padding: 20px;
      }

      .city-faq__question {
        min-height: 84px;
        padding: 14px;

        grid-template-columns: 38px minmax(0, 1fr) 32px;
        gap: 12px;
      }

      .city-faq__question-icon {
        width: 38px;
        height: 38px;
        border-radius: 11px;
      }

      .city-faq__question-copy strong {
        font-size: 18px;
      }

      .city-faq__toggle {
        width: 32px;
        height: 32px;
      }

      .city-faq__answer-inner {
        margin-left: 64px;
        margin-right: 16px;
      }

      .city-faq__answer-options {
        grid-template-columns: 1fr;
      }
    }

@media (max-width: 1050px) {
      .closing-stage {
        grid-template-columns: 1fr;
        gap: 32px;
        padding: 50px;
      }
      .closing-visual {
        min-height: 460px;
      }
    }

@media (max-width: 700px) {
      .closing-section {
        padding: 70px 14px 20px;
      }
      .closing-stage {
        min-height: auto;
        padding: 34px 22px;
        border-radius: 26px;
      }
      .closing-copy h2 {
        font-size: 46px;
      }
      .closing-actions {
        flex-direction: column;
      }
      .closing-primary,
      .closing-secondary {
        width: 100%;
        min-width: 0;
      }
      .closing-visual {
        min-height: 400px;
        transform: scale(0.9);
      }
      .closing-center-card {
        width: 230px;
        height: 230px;
        padding: 26px 22px;
      }
      .closing-center-card strong {
        font-size: 22px;
      }
      .closing-orbit-one { width: 320px; height: 320px; }
      .closing-orbit-two { width: 240px; height: 240px; }
      .closing-floating {
        min-width: 140px;
      }
      .closing-bottom {
        padding: 22px 5px;
        align-items: flex-start;
        flex-direction: column;
      }
      .closing-bottom-links {
        flex-wrap: wrap;
        gap: 10px 20px;
      }
    }