/* ===== Schriften – lokal, exakt den Rollen der Original-Seite zugeordnet ===== */
  @font-face{font-family:'Playfair Display';src:url('../fonts/PlayfairDisplay.woff2') format('woff2');font-weight:400 700;font-style:normal;font-display:swap}
  @font-face{font-family:'Playfair Display';src:url('../fonts/PlayfairDisplay-Italic.woff2') format('woff2');font-weight:400 700;font-style:italic;font-display:swap}
  @font-face{font-family:'Manrope';src:url('../fonts/Manrope.woff2') format('woff2');font-weight:200 800;font-style:normal;font-display:swap}

  :root{
    --terra:#E3B6A3; --rose:#C69294; --rose-pale:#E4D0D1;
    --ink:#000; --head:#333; --text:#666; --slate:#373B4D; --white:#fff;
    --line:#e3d9d2;
    --maxw:900px;
    --cond:'PetraTitel','Barlow Semi Condensed',-apple-system,'Segoe UI',sans-serif; /* Titel-Schrift (Original) */
    --quote:'PetraZitat','Barlow Semi Condensed',-apple-system,'Segoe UI',sans-serif; /* Zitat-Schrift (Original) */
    --serif:'Playfair Display',Georgia,serif;                            /* Kartentitel */
    --sans:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif; /* Fließtext (Avenir-Ersatz) */
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth;scroll-padding-top:80px;overflow-x:hidden}
  body{font-family:var(--sans);font-weight:300;color:var(--text);background:var(--white);font-size:18px;line-height:1.4;-webkit-font-smoothing:antialiased}
  a{color:inherit;text-decoration:none}
  img{max-width:100%;display:block}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 32px}
  .accent-line{width:46px;height:2px;background:var(--terra);margin-bottom:22px}

  /* ===== Header / Nav (Helvetica-artig, 13px, ls 1.3px) ===== */
  header{position:fixed;top:0;left:0;right:0;z-index:100;padding:24px 0;transition:background .3s,box-shadow .3s,padding .3s}
  header.scrolled{background:rgba(255,255,255,.96);backdrop-filter:blur(8px);box-shadow:0 1px 12px rgba(0,0,0,.06);padding:14px 0}
  .nav{max-width:none;margin:0;padding:0 clamp(28px,4vw,72px);display:flex;align-items:center;justify-content:center;gap:34px;flex-wrap:wrap}
  .nav a{font-family:var(--sans);font-weight:400;font-size:13px;letter-spacing:1.3px;color:var(--white);transition:color .2s;padding-bottom:3px;border-bottom:1px solid transparent}
  header.scrolled .nav a{color:var(--head)}
  .nav a:hover,.nav a.active{border-bottom-color:var(--terra)}
  .menu-btn{display:none;position:absolute;right:28px;top:50%;transform:translateY(-50%);background:none;border:0;cursor:pointer;color:var(--white)}
  header.scrolled .menu-btn{color:var(--head)}

  /* ===== Hero ===== */
  .hero{width:100%;aspect-ratio:1905/922;min-height:560px;max-height:100vh;background:var(--terra) url('../images/hero.jpg') center/cover no-repeat;display:flex;align-items:center;padding:0 clamp(24px,4vw,60px)}
  .hero-text{margin-left:50%;max-width:min(700px,46%);color:var(--white)}
  .hero-text h1{font-family:var(--sans);font-weight:500;font-size:clamp(2.4rem,7vw,64px);line-height:1.08;color:var(--white);text-shadow:0 1px 18px rgba(120,70,50,.22)}
  .hero-text .name{font-family:var(--sans);font-weight:400;font-size:clamp(1.4rem,3.6vw,35px);letter-spacing:.35px;margin-top:24px;text-shadow:0 1px 14px rgba(120,70,50,.22)}
  .hero-text .sub{font-family:var(--sans);font-style:italic;font-weight:400;font-size:15px;margin-top:6px;color:rgba(255,255,255,.95)}

  /* ===== Sektionen ===== */
  section{padding:clamp(58px,8vw,94px) 0}
  .section-title{font-family:var(--sans);font-weight:400;font-size:clamp(1.9rem,4.5vw,40px);line-height:1.15;color:var(--ink)}

  /* Willkommen / Fließtext */
  .lead{font-family:var(--sans);font-weight:300;font-size:clamp(1.3rem,2.6vw,26px);line-height:1.2;color:var(--text);margin:21px 0 30px}
  .body-text p{font-weight:300;font-size:18px;line-height:25px;color:var(--text);text-align:justify;-webkit-hyphens:auto;hyphens:auto;margin-bottom:28px}
  .body-text p:last-child{margin-bottom:0}

  /* Angebot (3 Spalten) */
  .offer{display:grid;grid-template-columns:repeat(3,1fr);gap:44px;margin-top:8px}
  .offer .accent-line{width:40px;margin-bottom:16px}
  .card-title{font-family:var(--serif);font-weight:400;font-size:22px;line-height:1.25;color:var(--head);margin-bottom:40px;min-height:calc(2 * 22px * 1.25)}
  .card-body{font-weight:300;font-size:15px;line-height:23px;color:var(--text)}

  /* Zitatband */
  .quote-band{background:var(--terra);padding:clamp(52px,7vw,84px) 0;text-align:center}
  .quote-band blockquote{font-family:var(--sans);font-style:italic;font-weight:300;font-size:clamp(1.7rem,4.2vw,40px);line-height:1.35;color:var(--white);max-width:820px;margin:0 auto}
  .quote-band cite{display:block;font-family:var(--sans);font-style:italic;font-weight:300;font-size:16px;color:var(--white);margin-top:10px}

  /* Schwerpunkte */
  .focus-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:46px 40px}
  .focus-item .accent-line{width:40px;margin-bottom:16px}
  .focus-item h3{font-family:var(--serif);font-weight:400;font-size:22px;line-height:1.2;color:var(--head);margin-bottom:.55em;min-height:calc(3 * 22px * 1.2)}
  .focus-item p{font-weight:300;font-size:15px;line-height:23px;color:var(--text)}

  /* Setting */
  .sub-title{font-family:var(--serif);font-weight:400;font-size:22px;line-height:1.3;color:var(--head);margin-bottom:.5em}
  .setting-intro{margin-bottom:clamp(40px,5vw,60px)}
  .setting-intro .sub-title{margin-bottom:.7em}
  .setting-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px 44px}
  .setting-grid .block p{font-weight:300;font-size:15px;line-height:21px;color:var(--text);margin-bottom:1em}
  .setting-grid .block p:last-child{margin-bottom:0}
  .setting-grid .sub-title{margin-top:0}
  .setting-grid .block+.block .sub-title{margin-top:0}

  /* Setting – Karten-Layout */
  .set-intro{margin-bottom:clamp(38px,5vw,54px)}
  .set-close{}
  .set-cards{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:start}
  .set-list{display:flex;flex-direction:column;gap:18px}
  .s-card{display:grid;grid-template-columns:66px 1fr;gap:24px;background:#FAF5F2;border:1px solid #EFE3DD;border-radius:12px;padding:28px 34px;align-items:start}
  .s-card .num{font-family:var(--serif);font-weight:400;font-size:38px;color:var(--rose);line-height:1}
  .s-card .cbar{width:34px;height:2px;background:var(--terra);margin-bottom:14px}
  .s-card h3{font-family:var(--serif);font-weight:400;font-size:22px;line-height:1.25;color:var(--head);margin-bottom:12px}
  .s-card p{font-weight:300;font-size:15px;line-height:1.55;color:var(--text);margin-bottom:12px}
  .s-card p:last-child{margin-bottom:0}
  .s-card .k{font-family:var(--sans);font-weight:600;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--rose);margin:16px 0 5px}

  /* Über mich */
  .about-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:clamp(34px,4vw,56px);align-items:center}
  .about-photo img{width:100%;object-fit:cover;aspect-ratio:3/2;background:var(--rose-pale)}
  .about-photo .credit{font-size:12px;color:var(--rose);text-align:right;margin-top:8px}
  .about-text .body-text p{margin-bottom:1.2em;text-align:left;hyphens:none}
  .stats{display:flex;flex-direction:column;gap:18px;margin:30px 0}
  .stat{display:grid;grid-template-columns:76px 1fr;gap:18px;align-items:baseline}
  .stat .num{font-family:var(--sans);font-weight:700;font-size:32px;color:var(--text);line-height:1;text-align:right}
  .stat .lbl{font-family:var(--sans);font-weight:300;font-size:16px;line-height:1.35;color:var(--ink);align-self:center}
  .about-more{display:inline-block;margin-top:6px;font-family:var(--sans);font-weight:500;font-size:14px;letter-spacing:.5px;color:var(--head);border:1px solid #d8cabf;border-radius:3px;padding:.85em 1.7em;transition:border-color .2s,color .2s}
  .about-more:hover{border-color:var(--terra);color:var(--ink)}

  /* Kontakt */
  .contact-inner{max-width:640px;margin:0 auto;text-align:center}
  .contact-inner .accent-line{margin:0 auto 16px}
  .contact-mini{margin-top:34px;font-size:14px;line-height:2;color:var(--text)}
  .contact-mini b{color:var(--rose);font-weight:600}
  .contact-intro{font-size:18px;line-height:1.55;color:var(--text);margin:.6em auto 34px;max-width:600px}
  .contact-detail{margin-bottom:20px}
  .contact-detail .k{font-family:var(--cond);font-weight:600;font-size:15px;letter-spacing:.12em;text-transform:uppercase;color:var(--rose);margin-bottom:4px}
  .contact-detail a,.contact-detail p{font-size:16px;line-height:1.5;color:var(--head)}
  .contact-detail a:hover{color:var(--ink)}

  form{background:transparent;border:0;padding:0;max-width:560px;margin:0 auto;text-align:left}
  .field{margin-bottom:15px}
  .field.row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  label{display:block;font-family:var(--sans);font-size:13px;font-weight:500;color:var(--head);margin-bottom:5px}
  input,select,textarea{width:100%;font-family:var(--sans);font-size:15px;font-weight:300;color:var(--head);background:transparent;border:0;border-bottom:1px solid #d8cabf;border-radius:0;padding:.55em 0;transition:border-color .2s}
  input:focus,select:focus,textarea:focus{outline:none;border-bottom-color:var(--terra)}
  textarea{resize:vertical;min-height:100px}
  .form-hint{font-size:12px;color:var(--text);margin:16px 0 0;line-height:1.5;text-align:center}
  .btn{display:block;margin:26px auto 0;font-family:var(--sans);font-weight:600;font-size:14px;letter-spacing:.5px;color:var(--white);background:#D8A48C;border:0;border-radius:4px;padding:.9em 2.6em;cursor:pointer;transition:background .2s}
  .btn:hover{background:#c98f74}
  .hp{position:absolute;left:-9999px}

  /* Footer */
  footer{background:var(--slate);color:rgba(255,255,255,.82);padding:56px 0 30px}
  .foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:36px;margin-bottom:40px}
  footer h4{font-family:var(--cond);font-weight:600;font-size:20px;color:var(--terra);margin-bottom:12px;letter-spacing:.02em}
  footer .fbrand{font-family:var(--cond);font-weight:600;font-size:22px;color:var(--white);margin-bottom:10px}
  footer p,footer a{font-family:var(--cond);font-size:18px;line-height:1.6;color:rgba(255,255,255,.85)}
  footer a:hover{color:var(--white)}
  .foot-bottom{border-top:1px solid rgba(255,255,255,.14);padding-top:20px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-family:var(--sans);font-size:13px;color:rgba(255,255,255,.5)}
  .foot-bottom a{font-family:var(--sans);color:rgba(255,255,255,.5)}

  /* Reveal */
  .reveal{opacity:0;transform:translateY(18px);transition:opacity .6s,transform .6s}
  .reveal.in{opacity:1;transform:none}

  /* Responsive */
  @media(max-width:820px){
    .offer,.focus-grid,.setting-grid,.about-grid,.set-cards{grid-template-columns:1fr}
    .set-cards{grid-auto-rows:auto}
    .about-grid{gap:28px}
    .about-photo{order:-1;max-width:none}
    .foot-grid{grid-template-columns:1fr 1fr}
  }
  @media(max-width:900px){
    .nav{position:fixed;top:0;left:0;right:0;flex-direction:column;align-items:flex-start;gap:0;max-width:none;background:var(--white);padding:76px 30px 24px;box-shadow:0 8px 24px rgba(0,0,0,.1);transform:translateY(-120%);transition:transform .3s}
    .nav.open{transform:translateY(0)}
    .nav a{color:var(--head);width:100%;padding:14px 2px;border-bottom:1px solid var(--line);font-size:15px}
    .nav a:first-child{margin-right:0}
    header{background:rgba(255,255,255,.96);backdrop-filter:blur(8px);box-shadow:0 1px 10px rgba(0,0,0,.05)}
    .menu-btn{display:block;color:var(--head)}
    .body-text p{text-align:left;hyphens:none}
    .foot-grid{grid-template-columns:1fr 1fr}
    .field.row{grid-template-columns:1fr}
  }
  @media(max-width:600px){
    .wrap{padding:0 22px}
    section{padding:clamp(46px,10vw,72px) 0}
    .foot-grid{grid-template-columns:1fr}
    .nav a{font-size:16px}
    .contact-mini{font-size:13px}
  }
  @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}}

  /* ===== Unterseiten ===== */
  .page-hero{background:var(--terra);text-align:center;padding:132px 0 58px;color:var(--white)}
  .page-hero .accent-line{margin:0 auto 18px;background:rgba(255,255,255,.85)}
  .page-hero h1{font-family:var(--sans);font-weight:500;font-size:clamp(2rem,5vw,40px);color:var(--white);line-height:1.1}
  .page-body{padding:clamp(112px,13vh,150px) 0 clamp(48px,7vw,80px)}
  .page-head{margin-bottom:clamp(30px,4vw,44px)}
  .sub #header{background:rgba(255,255,255,.96);backdrop-filter:blur(8px);box-shadow:0 1px 12px rgba(0,0,0,.06);border-bottom:1px solid var(--line)}
  .sub #header .nav a{color:var(--head)}
  .sub .menu-btn{color:var(--head)}
  .prose{max-width:760px}
  .prose p{font-weight:300;font-size:16px;line-height:1.65;color:var(--text);margin-bottom:15px}
  .prose h3{font-family:var(--serif);font-weight:400;font-size:20px;color:var(--head);margin:30px 0 10px}
  .prose a{color:var(--rose);border-bottom:1px solid var(--rose-pale)}
  .prose a:hover{color:var(--head)}
  .stand{color:var(--rose);font-weight:600;font-size:13px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:26px}
  .info-block{background:#FAF5F2;border:1px solid #EFE3DD;border-radius:6px;padding:26px 30px;margin-bottom:34px;max-width:760px}
  .info-block .who{font-family:var(--serif);font-size:20px;color:var(--head);margin-bottom:10px}
  .info-block p{font-size:16px;line-height:1.7;color:var(--head);margin:0}
  .info-block a{color:var(--rose)}
  .oleg{font-size:12px;letter-spacing:.06em;color:var(--rose);text-transform:uppercase;margin-bottom:10px;font-weight:600}
  /* Timeline */
  .about-lead{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,4vw,54px);align-items:center;margin-bottom:clamp(40px,5vw,56px)}
  .about-lead img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:6px;background:var(--rose-pale)}
  .about-lead p{font-weight:300;font-size:17px;line-height:1.55;color:var(--text);margin-bottom:14px}
  .wg-title{font-family:var(--serif);font-weight:400;font-size:22px;color:var(--head);margin:0 0 22px}
  .timeline{max-width:760px;border-left:2px solid var(--rose-pale);padding-left:28px}
  .tl{position:relative;padding-bottom:26px}
  .tl:last-child{padding-bottom:0}
  .tl::before{content:"";position:absolute;left:-35px;top:5px;width:10px;height:10px;border-radius:50%;background:var(--terra);border:2px solid #fff}
  .tl .yr{font-family:var(--sans);font-weight:600;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--rose);margin-bottom:4px}
  .tl p{font-weight:300;font-size:15px;line-height:1.6;color:var(--text);margin:0}
  .tl a{color:var(--rose)}
  /* Projekte */
  .proj-grid{display:grid;grid-template-columns:1fr;gap:22px;max-width:820px}
  .proj{background:#FAF5F2;border:1px solid #EFE3DD;border-radius:6px;padding:30px 32px}
  .proj .cbar{width:34px;height:2px;background:var(--terra);margin-bottom:14px}
  .proj h3{font-family:var(--serif);font-weight:400;font-size:22px;color:var(--head);margin-bottom:12px}
  .proj p{font-weight:300;font-size:15px;line-height:1.6;color:var(--text);margin-bottom:12px}
  .proj p:last-child{margin-bottom:0}
  .proj a{color:var(--rose);font-weight:500;word-break:break-word}
  @media(max-width:720px){.about-lead{grid-template-columns:1fr}}

  /* ===== Mobile: Couch vollbreit unten, Text oben im Wandbereich ===== */
  @media(max-width:768px){
    #header{background:transparent!important;backdrop-filter:none!important;box-shadow:none!important;border-bottom:0!important;padding:16px 0}
    #header.scrolled{background:rgba(255,255,255,.96)!important;backdrop-filter:blur(8px)!important;box-shadow:0 1px 10px rgba(0,0,0,.06)!important}
    .menu-btn{display:flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.92);color:var(--head);box-shadow:0 2px 10px rgba(0,0,0,.18);z-index:120}
    #header.scrolled .menu-btn{background:transparent;box-shadow:none;color:var(--head)}
    .hero{aspect-ratio:auto;min-height:600px;min-height:100svh;max-height:none;display:block;position:relative;
      background:var(--terra) url('../images/hero.jpg') left bottom / cover no-repeat;
      padding:84px 26px 0}
    .hero::before{content:"";position:absolute;inset:0;z-index:1;
      background:linear-gradient(180deg,rgba(88,52,38,.42),rgba(88,52,38,.06) 44%,rgba(88,52,38,0) 62%)}
    .hero-text{position:relative;z-index:2;margin-left:0;max-width:none;text-shadow:0 1px 16px rgba(60,30,20,.4)}
    .hero-text h1{font-size:clamp(2.2rem,10vw,3.1rem);line-height:1.05}
    .hero-text .name{font-size:clamp(1.35rem,5.6vw,1.75rem);margin-top:16px}
    .hero-text .sub{font-size:14px;margin-top:6px}
  }
  /* ===== Prokrastination-Seite ===== */
  .num-card{background:#FAF5F2;border:1px solid #EFE3DD;border-radius:6px;padding:26px 28px;height:100%}
  .num-card .n{font-family:var(--serif);font-size:32px;color:var(--rose);line-height:1;display:block;margin-bottom:8px}
  .num-card h4{font-family:var(--sans);font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--head);margin:0 0 8px}
  .num-card p{font-weight:300;font-size:15px;line-height:1.55;color:var(--text);margin:0}
  .pquote{font-family:var(--serif);font-style:italic;font-size:clamp(1.4rem,3vw,1.9rem);color:var(--head);text-align:center;max-width:680px;margin:46px auto;line-height:1.4}
  .price-box{background:#FAF5F2;border:1px solid #EFE3DD;border-radius:6px;padding:28px 30px;text-align:center;max-width:520px;margin:16px auto 0}
  .price-box .big{font-family:var(--serif);font-size:34px;color:var(--rose);margin-bottom:6px}
  .price-box p{font-weight:300;font-size:15px;color:var(--text);margin:0}
  .cta-center{text-align:center;margin-top:46px}
  .cta-center .btn{display:inline-block;margin:0;text-decoration:none}
  .sec-h{font-family:var(--serif);font-weight:400;font-size:22px;color:var(--head);margin:clamp(38px,5vw,52px) 0 20px}
  /* ===== Handy: Inhaltsschriften kompakter & gut lesbar ===== */
  @media(max-width:600px){
    .section-title{font-size:clamp(1.6rem,6.4vw,1.95rem)}
    .lead{font-size:1.12rem;line-height:1.34}
    .body-text p{font-size:16px;line-height:1.55}
    .card-title,.focus-item h3,.sub-title{font-size:19px}
    .card-body,.focus-item p,.set-cards .num-card p,.s-card p{font-size:14.5px;line-height:1.55}
    .quote-band blockquote{font-size:1.4rem;line-height:1.4}
    .quote-band cite{font-size:14px}
    .contact-intro{font-size:16px}
    .prose p,.info-block p{font-size:15px;line-height:1.6}
    .prose h3,.info-block .who{font-size:18px}
    .sec-h,.wg-title{font-size:19px}
    .stat .num{font-size:26px}
    .stat .lbl{font-size:15px}
    .tl p{font-size:14.5px}
  }
  /* Ausgefüllte Felder (Chrome-Autofill) in warmem Ton statt Blau */
  input:-webkit-autofill,textarea:-webkit-autofill,select:-webkit-autofill,
  input:-webkit-autofill:hover,input:-webkit-autofill:focus,
  textarea:-webkit-autofill:focus,select:-webkit-autofill:focus{
    -webkit-box-shadow:0 0 0 1000px #F6EBE6 inset;
    box-shadow:0 0 0 1000px #F6EBE6 inset;
    -webkit-text-fill-color:var(--head);
    caret-color:var(--head);
    border-bottom-color:#d8cabf;
    transition:background-color 9999s ease-out 0s}
  /* Erfolgsmeldung nach Absenden */
  .form-success{max-width:560px;margin:0 auto;text-align:center;background:#FAF5F2;border:1px solid #EFE3DD;border-radius:8px;padding:40px 30px}
  .form-success .fs-check{width:56px;height:56px;line-height:56px;border-radius:50%;background:#eaf4ed;color:#3c7a4a;font-size:28px;margin:0 auto 16px}
  .form-success h3{font-family:var(--serif);font-weight:400;font-size:22px;color:var(--head);margin-bottom:8px}
  .form-success p{font-weight:300;font-size:15px;line-height:1.6;color:var(--text);margin:0}
  @media(max-width:820px){ .focus-item h3{min-height:0} .card-title{min-height:0} }
  @media(max-width:600px){ .s-card{grid-template-columns:44px 1fr;gap:16px;padding:24px 22px} .s-card .num{font-size:30px} }