/* ===== SHARED STYLES — Case + Referenzen Pages ===== */
*{box-sizing:border-box;margin:0;padding:0}
:root{
  --accent:#c800ff;--accent2:#0099ff;
  --dark:#0f0f0d;--muted:#7a7872;
  --border:rgba(15,15,13,.1);--red:#e04a2a;
  --bg:#faf8f4;--bg-card:rgba(255,253,249,.75);--bg-dark:#ede9e1;
  --grad:linear-gradient(90deg,var(--accent),var(--accent2));
}
html{scroll-behavior:smooth}
body{font-family:'DM Sans',sans-serif;background:var(--bg);color:var(--dark);overflow-x:hidden}
::selection{background:var(--accent);color:#fff}
a{color:inherit}

/* Background layers */
.bg-layer{position:fixed;inset:-50%;width:200%;height:200%;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");opacity:.035;pointer-events:none;z-index:1;mix-blend-mode:multiply}
.blob{position:fixed;border-radius:50%;filter:blur(100px);pointer-events:none;z-index:0;will-change:transform}
.blob-1{width:500px;height:500px;background:radial-gradient(circle,rgba(200,0,255,.12) 0%,transparent 70%);top:-100px;left:-100px;animation:fl1 22s ease-in-out infinite}
.blob-2{width:420px;height:420px;background:radial-gradient(circle,rgba(0,153,255,.09) 0%,transparent 70%);bottom:10%;right:-100px;animation:fl2 26s ease-in-out infinite}
.blob-3{width:360px;height:360px;background:radial-gradient(circle,rgba(200,0,255,.08) 0%,transparent 70%);top:55%;left:20%;animation:fl3 30s ease-in-out infinite}
@keyframes fl1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(60px,40px) scale(1.08)}}
@keyframes fl2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-40px,60px) scale(1.05)}}
@keyframes fl3{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(40px,-30px) scale(.95)}}

.lp{max-width:1240px;margin:0 auto;padding:0 2.5rem;position:relative;z-index:2}

/* Nav */
nav{padding:1.2rem 0;display:flex;justify-content:space-between;align-items:center;gap:1rem;border-bottom:0.5px solid var(--border);position:sticky;top:0;background:rgba(250,248,244,.85);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);z-index:50;transition:padding .25s}
nav.scrolled{padding:.8rem 0}
.logo{font-family:'Bebas Neue',sans-serif;font-size:1.8rem;letter-spacing:.04em;color:var(--dark);text-decoration:none;display:flex;align-items:baseline}
.logo span{background:var(--grad);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;background-size:200% 100%;animation:shimmer 8s linear infinite}
@keyframes shimmer{0%{background-position:0% 50%}100%{background-position:200% 50%}}
.nav-back{font-size:.78rem;color:var(--muted);letter-spacing:.08em;text-decoration:none;transition:color .2s,transform .2s;display:inline-flex;align-items:center;gap:.4rem;text-transform:uppercase}
.nav-back:hover{color:var(--dark)}
.nav-back:hover .arr{transform:translateX(-3px)}
.nav-back .arr{transition:transform .25s;display:inline-block}
.nav-cta{background:var(--accent);color:#fff;padding:.55rem 1.25rem;border-radius:2px;font-size:.75rem;font-weight:500;letter-spacing:.1em;text-decoration:none;text-transform:uppercase;transition:transform .25s,box-shadow .25s;white-space:nowrap}
.nav-cta:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(200,0,255,.3)}

/* Typography */
.sec-tag{font-size:.64rem;letter-spacing:.22em;color:var(--muted);text-transform:uppercase;margin-bottom:1.25rem;display:flex;align-items:center;gap:.6rem}
.sec-tag::before{content:'';display:block;width:1.4rem;height:0.5px;background:var(--muted)}
h1{font-family:'Bebas Neue',sans-serif;font-size:clamp(3.5rem,8vw,8rem);line-height:.93;letter-spacing:.02em;margin-bottom:1.25rem;color:var(--dark)}
h1 em, h2 em{font-family:'DM Serif Display',serif;font-style:italic;background:var(--grad);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;background-size:200% 100%;animation:shimmer 10s linear infinite}
h2{font-family:'Bebas Neue',sans-serif;font-size:clamp(2rem,4.5vw,4rem);line-height:1;letter-spacing:.03em;margin-bottom:1.5rem;color:var(--dark)}

/* Reveal */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}
.reveal.d1{transition-delay:.08s}.reveal.d2{transition-delay:.16s}.reveal.d3{transition-delay:.24s}.reveal.d4{transition-delay:.32s}.reveal.d5{transition-delay:.4s}

/* Placeholder tiles (shared aesthetic with homepage) */
.ph-tile{position:relative;overflow:hidden;background:linear-gradient(135deg,#e8e4dc,#d6d0c4);border:0.5px solid var(--border);border-radius:2px}
.ph-tile::before{content:'';position:absolute;inset:0;background:
  radial-gradient(circle at 30% 30%,rgba(200,0,255,.15),transparent 60%),
  radial-gradient(circle at 70% 70%,rgba(0,153,255,.12),transparent 60%);
  transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.ph-tile:hover::before{transform:scale(1.1)}
.ph-tile .label{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:.62rem;color:var(--muted);letter-spacing:.14em;text-transform:uppercase;font-weight:500}

/* CTA buttons */
.cta-primary{background:var(--dark);color:#fff;padding:1rem 2rem;border-radius:2px;font-size:.8rem;font-weight:500;letter-spacing:.1em;cursor:pointer;transition:all .3s;display:inline-flex;align-items:center;gap:.5rem;text-decoration:none;text-transform:uppercase;position:relative;overflow:hidden}
.cta-primary::before{content:'';position:absolute;inset:0;background:var(--grad);transform:translateX(-101%);transition:transform .4s cubic-bezier(.5,0,.2,1);z-index:0}
.cta-primary span{position:relative;z-index:1;display:inline-flex;align-items:center;gap:.5rem}
.cta-primary:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(15,15,13,.15)}
.cta-primary:hover::before{transform:translateX(0)}
.cta-primary .arr{transition:transform .3s}
.cta-primary:hover .arr{transform:translateX(4px)}
.btn-ghost{color:var(--muted);font-size:.78rem;letter-spacing:.1em;cursor:pointer;border-bottom:0.5px solid var(--border);padding-bottom:.2rem;transition:color .2s,border-color .2s;text-decoration:none;text-transform:uppercase;display:inline-flex;align-items:center;gap:.3rem}
.btn-ghost:hover{color:var(--accent);border-color:var(--accent)}

/* Footer */
footer{border-top:0.5px solid var(--border);padding:2.5rem 0;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}
footer p{font-size:.75rem;color:var(--muted);letter-spacing:.04em}

/* Responsive */
@media(min-width:901px) and (max-width:1280px){
  .lp{max-width:960px;padding:0 2rem}
}
@media(max-width:900px){
  .lp{max-width:100%;padding:0 1.5rem}
  .nav-back{display:none}
}
@media(max-width:480px){
  .lp{padding:0 1rem}
  h1{font-size:3rem}
  h2{font-size:2rem}
}
