:root {
  --bg-primary:#070b10;
  --bg-secondary:#0b121b;
  --bg-textbox:#080f17;
  --bg-card:#0f1823;
  --text-primary:#e8eef8;
  --text-secondary:#8fa1b8;
  --accent:#f2b33f;
  --accent-hover:#ffc657;
  --accent-secondary:#69a9ee;
  --border:#253247;
  --border2:#34455d;
  --radius:14px;
  --radius-sm:8px;
}

body.features-page-modern {
  color:var(--text-primary);
  background:radial-gradient(circle at 70% 8%,rgba(52,96,150,.13),transparent 30rem),#070b10;
  background-attachment:fixed;
}

body.features-page-modern main {
  width:min(1054px,calc(100% - 48px));
  max-width:none;
  margin:0 auto;
  padding:48px 0 90px;
  background:transparent;
}

.features-page-modern .feature-breadcrumbs {
  margin-bottom:36px;
  color:var(--text-secondary);
}

.features-page-modern .feature-breadcrumbs a {
  color:var(--accent);
}

.features-page-modern .feature-hero {
  min-height:0;
  margin:0 0 38px;
  padding:0;
  display:block;
  text-align:left;
}

.features-page-modern .feature-hero .hero-plate {
  max-width:none;
  margin:0;
  padding:0;
  display:grid;
  grid-template-columns:120px minmax(0,1fr);
  gap:34px;
  text-align:left;
}

.features-page-modern .feature-hero #logo {
  width:120px;
  height:120px;
  margin:0;
}

.features-page-modern .feature-hero #logotext {
  margin:0;
  color:var(--text-primary);
  font-size:clamp(42px,5vw,68px);
  line-height:1;
  letter-spacing:-.05em;
}

.features-page-modern .feature-page-kicker {
  padding:0;
  border:0;
  border-radius:0;
  background:none;
  color:#f2b33f;
  font-size:11px;
  font-weight:700;
  letter-spacing:.13em;
}

.features-page-modern .feature-page-kicker::before {
  display:none;
}

.features-page-modern .feature-nav-card,
.features-page-modern .feature-help-cta,
.features-page-modern .feature-category,
.features-page-modern .feature-card,
.features-page-modern details.feature-card {
  border-color:var(--border);
  background:#0f1823;
  box-shadow:none;
}

.features-page-modern .feature-nav-card {
  margin-bottom:24px;
  padding:28px;
}

.features-page-modern .feature-nav-grid a {
  border-color:var(--border);
  background:#0b121b;
  color:var(--text-primary);
}

.features-page-modern .feature-nav-grid a:hover {
  border-color:rgba(242,179,63,.55);
  background:rgba(242,179,63,.06);
  color:var(--accent);
}

.features-page-modern .feature-control-buttons .btn,
.features-page-modern .feature-help-cta .btn {
  border-color:var(--border);
  background:#131e2b;
  color:var(--text-primary);
}

.features-page-modern .feature-help-cta {
  border-color:rgba(242,179,63,.28);
  background:linear-gradient(115deg,rgba(242,179,63,.08),rgba(242,179,63,.015));
}

.features-page-modern .feature-help-icon,
.features-page-modern .feature-section-number {
  border-color:rgba(242,179,63,.34);
  color:#f2b33f;
  background:rgba(242,179,63,.08);
}

.features-page-modern .feature-section-title h2,
.features-page-modern .feature-section-title h3,
.features-page-modern .feature-summary-main,
.features-page-modern .heading-2,
.features-page-modern .heading-3 {
  color:var(--text-primary);
}

.features-page-modern .feature-section-title p,
.features-page-modern .feature-intro-copy,
.features-page-modern .feature-card p,
.features-page-modern .feature-card li,
.features-page-modern .feature-grid-row>div:last-child {
  color:var(--text-secondary);
}

.features-page-modern details.feature-card>summary:hover,
.features-page-modern details.feature-section>summary:hover {
  background:rgba(242,179,63,.035);
}

.features-page-modern .feature-grid-row,
.features-page-modern .feature-table-row {
  border-color:var(--border);
}

.features-page-modern .feature-page-footer {
  border-color:var(--border);
  background:#070b10;
}

.features-page-modern .feature-page-footer a {
  color:var(--text-secondary);
}

.features-page-modern .feature-page-footer a:hover,
.features-page-modern .feature-page-footer a[aria-current="page"] {
  color:var(--accent);
}

@media(max-width:700px) {
  body.features-page-modern main {
    width:calc(100% - 28px);
    padding-top:28px;
  }

  .features-page-modern .feature-hero .hero-plate {
    grid-template-columns:72px minmax(0,1fr);
    gap:18px;
  }

  .features-page-modern .feature-hero #logo {
    width:72px;
    height:72px;
  }

  .features-page-modern .feature-hero #logotext {
    font-size:29px;
  }
}
