/* AUREUM PRIME — premium, mobile-first */
:root{
  --bg:#000; --ink:#EEF2F7; --muted:#9FB0C2; --line:#1D2430;
  --accent:#A6FF2A; --accent2:#0A84FF;
  --glass:rgba(255,255,255,.06);
}
*{box-sizing:border-box} html,body{margin:0;height:100%}
html{scroll-behavior:smooth}
body{font:16px/1.65 'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;background:#000;color:var(--ink);-webkit-font-smoothing:antialiased}

.wrap{max-width:1120px;margin:0 auto;padding:24px 16px}
.center{text-align:center}

.prime-hero{position:relative;overflow:hidden;border-bottom:1px solid var(--line)}
.prime-hero .bg{position:absolute;inset:-30% -20% -10% -20%;
  background:
    radial-gradient(900px 450px at 50% -10%, rgba(166,255,42,.40), transparent 60%),
    radial-gradient(1000px 600px at 10% 20%, rgba(10,132,255,.22), transparent 60%);
  filter:blur(22px);opacity:.95}
.logo{width:min(44vw,240px);margin:34px auto 6px;display:block;filter:drop-shadow(0 10px 34px rgba(166,255,42,.32))}
h1{font-size:40px;line-height:1.1;margin:6px 0 6px;text-align:center}
.lead{color:#C9D1DC;text-align:center;margin:0 0 14px}
.cta-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-width:820px;margin:10px auto}
.gbtn{display:flex;align-items:center;justify-content:center;padding:12px;border-radius:16px;background:var(--glass);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(16px) saturate(140%);color:#fff;text-decoration:none;font-weight:600}
.trust{text-align:center;color:#C2C9D3;margin:8px 0 10px;font-weight:600}

.tabs{position:sticky;bottom:0;left:0;right:0;display:grid;grid-template-columns:repeat(4,1fr);gap:8px;background:rgba(0,0,0,.6);backdrop-filter:blur(10px);border-top:1px solid var(--line);padding:8px 12px}
.tab{display:block;text-align:center;padding:10px;border-radius:12px;color:#E6ECF5;text-decoration:none;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12)}
.tab.active{background:rgba(255,255,255,.10)}

.section{border-top:1px solid var(--line);background:rgba(255,255,255,.02)}
.section.alt{background:rgba(255,255,255,.04)}
h2{margin:0 0 10px}
.grid{display:grid;gap:12px}
.features{grid-template-columns:1fr}
.cards{grid-template-columns:1fr}
.card{padding:16px;border-radius:14px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04)}
.tiers{grid-template-columns:1fr}
.price{padding:16px;border-radius:14px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04)}
.price header{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.amt{font-size:24px;background:linear-gradient(90deg,var(--accent),var(--accent2));-webkit-background-clip:text;background-clip:text;color:transparent}
.pf{margin:6px 0 0 18px;color:#C9D1DC}
.pf li{margin:4px 0}
.steps{margin:0 0 0 18px;color:#C9D1DC}
details{border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);border-radius:12px;padding:10px;margin:8px 0}
details>summary{cursor:pointer;font-weight:600}
.form{display:grid;gap:10px;max-width:520px;margin:0 auto}
.form input,.form textarea{padding:12px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);color:#fff}
.btn{padding:12px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.16);background:linear-gradient(90deg, rgba(255,255,255,.12), rgba(255,255,255,.06));color:#fff}
.meta{color:var(--muted);text-align:center}
.links{text-align:center}
.links a{color:inherit}
.foot{border-top:1px solid var(--line);background:rgba(255,255,255,.02)}
.foot-inner{display:flex;justify-content:space-between;gap:10px;align-items:center}

@media (min-width:768px){
  h1{font-size:56px}
  .features{grid-template-columns:repeat(3,1fr)}
  .cards{grid-template-columns:repeat(3,1fr)}
  .tiers{grid-template-columns:repeat(3,1fr)}
}

.logo{width:min(52vw,280px)!important}

.trust{background:linear-gradient(90deg,var(--accent),var(--accent2));-webkit-background-clip:text;background-clip:text;color:transparent!important}

/* Swipe carousel for Leistungen */
.swiper{display:grid;grid-auto-flow:column;grid-auto-columns:100%;overflow-x:auto;scroll-snap-type:x mandatory;gap:10px;padding-bottom:6px}
.swiper::-webkit-scrollbar{display:none}
.slide{scroll-snap-align:start;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04);border-radius:14px;padding:16px;min-height:120px}
.dots{display:flex;gap:6px;justify-content:center;margin-top:6px}
.dots button{width:8px;height:8px;border-radius:50%;border:0;background:#3a4353;opacity:.8}
.dots button.active{background:#8fd94a}

/* Arbeiten spotlight */
.pills{display:flex;gap:8px;flex-wrap:wrap}
.pill{padding:8px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.05);color:#fff}
.pill.active{background:rgba(255,255,255,.12)}
.spot{margin-top:10px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04);border-radius:14px;padding:16px}

/* Prozess: richer feel */
.steps.pro li{margin:6px 0}

/* Kontakt right-aligned */
.form label{text-align:right;display:grid;gap:6px}
.form input,.form textarea{text-align:right}

/* v3 tweaks: bigger logo + tighter hero spacing */
.logo{width:min(60vw,340px)!important; margin-bottom:4px!important}
.prime-hero h1{margin-top:2px!important}

/* Kontakt labels centered + gradient like prices */
.form label{display:grid;gap:6px;justify-items:center}
.form .lbl{background:linear-gradient(90deg,var(--accent),var(--accent2));-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:600;text-align:center}
.form input,.form textarea{text-align:right}

/* Hero background override */
.prime-hero .bg{
  position:absolute;inset:-30% -20% -10% -20%;
  background:
    radial-gradient(1100px 520px at 50% -12%, rgba(166,255,42,.55), transparent 60%),
    radial-gradient(1200px 700px at 12% 18%, rgba(166,255,42,.25), transparent 60%),
    radial-gradient(1000px 600px at 10% 22%, rgba(10,132,255,.20), transparent 60%);
  filter:blur(20px);opacity:.98
}

/* v4 hero adjustments */
.prime-hero .wrap{padding-top:16px !important; padding-bottom:12px !important}
.logo{display:block !important; margin:18px auto 4px !important}

/* v4 contact alignment & color */
.form label{justify-items:start !important; text-align:left !important}
.form .lbl{background:none !important; -webkit-background-clip:initial !important; background-clip:initial !important; color:#EEF2F7 !important; text-align:left !important; font-weight:600}
.form input,.form textarea{text-align:left !important}
