
  :root{
    --paper:#F6F4CB;        /* Papierfarbe aus dem Inspiration-Ordner */
    --paper-2:#EFEBB4;      /* etwas tieferes Gelb für Flächen */
    --stone:#F3EBDF;        /* echtes Kreidefelsen-Weiß */
    --stone-line:#CBBEA9;
    --blue:#2C53D4;         /* kräftiges Kobaltblau */
    --blue-deep:#2241A8;    /* dunkleres Blau für Fließtext */
    --terra:#8E2C22;        /* Terrakotta/Rost aus der Farbpalette */
    --terra-tint:#F1DCD2;   /* helles Terrakotta für Flächen */
    --powder:#D6E7EE;       /* Puderblau aus der Farbpalette */
    --powder-deep:#AFC9D6;
    --mustard:#D9B65A;      /* warmes Gold/Mustard aus der Farbpalette */
    --mustard-tint:#F3E9C7;
    --ink:#3A5BB0;          /* gedämpftes Kobalt – Schnittmenge Inspo + Palette */
    --writing:#DFE3F4;      /* zartes Kornblumenblau für die Schreibbegleitung */
    --writing-line:#8090C9;
    --moss:#4C7548;         /* gedämpftes Moosgrün für WhatsApp – passt zur Wiese */
    --moss-tint:#DCE7D2;
    --grey-line:#B4B6BD;    /* neutrales Grau für Kontakt-Boxen */
    --grey-text:#6E717C;
    --tex:url("../images/kreidefelsen-textur.webp");  /* Steinstruktur für alle Kästchen */
    --maxw:1180px;
    --r:22px;               /* einheitlicher, weicher Radius */
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth; scroll-padding-top:70px; -webkit-text-size-adjust:100%; scrollbar-gutter:stable;}
  body{
    margin:0; color:var(--blue-deep);
    font-family:"Cormorant Garamond", Georgia, serif;
    font-size:clamp(1.08rem,1.02rem+0.32vw,1.28rem); line-height:1.5;
    background-color:#FCF9F0;
    background-image:url("../images/creme-textur.webp");
    background-repeat:no-repeat;
    background-size:cover;
    background-attachment:fixed;
    overflow-x:hidden;
  }

  h1,h2,h3,h4{margin:0; font-weight:600; line-height:1.05; color:var(--blue); letter-spacing:-0.005em; font-family:"Cormorant Garamond",serif;}
  p{margin:0 0 1em;}
  a{color:var(--blue);}
  img{max-width:100%; display:block;}
  em,i{font-style:italic;}
  ::selection{background:var(--blue); color:var(--paper);}

  .wrap{max-width:var(--maxw); margin-inline:auto; padding-inline:clamp(1.2rem,5vw,3rem);}
  .section{padding-block:clamp(3.4rem,8vw,6.5rem); position:relative;}

  /* ---- Abschnitts-Hintergründe: alternieren zwischen hellem Gelb und Creme-Weiß ---- */
  /* Gelb wie im Header (#F6F4CB), aber etwas abgeschwächt (ca. 70 %), klar abgegrenzt von den Creme-Abschnitten */
  .bg-gelb{background-color:#FCF9F0;
    background-image:
      linear-gradient(rgba(246,244,203,.7), rgba(246,244,203,.7)),
      url("../images/creme-textur.webp");
    background-repeat:no-repeat; background-size:100% 100%, cover; background-position:center;}
  .bg-creme{background-color:#FCF9F0;
    background-image:linear-gradient(rgba(252,249,240,.65), rgba(252,249,240,.65)), url("../images/creme-textur.webp");
    background-repeat:no-repeat; background-size:100% 100%, cover; background-position:center;}

  /* ---- Eyebrow-Label (ersetzt Pixel-Marker, nur Cormorant) ---- */
  .marker{font-family:"Cormorant Garamond",serif; font-style:italic; font-weight:600; color:var(--blue);
    text-transform:uppercase; letter-spacing:.14em; font-size:1.02rem; margin-bottom:1.3rem; display:inline-block;
    border-bottom:1.5px solid var(--blue); padding-bottom:.25em;}

  /* ---- Schnörkel-Initiale (jetzt Cormorant statt Playfair) ---- */
  .giant{font-family:"Cormorant Garamond",serif; font-weight:700; font-style:italic; color:var(--blue); line-height:.7;}

  /* ---- Fotos / Collage ---- */
  .ph{display:block; overflow:hidden; border-radius:var(--r); box-shadow:0 10px 26px -14px rgba(34,65,168,.55); background:var(--paper-2);}
  .ph img{width:100%; height:100%; object-fit:cover; display:block;}
  .r1{transform:rotate(-3.2deg);} .r2{transform:rotate(2.6deg);} .r3{transform:rotate(-1.6deg);} .r4{transform:rotate(3.8deg);}
  .float-r{float:right; width:min(42%,250px); margin:.4rem 0 1.2rem 1.8rem;}
  .float-l{float:left; width:min(42%,250px); margin:.4rem 1.8rem 1.2rem 0;}

  /* ---- Buttons: weiche Pille statt Pixel-Block ---- */
  .btn{font-family:"Cormorant Garamond",serif; font-weight:600; font-size:1.08rem; letter-spacing:.02em;
    display:inline-flex; align-items:center; gap:.5em; padding:.7em 1.5em; text-decoration:none; cursor:pointer;
    background:var(--blue); color:var(--paper); border:1.5px solid var(--blue); border-radius:999px;
    transition:background .15s ease, color .15s ease, transform .15s ease, box-shadow .15s ease;}
  .btn:hover{background:var(--paper); color:var(--blue); transform:translateY(-2px); box-shadow:0 8px 18px -8px rgba(34,65,168,.5);}
  .btn-ghost{background:transparent; color:var(--blue);}
  .btn-ghost:hover{background:var(--blue); color:var(--paper);}
  .btn-on-photo{background:var(--powder); color:var(--blue-deep); border-color:var(--powder);}
  .btn-on-photo:hover{background:var(--paper); color:var(--blue); border-color:var(--paper);}
  .btn-stone{background-image:linear-gradient(rgba(252,250,245,.96), rgba(252,250,245,.96)), var(--tex);
    background-size:cover; background-position:center; background-repeat:no-repeat;
    color:var(--blue-deep); border-color:var(--stone-line);}
  .btn-stone:hover{background-image:linear-gradient(rgba(252,250,245,1), rgba(252,250,245,1)), var(--tex);
    color:var(--blue); transform:translateY(-2px); box-shadow:0 8px 18px -8px rgba(34,65,168,.35);}

  .ul{text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:3px;}

  /* ---- Nav ---- */
  header.nav{position:sticky; top:0; z-index:200; background:var(--paper); border-bottom:1.5px solid var(--blue);}
  .nav-inner{display:flex; align-items:center; justify-content:space-between; gap:1rem; min-height:60px;}
  .brand{font-family:"Cormorant Garamond",serif; font-weight:600; font-style:italic; font-size:1.35rem; color:var(--blue); text-decoration:none;}
  .nav-links{display:flex; align-items:center; gap:1.6rem;}
  .nav-links a{font-family:"Cormorant Garamond",serif; font-size:1.05rem; color:var(--blue); text-decoration:none; position:relative;}
  .nav-links a:not(.btn)::after{content:""; position:absolute; left:0; right:100%; bottom:-3px; height:2px; background:var(--blue); transition:right .25s ease;}
  .nav-links a:not(.btn):hover::after{right:0;}
  .nav-links a.btn{padding:.45em 1.1em; font-size:1rem; color:var(--paper);}
  .nav-links a.btn:hover{color:var(--blue);}
  .nav-toggle{display:none; background:none; border:0; cursor:pointer; padding:.3rem; color:var(--blue);}

  /* ---- HERO (Foto-Hintergrund) ---- */
  .hero{position:relative; min-height:min(90vh,760px); display:flex; align-items:center; overflow:hidden;}
  .hero-media{position:absolute; inset:0; z-index:0;}
  .hero-media img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 42%;}
  .hero-media::after{content:""; position:absolute; inset:0; pointer-events:none;
    background:linear-gradient(180deg, rgba(15,22,14,.12) 0%, rgba(15,22,14,0) 35%);}
  .hero-inner{position:relative; z-index:2; padding-block:clamp(2.4rem,6vw,4rem); text-align:left; max-width:760px;}
  .hero-statement{font-family:"Cormorant Garamond",serif; font-style:italic; font-weight:600; color:#FFFDF3;
    font-size:clamp(3rem,8.5vw,6.6rem); line-height:0.95; letter-spacing:normal; margin:0 0 .15em -0.02em;
    text-shadow:0 2px 4px rgba(20,30,12,.55), 0 4px 26px rgba(20,30,12,.5);
    transform:rotate(-1.6deg); transform-origin:left center;}
  .hero-statement .swash-cap{font-family:"Ephesis",serif; font-style:normal; font-weight:400;
    font-size:1.35em; line-height:0; vertical-align:-0.12em;}
  .hero-subtitle{font-family:"Cormorant Garamond",serif; font-weight:600; font-size:clamp(1.5rem,3vw,2.4rem);
    color:#FFFCF1; margin:0 0 1.9rem; letter-spacing:.004em; text-shadow:0 2px 4px rgba(20,30,12,.6), 0 2px 16px rgba(20,30,12,.5);}
  .hero-cta{display:flex; flex-wrap:wrap; gap:.85rem; align-items:center;}
  .hero-trust{font-family:"Cormorant Garamond",serif; font-style:italic; font-size:1rem; color:var(--blue-deep); opacity:1;
    text-shadow:0 1px 3px rgba(255,255,255,.45), 0 1px 12px rgba(255,255,255,.35);
    display:flex; flex-wrap:wrap; gap:.4rem 1.2rem; margin-top:1.8rem;}
  .hero-trust span::before{content:"·"; margin-right:.5em;}
  .hero-trust span:first-child::before{content:"";margin-right:0;}

  /* ---- MANIFEST (verfeinert, ohne Marker, ohne Signatur) ---- */
  .manifest{border-block:1.5px solid var(--blue);}
  .manifest .lede-fine{font-family:"Cormorant Garamond",serif; font-style:italic; font-weight:400;
    font-size:clamp(1.35rem,2.6vw,2rem); line-height:1.42; max-width:52ch; color:var(--blue-deep);}
  .manifest .lede-fine em{color:var(--blue-deep); font-style:italic; font-weight:500;}

  /* ---- Section head ---- */
  .head{max-width:62ch; margin-bottom:clamp(2rem,4vw,3rem);}
  .head h2{font-size:clamp(2.2rem,5.5vw,4rem);}
  .head h2 em{font-style:italic; font-weight:700;}
  .head .sub{font-family:"Cormorant Garamond",serif; font-style:italic; font-size:1.28rem; color:var(--blue-deep); margin-top:.9rem;}

  /* ---- ÜBER MICH ---- */
  .about-grid{display:grid; grid-template-columns:1fr 1.1fr; gap:clamp(2rem,5vw,4rem); align-items:center;}
  .about-photo .ph{aspect-ratio:4/3; width:100%; max-width:520px;}
  .about-photo .ph img{object-position:46% 50%;}
  .about-text h2{font-family:"Cormorant Garamond",serif; font-size:clamp(2rem,4.6vw,3.2rem);}
  .about-text h2 em{font-style:italic; font-weight:700;}
  .about-text .intro{font-family:"Cormorant Garamond",serif; font-style:italic; font-size:clamp(1.2rem,1.8vw,1.55rem); line-height:1.3; margin:1rem 0 1.3rem; color:var(--blue);}
  .about-text p{color:var(--blue-deep); max-width:62ch;}

  /* ---- ANGEBOT ---- */
  .offer-group{margin-bottom:clamp(2.6rem,5vw,4rem);}
  .group-label{font-family:"Cormorant Garamond",serif; font-style:italic; font-weight:600; font-size:1.5rem; color:var(--blue); display:flex; align-items:center; gap:1rem; margin-bottom:1.5rem;}
  .group-label::after{content:""; flex:1; height:1.5px; background:var(--blue);}
  .cards{display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem;}
  .card{border:1.5px solid var(--blue); border-radius:var(--r); padding:1.7rem 1.6rem; display:flex; flex-direction:column; transition:transform .18s ease, box-shadow .18s ease;}
  .card:hover{transform:translateY(-3px); box-shadow:0 14px 30px -16px rgba(34,65,168,.45);}
  .card.tone-stone{
    background-image:linear-gradient(rgba(252,250,245,.96), rgba(252,250,245,.96)), var(--tex);
    background-size:cover; background-position:center; background-repeat:no-repeat;
    border-color:var(--stone-line);}
  .card.tone-terra{
    background-image:linear-gradient(rgba(241,220,210,.96), rgba(241,220,210,.96)), var(--tex);
    background-size:cover; background-position:center; background-repeat:no-repeat;
    border-color:var(--terra);}
  .card .tag{font-family:"Cormorant Garamond",serif; font-style:italic; font-size:.92rem; letter-spacing:.03em; color:var(--blue); margin-bottom:.6rem;}
  .card h4{font-family:"Cormorant Garamond",serif; font-weight:700; font-size:1.85rem; margin:0 0 .6rem;}
  .card p{font-size:1.04rem; color:var(--blue-deep); flex:1; margin-bottom:0;}
  .price{margin-top:1.1rem; padding-top:.9rem; border-top:1.5px dashed var(--blue); font-family:"Cormorant Garamond",serif; font-size:1.02rem; letter-spacing:.01em;}
  .price .ph-price{font-weight:600; font-variant-numeric:lining-nums;}
  .card.feature{
    background-image:linear-gradient(rgba(214,231,238,.96), rgba(214,231,238,.96)), var(--tex);
    background-size:cover; background-position:center; background-repeat:no-repeat;
    border-color:var(--powder-deep); color:var(--blue-deep);}
  .card.feature .price{border-top-color:rgba(34,65,168,.32); color:var(--blue-deep);}
  .card.feature .ribbon{font-family:"Cormorant Garamond",serif; font-weight:600; font-style:italic; font-size:.92rem; letter-spacing:.02em;
    align-self:flex-start; background:var(--mustard); color:#3a2c0f; border-radius:999px; padding:.25em .9em; margin-bottom:.9rem;}
  .card .card-cta, .card .card-cta-ghost{margin-top:1.2rem; align-self:stretch;}
  details.norm{margin-top:1.2rem;}
  details.norm summary{cursor:pointer; font-family:"Cormorant Garamond",serif; font-style:italic; font-weight:600; font-size:1.02rem; color:var(--blue); list-style:none; display:inline-flex; gap:.45rem;}
  details.norm summary::-webkit-details-marker{display:none;}
  details.norm summary::before{content:"+";}
  details.norm[open] summary::before{content:"–";}
  details.norm p{font-family:"Cormorant Garamond",serif; margin:.8rem 0 0; max-width:64ch; font-size:1.05rem; color:var(--blue-deep);}
  .cv-list{list-style:none; padding:0; margin:.95rem 0 0; font-family:"Cormorant Garamond",serif;}
  .cv-list li{display:grid; grid-template-columns:5.8em 1fr; gap:.9rem; padding:.5rem 0; font-size:1.05rem; border-bottom:1px dashed rgba(34,65,168,.22);}
  .cv-list li:last-child{border-bottom:none;}
  .cv-list .cv-year{font-style:italic; font-weight:600; color:var(--blue); white-space:nowrap;}
  .cv-list .cv-what{color:var(--blue-deep);}

  /* Schreibbegleitung */
  .panel{border:1.5px solid var(--writing-line); border-radius:var(--r); padding:clamp(1.7rem,4vw,2.8rem);
    background-image:linear-gradient(rgba(223,227,244,.96), rgba(223,227,244,.96)), var(--tex);
    background-size:cover; background-position:center; background-repeat:no-repeat;}
  .panel-grid{display:grid; grid-template-columns:1fr 1fr; gap:clamp(1.5rem,4vw,3rem); align-items:start;}
  .panel .q{font-family:"Cormorant Garamond",serif; font-style:italic; font-size:1.3rem; line-height:1.34; color:var(--blue); margin-bottom:1rem;}
  .panel p{font-family:"Cormorant Garamond",serif; color:var(--blue-deep);}
  .panel ul{list-style:none; padding:0; margin:0 0 1.1rem; font-family:"Cormorant Garamond",serif;}
  .panel ul li{position:relative; padding-left:1.9rem; margin-bottom:.8rem; color:var(--blue-deep);}
  .panel ul li::before{content:"→"; position:absolute; left:0; top:0; color:var(--blue);}
  .panel .note{font-size:1rem; color:var(--blue-deep); margin-bottom:0; font-style:italic;}

  /* Mein Fokus (vormals reine Zitat-Aside) */
  .focus-block{margin-top:clamp(2rem,4vw,3rem);}
  .focus-grid{display:grid; grid-template-columns:1.2fr 0.8fr; gap:clamp(2rem,5vw,3.6rem); align-items:start;}
  .focus-text .lead{font-family:"Cormorant Garamond",serif; font-style:italic; font-size:clamp(1.4rem,2.6vw,2rem); line-height:1.32; margin-bottom:1.2rem; color:var(--blue-deep); max-width:46ch;}
  .focus-text .lead em{color:var(--blue-deep); font-style:italic; font-weight:500;}
  .focus-text p{max-width:54ch;}
  .focus-card{border:1.5px solid var(--stone-line); border-radius:var(--r); padding:1.6rem 1.8rem; transform:rotate(2deg); box-shadow:0 10px 26px -16px rgba(34,65,168,.45); margin-top:.6rem;
    background-image:linear-gradient(rgba(252,250,245,.96), rgba(252,250,245,.96)), var(--tex);
    background-size:cover; background-position:center; background-repeat:no-repeat;}
  .focus-card .ftitle{font-family:"Cormorant Garamond",serif; font-style:italic; font-weight:600; font-size:1.25rem; color:var(--blue); margin-bottom:.9rem; display:block;}
  .chips{display:flex; flex-wrap:wrap; gap:.6rem; margin-bottom:1rem;}
  .chip{font-family:"Cormorant Garamond",serif; font-size:1rem; padding:.4em 1.05em; border-radius:999px; border:1.5px solid var(--blue); color:var(--blue-deep);}
  .chip.tone-terra{background:var(--terra-tint); border-color:var(--terra);}
  .chip.tone-stone{background:var(--stone); border-color:var(--stone-line);}
  .chip.tone-powder{background:var(--powder); border-color:var(--powder-deep);}
  .chip.tone-writing{background:var(--writing); border-color:var(--writing-line);}
  .chip.tone-moss{background:var(--moss-tint); border-color:var(--moss);}
  .chip.tone-mustard{background:var(--mustard-tint); border-color:var(--mustard);}
  .focus-card .fnote{margin:0; font-size:1rem; color:var(--blue-deep); font-style:italic;}

  /* ---- ABLAUF ---- */
  .ablauf{border-block:1.5px solid var(--blue);}
  .steps{list-style:none; padding:0; margin:0;}
  .step{display:grid; grid-template-columns:auto 1fr; gap:clamp(1rem,3vw,2.4rem); padding:1.5rem 0; border-top:1.5px solid var(--blue); align-items:baseline;}
  .step:first-child{border-top:0;}
  .step .sn{font-family:"Cormorant Garamond",serif; font-style:italic; font-weight:700; font-size:clamp(1.6rem,3.2vw,2.4rem); color:var(--blue); line-height:1; min-width:2.4ch;}
  .step h3{font-family:"Cormorant Garamond",serif; font-weight:700; font-size:clamp(1.5rem,3vw,2.1rem); margin-bottom:.35rem;}
  .step p{font-family:"Cormorant Garamond",serif; margin:0; max-width:66ch; color:var(--blue-deep);}

  /* ---- ARBEITSANSATZ ---- */
  .approach-grid{display:grid; grid-template-columns:1.15fr 0.85fr; gap:clamp(2rem,5vw,4rem); align-items:center;}
  .ap-list{list-style:none; padding:0; margin:1.6rem 0; font-family:"Cormorant Garamond",serif;}
  .ap-list li{position:relative; padding-left:2.1rem; margin-bottom:.95rem; font-size:1.18rem; color:var(--blue-deep);}
  .ap-list li::before{content:"→"; position:absolute; left:0; top:0; color:var(--blue); font-size:1.1rem;}
  .kurzum{font-family:"Cormorant Garamond",serif; border:1.5px solid var(--powder-deep); border-radius:var(--r); padding:1.3rem 1.5rem;
    background-image:linear-gradient(rgba(214,231,238,.96), rgba(214,231,238,.96)), var(--tex);
    background-size:cover; background-position:center; background-repeat:no-repeat;}
  .kurzum b{font-family:"Cormorant Garamond",serif; font-style:italic; font-weight:600; font-size:.98rem; letter-spacing:.02em; color:var(--blue); display:block; margin-bottom:.5rem;}
  .kurzum p{margin:0; color:var(--blue-deep);}
  .ap-photo{margin:0; display:flex; justify-content:flex-end; align-items:center;}
  .ap-photo .ph{width:min(100%,360px); margin-right:-.5rem;}

  /* ---- KONTAKT ---- */
  .contact{border-top:1.5px solid var(--blue); text-align:center;}
  .contact h2{font-family:"Cormorant Garamond",serif; font-size:clamp(2.6rem,7vw,5.2rem); line-height:1;}
  .contact h2 em{font-style:italic; font-weight:700;}
  .contact .lede{font-family:"Cormorant Garamond",serif; font-size:1.3rem; max-width:52ch; margin:1.4rem auto 1.8rem; color:var(--blue-deep);}
  .channels{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.1rem; max-width:680px; margin:0 auto 1.8rem;}
  .channel{display:flex; align-items:center; justify-content:center; text-align:center; text-decoration:none;
    padding:1.3rem 1.5rem; border-radius:var(--r); border:1.5px solid var(--grey-line);
    background:rgba(255,255,255,.55); color:var(--blue-deep);
    transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;}
  .channel:hover{transform:translateY(-3px); border-color:var(--blue); background:rgba(255,255,255,.85); box-shadow:0 14px 30px -16px rgba(34,65,168,.4);}
  .channel .ch-text{display:flex; flex-direction:column; line-height:1.2; min-width:0;}
  .channel .ch-label{font-family:"Cormorant Garamond",serif; font-style:italic; font-size:1rem; color:var(--grey-text);}
  .channel .ch-value{font-family:"Cormorant Garamond",serif; font-weight:700; font-size:clamp(1.05rem,1.9vw,1.35rem); color:var(--blue); overflow:hidden; text-overflow:ellipsis;}
  /* Instagram: gelb wie die gelben Abschnitte, mittig unter den beiden anderen */
  .channel.instagram{grid-column:1 / -1; justify-self:center; width:calc(50% - .55rem); background:#F8F6D6;}
  .channel.instagram:hover{background:#FBF9E2;}
  .contact .btn:hover{background:#FCF9F0; color:var(--blue);}
  .contact-cta{display:flex; gap:.8rem; justify-content:center; flex-wrap:wrap;}
  .contact .smile{font-family:"Cormorant Garamond",serif; font-style:italic; font-size:1.4rem; margin-top:1.8rem; color:var(--blue);}
  @media(max-width:560px){.channels{grid-template-columns:1fr; max-width:420px;} .channel.instagram{width:100%;}}

  /* footer */
  footer{border-top:1.5px solid var(--blue); background:var(--blue); color:var(--paper); font-family:"Cormorant Garamond",serif;}
  footer .wrap{display:flex; flex-wrap:wrap; justify-content:space-between; gap:1.4rem; align-items:center; padding-block:1.8rem; font-size:1rem;}
  footer a{color:var(--paper); text-decoration:none; opacity:.85;}
  footer a:hover{opacity:1; text-decoration:underline;}
  footer .flinks{display:flex; gap:1.2rem; flex-wrap:wrap;}

  .js .reveal{opacity:0; transform:translateY(20px); transition:opacity .6s ease, transform .6s ease;}
  .js .reveal.in{opacity:1; transform:none;}

  @media (max-width:900px){
    .about-grid, .panel-grid, .approach-grid, .focus-grid{grid-template-columns:1fr;}
    .cards{grid-template-columns:1fr;}
    .ap-photo{max-width:380px;}
    .approach-grid .ap-photo{order:-1;}
    .focus-card{transform:rotate(1deg); margin-top:1rem;}
  }
  @media (max-width:680px){
    .nav-links{position:fixed; inset:60px 0 auto 0; background:var(--paper); flex-direction:column; align-items:flex-start; gap:0; padding:0 clamp(1.2rem,5vw,2rem); max-height:0; overflow:hidden; transition:max-height .3s ease; border-bottom:1.5px solid var(--blue);}
    .nav-links.open{max-height:400px; padding-block:1rem;}
    .nav-links a{width:100%; padding:.7rem 0;}
    .nav-links a.btn{margin-top:.5rem;}
    .nav-toggle{display:block;}
    .hero-statement{transform:none;}
  }
  @media (prefers-reduced-motion:reduce){
    *{animation:none !important;}
    html{scroll-behavior:auto;}
    .js .reveal{opacity:1; transform:none; transition:none;}
    .r1,.r2,.r3,.r4{transform:none;}
  }


/* ================= ARTIKEL ================= */
/* Auf Artikelseiten gilt durchgehend das dunkle Blau (--blue-deep) und der Creme-Weiß-Hintergrund */
.nav-links a[aria-current="page"]:not(.btn)::after{right:0;}
.more-link{font-family:"Cormorant Garamond",serif; font-style:italic; font-size:1.25rem; margin:1.6rem 0 0;}
.more-link a{color:var(--blue); text-decoration:underline; text-decoration-thickness:1.5px; text-underline-offset:4px;}
.more-link a:hover{color:var(--blue-deep);}
.norm-link{display:inline-flex; gap:.45rem; margin-top:.8rem; font-family:"Cormorant Garamond",serif; font-style:italic; font-weight:600; font-size:1.02rem; color:var(--blue); text-decoration:none;}
.norm-link::before{content:"+";}
.norm-link:hover{text-decoration:underline; text-underline-offset:3px;}
.about-text details.norm + .norm-link{display:flex; width:max-content;}

/* Übersicht */
.page-head{padding-block:clamp(2.6rem,6vw,4.5rem) clamp(2.2rem,5vw,3.6rem); border-bottom:1.5px solid var(--blue-deep);}
.page-head .marker{color:var(--blue-deep);}
.page-head h1{font-size:clamp(2.6rem,7vw,5rem); line-height:1; color:var(--blue-deep);}
.page-head .sub{font-family:"Cormorant Garamond",serif; font-style:italic; font-size:1.4rem; max-width:52ch; margin:1rem 0 0; color:var(--blue-deep);}
.topic + .topic{border-top:1.5px solid var(--blue-deep);}
.topic-title{font-family:"Cormorant Garamond",serif; font-style:italic; font-weight:600; font-size:clamp(1.5rem,3vw,2rem); color:var(--blue-deep); display:flex; align-items:center; gap:1rem; margin:0 0 clamp(1.8rem,4vw,2.8rem);}
.topic-title::after{content:""; flex:1; height:1.5px; background:var(--blue-deep);}
.art-list{display:flex; flex-direction:column; gap:clamp(2rem,4.5vw,3rem);}
.art-item{display:grid; grid-template-columns:minmax(0,230px) minmax(0,1fr); gap:clamp(1.4rem,4vw,2.8rem); align-items:center; text-decoration:none; color:inherit;}
.art-item .ph{aspect-ratio:4/3; width:100%; transition:box-shadow .25s ease;}
.art-item .ph img{object-position:center 28%;}
.art-item:hover .ph{box-shadow:0 16px 30px -16px rgba(34,65,168,.6);}
.art-item h3{font-family:"Cormorant Garamond",serif; font-weight:700; font-size:clamp(1.7rem,3.6vw,2.6rem); line-height:1.1; color:var(--blue-deep); margin:0 0 .6rem; max-width:34ch;}
.art-item:hover h3{text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:5px;}
.art-sub{font-family:"Cormorant Garamond",serif; font-weight:400; font-style:normal; font-size:clamp(1.15rem,2vw,1.4rem); line-height:1.4; color:var(--blue-deep); margin:0; max-width:62ch;}

/* Einzelner Artikel: breite, zentrierte Spalte, kein Bild */
.article-col{max-width:960px; margin-inline:auto; padding-block:clamp(2.4rem,5vw,4rem) clamp(3rem,7vw,5rem); color:var(--blue-deep);}
.back-link{display:inline-block; font-family:"Cormorant Garamond",serif; font-style:italic; font-weight:600; font-size:1.1rem; color:var(--blue-deep); text-decoration:none; margin-bottom:1.6rem;}
.back-link:hover{text-decoration:underline; text-underline-offset:3px;}
.article-col .topic-label{display:block; font-family:"Cormorant Garamond",serif; font-style:italic; font-weight:600; font-size:1.15rem; color:var(--blue-deep); margin-bottom:.7rem;}
.article-col h1{font-size:clamp(2.2rem,5.4vw,3.9rem); font-weight:700; line-height:1.07; color:var(--blue-deep);}
.article-col .art-sub{font-size:clamp(1.3rem,2.3vw,1.7rem); line-height:1.4; margin-top:1rem; max-width:none;}
.article-body{margin-top:clamp(1.8rem,4vw,2.6rem); padding-top:clamp(1.8rem,4vw,2.6rem); border-top:1.5px solid var(--blue-deep); color:var(--blue-deep);}
.article-body p{font-size:1.3rem; line-height:1.7; margin:0 0 1.15em; color:var(--blue-deep);}
.article-body h2{font-size:clamp(1.75rem,3.2vw,2.35rem); font-weight:700; line-height:1.15; margin:2.6rem 0 .9rem; color:var(--blue-deep);}
.article-body h3{font-size:clamp(1.4rem,2.4vw,1.7rem); font-weight:700; line-height:1.2; margin:1.9rem 0 .6rem; color:var(--blue-deep);}
.article-body strong{font-weight:700;}
.article-body a{color:var(--blue-deep); text-decoration:underline; text-decoration-thickness:1.5px; text-underline-offset:3px;}
.article-body a:hover{text-decoration-thickness:2.5px;}
.article-body ul{margin:0 0 1.3em; padding-left:1.5rem;}
.article-body li{font-size:1.3rem; line-height:1.65; margin-bottom:.65rem; padding-left:.3rem; color:var(--blue-deep);}
.article-body li::marker{color:var(--blue-deep);}
.article-body code{font-family:"Courier New",ui-monospace,monospace; font-size:.92em; background:rgba(34,65,168,.07); padding:.05em .35em; border-radius:6px;}
.article-body blockquote{margin:0 0 1.15em; padding:.25rem 0 .25rem 1.4rem; border-left:3px solid var(--blue-deep);}
.article-body blockquote p{font-style:italic; margin:0;}
.article-body blockquote .src{font-style:normal; font-size:1.1rem; margin-top:.5rem;}
.article-body .vs{font-family:"Cormorant Garamond",serif; font-style:italic; font-weight:600; font-size:1.15rem; margin:-.2rem 0 .9rem 1.4rem;}
.article-body sup a{text-decoration:none; font-size:.8em; padding:0 .1em;}
.footnote{margin:2.6rem 0 0; padding-top:1rem; border-top:1px dashed rgba(34,65,168,.35); font-size:1.05rem; line-height:1.5; color:var(--blue-deep);}
.footnote a{color:var(--blue-deep);}

.more-block{border-top:1.5px solid var(--blue-deep);}
.more-block .article-col{padding-block:0;}
.more-block h2{font-size:clamp(2rem,4.6vw,3.2rem); margin-bottom:clamp(1.4rem,3vw,2rem); color:var(--blue-deep);}
.more-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:1.1rem;}
.more-box{display:flex; flex-direction:column; gap:.45rem; padding:1.4rem 1.6rem; border-radius:var(--r); border:1.5px solid var(--grey-line); background:rgba(255,255,255,.55); text-decoration:none; color:var(--blue-deep);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;}
.more-box:hover{transform:translateY(-3px); border-color:var(--blue-deep); background:rgba(255,255,255,.85); box-shadow:0 14px 30px -16px rgba(34,65,168,.4);}
.more-box .mb-topic{font-family:"Cormorant Garamond",serif; font-style:italic; font-weight:600; font-size:1rem; color:var(--blue-deep);}
.more-box .mb-title{font-family:"Cormorant Garamond",serif; font-weight:700; font-size:1.55rem; line-height:1.15; color:var(--blue-deep);}
.more-box .mb-sub{font-family:"Cormorant Garamond",serif; font-size:1.1rem; line-height:1.4; color:var(--blue-deep);}
.more-all{margin:1.6rem 0 0; font-family:"Cormorant Garamond",serif; font-style:italic; font-size:1.2rem;}
.more-all a{color:var(--blue-deep);}

@media (max-width:760px){
  .art-item{grid-template-columns:1fr;}
  .art-item .ph{max-width:280px;}
  .article-body p, .article-body li{font-size:1.2rem;}
}


/* ================= BARRIEREFREIHEIT / SEO-HILFEN ================= */
.skip-link{position:absolute; left:-9999px; top:0; z-index:1000; background:var(--blue-deep); color:#fff; padding:.7rem 1.1rem; border-radius:0 0 var(--r) 0; font-family:"Cormorant Garamond",serif; font-size:1.1rem; text-decoration:none;}
.skip-link:focus{left:0;}
.crumbs ol{list-style:none; display:flex; flex-wrap:wrap; gap:.5rem; margin:0 0 1.6rem; padding:0; font-family:"Cormorant Garamond",serif; font-style:italic; font-weight:600; font-size:1.1rem;}
.crumbs li + li::before{content:"\203A"; margin-right:.5rem; color:var(--blue-deep);}
.crumbs a{color:var(--blue-deep); text-decoration:none;}
.crumbs a:hover{text-decoration:underline; text-underline-offset:3px;}
ul.art-list{list-style:none; padding:0; margin:0;}

/* ================= SEITENÜBERGÄNGE (View Transitions, seitenübergreifend) ================= */
@media (prefers-reduced-motion:no-preference){
  @view-transition{navigation:auto;}
  header.nav{view-transition-name:site-header;}
  ::view-transition-group(site-header){animation-duration:0s;}
  ::view-transition-old(root){animation:vt-out .2s ease both;}
  ::view-transition-new(root){animation:vt-in .35s ease both;}
  @keyframes vt-out{to{opacity:0; transform:translateY(-6px);}}
  @keyframes vt-in{from{opacity:0; transform:translateY(12px);}}
}
