:root{
    --ink:#17120d;
    --black:#080706;
    --soot:#11100d;
    --brown:#2b2118;
    --rust:#5b2b1f;
    --paper:#d7c39b;
    --paper-2:#bda77d;
    --paper-light:#eadab7;
    --gold:#aa8551;
    --ash:#8f836d;
    --line:rgba(220,197,151,.20);
    --max:1240px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--black)}
body{
    margin:0;
    color:var(--paper-light);
    background:
        radial-gradient(circle at 14% 12%,rgba(168,117,60,.12),transparent 28rem),
        radial-gradient(circle at 79% 8%,rgba(180,133,69,.09),transparent 30rem),
        linear-gradient(180deg,#0b0907 0%,#14100c 46%,#090806 100%);
    font-family:Georgia,"Times New Roman",serif;
    min-height:100vh;
}
body::before{
    content:"";
    position:fixed; inset:0; pointer-events:none; z-index:99; opacity:.20;
    background-image:
        repeating-linear-gradient(0deg,rgba(255,255,255,.012) 0 1px,transparent 1px 4px),
        radial-gradient(circle at 25% 35%,rgba(255,255,255,.10) 0 1px,transparent 1.5px),
        radial-gradient(circle at 75% 62%,rgba(0,0,0,.28) 0 1px,transparent 1.7px);
    background-size:auto,17px 19px,23px 29px;
    mix-blend-mode:screen;
}
a{color:inherit}
.wrap{width:min(calc(100% - 40px),var(--max));margin:0 auto}
.masthead{
    position:sticky;top:0;z-index:50;border-bottom:1px solid var(--line);
    background:rgba(8,7,6,.91);backdrop-filter:blur(12px);
}
.masthead-inner{min-height:62px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:baseline;gap:12px;text-decoration:none;white-space:nowrap}
.brand b{font:700 16px/1 Arial,Helvetica,sans-serif;letter-spacing:.18em}
.brand span{color:var(--ash);font:600 11px/1.2 Arial,Helvetica,sans-serif;letter-spacing:.11em;text-transform:uppercase}
.topnav{display:flex;gap:22px;align-items:center}
.topnav a{color:#c6b48f;text-decoration:none;font:600 11px/1 Arial,Helvetica,sans-serif;text-transform:uppercase;letter-spacing:.12em}
.topnav a:hover,.footer-links a:hover{color:#fff0c8}

.hero{
    position:relative;
    width:100%;
    aspect-ratio:1920 / 1020;
    min-height:0;
    background:#0a0908;
    overflow:hidden;
    border-bottom:1px solid var(--line);
}
.hero picture,.hero img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    display:block;
}
.hero img{
    object-fit:contain;
    object-position:center center;
    background:#0a0908;
}
.hero::after{
    content:"";position:absolute;inset:0;
    background:linear-gradient(180deg,rgba(4,4,3,.05) 0%,rgba(4,4,3,.06) 68%,rgba(4,4,3,.72) 100%);
    pointer-events:none;
}
.hero-caption{
    position:absolute;left:0;right:0;bottom:0;z-index:2;
    padding:56px 0 34px;
    background:linear-gradient(180deg,transparent,rgba(7,6,5,.86));
}
.hero-caption .kicker{margin:0 0 8px;color:#bfa16d;font:700 11px/1.2 Arial,Helvetica,sans-serif;letter-spacing:.20em;text-transform:uppercase}
.hero-caption h1{margin:0;color:#f0ddb0;font:700 clamp(30px,4.2vw,64px)/.98 Georgia,serif;letter-spacing:-.025em}
.hero-caption p{margin:13px 0 0;max-width:800px;color:#c6b692;font:400 17px/1.55 Georgia,serif}

.section{padding:96px 0;border-bottom:1px solid var(--line)}
.section-head{display:grid;grid-template-columns:180px minmax(0,1fr);gap:34px;margin-bottom:48px;align-items:start}
.eyebrow{color:#9d7547;font:800 11px/1.3 Arial,Helvetica,sans-serif;text-transform:uppercase;letter-spacing:.18em;padding-top:8px}
.section h2,.legal h1{margin:0;color:#ead9b3;font:700 clamp(34px,5vw,66px)/.98 Georgia,serif;letter-spacing:-.025em}
.section-intro{max-width:850px;margin:18px 0 0;color:#a99b7f;font:400 18px/1.65 Georgia,serif}

.thesis{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line)}
.thesis>div{min-height:240px;padding:36px;background:rgba(18,14,10,.96)}
.thesis .label{display:block;margin-bottom:22px;color:#9e7c52;font:800 10px/1 Arial,Helvetica,sans-serif;letter-spacing:.18em;text-transform:uppercase}
.thesis strong{display:block;color:#e8d5aa;font:700 clamp(26px,3vw,44px)/1.08 Georgia,serif}
.thesis p{margin:18px 0 0;color:#a99a7d;font:400 16px/1.65 Georgia,serif}

.chapter-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}
.chapter{
    grid-column:span 6;min-height:330px;padding:30px;position:relative;border:1px solid var(--line);
    background:linear-gradient(140deg,rgba(87,53,27,.10),transparent 42%),rgba(17,14,11,.87);
    text-decoration:none;overflow:hidden;transition:transform .25s ease,border-color .25s ease,background .25s ease;
}
.chapter:nth-child(3n){grid-column:span 12;min-height:300px}
.chapter:hover{transform:translateY(-3px);border-color:rgba(198,157,91,.42);background:rgba(26,20,14,.94)}
.chapter::after{content:attr(data-no);position:absolute;right:18px;bottom:-18px;color:rgba(210,177,115,.055);font:900 150px/.8 Impact,"Arial Narrow",sans-serif;pointer-events:none}
.chapter-top{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}
.chapter-no{color:#a77c4d;font:900 13px/1 Arial,Helvetica,sans-serif;letter-spacing:.14em}
.chapter-tag{color:#72634d;font:800 9px/1 Arial,Helvetica,sans-serif;letter-spacing:.15em;text-transform:uppercase}
.chapter h3{margin:60px 0 0;max-width:640px;color:#e5d2aa;font:700 31px/1.02 Georgia,serif}
.chapter h3 span{display:block;margin-top:8px;color:#9f8f73;font-size:18px;font-weight:400;line-height:1.25}
.chapter p{max-width:690px;margin:20px 0 0;color:#91846d;font:400 15px/1.6 Georgia,serif}
.chapter-ba{position:absolute;left:30px;bottom:26px;color:#b28c5c;font:800 10px/1 Arial,Helvetica,sans-serif;letter-spacing:.14em;text-transform:uppercase}

.mechanisms{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;border:1px solid var(--line);background:var(--line)}
.mechanism{min-height:80px;display:flex;align-items:center;padding:16px 18px;background:#11100d;color:#c2b18e;font:700 12px/1.35 Arial,Helvetica,sans-serif;letter-spacing:.03em}
.mechanism:nth-child(odd){background:#15110d}

.quote-block{margin-top:58px;padding:44px;border-left:6px solid #6e3928;background:linear-gradient(90deg,rgba(95,49,30,.22),transparent 60%),#12100d}
.quote-block p{margin:0;max-width:940px;color:#ead7ac;font:700 clamp(27px,4vw,48px)/1.14 Georgia,serif}
.quote-block small{display:block;margin-top:24px;color:#8c7b61;font:700 10px/1.4 Arial,Helvetica,sans-serif;letter-spacing:.16em;text-transform:uppercase}

.footer{padding:48px 0 56px;background:#080706}
.footer-grid{display:grid;grid-template-columns:1fr auto;gap:30px;align-items:end}
.footer b{display:block;color:#d2bd91;font:900 18px/1 Arial,Helvetica,sans-serif;letter-spacing:.16em}
.footer p{max-width:760px;margin:12px 0 0;color:#746b5a;font:400 13px/1.6 Georgia,serif}
.footer-meta{text-align:right;color:#6d6250;font:700 10px/1.7 Arial,Helvetica,sans-serif;letter-spacing:.11em;text-transform:uppercase}
.footer-links{display:flex;flex-wrap:wrap;gap:12px 18px;margin-top:18px}
.footer-links a{color:#9f8b67;text-decoration:none;font:700 10px/1.2 Arial,Helvetica,sans-serif;text-transform:uppercase;letter-spacing:.12em}

.legal{padding:86px 0 110px}
.legal-shell{display:grid;grid-template-columns:minmax(0,820px) minmax(220px,1fr);gap:70px;align-items:start}
.legal .kicker{margin:0 0 14px;color:#a77c4d;font:800 11px/1.2 Arial,Helvetica,sans-serif;letter-spacing:.18em;text-transform:uppercase}
.legal .dek{margin:18px 0 42px;color:#a99b7f;font:400 18px/1.65 Georgia,serif}
.legal h2{margin:48px 0 16px;color:#e2cca2;font:700 28px/1.1 Georgia,serif}
.legal h3{margin:28px 0 12px;color:#cdb78c;font:700 19px/1.2 Georgia,serif}
.legal p,.legal li{color:#aa9b7f;font:400 16px/1.72 Georgia,serif}
.legal a{color:#d2b77f;text-underline-offset:3px}
.legal address{font-style:normal;color:#c4b18c;line-height:1.7}
.legal-card{position:sticky;top:92px;padding:24px;border:1px solid var(--line);background:#11100d}
.legal-card b{display:block;color:#d7bf91;font:800 11px/1.3 Arial,Helvetica,sans-serif;letter-spacing:.15em;text-transform:uppercase}
.legal-card p{font-size:14px;line-height:1.6;margin:12px 0 0}
.legal-card .mini-links{display:grid;gap:10px;margin-top:20px}
.legal-card .mini-links a{text-decoration:none;font:700 10px/1.3 Arial,Helvetica,sans-serif;letter-spacing:.12em;text-transform:uppercase}

.notice{
    margin:26px 0;padding:20px 22px;border-left:4px solid #8a5236;background:rgba(84,46,29,.18);
    color:#bfae8a;font:400 14px/1.65 Georgia,serif;
}
.smallprint{font-size:13px!important;color:#80735f!important}

@media(max-width:900px){
    .topnav{display:none}
    .hero{min-height:0}
    .section-head{grid-template-columns:1fr;gap:8px}
    .thesis{grid-template-columns:1fr}
    .chapter,.chapter:nth-child(3n){grid-column:span 12}
    .mechanisms{grid-template-columns:1fr 1fr}
    .footer-grid,.legal-shell{grid-template-columns:1fr}
    .footer-meta{text-align:left}
    .legal-card{position:static}
}
@media(max-width:560px){
    .wrap{width:min(calc(100% - 26px),var(--max))}
    .brand span{display:none}
    .hero{min-height:0}
    .hero-caption{padding-bottom:22px}
    .hero-caption p{display:none}
    .section{padding:68px 0}
    .chapter{min-height:360px;padding:24px}
    .chapter h3{margin-top:48px}
    .chapter-ba{left:24px;bottom:22px}
    .mechanisms{grid-template-columns:1fr}
    .quote-block{padding:32px 24px}
    .legal{padding-top:60px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}


/* Reale Schattenseiten / Modals */
.modal-shell[hidden]{display:none}
.modal-shell{position:fixed;inset:0;z-index:120;display:grid;place-items:center;padding:28px}
.modal-backdrop{position:absolute;inset:0;background:rgba(4,3,2,.84);backdrop-filter:blur(8px)}
.modal-panel{
    position:relative;z-index:1;width:min(100%,1050px);max-height:calc(100vh - 56px);overflow:auto;
    border:1px solid rgba(220,197,151,.26);background:#0e0c09;box-shadow:0 30px 100px rgba(0,0,0,.72);
}
.modal-bar{
    position:sticky;top:0;z-index:5;display:flex;justify-content:space-between;align-items:center;gap:20px;
    min-height:54px;padding:0 18px;border-bottom:1px solid var(--line);background:rgba(8,7,6,.96);
}
.modal-bar b{font:800 10px/1 Arial,Helvetica,sans-serif;letter-spacing:.15em;text-transform:uppercase;color:#b89a6b}
.modal-close{appearance:none;border:0;background:transparent;color:#d6c095;cursor:pointer;font:700 12px/1 Arial,Helvetica,sans-serif;letter-spacing:.12em;text-transform:uppercase}
.modal-content .masthead,.modal-content .footer,.modal-content .legal-card{display:none}
.modal-content .legal{padding:42px 0 60px}
.modal-content .legal-shell{display:block}
.modal-content .legal-shell>article{max-width:820px;margin:auto}
body.modal-open{overflow:hidden}
code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;color:#d5b77f}
@media(max-width:560px){
    .modal-shell{padding:0}
    .modal-panel{width:100%;height:100vh;max-height:none;border:0}
}


/* v0.3.1 · Vollständige Schautafel: niemals beschneiden */
.hero-caption{
    pointer-events:none;
}
.hero-caption .wrap{
    pointer-events:auto;
}
@supports not (aspect-ratio: 1 / 1){
    .hero{height:auto;padding-top:53.125%}
}


/* v0.4 · Leserfassung / Verlagspublikation */
.faq-section{
    background:
        radial-gradient(circle at 82% 18%, rgba(135,88,46,.08), transparent 28rem),
        linear-gradient(180deg, rgba(17,14,11,.98), rgba(9,8,6,.98));
}
.faq-list{
    border-top:1px solid var(--line);
}
.faq-item{
    border-bottom:1px solid var(--line);
    background:rgba(17,14,11,.42);
}
.faq-item[open]{
    background:
        linear-gradient(90deg, rgba(92,51,31,.16), transparent 55%),
        rgba(20,16,12,.72);
}
.faq-item summary{
    list-style:none;
    display:grid;
    grid-template-columns:64px minmax(0,1fr) 34px;
    gap:20px;
    align-items:center;
    min-height:92px;
    padding:22px 18px;
    cursor:pointer;
    color:#e4d1aa;
    font:700 clamp(18px,2.1vw,28px)/1.18 Georgia,serif;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{
    content:"+";
    color:#9d7547;
    font:400 30px/1 Georgia,serif;
    text-align:center;
}
.faq-item[open] summary::after{content:"–"}
.faq-no{
    color:#9d7547;
    font:800 11px/1 Arial,Helvetica,sans-serif;
    letter-spacing:.15em;
}
.faq-answer{
    padding:0 76px 30px 102px;
}
.faq-answer p{
    margin:0;
    max-width:880px;
    color:#a99b7f;
    font:400 17px/1.72 Georgia,serif;
}
.faq-closing{
    margin-top:34px;
    padding:28px 30px;
    border-left:5px solid #6e3928;
    background:linear-gradient(90deg,rgba(95,49,30,.20),transparent 70%),#12100d;
}
.faq-closing p{
    margin:0;
    color:#e5d2aa;
    font:700 clamp(22px,3vw,36px)/1.2 Georgia,serif;
}
.footer-meta{
    white-space:nowrap;
}
@media(max-width:560px){
    .faq-item summary{grid-template-columns:44px minmax(0,1fr) 24px;gap:12px;padding:18px 8px}
    .faq-answer{padding:0 8px 24px 56px}
}


/* v0.4.2 · Hero Full Bleed / keine seitlichen Leerflächen */
.hero{
    width:100vw;
    max-width:none;
    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);
    aspect-ratio:1920 / 1020;
}
.hero picture{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    margin:0;
    padding:0;
}
.hero img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center center;
    display:block;
}

/* FAQ und Footer explizit im Dokumentfluss halten */
.faq-section{
    display:block;
}
.footer{
    display:block;
    position:relative;
    z-index:2;
}

/* Cache-/Build-Hinweis nur im Quellcode, nicht sichtbar */


/* v0.4.3 · Typografische Laufweite
   Behutsam mehr Luft in den großen Titeln, ohne den Satzcharakter zu verlieren. */
.hero-caption h1{
    letter-spacing:.035em;
}

.section h2,
.legal h1{
    letter-spacing:.012em;
}

/* Große Zitate bleiben bewusst dichter als H2. */


/* v0.4.4 · Kapitelüberschriften H3
   Leicht erhöhte Laufweite analog zur H1/H2-Korrektur. */
.chapter h3{
    letter-spacing:.018em;
}

.chapter h3 span{
    letter-spacing:.012em;
}