:root {
  --surface: rgba(255, 255, 255, 0.92);
  --text: #122f33;
  --muted: #60777a;
  --line: #dce8e8;
  --brand: #0d4a50;
  --brand-deep: #092d32;
  --accent-soft: #ccfbf1;
  --shadow: 0 18px 50px rgba(9, 45, 50, 0.08);
  --radius-xl: 28px;
  --radius-lg: 20px;
}

body {
  background:
    radial-gradient(circle at 8% 8%, rgba(20, 184, 166, 0.11), transparent 26rem),
    radial-gradient(circle at 92% 28%, rgba(13, 74, 80, 0.07), transparent 30rem),
    linear-gradient(180deg, #f4f8f8 0%, #f7fafa 58%, #eef6f5 100%);
}

::selection { background: #99f6e4; color: #092d32; }

.site-header {
  background: rgba(244, 248, 248, 0.84);
  border-bottom-color: rgba(13, 74, 80, 0.08);
}

.brand-mark {
  background: #5eead4;
  color: #092d32;
  box-shadow: 0 8px 20px rgba(9, 45, 50, 0.12);
}

.brand-name { color: #092d32; }

.nav { color: #587174; }
.nav a:hover, .nav a:focus-visible { color: #0d4a50; }

.language-select {
  border-color: #d4e2e2;
  background: rgba(255, 255, 255, 0.86);
  color: #173c40;
}

.button { border-radius: 13px; }

.button-primary {
  color: #092d32;
  background: #5eead4;
  box-shadow: 0 12px 28px rgba(20, 184, 166, 0.2);
}

.button-primary:hover, .button-primary:focus-visible { background: #99f6e4; }

.button-secondary {
  background: rgba(255, 255, 255, 0.88);
  border-color: #dce8e8;
  color: #173c40;
}

.hero { padding-top: 40px; }
.hero-grid { gap: 20px; }

.hero-copy {
  color: white;
  border-color: rgba(255, 255, 255, 0.06);
  background: #092d32;
  box-shadow: 0 28px 70px rgba(9, 45, 50, 0.18);
}

.hero-copy::before {
  inset: -110px -100px auto auto;
  width: 360px;
  height: 360px;
  background: transparent;
  border: 1px solid rgba(94, 234, 212, 0.13);
}

.hero-copy::after {
  content: "";
  position: absolute;
  top: -60px;
  right: -48px;
  width: 240px;
  height: 240px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 50%;
  pointer-events: none;
}

.hero-copy .eyebrow {
  color: #ccfbf1;
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(153, 246, 228, 0.15);
}

.hero-copy .eyebrow::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #5eead4;
  box-shadow: 0 0 0 5px rgba(94, 234, 212, 0.1);
}

.hero-copy h1 { line-height: 1.02; }
.hero-copy > p { color: #bacdce; }
.hero-copy .button-secondary { color: white; background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.13); }

.mini-stat {
  background: rgba(255,255,255,.055);
  border-color: rgba(255,255,255,.09);
}
.mini-stat strong { color: #99f6e4; }
.mini-stat span { color: #aec3c5; }

.hero-panel {
  background:
    radial-gradient(circle at 100% 0%, rgba(94, 234, 212, .18), transparent 16rem),
    rgba(255, 255, 255, 0.94);
}

.pill, .feature-number, .timeline-step {
  background: #e2f7f3;
  color: #0d615e;
}

.panel-row, .audience-item, .faq-item, .contact-list li {
  background: #f7fbfa;
  border-color: #e1eceb;
}

.panel-tag { background: #ccfbf1; color: #0d615e; }

.metric-card, .feature-card, .timeline-card, .section-card, .contact-card, .hero-panel {
  border-color: #dce8e8;
}

.metric-card, .feature-card, .timeline-card { transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.metric-card:hover, .feature-card:hover, .timeline-card:hover { transform: translateY(-3px); border-color: #aadfd8; box-shadow: 0 18px 40px rgba(9,45,50,.1); }

.quote-card {
  background: linear-gradient(150deg, #092d32, #0d4a50);
  box-shadow: 0 24px 48px rgba(9,45,50,.18);
}

.contact-form input, .contact-form textarea, .contact-form select {
  border-color: #d4e2e2;
  border-radius: 13px;
  background: white;
  outline: none;
}

.contact-form input:focus, .contact-form textarea:focus, .contact-form select:focus {
  border-color: #14877f;
  box-shadow: 0 0 0 4px rgba(20, 135, 127, .1);
}

@media (max-width: 760px) {
  .hero-copy { padding: 30px 24px; }
  .hero-copy h1 { font-size: clamp(2.65rem, 14vw, 4rem); }
}
