:root {
      --bg: #030914;
      --bg-soft: #071426;
      --panel: rgba(255,255,255,0.045);
      --text: #ffffff;
      --muted: #b9cadc;
      --blue: #52c9ff;
      --green: #50d890;
      --purple: #a576ff;
      --gold: #f2c45c;
    }

    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }

    html {
      scroll-behavior: smooth;
    }

    body {
      font-family: Arial, Helvetica, sans-serif;
      background: var(--bg);
      color: var(--text);
      overflow-x: hidden;
    }

    a {
      color: inherit;
    }

    .site-header {
      position: fixed;
      inset: 0 0 auto 0;
      z-index: 1000;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 30px;
      padding: 17px 6%;
      border-bottom: 1px solid rgba(255,255,255,0.08);
      background: rgba(3,9,20,0.88);
      backdrop-filter: blur(14px);
    }

    .brand {
      display: inline-flex;
      align-items: center;
      gap: 13px;
      color: #fff;
      text-decoration: none;
    }

    .brand-mark {
      width: 44px;
      height: 44px;
      display: grid;
      place-items: center;
      border: 1px solid rgba(82,201,255,0.7);
      border-radius: 11px;
      background:
        linear-gradient(145deg, rgba(82,201,255,0.16), rgba(255,255,255,0.02));
      box-shadow:
        0 0 22px rgba(82,201,255,0.18),
        inset 0 0 18px rgba(82,201,255,0.06);
    }

    .brand-diamond {
      width: 18px;
      height: 18px;
      border: 2px solid var(--blue);
      transform: rotate(45deg);
      box-shadow: 0 0 13px rgba(82,201,255,0.55);
    }

    .brand-copy {
      display: flex;
      flex-direction: column;
      line-height: 1;
    }

    .brand-copy strong {
      font-size: 1.05rem;
      letter-spacing: 3px;
    }

    .brand-copy span {
      margin-top: 5px;
      color: var(--blue);
      font-size: 0.65rem;
      font-weight: 800;
      letter-spacing: 4px;
    }

    .site-nav {
      display: flex;
      align-items: center;
      gap: 24px;
    }

    .site-nav a {
      color: #dce8f5;
      text-decoration: none;
      font-size: 0.86rem;
      font-weight: 700;
      transition: color 0.2s ease;
    }

    .site-nav a:hover {
      color: var(--blue);
    }

    .nav-button {
      padding: 11px 17px;
      border: 1px solid var(--blue);
      border-radius: 9px;
      box-shadow: 0 0 18px rgba(82,201,255,0.12);
    }

    .home-hero {
      position: relative;
      min-height: 100vh;
      display: grid;
      grid-template-columns: 1.05fr 0.95fr;
      align-items: center;
      gap: 55px;
      padding: 140px 7% 80px;
      background:
        radial-gradient(circle at 78% 30%, rgba(46,153,255,0.24), transparent 32%),
        radial-gradient(circle at 15% 80%, rgba(0,210,255,0.08), transparent 28%),
        linear-gradient(135deg, #020712 0%, #061426 55%, #08213b 100%);
      overflow: hidden;
    }

    .home-hero::before,
    .home-hero::after {
      content: "";
      position: absolute;
      width: 420px;
      height: 420px;
      border-radius: 50%;
      filter: blur(80px);
      opacity: 0.18;
      animation: drift 14s ease-in-out infinite alternate;
      pointer-events: none;
    }

    .home-hero::before {
      top: -120px;
      right: 8%;
      background: #1d8dff;
    }

    .home-hero::after {
      left: -180px;
      bottom: -130px;
      background: #00cfff;
      animation-delay: -7s;
    }

    @keyframes drift {
      from { transform: translate3d(0,0,0) scale(1); }
      to { transform: translate3d(25px,18px,0) scale(1.08); }
    }

    .hero-copy,
    .hero-visual {
      position: relative;
      z-index: 1;
    }

    .hero-copy {
      max-width: 720px;
    }

    .hero-label,
    .section-label {
      margin-bottom: 18px;
      color: #69d3ff;
      font-size: 0.82rem;
      font-weight: 800;
      letter-spacing: 5px;
    }

    .home-hero h1 {
      margin-bottom: 25px;
      font-size: clamp(3rem, 6vw, 6rem);
      line-height: 1;
      letter-spacing: -3px;
    }

    .home-hero h1 span {
      color: var(--blue);
      text-shadow: 0 0 26px rgba(82,201,255,0.18);
    }

    .hero-intro {
      max-width: 650px;
      margin-bottom: 35px;
      color: #c3d2e3;
      font-size: 1.15rem;
      line-height: 1.8;
    }

    .hero-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 16px;
      margin-bottom: 38px;
    }

    .primary-button,
    .secondary-button,
    .mission-button {
      display: inline-block;
      border-radius: 10px;
      text-decoration: none;
      font-weight: 800;
      letter-spacing: 0.5px;
      transition:
        transform 0.22s ease,
        box-shadow 0.22s ease,
        background 0.22s ease,
        color 0.22s ease;
    }

    .primary-button,
    .secondary-button {
      padding: 15px 24px;
    }

    .primary-button {
      border: 1px solid var(--blue);
      background: var(--blue);
      color: #03101b;
      box-shadow:
        0 0 24px rgba(82,201,255,0.32),
        0 10px 30px rgba(0,0,0,0.28);
      animation: pulseGlow 3.5s ease-in-out infinite;
    }

    @keyframes pulseGlow {
      0%, 100% { box-shadow: 0 0 20px rgba(82,201,255,0.25), 0 10px 30px rgba(0,0,0,0.28); }
      50% { box-shadow: 0 0 34px rgba(82,201,255,0.5), 0 12px 34px rgba(0,0,0,0.34); }
    }

    .secondary-button {
      border: 1px solid rgba(255,255,255,0.35);
      background: rgba(255,255,255,0.04);
      color: #fff;
    }

    .primary-button:hover,
    .secondary-button:hover,
    .mission-button:hover {
      transform: translateY(-4px);
    }

    .secondary-button:hover {
      border-color: var(--blue);
      box-shadow: 0 0 24px rgba(82,201,255,0.22);
      color: #8edfff;
    }

    .trust-row {
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
    }

    .trust-row span {
      padding: 9px 14px;
      border: 1px solid rgba(82,201,255,0.22);
      border-radius: 999px;
      background: rgba(255,255,255,0.035);
      color: #dceaf5;
      font-size: 0.84rem;
    }

    .hero-visual {
      display: flex;
      justify-content: center;
      align-items: center;
    }

    .visual-card {
      width: min(100%, 520px);
      padding: 35px;
      border: 1px solid rgba(82,201,255,0.26);
      border-radius: 24px;
      background: linear-gradient(145deg, rgba(255,255,255,0.08), rgba(255,255,255,0.025));
      box-shadow:
        0 30px 80px rgba(0,0,0,0.45),
        0 0 45px rgba(82,201,255,0.12);
    }

    .visual-screen {
      min-height: 350px;
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      padding: 30px;
      border: 1px solid rgba(255,255,255,0.06);
      border-radius: 16px;
      background:
        radial-gradient(circle at 75% 20%, rgba(82,201,255,0.18), transparent 28%),
        linear-gradient(145deg, rgba(10,33,59,0.3), rgba(0,0,0,0.76));
    }

    .visual-screen p {
      margin-bottom: 10px;
      color: #69d3ff;
      font-size: 0.8rem;
      font-weight: 800;
      letter-spacing: 3px;
    }

    .visual-screen h2 {
      font-size: clamp(2rem, 4vw, 3.8rem);
      line-height: 1.05;
    }

    .mission-ready {
      margin-top: 18px;
      color: var(--blue);
      font-size: 0.78rem;
      font-weight: 800;
      letter-spacing: 2.4px;
    }

    .mission-section {
      padding: 105px 6%;
      background:
        radial-gradient(circle at 50% 10%, rgba(44,142,255,0.12), transparent 32%),
        #030914;
      color: #fff;
      scroll-margin-top: 100px;
    }

    .section-heading {
      max-width: 820px;
      margin: 0 auto 55px;
      text-align: center;
    }

    .section-heading h2 {
      margin-bottom: 18px;
      font-size: clamp(2.5rem, 5vw, 4.6rem);
      line-height: 1.05;
    }

    .section-heading > p:last-child {
      color: var(--muted);
      font-size: 1.05rem;
      line-height: 1.8;
    }

    .mission-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 22px;
      max-width: 1500px;
      margin: 0 auto;
    }

    .mission-card {
      --mission-accent: var(--blue);
      position: relative;
      display: flex;
      flex-direction: column;
      min-height: 690px;
      padding: 30px;
      border: 1px solid rgba(255,255,255,0.1);
      border-radius: 22px;
      background: linear-gradient(160deg, rgba(255,255,255,0.075), rgba(255,255,255,0.018));
      box-shadow: 0 24px 65px rgba(0,0,0,0.32);
      overflow: hidden;
      transition:
        transform 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease;
    }

    .mission-card::before {
      content: "";
      position: absolute;
      top: 0;
      left: 12%;
      width: 76%;
      height: 2px;
      background: var(--mission-accent);
      box-shadow: 0 0 24px var(--mission-accent);
    }

    .mission-card:hover {
      transform: translateY(-9px);
      border-color: var(--mission-accent);
      box-shadow:
        0 32px 85px rgba(0,0,0,0.48),
        0 0 34px color-mix(in srgb, var(--mission-accent) 20%, transparent);
    }

    .student-card { --mission-accent: var(--blue); }
    .business-card { --mission-accent: var(--green); }
    .professional-card { --mission-accent: var(--purple); }
    .executive-card { --mission-accent: var(--gold); }

    .mission-card-top {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 14px;
      margin-bottom: 28px;
    }

    .mission-icon {
      width: 47px;
      height: 47px;
      display: grid;
      place-items: center;
      border: 1px solid color-mix(in srgb, var(--mission-accent) 65%, transparent);
      border-radius: 12px;
      background: color-mix(in srgb, var(--mission-accent) 10%, transparent);
      color: var(--mission-accent);
      box-shadow: 0 0 22px color-mix(in srgb, var(--mission-accent) 18%, transparent);
    }

    .mission-icon svg {
      width: 24px;
      height: 24px;
      stroke: currentColor;
      fill: none;
      stroke-width: 1.8;
      stroke-linecap: round;
      stroke-linejoin: round;
    }

    .mission-badge {
      padding: 7px 10px;
      border: 1px solid var(--mission-accent);
      border-radius: 999px;
      color: var(--mission-accent);
      font-size: 0.63rem;
      font-weight: 800;
      letter-spacing: 1px;
    }

    .mission-series {
      margin-bottom: 10px;
      color: var(--mission-accent);
      font-size: 0.72rem;
      font-weight: 800;
      letter-spacing: 2px;
    }

    .mission-card h3 {
      margin-bottom: 9px;
      font-size: 2rem;
    }

    .mission-tagline {
      margin-bottom: 20px;
      font-weight: 700;
    }

    .mission-description {
      min-height: 105px;
      margin-bottom: 22px;
      color: var(--muted);
      line-height: 1.7;
    }

    .mission-details {
      margin-bottom: 24px;
    }

    .mission-details p {
      margin-bottom: 10px;
      font-weight: 800;
    }

    .mission-details ul {
      list-style: none;
    }

    .mission-details li {
      position: relative;
      padding: 7px 0 7px 20px;
      color: #dbe7f3;
      line-height: 1.45;
    }

    .mission-details li::before {
      content: "✓";
      position: absolute;
      left: 0;
      color: var(--mission-accent);
      font-weight: 900;
    }

    .mission-service {
      margin-top: auto;
      margin-bottom: 22px;
      padding: 15px;
      border-left: 3px solid var(--mission-accent);
      border-radius: 6px;
      background: rgba(255,255,255,0.035);
    }

    .mission-service strong,
    .mission-service span {
      display: block;
    }

    .mission-service strong {
      margin-bottom: 7px;
      color: var(--mission-accent);
    }

    .mission-service span {
      color: var(--muted);
      font-size: 0.86rem;
      line-height: 1.55;
    }

    .mission-button {
      display: block;
      padding: 14px 16px;
      border: 1px solid var(--mission-accent);
      color: #fff;
      text-align: center;
      font-size: 0.79rem;
      box-shadow: 0 0 18px color-mix(in srgb, var(--mission-accent) 12%, transparent);
    }

    .mission-button:hover {
      background: var(--mission-accent);
      color: #03101b;
      box-shadow: 0 0 28px color-mix(in srgb, var(--mission-accent) 38%, transparent);
    }

    .mission-footer {
      max-width: 950px;
      margin: 48px auto 0;
      text-align: center;
    }

    .mission-footer p {
      margin-bottom: 16px;
      color: var(--muted);
      line-height: 1.7;
    }

    .custom-build-link {
      color: #69d3ff;
      text-decoration: none;
      font-weight: 800;
    }

    .custom-build-link:hover {
      text-decoration: underline;
    }

    .reveal {
      opacity: 0;
      transform: translateY(28px);
      transition:
        opacity 0.7s ease,
        transform 0.7s ease;
    }

    .reveal.visible {
      opacity: 1;
      transform: translateY(0);
    }

    @media (max-width: 1250px) {
      .mission-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }

    @media (max-width: 900px) {
      .site-header {
        position: static;
        flex-direction: column;
      }

      .site-nav {
        justify-content: center;
        flex-wrap: wrap;
      }

      .home-hero {
        min-height: auto;
        grid-template-columns: 1fr;
        padding: 90px 6% 70px;
        text-align: center;
      }

      .hero-copy {
        margin: 0 auto;
      }

      .hero-actions,
      .trust-row {
        justify-content: center;
      }
    }

    @media (max-width: 700px) {
      .mission-section {
        padding: 80px 6%;
      }

      .mission-grid {
        grid-template-columns: 1fr;
      }

      .mission-card,
      .mission-description {
        min-height: auto;
      }
    }

    @media (max-width: 600px) {
      .home-hero h1 {
        letter-spacing: -1px;
      }

      .hero-actions {
        flex-direction: column;
      }

      .primary-button,
      .secondary-button {
        width: 100%;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      *,
      *::before,
      *::after {
        animation: none !important;
        transition: none !important;
      }

      .reveal {
        opacity: 1;
        transform: none;
      }
    }


/* CYBERGUARD TECH 3.1 — CG STUDENT */
.section-pad{padding:100px 6%}
.student-hero{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:55px;padding:140px 7% 80px;background:radial-gradient(circle at 78% 30%,rgba(46,153,255,.25),transparent 32%),linear-gradient(135deg,#020712,#061426 55%,#08213b)}
.student-copy h1{font-size:clamp(3.5rem,7vw,7rem);line-height:.95;letter-spacing:-4px;margin:18px 0 24px}
.student-copy h1 small{display:block;margin-top:18px;color:var(--blue);font-size:clamp(1.25rem,2.2vw,2rem);letter-spacing:0}
.product-badge{display:inline-block;padding:8px 12px;border:1px solid var(--blue);border-radius:999px;color:var(--blue);font-size:.7rem;font-weight:800;letter-spacing:1.4px;box-shadow:0 0 20px rgba(82,201,255,.2)}
.student-screen{background:radial-gradient(circle at 75% 18%,rgba(82,201,255,.22),transparent 28%),linear-gradient(145deg,rgba(10,33,59,.4),rgba(0,0,0,.82))}
.product-story{background:#030914}
.story-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:70px;max-width:1200px;margin:auto}
.story-grid h2,.prep-panel h2,.promise-panel h2,.cta-panel h2{font-size:clamp(2.3rem,4.6vw,4.7rem);line-height:1.08}
.story-text{color:var(--muted);font-size:1.06rem;line-height:1.9}
.story-text p+p{margin-top:20px}
.product-included{background:radial-gradient(circle at 50% 0,rgba(82,201,255,.1),transparent 30%),#050c18}
.included-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;max-width:1150px;margin:auto}
.included-card{padding:38px;border:1px solid rgba(255,255,255,.1);border-radius:24px;background:linear-gradient(155deg,rgba(255,255,255,.07),rgba(255,255,255,.018));box-shadow:0 28px 75px rgba(0,0,0,.35)}
.prep-card{border-color:rgba(165,118,255,.35)}
.included-card h3{font-size:2rem;margin:10px 0 20px}
.included-card ul{list-style:none}
.included-card li{position:relative;padding:8px 0 8px 22px;color:#dbe7f3}
.included-card li:before{content:"✓";position:absolute;left:0;color:var(--blue);font-weight:900}
.prep-card li:before{color:var(--purple)}
.included-note{margin-top:24px;padding-top:18px;border-top:1px solid rgba(255,255,255,.08);color:var(--muted);font-size:.9rem;line-height:1.7}
.student-prep{background:#030914}
.prep-panel{display:grid;grid-template-columns:1fr .9fr;gap:50px;max-width:1220px;margin:auto;padding:52px;border:1px solid rgba(82,201,255,.2);border-radius:28px;background:radial-gradient(circle at 100% 0,rgba(82,201,255,.13),transparent 32%),linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018));box-shadow:0 32px 90px rgba(0,0,0,.38)}
.prep-panel p:not(.section-label){margin-top:20px;color:var(--muted);line-height:1.8}
.integrity-note{padding:16px 18px;border-left:3px solid var(--blue);background:rgba(82,201,255,.05)}
.prep-list{display:grid;gap:14px}
.prep-list div{padding:18px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.025)}
.prep-list strong,.prep-list span{display:block}
.prep-list span{margin-top:6px;color:var(--muted);font-size:.9rem}
.promise-section{background:#050c18}
.promise-panel{max-width:1180px;margin:auto;padding:58px;border:1px solid rgba(82,201,255,.18);border-radius:28px;text-align:center;background:radial-gradient(circle at 50% 0,rgba(82,201,255,.13),transparent 35%),rgba(255,255,255,.025)}
.promise-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin-top:36px}
.promise-grid div{padding:18px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.025);color:#dceaf5}
.student-cta{background:radial-gradient(circle at 50% 40%,rgba(44,142,255,.16),transparent 38%),linear-gradient(135deg,#04101f,#06192d)}
.cta-panel{max-width:940px;margin:auto;text-align:center}
.cta-panel>p:not(.section-label){max-width:700px;margin:22px auto 30px;color:var(--muted);line-height:1.8}
.cta-panel .hero-actions{justify-content:center}
.cta-panel small{display:block;margin-top:24px;color:#8fa5bb}
@media(max-width:1000px){.student-hero,.story-grid,.prep-panel{grid-template-columns:1fr}.student-hero{text-align:center;min-height:auto}.student-hero .hero-actions,.student-hero .trust-row{justify-content:center}.promise-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.section-pad{padding:75px 6%}.included-grid{grid-template-columns:1fr}.prep-panel,.promise-panel{padding:30px 22px}.promise-grid{grid-template-columns:1fr}.student-copy h1{letter-spacing:-2px}}


/* =========================================================
   CYBERGUARD TECH 3.2 — CG BUSINESS
   ========================================================= */

.business-page {
  --business-green: #50d890;
  --business-green-soft: #8ef0ba;
}

.business-label {
  color: var(--business-green) !important;
}

.business-hero {
  position: relative;
  min-height: 100vh;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 60px;
  padding: 145px 7% 85px;
  background:
    radial-gradient(
      circle at 78% 30%,
      rgba(80, 216, 144, 0.20),
      transparent 31%
    ),
    radial-gradient(
      circle at 18% 90%,
      rgba(0, 150, 105, 0.10),
      transparent 28%
    ),
    linear-gradient(
      135deg,
      #020b0a 0%,
      #061a18 54%,
      #0a2924 100%
    );
  overflow: hidden;
}

.business-hero::before {
  content: "";
  position: absolute;
  right: 6%;
  bottom: 8%;
  width: 430px;
  height: 430px;
  border: 1px solid rgba(80, 216, 144, 0.07);
  border-radius: 50%;
  box-shadow:
    0 0 0 72px rgba(80, 216, 144, 0.022),
    0 0 0 144px rgba(80, 216, 144, 0.012);
}

.business-copy,
.business-visual {
  position: relative;
  z-index: 1;
}

.business-badge {
  display: inline-block;
  padding: 8px 12px;
  border: 1px solid var(--business-green);
  border-radius: 999px;
  color: var(--business-green);
  font-size: 0.70rem;
  font-weight: 800;
  letter-spacing: 1.4px;
  box-shadow: 0 0 20px rgba(80, 216, 144, 0.20);
}

.business-copy h1 {
  margin: 18px 0 24px;
  font-size: clamp(3.5rem, 7vw, 7rem);
  line-height: 0.95;
  letter-spacing: -4px;
}

.business-copy h1 small {
  display: block;
  margin-top: 19px;
  color: var(--business-green);
  font-size: clamp(1.25rem, 2.2vw, 2rem);
  line-height: 1.2;
  letter-spacing: 0;
}

.business-primary-button {
  display: inline-block;
  padding: 15px 24px;
  border: 1px solid var(--business-green);
  border-radius: 10px;
  background: var(--business-green);
  color: #03110b;
  text-decoration: none;
  font-weight: 800;
  letter-spacing: 0.45px;
  box-shadow:
    0 0 25px rgba(80, 216, 144, 0.30),
    0 10px 30px rgba(0, 0, 0, 0.28);
  transition:
    transform 0.22s ease,
    box-shadow 0.22s ease,
    background 0.22s ease;
}

.business-primary-button:hover {
  transform: translateY(-4px);
  background: var(--business-green-soft);
  box-shadow:
    0 0 36px rgba(80, 216, 144, 0.50),
    0 14px 35px rgba(0, 0, 0, 0.34);
}

.business-trust span {
  border-color: rgba(80, 216, 144, 0.24);
}

.office-stage {
  position: relative;
  width: min(100%, 680px);
  min-height: 530px;
  margin: 0 auto;
  perspective: 1300px;
}

.office-window {
  position: absolute;
  top: 15px;
  right: 4%;
  width: 74%;
  height: 300px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 9px;
  opacity: 0.33;
}

.office-window span {
  border: 1px solid rgba(80, 216, 144, 0.20);
  background:
    linear-gradient(
      180deg,
      rgba(112, 239, 187, 0.12),
      rgba(3, 20, 17, 0.28)
    );
}

.office-monitor {
  position: absolute;
  top: 95px;
  width: 48%;
  height: 270px;
  border: 1px solid rgba(80, 216, 144, 0.30);
  border-radius: 17px;
  background:
    radial-gradient(
      circle at 80% 15%,
      rgba(80, 216, 144, 0.17),
      transparent 28%
    ),
    linear-gradient(
      145deg,
      rgba(7, 42, 36, 0.94),
      rgba(1, 12, 10, 0.98)
    );
  box-shadow:
    0 28px 75px rgba(0, 0, 0, 0.50),
    0 0 42px rgba(80, 216, 144, 0.12);
  overflow: hidden;
}

.office-monitor::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -64px;
  width: 13px;
  height: 64px;
  transform: translateX(-50%);
  background: linear-gradient(#263d39, #071411);
}

.office-monitor-left {
  left: 1%;
  transform: rotateY(7deg);
}

.office-monitor-right {
  right: 1%;
  transform: rotateY(-7deg);
}

.dashboard-header {
  height: 28px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.dashboard-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 13px;
  padding: 24px;
}

.dashboard-grid i {
  height: 76px;
  border: 1px solid rgba(80, 216, 144, 0.20);
  border-radius: 8px;
  background: rgba(80, 216, 144, 0.055);
}

.chart-bars {
  height: 185px;
  display: flex;
  align-items: flex-end;
  gap: 14px;
  padding: 35px 30px 20px;
}

.chart-bars i {
  flex: 1;
  border-radius: 5px 5px 0 0;
  background: linear-gradient(
    180deg,
    rgba(80, 216, 144, 0.92),
    rgba(80, 216, 144, 0.12)
  );
  box-shadow: 0 0 13px rgba(80, 216, 144, 0.18);
}

.chart-bars i:nth-child(1) { height: 34%; }
.chart-bars i:nth-child(2) { height: 60%; }
.chart-bars i:nth-child(3) { height: 45%; }
.chart-bars i:nth-child(4) { height: 82%; }
.chart-bars i:nth-child(5) { height: 68%; }

.chart-line {
  width: 73%;
  height: 3px;
  margin-left: 13%;
  transform: rotate(-8deg);
  border-radius: 999px;
  background: var(--business-green);
  box-shadow: 0 0 18px rgba(80, 216, 144, 0.65);
}

.business-mini-pc {
  position: absolute;
  left: 37%;
  bottom: 28px;
  width: 175px;
  height: 118px;
  padding: 21px;
  border: 1px solid rgba(80, 216, 144, 0.30);
  border-radius: 18px;
  background: linear-gradient(145deg, #17332c, #040d0b);
  box-shadow:
    0 25px 60px rgba(0, 0, 0, 0.52),
    0 0 30px rgba(80, 216, 144, 0.16);
}

.business-mini-logo {
  width: 25px;
  height: 25px;
  margin-bottom: 21px;
  border: 2px solid var(--business-green);
  transform: rotate(45deg);
  box-shadow: 0 0 16px rgba(80, 216, 144, 0.65);
}

.business-mini-pc span {
  color: #d8ffea;
  font-size: 0.70rem;
  font-weight: 800;
  letter-spacing: 2px;
}

.office-desk {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 28px;
  border-radius: 8px;
  background: linear-gradient(90deg, #10231f, #203f37, #10231f);
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.42);
}

.office-glow {
  position: absolute;
  right: 8%;
  bottom: -2px;
  left: 8%;
  height: 28px;
  border-radius: 50%;
  background: rgba(80, 216, 144, 0.29);
  filter: blur(28px);
}

.business-story {
  background: #030b0a;
}

.business-included {
  background:
    radial-gradient(
      circle at 50% 0,
      rgba(80, 216, 144, 0.10),
      transparent 30%
    ),
    #06100e;
}

.business-hardware-card {
  border-color: rgba(80, 216, 144, 0.25);
}

.business-hardware-card li::before {
  color: var(--business-green);
}

.business-preparation-card {
  border-color: rgba(82, 201, 255, 0.24);
}

.business-services {
  background: #030b0a;
}

.business-services-panel {
  display: grid;
  grid-template-columns: 1fr 0.95fr;
  gap: 52px;
  max-width: 1240px;
  margin: 0 auto;
  padding: 54px;
  border: 1px solid rgba(80, 216, 144, 0.22);
  border-radius: 28px;
  background:
    radial-gradient(
      circle at 100% 0,
      rgba(80, 216, 144, 0.13),
      transparent 32%
    ),
    linear-gradient(
      145deg,
      rgba(255, 255, 255, 0.055),
      rgba(255, 255, 255, 0.018)
    );
  box-shadow: 0 32px 90px rgba(0, 0, 0, 0.38);
}

.business-services-panel h2 {
  font-size: clamp(2.3rem, 4.6vw, 4.7rem);
  line-height: 1.08;
}

.business-services-panel p:not(.section-label) {
  margin-top: 20px;
  color: var(--muted);
  line-height: 1.82;
}

.business-scope-note {
  padding: 16px 18px;
  border-left: 3px solid var(--business-green);
  background: rgba(80, 216, 144, 0.055);
}

.business-services-list {
  display: grid;
  gap: 13px;
}

.business-services-list div {
  padding: 18px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.025);
}

.business-services-list strong,
.business-services-list span {
  display: block;
}

.business-services-list strong {
  color: #ffffff;
}

.business-services-list span {
  margin-top: 6px;
  color: var(--muted);
  font-size: 0.90rem;
  line-height: 1.55;
}

.business-fit {
  background: #06100e;
}

.business-fit-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  max-width: 1120px;
  margin: 0 auto;
}

.business-fit-item {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 24px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.025);
  transition:
    transform 0.22s ease,
    border-color 0.22s ease,
    box-shadow 0.22s ease;
}

.business-fit-item:hover {
  transform: translateY(-5px);
  border-color: rgba(80, 216, 144, 0.50);
  box-shadow: 0 0 25px rgba(80, 216, 144, 0.10);
}

.business-fit-item span {
  color: var(--business-green);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 1.5px;
}

.business-promise {
  background: #030b0a;
}

.business-promise-panel {
  max-width: 1200px;
  margin: 0 auto;
  padding: 60px;
  border: 1px solid rgba(80, 216, 144, 0.20);
  border-radius: 28px;
  background:
    radial-gradient(
      circle at 50% 0,
      rgba(80, 216, 144, 0.13),
      transparent 35%
    ),
    rgba(255, 255, 255, 0.025);
  text-align: center;
}

.business-promise-panel h2 {
  max-width: 850px;
  margin: 0 auto;
  font-size: clamp(2.3rem, 4.6vw, 4.7rem);
  line-height: 1.08;
}

.business-promise-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
  margin-top: 38px;
}

.business-promise-grid div {
  padding: 18px 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.025);
  color: #dcefe5;
}

.business-cta {
  background:
    radial-gradient(
      circle at 50% 40%,
      rgba(80, 216, 144, 0.16),
      transparent 38%
    ),
    linear-gradient(135deg, #04120f, #082a23);
}

.business-cta .cta-panel small {
  color: #91b5a5;
}

@media (max-width: 1000px) {
  .business-hero,
  .business-services-panel {
    grid-template-columns: 1fr;
  }

  .business-hero {
    min-height: auto;
    padding: 110px 6% 80px;
    text-align: center;
  }

  .business-hero .hero-actions,
  .business-hero .trust-row {
    justify-content: center;
  }

  .office-stage {
    min-height: 470px;
  }

  .business-promise-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .business-copy h1 {
    letter-spacing: -2px;
  }

  .office-stage {
    min-height: 390px;
  }

  .office-monitor {
    top: 65px;
    height: 220px;
  }

  .business-mini-pc {
    left: 32%;
    width: 145px;
    height: 100px;
  }

  .business-services-panel,
  .business-promise-panel {
    padding: 31px 23px;
  }

  .business-fit-grid,
  .business-promise-grid {
    grid-template-columns: 1fr;
  }
}

/* CYBERGUARD TECH 3.3 — CG PROFESSIONAL */
.professional-page{--professional-purple:#a44cff;--professional-purple-soft:#c985ff}
.professional-label{color:var(--professional-purple)!important}
.professional-hero{position:relative;min-height:100vh;display:grid;grid-template-columns:.8fr 1.25fr .55fr;align-items:center;gap:30px;padding:140px 4% 70px;background:radial-gradient(circle at 68% 32%,rgba(164,76,255,.25),transparent 32%),linear-gradient(135deg,#03020a,#09051a 55%,#15052c);overflow:hidden}
.professional-copy,.professional-visual,.status-panel{position:relative;z-index:1}
.professional-badge{display:inline-block;padding:8px 12px;border:1px solid var(--professional-purple);border-radius:999px;color:var(--professional-purple);font-size:.7rem;font-weight:800;letter-spacing:1.4px;box-shadow:0 0 22px rgba(164,76,255,.25)}
.professional-copy h1{margin:20px 0 24px;font-size:clamp(3rem,5vw,5.8rem);line-height:.98;letter-spacing:-3px}
.professional-copy h1 span{color:var(--professional-purple);text-shadow:0 0 26px rgba(164,76,255,.25)}
.professional-primary-button{display:inline-block;padding:15px 24px;border:1px solid var(--professional-purple);border-radius:10px;background:linear-gradient(135deg,#6d1fc1,#a44cff);color:#fff;text-decoration:none;font-weight:800;letter-spacing:.45px;box-shadow:0 0 28px rgba(164,76,255,.34),0 10px 30px rgba(0,0,0,.3);transition:transform .22s ease,box-shadow .22s ease}
.professional-primary-button:hover{transform:translateY(-4px);box-shadow:0 0 40px rgba(164,76,255,.55),0 14px 36px rgba(0,0,0,.36)}
.soc-stage{position:relative;min-height:500px;perspective:1300px}
.soc-monitor{position:absolute;top:95px;width:32%;height:270px;border:1px solid rgba(164,76,255,.35);border-radius:14px;background:radial-gradient(circle at 80% 15%,rgba(164,76,255,.16),transparent 28%),linear-gradient(145deg,rgba(17,8,38,.96),rgba(3,2,10,.99));box-shadow:0 30px 75px rgba(0,0,0,.55),0 0 40px rgba(164,76,255,.15);overflow:hidden}
.soc-monitor:after{content:"";position:absolute;left:50%;bottom:-58px;width:12px;height:58px;transform:translateX(-50%);background:linear-gradient(#31203e,#0c0712)}
.soc-left{left:0;transform:rotateY(7deg)}.soc-center{left:34%;width:34%;z-index:2}.soc-right{right:0;transform:rotateY(-7deg)}
.node-map{position:relative;width:100%;height:100%;background:linear-gradient(rgba(164,76,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(164,76,255,.05) 1px,transparent 1px);background-size:26px 26px}
.node-map i{position:absolute;width:13px;height:13px;border:2px solid #7edbff;border-radius:50%;box-shadow:0 0 16px rgba(126,219,255,.7)}
.node-map i:nth-child(1){top:20%;left:18%}.node-map i:nth-child(2){top:34%;left:53%}.node-map i:nth-child(3){top:18%;right:16%}.node-map i:nth-child(4){bottom:23%;left:22%}.node-map i:nth-child(5){bottom:18%;right:18%}.node-map i:nth-child(6){top:53%;left:37%}
.world-grid{height:160px;margin:24px;border:1px solid rgba(126,219,255,.2);border-radius:9px;background:radial-gradient(circle at 50% 50%,rgba(126,219,255,.18),transparent 38%),linear-gradient(rgba(126,219,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(126,219,255,.05) 1px,transparent 1px);background-size:auto,24px 24px,24px 24px}
.soc-bars{display:flex;gap:10px;align-items:flex-end;height:60px;padding:0 26px}.soc-bars i{flex:1;background:linear-gradient(180deg,var(--professional-purple),rgba(164,76,255,.12));border-radius:4px 4px 0 0}.soc-bars i:nth-child(1){height:30%}.soc-bars i:nth-child(2){height:58%}.soc-bars i:nth-child(3){height:43%}.soc-bars i:nth-child(4){height:82%}.soc-bars i:nth-child(5){height:67%}.soc-bars i:nth-child(6){height:49%}
.alert-panel{padding:24px}.alert-panel strong{display:block;color:#ff6b98;margin-bottom:20px}.alert-panel span{display:block;height:10px;margin:15px 0;border-radius:999px;background:linear-gradient(90deg,#ff4d7d,rgba(255,77,125,.08))}
.soc-desk{position:absolute;left:0;right:0;bottom:38px;height:26px;border-radius:8px;background:linear-gradient(90deg,#160d21,#2d1642,#160d21);box-shadow:0 16px 30px rgba(0,0,0,.45)}
.soc-glow{position:absolute;left:8%;right:8%;bottom:35px;height:30px;border-radius:50%;background:rgba(164,76,255,.33);filter:blur(28px)}
.status-panel{align-self:center;padding:24px;border:1px solid rgba(164,76,255,.38);border-radius:18px;background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.018));box-shadow:0 26px 65px rgba(0,0,0,.4),0 0 30px rgba(164,76,255,.12)}
.status-panel p{color:var(--professional-purple);font-weight:800;letter-spacing:1.2px;margin-bottom:14px}.status-panel ul{list-style:none}.status-panel li{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.08);color:#e8def2;font-size:.9rem}.status-panel li:last-child{border-bottom:0}.status-panel b{width:22px;height:22px;display:grid;place-items:center;border-radius:50%;background:#20d56f;color:#021208}
.professional-why{background:#05030d}.professional-feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;max-width:1200px;margin:0 auto}.professional-feature{padding:26px;border:1px solid rgba(164,76,255,.18);border-radius:17px;background:linear-gradient(160deg,rgba(255,255,255,.05),rgba(255,255,255,.015))}.professional-feature span{color:var(--professional-purple);font-size:.72rem;font-weight:800;letter-spacing:1.4px}.professional-feature h3{margin:14px 0 10px;font-size:1.35rem}.professional-feature p{color:var(--muted);line-height:1.65}
.professional-included{background:radial-gradient(circle at 50% 0,rgba(164,76,255,.1),transparent 30%),#080511}.professional-columns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;max-width:1280px;margin:0 auto}.professional-card{padding:34px;border:1px solid rgba(164,76,255,.25);border-radius:20px;background:linear-gradient(155deg,rgba(255,255,255,.06),rgba(255,255,255,.018));box-shadow:0 28px 75px rgba(0,0,0,.34)}.professional-card h3{margin:10px 0 20px;font-size:1.8rem}.professional-card ul{list-style:none}.professional-card li{position:relative;padding:8px 0 8px 22px;color:#e6def0}.professional-card li:before{content:"✓";position:absolute;left:0;color:var(--professional-purple);font-weight:900}
.professional-fit{background:#05030d}.professional-fit-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;max-width:1120px;margin:0 auto}.professional-fit-item{display:flex;align-items:center;gap:18px;padding:24px;border:1px solid rgba(255,255,255,.08);border-radius:16px;background:rgba(255,255,255,.025);transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}.professional-fit-item:hover{transform:translateY(-5px);border-color:rgba(164,76,255,.5);box-shadow:0 0 25px rgba(164,76,255,.1)}.professional-fit-item span{color:var(--professional-purple);font-size:.75rem;font-weight:800;letter-spacing:1.5px}
.professional-promise{background:#080511}.professional-promise-panel{max-width:1200px;margin:0 auto;padding:60px;border:1px solid rgba(164,76,255,.2);border-radius:28px;background:radial-gradient(circle at 50% 0,rgba(164,76,255,.13),transparent 35%),rgba(255,255,255,.025);text-align:center}.professional-promise-panel h2{max-width:850px;margin:0 auto;font-size:clamp(2.3rem,4.6vw,4.7rem);line-height:1.08}.professional-promise-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin-top:38px}.professional-promise-grid div{padding:18px 14px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.025);color:#eadff4}
.professional-cta{background:radial-gradient(circle at 50% 40%,rgba(164,76,255,.17),transparent 38%),linear-gradient(135deg,#080411,#1b0836)}.professional-cta .cta-panel small{color:#a897b9}
@media(max-width:1150px){.professional-hero{grid-template-columns:1fr;text-align:center;padding:115px 6% 80px}.professional-hero .hero-actions{justify-content:center}.status-panel{max-width:700px;margin:0 auto}.soc-stage{min-height:460px}.professional-feature-grid,.professional-columns,.professional-fit-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.professional-promise-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.professional-copy h1{letter-spacing:-2px}.soc-stage{min-height:370px}.soc-monitor{top:70px;height:210px}.professional-feature-grid,.professional-columns,.professional-fit-grid,.professional-promise-grid{grid-template-columns:1fr}.professional-promise-panel{padding:31px 23px}}

/* EXECUTIVE + LAUNCH */
.executive-page{--executive-gold:#d8b45a;--executive-gold-soft:#f2d892}.executive-label{color:var(--executive-gold)!important}.executive-hero{min-height:100vh;display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:70px;padding:145px 7% 85px;background:radial-gradient(circle at 75% 30%,rgba(216,180,90,.16),transparent 30%),linear-gradient(135deg,#060606,#101010 55%,#18140c);overflow:hidden}.executive-copy h1{margin:22px 0;font-size:clamp(3.7rem,7vw,7.4rem);line-height:.94;letter-spacing:-4px}.executive-copy h1 span{color:var(--executive-gold)}.executive-statement{margin-bottom:20px;color:var(--executive-gold-soft);font-size:1.18rem;font-weight:700}.executive-badge{display:inline-block;padding:8px 12px;border:1px solid rgba(216,180,90,.75);border-radius:999px;color:var(--executive-gold);font-size:.7rem;font-weight:800;letter-spacing:1.5px}.executive-primary-button,.executive-secondary-button{display:inline-block;padding:15px 24px;border-radius:10px;text-decoration:none;font-weight:800;transition:.22s}.executive-primary-button{border:1px solid var(--executive-gold);background:linear-gradient(135deg,#9f7a28,#d8b45a);color:#0a0803}.executive-secondary-button{border:1px solid rgba(216,180,90,.38);color:#fff;background:rgba(255,255,255,.025)}.executive-office{position:relative;min-height:540px}.skyline{position:absolute;inset:18px 5% 110px;display:flex;align-items:flex-end;gap:10px;opacity:.45}.skyline i{flex:1;border:1px solid rgba(216,180,90,.15);background:linear-gradient(180deg,rgba(216,180,90,.08),rgba(10,10,10,.3))}.skyline i:nth-child(1){height:38%}.skyline i:nth-child(2){height:58%}.skyline i:nth-child(3){height:72%}.skyline i:nth-child(4){height:48%}.skyline i:nth-child(5){height:80%}.skyline i:nth-child(6){height:62%}.skyline i:nth-child(7){height:44%}.executive-display{position:absolute;top:120px;height:250px;border:1px solid rgba(216,180,90,.22);border-radius:13px;background:linear-gradient(145deg,rgba(25,22,14,.95),rgba(5,5,5,.99));box-shadow:0 30px 75px rgba(0,0,0,.55);overflow:hidden}.display-left{left:1%;width:31%}.display-centre{left:34%;width:32%;display:grid;place-items:center;text-align:center}.display-right{right:1%;width:31%}.executive-mark{width:46px;height:46px;border:2px solid var(--executive-gold);transform:rotate(45deg)}.display-centre small{color:var(--executive-gold)}.executive-dashboard{display:grid;grid-template-columns:repeat(2,1fr);gap:15px;padding:28px}.executive-dashboard span{height:78px;border:1px solid rgba(216,180,90,.16);border-radius:8px}.executive-lines{padding:30px}.executive-lines span{display:block;height:8px;margin:22px 0;border-radius:999px;background:linear-gradient(90deg,var(--executive-gold),rgba(216,180,90,.05))}.executive-desk{position:absolute;left:0;right:0;bottom:48px;height:28px;background:linear-gradient(90deg,#1b160c,#493b1c,#1b160c)}.executive-glow{position:absolute;left:8%;right:8%;bottom:45px;height:28px;background:rgba(216,180,90,.18);filter:blur(30px)}.executive-story,.executive-concierge,.executive-promise{background:#080808}.executive-platform,.executive-fit{background:#0e0d0a}.executive-three-grid,.executive-fit-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;max-width:1200px;margin:auto}.executive-feature,.executive-fit-item{padding:30px;border:1px solid rgba(216,180,90,.18);border-radius:18px;background:rgba(255,255,255,.018)}.executive-feature span,.executive-fit-item span{color:var(--executive-gold);font-weight:800}.executive-concierge-panel{display:grid;grid-template-columns:1fr .95fr;gap:55px;max-width:1240px;margin:auto;padding:58px;border:1px solid rgba(216,180,90,.22);border-radius:28px;background:rgba(255,255,255,.018)}.concierge-copy h2{font-size:clamp(2.3rem,4.6vw,4.7rem)}.concierge-list{display:grid;gap:14px}.concierge-list div{padding:19px;border:1px solid rgba(255,255,255,.07);border-radius:14px}.executive-promise-panel{max-width:1200px;margin:auto;padding:60px;border:1px solid rgba(216,180,90,.18);border-radius:28px;text-align:center}.executive-promise-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-top:38px}.executive-promise-grid div{padding:18px;border:1px solid rgba(216,180,90,.12);border-radius:14px}.executive-cta{background:linear-gradient(135deg,#070707,#19150c)}.home-section{padding:105px 6%}.why-section{background:#050c18}.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:1200px;margin:auto}.why-card,.process-step{padding:30px;border:1px solid rgba(82,201,255,.15);border-radius:18px;background:rgba(255,255,255,.02)}.why-card span,.process-step span{color:var(--blue);font-weight:800}.process-section{background:#030914}.process-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;max-width:1300px;margin:auto}.contact-section{background:linear-gradient(135deg,#04101f,#06192d)}.contact-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;max-width:1200px;margin:auto}.contact-copy h2{font-size:clamp(2.7rem,5vw,5rem)}.contact-details{display:grid;gap:12px;margin-top:30px}.contact-details a,.contact-details span{color:#d8ebfb;text-decoration:none}.consultation-form{display:grid;gap:18px;padding:34px;border:1px solid rgba(82,201,255,.18);border-radius:22px;background:rgba(255,255,255,.035)}.consultation-form label{display:grid;gap:8px}.consultation-form input,.consultation-form select,.consultation-form textarea{padding:13px;border:1px solid rgba(255,255,255,.14);border-radius:9px;background:rgba(0,0,0,.25);color:#fff}.hidden-field{position:absolute;left:-9999px}.site-footer{padding:50px 6% 28px;background:#02060d}.footer-links{display:flex;gap:20px;flex-wrap:wrap;margin:30px 0}.footer-links a{color:#dce8f5;text-decoration:none}.footer-bottom{display:flex;justify-content:space-between;gap:20px;padding-top:22px;border-top:1px solid rgba(255,255,255,.07);color:#8295aa;font-size:.82rem}@media(max-width:1000px){.executive-hero,.executive-concierge-panel,.contact-layout{grid-template-columns:1fr}.executive-hero{text-align:center}.executive-three-grid,.executive-fit-grid,.why-grid,.executive-promise-grid,.process-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:720px){.executive-three-grid,.executive-fit-grid,.why-grid,.executive-promise-grid,.process-grid{grid-template-columns:1fr}.footer-bottom{flex-direction:column}}

/* =========================================================
   WORKSTATIONS — REAL PHOTOS AND SETUP VIDEO
   ========================================================= */

.workstations-page {
  background: #030914;
}

.workstations-hero {
  padding-top: 155px;
  background:
    radial-gradient(circle at 75% 25%, rgba(32, 155, 255, 0.18), transparent 32%),
    linear-gradient(135deg, #040b18, #082341);
}

.workstations-hero h1 {
  font-size: clamp(3.2rem, 7vw, 7rem);
  line-height: 0.98;
  letter-spacing: -3px;
}

.workstation-gallery {
  background: #050d1b;
}

.workstation-photo-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  max-width: 1260px;
  margin: 0 auto;
}

.workstation-photo-card {
  overflow: hidden;
  margin: 0;
  border: 1px solid rgba(78, 197, 255, 0.2);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.035);
  box-shadow: 0 24px 65px rgba(0, 0, 0, 0.28);
}

.workstation-photo-card img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  background: #020711;
}

.workstation-photo-card figcaption {
  display: grid;
  gap: 8px;
  padding: 22px;
}

.workstation-photo-card figcaption strong {
  font-size: 1.25rem;
}

.workstation-photo-card figcaption span {
  color: var(--muted);
  line-height: 1.6;
}

.workstation-video-section {
  background:
    radial-gradient(circle at 20% 30%, rgba(69, 197, 255, 0.12), transparent 34%),
    #020711;
}

.workstation-video-layout {
  display: grid;
  grid-template-columns: 0.85fr 1.15fr;
  gap: 55px;
  max-width: 1280px;
  margin: 0 auto;
  align-items: center;
}

.workstation-video-copy h2 {
  font-size: clamp(2.5rem, 5vw, 5rem);
  line-height: 1.05;
}

.workstation-video-copy > p:not(.section-label) {
  margin-top: 22px;
  color: var(--muted);
  line-height: 1.8;
}

.workstation-benefits {
  display: grid;
  gap: 12px;
  margin-top: 28px;
}

.workstation-benefits span {
  padding: 13px 16px;
  border: 1px solid rgba(78, 197, 255, 0.14);
  border-radius: 11px;
  background: rgba(255, 255, 255, 0.025);
}

.workstation-video-card {
  overflow: hidden;
  border: 1px solid rgba(78, 197, 255, 0.24);
  border-radius: 22px;
  background: #000;
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.42);
}

.workstation-video-card video {
  display: block;
  width: 100%;
  max-height: 720px;
  background: #000;
}

.workstation-receive {
  background: #061225;
}

.workstation-receive-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  max-width: 1180px;
  margin: 0 auto;
}

.workstations-cta {
  background:
    radial-gradient(circle at 50% 35%, rgba(55, 188, 255, 0.13), transparent 35%),
    linear-gradient(135deg, #030a16, #08213b);
}

@media (max-width: 980px) {
  .workstation-photo-grid,
  .workstation-receive-grid {
    grid-template-columns: 1fr 1fr;
  }

  .workstation-video-layout {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 680px) {
  .workstations-hero h1 {
    letter-spacing: -1.5px;
  }

  .workstation-photo-grid,
  .workstation-receive-grid {
    grid-template-columns: 1fr;
  }
}