/* 78 Arc · helles Design (Papierton wie die Postkarte)
   Wird nach dem Seiten-CSS geladen und überschreibt nur Farben, Flächen und Schatten.
   Zum Zurückschalten auf dunkel: <link ... hell.css> aus den Seiten entfernen. */

:root{
  --ink:#2a1446; --text:#3d2c58; --muted:#5b4a75; --line:rgba(42,20,70,.12);
  --cyan:#286f81; --violet:#7a3fa8; --pink:#a8456f; --gold:#a8762e;
  --glass:#fbf8f3; --glassline:rgba(42,20,70,.12);
  --bg:#f3ede4; --ok:#2f7a55; --no:#a8456f;
  --shadow:0 24px 48px -16px rgba(42,20,70,.30);
}

body{background:var(--bg); color:var(--ink); -webkit-font-smoothing:antialiased;}
a{color:var(--violet);}
a:hover{color:var(--ink);}

/* Hintergrund: Papier mit leisen Farbschimmern statt Blue Dream */
.bg-mesh,
body::before{
  background:
    radial-gradient(1400px 900px at 50% -10%, rgba(122,63,168,.07), transparent 60%),
    radial-gradient(1100px 800px at 95% 30%, rgba(176,74,127,.05), transparent 60%),
    radial-gradient(1100px 800px at 0% 65%, rgba(40,111,129,.05), transparent 60%),
    #f3ede4 !important;
  filter:none !important;
}
.bg-noise, body::after{opacity:.35 !important;}

::-webkit-scrollbar-track{background:#ece5da;}
::-webkit-scrollbar-thumb{background:linear-gradient(var(--violet),var(--gold));}

/* Navigation */
.nav{
  background:rgba(251,248,243,.86);
  border:1px solid rgba(42,20,70,.10);
  box-shadow:0 10px 30px rgba(42,20,70,.10);
}
.nav .brand, .nav .brand:hover{color:var(--ink);}
.nav .brand img{box-shadow:0 4px 12px rgba(42,20,70,.18);}
.nav .links a{color:var(--muted);}
.nav .links a:hover{color:var(--ink);}
.nav .links a::after{background:linear-gradient(90deg,var(--violet),var(--gold));}

/* Hero */
.hero-glow{background:radial-gradient(circle, rgba(122,63,168,.08) 0%, transparent 60%);}
.kicker{color:var(--violet); background:#fbf8f3; border-color:rgba(122,63,168,.22);}
.grad-text, .grad{
  background:linear-gradient(100deg, #286f81 0%, #7a3fa8 50%, #b04a7f 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero .tag{color:var(--ink); opacity:1;}
.hero p.lead{color:var(--text);}
.hero p.triad{color:var(--muted); opacity:1;}
.soon{color:var(--muted);}
.soon::before{color:var(--gold);}

/* Store-Buttons: dunkel auf Papier */
.store{
  background:#2a1446; border:1px solid #2a1446; color:#f7f2ea;
  backdrop-filter:none;
}
.store::before{background:linear-gradient(120deg, transparent, rgba(255,255,255,.12), transparent);}
.store:hover{color:#ffffff; border-color:#2a1446; box-shadow:0 12px 24px rgba(42,20,70,.25);}
.store .l small{color:#d9cfe6;}

/* Handy-Rahmen bleiben dunkel, Schatten weicher */
.stage::before{background:radial-gradient(circle, rgba(122,63,168,.20), rgba(122,63,168,0) 70%);}
.phone, .tm-phone{
  background:linear-gradient(160deg,#3a2a5c,#140a24 60%);
  box-shadow:0 40px 80px rgba(42,20,70,.28), 0 0 0 1px rgba(42,20,70,.18), inset 0 0 0 3px rgba(0,0,0,.45);
}

/* Abschnitte */
.eyebrow{color:var(--violet);}
.sub{color:var(--muted);}

/* Funktionskacheln */
.feature{background:#fbf8f3; backdrop-filter:none; box-shadow:0 1px 0 rgba(42,20,70,.04);}
.feature::before{background:linear-gradient(135deg, rgba(42,20,70,.14), rgba(42,20,70,.06));}
.feature:hover::before{background:linear-gradient(135deg, var(--violet), var(--gold));}
.feature::after{background:radial-gradient(circle, rgba(122,63,168,.08), transparent 50%);}
.feature:hover{box-shadow:0 18px 36px -18px rgba(42,20,70,.30);}
.feature .ic{background:linear-gradient(135deg, rgba(40,111,129,.12), rgba(122,63,168,.12)); border-color:rgba(122,63,168,.18);}
.feature .ic svg{stroke:var(--violet);}
.feature p{color:var(--text);}

/* Galerie */
.shot img{border-color:rgba(42,20,70,.14); box-shadow:var(--shadow); background:#140a24;}
.shot figcaption{color:var(--muted);}

/* Preise */
.price-card{background:#fbf8f3; backdrop-filter:none; box-shadow:0 1px 0 rgba(42,20,70,.04);}
.price-card::before{background:radial-gradient(circle, rgba(122,63,168,.07), transparent 70%);}
.pill{background:#ffffff; border-color:rgba(42,20,70,.12);}
.pill:hover{border-color:var(--violet); background:#ffffff;}
a.pill, a.pill:hover{color:var(--ink);}
.pill .per{color:var(--muted);}

/* Editionen-Teaser (Ohana-Gold dunkler, damit es auf Papier lesbar bleibt) */
.edition-card{background:#fbf8f3; color:var(--ink); backdrop-filter:none;}
.edition-card::before{background:radial-gradient(circle, rgba(176,74,127,.08), transparent 70%);}
.edition-card:hover{border-color:rgba(168,118,46,.55); box-shadow:0 20px 40px -16px rgba(42,20,70,.25); color:var(--ink);}
.edition-card img{box-shadow:0 8px 20px rgba(42,20,70,.20);}
.edition-card h3 span, .edition-card .go{color:var(--gold);}
.edition-card p{color:var(--text);}

/* Leitfragen-Seite */
.lead, .q p, .faq p, .fit .alt{color:var(--text);}
.note{background:#fbf8f3; color:var(--text); backdrop-filter:none;}
.q{background:#fbf8f3; backdrop-filter:none;}
.q-img img{border-color:rgba(42,20,70,.14); box-shadow:0 24px 48px -16px rgba(42,20,70,.30);}
.check{background:#fbf8f3; backdrop-filter:none;}
.fit div{background:#fbf8f3; backdrop-filter:none;}

/* Rechtstexte */
.legal-body p{color:var(--text);}

/* Lightbox: heller Blur statt Abdunkeln */
.lightbox{background:rgba(243,237,228,.62); backdrop-filter:blur(18px) saturate(120%); -webkit-backdrop-filter:blur(18px) saturate(120%);}
.lightbox img{border-color:rgba(42,20,70,.14); box-shadow:0 30px 70px rgba(42,20,70,.35);}
.lb-close, .lb-nav{background:rgba(251,248,243,.92); border-color:rgba(42,20,70,.18); color:#2a1446; box-shadow:0 6px 16px rgba(42,20,70,.12);}
.lb-close:hover, .lb-nav:hover{background:#ffffff;}

/* Footer */
footer{color:var(--muted);}
footer a{color:var(--muted);}
footer a:hover{color:var(--ink);}

/* ===== Wärme: Apricot, Rosé und Gold als zweite Farbebene ===== */
:root{ --apricot:#e3976a; --rose:#c86f86; --amber:#c47a32; --warm-paper:#f5ebdf; }

body{background:var(--warm-paper);}
.bg-mesh,
body::before{
  background:
    radial-gradient(1100px 760px at 8% -6%, rgba(227,151,106,.20), transparent 62%),
    radial-gradient(1000px 800px at 100% 18%, rgba(200,111,134,.13), transparent 60%),
    radial-gradient(1200px 900px at 50% 105%, rgba(212,168,92,.16), transparent 62%),
    radial-gradient(900px 700px at 0% 70%, rgba(122,63,168,.06), transparent 60%),
    #f5ebdf !important;
}

/* Akzentfarbe in Überschrift und Kicker */
.grad-text, .grad{background:linear-gradient(100deg, #7a3fa8 0%, #b04a7f 48%, #c47a32 100%); -webkit-background-clip:text; background-clip:text; color:transparent;}
.kicker{background:linear-gradient(90deg, #fdf6ee, #f9ecef); border-color:rgba(196,122,50,.30); color:#8a3f78;}
.eyebrow::before{content:'✦'; color:var(--amber); margin-right:.6em; letter-spacing:0;}

/* Glühen hinter dem Handy: warm statt kühl */
.hero-glow{background:radial-gradient(circle, rgba(227,151,106,.16) 0%, transparent 60%);}
.stage::before{background:radial-gradient(circle, rgba(227,151,106,.34), rgba(200,111,134,.16) 45%, rgba(122,63,168,0) 72%);}

/* Navigation und Buttons */
.nav{background:rgba(253,247,240,.86); border-color:rgba(196,122,50,.16);}
.nav .links a::after{background:linear-gradient(90deg, var(--rose), var(--amber));}
.store{background:linear-gradient(135deg, #43205f 0%, #2a1446 70%); border-color:#2a1446;}
.store:hover{box-shadow:0 14px 28px -8px rgba(122,40,80,.35);}

/* Kacheln mit leichtem Verlauf */
.feature{background:linear-gradient(160deg, #fffaf4 0%, #f8ede4 100%);}
.feature:hover::before{background:linear-gradient(135deg, var(--rose), var(--amber));}
.feature::after{background:radial-gradient(circle, rgba(227,151,106,.12), transparent 50%);}
.feature .ic{background:linear-gradient(135deg, rgba(227,151,106,.22), rgba(200,111,134,.16)); border-color:rgba(196,122,50,.22);}
.feature .ic svg{stroke:#9a3f6e;}

/* Ratgeber-Kachel */
.guide-card{background:linear-gradient(110deg, #fff8f0 0%, #f9e9e6 100%); border-color:rgba(196,122,50,.22);}
.guide-card:hover{border-color:var(--amber);}

/* Preise */
.price-card{background:linear-gradient(150deg, #fffaf4 0%, #f7e8e0 100%);}
.price-card::before{background:radial-gradient(circle, rgba(227,151,106,.16), transparent 70%);}
.pill{background:#fffdf9;}
.pill:hover{border-color:var(--amber);}

/* Editionen-Teaser */
.edition-card{background:linear-gradient(150deg, #fffaf4 0%, #f7e6e6 100%);}

/* Ratgeber-Seite und Rechtstexte */
.q, .check, .fit div, .note{background:linear-gradient(160deg, #fffaf4 0%, #f8ede4 100%);}

/* Galerie und Lightbox */
.lightbox{background:rgba(245,235,223,.62);}

/* Footer mit warmer Linie */
footer{border-top:1px solid transparent; border-image:linear-gradient(90deg, transparent, rgba(196,122,50,.35), rgba(200,111,134,.30), transparent) 1;}

::-webkit-scrollbar-thumb{background:linear-gradient(var(--rose),var(--amber));}

/* Schmalere Handy-Rahmen, Kamera-Insel auch bei der Tiefen-Matrix */
.phone, .tm-phone{padding:4px; border-radius:40px;}
.reel, .tm-screen{border-radius:36px;}
.island{top:11px; width:88px; height:25px;}
