
    /* DESIGN TOKENS – schnell und zentral anpassbar */
    :root {
      --rosehip: #A35446;  /* Originalton 1: Markenfläche */
      --rose: #BF877E;     /* Originalton 4: ruhige Akzente */
      --indigo: #23294E;   /* Lesetext / Headline */
      --teal: #00605F;     /* Links und primäre Aktionen */
      --paper: #FAF7F4;    /* heller Seitenhintergrund */
      --edge: #F3ECE8;     /* helle Karten, Kanten, Trenner */
      --white: #FFFFFF;
      --muted: #4C5268;
      --border: #D6C9C4;
      --radius: 22px;
      --content: 1120px;
      --shadow: 0 18px 48px rgba(35,41,78,.08);
      --brandmark-image: url('assets/brand-mark.png');
      --hero-logo-image: url('assets/hero-logo-full.png');
    }
    *, *::before, *::after { box-sizing: border-box; }
    html { scroll-behavior: smooth; scroll-padding-top: 90px; }
    body { margin:0; background:var(--paper); color:var(--indigo); font: 400 16px/1.65 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif; }
    a { color:var(--teal); text-underline-offset: .18em; text-decoration-thickness: .09em; }
    a:hover { text-decoration-thickness: .14em; }
    a:focus-visible, button:focus-visible { outline:3px solid var(--teal); outline-offset:4px; }
    button { font:inherit; }
    .container { width:min(calc(100% - 36px),var(--content)); margin-inline:auto; }
    .skip { position:absolute; top:-90px; left:12px; z-index:1000; background:var(--white); color:var(--indigo); padding:10px 14px; }
    .skip:focus { top:10px; }
    .site-header { position:sticky; top:0; z-index:100; background:rgba(250,247,244,.97); border-bottom:1px solid var(--border); }
    .header-inner { min-height:72px; display:flex; align-items:center; justify-content:space-between; gap:18px; }
    .brand { display:flex; align-items:center; gap:11px; color:var(--indigo); text-decoration:none; font-weight:760; letter-spacing:-.025em; line-height:1.15; }
    .brand-mark { display:block; width:46px; aspect-ratio:1; flex:0 0 auto; border-radius:50%; background-color: var(--white); background-image: var(--brandmark-image); background-position: center; background-repeat: no-repeat; background-size: cover; box-shadow: 0 6px 18px rgba(35,41,78,.12); border:1px solid rgba(163,84,70,.10); overflow:hidden; }
    .brand small { display:block; font-size:.69rem; font-weight:550; letter-spacing:.12em; text-transform:uppercase; margin-top:4px; }
    .menu-toggle { display:inline-flex; align-items:center; gap:7px; background:var(--white); color:var(--indigo); border:1px solid var(--border); border-radius:12px; min-height:44px; padding:8px 13px; cursor:pointer; }
    .nav { display:none; position:absolute; top:100%; left:0; right:0; background:var(--paper); border-bottom:1px solid var(--border); padding:12px 18px 22px; box-shadow:var(--shadow); }
    .nav.is-open { display:grid; gap:4px; }
    .nav a { display:block; padding:10px 12px; min-height:44px; border-radius:10px; font-weight:650; text-decoration:none; }
    .nav a:hover { background:var(--edge); }
    .button, .nav .nav-cta { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:48px; padding:12px 22px; border-radius:13px; border:2px solid transparent; background:var(--teal); color:var(--white); text-decoration:none; font-weight:750; text-align:center; transition:transform .18s ease,background .18s ease; }
    .button:hover, .nav .nav-cta:hover { background:#004A49; color:var(--white); transform:translateY(-1px); }
    .button--secondary { color:var(--indigo); border-color:var(--indigo); background:transparent; }
    .button--secondary:hover { background:var(--indigo); color:var(--white); }
    .eyebrow { margin:0 0 10px; font-size:.76rem; line-height:1.4; font-weight:820; letter-spacing:.15em; text-transform:uppercase; }
    h1,h2,h3 { line-height:1.13; letter-spacing:-.045em; margin:0; }
    h1 { font-size:clamp(2.65rem,9vw,5.65rem); max-width:12ch; }
    h2 { font-size:clamp(2rem,5.5vw,3.5rem); max-width:16ch; }
    h3 { font-size:1.28rem; }
    p { margin:0; }
    p + p { margin-top:13px; }
    .lead { font-size:clamp(1.075rem,2vw,1.25rem); max-width:56ch; }
    .hero { background:var(--rosehip); padding:50px 0 54px; overflow:hidden; }
    .hero-grid { display:grid; gap:34px; align-items:center; }
    .hero-copy { background:var(--paper); padding:clamp(22px,4.5vw,56px); border-radius:var(--radius); box-shadow:var(--shadow); }
    .hero-copy .eyebrow { color:var(--teal); }
    .hero-copy .lead { margin-top:22px; }
    .actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:26px; }
    .hero-art { position:relative; min-height:320px; border-radius:var(--radius); background-color: var(--edge); background-image: var(--hero-logo-image); background-position: center; background-repeat: no-repeat; background-size: contain; overflow:hidden; border:1px solid rgba(214,201,196,.9); box-shadow: var(--shadow); }
    .hero-art::before { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(250,247,244,.08) 0%, rgba(250,247,244,.18) 100%); pointer-events:none; }
    .hero-art::after { content:""; position:absolute; inset:auto 18px 18px auto; width:120px; height:120px; background:radial-gradient(circle, rgba(163,84,70,.10) 0%, rgba(163,84,70,0) 68%); pointer-events:none; }
    .art-caption { position:absolute; left:18px; bottom:18px; padding:8px 13px; font-size:.75rem; background:rgba(250,247,244,.92); border-radius:50px; color:var(--indigo); font-weight:700; border:1px solid rgba(214,201,196,.95); }
    .section { padding:72px 0; }
    .section-head { display:grid; gap:16px; margin-bottom:26px; }
    .section-head .eyebrow { color:var(--teal); }
    .cards { display:grid; grid-template-columns:1fr; gap:14px; }
    .card { background:var(--white); padding:26px; border:1px solid var(--border); border-radius:var(--radius); box-shadow:0 8px 24px rgba(35,41,78,.035); }
    .card-number { width:40px; height:40px; display:grid; place-items:center; border-radius:13px; background:var(--edge); color:var(--indigo); font-weight:750; margin-bottom:20px; }
    .card p { margin:12px 0 15px; }
    .card a { font-weight:750; }
    .surface { background:var(--edge); }
    .two-col { display:grid; gap:24px; align-items:center; }
    .section-text { display:grid; gap:18px; }
    .section-text .eyebrow { color:var(--teal); }
    .quote-panel { background:var(--rose); border-radius:var(--radius); min-height:270px; padding:28px; display:flex; flex-direction:column; justify-content:space-between; }
    .quote-panel p { max-width:22ch; font-size:clamp(1.6rem,4vw,2.65rem); font-weight:720; line-height:1.17; letter-spacing:-.035em; }
    .quote-panel span { font-size:.83rem; font-weight:730; }
    .steps { display:grid; gap:12px; margin-top:28px; }
    .step { display:flex; gap:16px; align-items:flex-start; background:var(--white); padding:20px; border-radius:16px; border:1px solid var(--border); }
    .step b { color:var(--teal); font-size:1.12rem; }
    .step p { margin-top:5px; }
    .faq { display:grid; gap:10px; margin-top:26px; }
    details { background:var(--white); border:1px solid var(--border); border-radius:14px; padding:0 19px; }
    summary { cursor:pointer; padding:18px 0; font-weight:760; min-height:52px; }
    details p { padding:0 0 20px; }
    .contact { background:var(--rosehip); padding:62px 0 85px; }
    .contact-card { background:var(--paper); padding:clamp(24px,5vw,54px); border-radius:var(--radius); display:grid; gap:18px; }
    .contact-card .eyebrow { color:var(--teal); }
    .contact-data { display:grid; gap:8px; font-style:normal; }
    .note { font-size:.88rem; color:var(--muted); }
    .footer { padding:26px 0 95px; }
    .footer-inner { display:flex; flex-direction:column; gap:14px; }
    .footer-links { display:flex; flex-wrap:wrap; gap:10px 20px; }
    .footer a { font-weight:650; }
    .mobile-cta { position:fixed; z-index:90; bottom:0; left:0; right:0; padding:11px max(18px,env(safe-area-inset-right)) calc(11px + env(safe-area-inset-bottom)); background:var(--paper); border-top:1px solid var(--border); box-shadow:0 -9px 22px rgba(35,41,78,.06); }
    .mobile-cta .button { width:100%; }
    @media(min-width:700px) {
      .container { width:min(calc(100% - 64px),var(--content)); }
      .hero-grid { grid-template-columns:minmax(0,1.18fr) minmax(260px,.82fr); }
      .hero-art { min-height:540px; }
      .cards { grid-template-columns:repeat(3,minmax(0,1fr)); }
      .two-col { grid-template-columns:1fr 1fr; gap:60px; }
      .section-head { grid-template-columns:1fr 1fr; align-items:end; }
      .footer-inner { flex-direction:row; justify-content:space-between; }
    }
    @media(min-width:960px) {
      .header-inner { min-height:84px; }
      .menu-toggle { display:none; }
      .nav { position:static; display:flex; align-items:center; padding:0; gap:7px; box-shadow:none; border:0; background:transparent; }
      .nav a { padding:10px 12px; }
      .nav .nav-cta { padding:9px 17px; margin-left:8px; }
      .hero { padding:75px 0; }
      .section { padding:100px 0; }
      .mobile-cta { display:none; }
      .footer { padding-bottom:28px; }
    }
    @media(prefers-reduced-motion:reduce) {
      html { scroll-behavior:auto; }
      *,*::before,*::after { transition:none !important; animation:none !important; }
    }

    /* Anpassungen für längere Originaltexte und kompakte Desktop-Navigation */
    .brand { flex-shrink:0; }
    .brand > span:last-child { font-size:.94rem; }
    .nav a { font-size:.94rem; }
    .prose { max-width:78ch; }
    .prose p + p { margin-top:1.15em; }
    .prose p { line-height:1.78; }
    .prose h3 { margin:1.7em 0 .55em; }
    .section-intro { margin-bottom:30px; }
    .section-intro h2 { max-width:24ch; }
    .reading-layout { display:grid; gap:28px; }
    .reading-panel { background:var(--white); border:1px solid var(--border); padding:clamp(22px,4vw,44px); border-radius:var(--radius); }
    .reading-panel .prose { max-width:74ch; }
    .highlight-quote { border-left:5px solid var(--rosehip); background:var(--edge); border-radius:0 14px 14px 0; padding:19px 22px; margin:26px 0; font-size:1.2rem; font-weight:700; }
    .concerns { margin:22px 0; padding-left:1.5rem; max-width:70ch; }
    .concerns li { padding:.32em 0 .32em .25em; line-height:1.65; }
    .concerns li::marker { color:var(--rosehip); }
    .info-grid { display:grid; gap:15px; margin:26px 0; }
    .info-grid .card { box-shadow:none; }
    .info-grid h3 { margin-bottom:11px; }
    .contact-card h2 { max-width:22ch; }
    @media (min-width:700px) { .info-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
    @media (min-width:960px) { .nav { gap:1px; } .nav a { padding:10px 8px; font-size:.82rem; } .nav .nav-cta { padding:9px 12px; margin-left:5px; } }
    @media (min-width:1120px) { .nav a { padding:10px 11px; font-size:.92rem; } }
    @media (max-width:420px) { .brand > span:last-child { font-size:.85rem; } .brand small { font-size:.6rem; } .brand-mark { width:42px; } }

    /* TYPOGRAFIE V1 | Ruhige Editorial-Anmutung, bewusst ohne Webfonts.
       125 % für Headlines, Navigation und kompakte UI. Längere Texte
       erhalten 155 % für komfortables Lesen auf kleinen Displays. */
    :root {
      --font-text: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
      --font-display: Georgia, "Times New Roman", serif;
      --lh-compact: 1.25;
      --lh-reading: 1.55;
      --measure: 66ch;
    }
    body {
      font-family: var(--font-text);
      font-size: 16px;
      line-height: var(--lh-reading);
      font-weight: 400;
      -webkit-font-smoothing: antialiased;
      text-rendering: optimizeLegibility;
    }
    h1, h2, h3, .quote-panel p {
      font-family: var(--font-display);
      font-weight: 400;
      line-height: var(--lh-compact); /* Wunschwert 125 % */
      letter-spacing: -.025em;
      text-wrap: balance;
    }
    h1 { font-size: clamp(2.65rem, 8.2vw, 4.95rem); max-width: 13ch; }
    h2 { font-size: clamp(2.05rem, 5vw, 3.15rem); max-width: 21ch; }
    h3 { font-size: clamp(1.35rem, 2.4vw, 1.62rem); }
    .brand, .brand small, .nav a, .button, .eyebrow,
    .art-caption, summary {
      line-height: var(--lh-compact);
    }
    .brand { letter-spacing:-.012em; }
    .brand > span:last-child { font-size: .96rem; }
    .eyebrow { font-size: .76rem; letter-spacing: .11em; font-weight: 750; }
    .lead { font-size: clamp(1.12rem, 2vw, 1.3rem); line-height: 1.5; max-width: 53ch; }
    .prose, .reading-panel .prose { max-width: var(--measure); }
    .prose p { line-height: var(--lh-reading); }
    .prose p + p { margin-top: 1.1em; }
    .prose h3 { margin: 1.65em 0 .55em; }
    .concerns { max-width: var(--measure); }
    .concerns li { line-height: var(--lh-reading); padding-block: .4em; }
    .highlight-quote { font-family:var(--font-display); font-weight:400; line-height:1.4; }
    .quote-panel p { font-size:clamp(1.65rem,4vw,2.55rem); }
    .section-text { max-width: var(--measure); }
    .section-intro { max-width: var(--measure); }
    .reading-panel { padding: clamp(24px, 4.5vw, 52px); }
    @media (min-width: 700px) {
      body { font-size: 17px; }
      .prose, .reading-panel .prose { max-width: 65ch; }
    }
    @media (max-width: 420px) {
      h1 { font-size: clamp(2.45rem, 11vw, 3.2rem); }
      h2 { font-size: clamp(1.9rem, 8vw, 2.3rem); }
      .brand > span:last-child { font-size: .85rem; }
    }

    /* TYPOGRAFIE V2: Intro-Zitat auf Smartphones kompakter und zentriert.
       Desktop-Layout und alle übrigen Headlines bleiben unverändert. */
    @media (max-width: 699px) {
      .hero-copy #hero-title {
        font-size: clamp(1.55rem, 6vw, 2rem);
        line-height: 1.25;
        text-align: center;
        max-width: 29ch;
        margin-inline: auto;
        letter-spacing: -.015em;
        text-wrap: pretty;
      }
    }

    /* BRANDING V5 — mobile-first, platzsparend und austauschbares Hero-Foto */
    .brand { gap:10px; }
    .brand-mark { width:38px; height:38px; aspect-ratio:1; border-radius:50%;
      background-size:contain; background-color:#fff; box-shadow:none;
      border:1px solid rgba(163,84,70,.16); }
    .brand > span:last-child { line-height:1.2; }
    .hero-art { display:flex; align-items:center; justify-content:center;
      min-height:300px; padding:clamp(18px,4vw,38px);
      background:var(--paper); background-image:none;
      box-shadow:0 14px 35px rgba(35,41,78,.065); }
    .hero-art::before,.hero-art::after { content:none; }
    .hero-art img { display:block; max-width:100%; width:auto; height:auto;
      max-height:440px; object-fit:contain; filter:none; }
    .hero-art--photo { padding:0; background:var(--edge); }
    .hero-art--photo img { width:100%; height:100%; min-height:300px;
      max-height:none; object-fit:cover; }
    .footer-brand { display:flex; align-items:center; gap:12px; }
    .footer-brand .brand-mark { width:32px; height:32px; }
    .footer-brand p { margin:0; }
    @media (min-width:700px) {
      .hero-art { min-height:500px; }
      .hero-art img { max-height:470px; }
      .hero-art--photo img { min-height:500px; }
    }
    @media (max-width:420px) {
      .brand-mark { width:36px; height:36px; }
      .hero-art { min-height:290px; }
    }

    /* Standortkarte: datensparsame Zwei-Klick-Einbindung */
    .location-section { padding:clamp(52px,8vw,96px) 0; background:var(--paper); }
    .location-layout { display:grid; gap:22px; }
    .location-copy { max-width:65ch; }
    .location-copy h2 { margin-bottom:14px; }
    .location-copy p { margin-bottom:18px; }
    .location-map { position:relative; min-height:300px; aspect-ratio:4/3; border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; background:linear-gradient(130deg,#F3ECE8,#E6D5D0); }
    .map-consent { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:13px; padding:clamp(18px,5vw,34px); text-align:center; height:100%; min-height:300px; }
    .map-consent p { max-width:42ch; }
    .map-consent .map-symbol { width:54px; height:54px; border-radius:50%; background:var(--paper); display:grid; place-items:center; font-size:27px; color:var(--rosehip); }
    .map-consent .note { font-size:.83rem; }
    .location-map iframe { display:block; border:0; width:100%; height:100%; min-height:300px; position:absolute; inset:0; }
    @media (min-width:800px) { .location-layout { grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); align-items:center; gap:52px; } .location-map { aspect-ratio:5/4; } }
  
    /* V7 | Gestaffelte Wortmarke im Header */
    .brand .brand-copy { display:flex; flex-direction:column; gap:2px; min-width:0; }
    .brand .brand-kind { display:block; font-size:.68rem; line-height:1.2; font-weight:650; letter-spacing:.1em; text-transform:uppercase; }
    .brand .brand-name { display:block; font-size:clamp(.89rem,2.7vw,1rem); font-weight:740; line-height:1.22; letter-spacing:-.015em; }
    .brand { gap:11px; }
    @media (min-width:960px) and (max-width:1190px) {
      .nav a {font-size:.76rem; padding-inline:6px;}
      .nav .nav-cta {font-size:.76rem; padding-inline:9px;}
    }
    /* Rechtstexte: durchgehende Leserführung */
    .legal-page {padding:clamp(42px,7vw,90px) 0;}
    .legal-shell {max-width:880px; background:var(--white);border:1px solid var(--border);border-radius:var(--radius);padding:clamp(22px,5vw,58px);}
    .legal-shell h1 {font-size:clamp(2.5rem,6vw,3.9rem);max-width:none;margin-bottom:18px;}
    .legal-shell h2 {font-size:clamp(1.4rem,3vw,1.85rem);margin:32px 0 12px;max-width:none;}
    .legal-shell p {max-width:68ch;}
    .legal-shell p+p {margin-top:12px;}
    .legal-shell li {margin-block:8px;}
    .legal-note {border-left:4px solid var(--rosehip);background:var(--edge);padding:15px 20px;border-radius:0 12px 12px 0;margin-bottom:22px;}
    .needs-check {background:#fff4de;padding:1px 5px;border-radius:4px;}
  
.credential-box{margin:25px 0 0;background:var(--paper);border:1px solid var(--border);border-radius:16px;padding:clamp(20px,4vw,30px);max-width:690px}.credential-box h3{margin:0 0 14px}.credential-box p{margin:0 0 13px;line-height:1.55}.credential-box img{display:block;width:min(100%,320px);height:auto}.credential-box .note{margin-top:12px}

/* Google Maps: erreichbarer Widerrufsbutton */
.map-revoke{position:absolute;z-index:2;bottom:12px;left:50%;transform:translateX(-50%);background:#FAF7F4;color:#23294E;border:2px solid #23294E;border-radius:12px;min-height:44px;padding:9px 18px;font:600 14px/1.25 "Segoe UI",Arial,sans-serif;cursor:pointer;white-space:nowrap}
.map-revoke:focus-visible{outline:3px solid #00605F;outline-offset:3px}

/* V10 Layoutfix: VOD-Box folgt demselben zentrierten Inhaltsraster. */
#ueber-mich .credential-box { width:100%; max-width:690px; margin:25px 0 0; }
