/* ==========================================================================
   immomy GmbH — Design System Foundations
   Colors, Typography, Spacing, Radii, Shadows
   ==========================================================================
   Source of truth: source_guidelines/immomy-brand-guidelines.md
   Logo colors observed (cube has THREE faces, not two):
     - Top:   Teal   #0D4F5C  (brand guideline primary)
     - Left:  Maroon #4A1515  (brand guideline accent)
     - Right: Forest #1F5A4E  (supporting depth face, not a primary brand token)
   ========================================================================== */

/* Typography: brand guideline specifies "klare, geometrische Sans-Serif —
   optisch: Nunito, Poppins oder ähnlich". We use Nunito Sans as the
   primary CI face (Google Fonts substitute — flagged to user). Arial is
   the mandatory e-mail / office fallback per guideline §9. */
/* Nunito — wider, rounder humanist sans. Matches CI ("Nunito oder ähnlich")
   and reads more confidently at body/display sizes than Nunito Sans. */
/* cyrillic-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/3e437570.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/d9eb5d23.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/fa3872ef.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/37b9d9e6.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/bbdc1b62.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/3e437570.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/d9eb5d23.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/fa3872ef.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/37b9d9e6.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/bbdc1b62.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/3e437570.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/d9eb5d23.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/fa3872ef.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/37b9d9e6.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/bbdc1b62.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/3e437570.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/d9eb5d23.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/fa3872ef.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/37b9d9e6.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/bbdc1b62.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../fonts/3e437570.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../fonts/d9eb5d23.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../fonts/fa3872ef.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../fonts/37b9d9e6.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../fonts/bbdc1b62.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("../fonts/3e437570.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("../fonts/d9eb5d23.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("../fonts/fa3872ef.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("../fonts/37b9d9e6.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("../fonts/bbdc1b62.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* cyrillic-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/bba70963.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/732b2aa0.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/2db4783e.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/8e7fcaad.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/0dc065ed.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/afba4cf7.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/b01391b9.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/badfd548.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/fd968b5f.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/90bdca0a.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/cef520a6.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/11be6f4a.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/771ca900.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/c0157d26.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/085c95ff.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


:root {
  /* ---------- Primary brand colors ---------- */
  --immomy-teal:         #0D4F5C;  /* Primary — CTAs, links, accents */
  --immomy-teal-hover:   #0A3F4A;  /* -15% for hover */
  --immomy-teal-soft:    #E6EEF0;  /* tint for backgrounds */
  --immomy-maroon:       #4A1515;  /* Secondary / accent — sparingly */
  --immomy-maroon-hover: #3B1010;
  --immomy-forest:       #1F5A4E;  /* Cube right-face — supporting depth / status */
  --immomy-charcoal:     #1E1E1E;  /* Wordmark, headlines */

  /* ---------- Neutrals ---------- */
  --white:               #FFFFFF;
  --off-white:           #F5F5F5;  /* Page bg, cards */
  --light-gray:          #E0E0E0;  /* Dividers, borders */
  --mid-gray:            #888888;  /* Captions, disclaimers */
  --subtitle-gray:       #444444;  /* Subtitles */
  --dark-text:           #222222;  /* Body copy */

  /* ---------- Semantic foreground / background ---------- */
  --fg-1:                var(--charcoal, #1E1E1E);  /* Headlines */
  --fg-2:                var(--dark-text, #222222); /* Body */
  --fg-3:                var(--subtitle-gray, #444444);
  --fg-4:                var(--mid-gray, #888888);
  --fg-on-dark:          #FFFFFF;

  --bg-page:             #FFFFFF;
  --bg-elevated:         #F5F5F5;
  --bg-inverse:          #0D4F5C;
  --bg-glass:            rgba(255,255,255,0.72);   /* for transparent UI */
  --bg-glass-dark:       rgba(13,79,92,0.65);

  --border:              #E0E0E0;
  --border-strong:       #888888;
  --focus-ring:          #0D4F5C;

  /* ---------- Typography ---------- */
  --font-sans: 'Nunito', 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --font-office: Arial, sans-serif;   /* e-mail & office docs (guideline §9) */
  /* Spec / "mission" label face — monospace. Used for numbers (01, 02 …),
     status words (resting, active), metadata, eyebrows. Reads precise,
     technical and professional — like a spec sheet, not marketing. */
  --font-mono: 'IBM Plex Mono', ui-monospace, 'SF Mono', 'Menlo', monospace;

  --fw-regular: 400;    /* @kind font */
  --fw-semibold: 600;   /* @kind font */
  --fw-bold: 700;       /* @kind font */
  --fw-extrabold: 800;  /* @kind font */

  /* Type scale — pixel values from brand guideline §4 */
  --fs-hero:       56px;
  --fs-h1:         44px;
  --fs-h2:         32px;
  --fs-h3:         22px;
  --fs-body-lg:    17px;
  --fs-body:       16px;
  --fs-body-sm:    14px;
  --fs-caption:    12px;
  --fs-cta:        15px;

  --lh-tight:  1.15;   /* @kind other */
  --lh-snug:   1.3;    /* @kind other */
  --lh-body:   1.55;   /* @kind other */
  --lh-loose:  1.7;    /* @kind other */

  --ls-tight:  -0.02em;  /* @kind other */
  --ls-normal: 0;        /* @kind other */
  --ls-wide:   0.08em;   /* @kind other */

  /* ---------- Spacing (guideline §5) ---------- */
  --space-xs:   8px;
  --space-s:   16px;
  --space-m:   24px;
  --space-m2:  32px;
  --space-l:   48px;
  --space-xl:  80px;
  --space-2xl: 120px;

  /* ---------- Radii ---------- */
  --radius-sm: 4px;   /* forms, inputs */
  --radius-md: 6px;   /* buttons */
  --radius-lg: 12px;  /* cards */
  --radius-xl: 20px;  /* hero surfaces */

  /* ---------- Shadows ---------- */
  --shadow-1: 0 1px 2px rgba(30,30,30,0.06), 0 1px 1px rgba(30,30,30,0.04);
  --shadow-2: 0 4px 12px rgba(30,30,30,0.08), 0 2px 4px rgba(30,30,30,0.04);
  --shadow-3: 0 12px 32px rgba(13,79,92,0.14), 0 4px 8px rgba(30,30,30,0.06);
  --shadow-inset: inset 0 0 0 1px var(--border);

  /* ---------- Layout tokens ---------- */
  --container-max: 1280px;
  --container-pad-desktop: 64px;
  --container-pad-mobile:  20px;

  /* ---------- Motion ---------- */
  --ease-standard: cubic-bezier(.2,.8,.2,1);   /* @kind other */
  --ease-out:      cubic-bezier(.16,1,.3,1);   /* @kind other */
  --dur-fast:      140ms;   /* @kind other */
  --dur-base:      240ms;   /* @kind other */
  --dur-slow:      420ms;   /* @kind other */
}

/* ==========================================================================
   Semantic element defaults (opt-in: apply .immomy-typography to a root)
   ========================================================================== */

.immomy-typography {
  font-family: var(--font-sans);
  font-weight: var(--fw-regular);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--fg-2);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.immomy-typography h1,
.immomy-typography .h1 {
  font-family: var(--font-sans);
  font-size: var(--fs-h1);
  font-weight: var(--fw-bold);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-tight);
  color: var(--fg-1);
  margin: 0 0 var(--space-m);
}

.immomy-typography .hero-title {
  font-size: var(--fs-hero);
  font-weight: var(--fw-extrabold);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-tight);
  color: var(--fg-1);
}

.immomy-typography h2,
.immomy-typography .h2 {
  font-size: var(--fs-h2);
  font-weight: var(--fw-bold);
  line-height: var(--lh-snug);
  letter-spacing: var(--ls-tight);
  color: var(--fg-1);
  margin: 0 0 var(--space-s);
}

.immomy-typography h3,
.immomy-typography .h3 {
  font-size: var(--fs-h3);
  font-weight: var(--fw-semibold);
  line-height: var(--lh-snug);
  color: var(--fg-1);
  margin: 0 0 var(--space-xs);
}

.immomy-typography p,
.immomy-typography .body {
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--fg-2);
  margin: 0 0 var(--space-s);
  max-width: 68ch;
}

.immomy-typography .lede {
  font-size: var(--fs-body-lg);
  color: var(--fg-3);
  line-height: var(--lh-body);
}

.immomy-typography .caption {
  font-size: var(--fs-caption);
  color: var(--fg-4);
  line-height: var(--lh-snug);
}

.immomy-typography .eyebrow {
  font-family: var(--font-mono);
  font-size: var(--fs-caption);
  font-weight: 500;
  letter-spacing: var(--ls-wide);
  text-transform: uppercase;
  color: var(--immomy-teal);
}

/* Spec label — the "mission / spec-sheet" treatment. Apply to numbers,
   status words (resting · active · 01 · 02), metadata captions, kickers.
   Monospace + wide tracking = precise, technical, professional. */
.spec-label,
.immomy-typography .spec-label {
  font-family: var(--font-mono);
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-size: 11px;
  color: var(--fg-4);
}
.spec-num {
  font-family: var(--font-mono);
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
  color: var(--immomy-teal);
}

.immomy-typography a {
  color: var(--immomy-teal);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color var(--dur-fast) var(--ease-standard);
}
.immomy-typography a:hover { border-bottom-color: var(--immomy-teal); }

/* Section number counter (01, 02 … used in hero cards, guideline §4) */
.immomy-typography .section-number {
  font-family: var(--font-mono);
  font-size: var(--fs-h2);
  font-weight: 500;
  color: var(--immomy-teal);
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
}


/* ==========================================================================
   Immoventra — site-level extensions on top of the Immomy Design System.
   Canonical tokens load from _ds/.../colors_and_type.css (colors, type,
   spacing, radii, shadows, motion, --font-mono spec-label face).
   This file only adds the glass-surface tokens used by the site chrome,
   matching ui_kits/glass and README §4 "Transparency & blur".
   ========================================================================== */
:root {
  --glass-light:        rgba(255,255,255,0.72);
  --glass-light-border: rgba(255,255,255,0.5);
  --glass-dark:         rgba(13,79,92,0.55);
  --glass-dark-border:  rgba(255,255,255,0.18);
  --glass-blur:         18px;
  --glass-shadow:       0 12px 32px rgba(13,79,92,0.14), 0 4px 8px rgba(30,30,30,0.06);
}


/* cyrillic-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/3e437570.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/d9eb5d23.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/fa3872ef.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/37b9d9e6.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/bbdc1b62.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/3e437570.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/d9eb5d23.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/fa3872ef.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/37b9d9e6.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/bbdc1b62.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/3e437570.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/d9eb5d23.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/fa3872ef.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/37b9d9e6.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/bbdc1b62.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/3e437570.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/d9eb5d23.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/fa3872ef.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/37b9d9e6.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/bbdc1b62.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../fonts/3e437570.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../fonts/d9eb5d23.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../fonts/fa3872ef.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../fonts/37b9d9e6.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../fonts/bbdc1b62.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("../fonts/3e437570.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("../fonts/d9eb5d23.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("../fonts/fa3872ef.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("../fonts/37b9d9e6.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("../fonts/bbdc1b62.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* cyrillic-ext */
@font-face {
  font-family: 'Carlito';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/b29570a3.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Carlito';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/513b5a8c.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Carlito';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/3120b1fc.woff2") format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Carlito';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/edb378bf.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Carlito';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/21cf14c8.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Carlito';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/5ddb2fba.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Carlito';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/d62f1c45.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Carlito';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/84b0c5f5.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Carlito';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/fa393f41.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Carlito';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/80ddfd62.woff2") format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Carlito';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/4e144578.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Carlito';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/f74b6c11.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Carlito';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/2191e968.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Carlito';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/fd98a0dd.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* Immomy Design System tokens (see _ds/.../colors_and_type.css) drive the
     palette below. Per explicit brief, type is unified to Nunito everywhere
     (the DS spec-label/mono treatment is intentionally not used here). */
  --bg: var(--bg-page, #ffffff);
  --bg-soft: var(--off-white, #f5f5f5);
  --bg-card: #ffffff;
  --ink: var(--immomy-charcoal, #1e1e1e);
  --ink-2: var(--immomy-charcoal, #1e1e1e);
  --ink-3: var(--subtitle-gray, #444444);
  --ink-4: var(--mid-gray, #888888);
  --line: var(--light-gray, #e0e0e0);
  --line-2: #ececec;

  --navy: var(--immomy-teal, #0d4f5c);
  --navy-deep: var(--immomy-teal-hover, #0a3f4a);
  --navy-soft: var(--immomy-teal-soft, #e6eef0);

  --green: var(--immomy-teal, #0d4f5c);
  --green-deep: #143d34;
  --green-soft: var(--immomy-teal-soft, #e6eef0);

  --teal: var(--immomy-teal, #0d4f5c);
  --teal-deep: #143d34;
  --teal-soft: var(--immomy-teal-soft, #e6eef0);
  --blue: var(--immomy-teal, #0d4f5c);
  --blue-deep: var(--immomy-teal-hover, #0a3f4a);
  --forest: var(--immomy-forest, #1f5a4e);
  --brown: var(--immomy-maroon, #4a1515);
  --brown-soft: #f0e3e3;

  --emergency: var(--immomy-maroon, #4a1515);
  --emergency-deep: var(--immomy-maroon-hover, #3b1010);

  /* Display face für Überschriften — auf Nunito vereinheitlicht (Wunsch Altay
     2026-07-17), damit Hero/Sektions-Titel und Fließtext dieselbe Schrift
     zeigen. Calibri/Carlito/Segoe UI bleiben nur als Havarie-Fallback, falls
     der Nunito-Webfont ausnahmsweise nicht lädt. */
  --font-display: 'Nunito', Calibri, 'Carlito', 'Segoe UI', system-ui, sans-serif;

  --radius: 12px;       /* = DS --radius-lg (cards) */
  --radius-lg: 20px;    /* = DS --radius-xl (hero surfaces) */
  --shadow-sm: 0 1px 2px rgba(30,30,30,0.06), 0 1px 1px rgba(30,30,30,0.04);
  --shadow-md: 0 4px 12px rgba(30,30,30,0.08), 0 2px 4px rgba(30,30,30,0.04);
  --shadow-lg: 0 18px 44px -16px rgba(13,79,92,0.16), 0 6px 14px -8px rgba(30,30,30,0.08);

  --max: var(--container-max, 1280px);
  --max-narrow: 980px;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: 'Nunito', system-ui, -apple-system, "Segoe UI", sans-serif;
  background: var(--bg);
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
  font-size: 16px;
  line-height: 1.55;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; border: none; background: none; color: inherit; }
input, textarea, select { font: inherit; color: inherit; }

.serif { font-family: var(--font-display); font-weight: 700; letter-spacing: -0.02em; }
.eyebrow {
  font-family: var(--font-mono);
  font-size: 11px; font-weight: 500;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--teal);
  display: inline-flex; align-items: center; gap: 8px;
}
.eyebrow::before {
  content: ""; width: 22px; height: 1px; background: var(--teal); display: inline-block;
}
.container { max-width: var(--max); margin: 0 auto; padding: 0 32px; }
.container.narrow { max-width: var(--max-narrow); }

/* ---------- Header ---------- */
.topbar {
  background: var(--navy);
  color: #d9dde0;
  font-size: 13px;
}
.topbar-inner {
  display: flex; justify-content: space-between; align-items: center;
  height: 38px; gap: 24px;
}
.topbar a { color: #d9dde0; }
.topbar .left { display: flex; gap: 22px; align-items: center; }
.topbar .right { display: flex; gap: 22px; align-items: center; }
.topbar .pill {
  background: #0d4f5c; color: #fff;
  /* immoventra grün pill */
  padding: 4px 12px; border-radius: 6px; font-weight: 600;
  display: inline-flex; gap: 8px; align-items: center;
  font-size: 12px; letter-spacing: 0.02em;
}
.topbar .dot {
  width: 7px; height: 7px; border-radius: 50%; background: #fff;
  box-shadow: 0 0 0 0 rgba(255,255,255,0.6);
  animation: pulse 1.6s infinite;
}
@keyframes pulse {
  0% { box-shadow: 0 0 0 0 rgba(255,255,255,0.7); }
  70% { box-shadow: 0 0 0 8px rgba(255,255,255,0); }
  100% { box-shadow: 0 0 0 0 rgba(255,255,255,0); }
}

.nav {
  position: sticky; top: 0; z-index: 50;
  background: rgba(255,255,255,0.72);
  backdrop-filter: saturate(140%) blur(16px);
  border-bottom: 1px solid var(--line-2);
}
.nav-inner {
  display: flex; align-items: center; justify-content: space-between;
  height: 88px; gap: 32px;
}
.nav .logo img { height: 50px; width: auto; }
.nav-links { display: flex; gap: 32px; align-items: center; }
.nav-links a {
  font-size: 14px; font-weight: 500; color: var(--ink-2);
  position: relative; padding: 6px 0;
}
.nav-links a:hover { color: var(--teal); }
.nav-cta {
  display: flex; gap: 12px; align-items: center;
}

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 14px 22px; border-radius: 6px;
  font-weight: 600; font-size: 14px; letter-spacing: 0.01em;
  transition: transform var(--dur-fast) var(--ease-standard), background var(--dur-fast) var(--ease-standard), box-shadow var(--dur-fast) var(--ease-standard);
  cursor: pointer; border: 1px solid transparent;
}
.btn:active { transform: scale(0.98); box-shadow: none; }
.btn-primary {
  background: var(--teal); color: #fff;
}
.btn-primary:hover { background: var(--navy-deep); transform: translateY(-1px); }
.btn-emergency {
  background: var(--emergency); color: #fff;
  box-shadow: 0 6px 20px -6px rgba(74,21,21,0.45);
  font-size: 15px; white-space: nowrap;
}
.btn-emergency:hover { background: var(--emergency-deep); transform: translateY(-1px); }
.btn-ghost {
  background: rgba(255,255,255,0.85); color: var(--ink); border-color: var(--ink-soft);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.btn-ghost:hover { background: #ffffff; }
.btn-link {
  padding: 0; color: var(--navy); font-weight: 600; font-size: 14px;
  display: inline-flex; align-items: center; gap: 8px;
}
.btn-link:hover { gap: 12px; }
.btn .arrow {
  width: 18px; height: 18px; display: inline-flex; align-items: center; justify-content: center;
}

/* ---------- Hero ---------- */
.hero {
  position: relative;
  padding: 56px 0 72px;
  overflow: hidden;
}
/* Full-bleed variant: photo spans the whole section, copy sits on the
   faded left zone of the image behind a soft white scrim. */
.hero.hero-bleed { padding: 0; display: flex; align-items: center; }
.hero-bleed .hero-bg {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: center 28%;
  z-index: 0;
}
.hero-bleed .hero-scrim {
  position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(90deg,
    rgba(255,255,255,0.9) 0%,
    rgba(255,255,255,0.74) 30%,
    rgba(255,255,255,0.3) 52%,
    rgba(255,255,255,0) 70%);
}
.hero-bleed .container { position: relative; z-index: 2; width: 100%; }
.hero-bleed .hero-grid { align-items: stretch; }
.hero-bleed .hero-visual {
  aspect-ratio: auto; background: none; border: none; box-shadow: none;
  border-radius: 0; overflow: visible; position: relative;
}
.hero-bleed .hero-visual .label { top: auto; bottom: 8px; left: auto; right: 0; }
.hero-bleed .hero-card.top { left: auto; right: 0; top: 48px; }
.hero-grid {
  display: grid; grid-template-columns: 1fr 1.1fr; gap: 44px; align-items: center;
}
.hero h1 {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: clamp(38px, 3.4vw, 56px);
  line-height: 1.02;
  letter-spacing: -0.02em;
  margin: 18px 0 18px;
  color: #1e1e1e;
}
.hero h1 em {
  font-style: normal; color: var(--green); font-weight: 700;
}
.hero p.lede {
  font-size: 18px; color: var(--ink-3); max-width: 540px; margin: 0 0 30px;
}
.hero .ctas { display: flex; gap: 14px; flex-wrap: wrap; align-items: center; }
.hero .meta {
  margin-top: 28px; display: flex; gap: 28px; flex-wrap: wrap;
  color: var(--ink-3); font-size: 13px;
}
.hero .meta b { color: var(--ink); font-weight: 600; }

.hero-visual {
  position: relative;
  aspect-ratio: 16/10;
  border-radius: var(--radius-lg);
  background:
    repeating-linear-gradient(135deg, #eef0ec 0 18px, #f5f6f3 18px 36px),
    var(--teal-soft);
  overflow: hidden;
  border: 1px solid var(--line);
  box-shadow: var(--shadow-lg);
}
.hero-visual .photo-fill,
.whyus-visual .photo-fill {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  background: #f5f6f3;
  display: block;
  z-index: 0;
}
.hero-visual .label,
.whyus-visual .label {
  z-index: 2;
}
.hero-visual .label {
  position: absolute; left: 18px; top: 18px;
  font-family: var(--font-mono);
  font-size: 10.5px; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--teal);
  background: var(--glass-light);
  backdrop-filter: blur(var(--glass-blur)) saturate(140%); -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(140%);
  padding: 6px 11px; border-radius: 6px; border: 1px solid var(--glass-light-border);
}
.hero-visual .photo-placeholder {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;  color: var(--ink-4);
  font-family: 'Nunito', system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: 12px;
  text-align: center;
  padding: 40px;
}
.hero-card {
  position: absolute; right: -18px; bottom: 40px;
  background: var(--glass-light);
  backdrop-filter: blur(var(--glass-blur)) saturate(140%); -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(140%);
  border: 1px solid var(--glass-light-border);
  border-radius: 16px;
  padding: 18px 20px;
  box-shadow: var(--glass-shadow);
  display: flex; align-items: center; gap: 14px;
  width: 280px;
}
.hero-card .icon {
  width: 44px; height: 44px; border-radius: 12px;
  background: var(--teal); color: #fff;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.hero-card .ttl { font-weight: 600; font-size: 14px; }
.hero-card .sub { font-size: 12px; color: var(--ink-3); margin-top: 2px; }

.hero-card.top {
  top: auto; bottom: 22px; left: auto; right: -18px;
  width: 240px;
}
.hero-card .pulse-dot {
  width: 10px; height: 10px; border-radius: 50%;
  background: #1f5a4e;
  box-shadow: 0 0 0 0 rgba(43, 182, 115, 0.6);
  animation: pulse 1.6s infinite;
  flex-shrink: 0;
}

/* ---------- Trust bar ---------- */
.trustbar-wrap {
  position: fixed;
  left: 16px;
  right: 16px;
  bottom: 16px;
  z-index: 30;
  pointer-events: none;
}
.trustbar {
  position: relative;
  background: rgba(255,255,255,0.82);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-radius: 18px;
  border: 1px solid rgba(20,24,27,0.08);
  box-shadow: 0 18px 40px -12px rgba(20,24,27,0.18), 0 4px 12px rgba(20,24,27,0.06);
  padding: 11px 0;
  overflow: hidden;
  pointer-events: auto;
  min-height: 96px;
}
.tb-glass {
  position: absolute;
  inset: 0;
  border-radius: 20px;
  pointer-events: none;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.6), inset 0 -1px 0 rgba(20,24,27,0.05);
  z-index: 4;
}
.tb-water-svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  pointer-events: none;
  border-radius: 20px;
  overflow: hidden;
}
.tb-container {
  position: relative;
  z-index: 3;
  padding: 0 28px;
}
.tb-head {
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.tb-logo {
  height: 24px;
  width: auto;
  object-fit: contain;
}
.tb-eyebrow {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #0f3a45;
  white-space: nowrap;
}
.tb-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 12px;
  padding-right: 180px;
}
.tb-head-text { display: flex; flex-direction: column; gap: 2px; }
.tb-eyebrow-sub {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #3f5a64;
}
.tb-num {
  width: 24px; height: 24px; flex-shrink: 0;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,0.28);
  display: flex; align-items: center; justify-content: center;
  font-family: 'Nunito', system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: 12.5px;
  font-weight: 700;
  color: #fff;
  background: rgba(255,255,255,0.06);
  transition: color 0.25s ease, border-color 0.25s ease, background 0.25s ease;
}
/* VE Blau / NT Grün / RA Braun */
.tb-step:nth-child(1) .tb-num,
.tb-step:nth-child(2) .tb-num {
  background: linear-gradient(135deg, #0d4f5c 0%, #0a3f4a 100%) !important;
  border-color: rgba(255,255,255,0.35) !important;
  color: #fff !important;
}
.tb-step:nth-child(3) .tb-num,
.tb-step:nth-child(4) .tb-num {
  background: linear-gradient(135deg, #1f5a4e 0%, #143d34 100%) !important;
  border-color: rgba(255,255,255,0.35) !important;
  color: #fff !important;
}
.tb-step:nth-child(5) .tb-num,
.tb-step:nth-child(6) .tb-num {
  background: linear-gradient(135deg, #5a1a1a 0%, #4a1515 100%) !important;
  border-color: rgba(255,255,255,0.35) !important;
  color: #fff !important;
}
.tb-ttl {
  font-size: 11px; font-weight: 600;
  margin-bottom: 1px;
  color: #14212a;
  text-shadow: none;
  transition: color 0.25s ease, text-shadow 0.25s ease;
  line-height: 1.2;
}
.tb-sub {
  font-size: 10px; line-height: 1.3;
  color: #4a5a62;
  text-shadow: none;
  transition: color 0.25s ease, text-shadow 0.25s ease;
}
.tb-cta {
  position: absolute;
  right: 18px;
  top: 28%;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  border-radius: 6px;
  background: var(--emergency);
  color: #fff !important;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.01em;
  box-shadow: 0 10px 24px -8px rgba(74, 21, 21, 0.5), 0 0 0 0 rgba(74, 21, 21, 0.4);
  transition: opacity 0.4s ease, transform 0.4s ease, box-shadow 0.25s ease, filter 0.2s ease, background 0.2s ease;
  z-index: 5;
  animation: tbCtaPulse 2.4s ease-in-out infinite;
}
.tb-cta:hover {
  background: var(--emergency-deep);
  filter: brightness(1.04);
  box-shadow: 0 12px 28px -8px rgba(74, 21, 21, 0.65);
}
@keyframes tbCtaPulse {
  0%, 100% { box-shadow: 0 10px 24px -8px rgba(74, 21, 21, 0.5), 0 0 0 0 rgba(74, 21, 21, 0.4); }
  50%      { box-shadow: 0 10px 24px -8px rgba(74, 21, 21, 0.5), 0 0 0 10px rgba(74, 21, 21, 0); }
}
.tb-step {
  display: flex;
  gap: 8px;
  align-items: flex-start;
}
body { padding-bottom: 140px; }
@media (max-width: 1024px) {
  .tb-grid { grid-template-columns: 1fr 1fr; padding-right: 0; }
  .tb-cta { position: static; transform: none; margin-top: 16px; }
}
@media (max-width: 640px) {
  .trustbar-wrap { left: 8px; right: 8px; bottom: 8px; }
  /* Mobil: nur Logo + Konzept-Zeile — die VENTRA-Schritte gibt es nur am Desktop */
  .tb-grid { display: none; }
  .trustbar { min-height: 0; padding: 10px 0; }
  .tb-head { margin-bottom: 0; padding-right: 0; justify-content: center; text-align: center; transition: opacity 0.3s ease; }
  /* Text weicht, sobald der Kontakt-Button erscheint — Button mittig */
  .tb-cta-visible .tb-head { opacity: 0; }
  .tb-eyebrow { white-space: normal; font-size: 10px; letter-spacing: 0.08em; }
  .tb-eyebrow-sub { display: none; }
  .tb-container { padding: 0 16px; }
  .tb-cta {
    position: absolute; left: 50%; right: auto; top: 50%;
    transform: translate(-50%, -50%) !important;
    margin-top: 0;
    padding: 7px 12px; font-size: 12px; gap: 6px;
  }
  body { padding-bottom: 84px; }
}
.trustbar-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
}
.trustbar-grid .item {
  display: flex; gap: 14px; align-items: flex-start;
}
.trustbar-grid .icon {
  width: 36px; height: 36px; flex-shrink: 0;
  border-radius: 10px;
  background: rgba(255,255,255,0.06);
  display: flex; align-items: center; justify-content: center;
  color: #d9dde0;
}
.trustbar-grid .ttl {
  font-size: 14px; font-weight: 600; color: #fff;
}
.trustbar-grid .sub {
  font-size: 12px; color: #9aa0a6; margin-top: 2px; line-height: 1.5;
}

/* ---------- Sections ---------- */
.section { padding: 120px 0; }
.section.tight { padding: 88px 0; }
.section-head {
  max-width: 720px; margin: 0 0 56px;
}
.section-head.center { margin-left: auto; margin-right: auto; text-align: center; }
.section-head h2 {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: clamp(32px, 3.4vw, 48px);
  line-height: 1.05;
  letter-spacing: -0.02em;
  margin: 14px 0 18px;
  color: #1e1e1e;
}
.section-head h2 em { font-style: normal; color: var(--green); font-weight: 700; }
.eyebrow-xl {
  font-size: 13px !important;
  letter-spacing: 0.14em !important;
  font-weight: 600 !important;
  color: var(--green) !important;
  margin-top: 4px;
}
.process-head .process-headline {
  margin-bottom: 6px;
}
.process-head h2 {
  margin-top: 0;
}
.process-head .eyebrow-xl {
  display: inline-flex;
  margin: 14px 0 10px;
  white-space: nowrap;
}
/* Intro-Absatz einzeilig \u2014 gr\u00f6\u00dfere Breite erlauben */
.process-head { max-width: 900px; }
@media (min-width: 1100px) {
  .process-head p { max-width: none; white-space: nowrap; }
}
.process-head .eyebrow::before { display: none !important; }
.process-head p {
  margin-top: 8px;
}
.process-overline {
  font-family: var(--font-mono);
  font-size: 11px; font-weight: 500;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--teal);
  margin: 14px 0 6px;
}
.process-headline {
  font-family: 'Nunito', system-ui, -apple-system, "Segoe UI", sans-serif;
  font-weight: 600;
  font-size: clamp(26px, 2.6vw, 36px);
  line-height: 1.15;
  letter-spacing: -0.015em;
  color: var(--ink, #1e1e1e);
  margin: 0 0 14px;
  max-width: 32ch;
  text-wrap: balance;
}
.section-head p { color: var(--ink-3); font-size: 17px; margin: 0; max-width: 56ch; }
.section-head.center p { margin-left: auto; margin-right: auto; }

/* ---------- Services — DS service-card pattern: glass cards on dark teal ---------- */
.services-dark {
  background:
    radial-gradient(900px 560px at 88% -10%, rgba(31,90,78,0.22) 0%, transparent 60%),
    radial-gradient(800px 540px at 5% 115%, rgba(13,79,92,0.34) 0%, transparent 60%),
    linear-gradient(160deg, #0e3a44 0%, #0b2c34 58%, #08232a 100%);
}
.services-dark .section-head h2 { color: #ffffff; }
.services-dark .section-head h2 em { color: #8FD3DE; }
.services-dark .section-head p { color: rgba(255,255,255,0.72); }
.services-dark .eyebrow { color: #8FD3DE; }
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
/* Overrides on the GlassPanel surface (inline-styled) need !important */
.svc-card {
  background: rgba(255,255,255,0.05) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  box-shadow: 0 12px 32px rgba(0,0,0,0.18) !important;
  display: flex;
  flex-direction: column;
}
.svc-acc0 { --accent: #8FD3DE; }
.svc-acc1 { --accent: #86D5BC; }
.svc-acc2 { --accent: #E5A8A8; }
.svc-top {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 20px;
}
.svc-tile {
  width: 56px; height: 56px; border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
}
.svc-code {
  font-family: var(--font-mono);
  font-size: 15px; font-weight: 500;
  color: rgba(255,255,255,0.4);
  letter-spacing: 0.04em; font-variant-numeric: tabular-nums;
}
.svc-ttl {
  font-size: 20px; font-weight: 700; color: #ffffff;
  letter-spacing: -0.01em; margin: 0 0 8px;
}
.svc-desc {
  font-size: 14px; color: rgba(255,255,255,0.68);
  line-height: 1.55; margin: 0 0 18px;
}
.svc-list {
  list-style: none; padding: 0; margin: auto 0 0;
  display: flex; flex-direction: column; gap: 8px;
}
.svc-list li {
  font-size: 13px; color: rgba(255,255,255,0.78);
  display: flex; gap: 10px; align-items: flex-start;
}
.svc-list li::before {
  content: ""; width: 14px; height: 1px; background: var(--accent, #8FD3DE);
  margin-top: 9px; flex-shrink: 0;
}

/* ---------- Process ---------- */
.process { background: var(--bg-soft); }
.einsatz-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 48px;
}
.einsatz-photo {
  position: relative;
  margin: 0;
  border-radius: var(--radius);
  overflow: hidden;
  aspect-ratio: 16/10;
  box-shadow: var(--shadow-2);
}
.einsatz-photo img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}
.einsatz-photo--wide {
  grid-column: 1 / -1;
  aspect-ratio: 21/9;
}
.svc-photo-end {
  margin-top: 16px;
  aspect-ratio: 21/9;
  border: 1px solid rgba(255,255,255,0.12);
  box-shadow: 0 12px 32px rgba(0,0,0,0.25);
}
@media (max-width: 640px) {
  .einsatz-photo--wide, .svc-photo-end { aspect-ratio: 16/10; }
}
.einsatz-photo .label {
  position: absolute; left: 12px; bottom: 12px; top: auto; z-index: 2;
  font-family: var(--font-mono);
  font-size: 9px; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--teal);
  background: var(--glass-light);
  backdrop-filter: blur(var(--glass-blur)) saturate(140%); -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(140%);
  padding: 4px 8px; border-radius: 5px; border: 1px solid var(--glass-light-border);
}
.process-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
  position: relative;
}
.ventra-grid {
  grid-template-columns: repeat(3, 1fr);
}
.process-step {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 28px 24px;
  position: relative;
}
.process-step .step-num {
  font-family: var(--font-mono);
  font-size: 50px; font-weight: 500;
  line-height: 1;
  color: var(--teal);
  letter-spacing: 0; font-variant-numeric: tabular-nums;
}
.ventra-letter {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: linear-gradient(135deg, #0d4f5c 0%, #0a3f4a 100%);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Nunito', system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: 30px;
  font-weight: 700;
  margin-bottom: 16px;
  box-shadow: 0 6px 14px -4px rgba(10,53,72,0.4);
}
/* Reine Immoventra-Markenfarben aus dem Logo:
   VE Blau / NT Grün / RA Braun */
.ventra-step:nth-child(1) .ventra-letter,
.ventra-step:nth-child(2) .ventra-letter {
  background: linear-gradient(135deg, #0d4f5c 0%, #0a3f4a 100%);
  box-shadow: 0 6px 14px -4px rgba(10,53,72,0.45);
}
.ventra-step:nth-child(3) .ventra-letter,
.ventra-step:nth-child(4) .ventra-letter {
  background: linear-gradient(135deg, #1f5a4e 0%, #143d34 100%);
  box-shadow: 0 6px 14px -4px rgba(5,50,41,0.45);
}
.ventra-step:nth-child(5) .ventra-letter,
.ventra-step:nth-child(6) .ventra-letter {
  background: linear-gradient(135deg, #5a1a1a 0%, #4a1515 100%);
  box-shadow: 0 6px 14px -4px rgba(76,24,16,0.5);
}
.process-step h4 {
  font-family: 'Nunito', system-ui, -apple-system, "Segoe UI", sans-serif;
  font-weight: 600;
  font-size: 19px;
  margin: 18px 0 8px;
  color: #1e1e1e;
}
.process-step p {
  margin: 0;
  font-size: 14px;
  color: var(--ink-3);
  line-height: 1.55;
}
.process-step .duration {
  margin-top: 16px;
  font-family: var(--font-mono);
  font-size: 10.5px; font-weight: 500;
  color: var(--ink-4);
  letter-spacing: 0.1em; text-transform: uppercase;
  display: flex; align-items: center; gap: 6px;
}
.process-step .duration::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%;
  background: var(--teal);
}

/* ---------- Why us ---------- */
.whyus-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: center;
}
.whyus-list {
  display: flex; flex-direction: column; gap: 0;
}
.whyus-item {
  border-top: 1px solid var(--line);
  padding: 24px 0;
  display: grid;
  grid-template-columns: 60px 1fr;
  gap: 20px;
  align-items: flex-start;
}
.whyus-item:last-child { border-bottom: 1px solid var(--line); }
.whyus-item .num {
  font-family: var(--font-mono);
  font-size: 26px; font-weight: 500;
  color: var(--teal);
  letter-spacing: 0; font-variant-numeric: tabular-nums;
}
.whyus-item h4 {
  font-family: 'Nunito', system-ui, -apple-system, "Segoe UI", sans-serif;
  font-weight: 600;
  font-size: 20px;
  margin: 0 0 6px;
  color: #1e1e1e;
}
.whyus-item p {
  margin: 0;
  font-size: 14.5px;
  color: var(--ink-3);
  line-height: 1.6;
}

.whyus-visual {
  position: relative;
  aspect-ratio: 4/5;
  border-radius: var(--radius-lg);
  background:
    repeating-linear-gradient(45deg, #ede9e0 0 16px, #f4f1e9 16px 32px),
    var(--brown-soft);
  border: 1px solid var(--line);
  overflow: hidden;
}
.whyus-visual .label {
  position: absolute; left: 18px; top: 18px;
  font-family: var(--font-mono);
  font-size: 10.5px; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--teal);
  background: var(--glass-light);
  backdrop-filter: blur(var(--glass-blur)) saturate(140%); -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(140%);
  padding: 6px 11px; border-radius: 6px; border: 1px solid var(--glass-light-border);
}
.whyus-visual .stat-card {
  position: absolute;
  background: var(--glass-light);
  backdrop-filter: blur(var(--glass-blur)) saturate(140%); -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(140%);
  border: 1px solid var(--glass-light-border);
  border-radius: 14px;
  padding: 18px 20px;
  box-shadow: var(--glass-shadow);
}
.whyus-visual .stat-card.a {
  top: 36px; right: -18px; width: 200px;
}
.whyus-visual .stat-card.b {
  bottom: 36px; left: -18px; width: 220px;
}
.stat-card .big {
  font-family: 'Nunito', system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: 40px; line-height: 1;
  color: #1e1e1e;
  letter-spacing: -0.02em;
}
.stat-card .lbl {
  font-size: 12px; color: var(--ink-3); margin-top: 6px;
}

/* ---------- Emergency callout ---------- */
.emergency {
  background: var(--navy);
  color: #fff;
  position: relative;
  overflow: hidden;
}
.emergency::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 88% 30%, rgba(255,255,255,0.06), transparent 50%),
    radial-gradient(circle at 10% 80%, rgba(74,21,21,0.20), transparent 45%);
  pointer-events: none;
}
.emergency-inner {
  position: relative;
  display: grid; grid-template-columns: 1.4fr 1fr;
  gap: 56px; align-items: center;
  padding: 80px 0;
}
.emergency h2 {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: clamp(32px, 3.4vw, 48px);
  line-height: 1.05;
  letter-spacing: -0.02em;
  margin: 16px 0 16px;
  color: #fff;
}
.emergency h2 em { font-style: normal; color: #7fc8b5; font-weight: 700; }
.emergency p { color: #b6bdc2; max-width: 520px; margin: 0 0 28px; font-size: 17px; }
.emergency .eyebrow { color: #7fc8b5; }
.emergency .eyebrow::before { background: #7fc8b5; }
.emergency .ctas { display: flex; gap: 12px; flex-wrap: wrap; }
.emergency .btn-ghost {
  border-color: rgba(255,255,255,0.2); color: #fff;
}
.emergency .btn-ghost:hover { background: rgba(255,255,255,0.06); }

.phone-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: var(--radius-lg);
  padding: 36px;
  backdrop-filter: blur(8px);
}
.phone-card .lbl {
  font-size: 12px;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: #8e9498;
  display: flex; align-items: center; gap: 10px;
}
.phone-card .lbl .dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: #1f5a4e;
  animation: pulse 1.6s infinite;
}
.phone-card .number {
  font-family: 'Nunito', system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: 44px;
  margin: 14px 0 6px;
  color: #fff;
  letter-spacing: -0.02em;
}
.phone-card .sub {
  font-size: 13px; color: #b6bdc2; margin-bottom: 22px;
}
.phone-card .row {
  display: flex; justify-content: space-between;
  padding: 14px 0;
  border-top: 1px solid rgba(255,255,255,0.08);
  font-size: 13px;
}
.phone-card .row b { color: #fff; font-weight: 500; }
.phone-card .row span { color: #b6bdc2; }

/* ---------- About ---------- */
.about {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 72px;
  align-items: center;
}
.about-visual {
  position: relative;
  aspect-ratio: 1/1;
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: var(--bg);
  border: 1px solid var(--line);
  display: flex; align-items: center; justify-content: center;
  padding: 8%;
}
.about-visual img {
  width: 100%;
  max-width: 460px;
  height: auto;
  opacity: 1;
  filter: none;
  display: block;
  mix-blend-mode: multiply;
}
.about p {
  font-size: 16.5px; color: var(--ink-2); line-height: 1.7; margin: 0 0 18px;
}
.about p.lede { font-size: 18px; color: var(--ink); }
.about .group-row {
  margin-top: 32px;
  padding-top: 28px;
  border-top: 1px solid var(--line);
  display: flex; gap: 28px; align-items: center; flex-wrap: wrap;
}
.about .group-row .lbl {
  font-size: 12px;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--ink-4);
}
.about .group-row .name {
  font-family: 'Nunito', system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: 22px;
  color: #1e1e1e;
  letter-spacing: -0.01em;
}

/* ---------- FAQ ---------- */
.faq { background: var(--bg-soft); }
.faq-list {
  max-width: 820px; margin: 0 auto;
}
.faq-item {
  border-bottom: 1px solid var(--line);
}
.faq-item:first-child { border-top: 1px solid var(--line); }
.faq-q {
  width: 100%;
  text-align: left;
  padding: 24px 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  font-family: 'Nunito', system-ui, -apple-system, "Segoe UI", sans-serif;
  font-weight: 600;
  font-size: 19px;
  color: #1e1e1e;
  letter-spacing: -0.005em;
}
.faq-q .plus {
  width: 32px; height: 32px;
  border-radius: 50%;
  border: 1px solid var(--line);
  background: #fff;
  display: flex; align-items: center; justify-content: center;
  color: var(--teal);
  flex-shrink: 0;
  transition: transform .2s ease, background .2s ease;
}
.faq-item.open .faq-q .plus {
  background: var(--teal); color: #fff; border-color: var(--teal);
  transform: rotate(45deg);
}
.faq-a {
  max-height: 0; overflow: hidden;
  transition: max-height .3s ease;
  color: var(--ink-3);
  font-size: 15px;
  line-height: 1.65;
}
.faq-item.open .faq-a {
  max-height: 400px;
  padding-bottom: 28px;
}
.faq-a p { margin: 0; max-width: 70ch; }

/* ---------- Contact ---------- */
.contact {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: start;
}
.contact-info h2 {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: clamp(32px, 3vw, 44px);
  line-height: 1.05;
  letter-spacing: -0.02em;
  margin: 14px 0 18px;
  color: #1e1e1e;
}
.contact-info h2 em { font-style: normal; color: var(--green); font-weight: 700; }
.contact-info > p { color: var(--ink-3); font-size: 17px; margin: 0 0 36px; }
.contact-info .info-block {
  display: flex; gap: 16px; padding: 20px 0;
  border-top: 1px solid var(--line);
}
.contact-info .info-block:last-child { border-bottom: 1px solid var(--line); }
.contact-info .icon-wrap {
  width: 40px; height: 40px;
  border-radius: 10px;
  background: var(--teal-soft);
  color: var(--teal);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.contact-info .lbl {
  font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-4);
}
.contact-info .val {
  font-size: 16px; color: var(--ink); margin-top: 4px;
}
.contact-info .val a { color: var(--ink); }
.contact-info .val a:hover { color: var(--teal); }

.form {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 36px;
  box-shadow: var(--shadow-sm);
}
.form .grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.field { margin-bottom: 16px; display: flex; flex-direction: column; gap: 6px; }
.field label {
  font-family: var(--font-mono);
  font-size: 11px; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--ink-3);
}
.field input,
.field select,
.field textarea {
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--bg);
  color: var(--ink);
  font-size: 14.5px;
  outline: none;
  transition: border-color var(--dur-fast) var(--ease-standard), background var(--dur-fast) var(--ease-standard), box-shadow var(--dur-fast) var(--ease-standard);
  font-family: inherit;
}
.field input:focus,
.field select:focus,
.field textarea:focus {
  border-color: var(--teal);
  background: #fff;
  box-shadow: 0 0 0 3px rgba(13,79,92,0.15);
}
.field textarea { min-height: 120px; resize: vertical; }
.urgency-row {
  display: grid; grid-template-columns: repeat(3,1fr); gap: 8px;
  margin-bottom: 16px;
}
.urgency-row .opt {
  border: 1px solid var(--line);
  background: var(--bg);
  padding: 10px 12px;
  border-radius: 10px;
  font-size: 13px;
  color: var(--ink-2);
  text-align: left;
  cursor: pointer;
  transition: all .15s ease;
}
.urgency-row .opt:hover { border-color: var(--teal); }
.urgency-row .opt.active {
  border-color: var(--teal);
  background: var(--teal-soft);
  color: var(--teal-deep);
  font-weight: 600;
}
.urgency-row .opt .ttl { display: block; }
.urgency-row .opt .sub { display: block; font-size: 11px; color: var(--ink-4); margin-top: 2px; font-weight: 400; }
/* ---------- Foto-Upload ---------- */
.upload-drop {
  border: 1px dashed var(--line);
  border-radius: 12px;
  padding: 14px 16px;
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  transition: border-color .15s ease, background .15s ease;
}
.upload-drop.drag-over { border-color: var(--teal); background: var(--teal-soft); }
.upload-btn {
  display: inline-flex; align-items: center; gap: 8px;
  border: 1px solid var(--line);
  background: var(--bg);
  padding: 9px 14px;
  border-radius: 10px;
  font-size: 13px; font-weight: 600; color: var(--ink-2);
  cursor: pointer;
  transition: border-color .15s ease;
}
.upload-btn:hover { border-color: var(--teal); }
.upload-btn input[type="file"] {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap;
}
.upload-hint { font-size: 12px; color: var(--ink-4); }
.upload-error { font-size: 12px; color: #B4413A; margin-top: 6px; }
.upload-preview {
  display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px;
}
.upload-preview:empty { margin-top: 0; }
.upload-thumb {
  position: relative;
  width: 76px; height: 76px;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid var(--line);
  background: var(--bg-soft);
}
.upload-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.upload-thumb .remove {
  position: absolute; top: 3px; right: 3px;
  width: 20px; height: 20px;
  border-radius: 50%;
  background: rgba(20,24,27,0.72);
  color: #fff;
  border: none;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  padding: 0;
}
.upload-thumb .remove:hover { background: #B4413A; }
.form-foot {
  margin-top: 8px;
  display: flex; justify-content: space-between; align-items: center; gap: 16px;
}
.form-foot .legal { font-size: 12px; color: var(--ink-4); max-width: 240px; line-height: 1.5; }
.form .submitted {
  text-align: center;
  padding: 24px 0;
}
.form .submitted .check {
  width: 56px; height: 56px; margin: 0 auto 18px;
  border-radius: 50%;
  background: var(--teal-soft);
  color: var(--teal);
  display: flex; align-items: center; justify-content: center;
}
.form .submitted h3 {
  font-family: 'Nunito', system-ui, -apple-system, "Segoe UI", sans-serif;
  font-weight: 500;
  font-size: 24px;
  margin: 0 0 8px;
  color: #1e1e1e;
}
.form .submitted p { color: var(--ink-3); margin: 0; }

/* ---------- Footer ---------- */
.footer {
  background: var(--navy);
  color: #b6bdc2;
  padding: 72px 0 32px;
}
.footer-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap: 48px;
}
.footer img.logo-mark { height: 44px; width: auto; margin-bottom: 18px; filter: brightness(0) invert(1); }
.footer h5 {
  font-size: 12px;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: #fff;
  margin: 0 0 16px;
  font-weight: 600;
}
.footer ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.footer a { color: #b6bdc2; font-size: 14px; }
.footer a:hover { color: #fff; }
.footer p { font-size: 14px; line-height: 1.7; margin: 0 0 14px; max-width: 38ch; }
.footer-bottom {
  margin-top: 56px;
  padding-top: 24px;
  border-top: 1px solid rgba(255,255,255,0.08);
  display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap;
  font-size: 13px;
  color: #8e9498;
}
.footer-bottom .links { display: flex; gap: 22px; }

/* ---------- Responsive ---------- */
@media (max-width: 1024px) {
  .hero.hero-bleed { height: auto !important; padding: 64px 0; }
  .hero-bleed .hero-scrim { background: rgba(255,255,255,0.63); }
  /* Text bleibt auf dem sichtbareren Foto lesbar */
  .hero-bleed .eyebrow, .hero-bleed h1, .hero-bleed .lede, .hero-bleed .meta {
    text-shadow: 0 1px 2px rgba(255,255,255,0.85), 0 0 16px rgba(255,255,255,0.6);
  }
  .hero-bleed .hero-visual { display: none; }
  /* Feste Desktop-Höhen (Inline-Edits) aufheben — Inhalt bestimmt die Höhe,
     sonst läuft die Sektion in die nächste hinein */
  .section.process, .section, .emergency { height: auto !important; }
  .hero-grid { grid-template-columns: 1fr; gap: 32px; }
  .hero-visual { max-width: 480px; }
  .services-grid { grid-template-columns: 1fr 1fr; }
  .process-grid { grid-template-columns: 1fr 1fr; }
  .ventra-grid { grid-template-columns: 1fr 1fr; }
  .whyus-grid, .about, .contact, .emergency-inner { grid-template-columns: 1fr; gap: 40px; }
  .trustbar-grid { grid-template-columns: 1fr 1fr; gap: 22px; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
}
@media (max-width: 640px) {
  .container { padding: 0 20px; }
  .nav-links { display: none; }
  .nav { height: auto; }
  /* Logo behält sein Seitenverhältnis (1000x159) und bleibt im Flex-Layout,
     statt unter den Notdienst-Button zu laufen */
  .nav-inner { gap: 10px; }
  .nav .logo { flex: 1 1 auto; min-width: 0; max-width: 210px; }
  .nav .logo img { display: block; width: 100%; height: auto; }
  .nav-cta { flex: 0 0 auto; }
  .nav-cta .btn { padding: 10px 14px; font-size: 13px; white-space: nowrap; }
  .topbar .left a:not(:first-child) { display: none; }
  .section { padding: 72px 0; }
  .services-grid { grid-template-columns: 1fr; }
  .process-grid { grid-template-columns: 1fr; }
  .ventra-grid { grid-template-columns: 1fr; }
  .form .grid-2 { grid-template-columns: 1fr; }
  .urgency-row { grid-template-columns: 1fr; }
  .trustbar-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; }
  .form { padding: 24px; }

  /* Einsatz-Bildband untereinander */
  .einsatz-grid { grid-template-columns: 1fr; margin-top: 32px; }

  /* Schwebende Glass-Karten nicht über den Rand ragen lassen */
  .hero-card { right: 12px; bottom: 16px; }
  .whyus-visual .stat-card.a { right: 12px; top: 16px; }
  .whyus-visual .stat-card.b { left: 12px; bottom: 16px; }

  /* Hero-Visual volle Breite, mobil höheres Format */
  .hero-visual { max-width: none; aspect-ratio: 4/3; }

  /* Inline-Tuning vom Desktop (feste Höhe / auto-Größe) mobil neutralisieren */
  .hero {
    height: auto !important;
    padding: 48px 0 64px !important;
    background-size: cover !important;
    background-position: center top !important;
  }
}

/* ---------- Scroll-Reveal ---------- */
[data-reveal] {
  opacity: 0;
  transform: translateY(30px) scale(0.985);
  transition:
    opacity 680ms cubic-bezier(.2,.8,.24,1),
    transform 720ms cubic-bezier(.2,.8,.24,1);
  transition-delay: var(--reveal-delay, 0ms);
  will-change: opacity, transform;
}
[data-reveal].is-visible {
  opacity: 1;
  transform: none;
}
/* Bild-/Glass-Flächen dürfen nicht clippen, während sie sich bewegen */
[data-reveal].hero-visual,
[data-reveal].whyus-visual { will-change: opacity, transform; }

@media (prefers-reduced-motion: reduce) {
  [data-reveal] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* ==========================================================================
   Static-Build-Ergänzungen (Konvertierung React → statisches HTML)
   ========================================================================== */

/* GlassPanel-Oberfläche der Leistungskarten (vormals Inline-Styles) */
.svc-card {
  border-radius: 18px;
  padding: 26px;
  color: #fff;
  backdrop-filter: blur(20px) saturate(140%);
  -webkit-backdrop-filter: blur(20px) saturate(140%);
  font-family: var(--font-sans);
}

/* Honeypot-Feld: für Menschen unsichtbar, Bots füllen es aus */
.hp-field {
  position: absolute !important;
  left: -9999px !important;
  width: 1px; height: 1px;
  overflow: hidden;
}

/* Fehlermeldung unter dem Formular */
.form-error {
  margin: 14px 0 0;
  font-size: 14px;
  color: #B4413A;
}
.form-error a { color: inherit; font-weight: 700; }

/* Rechtsseiten (Impressum / Datenschutz) */
.legal-page {
  padding: 72px 0 96px;
}
.legal-page .container { max-width: 820px; }
.legal-page h1 {
  font-family: var(--font-display);
  font-size: clamp(32px, 4vw, 44px);
  letter-spacing: -0.02em;
  margin: 0 0 8px;
}
.legal-page .updated { color: var(--ink-3); font-size: 14px; margin: 0 0 40px; }
.legal-page h2 { font-size: 22px; margin: 40px 0 12px; letter-spacing: -0.01em; }
.legal-page h3 { font-size: 17px; margin: 26px 0 8px; }
.legal-page p, .legal-page li { color: var(--ink-2); font-size: 15.5px; line-height: 1.65; }
.legal-page ul { padding-left: 22px; margin: 10px 0; }
.legal-page a { color: var(--teal); }
.legal-page address { font-style: normal; line-height: 1.65; color: var(--ink-2); font-size: 15.5px; }