/* ZAB Studio v9 · Magische Welt (hell bis Nacht) – baut auf styles.css auf */
html.v9{--serif2:'Italiana','Instrument Serif',Georgia,serif;--serif3:'Cormorant Garamond','Instrument Serif',Georgia,serif;background:#0B1424}
.v9 #themeBtn,.v9 #world{display:none!important}

/* ---------- Himmel ---------- */
#sky{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:linear-gradient(180deg,#9ec3e6,#f3e2c6)}
.sky__imgs img{position:absolute;inset:-3%;width:106%;height:106%;object-fit:cover;opacity:0;filter:saturate(1.04) blur(.3px);will-change:opacity,transform;animation:drift9 38s ease-in-out infinite alternate}
.sky__imgs img:nth-child(2){animation-duration:52s}
.sky__imgs img:nth-child(4){animation-duration:30s}
@keyframes drift9{from{transform:scale(1) translate3d(0,0,0)}to{transform:scale(1.06) translate3d(-1.2%,-.8%,0)}}
.sky__tint,.sky__fx,.sky__grid,.sky__scrim,.sky__paper{position:absolute;inset:0;width:100%;height:100%}
.sky__grid{opacity:0;transition:opacity .2s}
.sky__grid line,.sky__grid circle{fill:none;stroke:rgba(255,255,255,.42);stroke-width:.7;vector-effect:non-scaling-stroke}
.sky__grid circle{stroke:rgba(255,255,255,.26)}
.sky__grid .st{fill:#fff;filter:drop-shadow(0 0 6px rgba(255,255,255,.95)) drop-shadow(0 0 14px rgba(255,236,200,.7))}
.sky__scrim{background:rgb(var(--scrim));opacity:0}
.sky__paper{background:var(--grain);opacity:.16;mix-blend-mode:soft-light}
.sky__paper::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 90% at 50% 45%,transparent 55%,rgba(10,16,30,.28))}
/* die eine Blume */
.sky__mark{position:absolute;width:calc(300px*var(--ms,1));height:calc(300px*var(--ms,1));margin:calc(-150px*var(--ms,1)) 0 0 calc(-150px*var(--ms,1));opacity:0;mix-blend-mode:screen;
  background:radial-gradient(circle,rgba(255,250,232,1) 0,rgba(255,226,170,.75) 9%,rgba(255,190,110,.32) 26%,rgba(255,170,80,.1) 45%,transparent 66%);transform:scale(calc(.6 + var(--g,0)*.6));animation:pulse9 3.6s ease-in-out infinite}
.sky__mark i{position:absolute;left:50%;bottom:48%;width:38%;height:calc(var(--g,0)*1000%);transform:translateX(-50%);border-radius:50% 50% 0 0;filter:blur(16px);background:linear-gradient(0deg,rgba(255,232,180,.85),rgba(255,226,170,.25) 50%,transparent 90%)}
@keyframes pulse9{50%{filter:brightness(1.18)}}

/* ---------- Schrift: elegante Titel mit Glow (Ref. Simplicity) ---------- */
.v9 h2,.v9 .claim__txt,.v9 .stand__h,.v9 .ttl__pre,.v9 .rot__txt,.v9 .scard h2,.v9 .about2__h{font-family:var(--serif2);font-weight:400;letter-spacing:-.01em}
.v9 h2{font-size:clamp(40px,5.2vw,84px);line-height:1.04}
.v9 h2 em,.v9 .claim__txt em,.v9 .stand__h em,.v9 .rot__col span,.v9 h3 em,.v9 .tile .nm em,.v9 .pcard em{font-family:var(--serif3);font-style:italic;font-weight:400;letter-spacing:-.01em}
.v9 h2,.v9 .claim__txt,.v9 .stand__h{text-shadow:0 0 28px rgba(255,255,255,.28),0 2px 24px rgba(var(--scrim),.45)}
.v9 h2 em,.v9 .scard h2 em{color:#FFD9A0;text-shadow:0 0 18px rgba(255,214,150,.6),0 0 46px rgba(255,170,90,.3)}
[data-theme="light"].v9 h2,[data-theme="light"] .v9 h2{color:#14223b}
[data-theme="light"].v9 h2 em{color:#B65F22;text-shadow:0 0 22px rgba(255,255,255,.9),0 0 40px rgba(255,214,150,.5)}
.v9 .ttl__pre{font-size:clamp(30px,3.6vw,54px);letter-spacing:.01em;color:#E6ECF3;text-shadow:0 0 24px rgba(255,255,255,.35)}
.v9 .label{letter-spacing:.2em}

/* ---------- Satz aus dem Ordner ---------- */
.v9 .claim__txt{font-size:clamp(38px,5.6vw,92px);line-height:1.02}
[data-theme="light"].v9 .claim__txt{color:#14223b;background:rgba(255,255,255,.34)!important;border-color:rgba(255,255,255,.7)!important;text-shadow:0 0 30px rgba(255,255,255,.8)}
[data-theme="light"].v9 .claim__txt em{color:#B65F22;text-shadow:0 0 24px rgba(255,255,255,.9),0 0 50px rgba(255,200,130,.6)}

/* ---------- Kapitel 01: Text + Bild in einer Karte ---------- */
.v9 .rot{height:380vh}
.v9 .rot__stick{display:flex!important;flex-direction:column;justify-content:center;align-items:center;gap:14px;padding:84px clamp(12px,3vw,40px) 20px}
.v9 .rot__lbl{align-self:flex-start;margin-left:max(0px,calc((100% - 1320px)/2))}
.v9 .rot__card{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);gap:clamp(14px,2.4vw,34px);width:min(1320px,100%);height:min(76svh,740px);padding:clamp(14px,1.6vw,22px);border-radius:38px;transform:none!important}
.v9 .rot__left{justify-content:center;padding:clamp(10px,2.4vw,40px);gap:22px}
.v9 .rot__card .rot__panel{background:none!important;border:0!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;padding:0!important}
.v9 .rot__card .rot__panel::before,.v9 .rot__card .rot__panel::after,.v9 .rot__card .rot__panel>.glare{display:none}
.v9 .rot__txt{font-size:clamp(46px,5.2vw,92px);line-height:1.04}
.v9 .rot__lead{background:none!important;border:0!important;backdrop-filter:none!important;padding:0!important;color:var(--text2)!important;font-size:17px;max-width:440px}
.v9 .rot__right{height:100%!important;border-radius:26px;box-shadow:0 20px 50px rgba(11,18,32,.18)}
[data-theme="light"].v9 .rot__card{background:linear-gradient(145deg,rgba(255,255,255,.62),rgba(255,255,255,.36))!important;border-color:rgba(255,255,255,.75)!important}
@media (max-width:1000px){
  .v9 .rot__card{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);height:min(80svh,760px)}
  .v9 .rot__left{padding:6px 8px 0;gap:10px}
  .v9 .rot__lead,.v9 .rot .dots,.v9 .rot__lbl{display:none}
  .v9 .rot__txt{font-size:clamp(38px,10vw,56px)}
}

/* ---------- umlaufender Lichtrand (glara.ai) ---------- */
@property --ra{syntax:'<angle>';inherits:false;initial-value:0deg}
.ringb{position:absolute;inset:-1px;border-radius:inherit;padding:1.5px;pointer-events:none;z-index:6;
  background:conic-gradient(from var(--ra),transparent 0 66%,rgba(255,226,170,.95) 80%,rgba(143,180,218,.8) 90%,transparent 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);animation:ra9 7s linear infinite}
@keyframes ra9{to{--ra:360deg}}

/* ---------- abheben ---------- */
.v9 .stand__h em{font-size:1.18em;display:block;line-height:1;color:#FFE7BE;background:none;-webkit-text-fill-color:currentColor;text-shadow:0 0 30px rgba(255,214,150,.75),0 0 70px rgba(255,170,90,.45)}
.v9 .stand__pre,.v9 .stand__post{font-family:var(--sans);font-weight:300;letter-spacing:-.01em}
.v9 .stand__stick::before{background:linear-gradient(90deg,rgba(7,11,20,.5) 0%,rgba(7,11,20,.18) 38%,transparent 60%)}

/* ---------- Ablauf: Linie verbindet 1 → 4 ---------- */
.v9 .steps svg{top:44px}
.v9 .steps svg path{stroke-width:2}

/* ---------- Glas im Hellen wie glara: weiß, feiner Rand, weicher Schatten ---------- */
[data-theme="light"].v9 .glass{background:linear-gradient(145deg,rgba(255,255,255,.66),rgba(255,255,255,.4))!important;border-color:rgba(255,255,255,.8)!important;box-shadow:inset 0 1px 0 #fff,0 24px 48px -24px rgba(41,37,36,.22)}
[data-theme="light"].v9 .nav{background:rgba(255,255,255,.55)}
/* Feinschliff */
html.v9 .rot__card .rot__panel.glass,[data-theme="light"].v9 .rot__card .rot__panel.glass{background:none!important;border:0!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.v9 .tear>img{object-position:50% 70%}
.v9 .tear .paperedge path{fill:#0B1424;opacity:.92}
[data-theme="light"].v9 .rot__lbl{color:#14223b;opacity:.75}
.sky__imgs img{max-width:none}
