
:root {
  --bg-body: #050816;
  --bg-elevated: #0b1020;
  --bg-elevated-soft: #111729;
  --accent: #22c55e;
  --accent-soft: rgba(34, 197, 94, 0.15);
  --accent-strong: #16a34a;
  --text-main: #f9fafb;
  --text-muted: #9ca3af;
  --border-subtle: rgba(148, 163, 184, 0.28);
  --radius-xl: 1.5rem;
  --radius-lg: 1rem;
  --radius-pill: 999px;
  --shadow-soft: 0 22px 60px rgba(0,0,0,0.65);
  --container-width: 1120px;
  --transition-fast: 0.18s ease-out;
  --transition-med: 0.25s ease-out;
}

*,
*::before,
*::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter", sans-serif;
  background: radial-gradient(circle at top, #1e293b 0, #020617 50%, #000 100%);
  color: var(--text-main);
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }

main { min-height: 100vh; }

.container {
  max-width: var(--container-width);
  margin: 0 auto;
  padding: 0 1.5rem;
}

.section { padding: 5rem 0 4rem; }

.section-header { margin-bottom: 2.4rem; }

.kicker {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .2rem .9rem;
  border-radius: var(--radius-pill);
  border: 1px solid var(--border-subtle);
  background: rgba(15,23,42,.96);
  color: var(--accent);
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .16em;
}
.kicker-dot {
  width: 6px;height: 6px;border-radius: 999px;
  background: var(--accent);
}
.section-title {
  font-size: clamp(1.9rem, 1.6rem + 1vw, 2.4rem);
  letter-spacing: -0.03em;
  margin: .8rem 0 .4rem;
}
.section-lead {
  margin: 0;
  max-width: 36rem;
  color: var(--text-muted);
}

/* Header */
.site-header {
  position: sticky;
  top: 0;
  z-index: 40;
  backdrop-filter: blur(14px);
  background: linear-gradient(to bottom, rgba(2,6,23,.96), rgba(2,6,23,.86), transparent);
  border-bottom: 1px solid rgba(148,163,184,.18);
}
.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .65rem 1.5rem;
  max-width: var(--container-width);
  margin: 0 auto;
}
.brand {
  display:flex;
  align-items:center;
  gap:.7rem;
}
.brand-logo {
  width:40px;height:40px;
  border-radius:.9rem;
  overflow:hidden;
  border:1px solid rgba(15,23,42,.9);
  box-shadow:0 10px 25px rgba(0,0,0,.5);
  background:#020617;
}
.brand-text { display:flex;flex-direction:column; }
.brand-text span:first-child {
  font-weight:650;
  font-size:.98rem;
  letter-spacing:.08em;
}
.brand-text span:last-child {
  font-size:.78rem;
  color:var(--text-muted);
}

.nav { display:flex;align-items:center;gap:1.4rem; }
.nav a {
  font-size:.85rem;
  color:var(--text-muted);
  position:relative;
  padding-bottom:.15rem;
}
.nav a::after {
  content:"";
  position:absolute;
  left:0;bottom:0;
  width:0;height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,var(--accent),var(--accent-strong));
  transition:width var(--transition-med);
}
.nav a:hover { color:var(--text-main); }
.nav a:hover::after { width:100%; }

.chip-cta {
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  padding:.35rem .9rem;
  border-radius:999px;
  border:1px solid var(--accent-soft);
  background:radial-gradient(circle at top left, rgba(34,197,94,.18), rgba(15,23,42,.96));
  font-size:.8rem;
}
.chip-cta-icon {
  width:9px;height:9px;border-radius:999px;
  background:var(--accent);
  box-shadow:0 0 0 6px rgba(34,197,94,.3);
}

.burger {
  display:none;
  width:38px;height:38px;
  border-radius:999px;
  border:1px solid var(--border-subtle);
  background:rgba(15,23,42,.9);
  align-items:center;justify-content:center;
}
.burger span,
.burger span::before,
.burger span::after {
  display:block;
  width:18px;height:2px;
  border-radius:999px;
  background:#e5e7eb;
  position:relative;
  transition:transform .2s ease,opacity .2s ease;
}
.burger span::before,
.burger span::after {
  content:"";
  position:absolute;left:0;
}
.burger span::before { top:-5px; }
.burger span::after { top:5px; }
.burger.is-open span { transform:rotate(45deg); }
.burger.is-open span::before { transform:rotate(-90deg) translateX(-5px); }
.burger.is-open span::after { opacity:0; }

.mobile-nav {
  display:none;
  flex-direction:column;
  gap:.5rem;
  padding:0 1.5rem .75rem;
  max-width:var(--container-width);
  margin:0 auto;
}
.mobile-nav a {
  font-size:.9rem;
  color:var(--text-muted);
  padding:.3rem 0;
}

/* Hero */

.hero { padding:4.2rem 0 4.5rem; }
.hero-grid {
  display:grid;
  grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);
  gap:3rem;
  align-items:center;
}
.hero-title {
  font-size:clamp(2.4rem,2rem + 1.6vw,3.1rem);
  line-height:1.05;
  letter-spacing:-.04em;
  margin:0 0 .7rem;
}
.hero-title .hero-highlight {
  background:linear-gradient(120deg,#22c55e,#a3e635);
  -webkit-background-clip:text;
  color:transparent;
}
.hero-lead {
  margin:0;
  max-width:32rem;
  font-size:.98rem;
  color:var(--text-muted);
}
.hero-ctas {
  display:flex;
  flex-wrap:wrap;
  gap:.9rem;
  margin-top:1.8rem;
}
.btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.4rem;
  padding:.72rem 1.4rem;
  border-radius:var(--radius-pill);
  border:1px solid transparent;
  font-size:.9rem;
  cursor:pointer;
  transition:transform var(--transition-fast),box-shadow var(--transition-fast),background var(--transition-fast),border-color var(--transition-fast);
}
.btn-primary {
  background:linear-gradient(135deg,var(--accent),var(--accent-strong));
  color:#022c16;
  box-shadow:0 18px 45px rgba(34,197,94,.45);
}
.btn-primary:hover {
  transform:translateY(-1px);
  box-shadow:0 22px 60px rgba(34,197,94,.65);
}
.btn-ghost {
  border-color:var(--border-subtle);
  background:rgba(15,23,42,.9);
  color:var(--text-main);
}
.btn-ghost:hover {
  border-color:rgba(148,163,184,.6);
  background:rgba(15,23,42,1);
}
.hero-meta {
  display:flex;
  flex-wrap:wrap;
  gap:1.4rem;
  margin-top:2rem;
  font-size:.78rem;
  color:var(--text-muted);
}
.hero-badge {
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  padding:.35rem .8rem;
  border-radius:999px;
  border:1px solid var(--border-subtle);
  background:rgba(15,23,42,.9);
}
.hero-badge-dot {
  width:8px;height:8px;border-radius:999px;
  background:var(--accent);
}

.hero-card {
  border-radius:var(--radius-xl);
  border:1px solid var(--border-subtle);
  background:radial-gradient(circle at top left, rgba(34,197,94,.25), rgba(15,23,42,.98));
  box-shadow:var(--shadow-soft);
  padding:1.4rem;
  overflow:hidden;
}
.hero-card-tag {
  font-size:.78rem;
  text-transform:uppercase;
  letter-spacing:.15em;
  color:var(--text-muted);
}
.hero-card-main { margin-top:.6rem; }
.hero-card-headline {
  font-size:1.05rem;
  font-weight:600;
}
.hero-card-metrics {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.9rem;
  margin-top:.9rem;
}
.hero-metric {
  padding:.6rem .7rem;
  border-radius:.9rem;
  background:rgba(15,23,42,.8);
  border:1px solid rgba(148,163,184,.35);
}
.hero-metric-label {
  font-size:.72rem;
  color:var(--text-muted);
}
.hero-metric-value { font-size:.96rem;margin-top:.2rem; }
.hero-card-footnote {
  margin-top:.8rem;
  font-size:.75rem;
  color:var(--text-muted);
}
.hero-card-visual {
  margin-top:1rem;
  border-radius:var(--radius-lg);
  overflow:hidden;
  border:1px solid rgba(15,23,42,.9);
}

/* Services */
.services-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1.5rem;
}
.service-card {
  border-radius:var(--radius-xl);
  background:radial-gradient(circle at top left, rgba(34,197,94,.1), rgba(15,23,42,.97));
  border:1px solid var(--border-subtle);
  padding:1.4rem;
  display:flex;
  flex-direction:column;
  gap:.8rem;
}
.service-pill {
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.15em;
  color:var(--accent);
}
.service-title { margin:0;font-size:1.05rem; }
.service-body {
  margin:0;
  color:var(--text-muted);
  font-size:.9rem;
}
.service-meta {
  margin-top:auto;
  font-size:.8rem;
  color:var(--text-muted);
}
.service-taglist {
  display:flex;
  flex-wrap:wrap;
  gap:.4rem;
  margin-top:.4rem;
}
.badge-soft {
  padding:.18rem .55rem;
  border-radius:999px;
  border:1px solid rgba(148,163,184,.35);
  font-size:.72rem;
}

/* Packages */
.packages-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1.5rem;
}
.package {
  border-radius:var(--radius-xl);
  background:rgba(15,23,42,.98);
  border:1px solid var(--border-subtle);
  padding:1.4rem 1.5rem;
  display:flex;
  flex-direction:column;
  gap:.75rem;
}
.package--highlight {
  background:radial-gradient(circle at top left, rgba(34,197,94,.25), rgba(15,23,42,.98));
  border-color:rgba(34,197,94,.7);
  box-shadow:0 22px 60px rgba(34,197,94,.45);
}
.package-label {
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.16em;
  color:var(--accent);
}
.package-title { margin:.1rem 0 .25rem;font-size:1.02rem; }
.package-desc { margin:0;color:var(--text-muted);font-size:.9rem; }
.package-price {
  font-size:1.3rem;
  font-weight:600;
}
.package-price span {
  font-size:.8rem;
  color:var(--text-muted);
}
.package-list {
  list-style:none;
  padding:0;margin:.6rem 0 .2rem;
  font-size:.85rem;
  color:var(--text-muted);
}
.package-list li {
  display:flex;
  gap:.45rem;
  margin-bottom:.25rem;
}
.package-list li::before { content:"•";color:var(--accent); }
.package-footer {
  margin-top:auto;
  display:flex;
  justify-content:space-between;
  gap:.6rem;
  font-size:.78rem;
  color:var(--text-muted);
}
.package-footer a { color:var(--accent); }

/* Steps */
.steps-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1rem;
}
.step {
  border-radius:var(--radius-lg);
  background:rgba(15,23,42,.96);
  border:1px solid var(--border-subtle);
  padding:1rem;
  font-size:.88rem;
  color:var(--text-muted);
}
.step-number {
  width:26px;height:26px;
  border-radius:999px;
  background:var(--accent-soft);
  display:flex;align-items:center;justify-content:center;
  font-size:.78rem;
  color:var(--accent);
  margin-bottom:.55rem;
}
.step-title {
  margin:0 0 .35rem;
  font-size:.95rem;
  color:var(--text-main);
}

/* Partners */
.partners-row {
  display:flex;
  flex-wrap:wrap;
  gap:1.4rem;
}
.partner-chip {
  flex:0 1 150px;
  border-radius:1rem;
  border:1px solid var(--border-subtle);
  background:rgba(15,23,42,.96);
  padding:.7rem .9rem;
  display:flex;
  align-items:center;
  gap:.6rem;
  font-size:.8rem;
  color:var(--text-muted);
}
.partner-chip img {
  width:32px;height:32px;
  border-radius:.6rem;
  object-fit:cover;
}

/* About */
.about-grid {
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);
  gap:2.5rem;
  align-items:center;
}
.about-photo {
  border-radius:var(--radius-xl);
  overflow:hidden;
  border:1px solid var(--border-subtle);
  box-shadow:var(--shadow-soft);
}
.about-badges {
  margin-top:1rem;
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
}
.about-badge {
  padding:.22rem .6rem;
  border-radius:999px;
  border:1px solid var(--border-subtle);
  font-size:.78rem;
  color:var(--text-muted);
}

/* References */
.references-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1.4rem;
}
.reference-card {
  border-radius:var(--radius-xl);
  border:1px solid var(--border-subtle);
  background:rgba(15,23,42,.97);
  overflow:hidden;
  display:flex;
  flex-direction:column;
}
.reference-media img {
  width:100%;
  height:180px;
  object-fit:cover;
}
.reference-body {
  padding:1rem 1.1rem 1.2rem;
  font-size:.88rem;
  color:var(--text-muted);
}
.reference-title {
  margin:0 0 .35rem;
  font-size:.96rem;
  color:var(--text-main);
}

/* Kontakt */
.contact-grid {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);
  gap:2rem;
}
.contact-card {
  border-radius:var(--radius-xl);
  border:1px solid var(--border-subtle);
  background:rgba(15,23,42,.97);
  padding:1.5rem 1.6rem;
  font-size:.9rem;
  display:flex;
  flex-direction:column;
  gap:.8rem;
}
.contact-list {
  list-style:none;
  padding:0;margin:.3rem 0 0;
  color:var(--text-muted);
}
.contact-list li { margin-bottom:.35rem; }

.contact-form {
  border-radius:var(--radius-xl);
  border:1px solid var(--border-subtle);
  background:rgba(15,23,42,1);
  padding:1.5rem 1.7rem 1.7rem;
  box-shadow:var(--shadow-soft);
}
.form-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1rem;
}
.form-field {
  display:flex;
  flex-direction:column;
  gap:.3rem;
  margin-bottom:.7rem;
}
.form-field label {
  font-size:.8rem;
  color:var(--text-muted);
}
.form-field input,
.form-field select,
.form-field textarea {
  border-radius:.9rem;
  border:1px solid rgba(148,163,184,.5);
  background:rgba(15,23,42,.98);
  color:var(--text-main);
  padding:.6rem .7rem;
  font-size:.88rem;
  outline:none;
  transition:border-color var(--transition-fast),box-shadow var(--transition-fast),background var(--transition-fast);
}
.form-field textarea {
  min-height:120px;
  resize:vertical;
}
.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus {
  border-color:rgba(34,197,94,.8);
  box-shadow:0 0 0 1px rgba(34,197,94,.4);
  background:#020617;
}
.form-footnote {
  font-size:.75rem;
  color:var(--text-muted);
  margin-top:.4rem;
}

/* Footer */
.site-footer {
  border-top:1px solid var(--border-subtle);
  padding:1.4rem 0 1.6rem;
  font-size:.8rem;
  color:var(--text-muted);
}
.footer-inner {
  max-width:var(--container-width);
  margin:0 auto;
  padding:0 1.5rem;
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  gap:.9rem;
}
.footer-links {
  display:flex;
  flex-wrap:wrap;
  gap:.9rem;
}

/* Reveal */
.reveal {
  opacity:0;
  transform:translateY(18px);
  transition:opacity .5s ease-out,transform .5s ease-out;
}
.reveal.is-visible {
  opacity:1;
  transform:translateY(0);
}

/* Responsive */
@media (max-width:960px){
  .hero-grid { grid-template-columns:minmax(0,1fr); }
  .services-grid,
  .packages-grid,
  .references-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .steps-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .about-grid,
  .contact-grid { grid-template-columns:minmax(0,1fr); }
}
@media (max-width:720px){
  .header-inner { padding-inline:1rem; }
  .nav { display:none; }
  .burger { display:inline-flex; }
  .mobile-nav { display:flex; }
  .section { padding:3.3rem 0 3rem; }
  .hero { padding-top:3.1rem; }
  .services-grid,
  .packages-grid,
  .references-grid,
  .steps-grid { grid-template-columns:minmax(0,1fr); }
  .form-grid { grid-template-columns:minmax(0,1fr); }
}
@media (max-width:480px){
  .hero-ctas { flex-direction:column;align-items:stretch; }
}
