:root{
  --c4ts-bg: #070B18;
  --c4ts-blue: #0B1E3A;
  --c4ts-teal: #16C7C4;
  --c4ts-gold: #D4AF37;
  --c4ts-text: #EAF2FF;

  --radius: 18px;
  --shadow: 0 18px 50px rgba(0,0,0,.45);
  --border: 1px solid rgba(255,255,255,.10);
  --muted: rgba(234,242,255,.75);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Apple Color Emoji","Segoe UI Emoji";
  background:
    radial-gradient(1200px 600px at 15% 10%, rgba(22,199,196,.16), transparent 55%),
    radial-gradient(1200px 700px at 80% 0%, rgba(212,175,55,.14), transparent 60%),
    linear-gradient(180deg, var(--c4ts-bg), #050711 60%, #04040c);
  color: var(--c4ts-text);
  overflow-x:hidden;
}

a{color:inherit}
.c4ts-muted{color:var(--muted)}
.c4ts-container{max-width:1140px;margin:0 auto;padding:0 18px}

.c4ts-header{
  position:sticky;top:0;z-index:50;
  background: rgba(4,6,14,.62);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.c4ts-header__inner{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:14px 0;
}

.c4ts-brand img, .custom-logo{
  max-height:54px;width:auto;display:block;
  filter: drop-shadow(0 10px 24px rgba(0,0,0,.35));
}

.c4ts-nav{display:flex;align-items:center;gap:14px}
.c4ts-nav__menu{list-style:none;display:flex;gap:16px;margin:0;padding:0;align-items:center}
.c4ts-nav__menu a{
  text-decoration:none;
  color: rgba(234,242,255,.88);
  font-weight:650;
  letter-spacing:.2px;
  padding:10px 10px;
  border-radius:12px;
}
.c4ts-nav__menu a:hover{
  background: rgba(255,255,255,.06);
}

.c4ts-btn{
  display:inline-flex;align-items:center;justify-content:center;
  border-radius: 999px;
  padding: 12px 16px;
  text-decoration:none;
  font-weight:800;
  letter-spacing:.3px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  box-shadow: 0 10px 24px rgba(0,0,0,.25);
}
.c4ts-btn--gold{
  border: 1px solid rgba(212,175,55,.45);
  background: linear-gradient(135deg, rgba(212,175,55,.95), rgba(255,219,126,.65));
  color:#0b0e18;
}
.c4ts-btn--gold:hover{filter:brightness(1.05)}
.c4ts-btn--ghost{
  background: rgba(22,199,196,.10);
  border: 1px solid rgba(22,199,196,.35);
}
.c4ts-btn--ghost:hover{background: rgba(22,199,196,.16)}

.c4ts-nav__toggle{
  display:none;
  width:44px;height:44px;border-radius:14px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
}
.c4ts-nav__toggle span{display:block;height:2px;background:rgba(234,242,255,.85);margin:6px 10px;border-radius:2px}

.c4ts-hero{padding:54px 0 18px; position:relative}
.c4ts-hero__grid{display:grid;grid-template-columns: 1.2fr .8fr; gap:26px; align-items:center}
.c4ts-hero__title{
  font-size: clamp(38px, 5vw, 64px);
  line-height:1.02;
  margin:14px 0 10px;
  letter-spacing:-.6px;
  text-shadow: 0 18px 40px rgba(0,0,0,.45);
}
.c4ts-hero__subtitle{font-size:18px;line-height:1.7;color:var(--muted);max-width:52ch}
.c4ts-hero__actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}

.c4ts-badge{
  display:inline-flex;gap:10px;align-items:center;
  padding:10px 14px;border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background: linear-gradient(135deg, rgba(255,255,255,.06), rgba(22,199,196,.08));
}
.c4ts-badge__dot{
  width:10px;height:10px;border-radius:999px;
  background: radial-gradient(circle at 30% 30%, #fff, var(--c4ts-teal));
  box-shadow: 0 0 0 6px rgba(22,199,196,.12);
}

.c4ts-divider{height:1px;background:rgba(255,255,255,.08);margin:22px 0}
.c4ts-metrics{display:grid;grid-template-columns: repeat(3, 1fr);gap:12px}
.c4ts-metric{
  border: var(--border);
  border-radius: var(--radius);
  padding:14px;
  background: rgba(255,255,255,.04);
}
.c4ts-metric__num{font-weight:900;color:rgba(255,255,255,.92)}
.c4ts-metric__label{color:var(--muted);font-size:13px;margin-top:6px}

.c4ts-hero__visual{position:relative;min-height:360px}
.c4ts-visual__glass{
  position:absolute;inset:0;
  border-radius: 26px;
  background:
    radial-gradient(800px 300px at 20% 20%, rgba(22,199,196,.22), transparent 50%),
    radial-gradient(700px 300px at 85% 10%, rgba(212,175,55,.22), transparent 55%),
    linear-gradient(180deg, rgba(11,30,58,.70), rgba(4,6,14,.55));
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: var(--shadow);
}
.c4ts-visual__halo{
  position:absolute;inset:-40px -10px auto auto;
  width:200px;height:200px;border-radius:999px;
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.45), rgba(212,175,55,.18), transparent 70%);
  filter: blur(2px);
  opacity:.9;
}
.c4ts-visual__card{
  position:absolute;left:18px;right:18px;bottom:18px;
  border-radius: 18px;
  background: rgba(0,0,0,.28);
  border: 1px solid rgba(255,255,255,.12);
  padding: 16px;
}
.c4ts-visual__cardTitle{font-weight:900}
.c4ts-visual__cardText{color:var(--muted);margin-top:6px}

.c4ts-section{padding:42px 0}
.c4ts-section--alt{
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(22,199,196,.04));
  border-top: 1px solid rgba(255,255,255,.06);
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.c4ts-section__head h2{margin:0 0 8px;font-size:32px}
.c4ts-section__head p{margin:0;max-width:70ch}

.c4ts-cards{display:grid;grid-template-columns: repeat(3, 1fr); gap:14px; margin-top:18px}
.c4ts-card{
  border-radius: var(--radius);
  border: var(--border);
  background: rgba(255,255,255,.04);
  padding: 18px;
  box-shadow: 0 10px 30px rgba(0,0,0,.25);
}
.c4ts-card h3{margin:0 0 8px}
.c4ts-card p{margin:0; line-height:1.7}

.c4ts-email{display:grid;grid-template-columns: 1fr 1fr; gap:18px; align-items:start}
.c4ts-email__note{
  display:flex;gap:10px;align-items:flex-start;
  margin-top:16px;
  padding:12px 14px;
  border-radius: 16px;
  border: 1px solid rgba(212,175,55,.24);
  background: rgba(212,175,55,.08);
  color: rgba(234,242,255,.88);
}
.c4ts-email__icon{color: var(--c4ts-gold)}

.c4ts-split{display:grid;grid-template-columns: repeat(3, 1fr); gap:14px; margin-top:18px}
.c4ts-panel{
  border-radius: var(--radius);
  border: var(--border);
  background: rgba(255,255,255,.04);
  padding: 18px;
}
.c4ts-link{
  display:inline-block;margin-top:10px;
  color: rgba(22,199,196,.95);
  text-decoration:none;font-weight:800;
}
.c4ts-link:hover{color:#aef6f4}

.c4ts-footer{
  border-top: 1px solid rgba(255,255,255,.08);
  background: rgba(0,0,0,.20);
  padding: 30px 0;
}
.c4ts-footer__inner{display:grid;grid-template-columns: 1.2fr .8fr; gap:18px; align-items:start}
.c4ts-footer__menu{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.c4ts-footer__menu a{text-decoration:none;color:rgba(234,242,255,.82)}
.c4ts-footer__menu a:hover{color:#fff}

/* Responsive */
@media (max-width: 980px){
  .c4ts-hero__grid{grid-template-columns:1fr}
  .c4ts-hero__visual{min-height:280px}
  .c4ts-cards{grid-template-columns:1fr}
  .c4ts-email{grid-template-columns:1fr}
  .c4ts-split{grid-template-columns:1fr}
  .c4ts-footer__inner{grid-template-columns:1fr}
  .c4ts-nav__menu{display:none}
  .c4ts-nav__toggle{display:inline-block}
  .c4ts-nav.is-open .c4ts-nav__menu{
    display:flex;flex-direction:column;gap:6px;
    position:absolute;right:18px;top:70px;
    background: rgba(4,6,14,.90);
    border:1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    padding:10px;
    width:min(320px, calc(100vw - 36px));
  }
}