/* ═══════════════════════════════════════════════════════════════════
    -------------------- cloud-migration page ----------------------- 
  ═══════════════════════════════════════════════════════════════════ */
  .cm__usp-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin: 36px 0 0;
  }
  .cm__usp {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 14px;
    padding: 16px 18px;
    transition: transform 0.3s var(--esds-ease), border-color 0.3s, background 0.3s;
    position: relative;
    overflow: hidden;
  }
  .cm__usp::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(0,97,255,0.08), transparent 60%);
    opacity: 0;
    transition: opacity 0.3s var(--esds-ease);
  }
  .cm__usp:hover {
    transform: translateY(-4px) rotate(-0.5deg);
    border-color: rgba(126,233,255,0.35);
    background: rgba(0,97,255,0.06);
  }
  .cm__usp:hover::before { opacity: 1; }
  .cm__usp__icon {
    font-size: 18px;
    margin-bottom: 8px;
    display: block;
    line-height: 1;
  }
  .cm__usp__text {
    font-size: 12.5px;
    font-weight: 700;
    color: #fff;
    line-height: 1.4;
    letter-spacing: -0.2px;
    position: relative;
    z-index: 1;
  }
  @media (max-width: 992px) { .cm__usp-strip { grid-template-columns: repeat(3, 1fr); } }
  @media (max-width: 640px) { .cm__usp-strip { grid-template-columns: repeat(2, 1fr); } }


  /* ═══════════════════════════════════════════════════════════════════
     §2 · EDITORIAL PULL-QUOTE (Section 2 from doc)
     "Exit Infrastructure Dependency. Enter Sovereign Control."
  ═══════════════════════════════════════════════════════════════════ */
  .cm__quote {
    text-align: center;
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 20px;
    position: relative;
  }
  .cm__quote::before, .cm__quote::after {
    content: '"';
    position: absolute;
    font-family: Georgia, serif;
    font-size: 140px;
    font-weight: 800;
    line-height: 1;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    opacity: 0.3;
    pointer-events: none;
  }
  .cm__quote::before {
    top: -50px; left: 0;
  }
  .cm__quote::after {
    bottom: -110px; right: 0;
  }
  .cm__quote__text {
    font-size: clamp(28px, 4.4vw, 52px);
    font-weight: 800;
    color: var(--esds-navy);
    line-height: 1.15;
    letter-spacing: -1.5px;
    margin: 0;
    font-style: italic;
  }
  .cm__quote__text em {
    font-style: italic;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
  }


  /* ═══════════════════════════════════════════════════════════════════
     §3 · CONTROL-PROBLEM NARRATIVE (Section 3 from doc)
     "You don't have a cloud problem... You have a control problem."
     Layout: editorial split — left "you don't have / you have" stack,
     right From → To list with Swaraj destination + 4 No-pillars
  ═══════════════════════════════════════════════════════════════════ */
  .cm__control {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
  }
  .cm__control__lead {
    font-size: clamp(28px, 3.8vw, 44px);
    font-weight: 800;
    color: var(--esds-navy);
    line-height: 1.15;
    letter-spacing: -1.2px;
    margin: 0 0 24px;
  }
  .cm__control__lead-strike {
    color: var(--esds-gray-300);
    text-decoration: line-through;
    text-decoration-thickness: 2px;
    text-decoration-color: var(--esds-red);
  }
  .cm__control__lead-mark {
    background: linear-gradient(120deg, transparent 0%, transparent 8%, rgba(239,68,68,0.18) 8%, rgba(239,68,68,0.18) 92%, transparent 92%);
    padding: 0 8px;
    color: var(--esds-red);
    font-weight: 800;
  }
  .cm__control__copy {
    font-size: 16px;
    color: var(--esds-gray-500);
    line-height: 1.75;
    margin: 0 0 14px;
  }
  .cm__control__copy strong {
    color: var(--esds-navy);
    font-weight: 800;
  }
  .cm__control__copy em {
    font-style: normal;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
  }

  /* From → To migration card */
  .cm__migration {
    background: linear-gradient(180deg, var(--esds-gray-50), #fff);
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 22px;
    padding: 36px 32px;
    position: relative;
    overflow: hidden;
  }
  .cm__migration::before {
    content: '';
    position: absolute;
    top: 0; right: 0;
    width: 200px; height: 200px;
    background: radial-gradient(circle, rgba(0,97,255,0.06), transparent 70%);
    pointer-events: none;
  }
  .cm__migration__from-label,
  .cm__migration__to-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 14px;
  }
  .cm__migration__from-label { color: var(--esds-red); }
  .cm__migration__to-label { color: var(--highlight-blue); }
  .cm__migration__from-list {
    list-style: none;
    padding: 0;
    margin: 0 0 24px;
  }
  .cm__migration__from-list li {
    font-size: 15px;
    color: var(--esds-gray-700);
    padding: 9px 0 9px 30px;
    position: relative;
    font-weight: 600;
  }
  .cm__migration__from-list li::before {
    content: '✕';
    position: absolute;
    left: 0; top: 9px;
    width: 20px; height: 20px;
    border-radius: 50%;
    background: rgba(239,68,68,0.1);
    color: var(--esds-red);
    display: grid;
    place-items: center;
    font-size: 11px;
    font-weight: 800;
  }
  .cm__migration__divider {
    text-align: center;
    margin: 22px 0;
    position: relative;
  }
  .cm__migration__divider::before {
    content: '';
    position: absolute;
    top: 50%; left: 0; right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--esds-gray-100), transparent);
  }
  .cm__migration__divider-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px; height: 44px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    font-size: 20px;
    font-weight: 800;
    box-shadow: 0 8px 22px rgba(0,97,255,0.25);
    position: relative;
    z-index: 1;
    animation: cm-down-bounce 2.4s ease-in-out infinite;
  }
  @keyframes cm-down-bounce {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(4px); }
  }
  .cm__migration__to {
    background: linear-gradient(135deg, var(--esds-navy), var(--esds-deep));
    border-radius: 14px;
    padding: 22px 24px;
    color: #fff;
    margin-bottom: 22px;
  }
  .cm__migration__to-name {
    font-size: 22px;
    font-weight: 800;
    letter-spacing: -0.5px;
    margin: 0;
    background: linear-gradient(135deg, #fff, var(--highlight-blue-light));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
  }
  .cm__migration__to-tag {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    color: var(--highlight-blue-light);
    letter-spacing: 0.08em;
    margin-top: 4px;
    font-weight: 700;
  }
  .cm__migration__pillars {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
  .cm__migration__pillar {
    background: rgba(0,97,255,0.04);
    border: 1px solid rgba(0,97,255,0.12);
    border-radius: 10px;
    padding: 10px 14px;
    font-size: 13px;
    font-weight: 700;
    color: var(--highlight-blue);
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .cm__migration__pillar::before {
    content: '✓';
    color: var(--esds-green);
    font-weight: 800;
  }
  .cm__migration__only {
    text-align: center;
    margin-top: 22px;
    padding-top: 22px;
    border-top: 1px dashed var(--esds-gray-100);
    font-size: clamp(20px, 2.4vw, 26px);
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: -0.5px;
  }
  .cm__control__ctas {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 8px;
  }
  .cm__btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 15px 28px;
    border-radius: 10px;
    font-size: 14.5px;
    font-weight: 700;
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    text-decoration: none;
    box-shadow: 0 6px 22px rgba(0,97,255,0.4);
    transition: all 0.25s var(--esds-ease);
  }
  .cm__btn-primary:hover { transform: translateY(-2px); box-shadow: 0 12px 32px rgba(0,97,255,0.55); color: #fff; }
  .cm__btn-ghost {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 15px 28px;
    border-radius: 10px;
    font-size: 14.5px;
    font-weight: 700;
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    color: var(--esds-navy);
    text-decoration: none;
    transition: all 0.25s var(--esds-ease);
  }
  .cm__btn-ghost:hover {
    border-color: var(--highlight-blue);
    color: var(--highlight-blue);
    transform: translateY(-2px);
  }
  @media (max-width: 992px) {
    .cm__control { grid-template-columns: 1fr; gap: 36px; }
  }


  /* ═══════════════════════════════════════════════════════════════════
     §4 · FRAGMENTED INFRASTRUCTURE PROBLEMS (Section 4 from doc)
     "Infrastructure was meant to give you control. Instead, it split it."
     4 problem cards with glassmorphism + edge-glow + animated stripes
  ═══════════════════════════════════════════════════════════════════ */
  .cm__problems-head {
    text-align: center;
    max-width: 760px;
    margin: 0 auto 56px;
  }
  .cm__problems-lead {
    font-size: clamp(28px, 3.8vw, 44px);
    font-weight: 800;
    color: #fff;
    line-height: 1.15;
    letter-spacing: -1.2px;
    margin: 0 0 16px;
  }
  .cm__problems-lead em {
    font-style: italic;
    color: var(--india-saffron);
    font-weight: 800;
  }
  .cm__problems-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
    margin-bottom: 48px;
  }
  .cm__problem-card {
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 18px;
    padding: 28px 28px 28px 78px;
    position: relative;
    backdrop-filter: blur(6px);
    transition: all 0.4s var(--esds-ease);
    overflow: hidden;
  }
  .cm__problem-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 4px; height: 100%;
    background: linear-gradient(180deg, var(--esds-red), #F87171);
    transform: scaleY(0.3);
    transform-origin: top;
    transition: transform 0.4s var(--esds-ease);
  }
  .cm__problem-card::after {
    content: '';
    position: absolute;
    top: 0; right: 0; bottom: 0;
    width: 200px;
    background: radial-gradient(ellipse at right, rgba(239,68,68,0.06), transparent 60%);
    opacity: 0;
    transition: opacity 0.4s var(--esds-ease);
    pointer-events: none;
  }
  .cm__problem-card:hover {
    transform: translateY(-4px);
    background: rgba(239,68,68,0.04);
    border-color: rgba(239,68,68,0.25);
  }
  .cm__problem-card:hover::before { transform: scaleY(1); }
  .cm__problem-card:hover::after  { opacity: 1; }
  .cm__problem-card__icon {
    position: absolute;
    left: 22px; top: 26px;
    width: 40px; height: 40px;
    border-radius: 12px;
    background: rgba(239,68,68,0.12);
    border: 1px solid rgba(239,68,68,0.2);
    color: #F87171;
    display: grid;
    place-items: center;
    font-size: 18px;
  }
  .cm__problem-card p {
    font-size: 15px;
    line-height: 1.65;
    color: var(--esds-gray-300);
    margin: 0;
  }
  .cm__problem-card p strong {
    color: #fff;
    font-weight: 700;
  }
  .cm__problems-closer {
    text-align: center;
    max-width: 720px;
    margin: 48px auto 0;
  }
  .cm__problems-closer-lead {
    font-size: clamp(22px, 2.6vw, 30px);
    font-weight: 800;
    color: #fff;
    line-height: 1.3;
    letter-spacing: -0.5px;
    margin: 0 0 16px;
  }
  .cm__problems-closer-lead em {
    font-style: italic;
    color: var(--highlight-blue-light);
    font-weight: 800;
  }
  .cm__problems-closer-tag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 22px;
    background: rgba(126,233,255,0.08);
    border: 1px solid rgba(126,233,255,0.3);
    border-radius: 100px;
    font-size: 13px;
    font-weight: 800;
    color: var(--highlight-blue-light);
    font-family: 'JetBrains Mono', monospace;
    letter-spacing: 0.06em;
  }
  @media (max-width: 768px) {
    .cm__problems-grid { grid-template-columns: 1fr; }
  }


  /* ═══════════════════════════════════════════════════════════════════
     §5 · ONE DECISION (Section 5 from doc)
     "One Decision. Total Infrastructure Control."
     Big editorial card with 3 pillars + 3 promises
  ═══════════════════════════════════════════════════════════════════ */
  .cm__decision {
    text-align: center;
    max-width: 940px;
    margin: 0 auto;
  }
  .cm__decision__title {
    font-size: clamp(30px, 4.2vw, 48px);
    font-weight: 800;
    color: var(--esds-navy);
    line-height: 1.1;
    letter-spacing: -1.5px;
    margin: 0 0 20px;
  }
  .cm__decision__title em {
    font-style: normal;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .cm__decision__sub {
    font-size: 17px;
    color: var(--esds-gray-500);
    line-height: 1.65;
    margin: 0 0 40px;
  }
  .cm__decision__sub strong {
    color: var(--esds-navy);
    font-weight: 800;
  }
  .cm__decision__pillars {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-bottom: 40px;
  }
  .cm__decision__pillar {
    background: linear-gradient(180deg, var(--esds-gray-50), #fff);
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 18px;
    padding: 26px 22px;
    transition: all 0.3s var(--esds-ease);
  }
  .cm__decision__pillar:hover {
    transform: translateY(-4px);
    border-color: var(--highlight-blue);
    box-shadow: 0 14px 38px rgba(0,97,255,0.10);
  }
  .cm__decision__pillar-icon {
    width: 44px; height: 44px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(0,97,255,0.12), rgba(126,233,255,0.18));
    display: grid;
    place-items: center;
    font-size: 20px;
    margin: 0 auto 14px;
  }
  .cm__decision__pillar-text {
    font-size: 14.5px;
    font-weight: 700;
    color: var(--esds-navy);
    line-height: 1.4;
    margin: 0;
  }
  .cm__decision__promises {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    max-width: 680px;
    margin: 0 auto;
  }
  .cm__decision__promise {
    padding: 16px 0;
    border-bottom: 1px dashed var(--esds-gray-100);
    font-size: 16px;
    color: var(--esds-gray-700);
    font-weight: 600;
    line-height: 1.5;
  }
  .cm__decision__promise:last-child { border-bottom: none; }
  .cm__decision__promise strong {
    color: var(--highlight-blue);
    font-weight: 800;
  }
  @media (max-width: 768px) {
    .cm__decision__pillars { grid-template-columns: 1fr; }
  }


  /* ═══════════════════════════════════════════════════════════════════
     §6 · MIGRATION PATHS — uses .journey-grid + .journey-card from main
     We just need a 4-column override and section-level extra
  ═══════════════════════════════════════════════════════════════════ */
  .cm__paths-head em {
    font-style: italic;
    color: var(--highlight-blue);
    font-weight: 800;
  }
  /* Override journey-grid to 4 columns for 4 migration paths */
  .cm__paths-grid {
    grid-template-columns: repeat(4, 1fr) !important;
  }
  @media (max-width: 1100px) {
    .cm__paths-grid { grid-template-columns: repeat(2, 1fr) !important; }
  }
  @media (max-width: 640px) {
    .cm__paths-grid { grid-template-columns: 1fr !important; }
  }
  /* Outcome badge inside journey-card */
  .cm__path-outcome {
    margin-top: auto;
    padding-top: 16px;
    border-top: 1px solid var(--esds-gray-100);
    font-size: 12.5px;
    color: var(--esds-gray-700);
    line-height: 1.5;
    font-weight: 600;
  }
  .cm__path-outcome strong {
    color: var(--highlight-blue);
    font-weight: 800;
    text-transform: uppercase;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    letter-spacing: 0.08em;
    display: block;
    margin-bottom: 6px;
  }


  /* ═══════════════════════════════════════════════════════════════════
     §7 · TRANSFORMATION OUTCOMES (Section 7 from doc)
     "We don't move infrastructure. We transform how it performs."
     6 metrics with animated counters
  ═══════════════════════════════════════════════════════════════════ */
  .cm__outcomes-lead {
    font-style: italic;
    font-size: clamp(26px, 3.4vw, 38px);
    font-weight: 800;
    color: #fff;
    line-height: 1.2;
    letter-spacing: -0.8px;
    text-align: center;
    max-width: 920px;
    margin: 0 auto 56px;
  }
  .cm__outcomes-lead em {
    font-style: italic;
    background: linear-gradient(135deg, var(--highlight-blue-light), #fff);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
  }
  .cm__outcomes-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
  }
  .cm__outcome-card {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 18px;
    padding: 32px 28px;
    transition: all 0.4s var(--esds-ease);
    position: relative;
    overflow: hidden;
  }
  .cm__outcome-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 3px;
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.5s var(--esds-ease);
  }
  .cm__outcome-card:hover {
    background: rgba(0,97,255,0.06);
    border-color: rgba(126,233,255,0.3);
    transform: translateY(-4px);
  }
  .cm__outcome-card:hover::before { transform: scaleX(1); }
  .cm__outcome-card__num {
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(34px, 4vw, 48px);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -1.5px;
    background: linear-gradient(135deg, #fff, var(--highlight-blue-light));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    margin: 0 0 12px;
    display: block;
  }
  .cm__outcome-card__lbl {
    font-size: 14.5px;
    color: var(--esds-gray-300);
    line-height: 1.55;
    font-weight: 600;
    margin: 0;
  }
  .cm__outcome-card__lbl strong {
    color: #fff;
    font-weight: 700;
  }
  @media (max-width: 992px) { .cm__outcomes-grid { grid-template-columns: repeat(2, 1fr); } }
  @media (max-width: 540px) { .cm__outcomes-grid { grid-template-columns: 1fr; } }


  /* ═══════════════════════════════════════════════════════════════════
     §8 · 6R FRAMEWORK — uses .why-grid + .why-card + .why-card__num from main
     Override: 6-column grid (2 rows of 3, or 3 rows of 2)
  ═══════════════════════════════════════════════════════════════════ */
  .cm__re-grid {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  @media (max-width: 1024px) { .cm__re-grid { grid-template-columns: repeat(2, 1fr) !important; } }
  @media (max-width: 640px)  { .cm__re-grid { grid-template-columns: 1fr !important; } }
  /* RE-prefix label inside why-card */
  .cm__re-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.08em;
    margin-bottom: 6px;
    text-transform: uppercase;
  }
  .cm__re-tagline {
    text-align: center;
    margin-top: 36px;
    padding-top: 32px;
    border-top: 1px dashed var(--esds-gray-100);
    font-size: 17px;
    font-weight: 700;
    color: var(--esds-gray-700);
    font-style: italic;
  }
  .cm__re-tagline strong {
    color: var(--highlight-blue);
    font-style: normal;
    font-weight: 800;
  }


  /* ═══════════════════════════════════════════════════════════════════
     §9 · 5-STEP PROCESS — uses .process-steps from main (§52)
     Override: 5-column grid + Downtime callout below
  ═══════════════════════════════════════════════════════════════════ */
  .cm__process-grid {
    grid-template-columns: repeat(5, 1fr) !important;
  }
  @media (max-width: 1024px) {
    .cm__process-grid { grid-template-columns: repeat(3, 1fr) !important; }
  }
  @media (max-width: 640px) {
    .cm__process-grid { grid-template-columns: repeat(2, 1fr) !important; }
  }
  .cm__downtime-callout {
    text-align: center;
    margin-top: 48px;
    display: inline-flex;
    align-items: center;
    gap: 14px;
    padding: 18px 36px;
    background: linear-gradient(135deg, rgba(16,185,129,0.08), rgba(0,97,255,0.06));
    border: 1.5px dashed rgba(16,185,129,0.3);
    border-radius: 100px;
    font-size: clamp(18px, 2.2vw, 22px);
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.4px;
  }
  .cm__downtime-callout-icon {
    font-size: 26px;
  }
  .cm__downtime-callout strong {
    background: linear-gradient(135deg, var(--esds-green), var(--highlight-blue));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .cm__downtime-wrap {
    text-align: center;
    margin-top: 0;
  }


  /* ═══════════════════════════════════════════════════════════════════
     §10 · WHY-PILLARS (Section 10 from doc) — uses .feature-grid from main
     Page-specific: pillar icon block
  ═══════════════════════════════════════════════════════════════════ */
  .cm__pillar-icon {
    width: 56px; height: 56px;
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(0,97,255,0.12), rgba(126,233,255,0.18));
    display: grid;
    place-items: center;
    margin-bottom: 18px;
    font-size: 24px;
    border: 1px solid rgba(0,97,255,0.15);
    transition: all 0.3s var(--esds-ease);
  }
  .feature-card:hover .cm__pillar-icon {
    transform: scale(1.05) rotate(-3deg);
    background: linear-gradient(135deg, rgba(0,97,255,0.2), rgba(126,233,255,0.25));
  }
  .cm__pillar-metric {
    font-family: 'JetBrains Mono', monospace;
    font-size: 13px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.04em;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px dashed var(--esds-gray-100);
    display: block;
  }


  /* ═══════════════════════════════════════════════════════════════════
     §11 · COMPARISON TABLE — uses .compare-wrap + .compare-table from main (§21)
     No new classes needed; section header handled by main classes
  ═══════════════════════════════════════════════════════════════════ */


  /* ═══════════════════════════════════════════════════════════════════
     Section 12 · Final CTA tagline (preceding page-cta)
     "Why are you still managing all of it?"
  ═══════════════════════════════════════════════════════════════════ */
  .cm__final-tease {
    text-align: center;
    max-width: 720px;
    margin: 0 auto;
    padding: 56px 0 0;
  }
  .cm__final-tease p {
    font-size: clamp(20px, 2.4vw, 26px);
    font-weight: 700;
    color: var(--esds-gray-300);
    line-height: 1.5;
    margin: 0;
  }
  .cm__final-tease p strong { color: #fff; font-weight: 800; }
  .cm__final-tease__q {
    font-size: clamp(32px, 4.2vw, 48px) !important;
    font-weight: 800 !important;
    color: #fff !important;
    line-height: 1.1 !important;
    letter-spacing: -1.2px;
    margin: 18px 0 0 !important;
  }
  .cm__final-tease__q em {
    font-style: italic;
    color: var(--highlight-blue-light);
    font-weight: 800;
  }

 /* ═══════════════════════════════════════════════════════════════════
    -------------------- cloud-migration page ----------------------- 
  ═══════════════════════════════════════════════════════════════════ */

 /* ═══════════════════════════════════════════════════════════════════
    -------------------- data center services page ----------------------- 
  ═══════════════════════════════════════════════════════════════════ */

.dc__loc-intro {
    font-size: 17px;
    line-height: 1.75;
    color: var(--esds-gray-500);
    max-width: 820px;
    margin: 0 auto 56px;
    text-align: center;
  }
  .dc__loc-intro strong { color: var(--esds-navy); font-weight: 700; }

  /* Storyboard 2-col grid: sticky index + scrolling cards */
  .dc__loc-storyboard {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 56px;
    align-items: start;
    position: relative;
  }

  /* Sticky left index */
  .dc__loc-index {
    position: sticky;
    top: 100px;
    padding: 4px 0;
    align-self: start;
  }
  .dc__loc-index__head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--esds-gray-500);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 18px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--esds-gray-100);
  }
  .dc__loc-index__count {
    color: var(--highlight-blue);
    letter-spacing: 0.05em;
  }
  .dc__loc-index__list {
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
  }
  /* Vertical rail behind dots */
  .dc__loc-index__list::before {
    content: '';
    position: absolute;
    left: 11px;
    top: 18px;
    bottom: 18px;
    width: 2px;
    background: linear-gradient(180deg,
      var(--esds-gray-200) 0%,
      var(--highlight-blue) 35%,
      var(--highlight-blue-light) 70%,
      var(--india-saffron) 100%);
    opacity: 0.4;
    z-index: 0;
  }
  .dc__loc-index__item {
    position: relative;
    padding: 10px 14px 10px 36px;
    margin-bottom: 4px;
    cursor: pointer;
    border-radius: 8px;
    transition: all 0.3s ease;
    background: transparent;
    border: 0;
    display: block;
    width: 100%;
    text-align: left;
    font-family: inherit;
  }
  .dc__loc-index__item::before {
    content: '';
    position: absolute;
    left: 7px;
    top: 50%;
    transform: translateY(-50%);
    width: 10px; height: 10px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid var(--esds-gray-200);
    transition: all 0.3s ease;
    z-index: 1;
  }
  .dc__loc-index__item:hover {
    background: var(--esds-gray-50);
  }
  .dc__loc-index__item:hover::before {
    border-color: var(--highlight-blue);
  }
  .dc__loc-index__item.is-active {
    background: rgba(0,97,255,0.05);
  }
  .dc__loc-index__item.is-active::before {
    background: var(--highlight-blue);
    border-color: var(--highlight-blue-light);
    box-shadow: 0 0 0 4px rgba(126,233,255,0.18);
    width: 12px; height: 12px;
    left: 6px;
  }
  /* Coming-soon item gets saffron dot */
  .dc__loc-index__item--coming::before {
    background: rgba(244,166,35,0.12) !important;
    border-color: rgba(244,166,35,0.5) !important;
    border-style: dashed !important;
  }
  .dc__loc-index__item--coming.is-active::before {
    background: #F4A623 !important;
    border-color: rgba(244,166,35,0.5) !important;
    box-shadow: 0 0 0 4px rgba(244,166,35,0.18) !important;
  }
  .dc__loc-index__num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: var(--esds-gray-400);
    letter-spacing: 0.1em;
    display: block;
    margin-bottom: 2px;
    transition: color 0.3s ease;
  }
  .dc__loc-index__name {
    font-size: 13.5px;
    font-weight: 700;
    color: var(--esds-gray-700);
    letter-spacing: -0.2px;
    transition: color 0.3s ease;
  }
  .dc__loc-index__item.is-active .dc__loc-index__num {
    color: var(--highlight-blue);
  }
  .dc__loc-index__item.is-active .dc__loc-index__name {
    color: var(--esds-navy);
    font-weight: 800;
  }
  .dc__loc-index__item--coming .dc__loc-index__name {
    color: var(--esds-gray-500);
    font-style: italic;
  }
  .dc__loc-index__item--coming.is-active .dc__loc-index__name {
    color: #B87705;
  }
  .dc__loc-index__item--coming .dc__loc-index__num {
    color: rgba(244,166,35,0.7);
  }

  /* Right column: scrolling card stack */
  .dc__loc-stack {
    display: grid;
    gap: 28px;
  }
  .dc__loc-card {
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 22px;
    overflow: hidden;
    scroll-margin-top: 100px;
    opacity: 0;
    transform: translateY(30px);
    transition:
      opacity 0.7s var(--esds-ease),
      transform 0.7s var(--esds-ease),
      border-color 0.3s ease,
      box-shadow 0.3s ease;
    position: relative;
  }
  .dc__loc-card.is-revealed {
    opacity: 1;
    transform: translateY(0);
  }
  .dc__loc-card:hover {
    border-color: rgba(0,97,255,0.4);
    box-shadow: 0 14px 40px rgba(0,97,255,0.08);
  }
  .dc__loc-card.is-active {
    border-color: var(--highlight-blue);
    box-shadow: 0 18px 48px rgba(0,97,255,0.12);
  }
  /* Left accent rail that grows when active */
  .dc__loc-card::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 4px;
    background: linear-gradient(180deg, var(--highlight-blue), var(--highlight-blue-light));
    transform: scaleY(0);
    transform-origin: top;
    transition: transform 0.5s var(--esds-ease);
    z-index: 4;
  }
  .dc__loc-card.is-active::before {
    transform: scaleY(1);
  }

  /* Photo zone — kept dark navy ("DC interior" aesthetic on light section) */
  .dc__loc-photo {
    aspect-ratio: 16/8;
    background: linear-gradient(135deg, #0F1A2D, #060B17);
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid rgba(255,255,255,0.05);
  }
  .dc__loc-photo::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
      linear-gradient(rgba(126,233,255,0.05) 1px, transparent 1px),
      linear-gradient(90deg, rgba(126,233,255,0.05) 1px, transparent 1px);
    background-size: 32px 32px;
    pointer-events: none;
  }
  .dc__loc-photo::after {
    content: '';
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 320px; height: 280px;
    background: radial-gradient(circle, rgba(0,97,255,0.18), transparent 70%);
    pointer-events: none;
    transition: opacity 0.5s ease;
  }
  .dc__loc-card.is-active .dc__loc-photo::after {
    opacity: 1.6;
  }
  /* Big watermark "0X" in top-right */
  .dc__loc-photo__watermark {
    position: absolute;
    top: 14px; right: 22px;
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(56px, 8vw, 92px);
    font-weight: 800;
    letter-spacing: -3px;
    background: linear-gradient(135deg, rgba(126,233,255,0.18), rgba(0,97,255,0.04));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    line-height: 1;
    z-index: 1;
    pointer-events: none;
    transition: transform 0.5s ease;
  }
  .dc__loc-card.is-active .dc__loc-photo__watermark {
    transform: scale(1.06);
  }
  /* Animated scan line — sweeps left-to-right when card reveals */
  .dc__loc-photo__scan {
    position: absolute;
    top: 0; bottom: 0;
    left: -120px;
    width: 100px;
    background: linear-gradient(90deg,
      transparent,
      rgba(126,233,255,0.12),
      rgba(126,233,255,0.4),
      rgba(126,233,255,0.12),
      transparent);
    z-index: 3;
    pointer-events: none;
    opacity: 0;
  }
  .dc__loc-card.is-revealed .dc__loc-photo__scan {
    animation: dc-scan-sweep 2.4s ease-in-out 0.4s both;
  }
  @keyframes dc-scan-sweep {
    0%   { left: -120px; opacity: 0; }
    25%  { opacity: 1; }
    75%  { opacity: 1; }
    100% { left: calc(100% + 20px); opacity: 0; }
  }
  /* Status pill */
  .dc__loc-photo__status {
    position: absolute;
    top: 16px; left: 18px;
    background: rgba(16,185,129,0.15);
    border: 1px solid rgba(16,185,129,0.3);
    color: #34D399;
    padding: 5px 12px;
    border-radius: 100px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.08em;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 6px;
  }
  .dc__loc-photo__status::before {
    content: '';
    width: 6px; height: 6px;
    border-radius: 50%;
    background: #34D399;
    box-shadow: 0 0 0 0 rgba(52,211,153,0.6);
    animation: dc-status-pulse 1.8s ease-in-out infinite;
  }
  @keyframes dc-status-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(52,211,153,0.6); }
    50%      { box-shadow: 0 0 0 6px rgba(52,211,153,0); }
  }
  /* Mini server rack visual (kept) */
  .dc__loc-rack {
    position: absolute;
    bottom: 22px; left: 50%;
    transform: translateX(-50%);
    width: 92px; height: 132px;
    border-radius: 6px;
    background: linear-gradient(180deg, #1B2838, #0F1D32);
    border: 1px solid rgba(126,233,255,0.18);
    box-shadow: 0 8px 24px rgba(0,0,0,0.5);
    display: flex;
    flex-direction: column;
    padding: 7px 5px;
    gap: 3px;
    z-index: 2;
  }
  .dc__loc-rack::before {
    content: '';
    position: absolute;
    top: -6px; left: 50%;
    transform: translateX(-50%);
    width: 30px; height: 9px;
    background: linear-gradient(180deg, #0a1422, #060B17);
    border-radius: 3px 3px 0 0;
  }
  .dc__loc-rack span {
    flex: 1;
    background: rgba(126,233,255,0.06);
    border-radius: 2px;
    border-left: 2px solid rgba(126,233,255,0.4);
    box-shadow: inset 0 0 4px rgba(0,0,0,0.3);
  }
  .dc__loc-rack span:nth-child(2) { border-left-color: rgba(16,185,129,0.6); }
  .dc__loc-rack span:nth-child(3) { border-left-color: rgba(126,233,255,0.4); }
  .dc__loc-rack span:nth-child(4) { border-left-color: rgba(255,107,53,0.5); }
  .dc__loc-rack span:nth-child(5) { border-left-color: rgba(126,233,255,0.4); }

  /* Card body — light bg version */
  .dc__loc-body {
    padding: 30px 36px 34px;
  }
  .dc__loc-tagline {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    color: var(--india-saffron);
    letter-spacing: 0.06em;
    margin: 0 0 10px;
    line-height: 1.5;
    text-transform: uppercase;
    opacity: 0;
    transform: translateY(12px);
    transition: opacity 0.55s ease 0.1s, transform 0.55s ease 0.1s;
  }
  .dc__loc-card.is-revealed .dc__loc-tagline {
    opacity: 1;
    transform: translateY(0);
  }
  .dc__loc-name {
    font-size: clamp(28px, 3.6vw, 40px);
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -1px;
    margin: 0 0 16px;
    line-height: 1.05;
    opacity: 0;
    transform: translateY(12px);
    transition: opacity 0.55s ease 0.2s, transform 0.55s ease 0.2s;
  }
  .dc__loc-card.is-revealed .dc__loc-name {
    opacity: 1;
    transform: translateY(0);
  }
  .dc__loc-narrative {
    font-size: 14.5px;
    color: var(--esds-gray-600);
    line-height: 1.75;
    margin: 0 0 22px;
    opacity: 0;
    transform: translateY(12px);
    transition: opacity 0.55s ease 0.3s, transform 0.55s ease 0.3s;
  }
  .dc__loc-card.is-revealed .dc__loc-narrative {
    opacity: 1;
    transform: translateY(0);
  }
  .dc__loc-narrative strong { color: var(--esds-navy); font-weight: 700; }
  .dc__loc-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding-top: 18px;
    border-top: 1px solid var(--esds-gray-100);
    opacity: 0;
    transform: translateY(12px);
    transition: opacity 0.55s ease 0.4s, transform 0.55s ease 0.4s;
  }
  .dc__loc-card.is-revealed .dc__loc-tags {
    opacity: 1;
    transform: translateY(0);
  }
  .dc__loc-tag {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--highlight-blue);
    background: rgba(0,97,255,0.06);
    border: 1px solid rgba(0,97,255,0.15);
    padding: 4px 10px;
    border-radius: 6px;
    letter-spacing: 0.04em;
    transition: all 0.2s ease;
  }
  .dc__loc-tag:hover {
    background: rgba(0,97,255,0.12);
    border-color: var(--highlight-blue);
    transform: translateY(-1px);
  }

  /* CEL Sahibabad coming-soon (light version) */
  .dc__loc-coming {
    background: linear-gradient(135deg, rgba(244,166,35,0.06), rgba(255,107,53,0.04));
    border: 1.5px dashed rgba(244,166,35,0.35);
    border-radius: 22px;
    padding: 28px 32px;
    display: grid;
    grid-template-columns: 1fr 1.6fr 1fr;
    align-items: center;
    gap: 24px;
    scroll-margin-top: 100px;
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.7s var(--esds-ease), transform 0.7s var(--esds-ease);
  }
  .dc__loc-coming.is-revealed {
    opacity: 1;
    transform: translateY(0);
  }
  .dc__loc-coming__name {
    font-size: 26px;
    font-weight: 800;
    background: linear-gradient(135deg, #F4A623, #FF6B35);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    margin: 0 0 6px;
    letter-spacing: -0.5px;
  }
  .dc__loc-coming__tagline {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    color: #B87705;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin: 0;
  }
  .dc__loc-coming__copy {
    font-size: 13.5px;
    line-height: 1.7;
    color: var(--esds-gray-600);
    font-style: italic;
    margin: 0;
  }
  .dc__loc-coming__copy strong {
    color: var(--esds-navy);
    font-style: normal;
    font-weight: 700;
  }
  .dc__loc-coming__pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(244,166,35,0.12);
    border: 1px solid rgba(244,166,35,0.4);
    color: #B87705;
    padding: 8px 16px;
    border-radius: 100px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.06em;
    justify-self: end;
    white-space: nowrap;
  }
  /* Closing italic line */
  .dc__loc-closer {
    font-style: italic;
    font-size: clamp(18px, 2.4vw, 24px);
    font-weight: 800;
    color: var(--esds-gray-700);
    text-align: center;
    max-width: 820px;
    margin: 56px auto 0;
    line-height: 1.5;
  }
  .dc__loc-closer strong { color: var(--esds-navy); }
  .dc__loc-closer em {
    font-style: italic;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
  }
  /* Responsive */
  @media (max-width: 1024px) {
    .dc__loc-storyboard {
      grid-template-columns: 1fr;
      gap: 36px;
    }
    .dc__loc-index { display: none; }
  }
  @media (max-width: 640px) {
    .dc__loc-coming { grid-template-columns: 1fr; text-align: center; gap: 14px; }
    .dc__loc-coming__pill { justify-self: center; }
  }
  @media (prefers-reduced-motion: reduce) {
    .dc__loc-card,
    .dc__loc-coming,
    .dc__loc-tagline,
    .dc__loc-name,
    .dc__loc-narrative,
    .dc__loc-tags {
      opacity: 1 !important;
      transform: none !important;
      transition: none !important;
    }
    .dc__loc-photo__scan { animation: none !important; }
  }


     §3 · ENGINEERING STANDARDS — 6 specs cards
     Uses .feature-grid + .feature-card; page-specific styling for icon
     and dense bullet list inside.
  ═══════════════════════════════════════════════════════════════════ */
  .dc__spec-icon {
    width: 56px; height: 56px;
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(0,97,255,0.12), rgba(126,233,255,0.18));
    display: grid;
    place-items: center;
    margin-bottom: 18px;
    font-size: 26px;
    border: 1px solid rgba(0,97,255,0.15);
    transition: all 0.35s var(--esds-ease);
  }
  .feature-card:hover .dc__spec-icon {
    transform: scale(1.08) rotate(-4deg);
    background: linear-gradient(135deg, rgba(0,97,255,0.2), rgba(126,233,255,0.28));
  }
  .dc__spec-bullets {
    list-style: none;
    padding: 0;
    margin: 14px 0 0;
  }
  .dc__spec-bullets li {
    font-size: 12.5px;
    color: var(--esds-gray-700);
    line-height: 1.55;
    padding: 5px 0 5px 22px;
    position: relative;
  }
  .dc__spec-bullets li::before {
    content: '';
    position: absolute;
    left: 0; top: 12px;
    width: 12px; height: 2px;
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
    border-radius: 2px;
  }
  .dc__spec-callout {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px dashed var(--esds-gray-100);
    font-size: 12.5px;
    font-weight: 700;
    color: var(--highlight-blue);
    font-style: italic;
    line-height: 1.5;
  }


  /* ═══════════════════════════════════════════════════════════════════
     §4 · PHYSICAL SECURITY (7 layers) — uses .seclayer-grid from §58
     §58 already gives us 4-col grid. We override to 7-col (with responsive)
     for the 7 layers.
  ═══════════════════════════════════════════════════════════════════ */
  .dc__sec-grid {
    grid-template-columns: repeat(7, 1fr) !important;
  }
  @media (max-width: 1280px) { .dc__sec-grid { grid-template-columns: repeat(4, 1fr) !important; } }
  @media (max-width: 768px)  { .dc__sec-grid { grid-template-columns: repeat(2, 1fr) !important; } }
  @media (max-width: 480px)  { .dc__sec-grid { grid-template-columns: 1fr !important; } }
  .dc__sec-intro {
    font-size: 16px;
    line-height: 1.75;
    color: var(--esds-gray-500);
    max-width: 820px;
    margin: 0 auto 48px;
    text-align: center;
  }
  .dc__sec-intro strong { color: var(--esds-navy); font-weight: 700; }
  .dc__sec-closer {
    font-style: italic;
    font-size: clamp(17px, 2.2vw, 22px);
    font-weight: 800;
    color: var(--esds-navy);
    text-align: center;
    margin: 48px auto 0;
    letter-spacing: -0.4px;
  }
  .dc__sec-closer em {
    font-style: italic;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }


  /* ═══════════════════════════════════════════════════════════════════
     §5 · SUSTAINABILITY — uses .green-split + .green-stat (§59) +
     .timeline-v (§17 for FY roadmap). Page-specific extensions.
  ═══════════════════════════════════════════════════════════════════ */
  .dc__sus-lead {
    text-align: center;
    max-width: 820px;
    margin: 0 auto 48px;
    font-size: 16px;
    line-height: 1.75;
    color: var(--esds-gray-500);
  }
  .dc__sus-lead strong { color: var(--esds-navy); font-weight: 700; }
  /* Override .green-stats-grid to 3-col for the 3 hero stats */
  .dc__sus-stats { grid-template-columns: repeat(3, 1fr) !important; }
  @media (max-width: 768px) { .dc__sus-stats { grid-template-columns: 1fr !important; } }
  /* Big numeric value inside .green-stat */
  .dc__sus-stat__num {
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(28px, 3.6vw, 42px);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -1.5px;
    background: linear-gradient(135deg, var(--esds-green), var(--highlight-blue));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    margin: 0 0 8px;
    display: block;
  }
  /* 3 narrative blocks below stats */
  .dc__sus-narrative {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 48px;
  }
  .dc__sus-block {
    background: #fff;
    border: 1.5px solid rgba(16,185,129,0.18);
    border-radius: 18px;
    padding: 28px 26px;
    transition: all 0.3s var(--esds-ease);
  }
  .dc__sus-block:hover {
    transform: translateY(-4px);
    border-color: var(--esds-green);
    box-shadow: 0 12px 32px rgba(16,185,129,0.10);
  }
  .dc__sus-block__icon {
    width: 48px; height: 48px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(16,185,129,0.12), rgba(0,97,255,0.10));
    display: grid;
    place-items: center;
    margin-bottom: 14px;
    font-size: 22px;
  }
  .dc__sus-block h4 {
    font-size: 16px;
    font-weight: 800;
    color: var(--esds-navy);
    margin: 0 0 10px;
    letter-spacing: -0.3px;
  }
  .dc__sus-block p {
    font-size: 13px;
    color: var(--esds-gray-600);
    line-height: 1.7;
    margin: 0;
  }
  .dc__sus-block p strong { color: var(--esds-navy); font-weight: 700; }
  /* Award recognition pill */
  .dc__sus-award {
    margin: 48px auto 0;
    max-width: 760px;
    text-align: center;
    padding: 24px 28px;
    background: linear-gradient(135deg, rgba(244,166,35,0.06), rgba(255,107,53,0.04));
    border: 1.5px solid rgba(244,166,35,0.25);
    border-radius: 18px;
  }
  .dc__sus-award__pre {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: #B87705;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 10px;
    display: block;
  }
  .dc__sus-award__title {
    font-size: 17px;
    font-weight: 800;
    color: var(--esds-navy);
    margin: 0 0 6px;
    letter-spacing: -0.3px;
  }
  .dc__sus-award__copy {
    font-size: 13px;
    color: var(--esds-gray-500);
    line-height: 1.6;
    margin: 0;
    font-style: italic;
  }
  /* Roadmap timeline — extends .timeline-v with 3-column horizontal layout */
  .dc__roadmap-head {
    text-align: center;
    margin: 64px auto 32px;
    max-width: 760px;
  }
  .dc__roadmap-head h3 {
    font-size: clamp(22px, 2.6vw, 30px);
    font-weight: 800;
    color: var(--esds-navy);
    margin: 0;
    letter-spacing: -0.5px;
  }
  .dc__roadmap-head h3 em {
    font-style: normal;
    background: linear-gradient(135deg, var(--esds-green), var(--highlight-blue));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .dc__roadmap-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    position: relative;
  }
  .dc__roadmap-grid::before {
    content: '';
    position: absolute;
    top: 32px;
    left: 14%;
    right: 14%;
    height: 2px;
    background: linear-gradient(90deg, var(--esds-green), var(--highlight-blue), var(--highlight-blue-light));
    z-index: 0;
    opacity: 0.4;
  }
  .dc__roadmap-step {
    position: relative;
    z-index: 1;
    text-align: center;
    padding: 0 20px;
  }
  .dc__roadmap-step__dot {
    width: 64px; height: 64px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.06em;
    display: grid;
    place-items: center;
    margin: 0 auto 18px;
    box-shadow: 0 8px 22px rgba(0,97,255,0.3);
    border: 4px solid #fff;
  }
  .dc__roadmap-step--green .dc__roadmap-step__dot {
    background: linear-gradient(135deg, var(--esds-green), #34D399);
    box-shadow: 0 8px 22px rgba(16,185,129,0.3);
  }
  .dc__roadmap-step__year {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 8px;
    display: block;
  }
  .dc__roadmap-step__title {
    font-size: 18px;
    font-weight: 800;
    color: var(--esds-navy);
    margin: 0 0 10px;
    letter-spacing: -0.3px;
  }
  .dc__roadmap-step__copy {
    font-size: 13px;
    color: var(--esds-gray-500);
    line-height: 1.65;
    margin: 0;
  }
  .dc__roadmap-step__copy strong { color: var(--esds-navy); font-weight: 700; }
  /* Closing italic */
  .dc__sus-closer {
    font-style: italic;
    font-size: clamp(17px, 2.2vw, 22px);
    font-weight: 700;
    color: var(--esds-gray-700);
    text-align: center;
    max-width: 820px;
    margin: 56px auto 0;
    line-height: 1.5;
  }
  .dc__sus-closer em {
    font-style: italic;
    background: linear-gradient(135deg, var(--esds-green), var(--highlight-blue));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
  }
  @media (max-width: 992px) {
    .dc__sus-narrative { grid-template-columns: 1fr; }
    .dc__roadmap-grid { grid-template-columns: 1fr; gap: 32px; }
    .dc__roadmap-grid::before { display: none; }
  }


  /* ═══════════════════════════════════════════════════════════════════
     §6 · COMPLIANCE — 7 audience pills (highlighted differently per doc)
     Same proven pattern from Colocation page
  ═══════════════════════════════════════════════════════════════════ */
  .dc__compliance {
    text-align: center;
    max-width: 920px;
    margin: 0 auto;
  }
  .dc__rooms {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 0 auto 36px;
    max-width: 880px;
  }
  .dc__room {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 100px;
    font-size: 13px;
    font-weight: 700;
    color: var(--esds-gray-700);
    letter-spacing: -0.2px;
    transition: all 0.3s var(--esds-ease);
    cursor: default;
  }
  .dc__room::before {
    content: '';
    width: 8px; height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
  }
  .dc__room:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 22px rgba(0,97,255,0.12);
  }
  .dc__room--1 { border-color: rgba(0,97,255,0.3); }
  .dc__room--1::before { background: var(--highlight-blue); }
  .dc__room--1:hover { background: rgba(0,97,255,0.06); color: var(--highlight-blue); border-color: var(--highlight-blue); }
  .dc__room--2 { border-color: rgba(126,233,255,0.4); }
  .dc__room--2::before { background: var(--highlight-blue-light); }
  .dc__room--2:hover { background: rgba(126,233,255,0.08); color: #0a1f4f; border-color: var(--highlight-blue-light); }
  .dc__room--3 { border-color: rgba(255,107,53,0.3); }
  .dc__room--3::before { background: var(--india-saffron); }
  .dc__room--3:hover { background: rgba(255,107,53,0.06); color: var(--india-saffron); border-color: var(--india-saffron); }
  .dc__room--4 { border-color: rgba(244,166,35,0.35); }
  .dc__room--4::before { background: #F4A623; }
  .dc__room--4:hover { background: rgba(244,166,35,0.08); color: #b87705; border-color: #F4A623; }
  .dc__room--5 { border-color: rgba(16,185,129,0.3); }
  .dc__room--5::before { background: var(--esds-green); }
  .dc__room--5:hover { background: rgba(16,185,129,0.06); color: var(--esds-green); border-color: var(--esds-green); }
  .dc__room--6 { border-color: rgba(99,102,241,0.3); }
  .dc__room--6::before { background: #6366F1; }
  .dc__room--6:hover { background: rgba(99,102,241,0.06); color: #6366F1; border-color: #6366F1; }
  .dc__room--7 { border-color: rgba(19,136,8,0.3); }
  .dc__room--7::before { background: var(--india-green); }
  .dc__room--7:hover { background: rgba(19,136,8,0.06); color: var(--india-green); border-color: var(--india-green); }

  .dc__certs-strip {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 24px auto 28px;
    max-width: 820px;
  }
  .dc__cert-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    background: linear-gradient(180deg, var(--esds-gray-50), #fff);
    border: 1px solid var(--esds-gray-100);
    border-radius: 8px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: 0.04em;
    transition: all 0.25s var(--esds-ease);
  }
  .dc__cert-pill::before { content: '✓'; color: var(--esds-green); font-weight: 800; }
  .dc__cert-pill:hover {
    border-color: var(--highlight-blue);
    color: var(--highlight-blue);
    transform: translateY(-2px);
  }
  .dc__compliance-copy {
    font-size: 16px;
    line-height: 1.75;
    color: var(--esds-gray-500);
    max-width: 760px;
    margin: 0 auto 24px;
  }
  .dc__compliance-copy strong { color: var(--esds-navy); font-weight: 800; }
  .dc__compliance-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 24px;
    background: var(--highlight-bg);
    border: 1.5px solid rgba(0,97,255,0.18);
    border-radius: 10px;
    color: var(--highlight-blue);
    font-size: 14px;
    font-weight: 800;
    text-decoration: none;
    transition: all 0.25s var(--esds-ease);
  }
  .dc__compliance-link:hover {
    background: var(--highlight-blue);
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 8px 22px rgba(0,97,255,0.3);
  }


  /* ═══════════════════════════════════════════════════════════════════
     §7 · WHO RUNS HERE — 4 sector strips
     Each strip: sector header, client name list (mono), outcome line
  ═══════════════════════════════════════════════════════════════════ */
  .dc__sectors-intro {
    font-size: 16px;
    line-height: 1.75;
    color: var(--esds-gray-300);
    max-width: 820px;
    margin: 0 auto 48px;
    text-align: center;
  }
  .dc__sectors-intro strong { color: #fff; font-weight: 700; }
  .dc__sectors {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
  }
  .dc__sector {
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 18px;
    padding: 28px 28px 28px 78px;
    position: relative;
    transition: all 0.4s var(--esds-ease);
    overflow: hidden;
  }
  .dc__sector::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 4px; height: 100%;
    background: linear-gradient(180deg, var(--highlight-blue), var(--highlight-blue-light));
    transform: scaleY(0.3);
    transform-origin: top;
    transition: transform 0.4s var(--esds-ease);
  }
  .dc__sector:hover {
    transform: translateY(-4px);
    background: rgba(0,97,255,0.05);
    border-color: rgba(126,233,255,0.3);
    box-shadow: 0 14px 38px rgba(0,97,255,0.1);
  }
  .dc__sector:hover::before { transform: scaleY(1); }
  .dc__sector__icon {
    position: absolute;
    left: 22px; top: 26px;
    width: 42px; height: 42px;
    border-radius: 12px;
    background: rgba(0,97,255,0.12);
    border: 1px solid rgba(126,233,255,0.2);
    color: var(--highlight-blue-light);
    display: grid;
    place-items: center;
    font-size: 20px;
  }
  .dc__sector__title {
    font-size: 18px;
    font-weight: 800;
    color: #fff;
    margin: 0 0 12px;
    letter-spacing: -0.3px;
  }
  .dc__sector__clients {
    font-family: 'JetBrains Mono', monospace;
    font-size: 12.5px;
    color: var(--highlight-blue-light);
    line-height: 1.7;
    margin-bottom: 14px;
    padding-bottom: 14px;
    border-bottom: 1px dashed rgba(255,255,255,0.08);
    letter-spacing: -0.2px;
    word-spacing: 0.1em;
  }
  .dc__sector__clients-pending {
    font-style: italic;
    color: var(--esds-gray-400);
    font-size: 11.5px;
    font-weight: 600;
    display: block;
    margin-top: 6px;
    letter-spacing: 0.02em;
  }
  .dc__sector__outcome {
    font-size: 13.5px;
    line-height: 1.6;
    color: var(--esds-gray-300);
    margin: 0;
  }
  .dc__sector__outcome strong { color: #fff; font-weight: 700; }
  .dc__sectors-closer {
    font-style: italic;
    font-size: clamp(20px, 2.6vw, 30px);
    font-weight: 800;
    color: #fff;
    text-align: center;
    margin: 56px auto 0;
    letter-spacing: -0.5px;
  }
  .dc__sectors-closer em {
    font-style: italic;
    background: linear-gradient(135deg, var(--highlight-blue-light), #fff);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  @media (max-width: 900px) { .dc__sectors { grid-template-columns: 1fr; } }


  /* ═══════════════════════════════════════════════════════════════════
     §8 · DC VISIT FAQ — uses .faq-list + .faq-acc from §24
     Auto-wired by main script.js initFaqAccordion()
     Page-specific: small numeric prefix + section closer
  ═══════════════════════════════════════════════════════════════════ */
  .dc__faq-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.08em;
    margin-right: 12px;
  }
  .dc__faq-closer {
    font-style: italic;
    font-size: clamp(20px, 2.6vw, 28px);
    font-weight: 800;
    color: var(--esds-navy);
    text-align: center;
    margin: 48px auto 0;
    max-width: 720px;
    letter-spacing: -0.5px;
  }
  .dc__faq-closer em {
    font-style: italic;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }



  .dc__cta-pre {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--highlight-blue-light);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 14px;
    display: inline-block;
    position: relative;
    z-index: 2;
  }
  .dc__cta-pre::before, .dc__cta-pre::after {
    content: '';
    display: inline-block;
    width: 24px; height: 1px;
    background: var(--highlight-blue-light);
    vertical-align: middle;
    opacity: 0.5;
    margin: 0 10px;
  }
  
   /* ═══════════════════════════════════════════════════════════════════
    -------------------- data center services page ----------------------- 
  ═══════════════════════════════════════════════════════════════════ */
  
  
  /* ═══════════════════════════════════════════════════════════════════
    -------------------- Colocation services page ----------------------- 
  ═══════════════════════════════════════════════════════════════════ */
  
  .coloc__hero-sub {
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(15px, 1.8vw, 19px);
    font-weight: 700;
    color: var(--highlight-blue-light);
    margin: 0 0 28px;
    letter-spacing: -0.2px;
    line-height: 1.4;
  }
  .coloc__hero-sub::before {
    content: '◆';
    color: var(--india-saffron);
    margin-right: 10px;
    font-size: 0.8em;
    vertical-align: middle;
  }


  /* ═══════════════════════════════════════════════════════════════════
     §2 · DC LOCATIONS (Block 2 from doc)
     Custom 6-tile grid with photo placeholder zones + pulsing map pin
     (Doc says "Please add photo of 6 DCs" — placeholder is intentional)
  ═══════════════════════════════════════════════════════════════════ */
  .coloc__dc-intro {
    font-size: 17px;
    line-height: 1.75;
    color: var(--esds-gray-300);
    max-width: 820px;
    margin: 0 auto 56px;
    text-align: center;
  }
  .coloc__dc-intro strong { color: #fff; font-weight: 700; }
  .coloc__dc-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
  }
  .coloc__dc-tile {
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 18px;
    overflow: hidden;
    transition: all 0.4s var(--esds-ease);
    position: relative;
  }
  .coloc__dc-tile:hover {
    transform: translateY(-6px);
    border-color: rgba(126,233,255,0.35);
    background: rgba(0,97,255,0.06);
    box-shadow: 0 18px 40px rgba(0,97,255,0.15);
  }
  /* Photo placeholder zone (4:3 ratio) */
  .coloc__dc-tile__photo {
    aspect-ratio: 16/10;
    background: linear-gradient(135deg, #0F1A2D, #060B17);
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid rgba(255,255,255,0.05);
  }
  .coloc__dc-tile__photo::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
      linear-gradient(rgba(126,233,255,0.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(126,233,255,0.04) 1px, transparent 1px);
    background-size: 24px 24px;
    pointer-events: none;
  }
  .coloc__dc-tile__photo::after {
    content: '';
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 200px; height: 200px;
    background: radial-gradient(circle, rgba(0,97,255,0.18), transparent 70%);
    pointer-events: none;
  }
  .coloc__dc-tile__photo-tag {
    position: absolute;
    top: 14px; left: 14px;
    background: rgba(0,0,0,0.5);
    backdrop-filter: blur(6px);
    padding: 5px 12px;
    border-radius: 100px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--highlight-blue-light);
    letter-spacing: 0.06em;
    z-index: 2;
    border: 1px solid rgba(126,233,255,0.18);
  }
  .coloc__dc-tile__rack {
    position: absolute;
    bottom: 22px; left: 50%;
    transform: translateX(-50%);
    width: 80px; height: 110px;
    border-radius: 6px;
    background: linear-gradient(180deg, #1B2838, #0F1D32);
    border: 1px solid rgba(126,233,255,0.15);
    box-shadow: 0 6px 18px rgba(0,0,0,0.4);
    display: flex;
    flex-direction: column;
    padding: 6px 4px;
    gap: 3px;
    z-index: 2;
  }
  .coloc__dc-tile__rack::before {
    content: '';
    position: absolute;
    top: -5px; left: 50%;
    transform: translateX(-50%);
    width: 26px; height: 8px;
    background: linear-gradient(180deg, #0a1422, #060B17);
    border-radius: 3px 3px 0 0;
  }
  .coloc__dc-tile__rack span {
    flex: 1;
    background: rgba(126,233,255,0.06);
    border-radius: 2px;
    border-left: 2px solid rgba(126,233,255,0.4);
    box-shadow: inset 0 0 4px rgba(0,0,0,0.3);
  }
  .coloc__dc-tile__rack span:nth-child(2) { border-left-color: rgba(16,185,129,0.6); }
  .coloc__dc-tile__rack span:nth-child(3) { border-left-color: rgba(126,233,255,0.4); }
  .coloc__dc-tile__rack span:nth-child(4) { border-left-color: rgba(255,107,53,0.5); }
  /* Pulse beacon */
  .coloc__dc-tile__beacon {
    position: absolute;
    top: 40%; right: 22%;
    width: 12px; height: 12px;
    border-radius: 50%;
    background: var(--highlight-blue-light);
    z-index: 3;
    box-shadow: 0 0 0 0 rgba(126,233,255,0.6);
    animation: coloc-pin-pulse 2.2s ease-in-out infinite;
  }
  @keyframes coloc-pin-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(126,233,255,0.6); }
    50%      { box-shadow: 0 0 0 14px rgba(126,233,255,0); }
  }
  .coloc__dc-tile__body {
    padding: 22px 24px;
  }
  .coloc__dc-tile__name {
    font-size: 22px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.5px;
    margin: 0 0 8px;
  }
  .coloc__dc-tile__meta {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    color: var(--highlight-blue-light);
    letter-spacing: 0.06em;
  }
  .coloc__dc-tile__meta-dot {
    width: 6px; height: 6px;
    border-radius: 50%;
    background: var(--esds-green);
    box-shadow: 0 0 6px rgba(16,185,129,0.5);
  }
  /* Coming-soon variant (CEL Sahibabad) */
  .coloc__dc-tile--coming {
    grid-column: 1 / -1;
    background: linear-gradient(135deg, rgba(244,166,35,0.06), rgba(255,107,53,0.04));
    border: 1.5px dashed rgba(244,166,35,0.3);
    padding: 22px 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
  }
  .coloc__dc-tile--coming:hover { transform: none; background: linear-gradient(135deg, rgba(244,166,35,0.1), rgba(255,107,53,0.06)); }
  .coloc__dc-tile--coming .coloc__dc-tile__name {
    margin: 0;
    background: linear-gradient(135deg, #F4A623, #FF6B35);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .coloc__dc-tile__hint {
    font-family: 'JetBrains Mono', monospace;
    font-size: 12.5px;
    font-weight: 700;
    color: #F4A623;
    letter-spacing: 0.04em;
  }
  .coloc__dc-closer {
    font-style: italic;
    font-size: clamp(17px, 2.2vw, 22px);
    font-weight: 700;
    color: var(--esds-gray-300);
    text-align: center;
    max-width: 800px;
    margin: 56px auto 0;
    line-height: 1.5;
  }
  .coloc__dc-closer strong { color: #fff; font-weight: 800; }
  .coloc__dc-closer em {
    font-style: italic;
    background: linear-gradient(135deg, var(--highlight-blue-light), var(--highlight-blue));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
  }
  @media (max-width: 1024px) { .coloc__dc-grid { grid-template-columns: 1fr 1fr; } }
  @media (max-width: 600px)  { .coloc__dc-grid { grid-template-columns: 1fr; } }


  /* ═══════════════════════════════════════════════════════════════════
     §3 · COLOCATION TIERS (Block 3 from doc)
     5 tier cards using main feature-grid + feature-card.
     Page-specific extensions for icon, bullets, "Best for" footer.
  ═══════════════════════════════════════════════════════════════════ */
  .coloc__tier-grid {
    grid-template-columns: repeat(5, 1fr) !important;
  }
  @media (max-width: 1280px) { .coloc__tier-grid { grid-template-columns: repeat(3, 1fr) !important; } }
  @media (max-width: 768px)  { .coloc__tier-grid { grid-template-columns: 1fr !important; } }

  .coloc__tier-icon {
    width: 56px; height: 56px;
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(0,97,255,0.12), rgba(126,233,255,0.18));
    display: grid;
    place-items: center;
    margin-bottom: 18px;
    font-size: 26px;
    border: 1px solid rgba(0,97,255,0.15);
    transition: all 0.35s var(--esds-ease);
    position: relative;
  }
  .feature-card:hover .coloc__tier-icon {
    transform: scale(1.08) rotate(-4deg);
    background: linear-gradient(135deg, rgba(0,97,255,0.2), rgba(126,233,255,0.28));
    box-shadow: 0 8px 22px rgba(0,97,255,0.2);
  }
  /* Tier label above title */
  .coloc__tier-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 6px;
    display: block;
  }
  /* Tagline italic line under title */
  .coloc__tier-tagline {
    font-style: italic;
    font-size: 12.5px;
    color: var(--esds-gray-500);
    line-height: 1.55;
    margin: 8px 0 18px;
    padding-bottom: 14px;
    border-bottom: 1px dashed var(--esds-gray-100);
  }
  .coloc__tier-bullets {
    list-style: none;
    padding: 0;
    margin: 0 0 20px;
  }
  .coloc__tier-bullets li {
    font-size: 12.5px;
    color: var(--esds-gray-700);
    line-height: 1.55;
    padding: 6px 0 6px 22px;
    position: relative;
  }
  .coloc__tier-bullets li::before {
    content: '';
    position: absolute;
    left: 0; top: 13px;
    width: 12px; height: 2px;
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
    border-radius: 2px;
  }
  .coloc__tier-best {
    margin-top: auto;
    padding-top: 14px;
    border-top: 1px solid var(--esds-gray-100);
    font-size: 12.5px;
    color: var(--esds-gray-700);
    line-height: 1.5;
  }
  .coloc__tier-best strong {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    display: block;
    margin-bottom: 4px;
  }
  /* Featured GPU-Ready variant */
  .coloc__tier--featured {
    border-color: rgba(0,97,255,0.3) !important;
    background: linear-gradient(180deg, rgba(0,97,255,0.04), #fff) !important;
    position: relative;
  }
  .coloc__tier--featured::after {
    content: 'NEW · AI READY';
    position: absolute;
    top: 10px; 
	right: 16px;
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: 0.1em;
    padding: 5px 12px;
    border-radius: 100px;
    box-shadow: 0 4px 14px rgba(0,97,255,0.3);
  }
  /* Make feature-card a flex column so .coloc__tier-best can sit at bottom */
  .coloc__tier-grid .feature-card {
    display: flex;
    flex-direction: column;
  }


  /* ═══════════════════════════════════════════════════════════════════
     §4 · COMPLIANCE (Block 4 from doc)
     7 audience pills (highlighted differently per doc) + cert paragraph + link
  ═══════════════════════════════════════════════════════════════════ */
  .coloc__compliance {
    text-align: center;
    max-width: 920px;
    margin: 0 auto;
  }
  /* 7 audience pills — each gets its own accent color cycling through */
  .coloc__rooms {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 0 auto 36px;
    max-width: 880px;
  }
  .coloc__room {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 100px;
    font-size: 13px;
    font-weight: 700;
    color: var(--esds-gray-700);
    letter-spacing: -0.2px;
    transition: all 0.3s var(--esds-ease);
    cursor: default;
    position: relative;
  }
  .coloc__room::before {
    content: '';
    width: 8px; height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
  }
  .coloc__room:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 22px rgba(0,97,255,0.12);
  }
  /* 7 distinct accent colors */
  .coloc__room--1 { border-color: rgba(0,97,255,0.3); }
  .coloc__room--1::before { background: var(--highlight-blue); }
  .coloc__room--1:hover { background: rgba(0,97,255,0.06); color: var(--highlight-blue); border-color: var(--highlight-blue); }

  .coloc__room--2 { border-color: rgba(126,233,255,0.4); }
  .coloc__room--2::before { background: var(--highlight-blue-light); }
  .coloc__room--2:hover { background: rgba(126,233,255,0.08); color: #0a1f4f; border-color: var(--highlight-blue-light); }

  .coloc__room--3 { border-color: rgba(255,107,53,0.3); }
  .coloc__room--3::before { background: var(--india-saffron); }
  .coloc__room--3:hover { background: rgba(255,107,53,0.06); color: var(--india-saffron); border-color: var(--india-saffron); }

  .coloc__room--4 { border-color: rgba(244,166,35,0.35); }
  .coloc__room--4::before { background: #F4A623; }
  .coloc__room--4:hover { background: rgba(244,166,35,0.08); color: #b87705; border-color: #F4A623; }

  .coloc__room--5 { border-color: rgba(16,185,129,0.3); }
  .coloc__room--5::before { background: var(--esds-green); }
  .coloc__room--5:hover { background: rgba(16,185,129,0.06); color: var(--esds-green); border-color: var(--esds-green); }

  .coloc__room--6 { border-color: rgba(99,102,241,0.3); }
  .coloc__room--6::before { background: #6366F1; }
  .coloc__room--6:hover { background: rgba(99,102,241,0.06); color: #6366F1; border-color: #6366F1; }

  .coloc__room--7 { border-color: rgba(19,136,8,0.3); }
  .coloc__room--7::before { background: var(--india-green); }
  .coloc__room--7:hover { background: rgba(19,136,8,0.06); color: var(--india-green); border-color: var(--india-green); }

  /* Compliance certs strip */
  .coloc__certs-strip {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 24px auto 28px;
    max-width: 720px;
  }
  .coloc__cert-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    background: linear-gradient(180deg, var(--esds-gray-50), #fff);
    border: 1px solid var(--esds-gray-100);
    border-radius: 8px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: 0.04em;
    transition: all 0.25s var(--esds-ease);
  }
  .coloc__cert-pill::before {
    content: '✓';
    color: var(--esds-green);
    font-weight: 800;
  }
  .coloc__cert-pill:hover {
    border-color: var(--highlight-blue);
    color: var(--highlight-blue);
    transform: translateY(-2px);
  }
  .coloc__compliance-copy {
    font-size: 16px;
    line-height: 1.75;
    color: var(--esds-gray-500);
    max-width: 760px;
    margin: 0 auto 24px;
  }
  .coloc__compliance-copy strong {
    color: var(--esds-navy);
    font-weight: 800;
  }
  .coloc__compliance-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 24px;
    background: var(--highlight-bg);
    border: 1.5px solid rgba(0,97,255,0.18);
    border-radius: 10px;
    color: var(--highlight-blue);
    font-size: 14px;
    font-weight: 800;
    text-decoration: none;
    transition: all 0.25s var(--esds-ease);
  }
  .coloc__compliance-link:hover {
    background: var(--highlight-blue);
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 8px 22px rgba(0,97,255,0.3);
  }


  /* ═══════════════════════════════════════════════════════════════════
     §6 · TESTIMONIALS / SECTORS (Block 6 from doc)
     Industry sector chips + reserved client carousel placeholder
  ═══════════════════════════════════════════════════════════════════ */
  .coloc__sectors-intro {
    font-size: 16px;
    line-height: 1.75;
    color: var(--esds-gray-500);
    max-width: 880px;
    margin: 0 auto 36px;
    text-align: center;
  }
  .coloc__sectors {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 0 auto 48px;
    max-width: 760px;
  }
  .coloc__sector {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background: linear-gradient(180deg, var(--esds-gray-50), #fff);
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 12px;
    font-size: 13.5px;
    font-weight: 700;
    color: var(--esds-gray-700);
    transition: all 0.3s var(--esds-ease);
  }
  .coloc__sector:hover {
    border-color: var(--highlight-blue);
    color: var(--highlight-blue);
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(0,97,255,0.1);
  }
  .coloc__sector__icon { font-size: 16px; line-height: 1; }
  /* Client carousel placeholder strip */
  .coloc__carousel {
    background: linear-gradient(135deg, var(--esds-gray-50), #fff);
    border: 1.5px dashed var(--esds-gray-100);
    border-radius: 22px;
    padding: 40px 32px;
    text-align: center;
    margin-bottom: 36px;
  }
  .coloc__carousel-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 16px;
    margin-bottom: 28px;
  }
  .coloc__carousel-tile {
    aspect-ratio: 1.6 / 1;
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 12px;
    display: grid;
    place-items: center;
    position: relative;
    overflow: hidden;
    transition: all 0.3s var(--esds-ease);
  }
  .coloc__carousel-tile:hover {
    border-color: var(--highlight-blue);
    transform: translateY(-3px);
  }
  .coloc__carousel-tile::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
      linear-gradient(rgba(0,97,255,0.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(0,97,255,0.04) 1px, transparent 1px);
    background-size: 12px 12px;
    pointer-events: none;
    opacity: 0.5;
  }
  .coloc__carousel-tile__placeholder {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 700;
    color: var(--esds-gray-300);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    z-index: 1;
  }
  .coloc__carousel-note {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11.5px;
    color: var(--esds-gray-400);
    font-style: italic;
    letter-spacing: 0.02em;
  }
  .coloc__sectors-closer {
    font-style: italic;
    font-size: clamp(20px, 2.6vw, 28px);
    font-weight: 800;
    color: var(--esds-navy);
    text-align: center;
    margin: 0;
    letter-spacing: -0.5px;
    line-height: 1.3;
  }
  .coloc__sectors-closer em {
    font-style: italic;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  @media (max-width: 992px) { .coloc__carousel-grid { grid-template-columns: repeat(3, 1fr); } }
  @media (max-width: 540px) { .coloc__carousel-grid { grid-template-columns: repeat(2, 1fr); } }


  /* ═══════════════════════════════════════════════════════════════════
     §7 · FAQ — uses .faq-list + .faq-acc + .faq-acc__trigger from main (§24)
     Auto-wired by main script.js initFaqAccordion()
     Page-specific: just a tiny visual trigger improvement (the +/×)
  ═══════════════════════════════════════════════════════════════════ */
  /* faq-acc__trigger main CSS already shows an SVG that rotates 45°
     on .open. Add a small numeric prefix style to each Q. */
  .coloc__faq-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.08em;
    margin-right: 12px;
  }


  /* ═══════════════════════════════════════════════════════════════════
     Final CTA enhancement — uses .page-cta from main; we just add a
     small pre-tagline above the H2
  ═══════════════════════════════════════════════════════════════════ */
  .coloc__cta-pre {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--highlight-blue-light);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 14px;
    display: inline-block;
    position: relative;
    z-index: 2;
  }
  .coloc__cta-pre::before, .coloc__cta-pre::after {
    content: '';
    display: inline-block;
    width: 24px;
    height: 1px;
    background: var(--highlight-blue-light);
    vertical-align: middle;
    opacity: 0.5;
    margin: 0 10px;
  }
  
  
.colo-light-bg (
    background: #fff;
)

.colo-light-bg .sec-title {
    color: var(--esds-navy);
}
  
  
.colo-light-bg .coloc__dc-intro {
    font-size: 17px;
    line-height: 1.75;
    color: var(--esds-gray-500);
    max-width: 820px;
    margin: 0 auto 56px;
    text-align: center;
}
  
.colo-light-bg strong {
    color: var(--esds-navy);
    font-weight: 700;
}
.colo-light-bg .coloc__dc-tile__name {
    font-size: 22px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.5px;
    margin: 0 0 8px;
}


.colo-light-bg .coloc__dc-tile__body {
    padding: 22px 24px;
    background: #dddddd36;
}

.colo-light-bg .coloc__dc-tile__meta {
    display: flex;
   color: var(--esds-navy);
    font-weight: 700;
}
.colo-light-bg .coloc__dc-closer strong {
    color: #94a3b8;
    font-weight: 800;
}

.inner-hero__stats .stat-card-hero {
    background: #fff;
    border-bottom: 3px solid #2196F3;
    border-radius: 14px;
    padding: 22px 20px;
    transition: all 0.3s var(--esds-ease);
}
.inner-hero__stats .stat-card-hero:hover{
    background: #f7f7f7;
	cursor: pointer;
}


.inner-hero__stats .stat-card-hero .stat-num{
	color: var(--esds-navy);
}


.colo-light-bg	.sec-label{	
    color: var(--highlight-blue);
}


    /* ═══════════════════════════════════════════════════════════════════
    -------------------- Colocation services page ----------------------- 
  ═══════════════════════════════════════════════════════════════════ */
    /* ═══════════════════════════════════════════════════════════════════
    -------------------- careers page ----------------------- 
  ═══════════════════════════════════════════════════════════════════ */
  
  
  
  .careers-page .cm__control__ctas {
     display: contents!important;
  }
 

  /* ═══════════════════════════════════════════════════════════════════
    -------------------- careers page ----------------------- 
  ═══════════════════════════════════════════════════════════════════ */
  
  /* ═══════════════════════════════════════════════════════════════════
    -------------------- GPU as a services page ----------------------- 
  ═══════════════════════════════════════════════════════════════════ */
/* ─── Section 2 · 5 Gaps stat panel (Block 2) ─── */
  .gpu-aas__gap-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 16px;
    margin-top: 16px;
  }
  .gpu-aas__gap-card {
    background: linear-gradient(180deg, var(--esds-gray-50), #fff);
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 18px;
    padding: 28px 24px;
    transition: transform 0.3s var(--esds-ease), border-color 0.3s, box-shadow 0.3s;
    position: relative;
    overflow: hidden;
  }
  .gpu-aas__gap-card:hover {
    transform: translateY(-4px);
    border-color: var(--highlight-blue);
    box-shadow: 0 14px 38px rgba(0, 97, 255, 0.10);
  }
  .gpu-aas__gap-card__num {
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(36px, 4.4vw, 52px);
    font-weight: 800;
    color: var(--esds-navy);
    line-height: 1;
    letter-spacing: -1.5px;
    margin: 0 0 12px;
  }
  .gpu-aas__gap-card__lbl {
    font-size: 13px;
    font-weight: 700;
    color: var(--esds-gray-700);
    line-height: 1.4;
    margin: 0 0 14px;
  }
  .gpu-aas__gap-card__bar {
    height: 4px;
    background: var(--esds-gray-100);
    border-radius: 4px;
    overflow: hidden;
  }
  .gpu-aas__gap-card__bar-fill {
    height: 100%;
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
    border-radius: 4px;
    transition: width 1.4s var(--esds-ease);
    width: 0;
  }
  .gpu-aas__gap-card.is-revealed .gpu-aas__gap-card__bar-fill {
    width: var(--gpu-aas-fill, 50%);
  }
  @media (max-width: 1100px) { .gpu-aas__gap-grid { grid-template-columns: repeat(3, 1fr); } }
  @media (max-width: 640px)  { .gpu-aas__gap-grid { grid-template-columns: repeat(2, 1fr); } }

  /* ─── Section 3 · Outcomes 5-metric callout list (Block 3) ─── */
  .gpu-aas__outcomes {
    background: linear-gradient(135deg, var(--esds-navy), var(--esds-deep));
    border-radius: 28px;
    padding: 60px 56px;
    color: #fff;
    position: relative;
    overflow: hidden;
  }
  .gpu-aas__outcomes::before {
    content: '';
    position: absolute;
    top: -30%; right: -10%;
    width: 600px; height: 600px;
    background: radial-gradient(circle, rgba(0,97,255,0.18), transparent 60%);
    border-radius: 50%;
    pointer-events: none;
  }
  .gpu-aas__outcomes__inner {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 56px;
    align-items: center;
  }
  .gpu-aas__outcomes__title {
    font-size: clamp(28px, 3.6vw, 40px);
    font-weight: 800;
    color: #fff;
    line-height: 1.15;
    letter-spacing: -1px;
    margin: 0 0 28px;
  }
  .gpu-aas__outcomes__title em {
    font-style: normal;
    background: linear-gradient(135deg, var(--highlight-blue-light), #fff);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .gpu-aas__outcomes__cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 15px 28px;
    border-radius: 10px;
    font-size: 14.5px;
    font-weight: 700;
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    text-decoration: none;
    box-shadow: 0 6px 22px rgba(0,97,255,0.4);
    transition: all 0.25s var(--esds-ease);
    margin-top: 8px;
  }
  .gpu-aas__outcomes__cta:hover { transform: translateY(-2px); box-shadow: 0 12px 32px rgba(0,97,255,0.55); color: #fff; }
  .gpu-aas__outcomes__list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
    list-style: none;
    margin: 0; padding: 0;
  }
  .gpu-aas__outcomes__item {
    display: grid;
    grid-template-columns: 100px 1fr;
    gap: 18px;
    padding: 14px 0;
    border-bottom: 1px solid rgba(255,255,255,0.08);
    align-items: baseline;
  }
  .gpu-aas__outcomes__item:last-child { border-bottom: none; }
  .gpu-aas__outcomes__item-metric {
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(20px, 2.2vw, 26px);
    font-weight: 800;
    line-height: 1;
    background: linear-gradient(135deg, var(--highlight-blue-light), var(--highlight-blue));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    letter-spacing: -1px;
    text-align: right;
  }
  .gpu-aas__outcomes__item-text {
    font-size: 14.5px;
    color: var(--esds-gray-300);
    line-height: 1.5;
    font-weight: 600;
  }
  @media (max-width: 900px) {
    .gpu-aas__outcomes { padding: 40px 28px; }
    .gpu-aas__outcomes__inner { grid-template-columns: 1fr; gap: 32px; }
    .gpu-aas__outcomes__item { grid-template-columns: 80px 1fr; gap: 14px; }
  }

  /* ─── Section 4 · AI is racing pull-quote (Block 4) ─── */
  .gpu-aas__racing {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 56px;
    align-items: center;
  }
  .gpu-aas__racing__title {
    font-style: italic;
    font-size: clamp(28px, 3.4vw, 42px);
    font-weight: 800;
    color: #fff;
    line-height: 1.15;
    letter-spacing: -1px;
    margin: 0 0 22px;
  }
  .gpu-aas__racing__title em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), #FFB070);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
  }
  .gpu-aas__racing__copy {
    font-style: italic;
    font-size: clamp(17px, 2vw, 22px);
    line-height: 1.5;
    color: var(--esds-gray-300);
    font-weight: 700;
    margin: 0;
  }
  .gpu-aas__racing__copy strong { color: #fff; font-style: normal; font-weight: 800; }
  /* Sovereign cluster card */
  .gpu-aas__cluster {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(126,233,255,0.18);
    border-radius: 22px;
    padding: 32px 30px;
    backdrop-filter: blur(6px);
    position: relative;
    overflow: hidden;
  }
  .gpu-aas__cluster::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at top right, rgba(0,97,255,0.10), transparent 65%);
    pointer-events: none;
  }
  .gpu-aas__cluster__pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(16,185,129,0.12);
    border: 1px solid rgba(16,185,129,0.3);
    color: #34D399;
    padding: 6px 14px;
    border-radius: 100px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.05em;
    margin-bottom: 20px;
    position: relative;
    z-index: 2;
  }
  .gpu-aas__cluster__pill::before {
    content: '';
    width: 7px; height: 7px;
    background: #34D399;
    border-radius: 50%;
    box-shadow: 0 0 0 0 rgba(52,211,153,0.5);
    animation: gpu-aas-live-pulse 1.8s infinite;
  }
  @keyframes gpu-aas-live-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(52,211,153,0.6); }
    50%      { box-shadow: 0 0 0 7px rgba(52,211,153,0); }
  }
  .gpu-aas__cluster__title {
    font-size: clamp(20px, 2.4vw, 26px);
    font-weight: 800;
    color: #fff;
    line-height: 1.2;
    letter-spacing: -0.5px;
    margin: 0 0 24px;
    position: relative;
    z-index: 2;
  }
  .gpu-aas__cluster__title-brand {
    color: var(--india-saffron);
  }
  .gpu-aas__cluster__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    position: relative;
    z-index: 2;
  }
  .gpu-aas__cluster__item-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(22px, 2.6vw, 30px);
    font-weight: 800;
    line-height: 1;
    color: var(--highlight-blue-light);
    letter-spacing: -1px;
    margin-bottom: 6px;
  }
  .gpu-aas__cluster__item-lbl {
    font-size: 12px;
    color: var(--esds-gray-300);
    line-height: 1.45;
    font-weight: 500;
  }
  @media (max-width: 992px) {
    .gpu-aas__racing { grid-template-columns: 1fr; gap: 40px; }
  }

  /* ─── Section 5 · Case study Challenge / Solution / Outcome (Block 5) ─── */
  .gpu-aas__case-q {
    font-size: clamp(26px, 3.2vw, 38px);
    font-weight: 800;
    color: var(--esds-navy);
    line-height: 1.2;
    letter-spacing: -1px;
    max-width: 880px;
    margin: 0 0 56px;
  }
  .gpu-aas__case-q em {
    font-style: normal;
    color: var(--highlight-blue);
  }
  .gpu-aas__case-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-bottom: 40px;
  }
  .gpu-aas__case-pane {
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 22px;
    padding: 32px 28px;
    transition: transform 0.3s var(--esds-ease), border-color 0.3s, box-shadow 0.3s;
    position: relative;
  }
  .gpu-aas__case-pane:hover {
    transform: translateY(-4px);
    border-color: var(--highlight-blue);
    box-shadow: 0 14px 38px rgba(0,97,255,0.08);
  }
  .gpu-aas__case-pane--challenge {
    border-color: rgba(239,68,68,0.18);
    background: linear-gradient(180deg, rgba(239,68,68,0.04), #fff);
  }
  .gpu-aas__case-pane--challenge:hover { border-color: var(--esds-red); }
  .gpu-aas__case-pane--solution {
    border-color: rgba(0,97,255,0.18);
    background: linear-gradient(180deg, rgba(0,97,255,0.04), #fff);
  }
  .gpu-aas__case-pane--outcome {
    background: linear-gradient(135deg, var(--esds-navy), var(--esds-deep));
    border: 1px solid rgba(126,233,255,0.18);
    color: #fff;
  }
  .gpu-aas__case-pane__tag {
    display: inline-block;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    margin-bottom: 18px;
  }
  .gpu-aas__case-pane--challenge .gpu-aas__case-pane__tag { color: var(--esds-red); }
  .gpu-aas__case-pane--solution .gpu-aas__case-pane__tag { color: var(--highlight-blue); }
  .gpu-aas__case-pane--outcome .gpu-aas__case-pane__tag { color: var(--highlight-blue-light); }
  .gpu-aas__case-pane__list {
    list-style: none;
    margin: 0; padding: 0;
  }
  .gpu-aas__case-pane__list li {
    font-size: 14.5px;
    line-height: 1.6;
    color: var(--esds-gray-700);
    padding: 12px 0 12px 24px;
    border-bottom: 1px dashed var(--esds-gray-100);
    position: relative;
  }
  .gpu-aas__case-pane__list li:last-child { border-bottom: none; }
  .gpu-aas__case-pane__list li::before {
    content: '✕';
    position: absolute;
    left: 0; top: 12px;
    color: var(--esds-red);
    font-weight: 800;
    font-size: 13px;
  }
  .gpu-aas__case-pane__list li strong { color: var(--esds-navy); font-weight: 800; }
  .gpu-aas__case-pane__copy {
    font-size: 14.5px;
    line-height: 1.65;
    color: var(--esds-gray-700);
    margin: 0;
  }
  .gpu-aas__case-pane__copy strong { color: var(--esds-navy); font-weight: 700; }
  /* Outcome stats grid (4 stats inside outcome pane) */
  .gpu-aas__outcome-stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-top: 4px;
  }
  .gpu-aas__outcome-stat {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.06);
    border-radius: 12px;
    padding: 16px 14px;
  }
  .gpu-aas__outcome-stat__num {
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(20px, 2.4vw, 28px);
    font-weight: 800;
    color: #fff;
    line-height: 1;
    letter-spacing: -0.5px;
    margin-bottom: 6px;
  }
  .gpu-aas__outcome-stat__lbl {
    font-size: 11.5px;
    color: var(--esds-gray-300);
    line-height: 1.4;
    font-weight: 600;
  }
  @media (max-width: 992px) {
    .gpu-aas__case-grid { grid-template-columns: 1fr; }
  }

  /* ─── Section 6 · SuperPOD Configurator (Block 6) ─── */
  .gpu-aas__configurator {
    background: linear-gradient(165deg, #0F1A2D, #060B17);
    border-radius: 28px;
    padding: 56px 48px 48px;
    color: #fff;
    position: relative;
    overflow: hidden;
  }
  .gpu-aas__configurator::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
      linear-gradient(rgba(126,233,255,0.018) 1px, transparent 1px),
      linear-gradient(90deg, rgba(126,233,255,0.018) 1px, transparent 1px);
    background-size: 56px 56px;
    pointer-events: none;
  }
  .gpu-aas__configurator__head {
    text-align: center;
    margin-bottom: 36px;
    position: relative;
    z-index: 2;
  }
  .gpu-aas__configurator__title {
    font-size: clamp(26px, 3.2vw, 36px);
    font-weight: 800;
    color: #fff;
    margin: 0 0 8px;
    letter-spacing: -0.5px;
  }
  .gpu-aas__configurator__title-accent {
    background: linear-gradient(135deg, var(--highlight-blue-light), var(--highlight-blue));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .gpu-aas__configurator__sub {
    font-size: 14px;
    color: var(--esds-gray-300);
    margin: 0;
  }
  /* 4-step progress flow */
  .gpu-aas__steps {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    margin: 0 0 36px;
    position: relative;
    z-index: 2;
    align-items: center;
  }
  .gpu-aas__step {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 100px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 13px;
    font-weight: 700;
    color: var(--esds-gray-300);
    transition: all 0.3s var(--esds-ease);
    justify-content: center;
  }
  .gpu-aas__step--active {
    background: linear-gradient(135deg, rgba(0,97,255,0.25), rgba(126,233,255,0.15));
    border-color: rgba(126,233,255,0.4);
    color: var(--highlight-blue-light);
    box-shadow: 0 6px 18px rgba(0,97,255,0.2);
  }
  .gpu-aas__step__icon {
    font-size: 14px;
  }
  .gpu-aas__step__line {
    height: 2px;
    background: linear-gradient(90deg, rgba(126,233,255,0.4), rgba(255,255,255,0.06));
    margin: 0 -4px;
    z-index: 1;
  }
  .gpu-aas__step--inactive + .gpu-aas__step__line {
    background: rgba(255,255,255,0.06);
  }
  /* GPU model picker tabs */
  .gpu-aas__models {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    border-bottom: 1px solid rgba(255,255,255,0.06);
    padding-bottom: 28px;
    margin-bottom: 28px;
    position: relative;
    z-index: 2;
  }
  .gpu-aas__model {
    text-align: center;
    padding: 14px 12px;
    border-radius: 12px;
    transition: all 0.3s var(--esds-ease);
    cursor: pointer;
    border: 1px solid transparent;
  }
  .gpu-aas__model:hover {
    background: rgba(255,255,255,0.03);
  }
  .gpu-aas__model--active {
    background: rgba(0,97,255,0.10);
    border-color: rgba(126,233,255,0.3);
  }
  .gpu-aas__model__name {
    font-size: 14px;
    font-weight: 800;
    color: #fff;
    letter-spacing: 0.02em;
    margin-bottom: 4px;
  }
  .gpu-aas__model--active .gpu-aas__model__name {
    color: var(--highlight-blue-light);
  }
  .gpu-aas__model__gen {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    color: var(--esds-gray-400);
    font-weight: 600;
  }
  /* Active model spec readout (shown for the active model) */
  .gpu-aas__readout {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr;
    gap: 28px;
    align-items: start;
    position: relative;
    z-index: 2;
  }
  .gpu-aas__readout-block h4 {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--highlight-blue-light);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin: 0 0 12px;
  }
  .gpu-aas__readout-spec {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-bottom: 14px;
  }
  .gpu-aas__readout-spec-item {
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.06);
    border-radius: 10px;
    padding: 12px 14px;
  }
  .gpu-aas__readout-spec-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 16px;
    font-weight: 800;
    color: #fff;
    line-height: 1;
    margin-bottom: 4px;
  }
  .gpu-aas__readout-spec-lbl {
    font-size: 10.5px;
    color: var(--esds-gray-400);
    font-family: 'JetBrains Mono', monospace;
    font-weight: 600;
    letter-spacing: 0.04em;
  }
  .gpu-aas__readout-counter {
    background: rgba(0,97,255,0.06);
    border: 1px solid rgba(126,233,255,0.2);
    border-radius: 14px;
    padding: 16px 18px;
  }
  .gpu-aas__readout-counter-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
  }
  .gpu-aas__readout-counter-row + .gpu-aas__readout-counter-row {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px dashed rgba(126,233,255,0.15);
  }
  .gpu-aas__readout-counter-lbl {
    font-size: 12px;
    color: var(--esds-gray-300);
    font-weight: 600;
  }
  .gpu-aas__readout-counter-val {
    font-family: 'JetBrains Mono', monospace;
    font-size: 18px;
    font-weight: 800;
    color: var(--highlight-blue-light);
  }
  .gpu-aas__readout-counter-stepper {
    display: inline-flex;
    align-items: center;
    gap: 8px;
  }
  .gpu-aas__readout-counter-btn {
    width: 28px; height: 28px;
    border-radius: 50%;
    background: rgba(126,233,255,0.12);
    border: 1px solid rgba(126,233,255,0.3);
    color: var(--highlight-blue-light);
    font-weight: 800;
    cursor: pointer;
    display: grid;
    place-items: center;
    transition: all 0.2s ease;
  }
  .gpu-aas__readout-counter-btn:hover {
    background: rgba(126,233,255,0.2);
  }
  .gpu-aas__readout-cta {
    margin-top: 18px;
    width: 100%;
    padding: 14px 20px;
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    border: 0;
    border-radius: 10px;
    font-weight: 800;
    font-size: 13px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.25s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-decoration: none;
  }
  .gpu-aas__readout-cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 28px rgba(0,97,255,0.4);
    color: #fff;
  }
  @media (max-width: 992px) {
    .gpu-aas__configurator { padding: 36px 24px; }
    .gpu-aas__steps { grid-template-columns: 1fr 1fr; gap: 8px; }
    .gpu-aas__step__line { display: none; }
    .gpu-aas__models { grid-template-columns: 1fr 1fr; }
    .gpu-aas__readout { grid-template-columns: 1fr; gap: 18px; }
  }

  /* ─── Section 7 · NVIDIA + AMD GPU model showcase (Block 7) ─── */
  .gpu-aas__brands {
    display: flex;
    justify-content: center;
    gap: 36px;
    margin-bottom: 32px;
    flex-wrap: wrap;
  }
  .gpu-aas__brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 28px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.10);
    border-radius: 14px;
    color: #fff;
    font-weight: 800;
    font-size: 18px;
    letter-spacing: -0.3px;
    transition: all 0.3s var(--esds-ease);
  }
  .gpu-aas__brand:hover {
    border-color: rgba(126,233,255,0.4);
    background: rgba(0,97,255,0.06);
  }
  .gpu-aas__brand--nvidia { color: #76B900; }
  .gpu-aas__brand--amd    { color: #ED1C24; }
  .gpu-aas__brand__logo {
    width: 28px; height: 28px;
    border-radius: 6px;
    display: grid;
    place-items: center;
    font-size: 14px;
    font-weight: 800;
  }
  .gpu-aas__brand--nvidia .gpu-aas__brand__logo {
    background: rgba(118,185,0,0.15); color: #76B900;
  }
  .gpu-aas__brand--amd .gpu-aas__brand__logo {
    background: rgba(237,28,36,0.15); color: #ED1C24;
  }
  /* GPU wall — 5 GPU model tiles */
  .gpu-aas__gpu-wall {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 16px;
    margin-bottom: 32px;
  }
  .gpu-aas__gpu-tile {
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 18px;
    padding: 28px 20px 24px;
    text-align: center;
    transition: all 0.35s var(--esds-ease);
    position: relative;
    overflow: hidden;
  }
  .gpu-aas__gpu-tile::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at top, rgba(0,97,255,0.06), transparent 70%);
    pointer-events: none;
  }
  .gpu-aas__gpu-tile:hover {
    background: rgba(0,97,255,0.08);
    border-color: rgba(126,233,255,0.3);
    transform: translateY(-4px);
  }
  .gpu-aas__gpu-tile__chip {
    width: 70px; height: 90px;
    margin: 0 auto 16px;
    border-radius: 8px;
    background: linear-gradient(135deg, #2a3142, #1a1f2e);
    border: 1px solid rgba(255,255,255,0.08);
    position: relative;
    box-shadow: inset 0 0 12px rgba(0,0,0,0.5);
    display: grid;
    place-items: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9px;
    font-weight: 800;
    color: rgba(126,233,255,0.5);
    letter-spacing: 0.05em;
  }
  .gpu-aas__gpu-tile__chip::before, .gpu-aas__gpu-tile__chip::after {
    content: '';
    position: absolute;
    background: rgba(255,255,255,0.04);
  }
  .gpu-aas__gpu-tile__chip::before { left: 4px; right: 4px; height: 1px; top: 14px; box-shadow: 0 16px 0 rgba(255,255,255,0.04), 0 32px 0 rgba(255,255,255,0.04), 0 48px 0 rgba(255,255,255,0.04); }
  .gpu-aas__gpu-tile__chip::after  { top: 4px; bottom: 4px; width: 1px; left: 14px; box-shadow: 16px 0 0 rgba(255,255,255,0.04), 32px 0 0 rgba(255,255,255,0.04), 48px 0 0 rgba(255,255,255,0.04); }
  .gpu-aas__gpu-tile__name {
    font-size: 14px;
    font-weight: 800;
    color: #fff;
    margin: 0 0 4px;
    letter-spacing: -0.2px;
  }
  .gpu-aas__gpu-tile__type {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    color: var(--highlight-blue-light);
    font-weight: 600;
    letter-spacing: 0.04em;
  }
  /* 3-tab variants */
  .gpu-aas__variants {
    display: flex;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
  }
  .gpu-aas__variant {
    padding: 10px 22px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 100px;
    color: var(--esds-gray-300);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.02em;
    transition: all 0.3s var(--esds-ease);
    cursor: pointer;
  }
  .gpu-aas__variant--active {
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
    border-color: transparent;
    color: #fff;
    box-shadow: 0 6px 18px rgba(0,97,255,0.3);
  }
  .gpu-aas__variant:not(.gpu-aas__variant--active):hover {
    background: rgba(255,255,255,0.08);
    color: #fff;
  }
  @media (max-width: 1100px) {
    .gpu-aas__gpu-wall { grid-template-columns: repeat(3, 1fr); }
  }
  @media (max-width: 640px)  {
    .gpu-aas__gpu-wall { grid-template-columns: repeat(2, 1fr); }
  }

  /* ─── Section 8 helper · feature-card icon override for service offerings ─── */
  .gpu-aas__svc-icon {
    width: 48px; height: 48px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(0,97,255,0.12), rgba(126,233,255,0.18));
    display: grid;
    place-items: center;
    margin-bottom: 18px;
    font-size: 22px;
  }
  
  
  


  /* ════════════════════════════════════════════════════════════════════
     PREVIEW PAGE CHROME — option chooser bar
     ════════════════════════════════════════════════════════════════════ */
  .preview-bar {
    background: linear-gradient(135deg, var(--esds-navy), #0d1c34);
    color: #fff;
    padding: 24px 32px;
    text-align: center;
    border-bottom: 2px solid rgba(126,233,255,0.15);
  }
  .preview-bar h1 {
    margin: 0 0 6px;
    font-size: 22px;
    font-weight: 800;
    letter-spacing: -0.5px;
  }
  .preview-bar p {
    margin: 0;
    font-size: 13px;
    color: var(--gray-300);
    font-family: 'JetBrains Mono', monospace;
    letter-spacing: 0.04em;
  }
  .preview-divider {
    padding: 60px 32px 30px;
    text-align: center;
    background: var(--gray-50);
    border-top: 1px dashed var(--gray-200);
  }
  .preview-divider__chip {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 22px;
    background: #fff;
    border: 1.5px solid var(--gray-200);
    border-radius: 100px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--gray-500);
    letter-spacing: 0.16em;
    text-transform: uppercase;
  }
  .preview-divider__chip strong { color: var(--esds-navy); margin-right: 4px; }
  .preview-divider h2 {
    margin: 18px 0 6px;
    font-size: clamp(24px, 3vw, 32px);
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.6px;
  }
  .preview-divider p {
    margin: 0 auto;
    max-width: 640px;
    font-size: 14px;
    color: var(--gray-500);
    line-height: 1.7;
  }
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  /* ════════════════════════════════════════════════════════════════════
     PREVIEW PAGE CHROME — option chooser bar
     ════════════════════════════════════════════════════════════════════ */
  .preview-bar {
    background: linear-gradient(135deg, var(--esds-navy), #0d1c34);
    color: #fff;
    padding: 24px 32px;
    text-align: center;
    border-bottom: 2px solid rgba(126,233,255,0.15);
  }
  .preview-bar h1 {
    margin: 0 0 6px;
    font-size: 22px;
    font-weight: 800;
    letter-spacing: -0.5px;
  }
  .preview-bar p {
    margin: 0;
    font-size: 13px;
    color: var(--gray-300);
    font-family: 'JetBrains Mono', monospace;
    letter-spacing: 0.04em;
  }
  .preview-divider {
    padding: 60px 32px 30px;
    text-align: center;
    background: var(--gray-50);
    border-top: 1px dashed var(--gray-200);
  }
  .preview-divider__chip {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 22px;
    background: #fff;
    border: 1.5px solid var(--gray-200);
    border-radius: 100px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--gray-500);
    letter-spacing: 0.16em;
    text-transform: uppercase;
  }
  .preview-divider__chip strong { color: var(--esds-navy); margin-right: 4px; }
  .preview-divider h2 {
    margin: 18px 0 6px;
    font-size: clamp(24px, 3vw, 32px);
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.6px;
  }
  .preview-divider p {
    margin: 0 auto;
    max-width: 640px;
    font-size: 14px;
    color: var(--gray-500);
    line-height: 1.7;
  }


  /* ════════════════════════════════════════════════════════════════════
     ╔═══ OPTION A · DARK · IMMERSIVE SHOWCASE LAYOUT ═══╗
     Vendor segmented control · GPU model carousel ·
     Config sub-tabs · Detail panel with cinematic glow
     ════════════════════════════════════════════════════════════════════ */
  .gpu-a {
   background:#080e1b;
    color: #fff;
    padding: 80px 0 100px;
    position: relative;
    overflow: hidden;
  }
  .gpu-a::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
      linear-gradient(rgba(126,233,255,0.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(126,233,255,0.04) 1px, transparent 1px);
    background-size: 40px 40px;
    pointer-events: none;
    -webkit-mask-image: radial-gradient(ellipse at center, #000 30%, transparent 80%);
            mask-image: radial-gradient(ellipse at center, #000 30%, transparent 80%);
  }
  .gpu-a__container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 32px;
    position: relative;
    z-index: 2;
  }

  /* Section header */
  .gpu-a__head {
    text-align: center;
    margin-bottom: 56px;
  }
  .gpu-a__label {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: rgba(126,233,255,0.10);
    border: 1.5px solid rgba(126,233,255,0.30);
    color: var(--highlight-blue-light);
    padding: 7px 16px;
    border-radius: 100px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 22px;
  }
  .gpu-a__label::before {
    content: '';
    width: 8px; height: 8px;
    border-radius: 50%;
    background: var(--green-light);
    box-shadow: 0 0 0 0 rgba(34,197,94,0.6);
    animation: gpu-pulse-green 1.6s ease-in-out infinite;
  }
  @keyframes gpu-pulse-green {
    0%, 100% { box-shadow: 0 0 0 0 rgba(34,197,94,0.7); }
    50%      { box-shadow: 0 0 0 6px rgba(34,197,94,0); }
  }
  .gpu-a__title {
    font-size: clamp(28px, 4vw, 46px);
    font-weight: 800;
    color: #fff;
    line-height: 1.15;
    letter-spacing: -1.2px;
    margin: 0 0 16px;
  }
  .gpu-a__title em {
    font-style: italic;
    background: linear-gradient(135deg, var(--nvidia-green), var(--highlight-blue-light));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
  }
  .gpu-a__sub {
    font-size: 15px;
    color: var(--gray-300);
    max-width: 680px;
    margin: 0 auto;
    line-height: 1.7;
  }

  /* Vendor segmented control (NVIDIA / AMD) */
  .gpu-a__vendor {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-bottom: 36px;
  }
  .gpu-a__vendor-btn {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 14px 32px 14px 22px;
    background: rgba(255,255,255,0.04);
    border: 1.5px solid rgba(255,255,255,0.08);
    border-radius: 14px 14px 0 0;
    color: var(--gray-300);
    font-size: 16px;
    font-weight: 800;
    letter-spacing: -0.3px;
    transition: all 0.3s var(--ease);
    position: relative;
    cursor: pointer;
  }
  .gpu-a__vendor-btn::after {
    content: '';
    position: absolute;
    bottom: -2px; left: 0; right: 0;
    height: 3px;
    background: transparent;
    transition: background 0.3s var(--ease);
  }
  .gpu-a__vendor-btn:hover {
    background: rgba(126,233,255,0.06);
    color: #fff;
  }
  .gpu-a__vendor-btn.is-active {
    background: linear-gradient(180deg, rgba(126,233,255,0.14), rgba(126,233,255,0.04));
    border-color: rgba(126,233,255,0.40);
    border-bottom-color: transparent;
    color: #fff;
  }
  .gpu-a__vendor-btn.is-active::after {
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
    box-shadow: 0 0 12px rgba(126,233,255,0.4);
  }
  .gpu-a__vendor-btn__logo {
    width: 26px; height: 26px;
    border-radius: 6px;
    display: grid;
    place-items: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    flex-shrink: 0;
  }
  .gpu-a__vendor-btn--nv .gpu-a__vendor-btn__logo {
    background: #76b900;
    color: #000;
  }
  .gpu-a__vendor-btn--amd .gpu-a__vendor-btn__logo {
    background: #FF4D4D;
    color: #fff;
  }

  /* Main showcase frame */
  .gpu-a__frame {
    background: linear-gradient(180deg, rgba(126,233,255,0.06), rgba(126,233,255,0.02));
    border: 1.5px solid rgba(126,233,255,0.25);
    border-radius: 24px;
    padding: 36px 32px 0;
    position: relative;
    overflow: hidden;
  }
  .gpu-a__frame::before {
    content: '';
    position: absolute;
    top: 0; left: 50%;
    transform: translateX(-50%);
    width: 70%; height: 200px;
    background: radial-gradient(ellipse at top, rgba(126,233,255,0.12), transparent 70%);
    pointer-events: none;
  }

  /* GPU Model carousel — horizontal scroller of 5 cards */
  .gpu-a__models {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 14px;
    margin-bottom: 28px;
    position: relative;
    z-index: 2;
  }
  @media (max-width: 900px) { .gpu-a__models { grid-template-columns: repeat(3, 1fr); } }
  @media (max-width: 560px) { .gpu-a__models { grid-template-columns: repeat(2, 1fr); } }
  .gpu-a__model {
    background: rgba(255,255,255,0.02);
    border: 1.5px solid transparent;
    border-radius: 16px;
    padding: 20px 14px 18px;
    text-align: center;
    cursor: pointer;
    transition: all 0.35s var(--ease);
    position: relative;
  }
  .gpu-a__model:hover {
    background: rgba(126,233,255,0.06);
    border-color: rgba(126,233,255,0.20);
    transform: translateY(-3px);
  }
  .gpu-a__model.is-active {
    background: linear-gradient(180deg, rgba(126,233,255,0.10), rgba(0,97,255,0.04));
    border-color: var(--highlight-blue-light);
    box-shadow: 0 12px 32px rgba(126,233,255,0.15);
  }
  .gpu-a__model.is-active::before {
    content: '';
    position: absolute;
    top: -1.5px; left: -1.5px; right: -1.5px;
    height: 60%;
    border-radius: 16px 16px 0 0;
    background: radial-gradient(ellipse at top, rgba(126,233,255,0.18), transparent 70%);
    pointer-events: none;
  }
  .gpu-a__model__img {
    width: 100%;
    aspect-ratio: 1;
    background: rgba(255,255,255,0.03);
    border: 1px dashed rgba(126,233,255,0.20);
    border-radius: 10px;
    display: grid;
    place-items: center;
    margin-bottom: 12px;
    color: var(--gray-400);
    font-family: 'JetBrains Mono', monospace;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.12em;
    transition: all 0.35s var(--ease);
    position: relative;
    overflow: hidden;
  }
  .gpu-a__model.is-active .gpu-a__model__img {
    background: rgba(118,185,0,0.10);
    border-color: rgba(118,185,0,0.40);
    color: var(--nvidia-green);
  }
  .gpu-a__model.is-active .gpu-a__model__img::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at center, rgba(118,185,0,0.15), transparent 70%);
  }
  .gpu-a__model__name {
    font-size: 12px;
    font-weight: 800;
    color: #fff;
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }
  .gpu-a__model.is-active .gpu-a__model__name {
    color: var(--highlight-blue-light);
  }

  /* Config sub-tabs */
  .gpu-a__configs {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-bottom: 32px;
    flex-wrap: wrap;
    position: relative;
    z-index: 2;
  }
  .gpu-a__config-btn {
    padding: 10px 22px;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.10);
    border-radius: 10px;
    color: var(--gray-300);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: -0.2px;
    transition: all 0.3s var(--ease);
    cursor: pointer;
  }
  .gpu-a__config-btn:hover:not(:disabled) {
    background: rgba(126,233,255,0.06);
    border-color: rgba(126,233,255,0.30);
    color: #fff;
  }
  .gpu-a__config-btn.is-active {
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    border-color: transparent;
    color: #fff;
    font-weight: 800;
    box-shadow: 0 6px 20px rgba(0,97,255,0.30);
  }
  .gpu-a__config-btn:disabled {
    opacity: 0.3;
    cursor: not-allowed;
    text-decoration: line-through;
  }

  /* Detail panel */
  .gpu-a__panel {
    padding: 8px 0 36px;
    position: relative;
    z-index: 2;
    min-height: 280px;
  }

  /* Panel — Memory Base / Dedicated GPU Base layout (2-col) */
  .gpu-a__split {
    display: grid;
    grid-template-columns: 0.8fr 1.2fr;
    gap: 36px;
    align-items: flex-start;
  }
  @media (max-width: 900px) {
    .gpu-a__split { grid-template-columns: 1fr; gap: 24px; }
  }
  .gpu-a__split-left h3 {
    font-size: 17px;
    font-weight: 800;
    color: var(--india-saffron-light);
    line-height: 1.4;
    letter-spacing: -0.3px;
    margin: 0 0 14px;
  }
  .gpu-a__split-left p {
    font-size: 13.5px;
    color: var(--gray-300);
    line-height: 1.7;
    margin: 0 0 22px;
  }
  .gpu-a__cta-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--highlight-blue-light);
    text-decoration: none;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: -0.2px;
    transition: all 0.3s var(--ease);
    border-bottom: 1px solid rgba(126,233,255,0.30);
    padding-bottom: 4px;
  }
  .gpu-a__cta-link:hover {
    color: #fff;
    border-bottom-color: #fff;
    transform: translateX(3px);
  }
  .gpu-a__cta-link::after {
    content: '→';
    transition: transform 0.3s var(--ease);
  }
  .gpu-a__cta-link:hover::after { transform: translateX(3px); }

  /* Specs header */
  .gpu-a__specs-head {
    text-align: center;
    margin-bottom: 14px;
  }
  .gpu-a__specs-title {
    font-size: 14px;
    font-weight: 800;
    color: var(--highlight-blue-light);
    letter-spacing: 0.04em;
    margin-bottom: 8px;
  }
  .gpu-a__specs-tflops {
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    color: var(--gray-300);
    letter-spacing: 0.04em;
  }

  /* Instances table */
  .gpu-a__table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    margin-top: 14px;
    background: rgba(255,255,255,0.02);
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid rgba(126,233,255,0.12);
  }
  .gpu-a__table th {
    padding: 14px 12px;
    background: rgba(126,233,255,0.06);
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--highlight-blue-light);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    border-bottom: 1px solid rgba(126,233,255,0.20);
  }
  .gpu-a__table th:first-child { text-align: left; }
  .gpu-a__table th small {
    display: block;
    font-size: 9px;
    color: var(--gray-400);
    font-weight: 700;
    margin-top: 2px;
  }
  .gpu-a__table td {
    padding: 14px 12px;
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 14px;
    font-weight: 700;
    color: #fff;
    border-bottom: 1px solid rgba(255,255,255,0.04);
    transition: background 0.2s var(--ease);
  }
  .gpu-a__table tbody tr:last-child td { border-bottom: 0; }
  .gpu-a__table tbody tr:hover td { background: rgba(126,233,255,0.04); }
  .gpu-a__table td:first-child {
    text-align: left;
    color: #CBD5E1;
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-size: 13px;
    font-weight: 700;
  }
  .gpu-a__table td:first-child small {
    display: block;
    font-size: 10.5px;
    color: var(--gray-400);
    font-weight: 500;
    margin-top: 2px;
    font-style: italic;
  }

  /* Appliance layout — 3-stat strip + spec card */
  .gpu-a__appliance-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    margin-bottom: 22px;
  }
  @media (max-width: 700px) { .gpu-a__appliance-stats { grid-template-columns: 1fr; } }
  .gpu-a__appliance-stat {
    background: rgba(255,255,255,0.02);
    border: 1px solid rgba(126,233,255,0.18);
    border-radius: 12px;
    padding: 18px 22px;
    transition: all 0.3s var(--ease);
  }
  .gpu-a__appliance-stat:hover {
    background: rgba(126,233,255,0.05);
    border-color: rgba(126,233,255,0.40);
    transform: translateY(-2px);
  }
  .gpu-a__appliance-stat__lbl {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: var(--gray-400);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 6px;
  }
  .gpu-a__appliance-stat__val {
    font-size: 18px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.3px;
    line-height: 1.2;
  }

  /* Appliance spec card */
  .gpu-a__server-spec {
    background: rgba(255,255,255,0.02);
    border: 1px solid rgba(126,233,255,0.18);
    border-radius: 12px;
    overflow: hidden;
  }
  .gpu-a__server-spec__head {
    padding: 18px 22px 14px;
    border-bottom: 1px dashed rgba(126,233,255,0.15);
  }
  .gpu-a__server-spec__title {
    font-size: 16px;
    font-weight: 800;
    color: #fff;
    margin: 0 0 4px;
    letter-spacing: -0.3px;
  }
  .gpu-a__server-spec__sub {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    color: var(--gray-300);
    letter-spacing: 0.02em;
  }
  .gpu-a__server-spec__list {
    padding: 18px 22px 22px;
    margin: 0;
    list-style: none;
    display: grid;
    gap: 10px;
  }
  .gpu-a__server-spec__list li {
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    color: var(--gray-200);
    line-height: 1.5;
    padding-left: 16px;
    position: relative;
  }
  .gpu-a__server-spec__list li::before {
    content: '▸';
    position: absolute;
    left: 0;
    color: var(--highlight-blue-light);
    font-weight: 800;
  }

  /* Empty state — for B200/B300/GB200 */
  .gpu-a__empty {
    text-align: center;
    padding: 32px 24px;
    background: rgba(255,107,53,0.04);
    border: 1.5px dashed rgba(255,107,53,0.30);
    border-radius: 16px;
    margin: 0 auto;
    max-width: 640px;
  }
  .gpu-a__empty__icon {
    width: 56px; height: 56px;
    margin: 0 auto 14px;
    border-radius: 14px;
    background: saddlebrown;
    display: grid;
    place-items: center;
    color: #fff;
    font-size: 26px;
    font-weight: 800;
    box-shadow: 0 8px 22px rgba(255,107,53,0.30);
  }
  .gpu-a__empty h4 {
    margin: 0 0 8px;
    font-size: 17px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.3px;
  }
  .gpu-a__empty p {
    margin: 0 0 18px;
    font-size: 13px;
    color: var(--gray-300);
    line-height: 1.6;
  }
  .gpu-a__empty__cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 22px;
    background: linear-gradient(135deg, var(--india-saffron), var(--india-saffron-light));
    color: #fff;
    text-decoration: none;
    border-radius: 100px;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: -0.2px;
    transition: all 0.3s var(--ease);
    box-shadow: 0 6px 18px rgba(255,107,53,0.30);
  }
  .gpu-a__empty__cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(255,107,53,0.40);
  }

  /* Value Proposition footer band */
  .gpu-a__value {
    margin-top: 56px;
    padding: 36px 40px;
    background: linear-gradient(135deg, rgba(126,233,255,0.04), rgba(0,97,255,0.02));
    border: 1px solid rgba(126,233,255,0.18);
    border-radius: 20px;
    display: grid;
    grid-template-columns: 0.8fr 1.2fr;
    gap: 36px;
    align-items: center;
    position: relative;
    z-index: 2;
  }
  @media (max-width: 800px) { .gpu-a__value { grid-template-columns: 1fr; gap: 20px; } }
  .gpu-a__value-title {
    font-size: clamp(22px, 2.6vw, 30px);
    font-weight: 800;
    color: #fff;
    line-height: 1.2;
    letter-spacing: -0.6px;
    margin: 0 0 8px;
  }
  .gpu-a__value-sub {
    font-family: 'JetBrains Mono', monospace;
    font-size: 12.5px;
    color: var(--india-saffron-light);
    letter-spacing: 0.04em;
    line-height: 1.6;
  }
  .gpu-a__value-body {
    font-size: 14px;
    color: var(--gray-300);
    line-height: 1.7;
    margin: 0;
  }


  /* ════════════════════════════════════════════════════════════════════
     ╔═══ OPTION B · LIGHT · SIDEBAR-NAV LAYOUT ═══╗
     Vendor pill toggle (top) · Left sidebar of GPU models ·
     Right detail panel with config tabs
     A completely different layout from option A
     ════════════════════════════════════════════════════════════════════ */
  .gpu-b {
    /* background: linear-gradient(180deg, #fff 0%, var(--gray-50) 100%); */
	background: #0b1425;
    color: var(--esds-navy);
    padding: 80px 0 100px;
  }
  .gpu-b__container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 32px;
  }

  /* Section header */
  .gpu-b__head {
    text-align: center;
    margin-bottom: 48px;
  }
  .gpu-b__label {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: #fff;
    border: 1.5px solid var(--gray-200);
    color: var(--gray-500);
    padding: 7px 16px;
    border-radius: 100px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 20px;
    box-shadow: 0 4px 14px rgba(10,22,40,0.04);
  }
  .gpu-b__label::before {
    content: '';
    width: 8px; height: 8px;
    border-radius: 50%;
    background: var(--india-green);
    animation: gpu-pulse-green 1.6s ease-in-out infinite;
  }
  .gpu-b__title {
    font-size: clamp(28px, 4vw, 46px);
    font-weight: 800;
    color: var(--esds-navy);
    line-height: 1.15;
    letter-spacing: -1.2px;
    margin: 0 0 16px;
  }
  .gpu-b__title em {
    font-style: italic;
    background: linear-gradient(135deg, var(--highlight-blue), #06B6D4);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
  }
  .gpu-b__sub {
    font-size: 15px;
    color: var(--gray-500);
    max-width: 680px;
    margin: 0 auto;
    line-height: 1.7;
  }

  /* Vendor pill toggle */
  .gpu-b__vendor {
    display: inline-flex;
    background: #fff;
    border: 1.5px solid var(--gray-200);
    border-radius: 100px;
    padding: 4px;
    margin: 0 auto 36px;
    box-shadow: 0 6px 20px rgba(10,22,40,0.06);
  }
  .gpu-b__vendor-wrap {
    text-align: center;
  }
  .gpu-b__vendor-btn {
    padding: 12px 26px;
    background: transparent;
    border: 0;
    border-radius: 100px;
    color: var(--gray-500);
    font-size: 14px;
    font-weight: 800;
    letter-spacing: -0.2px;
    transition: all 0.3s var(--ease);
    display: inline-flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
  }
  .gpu-b__vendor-btn:hover { color: var(--esds-navy); }
  .gpu-b__vendor-btn.is-active {
    background: linear-gradient(135deg, var(--esds-navy), #1E293B);
    color: #fff;
    box-shadow: 0 6px 16px rgba(10,22,40,0.20);
  }
  .gpu-b__vendor-btn__logo {
    width: 22px; height: 22px;
    border-radius: 5px;
    display: grid;
    place-items: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9px;
    font-weight: 800;
    flex-shrink: 0;
  }
  .gpu-b__vendor-btn--nv .gpu-b__vendor-btn__logo {
    background: var(--nvidia-green);
    color: #000;
  }
  .gpu-b__vendor-btn--amd .gpu-b__vendor-btn__logo {
    background: linear-gradient(135deg, var(--amd-red), #FF4D4D);
    color: #fff;
  }

  /* Two-column workspace · sidebar + detail */
  .gpu-b__workspace {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 24px;
    background: #fff;
    border: 1.5px solid var(--gray-200);
    border-radius: 20px;
    padding: 24px;
    box-shadow: 0 14px 40px rgba(10,22,40,0.08);
  }
  @media (max-width: 900px) {
    .gpu-b__workspace { grid-template-columns: 1fr; padding: 16px; }
  }

  /* Sidebar */
  .gpu-b__sidebar {
    background: var(--gray-50);
    border: 1px solid var(--gray-100);
    border-radius: 14px;
    padding: 12px;
  }
  .gpu-b__sidebar-head {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--gray-400);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    padding: 8px 12px 14px;
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .gpu-b__sidebar-head::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--gray-200);
  }
  .gpu-b__model {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 10px 12px;
    background: transparent;
    border: 1.5px solid transparent;
    border-radius: 10px;
    color: var(--gray-600);
    font-size: 13.5px;
    font-weight: 700;
    letter-spacing: -0.2px;
    cursor: pointer;
    transition: all 0.25s var(--ease);
    text-align: left;
    margin-bottom: 4px;
  }
  .gpu-b__model:hover:not(:disabled) {
    background: #fff;
    border-color: var(--gray-100);
    color: var(--esds-navy);
  }
  .gpu-b__model.is-active {
    background: linear-gradient(135deg, rgba(0,97,255,0.06), rgba(126,233,255,0.04));
    border-color: var(--highlight-blue);
    color: var(--esds-navy);
    font-weight: 800;
    box-shadow: 0 4px 12px rgba(0,97,255,0.10);
  }
  .gpu-b__model__img {
    width: 36px; height: 36px;
    border-radius: 8px;
    background: var(--gray-100);
    border: 1px dashed var(--gray-200);
    display: grid;
    place-items: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 7.5px;
    font-weight: 800;
    color: var(--gray-400);
    letter-spacing: 0.08em;
    flex-shrink: 0;
    transition: all 0.25s var(--ease);
  }
  .gpu-b__model.is-active .gpu-b__model__img {
    background: linear-gradient(135deg, var(--esds-navy), #1E293B);
    border-color: var(--esds-navy);
    color: #fff;
  }
  .gpu-b__model__body {
    flex: 1;
    min-width: 0;
  }
  .gpu-b__model__name { display: block; }
  .gpu-b__model__avail {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 700;
    color: var(--gray-400);
    letter-spacing: 0.06em;
    margin-top: 2px;
    text-transform: uppercase;
  }
  .gpu-b__model.is-active .gpu-b__model__avail { color: var(--highlight-blue); }
  .gpu-b__model[data-empty="true"] .gpu-b__model__avail {
    color: var(--india-saffron);
  }
  .gpu-b__model__check {
    width: 16px; height: 16px;
    border-radius: 50%;
    background: var(--gray-200);
    color: transparent;
    display: grid;
    place-items: center;
    font-size: 10px;
    font-weight: 800;
    flex-shrink: 0;
    transition: all 0.25s var(--ease);
  }
  .gpu-b__model.is-active .gpu-b__model__check {
    background: var(--highlight-blue);
    color: #fff;
  }
  .gpu-b__model.is-active .gpu-b__model__check::before {
    content: '✓';
  }

  /* Detail panel */
  .gpu-b__detail {
    padding: 16px 20px;
    min-height: 480px;
  }
  @media (max-width: 900px) { .gpu-b__detail { padding: 8px 4px; } }

  .gpu-b__detail-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
    margin-bottom: 24px;
    padding-bottom: 22px;
    border-bottom: 1px solid var(--gray-100);
  }
  .gpu-b__detail-title-wrap h3 {
    font-size: clamp(20px, 2.6vw, 26px);
    font-weight: 800;
    color: var(--esds-navy);
    margin: 0 0 6px;
    letter-spacing: -0.5px;
    line-height: 1.2;
  }
  .gpu-b__detail-tagline {
    font-size: 13.5px;
    color: var(--gray-500);
    line-height: 1.6;
    margin: 0;
    max-width: 540px;
  }
  .gpu-b__detail-cta {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    background: linear-gradient(135deg, var(--highlight-blue), #06B6D4);
    color: #fff;
    text-decoration: none;
    border-radius: 100px;
    font-size: 12.5px;
    font-weight: 800;
    letter-spacing: -0.2px;
    transition: all 0.3s var(--ease);
    box-shadow: 0 6px 16px rgba(0,97,255,0.20);
  }
  .gpu-b__detail-cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 22px rgba(0,97,255,0.30);
  }
  .gpu-b__detail-cta::after {
    content: '→';
    transition: transform 0.3s var(--ease);
  }
  .gpu-b__detail-cta:hover::after { transform: translateX(2px); }

  /* Config tabs (segmented) */
  .gpu-b__configs {
    display: inline-flex;
    background: var(--gray-50);
    border: 1px solid var(--gray-100);
    border-radius: 12px;
    padding: 4px;
    margin-bottom: 24px;
    flex-wrap: wrap;
    gap: 4px;
  }
  .gpu-b__config-btn {
    padding: 9px 18px;
    background: transparent;
    border: 0;
    border-radius: 8px;
    color: var(--gray-500);
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: -0.2px;
    transition: all 0.25s var(--ease);
    cursor: pointer;
  }
  .gpu-b__config-btn:hover:not(:disabled) {
    color: var(--esds-navy);
    background: #fff;
  }
  .gpu-b__config-btn.is-active {
    background: #fff;
    color: var(--esds-navy);
    font-weight: 800;
    box-shadow: 0 3px 10px rgba(10,22,40,0.08);
  }
  .gpu-b__config-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
    text-decoration: line-through;
  }

  /* Specs strip */
  .gpu-b__specs-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px 16px;
    background: linear-gradient(135deg, rgba(0,97,255,0.04), rgba(126,233,255,0.02));
    border: 1px solid rgba(0,97,255,0.10);
    border-radius: 10px;
    margin-bottom: 18px;
  }
  .gpu-b__specs-strip__lbl {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    align-self: center;
  }
  .gpu-b__specs-strip__items {
    flex: 1;
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    color: var(--gray-600);
    align-self: center;
    line-height: 1.5;
  }

  /* Instances table — light */
  .gpu-b__table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: #fff;
    border: 1px solid var(--gray-100);
    border-radius: 12px;
    overflow: hidden;
  }
  .gpu-b__table th {
    padding: 14px 14px;
    background: var(--gray-50);
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--gray-500);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    border-bottom: 1px solid var(--gray-100);
  }
  .gpu-b__table th:first-child { text-align: left; }
  .gpu-b__table th small {
    display: block;
    font-size: 9px;
    color: var(--gray-400);
    margin-top: 2px;
  }
  .gpu-b__table td {
    padding: 14px;
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 14px;
    font-weight: 700;
    color: var(--esds-navy);
    border-bottom: 1px solid var(--gray-100);
    transition: background 0.2s var(--ease);
  }
  .gpu-b__table tbody tr:last-child td { border-bottom: 0; }
  .gpu-b__table tbody tr:hover td { background: rgba(0,97,255,0.02); }
  .gpu-b__table td:first-child {
    text-align: left;
    color: var(--esds-navy);
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-size: 13px;
    font-weight: 800;
  }
  .gpu-b__table td:first-child small {
    display: block;
    font-size: 10.5px;
    color: var(--gray-400);
    font-weight: 500;
    margin-top: 2px;
    font-style: italic;
  }

  /* Appliance — 3 stat cards */
  .gpu-b__appliance-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-bottom: 18px;
  }
  @media (max-width: 700px) { .gpu-b__appliance-stats { grid-template-columns: 1fr; } }
  .gpu-b__appliance-stat {
    background: linear-gradient(135deg, #fff, var(--gray-50));
    border: 1px solid var(--gray-100);
    border-left: 3px solid var(--highlight-blue);
    border-radius: 10px;
    padding: 16px 20px;
    transition: all 0.3s var(--ease);
  }
  .gpu-b__appliance-stat:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(0,97,255,0.08);
    border-left-color: var(--india-saffron);
  }
  .gpu-b__appliance-stat__lbl {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: var(--gray-400);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 6px;
  }
  .gpu-b__appliance-stat__val {
    font-size: 17px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    line-height: 1.2;
  }

  /* Server spec card — light */
  .gpu-b__server-spec {
    background: #fff;
    border: 1px solid var(--gray-100);
    border-radius: 12px;
    overflow: hidden;
  }
  .gpu-b__server-spec__head {
    padding: 16px 22px 12px;
    border-bottom: 1px dashed var(--gray-100);
    background: var(--gray-50);
  }
  .gpu-b__server-spec__title {
    font-size: 15px;
    font-weight: 800;
    color: var(--esds-navy);
    margin: 0 0 4px;
    letter-spacing: -0.3px;
  }
  .gpu-b__server-spec__sub {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    color: var(--gray-500);
    letter-spacing: 0.02em;
  }
  .gpu-b__server-spec__list {
    padding: 18px 22px 22px;
    margin: 0;
    list-style: none;
    display: grid;
    gap: 10px;
  }
  .gpu-b__server-spec__list li {
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    color: var(--gray-600);
    line-height: 1.5;
    padding-left: 18px;
    position: relative;
  }
  .gpu-b__server-spec__list li::before {
    content: '';
    position: absolute;
    left: 0; top: 7px;
    width: 8px; height: 8px;
    border-radius: 2px;
    background: linear-gradient(135deg, var(--highlight-blue), #06B6D4);
  }

  /* Empty state — light */
  .gpu-b__empty {
    text-align: center;
    padding: 40px 24px;
    background: linear-gradient(135deg, rgba(255,107,53,0.04), rgba(244,166,35,0.02));
    border: 1.5px dashed rgba(255,107,53,0.30);
    border-radius: 16px;
  }
  .gpu-b__empty__icon {
    width: 64px; height: 64px;
    margin: 0 auto 14px;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--india-saffron), var(--india-saffron-light));
    display: grid;
    place-items: center;
    color: #fff;
    font-size: 28px;
    font-weight: 800;
    box-shadow: 0 10px 28px rgba(255,107,53,0.30);
  }
  .gpu-b__empty h4 {
    margin: 0 0 8px;
    font-size: 18px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
  }
  .gpu-b__empty p {
    margin: 0 auto 20px;
    max-width: 440px;
    font-size: 13px;
    color: var(--gray-500);
    line-height: 1.7;
  }
  .gpu-b__empty__cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 24px;
    background: linear-gradient(135deg, var(--india-saffron), var(--india-saffron-light));
    color: #fff;
    text-decoration: none;
    border-radius: 100px;
    font-size: 13px;
    font-weight: 800;
    transition: all 0.3s var(--ease);
    box-shadow: 0 6px 18px rgba(255,107,53,0.30);
  }
  .gpu-b__empty__cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(255,107,53,0.40);
  }

  /* Value Proposition — light variant */
  .gpu-b__value {
    margin-top: 56px;
    padding: 40px 44px;
    background: linear-gradient(135deg, var(--esds-navy) 0%, #1E293B 100%);
    border-radius: 22px;
    color: #fff;
    display: grid;
    grid-template-columns: 0.8fr 1.2fr;
    gap: 36px;
    align-items: center;
    position: relative;
    overflow: hidden;
  }
  .gpu-b__value::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
      linear-gradient(rgba(126,233,255,0.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(126,233,255,0.04) 1px, transparent 1px);
    background-size: 40px 40px;
    pointer-events: none;
  }
  @media (max-width: 800px) { .gpu-b__value { grid-template-columns: 1fr; gap: 20px; padding: 32px 28px; } }
  .gpu-b__value-title {
    font-size: clamp(22px, 2.6vw, 30px);
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -0.6px;
    margin: 0 0 8px;
    position: relative;
    z-index: 2;
  }
  .gpu-b__value-sub {
    font-family: 'JetBrains Mono', monospace;
    font-size: 12.5px;
    color: var(--india-saffron-light);
    letter-spacing: 0.04em;
    line-height: 1.6;
    position: relative;
    z-index: 2;
  }
  .gpu-b__value-body {
    font-size: 14px;
    color: var(--gray-200);
    line-height: 1.7;
    margin: 0;
    position: relative;
    z-index: 2;
  }


  /* ════════════════════════════════════════════════════════════════════
     Animation polish — common
     ════════════════════════════════════════════════════════════════════ */
  [data-panel].is-fading {
    animation: gpu-fade-in 0.45s var(--ease);
  }
  @keyframes gpu-fade-in {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
  }


  /* ═══════════════════════════════════════════════════════════════════
    -------------------- GPU as a services page ----------------------- 
  ═══════════════════════════════════════════════════════════════════ */
  
  /* ═══════════════════════════════════════════════════════════════════
    -------------------- Leadership page ----------------------- 
  ═══════════════════════════════════════════════════════════════════ */
  
  
  
/* ───────────────────────────────────────────────────────────────────────────
   §HERO — short, light theme
   ─────────────────────────────────────────────────────────────────────────── */
.ld1__hero {
    padding: 88px 0 24px;
    text-align: center;
    background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
    border-bottom: 1px solid var(--esds-gray-100);
}
.ld1__hero-tag {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 6px 14px;
    background: rgba(255, 153, 51, 0.06);
    border: 1px solid rgba(255, 153, 51, 0.30);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 16px;
}
.ld1__hero-tag::before {
    content: '';
    width: 22px; height: 7px;
    background: linear-gradient(180deg, var(--india-saffron) 33%, #fff 33% 66%, var(--india-green) 66%);
    border-radius: 1.5px;
}
.ld1__hero-title {
    font-size: clamp(28px, 4.4vw, 44px);
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -1px;
    line-height: 1.12;
    margin: 0 auto 8px;
    max-width: 720px;
}
.ld1__hero-title em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.ld1__hero-sub {
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    font-weight: 700;
    color: var(--esds-gray-500);
    letter-spacing: 0.06em;
    margin: 0;
    text-transform: uppercase;
}
.ld1__hero-sub span { color: var(--india-saffron); margin: 0 8px; }

.ld1__breadcrumb {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    margin-bottom: 18px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 600;
    color: var(--esds-gray-500);
    letter-spacing: 0.04em;
}
.ld1__breadcrumb a {
    color: var(--esds-gray-500);
    text-decoration: none;
    transition: color 0.2s;
}
.ld1__breadcrumb a:hover { color: var(--highlight-blue); }
.ld1__breadcrumb .current { color: var(--esds-navy); font-weight: 800; }


/* ───────────────────────────────────────────────────────────────────────────
   §BOOK — page-turn book layout
   ─────────────────────────────────────────────────────────────────────────── */
.ld1__book-wrap {
    padding: 40px 0 80px;
    background: linear-gradient(180deg, #fff 0%, #f8fafc 100%);
}
.ld1__book {
    max-width: 1240px;
    margin: 0 auto;
    padding: 0 20px;
    perspective: 2200px;
}
.ld1__pager {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 22px;
    padding: 0 4px;
}
.ld1__pager-counter {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--esds-gray-500);
    letter-spacing: 0.10em;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    gap: 10px;
}
.ld1__pager-counter strong {
    color: var(--india-saffron);
    font-size: 14px;
    font-family: var(--font-display);
}
.ld1__pager-counter-bar {
    width: 80px;
    height: 3px;
    background: var(--esds-gray-100);
    border-radius: 999px;
    position: relative;
    overflow: hidden;
}
.ld1__pager-counter-bar::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, var(--india-saffron), var(--highlight-blue));
    width: var(--ld1-progress, 14.28%);
    transition: width 0.5s var(--esds-ease);
    border-radius: 999px;
}
.ld1__pager-btns { display: flex; gap: 8px; }
.ld1__pager-btn {
    width: 42px; height: 42px;
    border-radius: 50%;
    background: #fff;
    border: 1.5px solid var(--esds-gray-200);
    color: var(--esds-navy);
    display: grid;
    place-items: center;
    cursor: pointer;
    transition: all 0.25s var(--esds-ease);
}
.ld1__pager-btn:hover:not(:disabled) {
    background: var(--india-saffron);
    color: #fff;
    border-color: var(--india-saffron);
    transform: translateY(-2px);
    box-shadow: 0 8px 22px rgba(255, 153, 51, 0.30);
}
.ld1__pager-btn:disabled { opacity: 0.35; cursor: not-allowed; }
.ld1__pager-btn svg { width: 16px; height: 16px; }

/* The book viewport */
.ld1__viewport {
    position: relative;
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 18px;
    box-shadow: 0 22px 60px rgba(10, 22, 40, 0.08);
    overflow: hidden;
    min-height: 600px;
}
.ld1__viewport::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 0; bottom: 0;
    width: 1px;
    background: linear-gradient(180deg, transparent, var(--esds-gray-200), transparent);
    transform: translateX(-50%);
    z-index: 1;
    pointer-events: none;
}

.ld1__page {
    display: none;
    transform-origin: left center;
}
.ld1__page.is-active {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    animation: ld1-page-turn 0.7s var(--esds-ease) both;
}
@keyframes ld1-page-turn {
    0%   { opacity: 0; transform: rotateY(-18deg) translateX(-30px); }
    60%  { opacity: 1; }
    100% { opacity: 1; transform: rotateY(0) translateX(0); }
}
.ld1__page.is-leaving {
    display: grid;
    grid-template-columns: 1fr 1fr;
    animation: ld1-page-out 0.5s var(--esds-ease) both;
    pointer-events: none;
}
@keyframes ld1-page-out {
    0%   { opacity: 1; transform: rotateY(0) translateX(0); }
    100% { opacity: 0; transform: rotateY(18deg) translateX(30px); }
}

/* Photo side */
.ld1__photo-side {
    padding: 44px 36px;
    background: linear-gradient(135deg, #f8fafc 0%, #fff 100%);
    position: relative;
    display: grid;
    place-items: center;
}
.ld1__photo-frame {
    position: relative;
    width: 100%;
    max-width: 380px;
    aspect-ratio: 4 / 5;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 24px 60px rgba(10, 22, 40, 0.18);
    background: linear-gradient(135deg, var(--esds-navy), var(--esds-deep));
    transition: transform 0.6s var(--esds-ease);
}
.ld1__photo-frame::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg,
        rgba(255, 153, 51, 0) 60%,
        rgba(0, 0, 0, 0.40) 100%);
    z-index: 2;
}
.ld1__photo-frame::after {
    /* Tricolor frame accent — top-right corner */
    content: '';
    position: absolute;
    top: 12px; right: 12px;
    width: 56px;
    height: 4px;
    background: linear-gradient(90deg,
        var(--india-saffron) 0%, var(--india-saffron) 33%,
        #fff 33%, #fff 66%,
        var(--india-green) 66%, var(--india-green) 100%);
    border-radius: 2px;
    z-index: 3;
}
.ld1__page.is-active .ld1__photo-frame {
    animation: ld1-photo-pop 0.9s var(--esds-ease) both;
}
@keyframes ld1-photo-pop {
    0%   { transform: scale(0.94) rotate(-1.5deg); }
    100% { transform: scale(1) rotate(0); }
}

/* Photo placeholder — initials + radial spotlight */
.ld1__photo-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.ld1__photo-placeholder {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    background:
        radial-gradient(circle at 30% 28%, rgba(0, 97, 255, 0.30), transparent 60%),
        radial-gradient(circle at 70% 75%, rgba(255, 153, 51, 0.22), transparent 65%),
        linear-gradient(135deg, #1e3a8a, var(--esds-navy));
    color: #fff;
}
.ld1__photo-initials {
    font-family: var(--font-display);
    font-size: clamp(72px, 10vw, 120px);
    font-weight: 800;
    letter-spacing: -3px;
    line-height: 1;
    background: linear-gradient(135deg, #fff, rgba(255, 255, 255, 0.55));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: 0 8px 28px rgba(0, 97, 255, 0.55);
}
.ld1__photo-tag {
    position: absolute;
    bottom: 16px;
    left: 16px;
    z-index: 3;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: #fff;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    padding: 5px 10px;
    background: rgba(0, 0, 0, 0.45);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-radius: 4px;
}

/* Bio side */
.ld1__bio-side {
    padding: 44px 44px 44px 48px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.ld1__bio-counter {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin: 0 0 10px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}
.ld1__bio-counter::before {
    content: '';
    width: 22px; height: 1px;
    background: var(--india-saffron);
}
.ld1__bio-name {
    font-size: clamp(28px, 3.4vw, 40px);
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.8px;
    line-height: 1.1;
    margin: 0 0 8px;
}
.ld1__bio-name em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.ld1__bio-role {
    font-size: 14.5px;
    font-weight: 700;
    color: var(--highlight-blue);
    letter-spacing: -0.1px;
    line-height: 1.4;
    margin: 0 0 22px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--esds-gray-100);
}

.ld1__bio-text {
    font-size: 13.5px;
    color: var(--esds-gray-700);
    line-height: 1.75;
    margin: 0 0 18px;
    max-height: 360px;
    overflow-y: auto;
    padding-right: 8px;
    scrollbar-width: thin;
    scrollbar-color: var(--esds-gray-200) transparent;
}
.ld1__bio-text::-webkit-scrollbar { width: 5px; }
.ld1__bio-text::-webkit-scrollbar-thumb {
    background: var(--esds-gray-200);
    border-radius: 999px;
}
.ld1__bio-text strong { color: var(--esds-navy); font-weight: 700; }
.ld1__bio-text em { font-style: italic; color: var(--highlight-blue); font-weight: 600; }

@media (max-width: 880px) {
    .ld1__viewport::before { display: none; }
    .ld1__page.is-active,
    .ld1__page.is-leaving { grid-template-columns: 1fr; }
    .ld1__photo-side { padding: 28px 24px 12px; }
    .ld1__photo-frame { max-width: 280px; }
    .ld1__bio-side { padding: 24px 28px 36px; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §ROSTER STRIP — bottom strip showing all 7 leaders
   ─────────────────────────────────────────────────────────────────────────── */
.ld1__roster {
    margin-top: 24px;
    padding: 18px 4px;
    border-top: 1px dashed var(--esds-gray-200);
}
.ld1__roster-label {
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--esds-gray-500);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin: 0 0 14px;
}
.ld1__roster-strip {
    display: flex;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
}
.ld1__roster-pill {
    padding: 7px 14px;
    background: #fff;
    border: 1.5px solid var(--esds-gray-200);
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 700;
    color: var(--esds-gray-700);
    cursor: pointer;
    transition: all 0.25s var(--esds-ease);
    font-family: inherit;
    letter-spacing: -0.1px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.ld1__roster-pill::before {
    content: '';
    width: 6px; height: 6px;
    border-radius: 50%;
    background: var(--esds-gray-200);
    flex-shrink: 0;
}
.ld1__roster-pill:hover {
    border-color: var(--india-saffron);
    color: var(--india-saffron);
    transform: translateY(-2px);
}
.ld1__roster-pill.is-active {
    background: var(--esds-navy);
    border-color: var(--esds-navy);
    color: #fff;
}
.ld1__roster-pill.is-active::before { background: var(--india-saffron); }
  
  
  


 /* ═══════════════════════════════════════════════════════════════════
     §1 · HERO
  ═══════════════════════════════════════════════════════════════════ */
  .pe__hero-sub {
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(15px, 1.8vw, 19px);
    font-weight: 700;
    color: var(--highlight-blue-light);
    margin: 0 0 28px;
    letter-spacing: -0.2px;
    line-height: 1.4;
    font-style: italic;
  }
  .pe__hero-sub::before {
    content: '◆';
    color: var(--india-saffron);
    margin-right: 10px;
    font-size: 0.8em;
    vertical-align: middle;
    font-style: normal;
  }


  /* ═══════════════════════════════════════════════════════════════════
     §2 · TECHNOLOGY PARTNERS — 13 cards across 4 categories
     Each card has a colored top zone with a custom SVG mark + brand
     name in mono + role tag. Hover: card lifts, brand color intensifies.
  ═══════════════════════════════════════════════════════════════════ */
  .pe__tech-intro {
    font-size: 16px;
    line-height: 1.75;
    color: var(--esds-gray-500);
    max-width: 880px;
    margin: 0 auto 56px;
    text-align: center;
  }
  .pe__tech-intro strong { color: var(--esds-navy); font-weight: 700; }

  /* Category block — sec-head--style category title + grid */
  .pe__cat-block {
    margin-bottom: 56px;
  }
  .pe__cat-block:last-child { margin-bottom: 0; }
  .pe__cat-head {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 22px;
    padding-bottom: 14px;
    border-bottom: 2px solid var(--esds-gray-100);
  }
  .pe__cat-head__icon {
    width: 40px; height: 40px;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 18px;
    box-shadow: 0 6px 16px rgba(0,97,255,0.20);
    flex-shrink: 0;
  }
  .pe__cat-head__icon--ai      { background: linear-gradient(135deg, #6D28D9, #A78BFA); box-shadow: 0 6px 16px rgba(124,58,237,0.25); }
  .pe__cat-head__icon--soft    { background: linear-gradient(135deg, #B45309, #F59E0B); box-shadow: 0 6px 16px rgba(217,119,6,0.25); }
  .pe__cat-head__icon--infra   { background: linear-gradient(135deg, #1E40AF, var(--highlight-blue)); box-shadow: 0 6px 16px rgba(0,97,255,0.25); }
  .pe__cat-head__icon--data    { background: linear-gradient(135deg, #047857, #10B981); box-shadow: 0 6px 16px rgba(5,150,105,0.25); }
  .pe__cat-head h3 {
    font-size: 22px;
    font-weight: 800;
    color: var(--esds-navy);
    margin: 0;
    letter-spacing: -0.3px;
  }
  .pe__cat-head__count {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--esds-gray-400);
    letter-spacing: 0.12em;
    margin-left: auto;
    text-transform: uppercase;
  }

  /* Partner grid */
  .pe__partners-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
  }
  @media (max-width: 1100px) { .pe__partners-grid { grid-template-columns: repeat(3, 1fr); } }
  @media (max-width: 768px)  { .pe__partners-grid { grid-template-columns: repeat(2, 1fr); } }
  @media (max-width: 480px)  { .pe__partners-grid { grid-template-columns: 1fr; } }

  .pe__partner-card {
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 16px;
    overflow: hidden;
    transition: all 0.4s var(--esds-ease);
    position: relative;
  }
  .pe__partner-card:hover {
    transform: translateY(-6px);
    border-color: var(--highlight-blue);
    box-shadow: 0 14px 36px rgba(0,97,255,0.10);
  }
  /* Top zone with brand-color gradient + SVG glyph */
  .pe__partner-card__brand {
    aspect-ratio: 16/9;
    position: relative;
    display: grid;
    place-items: center;
    overflow: hidden;
    transition: all 0.4s var(--esds-ease);
  }
  .pe__partner-card__brand::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
      linear-gradient(rgba(255,255,255,0.05) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,0.05) 1px, transparent 1px);
    background-size: 18px 18px;
    pointer-events: none;
    opacity: 0.6;
  }
  .pe__partner-card__brand::after {
    content: '';
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 200px; height: 200px;
    background: radial-gradient(circle, rgba(255,255,255,0.18), transparent 70%);
    pointer-events: none;
  }
  .pe__partner-card:hover .pe__partner-card__brand {
    transform: scale(1.02);
  }
  .pe__partner-card__glyph {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    color: #fff;
    text-align: center;
  }
  .pe__partner-card__glyph svg {
    filter: drop-shadow(0 2px 8px rgba(0,0,0,0.25));
    transition: transform 0.4s var(--esds-ease);
  }
  .pe__partner-card:hover .pe__partner-card__glyph svg {
    transform: scale(1.08) rotate(-3deg);
  }
  .pe__partner-card__name {
    font-family: 'JetBrains Mono', monospace;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.02em;
    text-shadow: 0 2px 8px rgba(0,0,0,0.2);
  }
  .pe__partner-card__body {
    padding: 16px 18px 18px;
  }
  .pe__partner-card__title {
    font-size: 15px;
    font-weight: 800;
    color: var(--esds-navy);
    line-height: 1.3;
    letter-spacing: -0.3px;
    margin: 0 0 6px;
  }
  .pe__partner-card__role {
    font-size: 12.5px;
    color: var(--esds-gray-500);
    line-height: 1.5;
    margin: 0;
  }

  /* Brand color variants — each tech partner gets a distinct gradient */
  .pe__partner-card--nvidia .pe__partner-card__brand   { background: linear-gradient(135deg, #76B900, #5A8F00); }
  .pe__partner-card--amd .pe__partner-card__brand      { background: linear-gradient(135deg, #ED1C24, #B71218); }
  .pe__partner-card--sap .pe__partner-card__brand      { background: linear-gradient(135deg, #003D7C, #0070C0); }
  .pe__partner-card--suse .pe__partner-card__brand     { background: linear-gradient(135deg, #30BA78, #1A8050); }
  .pe__partner-card--redhat .pe__partner-card__brand   { background: linear-gradient(135deg, #EE0000, #A30000); }
  .pe__partner-card--microsoft .pe__partner-card__brand{ background: linear-gradient(135deg, #00A4EF, #0078D4); }
  .pe__partner-card--cisco .pe__partner-card__brand    { background: linear-gradient(135deg, #1BA0D7, #047090); }
  .pe__partner-card--vmware .pe__partner-card__brand   { background: linear-gradient(135deg, #717074, #404048); }
  .pe__partner-card--dell .pe__partner-card__brand     { background: linear-gradient(135deg, #007DB8, #003C5C); }
  .pe__partner-card--hpe .pe__partner-card__brand      { background: linear-gradient(135deg, #01A982, #007D5F); }
  .pe__partner-card--oracle .pe__partner-card__brand   { background: linear-gradient(135deg, #C74634, #8C2D1F); }
  .pe__partner-card--postgres .pe__partner-card__brand { background: linear-gradient(135deg, #336791, #1E3F5E); }
  .pe__partner-card--mysql .pe__partner-card__brand    { background: linear-gradient(135deg, #00758F, #F29111); }

  /* Vendor CTA banner below the 4 categories */
  .pe__vendor-cta {
    margin-top: 64px;
    background: linear-gradient(135deg, rgba(0,97,255,0.04), rgba(126,233,255,0.02));
    border: 1.5px dashed rgba(0,97,255,0.25);
    border-radius: 18px;
    padding: 32px 36px;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 24px;
    align-items: center;
  }
  .pe__vendor-cta__copy h3 {
    font-size: 20px;
    font-weight: 800;
    color: var(--esds-navy);
    margin: 0 0 6px;
    letter-spacing: -0.3px;
  }
  .pe__vendor-cta__copy h3 em {
    font-style: italic;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .pe__vendor-cta__copy p {
    font-size: 14px;
    color: var(--esds-gray-500);
    line-height: 1.6;
    margin: 0;
  }
  .pe__vendor-cta__copy p strong { color: var(--esds-navy); font-weight: 700; }
  .pe__vendor-cta__btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 26px;
    background: var(--highlight-blue);
    color: #fff;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 800;
    text-decoration: none;
    transition: all 0.25s var(--esds-ease);
    white-space: nowrap;
  }
  .pe__vendor-cta__btn:hover {
    background: var(--esds-navy);
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(0,97,255,0.3);
    color: #fff;
  }
  @media (max-width: 760px) {
    .pe__vendor-cta { grid-template-columns: 1fr; text-align: center; }
    .pe__vendor-cta__btn { justify-self: center; }
  }


  /* ═══════════════════════════════════════════════════════════════════
     §3 · GOVERNMENT & REGULATORY (6 cards) — uses .why-grid + .why-card
     Page-specific: pe__cert-icon (svg mark) + pe__cert-tag (status pill)
  ═══════════════════════════════════════════════════════════════════ */
  .pe__cert-intro {
    font-size: 16px;
    line-height: 1.75;
    color: var(--esds-gray-500);
    max-width: 820px;
    margin: 0 auto 48px;
    text-align: center;
  }
  .pe__cert-intro strong { color: var(--esds-navy); font-weight: 700; }
  .pe__cert-intro em {
    font-style: italic;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
  }
  /* Override why-grid for 3-col 6 cards */
  .pe__cert-grid {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  @media (max-width: 992px) { .pe__cert-grid { grid-template-columns: repeat(2, 1fr) !important; } }
  @media (max-width: 600px) { .pe__cert-grid { grid-template-columns: 1fr !important; } }

  .pe__cert-icon {
    width: 56px; height: 56px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    font-size: 24px;
    margin-bottom: 18px;
    transition: all 0.35s var(--esds-ease);
    background: linear-gradient(135deg, rgba(0,97,255,0.10), rgba(126,233,255,0.10));
    color: var(--highlight-blue);
    border: 1px solid rgba(0,97,255,0.15);
  }
  .why-card:hover .pe__cert-icon {
    transform: rotate(-6deg) scale(1.06);
  }
  .pe__cert-icon--meity { background: linear-gradient(135deg, rgba(255,107,53,0.10), rgba(244,166,35,0.10)); color: var(--india-saffron); border-color: rgba(255,107,53,0.18); }
  .pe__cert-icon--stqc  { background: linear-gradient(135deg, rgba(124,58,237,0.10), rgba(167,139,250,0.10)); color: #6D28D9; border-color: rgba(124,58,237,0.18); }
  .pe__cert-icon--gem   { background: linear-gradient(135deg, rgba(19,136,8,0.10), rgba(34,197,94,0.10)); color: var(--india-green); border-color: rgba(19,136,8,0.20); }
  .pe__cert-icon--rbi   { background: linear-gradient(135deg, rgba(217,119,6,0.10), rgba(245,158,11,0.10)); color: #B45309; border-color: rgba(217,119,6,0.20); }
  .pe__cert-icon--sebi  { background: linear-gradient(135deg, rgba(220,38,38,0.10), rgba(239,68,68,0.10)); color: #B91C1C; border-color: rgba(220,38,38,0.18); }
  .pe__cert-icon--stpi  { background: linear-gradient(135deg, rgba(15,118,110,0.10), rgba(20,184,166,0.10)); color: #0F766E; border-color: rgba(15,118,110,0.18); }

  .pe__cert-tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 14px;
    padding: 6px 12px;
    background: rgba(16,185,129,0.08);
    border: 1px solid rgba(16,185,129,0.25);
    border-radius: 100px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--esds-green);
    letter-spacing: 0.04em;
  }
  .pe__cert-tag::before {
    content: '✓';
    font-size: 10px;
  }

  /* Override why-card__num to be smaller (we use icons primarily) */
  .why-card .pe__cert-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--esds-gray-400);
    letter-spacing: 0.18em;
    margin-bottom: 12px;
    display: block;
  }


  /* ═══════════════════════════════════════════════════════════════════
     §4 · INTEGRATED INDUSTRY STACK (6 cards) — uses .industry-mosaic
     Each card has a unique animated SVG icon representing the ecosystem
     (BFSI, SAP, AI/ML, SPOCHUB, Security, IoT)
  ═══════════════════════════════════════════════════════════════════ */
  .pe__stack-intro {
    font-size: 16px;
    line-height: 1.75;
    color: var(--esds-gray-500);
    max-width: 820px;
    margin: 0 auto 48px;
    text-align: center;
  }
  .pe__stack-intro strong { color: var(--esds-navy); font-weight: 700; }

  /* Override industry-mosaic to 3-col grid for the 6 stacks */
  .pe__stack-grid {
    grid-template-columns: repeat(3, 1fr) !important;
    display: grid;
    gap: 16px;
  }
  @media (max-width: 1100px) { .pe__stack-grid { grid-template-columns: repeat(2, 1fr) !important; } }
  @media (max-width: 600px)  { .pe__stack-grid { grid-template-columns: 1fr !important; } }

  /* Replace the .industry-tile__icon-ph with our animated SVG icon */
  .pe__stack-icon {
    width: 56px; height: 56px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    margin-bottom: 16px;
    position: relative;
    overflow: hidden;
    transition: all 0.35s var(--esds-ease);
  }
  .industry-tile:hover .pe__stack-icon {
    transform: scale(1.08);
  }
  .pe__stack-icon svg {
    width: 32px; height: 32px;
    color: #fff;
    z-index: 2;
    position: relative;
  }
  .pe__stack-icon--bfsi    { background: linear-gradient(135deg, #B45309, #F59E0B); box-shadow: 0 6px 16px rgba(217,119,6,0.25); }
  .pe__stack-icon--sap     { background: linear-gradient(135deg, #003D7C, #0070C0); box-shadow: 0 6px 16px rgba(0,112,192,0.25); }
  .pe__stack-icon--ai      { background: linear-gradient(135deg, #6D28D9, #A78BFA); box-shadow: 0 6px 16px rgba(124,58,237,0.25); }
  .pe__stack-icon--spochub { background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light)); box-shadow: 0 6px 16px rgba(0,97,255,0.25); }
  .pe__stack-icon--security{ background: linear-gradient(135deg, #B91C1C, #EF4444); box-shadow: 0 6px 16px rgba(185,28,28,0.25); }
  .pe__stack-icon--iot     { background: linear-gradient(135deg, var(--india-green), #22C55E); box-shadow: 0 6px 16px rgba(19,136,8,0.25); }

  /* Animated overlay on icon */
  .pe__stack-icon::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 30% 30%, rgba(255,255,255,0.25), transparent 70%);
    pointer-events: none;
  }
  /* SAP-specific: pulsing dot */
  .pe__stack-icon--sap svg circle.pulse-dot {
    animation: pe-pulse 1.6s ease-in-out infinite;
  }
  @keyframes pe-pulse {
    0%, 100% { opacity: 0.4; }
    50%      { opacity: 1; }
  }
  /* AI-specific: orbiting node */
  .pe__stack-icon--ai svg .orbit-node {
    transform-origin: center;
    animation: pe-orbit 4s linear infinite;
  }
  @keyframes pe-orbit {
    to { transform: rotate(360deg); }
  }

  /* Industry tile body — override main color a bit for our use */
  .industry-tile.pe__stack-tile {
    padding: 28px 26px 28px;
  }
  .pe__stack-tile h3 {
    font-size: 16px;
    font-weight: 800;
    color: var(--esds-navy);
    margin: 0 0 10px;
    letter-spacing: -0.3px;
    line-height: 1.3;
  }
  .pe__stack-tile p {
    font-size: 13px;
    color: var(--esds-gray-600);
    line-height: 1.7;
    margin: 0 0 14px;
  }
  .pe__stack-tile p strong { color: var(--esds-navy); font-weight: 700; }
  .pe__stack-tile p em {
    font-style: italic;
    color: var(--highlight-blue);
    font-weight: 700;
  }
  .pe__stack-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    padding-top: 14px;
    border-top: 1px dashed var(--esds-gray-100);
  }
  .pe__stack-tag {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 700;
    color: var(--highlight-blue);
    background: rgba(0,97,255,0.06);
    border: 1px solid rgba(0,97,255,0.15);
    padding: 3px 9px;
    border-radius: 5px;
    letter-spacing: 0.04em;
  }


  /* ═══════════════════════════════════════════════════════════════════
     §5 · CTA pre-tagline
  ═══════════════════════════════════════════════════════════════════ */
  .pe__cta-pre {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--highlight-blue-light);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 14px;
    display: inline-block;
    position: relative;
    z-index: 2;
  }
  .pe__cta-pre::before, .pe__cta-pre::after {
    content: '';
    display: inline-block;
    width: 24px; height: 1px;
    background: var(--highlight-blue-light);
    vertical-align: middle;
    opacity: 0.5;
    margin: 0 10px;
  }
  
  
  
  /* ═══════════════════════════════════════════════════════════════════
     §1 · HERO — small mono pre-tagline
  ═══════════════════════════════════════════════════════════════════ */
  .cs__hero-sub {
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(15px, 1.8vw, 19px);
    font-weight: 700;
    color: var(--highlight-blue-light);
    margin: 0 0 28px;
    letter-spacing: -0.2px;
    line-height: 1.4;
    font-style: italic;
  }
  .cs__hero-sub::before {
    content: '◆';
    color: var(--india-saffron);
    margin-right: 10px;
    font-size: 0.8em;
    vertical-align: middle;
    font-style: normal;
  }


  /* ═══════════════════════════════════════════════════════════════════
     §2 · CASE STUDIES WALL — filter chips + grid of 8 cards
     Each card uses main .deck-card system but in a 2-col vertical grid
     instead of horizontal scroll deck-track.
  ═══════════════════════════════════════════════════════════════════ */
  .cs__wall-intro {
    font-size: 16px;
    line-height: 1.75;
    color: var(--esds-gray-500);
    max-width: 880px;
    margin: 0 auto 36px;
    text-align: center;
  }
  .cs__wall-intro strong { color: var(--esds-navy); font-weight: 700; }

  /* Filter chips */
  .cs__filters {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin: 0 auto 48px;
    max-width: 880px;
  }
  .cs__filter {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 18px;
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 100px;
    font-size: 12.5px;
    font-weight: 800;
    color: var(--esds-gray-700);
    cursor: pointer;
    transition: all 0.25s var(--esds-ease);
    font-family: inherit;
  }
  .cs__filter:hover {
    border-color: var(--highlight-blue);
    color: var(--highlight-blue);
    transform: translateY(-2px);
  }
  .cs__filter.is-active {
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    border-color: transparent;
    color: #fff;
    box-shadow: 0 6px 18px rgba(0,97,255,0.25);
  }
  .cs__filter__count {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    background: rgba(255,255,255,0.18);
    padding: 2px 6px;
    border-radius: 100px;
    letter-spacing: 0.05em;
  }
  .cs__filter:not(.is-active) .cs__filter__count {
    background: var(--esds-gray-100);
    color: var(--esds-gray-500);
  }

  /* Grid override for deck-card (main is horizontal scroll, here we want grid) */
  .cs__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
  }
  @media (max-width: 900px) { .cs__grid { grid-template-columns: 1fr; } }

  .cs__grid .deck-card {
    flex: unset;
    transition: all 0.4s var(--esds-ease), opacity 0.3s, transform 0.3s, height 0.3s;
  }
  .cs__grid .deck-card.is-hidden {
    opacity: 0;
    pointer-events: none;
    transform: scale(0.95);
    height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    overflow: hidden;
  }
  .cs__grid .deck-card__viz {
    height: 220px;
  }
  .cs__grid .deck-card__body {
    padding: 26px 28px 28px;
  }

  /* Verbatim doc tagline — sits above the story, prominent navy bold */
  .cs__tagline {
    font-size: 14.5px;
    font-weight: 800;
    color: var(--esds-navy);
    line-height: 1.45;
    letter-spacing: -0.3px;
    margin: 4px 0 12px;
    padding: 10px 14px;
    background: linear-gradient(135deg, rgba(0,97,255,0.04), rgba(126,233,255,0.02));
    border-left: 3px solid var(--india-saffron);
    border-radius: 0 8px 8px 0;
    font-style: italic;
  }
  .cs__tagline em {
    font-style: italic;
    color: var(--highlight-blue);
    font-weight: 800;
  }

  /* 3-metric strip inside each card */
  .cs__metrics {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin: 14px 0 4px;
    padding: 14px 0;
    border-top: 1px dashed var(--esds-gray-100);
    border-bottom: 1px dashed var(--esds-gray-100);
  }
  .cs__metric {
    text-align: center;
    padding: 0 4px;
  }
  .cs__metric strong {
    display: block;
    font-family: 'JetBrains Mono', monospace;
    font-size: 17px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: -0.5px;
    line-height: 1.1;
    margin-bottom: 4px;
  }
  .cs__metric span {
    display: block;
    font-size: 10px;
    color: var(--esds-gray-500);
    line-height: 1.35;
    font-weight: 600;
  }
  .cs__metric--saffron strong { color: var(--india-saffron); }
  .cs__metric--green strong { color: var(--india-green); }

  /* Quote pull */
  .cs__quote {
    background: linear-gradient(135deg, rgba(0,97,255,0.04), rgba(126,233,255,0.02));
    border: 1px solid rgba(0,97,255,0.12);
    border-left: 3px solid var(--highlight-blue);
    padding: 14px 18px;
    border-radius: 8px;
    font-size: 12.5px;
    color: var(--esds-gray-700);
    line-height: 1.55;
    margin: 14px 0 4px;
    font-style: italic;
    position: relative;
  }
  .cs__quote::before {
    content: '"';
    position: absolute;
    top: -8px; left: 12px;
    font-family: Georgia, serif;
    font-size: 38px;
    font-weight: 900;
    color: var(--highlight-blue);
    line-height: 1;
    background: #fff;
    padding: 0 4px;
    font-style: normal;
  }
  .cs__quote cite {
    display: block;
    margin-top: 8px;
    font-size: 11px;
    font-weight: 800;
    font-style: normal;
    color: var(--esds-navy);
    letter-spacing: 0.02em;
  }


  /* ═══════════════════════════════════════════════════════════════════
     §VIZ · 8 UNIQUE CASE-STUDY VISUALIZATIONS (cs__viz-*)
     Each tells the solution-type story for that case study.
     ═══════════════════════════════════════════════════════════════════ */

  /* (1) ELGi — Donut showing "40% Saved" + "0 Downtime" badge */
  .cs__viz-elgi {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
  }
  .cs__viz-elgi__donut {
    width: 140px; height: 140px;
    position: relative;
  }
  .cs__viz-elgi__donut svg { transform: rotate(-90deg); }
  .cs__viz-elgi__donut .seg-bg { stroke: var(--esds-gray-100); fill: none; stroke-width: 8; }
  .cs__viz-elgi__donut .seg-fg {
    stroke: var(--highlight-blue);
    fill: none;
    stroke-width: 8;
    stroke-linecap: round;
    stroke-dasharray: 100.5 251.3;
    animation: cs-donut-draw 1.4s ease-out forwards;
  }
  @keyframes cs-donut-draw {
    from { stroke-dasharray: 0 251.3; }
    to { stroke-dasharray: 100.5 251.3; }
  }
  .cs__viz-elgi__pct {
    position: absolute; inset: 0;
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    color: var(--esds-navy);
  }
  .cs__viz-elgi__pct-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 30px; font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: -1px;
    line-height: 1;
  }
  .cs__viz-elgi__pct-label {
    font-size: 9px; font-weight: 800;
    color: var(--esds-gray-400);
    letter-spacing: 1.5px;
    text-transform: uppercase;
    margin-top: 4px;
  }
  .cs__viz-elgi__downtime {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
  }
  .cs__viz-elgi__zero {
    width: 56px; height: 56px;
    border-radius: 50%;
    background: rgba(16,185,129,0.1);
    border: 2px solid rgba(16,185,129,0.3);
    display: grid;
    place-items: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 28px;
    font-weight: 800;
    color: var(--esds-green);
    position: relative;
  }
  .cs__viz-elgi__zero::before {
    content: '';
    position: absolute;
    inset: -4px;
    border-radius: 50%;
    border: 2px solid rgba(16,185,129,0.2);
    animation: cs-pulse-ring 2s ease-out infinite;
  }
  @keyframes cs-pulse-ring {
    0% { transform: scale(1); opacity: 0.8; }
    100% { transform: scale(1.3); opacity: 0; }
  }
  .cs__viz-elgi__downtime-lbl {
    font-family: 'JetBrains Mono', monospace;
    font-size: 8px;
    font-weight: 800;
    color: var(--esds-green);
    letter-spacing: 1.2px;
    text-transform: uppercase;
    text-align: center;
    line-height: 1.3;
  }

  /* (2) MUDRA — Big ₹19.22L Cr typography + bank nodes radiating */
  .cs__viz-mudra {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 6px;
    position: relative;
  }
  .cs__viz-mudra__amount {
    font-family: 'JetBrains Mono', monospace;
    font-size: 40px;
    font-weight: 800;
    background: linear-gradient(135deg, var(--india-saffron), #F4A623);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    line-height: 1;
    letter-spacing: -2px;
  }
  .cs__viz-mudra__amount sup {
    font-size: 14px;
    vertical-align: super;
    font-weight: 800;
  }
  .cs__viz-mudra__lbl {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: var(--esds-gray-400);
    letter-spacing: 1.5px;
    text-transform: uppercase;
    margin-top: 6px;
  }
  .cs__viz-mudra__banks {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px dashed var(--esds-gray-100);
  }
  .cs__viz-mudra__banks-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 14px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: -0.5px;
  }
  .cs__viz-mudra__banks-dots {
    display: flex;
    gap: 3px;
  }
  .cs__viz-mudra__banks-dots span {
    width: 5px; height: 5px;
    border-radius: 50%;
    background: var(--highlight-blue);
    opacity: 0.4;
    animation: cs-mudra-dot 1.4s ease-in-out infinite;
  }
  .cs__viz-mudra__banks-dots span:nth-child(1) { animation-delay: 0s; }
  .cs__viz-mudra__banks-dots span:nth-child(2) { animation-delay: 0.15s; }
  .cs__viz-mudra__banks-dots span:nth-child(3) { animation-delay: 0.3s; }
  .cs__viz-mudra__banks-dots span:nth-child(4) { animation-delay: 0.45s; }
  .cs__viz-mudra__banks-dots span:nth-child(5) { animation-delay: 0.6s; }
  .cs__viz-mudra__banks-dots span:nth-child(6) { animation-delay: 0.75s; }
  .cs__viz-mudra__banks-dots span:nth-child(7) { animation-delay: 0.9s; }
  .cs__viz-mudra__banks-dots span:nth-child(8) { animation-delay: 1.05s; }
  @keyframes cs-mudra-dot {
    0%, 100% { opacity: 0.3; transform: scale(1); }
    50%      { opacity: 1; transform: scale(1.4); }
  }

  /* (3) Elections — Auto-scaling traffic surge curve */
  .cs__viz-elections {
    width: 240px;
    height: 160px;
    position: relative;
  }
  .cs__viz-elections svg { width: 100%; height: 100%; overflow: visible; }
  .cs__viz-elections .grid-line {
    stroke: var(--esds-gray-100);
    stroke-width: 1;
    stroke-dasharray: 2 3;
  }
  .cs__viz-elections .traffic-line {
    stroke: var(--india-saffron);
    stroke-width: 2.5;
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-dasharray: 600;
    stroke-dashoffset: 600;
    animation: cs-line-draw 2.4s ease-out 0.2s forwards;
  }
  .cs__viz-elections .traffic-fill {
    fill: url(#cs-elections-grad);
    opacity: 0;
    animation: cs-fill-fade 1s ease-out 1.6s forwards;
  }
  @keyframes cs-line-draw { to { stroke-dashoffset: 0; } }
  @keyframes cs-fill-fade { to { opacity: 0.18; } }
  .cs__viz-elections .surge-dot {
    fill: var(--india-saffron);
    animation: cs-surge-pulse 1.8s ease-in-out infinite 2s;
  }
  @keyframes cs-surge-pulse {
    0%, 100% { r: 5; opacity: 1; }
    50%      { r: 8; opacity: 0.6; }
  }
  .cs__viz-elections__badge {
    position: absolute;
    top: 8px; right: 8px;
    background: rgba(255,107,53,0.12);
    border: 1px solid rgba(255,107,53,0.3);
    color: var(--india-saffron);
    padding: 3px 10px;
    border-radius: 100px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
  }

  /* (4) Smart Cities — 14-node constellation around central cloud */
  .cs__viz-smartcities {
    width: 240px;
    height: 160px;
    position: relative;
  }
  .cs__viz-smartcities svg { width: 100%; height: 100%; overflow: visible; }
  .cs__viz-smartcities .city-node {
    fill: var(--highlight-blue);
    stroke: #fff;
    stroke-width: 1.5;
    transform-origin: center;
  }
  .cs__viz-smartcities .city-link {
    stroke: var(--highlight-blue);
    stroke-width: 1.2;
    opacity: 0.35;
    stroke-dasharray: 3 2;
    animation: cs-flow 2s linear infinite;
  }
  @keyframes cs-flow { to { stroke-dashoffset: -10; } }
  .cs__viz-smartcities .city-hub {
    fill: var(--india-green);
    stroke: #fff;
    stroke-width: 2;
    animation: cs-hub-pulse 2s ease-in-out infinite;
  }
  @keyframes cs-hub-pulse {
    0%, 100% { r: 11; }
    50%      { r: 13; }
  }
  .cs__viz-smartcities .city-hub-ring {
    fill: none;
    stroke: var(--india-green);
    stroke-width: 1.5;
    opacity: 0;
    animation: cs-hub-ring 2.5s ease-out infinite;
  }
  @keyframes cs-hub-ring {
    0%   { r: 12; opacity: 0.6; }
    100% { r: 30; opacity: 0; }
  }

  /* (5) Healthcare — ECG heartbeat line */
  .cs__viz-healthcare {
    width: 240px;
    height: 140px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .cs__viz-healthcare svg { width: 100%; height: 100%; overflow: visible; }
  .cs__viz-healthcare .ecg-grid {
    stroke: var(--esds-gray-100);
    stroke-width: 1;
  }
  .cs__viz-healthcare .ecg-line {
    stroke: var(--esds-green);
    stroke-width: 2.5;
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
    filter: drop-shadow(0 0 4px rgba(16,185,129,0.4));
  }
  .cs__viz-healthcare .ecg-line {
    stroke-dasharray: 800;
    stroke-dashoffset: 800;
    animation: cs-ecg-draw 3s linear infinite;
  }
  @keyframes cs-ecg-draw { to { stroke-dashoffset: 0; } }
  .cs__viz-healthcare__pill {
    position: absolute;
    top: 8px; right: 8px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(16,185,129,0.1);
    border: 1px solid rgba(16,185,129,0.3);
    color: var(--esds-green);
    padding: 3px 10px;
    border-radius: 100px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.1em;
  }
  .cs__viz-healthcare__pill::before {
    content: '';
    width: 5px; height: 5px;
    border-radius: 50%;
    background: var(--esds-green);
    box-shadow: 0 0 0 0 rgba(16,185,129,0.6);
    animation: cs-status-pulse 1s ease-in-out infinite;
  }
  @keyframes cs-status-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(16,185,129,0.6); }
    50%      { box-shadow: 0 0 0 5px rgba(16,185,129,0); }
  }

  /* (6) Surfa Coats — 3-stacked layer (IoT / DR / SAP) */
  .cs__viz-surfa {
    width: 240px;
    height: 160px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
  }
  .cs__viz-surfa__layer {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 10px 16px;
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 10px;
    transform: translateX(-30px);
    opacity: 0;
    animation: cs-surfa-slide 0.7s var(--esds-ease) both;
    position: relative;
    overflow: hidden;
  }
  .cs__viz-surfa__layer:nth-child(1) { animation-delay: 0.1s; }
  .cs__viz-surfa__layer:nth-child(2) { animation-delay: 0.3s; }
  .cs__viz-surfa__layer:nth-child(3) { animation-delay: 0.5s; }
  @keyframes cs-surfa-slide {
    to { transform: translateX(0); opacity: 1; }
  }
  .cs__viz-surfa__layer::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 3px;
  }
  .cs__viz-surfa__layer--iot::before { background: var(--india-saffron); }
  .cs__viz-surfa__layer--dr::before { background: var(--highlight-blue); }
  .cs__viz-surfa__layer--sap::before { background: var(--india-green); }
  .cs__viz-surfa__icon {
    width: 28px; height: 28px;
    border-radius: 8px;
    display: grid;
    place-items: center;
    font-size: 14px;
    flex-shrink: 0;
  }
  .cs__viz-surfa__layer--iot .cs__viz-surfa__icon { background: rgba(255,107,53,0.12); }
  .cs__viz-surfa__layer--dr .cs__viz-surfa__icon { background: rgba(0,97,255,0.12); }
  .cs__viz-surfa__layer--sap .cs__viz-surfa__icon { background: rgba(19,136,8,0.12); }
  .cs__viz-surfa__name {
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: 0.05em;
  }
  .cs__viz-surfa__sub {
    font-size: 9.5px;
    color: var(--esds-gray-500);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    font-weight: 700;
  }

  /* (7) Cooperative Banks — Central cloud + radiating bank dots wave */
  .cs__viz-cooperative {
    width: 220px;
    height: 160px;
    position: relative;
  }
  .cs__viz-cooperative svg { width: 100%; height: 100%; overflow: visible; }
  .cs__viz-cooperative .coop-cloud {
    fill: var(--esds-navy);
    stroke: var(--india-saffron);
    stroke-width: 2;
  }
  .cs__viz-cooperative .coop-cloud-glow {
    fill: rgba(255,107,53,0.18);
    animation: cs-coop-glow 2s ease-in-out infinite;
  }
  @keyframes cs-coop-glow {
    0%, 100% { transform: scale(1); opacity: 0.6; }
    50%      { transform: scale(1.15); opacity: 0.9; }
  }
  .cs__viz-cooperative .coop-bank {
    fill: var(--highlight-blue);
    stroke: #fff;
    stroke-width: 1;
    opacity: 0;
    animation: cs-coop-pop 0.4s ease-out forwards, cs-coop-twinkle 3s ease-in-out infinite;
  }
  @keyframes cs-coop-pop { to { opacity: 0.85; } }
  @keyframes cs-coop-twinkle {
    0%, 100% { opacity: 0.6; }
    50%      { opacity: 1; }
  }
  .cs__viz-cooperative .coop-link {
    stroke: var(--highlight-blue);
    stroke-width: 0.8;
    opacity: 0.25;
  }

  /* (8) PSU — 3 sector icons (highway/bolt/tower) */
  .cs__viz-psu {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
  }
  .cs__viz-psu__pillar {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    flex: 1;
    max-width: 90px;
    text-align: center;
  }
  .cs__viz-psu__icon {
    width: 60px; height: 60px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    font-size: 26px;
    background: linear-gradient(135deg, rgba(19,136,8,0.1), rgba(19,136,8,0.04));
    border: 1.5px solid rgba(19,136,8,0.2);
    color: var(--india-green);
    transition: all 0.3s var(--esds-ease);
    position: relative;
  }
  .cs__viz-psu__icon::after {
    content: '';
    position: absolute;
    inset: -4px;
    border-radius: 16px;
    border: 1.5px solid rgba(19,136,8,0.3);
    opacity: 0;
    animation: cs-psu-ring 2.4s ease-in-out infinite;
  }
  .cs__viz-psu__pillar:nth-child(1) .cs__viz-psu__icon::after { animation-delay: 0s; }
  .cs__viz-psu__pillar:nth-child(2) .cs__viz-psu__icon::after { animation-delay: 0.4s; }
  .cs__viz-psu__pillar:nth-child(3) .cs__viz-psu__icon::after { animation-delay: 0.8s; }
  @keyframes cs-psu-ring {
    0%, 100% { transform: scale(1); opacity: 0; }
    50%      { transform: scale(1.1); opacity: 0.8; }
  }
  .cs__viz-psu__name {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: 0.04em;
  }


  /* ═══════════════════════════════════════════════════════════════════
     §3 · INDUSTRIES SUMMARY — partner-wall reuse
  ═══════════════════════════════════════════════════════════════════ */
  .cs__industry-tile {
    background: linear-gradient(180deg, #fff, var(--esds-gray-50));
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 20px 24px;
    text-align: center;
    transition: all 0.3s var(--esds-ease);
    min-width: 200px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 14px;
  }
  .cs__industry-tile:hover {
    border-color: var(--highlight-blue);
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(0,97,255,0.08);
  }
  .cs__industry-tile__icon {
    width: 38px; height: 38px;
    border-radius: 10px;
    background: linear-gradient(135deg, rgba(0,97,255,0.1), rgba(126,233,255,0.1));
    color: var(--highlight-blue);
    display: grid;
    place-items: center;
    font-size: 18px;
    flex-shrink: 0;
  }
  .cs__industry-tile__copy {
    text-align: left;
    flex: 1;
  }
  .cs__industry-tile__name {
    font-size: 13.5px;
    font-weight: 800;
    color: var(--esds-navy);
    line-height: 1.3;
    margin: 0 0 2px;
  }
  .cs__industry-tile__count {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }


  /* ═══════════════════════════════════════════════════════════════════
     §4 · CTA pre-tagline
  ═══════════════════════════════════════════════════════════════════ */
  .cs__cta-pre {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--highlight-blue-light);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 14px;
    display: inline-block;
    position: relative;
    z-index: 2;
  }
  .cs__cta-pre::before, .cs__cta-pre::after {
    content: '';
    display: inline-block;
    width: 24px; height: 1px;
    background: var(--highlight-blue-light);
    vertical-align: middle;
    opacity: 0.5;
    margin: 0 10px;
  }
  
  /* ═══════════════════════════════════════════════════════════════════
     §1 · HERO — small mono pre-tagline above title
  ═══════════════════════════════════════════════════════════════════ */
  .awards__hero-sub {
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(15px, 1.8vw, 19px);
    font-weight: 700;
    color: var(--highlight-blue-light);
    margin: 0 0 28px;
    letter-spacing: -0.2px;
    line-height: 1.4;
  }
  .awards__hero-sub::before {
    content: '◆';
    color: var(--india-saffron);
    margin-right: 10px;
    font-size: 0.8em;
    vertical-align: middle;
  }


  /* ═══════════════════════════════════════════════════════════════════
     §2 · AWARDS WALL — filterable grid with institute "logo" cards
     Each award card has a colored gradient top zone where the awarding
     institute's initials/acronym sit in big mono typography (acts as
     logo placeholder until real logos are added). Bottom is body content.
     Hover: card lifts, gradient intensifies, year badge rotates slightly.
  ═══════════════════════════════════════════════════════════════════ */
  .awards__wall-intro {
    font-size: 16px;
    line-height: 1.75;
    color: var(--esds-gray-500);
    max-width: 880px;
    margin: 0 auto 36px;
    text-align: center;
  }
  .awards__wall-intro strong { color: var(--esds-navy); font-weight: 700; }

  /* Category filter chips */
  .awards__filters {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin: 0 auto 48px;
    max-width: 880px;
  }
  .awards__filter {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 18px;
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 100px;
    font-size: 12.5px;
    font-weight: 800;
    color: var(--esds-gray-700);
    cursor: pointer;
    transition: all 0.25s var(--esds-ease);
    font-family: inherit;
  }
  .awards__filter:hover {
    border-color: var(--highlight-blue);
    color: var(--highlight-blue);
    transform: translateY(-2px);
  }
  .awards__filter.is-active {
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    border-color: transparent;
    color: #fff;
    box-shadow: 0 6px 18px rgba(0,97,255,0.25);
  }
  .awards__filter__count {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    background: rgba(255,255,255,0.18);
    padding: 2px 6px;
    border-radius: 100px;
    letter-spacing: 0.05em;
  }
  .awards__filter:not(.is-active) .awards__filter__count {
    background: var(--esds-gray-100);
    color: var(--esds-gray-500);
  }

  /* Award grid */
  .awards__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
  }
  @media (max-width: 1100px) { .awards__grid { grid-template-columns: repeat(2, 1fr); } }
  @media (max-width: 640px)  { .awards__grid { grid-template-columns: 1fr; } }

  .awards__card {
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 20px;
    overflow: hidden;
    transition: all 0.4s var(--esds-ease);
    display: flex;
    flex-direction: column;
    position: relative;
  }
  .awards__card:hover {
    transform: translateY(-6px);
    border-color: var(--highlight-blue);
    box-shadow: 0 18px 44px rgba(0,97,255,0.10);
  }
  .awards__card.is-hidden {
    opacity: 0;
    pointer-events: none;
    transform: scale(0.95);
    height: 0;
    padding: 0;
    margin: 0;
    border: 0;
    overflow: hidden;
  }

  /* Logo placeholder zone — colored gradient with awarding institute initials */
  .awards__card__logo {
    aspect-ratio: 16/8;
    position: relative;
    overflow: hidden;
    display: grid;
    place-items: center;
    color: #fff;
    transition: all 0.4s var(--esds-ease);
  }
  .awards__card__logo::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
      linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px);
    background-size: 22px 22px;
    pointer-events: none;
  }
  .awards__card__logo::after {
    content: '';
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 220px; height: 220px;
    background: radial-gradient(circle, rgba(255,255,255,0.18), transparent 70%);
    pointer-events: none;
  }
  .awards__card__initials {
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(28px, 4vw, 42px);
    font-weight: 800;
    letter-spacing: -1.5px;
    line-height: 1;
    text-align: center;
    z-index: 1;
    position: relative;
    text-shadow: 0 2px 12px rgba(0,0,0,0.2);
  }
  .awards__card:hover .awards__card__initials {
    transform: scale(1.05);
    transition: transform 0.4s var(--esds-ease);
  }

  /* Year ribbon — top-right corner */
  .awards__card__year {
    position: absolute;
    top: 14px; right: 14px;
    background: rgba(0,0,0,0.4);
    backdrop-filter: blur(6px);
    color: #fff;
    padding: 5px 14px;
    border-radius: 100px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.06em;
    z-index: 2;
    border: 1px solid rgba(255,255,255,0.18);
    transition: transform 0.3s var(--esds-ease);
  }
  .awards__card:hover .awards__card__year {
    transform: scale(1.05);
  }

  /* Trophy icon — top-left of logo zone */
  .awards__card__trophy {
    position: absolute;
    top: 14px; left: 14px;
    width: 32px; height: 32px;
    border-radius: 8px;
    background: rgba(255,255,255,0.18);
    border: 1px solid rgba(255,255,255,0.25);
    display: grid;
    place-items: center;
    font-size: 16px;
    z-index: 2;
    backdrop-filter: blur(6px);
  }

  /* Card body — light bg, content */
  .awards__card__body {
    padding: 22px 24px 24px;
    display: flex;
    flex-direction: column;
    flex: 1;
  }
  .awards__card__category {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--highlight-blue);
    margin-bottom: 8px;
    display: inline-block;
  }
  .awards__card__title {
    font-size: 16.5px;
    font-weight: 800;
    color: var(--esds-navy);
    line-height: 1.35;
    letter-spacing: -0.3px;
    margin: 0 0 10px;
  }
  .awards__card__institute {
    font-size: 12.5px;
    color: var(--esds-gray-500);
    line-height: 1.5;
    margin: 0 0 14px;
    flex: 1;
  }
  .awards__card__institute strong {
    color: var(--esds-navy);
    font-weight: 700;
  }
  .awards__card__footer {
    padding-top: 12px;
    border-top: 1px dashed var(--esds-gray-100);
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--esds-gray-400);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .awards__card__footer strong {
    color: var(--highlight-blue);
    font-weight: 800;
  }

  /* Institute color variants — applied via .awards__card--{type} */
  .awards__card--cloud .awards__card__logo      { background: linear-gradient(135deg, #1E40AF, #3B82F6); }
  .awards__card--innovation .awards__card__logo { background: linear-gradient(135deg, #6D28D9, #A78BFA); }
  .awards__card--enterprise .awards__card__logo { background: linear-gradient(135deg, #0F766E, #14B8A6); }
  .awards__card--media .awards__card__logo      { background: linear-gradient(135deg, #B91C1C, #EF4444); }
  .awards__card--datacentre .awards__card__logo { background: linear-gradient(135deg, var(--esds-navy), #1E293B); }
  .awards__card--banking .awards__card__logo    { background: linear-gradient(135deg, #B45309, #F59E0B); }
  .awards__card--government .awards__card__logo { background: linear-gradient(135deg, #138808, #22C55E); }
  .awards__card--workplace .awards__card__logo  { background: linear-gradient(135deg, #C2410C, #FF6B35); }
  .awards__card--sustainability .awards__card__logo { background: linear-gradient(135deg, #047857, #10B981); }


  /* ═══════════════════════════════════════════════════════════════════
     §3 · AWARDING INSTITUTES WALL — partner-style logo strip
     Reuses .partner-wall + .partner-tile from main (§22)
     Page-specific: small style override for institute badge variant
  ═══════════════════════════════════════════════════════════════════ */
  .awards__institutes-intro {
    font-size: 16px;
    line-height: 1.75;
    color: var(--esds-gray-500);
    max-width: 820px;
    margin: 0 auto 36px;
    text-align: center;
  }
  .awards__institutes-intro strong { color: var(--esds-navy); font-weight: 700; }

  /* Custom institute tiles — bigger than partner-tile, with subtle gradient */
  .awards__institute-tile {
    background: linear-gradient(180deg, #fff, var(--esds-gray-50));
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 22px 24px;
    text-align: center;
    transition: all 0.3s var(--esds-ease);
    position: relative;
    min-width: 180px;
    flex: 0 0 auto;
  }
  .awards__institute-tile:hover {
    border-color: var(--highlight-blue);
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(0,97,255,0.08);
  }
  .awards__institute-tile__name {
    font-size: 13.5px;
    font-weight: 800;
    color: var(--esds-navy);
    line-height: 1.35;
    letter-spacing: -0.3px;
    margin: 0 0 6px;
  }
  .awards__institute-tile__count {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }


  /* ═══════════════════════════════════════════════════════════════════
     §4 · TIMELINE VIEW — chronological wall
     Reuses .timeline-v + .timeline-v__item from main (§17)
     Page-specific: clusters of awards under each year
  ═══════════════════════════════════════════════════════════════════ */
  .awards__timeline-intro {
    font-size: 16px;
    line-height: 1.75;
    color: var(--esds-gray-500);
    max-width: 820px;
    margin: 0 auto 48px;
    text-align: center;
  }
  .awards__timeline-intro strong { color: var(--esds-navy); font-weight: 700; }
  .awards__timeline-list {
    list-style: none;
    padding: 0 0 0 36px;
    margin: 0 auto;
    max-width: 920px;
    position: relative;
  }
  .awards__timeline-list::before {
    content: '';
    position: absolute;
    left: 10px; top: 4px; bottom: 4px;
    width: 2px;
    background: linear-gradient(180deg,
      var(--highlight-blue) 0%,
      var(--highlight-blue-light) 50%,
      var(--india-saffron) 100%);
    opacity: 0.4;
  }
  .awards__timeline-item {
    position: relative;
    margin-bottom: 32px;
    padding-bottom: 24px;
    border-bottom: 1px dashed var(--esds-gray-100);
  }
  .awards__timeline-item:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: 0;
  }
  .awards__timeline-item::before {
    content: '';
    position: absolute;
    left: -32px; top: 4px;
    width: 14px; height: 14px;
    border-radius: 50%;
    background: var(--highlight-blue);
    border: 3px solid #fff;
    box-shadow: 0 0 0 2px var(--highlight-blue), 0 0 18px rgba(0,97,255,0.3);
  }
  .awards__timeline-year {
    font-family: 'JetBrains Mono', monospace;
    font-size: 13px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.05em;
    margin-bottom: 12px;
  }
  .awards__timeline-awards {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 8px;
  }
  .awards__timeline-award {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 10px;
    padding: 12px 16px;
    transition: all 0.25s var(--esds-ease);
  }
  .awards__timeline-award:hover {
    border-color: var(--highlight-blue);
    background: rgba(0,97,255,0.02);
    transform: translateX(4px);
  }
  .awards__timeline-award strong {
    font-size: 14px;
    font-weight: 800;
    color: var(--esds-navy);
    display: block;
    line-height: 1.4;
    margin-bottom: 3px;
  }
  .awards__timeline-award span {
    font-size: 12.5px;
    color: var(--esds-gray-500);
  }


  /* ═══════════════════════════════════════════════════════════════════
     §5 · CLOSING TAGLINE + CTA
  ═══════════════════════════════════════════════════════════════════ */
  .awards__cta-pre {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--highlight-blue-light);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 14px;
    display: inline-block;
    position: relative;
    z-index: 2;
  }
  .awards__cta-pre::before, .awards__cta-pre::after {
    content: '';
    display: inline-block;
    width: 24px; height: 1px;
    background: var(--highlight-blue-light);
    vertical-align: middle;
    opacity: 0.5;
    margin: 0 10px;
  }
  
  
  /* ═══════════════════════════════════════════════════════════════════
     §2 · CERTIFICATION WALL BY CATEGORY (visual hero)
     Uses .cert-cat + .cert-grid + .cert-card from main (§41)
     Each cert-card has navy `cert-badge-block` (the "logo placeholder"
     showing cert acronym in mono type) + info on right.
     This section IS the logo wall.
  ═══════════════════════════════════════════════════════════════════ */
  .certs__wall-intro {
    font-size: 16px;
    line-height: 1.75;
    color: var(--esds-gray-500);
    max-width: 820px;
    margin: 0 auto 56px;
    text-align: center;
  }
  .certs__wall-intro strong { color: var(--esds-navy); font-weight: 700; }

  /* Override cert-grid to 3 columns for denser logo wall */
  .certs__cat-grid {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  @media (max-width: 1100px) { .certs__cat-grid { grid-template-columns: repeat(2, 1fr) !important; } }
  @media (max-width: 700px)  { .certs__cat-grid { grid-template-columns: 1fr !important; } }

  /* Color the badge block per category for visual distinction */
  .certs__cat--quality .cert-badge-block { background: linear-gradient(135deg, #047857, #10B981); }
  .certs__cat--quality .cert-badge-block::before { background: linear-gradient(90deg, #34D399, #6EE7B7); }

  .certs__cat--security .cert-badge-block { background: linear-gradient(135deg, #1E40AF, var(--highlight-blue)); }
  .certs__cat--security .cert-badge-block::before { background: linear-gradient(90deg, var(--highlight-blue-light), #BFDBFE); }

  .certs__cat--privacy .cert-badge-block { background: linear-gradient(135deg, #6D28D9, #A78BFA); }
  .certs__cat--privacy .cert-badge-block::before { background: linear-gradient(90deg, #C4B5FD, #DDD6FE); }

  .certs__cat--continuity .cert-badge-block { background: linear-gradient(135deg, #B45309, #F59E0B); }
  .certs__cat--continuity .cert-badge-block::before { background: linear-gradient(90deg, #FCD34D, #FDE68A); }

  .certs__cat--environmental .cert-badge-block { background: linear-gradient(135deg, #0F766E, #14B8A6); }
  .certs__cat--environmental .cert-badge-block::before { background: linear-gradient(90deg, #5EEAD4, #99F6E4); }

  .certs__cat--industry .cert-badge-block { background: linear-gradient(135deg, #B91C1C, #EF4444); }
  .certs__cat--industry .cert-badge-block::before { background: linear-gradient(90deg, #FCA5A5, #FECACA); }

  .certs__cat--maturity .cert-badge-block { background: linear-gradient(135deg, var(--esds-navy), #1E293B); }
  .certs__cat--maturity .cert-badge-block::before { background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light)); }

  .certs__cat--tier .cert-badge-block { background: linear-gradient(135deg, #C2410C, #FF6B35); }
  .certs__cat--tier .cert-badge-block::before { background: linear-gradient(90deg, #FDBA74, #FED7AA); }

  /* "Held by" coverage indicator inside each cert-card */
  .certs__held {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px dashed var(--esds-gray-100);
  }
  .certs__held-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9px;
    font-weight: 800;
    color: var(--esds-gray-400);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-right: 6px;
    line-height: 22px;
  }
  .certs__held-pill {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: rgba(16,185,129,0.08);
    border: 1px solid rgba(16,185,129,0.25);
    color: var(--esds-green);
    padding: 2px 8px;
    border-radius: 4px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }
  .certs__held-pill::before {
    content: '✓';
    font-size: 9px;
  }
  .certs__held-pill--progress {
    background: rgba(244,166,35,0.08);
    border-color: rgba(244,166,35,0.3);
    color: #B87705;
  }
  .certs__held-pill--progress::before { content: '◐'; }

  /* Make cert-card vertical (badge above, info below) for tighter 3-col grid */
  .certs__cat-grid .cert-card {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    padding: 22px !important;
  }
  .certs__cat-grid .cert-badge-block {
    padding: 24px 16px !important;
    font-size: 15px !important;
  }


  /* ═══════════════════════════════════════════════════════════════════
     §3 · DC COMPLIANCE MATRIX
     Filter tabs at top + comprehensive matrix table showing each cert
     across all 4 DCs. Click a tab → only that DC's column visible (others
     dimmed). Built on a custom matrix table.
  ═══════════════════════════════════════════════════════════════════ */
  .certs__matrix-intro {
    font-size: 16px;
    line-height: 1.75;
    color: var(--esds-gray-500);
    max-width: 820px;
    margin: 0 auto 36px;
    text-align: center;
  }
  .certs__matrix-intro strong { color: var(--esds-navy); font-weight: 700; }

  /* Filter tab buttons */
  .certs__matrix-tabs {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin: 0 auto 32px;
    max-width: 720px;
  }
  .certs__tab {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 100px;
    font-size: 13px;
    font-weight: 800;
    color: var(--esds-gray-700);
    cursor: pointer;
    transition: all 0.25s var(--esds-ease);
    font-family: inherit;
  }
  .certs__tab:hover {
    border-color: var(--highlight-blue);
    color: var(--highlight-blue);
    transform: translateY(-2px);
  }
  .certs__tab.is-active {
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    border-color: transparent;
    color: #fff;
    box-shadow: 0 6px 18px rgba(0,97,255,0.25);
  }
  .certs__tab__count {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    background: rgba(255,255,255,0.18);
    padding: 2px 6px;
    border-radius: 100px;
    letter-spacing: 0.05em;
  }
  .certs__tab:not(.is-active) .certs__tab__count {
    background: var(--esds-gray-100);
    color: var(--esds-gray-500);
  }

  /* Matrix table */
  .certs__matrix-wrap {
    background: #fff;
    border-radius: 22px;
    overflow: hidden;
    box-shadow: 0 10px 36px rgba(10,22,40,0.08);
    border: 1px solid var(--esds-gray-100);
  }
  .certs__matrix-scroll {
    overflow-x: auto;
  }
  .certs__matrix {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 13.5px;
    min-width: 720px;
  }
  .certs__matrix thead th {
    padding: 18px 16px;
    font-weight: 800;
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    background: var(--esds-navy);
    color: #fff;
    border-bottom: 2px solid var(--highlight-blue);
    transition: opacity 0.3s ease, background 0.3s ease;
  }
  .certs__matrix thead th:first-child {
    text-align: left;
    background: linear-gradient(135deg, var(--esds-navy), #0d1c34);
    width: 280px;
  }
  .certs__matrix thead th[data-dc] {
    cursor: default;
  }
  .certs__matrix thead th.is-active {
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
  }
  .certs__matrix thead th.is-dimmed {
    opacity: 0.35;
  }
  /* Cert name (left col) */
  .certs__matrix tbody td {
    padding: 14px 16px;
    border-bottom: 1px solid var(--esds-gray-100);
    line-height: 1.5;
    background: #fff;
    transition: opacity 0.3s ease, background 0.3s ease;
  }
  .certs__matrix tbody tr:last-child td { border-bottom: 0; }
  .certs__matrix tbody td:first-child {
    text-align: left;
    background: var(--esds-gray-50);
    font-weight: 700;
    color: var(--esds-navy);
    border-right: 1px solid var(--esds-gray-100);
  }
  .certs__matrix-cert-name {
    display: flex;
    flex-direction: column;
    gap: 2px;
  }
  .certs__matrix-cert-name strong {
    font-size: 13.5px;
    color: var(--esds-navy);
    font-weight: 800;
  }
  .certs__matrix-cert-name small {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    color: var(--esds-gray-400);
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }
  /* Status cells */
  .certs__matrix-cell {
    text-align: center;
    font-weight: 800;
    transition: opacity 0.3s ease, background 0.3s ease;
  }
  .certs__matrix-cell.is-active {
    background: rgba(0,97,255,0.04) !important;
  }
  .certs__matrix-cell.is-dimmed {
    opacity: 0.25;
  }
  .certs__matrix-check {
    display: inline-grid;
    place-items: center;
    width: 28px; height: 28px;
    border-radius: 50%;
    background: rgba(16,185,129,0.12);
    color: var(--esds-green);
    font-size: 14px;
    font-weight: 800;
  }
  .certs__matrix-progress {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: rgba(244,166,35,0.08);
    border: 1px solid rgba(244,166,35,0.3);
    color: #B87705;
    padding: 3px 9px;
    border-radius: 100px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }
  .certs__matrix-progress::before { content: '◐'; }
  .certs__matrix-na {
    color: var(--esds-gray-300);
    font-family: 'JetBrains Mono', monospace;
    font-size: 16px;
    font-weight: 800;
  }
  .certs__matrix-variant {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: rgba(0,97,255,0.06);
    border: 1px solid rgba(0,97,255,0.2);
    color: var(--highlight-blue);
    padding: 3px 9px;
    border-radius: 6px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: 0.04em;
  }
  .certs__matrix-variant::before { content: '✓'; }


  /* ═══════════════════════════════════════════════════════════════════
     §4 · COVERAGE STATS — small numeric strip (visual reinforcement)
  ═══════════════════════════════════════════════════════════════════ */
  .certs__coverage {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-top: 48px;
  }
  .certs__coverage-card {
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 22px 18px;
    text-align: center;
    transition: all 0.25s var(--esds-ease);
  }
  .certs__coverage-card:hover {
    border-color: var(--highlight-blue);
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(0,97,255,0.08);
  }
  .certs__coverage-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(28px, 3.4vw, 38px);
    font-weight: 800;
    line-height: 1;
    background: linear-gradient(135deg, var(--esds-navy), var(--highlight-blue));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: 6px;
    letter-spacing: -1.5px;
  }
  .certs__coverage-lbl {
    font-size: 12px;
    color: var(--esds-gray-500);
    line-height: 1.4;
    margin: 0;
    font-weight: 600;
  }
  @media (max-width: 720px) { .certs__coverage { grid-template-columns: repeat(2, 1fr); } }


  /* ═══════════════════════════════════════════════════════════════════
     §5 · CTA pre-tagline (above page-cta H2)
  ═══════════════════════════════════════════════════════════════════ */
  .certs__cta-pre {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--highlight-blue-light);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 14px;
    display: inline-block;
    position: relative;
    z-index: 2;
  }
  .certs__cta-pre::before, .certs__cta-pre::after {
    content: '';
    display: inline-block;
    width: 24px; height: 1px;
    background: var(--highlight-blue-light);
    vertical-align: middle;
    opacity: 0.5;
    margin: 0 10px;
  }
  
  
  
  
  /* ═══════════════════════════════════════════════════════════════════
     Enterprise Cloud Solutions
  ═══════════════════════════════════════════════════════════════════ */
  
  
  
  .enterprise-cc__ticker {
    background: var(--esds-navy);
    border-top: 1px solid rgba(255,255,255,0.08);
    border-bottom: 1px solid rgba(255,255,255,0.08);
    padding: 22px 0;
    overflow: hidden;
    position: relative;
  }
  .enterprise-cc__ticker::before,
  .enterprise-cc__ticker::after {
    content: '';
    position: absolute;
    top: 0; bottom: 0;
    width: 120px;
    z-index: 2;
    pointer-events: none;
  }
  .enterprise-cc__ticker::before { left: 0; background: linear-gradient(90deg, var(--esds-navy), transparent); }
  .enterprise-cc__ticker::after  { right: 0; background: linear-gradient(270deg, var(--esds-navy), transparent); }
  .enterprise-cc__ticker-track {
    display: flex;
    gap: 0;
    width: max-content;
    animation: enterprise-cc-ticker 50s linear infinite;
  }
  .enterprise-cc__ticker:hover .enterprise-cc__ticker-track { animation-play-state: paused; }
  @keyframes enterprise-cc-ticker {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
  }
  .enterprise-cc__ticker-item {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 0 32px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 13.5px;
    font-weight: 700;
    color: var(--esds-gray-300);
    letter-spacing: 0.02em;
    white-space: nowrap;
  }
  .enterprise-cc__ticker-item strong { color: #fff; font-weight: 800; }
  .enterprise-cc__ticker-sep {
    width: 6px; height: 6px;
    border-radius: 50%;
    background: var(--highlight-blue-light);
    box-shadow: 0 0 8px rgba(126,233,255,0.5);
  }
  @media (prefers-reduced-motion: reduce) {
    .enterprise-cc__ticker-track { animation: none; }
  }

  /* ─── Section B · Patent editorial pull-quote (Block 3-B) ─── */
  .enterprise-cc__patent {
    max-width: 920px;
    margin: 80px auto 64px;
    text-align: center;
    padding: 0 20px;
    position: relative;
  }
  .enterprise-cc__patent::before {
    content: '';
    position: absolute;
    top: -32px; left: 50%;
    transform: translateX(-50%);
    width: 60px; height: 4px;
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
    border-radius: 4px;
  }
  .enterprise-cc__patent-lead {
    font-size: clamp(24px, 3.2vw, 36px);
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -1px;
    line-height: 1.25;
    margin: 0 0 18px;
  }
  .enterprise-cc__patent-lead em {
    font-style: italic;
    color: var(--india-saffron);
    font-weight: 800;
  }
  .enterprise-cc__patent-hero {
    font-size: clamp(20px, 2.4vw, 28px);
    font-weight: 700;
    color: var(--highlight-blue);
    margin: 0 0 28px;
    line-height: 1.4;
    font-style: italic;
    letter-spacing: -0.4px;
  }
  .enterprise-cc__patent-hero strong { color: var(--esds-navy); font-style: normal; }
  .enterprise-cc__patent-body {
    font-size: 16px;
    line-height: 1.8;
    color: var(--esds-gray-500);
    max-width: 720px;
    margin: 0 auto 18px;
  }
  .enterprise-cc__patent-body--strong { font-weight: 700; color: var(--esds-navy); }
  .enterprise-cc__patent-stamp {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    font-weight: 800;
    color: var(--highlight-blue);
    background: var(--highlight-bg);
    padding: 10px 20px;
    border-radius: 999px;
    letter-spacing: 0.04em;
    margin-top: 14px;
  }

  /* ─── Section C · Three scenario callouts (Block 3-C) ─── */
  .enterprise-cc__scenarios {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    border-top: 1px solid var(--esds-gray-100);
    border-bottom: 1px solid var(--esds-gray-100);
  }
  .enterprise-cc__scenario {
    padding: 40px 36px;
    border-right: 1px solid var(--esds-gray-100);
    transition: background 0.3s ease;
  }
  .enterprise-cc__scenario:last-child { border-right: none; }
  .enterprise-cc__scenario:hover { background: var(--esds-gray-50); }
  .enterprise-cc__scenario-setup {
    font-size: 16px;
    font-weight: 700;
    color: var(--esds-navy);
    line-height: 1.4;
    margin: 0 0 14px;
    font-style: italic;
    letter-spacing: -0.3px;
  }
  .enterprise-cc__scenario-outcome {
    font-size: 14.5px;
    line-height: 1.7;
    color: var(--esds-gray-500);
    margin: 0;
  }
  .enterprise-cc__scenario-outcome strong { color: var(--highlight-blue); font-weight: 700; }
  @media (max-width: 900px) {
    .enterprise-cc__scenarios { grid-template-columns: 1fr; }
    .enterprise-cc__scenario { border-right: none; border-bottom: 1px solid var(--esds-gray-100); }
    .enterprise-cc__scenario:last-child { border-bottom: none; }
  }

  /* ─── Section D · People stats panel + 3-column narrative (Block 6) ─── */
  .enterprise-cc__people-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-bottom: 56px;
    background: linear-gradient(135deg, var(--esds-gray-50), #fff);
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 24px;
    padding: 44px 36px;
    position: relative;
    overflow: hidden;
  }
  .enterprise-cc__people-stats::before {
    content: '';
    position: absolute;
    top: -50%; left: 50%;
    width: 400px; height: 200px;
    transform: translateX(-50%);
    background: radial-gradient(ellipse, rgba(0,97,255,0.08), transparent 70%);
    pointer-events: none;
  }
  .enterprise-cc__people-stat {
    text-align: center;
    padding: 16px;
    border-right: 1px solid var(--esds-gray-100);
    position: relative;
  }
  .enterprise-cc__people-stat:last-child { border-right: none; }
  .enterprise-cc__people-stat-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(36px, 5vw, 56px);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -2px;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: 12px;
    display: block;
  }
  .enterprise-cc__people-stat-num .u { font-size: 0.55em; }
  .enterprise-cc__people-stat-lbl {
    font-size: 13.5px;
    color: var(--esds-gray-500);
    line-height: 1.5;
    font-weight: 600;
  }
  @media (max-width: 900px) {
    .enterprise-cc__people-stats { grid-template-columns: 1fr; padding: 28px 20px; }
    .enterprise-cc__people-stat { border-right: none; border-bottom: 1px solid var(--esds-gray-100); padding: 24px 0; }
    .enterprise-cc__people-stat:last-child { border-bottom: none; }
  }
  .enterprise-cc__people-cols {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
  }
  .enterprise-cc__people-col {
    padding: 0 16px;
    border-left: 2px solid var(--esds-gray-100);
    transition: border-color 0.3s ease;
  }
  .enterprise-cc__people-col:hover { border-left-color: var(--highlight-blue); }
  .enterprise-cc__people-col-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 10px;
  }
  .enterprise-cc__people-col-title {
    font-size: 19px;
    font-weight: 800;
    color: var(--esds-navy);
    line-height: 1.25;
    letter-spacing: -0.4px;
    margin: 0 0 12px;
  }
  .enterprise-cc__people-col-copy {
    font-size: 14.5px;
    line-height: 1.75;
    color: var(--esds-gray-500);
    margin: 0;
  }
  @media (max-width: 900px) {
    .enterprise-cc__people-cols { grid-template-columns: 1fr; gap: 24px; }
  }

  /* ─── Section E · Auto-scrolling logo carousel (Block 7) ─── */
  .enterprise-cc__marquee-row {
    overflow: hidden;
    position: relative;
  }
  .enterprise-cc__marquee-row::before,
  .enterprise-cc__marquee-row::after {
    content: '';
    position: absolute;
    top: 0; bottom: 0;
    width: 120px;
    z-index: 2;
    pointer-events: none;
  }
  .enterprise-cc__marquee-row::before { left: 0; background: linear-gradient(90deg, var(--esds-navy), transparent); }
  .enterprise-cc__marquee-row::after  { right: 0; background: linear-gradient(270deg, var(--esds-navy), transparent); }
  .enterprise-cc__marquee-track {
    display: flex;
    gap: 0;
    width: max-content;
    animation: enterprise-cc-logo 60s linear infinite;
  }
  .enterprise-cc__marquee-row:hover .enterprise-cc__marquee-track { animation-play-state: paused; }
  @keyframes enterprise-cc-logo {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
  }
  @media (prefers-reduced-motion: reduce) {
    .enterprise-cc__marquee-track { animation: none !important; }
  }
  .enterprise-cc__logo-tile {
    flex-shrink: 0;
    width: 240px;
    margin: 0 10px;
    padding: 20px 22px;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 14px;
    transition: all 0.3s var(--esds-ease);
  }
  .enterprise-cc__logo-tile:hover {
    background: rgba(0,97,255,0.08);
    border-color: rgba(126,233,255,0.3);
    transform: translateY(-3px);
  }
  .enterprise-cc__logo-tile-name {
    font-size: 14px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.3px;
    margin-bottom: 4px;
  }
  .enterprise-cc__logo-tile-desc {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 600;
    color: var(--highlight-blue-light);
    letter-spacing: 0.04em;
  }

  /* ─── Section F · Partner big-stat closing card (Block 8) ─── */
  .enterprise-cc__partner-stat {
    text-align: center;
    padding: 56px 32px;
    background: linear-gradient(135deg, var(--esds-gray-50), #fff);
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 28px;
    margin-top: 48px;
    position: relative;
    overflow: hidden;
  }
  .enterprise-cc__partner-stat::before {
    content: '';
    position: absolute; inset: 0;
    background-image: radial-gradient(circle at center, rgba(0,97,255,0.06), transparent 60%);
    pointer-events: none;
  }
  .enterprise-cc__partner-stat-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(44px, 6vw, 88px);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -3px;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: 16px;
    position: relative; z-index: 2;
  }
  .enterprise-cc__partner-stat-lbl {
    font-size: clamp(17px, 2vw, 22px);
    font-weight: 700;
    color: var(--esds-navy);
    line-height: 1.4;
    letter-spacing: -0.3px;
    position: relative; z-index: 2;
  }
  .enterprise-cc__partner-stat-lbl em {
    font-style: italic;
    color: var(--india-saffron);
    font-weight: 800;
  }

  /* ─── Section G · Sovereignty argument copy block (Block 5) ─── */
  .enterprise-cc__sov-argument {
    font-size: 17px;
    line-height: 1.85;
    color: var(--esds-gray-300);
    max-width: 780px;
    margin: 0 auto 24px;
    text-align: left;
  }
  .enterprise-cc__sov-argument strong { color: #fff; font-weight: 700; }
  .enterprise-cc__sov-argument em { color: var(--highlight-blue-light); font-style: normal; font-weight: 700; }
  .enterprise-cc__sov-statement {
    font-size: clamp(20px, 2.4vw, 28px);
    font-weight: 800;
    color: #fff;
    line-height: 1.4;
    letter-spacing: -0.5px;
    margin: 28px 0 14px;
    text-align: center;
  }
  .enterprise-cc__sov-trust {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px 20px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.08em;
    color: var(--highlight-blue-light);
    padding: 14px 28px;
    border: 1px solid rgba(126,233,255,0.3);
    border-radius: 100px;
    background: rgba(126,233,255,0.04);
    margin-top: 18px;
  }
  .enterprise-cc__sov-trust-sep { color: rgba(126,233,255,0.4); }
  .enterprise-cc__sov-closer {
    font-size: 16px;
    line-height: 1.8;
    color: var(--esds-gray-300);
    text-align: center;
    max-width: 720px;
    margin: 36px auto 0;
    font-style: italic;
    padding-top: 32px;
    border-top: 1px solid rgba(255,255,255,0.08);
  }
  .enterprise-cc__sov-closer strong { color: var(--highlight-blue-light); font-style: normal; font-weight: 700; }

  /* ─── Section H · Coming-soon DC variant (CEL Sahibabad) ─── */
  .enterprise-cc__dc-coming {
    grid-column: 1 / -1;
    background: linear-gradient(135deg, rgba(244,166,35,0.08), rgba(255,107,53,0.04));
    border: 1.5px dashed rgba(244,166,35,0.3);
    border-radius: 20px;
    padding: 28px 32px;
    text-align: center;
  }
  .enterprise-cc__dc-coming-name {
    font-size: 22px;
    font-weight: 800;
    color: #fff;
    margin: 0 0 4px;
    letter-spacing: -0.5px;
  }
  .enterprise-cc__dc-coming-hint {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    color: var(--india-saffron);
    letter-spacing: 0.08em;
  }

  /* ─── Section I · Industry tile emoji icon (extends .industry-tile visually) ─── */
  .enterprise-cc__ind-icon {
    font-size: 36px;
    line-height: 1;
    margin-bottom: 14px;
    display: block;
    filter: drop-shadow(0 4px 8px rgba(0,97,255,0.18));
    transition: transform 0.3s var(--esds-ease);
  }
  .industry-tile:hover .enterprise-cc__ind-icon {
    transform: scale(1.1) rotate(-4deg);
  }
  
    /* ═══════════════════════════════════════════════════════════════════
     Enterprise Cloud Solutions end
  ═══════════════════════════════════════════════════════════════════ */
  
  
  
    /* ═══════════════════════════════════════════════════════════════════
     sovereign-cloud-assessment start
  ═══════════════════════════════════════════════════════════════════ */
  
  
  

  /* ═══ §2 INTERACTIVE QUIZ ═══ */

  /* Quiz outer shell */
  .assess__quiz {
    max-width: 880px;
    margin: 0 auto;
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 22px;
    padding: 0;
    overflow: hidden;
    box-shadow: 0 14px 40px rgba(10,22,40,0.06);
    position: relative;
  }

  /* Top bar — progress + meta */
  .assess__quiz-topbar {
    background: linear-gradient(135deg, var(--esds-navy), #0d1c34);
    padding: 22px 32px;
    color: #fff;
    position: relative;
    overflow: hidden;
  }
  .assess__quiz-topbar::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
      linear-gradient(rgba(126,233,255,0.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(126,233,255,0.04) 1px, transparent 1px);
    background-size: 28px 28px;
    pointer-events: none;
  }
  .assess__quiz-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
    position: relative;
    z-index: 2;
    gap: 16px;
    flex-wrap: wrap;
  }
  .assess__quiz-step {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--highlight-blue-light);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
    gap: 8px;
  }
  .assess__quiz-step::before {
    content: '';
    width: 8px; height: 8px;
    border-radius: 50%;
    background: var(--highlight-blue-light);
    box-shadow: 0 0 0 0 rgba(126,233,255,0.5);
    animation: assess-step-pulse 2s ease-in-out infinite;
  }
  @keyframes assess-step-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(126,233,255,0.5); }
    50%      { box-shadow: 0 0 0 6px rgba(126,233,255,0); }
  }
  .assess__quiz-step strong {
    font-size: 14px;
    color: #fff;
    font-weight: 800;
    letter-spacing: -0.5px;
    margin-right: 2px;
  }
  .assess__quiz-time {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--esds-gray-300);
    letter-spacing: 0.10em;
    text-transform: uppercase;
  }
  .assess__quiz-time::before {
    content: '◷ ';
    color: var(--india-saffron);
  }
  .assess__quiz-bar {
    height: 6px;
    background: rgba(255,255,255,0.10);
    border-radius: 100px;
    overflow: hidden;
    position: relative;
    z-index: 2;
  }
  .assess__quiz-bar__fill {
    height: 100%;
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
    border-radius: 100px;
    width: 10%;
    transition: width 0.5s var(--esds-ease);
    box-shadow: 0 0 12px rgba(126,233,255,0.4);
  }

  /* Question area */
  .assess__quiz-stage {
    padding: 36px 40px 32px;
    position: relative;
    min-height: 480px;
  }
  @media (max-width: 700px) { .assess__quiz-stage { padding: 28px 22px 24px; min-height: 540px; } }

  .assess__quiz-question {
    display: none;
    animation: assess-q-in 0.45s ease-out;
  }
  .assess__quiz-question.is-active {
    display: block;
  }
  @keyframes assess-q-in {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: translateY(0); }
  }

  .assess__quiz-q-cat {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 12px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
  }
  .assess__quiz-q-cat::before {
    content: '';
    width: 6px; height: 6px;
    border-radius: 50%;
    background: currentColor;
  }
  .assess__quiz-q-cat--sovereignty { color: var(--india-saffron); }
  .assess__quiz-q-cat--security    { color: #B91C1C; }
  .assess__quiz-q-cat--recovery    { color: var(--highlight-blue); }
  .assess__quiz-q-cat--compliance  { color: var(--india-green); }

  .assess__quiz-q-text {
    font-size: clamp(20px, 2.4vw, 26px);
    font-weight: 800;
    color: var(--esds-navy);
    line-height: 1.3;
    letter-spacing: -0.5px;
    margin: 0 0 8px;
  }
  .assess__quiz-q-hint {
    font-size: 13.5px;
    color: var(--esds-gray-500);
    line-height: 1.6;
    margin: 0 0 28px;
  }
  .assess__quiz-q-hint strong { color: var(--esds-navy); font-weight: 700; }

  /* Radio option group */
  .assess__quiz-options {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 8px;
  }
  .assess__quiz-option {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 16px 20px;
    background: var(--esds-gray-50);
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 14px;
    cursor: pointer;
    transition: all 0.25s var(--esds-ease);
    position: relative;
  }
  .assess__quiz-option:hover {
    border-color: var(--highlight-blue);
    background: rgba(0,97,255,0.04);
    transform: translateX(2px);
  }
  .assess__quiz-option.is-selected {
    border-color: var(--highlight-blue);
    background: linear-gradient(135deg, rgba(0,97,255,0.06), rgba(126,233,255,0.04));
    box-shadow: 0 4px 14px rgba(0,97,255,0.10);
  }
  .assess__quiz-option__radio {
    width: 22px; height: 22px;
    border-radius: 50%;
    border: 2px solid var(--esds-gray-300);
    background: #fff;
    flex-shrink: 0;
    margin-top: 2px;
    position: relative;
    transition: all 0.25s var(--esds-ease);
  }
  .assess__quiz-option:hover .assess__quiz-option__radio { border-color: var(--highlight-blue); }
  .assess__quiz-option.is-selected .assess__quiz-option__radio {
    border-color: var(--highlight-blue);
    background: var(--highlight-blue);
  }
  .assess__quiz-option.is-selected .assess__quiz-option__radio::after {
    content: '';
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 8px; height: 8px;
    border-radius: 50%;
    background: #fff;
  }
  .assess__quiz-option__body {
    flex: 1;
    min-width: 0;
  }
  .assess__quiz-option__label {
    font-size: 14.5px;
    font-weight: 700;
    color: var(--esds-navy);
    line-height: 1.4;
    letter-spacing: -0.2px;
  }
  .assess__quiz-option__sub {
    font-size: 12.5px;
    color: var(--esds-gray-500);
    line-height: 1.5;
    margin-top: 4px;
    font-weight: 500;
  }

  /* Navigation buttons */
  .assess__quiz-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 28px;
    padding-top: 24px;
    border-top: 1px dashed var(--esds-gray-100);
    gap: 12px;
  }
  .assess__quiz-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 22px;
    border-radius: 12px;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
    transition: all 0.25s var(--esds-ease);
    cursor: pointer;
    border: 0;
    font-family: inherit;
    letter-spacing: -0.2px;
  }
  .assess__quiz-btn--ghost {
    background: var(--esds-gray-50);
    color: var(--esds-gray-600);
    border: 1.5px solid var(--esds-gray-100);
  }
  .assess__quiz-btn--ghost:hover:not(:disabled) {
    background: #fff;
    color: var(--esds-navy);
    border-color: var(--esds-gray-300);
    transform: translateX(-2px);
  }
  .assess__quiz-btn--ghost:disabled {
    opacity: 0.35;
    cursor: not-allowed;
  }
  .assess__quiz-btn--primary {
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    box-shadow: 0 6px 18px rgba(0,97,255,0.25);
  }
  .assess__quiz-btn--primary:hover:not(:disabled) {
    transform: translateX(2px);
    box-shadow: 0 10px 24px rgba(0,97,255,0.35);
    filter: brightness(1.05);
  }
  .assess__quiz-btn--primary:disabled {
    opacity: 0.4;
    cursor: not-allowed;
    box-shadow: none;
  }
  .assess__quiz-btn--final {
    background: linear-gradient(135deg, var(--india-saffron), #F4A623);
    box-shadow: 0 6px 18px rgba(255,107,53,0.30);
  }
  .assess__quiz-btn--final:hover:not(:disabled) {
    box-shadow: 0 10px 24px rgba(255,107,53,0.40);
  }


  /* Result panel */
  .assess__quiz-result {
    display: none;
    padding: 0;
  }
  .assess__quiz-result.is-active { display: block; animation: assess-q-in 0.6s ease-out; }

  /* Result hero band — gauge + score band */
  .assess__result-hero {
    background: linear-gradient(135deg, var(--esds-navy), #0d1c34);
    color: #fff;
    padding: 48px 40px 36px;
    position: relative;
    overflow: hidden;
    text-align: center;
  }
  @media (max-width: 700px) { .assess__result-hero { padding: 36px 24px 28px; } }
  .assess__result-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
      linear-gradient(rgba(126,233,255,0.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(126,233,255,0.04) 1px, transparent 1px);
    background-size: 28px 28px;
    pointer-events: none;
  }
  .assess__result-hero::after {
    content: '';
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 480px; height: 480px;
    background: radial-gradient(circle, rgba(126,233,255,0.18), transparent 60%);
    pointer-events: none;
  }
  .assess__result-pre {
    position: relative;
    z-index: 2;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--highlight-blue-light);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 18px;
  }
  .assess__result-pre::before, .assess__result-pre::after {
    content: '';
    display: inline-block;
    width: 24px; height: 1px;
    background: var(--highlight-blue-light);
    vertical-align: middle;
    opacity: 0.5;
    margin: 0 10px;
  }

  /* Animated gauge SVG */
  .assess__gauge {
    width: 240px; height: 130px;
    margin: 0 auto 22px;
    position: relative;
    z-index: 2;
  }
  .assess__gauge svg { width: 100%; height: 100%; }
  .assess__gauge-bg { stroke: rgba(255,255,255,0.08); fill: none; stroke-width: 18; stroke-linecap: round; }
  .assess__gauge-fill {
    stroke: url(#assess-gauge-grad);
    fill: none;
    stroke-width: 18;
    stroke-linecap: round;
    stroke-dasharray: 0 314;
    transition: stroke-dasharray 1.6s cubic-bezier(0.16, 1, 0.3, 1) 0.3s;
  }
  .assess__gauge-num {
    position: absolute;
    top: 60%; left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    z-index: 3;
  }
  .assess__gauge-val {
    font-family: 'JetBrains Mono', monospace;
    font-size: 56px;
    font-weight: 800;
    line-height: 1;
    background: linear-gradient(135deg, #fff, var(--highlight-blue-light));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    letter-spacing: -2px;
  }
  .assess__gauge-of {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--esds-gray-300);
    letter-spacing: 0.10em;
    margin-top: 4px;
  }

  /* Result band — color-coded by score tier */
  .assess__result-band {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 8px 18px;
    border-radius: 100px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 18px;
    position: relative;
    z-index: 2;
  }
  .assess__result-band--ready    { background: rgba(34,197,94,0.15); border: 1.5px solid rgba(34,197,94,0.4); color: #6EE7B7; }
  .assess__result-band--partial  { background: rgba(255,107,53,0.15); border: 1.5px solid rgba(255,107,53,0.4); color: #FFB89E; }
  .assess__result-band--critical { background: rgba(220,38,38,0.15); border: 1.5px solid rgba(239,68,68,0.4); color: #FCA5A5; }
  .assess__result-band::before {
    content: '';
    width: 8px; height: 8px;
    border-radius: 50%;
    background: currentColor;
    box-shadow: 0 0 0 0 currentColor;
  }
  .assess__result-band--critical::before { animation: assess-pulse-red 1.6s ease-in-out infinite; }

  .assess__result-title {
    font-size: clamp(24px, 3.2vw, 36px);
    font-weight: 800;
    color: #fff;
    line-height: 1.2;
    letter-spacing: -1px;
    margin: 0 0 12px;
    position: relative;
    z-index: 2;
  }
  .assess__result-summary {
    font-size: 15px;
    color: var(--esds-gray-200);
    line-height: 1.7;
    max-width: 580px;
    margin: 0 auto;
    position: relative;
    z-index: 2;
  }
  .assess__result-summary strong { color: #fff; font-weight: 700; }

  /* Category breakdown — 4 pillar bars */
  .assess__result-body {
    padding: 36px 40px 32px;
  }
  @media (max-width: 700px) { .assess__result-body { padding: 28px 22px 24px; } }
  .assess__result-section-head {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--esds-gray-500);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .assess__result-section-head::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--esds-gray-100);
  }
  .assess__cat-grid {
    display: grid;
    gap: 12px;
    margin-bottom: 28px;
  }
  .assess__cat-row {
    display: grid;
    grid-template-columns: 130px 1fr 60px;
    gap: 14px;
    align-items: center;
  }
  @media (max-width: 600px) {
    .assess__cat-row { grid-template-columns: 1fr; gap: 6px; }
  }
  .assess__cat-name {
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }
  .assess__cat-track {
    height: 10px;
    background: var(--esds-gray-100);
    border-radius: 100px;
    overflow: hidden;
  }
  .assess__cat-fill {
    height: 100%;
    border-radius: 100px;
    transform-origin: left;
    transition: transform 1.2s cubic-bezier(0.16, 1, 0.3, 1) 0.5s;
    transform: scaleX(0);
  }
  .assess__cat-fill--sovereignty { background: linear-gradient(90deg, var(--india-saffron), #F4A623); }
  .assess__cat-fill--security    { background: linear-gradient(90deg, #B91C1C, #EF4444); }
  .assess__cat-fill--recovery    { background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light)); }
  .assess__cat-fill--compliance  { background: linear-gradient(90deg, var(--india-green), #22C55E); }
  .assess__cat-pct {
    font-family: 'JetBrains Mono', monospace;
    font-size: 14px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    text-align: right;
  }
  @media (max-width: 600px) { .assess__cat-pct { text-align: left; } }

  /* Gap callouts */
  .assess__gaps {
    display: grid;
    gap: 10px;
    margin-bottom: 28px;
  }
  .assess__gap {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 14px;
    align-items: flex-start;
    padding: 14px 18px;
    background: rgba(255,107,53,0.04);
    border: 1px solid rgba(255,107,53,0.20);
    border-left: 4px solid var(--india-saffron);
    border-radius: 10px;
  }
  .assess__gap--critical {
    background: rgba(220,38,38,0.04);
    border-color: rgba(239,68,68,0.20);
    border-left-color: #DC2626;
  }
  .assess__gap--ok {
    background: rgba(34,197,94,0.04);
    border-color: rgba(34,197,94,0.20);
    border-left-color: var(--india-green);
  }
  .assess__gap__icon {
    width: 28px; height: 28px;
    border-radius: 8px;
    color: #fff;
    display: grid;
    place-items: center;
    flex-shrink: 0;
    font-size: 14px;
    font-weight: 800;
  }
  .assess__gap--critical .assess__gap__icon { background: linear-gradient(135deg, #B91C1C, #EF4444); }
  .assess__gap:not(.assess__gap--critical):not(.assess__gap--ok) .assess__gap__icon { background: linear-gradient(135deg, var(--india-saffron), #F4A623); }
  .assess__gap--ok .assess__gap__icon { background: linear-gradient(135deg, var(--india-green), #22C55E); }
  .assess__gap__icon::before { content: '!'; }
  .assess__gap--critical .assess__gap__icon::before { content: '✕'; }
  .assess__gap--ok .assess__gap__icon::before { content: '✓'; }
  .assess__gap__body h4 {
    font-size: 14px;
    font-weight: 800;
    color: var(--esds-navy);
    margin: 0 0 4px;
    letter-spacing: -0.2px;
  }
  .assess__gap__body p {
    font-size: 12.5px;
    color: var(--esds-gray-600);
    line-height: 1.55;
    margin: 0;
  }
  .assess__gap__body p strong { color: var(--esds-navy); font-weight: 700; }

  /* Result actions */
  .assess__result-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    padding-top: 20px;
    border-top: 1px dashed var(--esds-gray-100);
  }
  .assess__result-actions__primary {
    flex: 1;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
  }
  .assess__quiz-btn--restart {
    background: transparent;
    color: var(--esds-gray-500);
    border: 1.5px dashed var(--esds-gray-200);
    padding: 11px 20px;
  }
  .assess__quiz-btn--restart:hover {
    color: var(--india-saffron);
    border-color: var(--india-saffron);
    background: rgba(255,107,53,0.04);
  }


  /* ═══ §3 CTA pre ═══ */
  .assess__cta-pre {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--highlight-blue-light);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 14px;
    display: inline-block;
    position: relative;
    z-index: 2;
  }
  .assess__cta-pre::before, .assess__cta-pre::after {
    content: '';
    display: inline-block;
    width: 24px; height: 1px;
    background: var(--highlight-blue-light);
    vertical-align: middle;
    opacity: 0.5;
    margin: 0 10px;
  }
  
  
      /* ═══════════════════════════════════════════════════════════════════
     sovereign-cloud-assessment End
  ═══════════════════════════════════════════════════════════════════ */
  
  
  
  
/* ═══════════════════════════════════════════════════════════════════════════
   BAAS · BACKUP AS A SERVICE — Page-specific styles (baas__ prefix)
   Common patterns (sec, inner-hero, faq-acc, page-cta, container, tokens,
   stat-card, breadcrumb) come from shared style.css.
   ═══════════════════════════════════════════════════════════════════════════ */


/* ───────────────────────────────────────────────────────────────────────────
   §A · HERO — "Recovery Vault Console"
   ─────────────────────────────────────────────────────────────────────────── */
.baas__hero-grid {
    display: grid;
    grid-template-columns: 1fr 1.05fr;
    gap: 56px;
    align-items: center;
    margin-bottom: 56px;
}

/* Recovery Vault Console */
.baas__vault {
    background: linear-gradient(180deg, rgba(15, 29, 50, 0.96), rgba(10, 22, 40, 0.98));
    border: 1px solid rgba(126, 233, 255, 0.22);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.45);
    position: relative;
}
.baas__vault::before {
    content: '';
    position: absolute;
    top: -120px; right: -120px;
    width: 320px; height: 320px;
    background: radial-gradient(circle, rgba(0, 97, 255, 0.30), transparent 65%);
    filter: blur(40px);
    pointer-events: none;
}
.baas__vault-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 22px 14px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    position: relative;
    z-index: 1;
}
.baas__vault-title {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.16em;
    color: var(--esds-gray-300);
    text-transform: uppercase;
    margin: 0;
}
.baas__vault-title strong {
    color: var(--highlight-blue-light);
    font-weight: 800;
}
.baas__vault-armed {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: rgba(74, 222, 128, 0.12);
    border: 1px solid rgba(74, 222, 128, 0.30);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: #4ade80;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}
.baas__vault-armed::before {
    content: '';
    width: 6px; height: 6px;
    border-radius: 50%;
    background: #4ade80;
    animation: baas-pulse 1.6s ease-in-out infinite;
}
@keyframes baas-pulse {
    0%, 100% { opacity: 0.45; transform: scale(0.85); }
    50%      { opacity: 1;    transform: scale(1.15); }
}

.baas__vault-tiers {
    padding: 6px 0;
    position: relative;
    z-index: 1;
}
.baas__vault-tier {
    display: grid;
    grid-template-columns: 70px 1fr auto;
    gap: 14px;
    align-items: center;
    padding: 16px 22px;
    border-bottom: 1px dashed rgba(255, 255, 255, 0.05);
    transition: background 0.25s;
}
.baas__vault-tier:last-child { border-bottom: 0; }
.baas__vault-tier:hover { background: rgba(255, 255, 255, 0.02); }

.baas__vault-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 10px;
    border-radius: 4px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}
.baas__vault-tier--hot  .baas__vault-chip { background: rgba(239, 68, 68, 0.15);  color: #fca5a5; border: 1px solid rgba(239, 68, 68, 0.35); }
.baas__vault-tier--warm .baas__vault-chip { background: rgba(245, 158, 11, 0.15); color: #fcd34d; border: 1px solid rgba(245, 158, 11, 0.35); }
.baas__vault-tier--cold .baas__vault-chip { background: rgba(6, 182, 212, 0.15);  color: #67e8f9; border: 1px solid rgba(6, 182, 212, 0.35); }

.baas__vault-meta {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.baas__vault-name {
    font-size: 13px;
    font-weight: 700;
    color: #fff;
    letter-spacing: -0.2px;
}
.baas__vault-stamp {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 700;
    color: var(--esds-gray-400);
    letter-spacing: 0.04em;
}
.baas__vault-stamp strong { color: var(--highlight-blue-light); font-weight: 800; }

.baas__vault-status {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 9px;
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: 0.10em;
    text-transform: uppercase;
    border: 1px solid;
}
.baas__vault-status::before { content: '✓'; font-size: 10px; }
.baas__vault-tier--hot  .baas__vault-status { color: #4ade80; background: rgba(74, 222, 128, 0.10);  border-color: rgba(74, 222, 128, 0.30); }
.baas__vault-tier--warm .baas__vault-status { color: #4ade80; background: rgba(74, 222, 128, 0.10);  border-color: rgba(74, 222, 128, 0.30); }
.baas__vault-tier--cold .baas__vault-status { color: #4ade80; background: rgba(74, 222, 128, 0.10);  border-color: rgba(74, 222, 128, 0.30); }

/* Activity ribbon */
.baas__vault-activity {
    margin: 14px 22px 0;
    padding: 11px 14px;
    background: rgba(0, 97, 255, 0.08);
    border: 1px solid rgba(0, 97, 255, 0.25);
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    color: var(--highlight-blue-light);
    letter-spacing: 0.04em;
    position: relative;
    z-index: 1;
}
.baas__vault-activity-icon {
    width: 20px; height: 20px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 11px;
    font-weight: 800;
    flex-shrink: 0;
    animation: baas-spin 4s linear infinite;
}
@keyframes baas-spin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}
.baas__vault-activity-text {
    transition: opacity 0.3s ease;
}

.baas__vault-foot {
    padding: 12px 22px;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    margin-top: 14px;
    background: rgba(0, 0, 0, 0.25);
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: #4ade80;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    text-align: center;
    position: relative;
    z-index: 1;
}
.baas__vault-foot small {
    display: block;
    color: var(--esds-gray-400);
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.10em;
    margin-top: 4px;
}

@media (max-width: 992px) {
    .baas__hero-grid { grid-template-columns: 1fr; gap: 36px; }
    .baas__vault { max-width: 540px; margin: 0 auto; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §B · BACKUP TIERS — DR/BaaS framing + 3 temperature-graded spec cards
   ─────────────────────────────────────────────────────────────────────────── */
.baas__intro {
    max-width: 920px;
    margin: 0 auto 36px;
    font-size: 15.5px;
    line-height: 1.7;
    color: var(--esds-gray-700);
}
.baas__intro p { margin: 0 0 14px; }
.baas__intro p:last-child { margin-bottom: 0; }
.baas__intro strong { color: var(--esds-navy); font-weight: 700; }
.baas__intro em {
    font-style: normal;
    color: var(--highlight-blue);
    font-weight: 700;
}

.baas__tiers {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin-bottom: 28px;
}
.baas__tier {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 18px;
    padding: 26px 26px 22px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.baas__tier::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 4px;
}
.baas__tier--hot::before  { background: linear-gradient(90deg, #ef4444, #f97316); }
.baas__tier--warm::before { background: linear-gradient(90deg, #f59e0b, #fbbf24); }
.baas__tier--cold::before { background: linear-gradient(90deg, #06b6d4, #0891b2); }

.baas__tier:hover {
    transform: translateY(-5px);
    box-shadow: 0 22px 50px rgba(10, 22, 40, 0.10);
    border-color: rgba(0, 97, 255, 0.20);
}

.baas__tier-temp {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 5px 11px;
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 14px;
    align-self: flex-start;
}
.baas__tier--hot  .baas__tier-temp { background: rgba(239, 68, 68, 0.10);  color: #dc2626; border: 1px solid rgba(239, 68, 68, 0.25); }
.baas__tier--warm .baas__tier-temp { background: rgba(245, 158, 11, 0.10); color: #b45309; border: 1px solid rgba(245, 158, 11, 0.30); }
.baas__tier--cold .baas__tier-temp { background: rgba(6, 182, 212, 0.10);  color: #0e7490; border: 1px solid rgba(6, 182, 212, 0.25); }

.baas__tier-temp-dot {
    width: 8px; height: 8px;
    border-radius: 50%;
}
.baas__tier--hot  .baas__tier-temp-dot { background: #ef4444; box-shadow: 0 0 8px #ef4444; }
.baas__tier--warm .baas__tier-temp-dot { background: #f59e0b; box-shadow: 0 0 8px #f59e0b; }
.baas__tier--cold .baas__tier-temp-dot { background: #06b6d4; box-shadow: 0 0 8px #06b6d4; }

.baas__tier-name {
    font-size: 21px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.5px;
    margin: 0 0 8px;
    line-height: 1.2;
}
.baas__tier-headline {
    font-size: 13.5px;
    color: var(--highlight-blue);
    font-weight: 700;
    letter-spacing: -0.2px;
    margin: 0 0 18px;
    font-style: italic;
    line-height: 1.45;
}
.baas__tier-text {
    font-size: 13px;
    color: var(--esds-gray-600);
    line-height: 1.65;
    margin: 0 0 18px;
}

.baas__tier-specs {
    margin-top: auto;
    padding: 16px 0;
    border-top: 1px solid var(--esds-gray-100);
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.baas__tier-spec {
    display: grid;
    grid-template-columns: 92px 1fr;
    gap: 10px;
    font-size: 12.5px;
    line-height: 1.5;
    align-items: start;
}
.baas__tier-spec-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--esds-gray-500);
    letter-spacing: 0.10em;
    text-transform: uppercase;
    padding-top: 2px;
}
.baas__tier-spec-value {
    color: var(--esds-navy);
    font-weight: 600;
}
.baas__tier-spec-value strong { color: var(--highlight-blue); font-weight: 800; }

.baas__cold-warning {
    margin-bottom: 18px;
    padding: 18px 24px;
    background: var(--esds-gray-50);
    border: 1px solid var(--esds-gray-100);
    border-left: 4px solid #dc2626;
    border-radius: 12px;
    font-size: 14.5px;
    color: var(--esds-gray-700);
    line-height: 1.65;
    font-weight: 500;
}
.baas__cold-warning strong { color: var(--esds-navy); font-weight: 700; }

.baas__pairing {
    padding: 26px 32px;
    background: linear-gradient(135deg, var(--esds-navy), var(--esds-deep));
    border-radius: 16px;
    color: #fff;
    font-size: 17px;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: -0.2px;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.baas__pairing::after {
    content: '';
    position: absolute;
    top: -60px; right: -60px;
    width: 220px; height: 220px;
    background: radial-gradient(circle, rgba(0, 97, 255, 0.30), transparent 65%);
    filter: blur(34px);
}
.baas__pairing strong {
    background: linear-gradient(135deg, var(--highlight-blue-light), #fff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}

@media (max-width: 992px) { .baas__tiers { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §C · RANSOMWARE RECOVERY — bold opener + 5-shield defense layer cards
   ─────────────────────────────────────────────────────────────────────────── */
.baas__attack-statement {
    max-width: 980px;
    margin: 0 auto 36px;
    padding: 28px 36px;
    background: linear-gradient(135deg, rgba(220, 38, 38, 0.06), rgba(248, 113, 113, 0.02));
    border: 1px solid rgba(220, 38, 38, 0.20);
    border-left: 4px solid #dc2626;
    border-radius: 14px;
    font-size: 16px;
    color: var(--esds-gray-700);
    line-height: 1.7;
}
.baas__attack-statement p { margin: 0 0 12px; }
.baas__attack-statement p:last-child { margin-bottom: 0; }
.baas__attack-statement strong { color: var(--esds-navy); font-weight: 700; }
.baas__attack-statement em {
    font-style: normal;
    color: #b91c1c;
    font-weight: 700;
}

.baas__layers-eyebrow {
    text-align: center;
    margin-bottom: 24px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.18em;
    text-transform: uppercase;
}
.baas__layers-eyebrow strong { color: var(--esds-navy); font-weight: 800; }

.baas__layers {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 14px;
    margin-bottom: 32px;
}
.baas__layer {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 24px 20px 22px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.baas__layer:hover {
    transform: translateY(-5px);
    box-shadow: 0 18px 38px rgba(0, 97, 255, 0.14);
    border-color: rgba(0, 97, 255, 0.25);
}
.baas__layer-num {
    display: inline-flex;
    align-items: center;
    padding: 3px 8px;
    background: rgba(0, 97, 255, 0.06);
    border-radius: 4px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 14px;
    align-self: flex-start;
}
.baas__layer-shield {
    width: 48px; height: 48px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.12), rgba(126, 233, 255, 0.04));
    border: 1px solid rgba(0, 97, 255, 0.22);
    display: grid;
    place-items: center;
    color: var(--highlight-blue);
    margin-bottom: 14px;
    transition: transform 0.3s var(--esds-ease);
}
.baas__layer:hover .baas__layer-shield { transform: rotate(-6deg) scale(1.08); }
.baas__layer-shield svg { width: 24px; height: 24px; }
.baas__layer-name {
    font-size: 14.5px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    margin: 0 0 8px;
    line-height: 1.3;
}
.baas__layer-text {
    font-size: 12.5px;
    color: var(--esds-gray-600);
    line-height: 1.6;
    margin: 0;
    flex-grow: 1;
}
.baas__layer-text strong { color: var(--esds-navy); font-weight: 700; }

.baas__layers-question {
    text-align: center;
    padding: 22px 32px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.06), rgba(126, 233, 255, 0.02));
    border: 1px solid rgba(0, 97, 255, 0.20);
    border-radius: 12px;
    font-size: 16px;
    color: var(--esds-navy);
    font-weight: 600;
    line-height: 1.55;
    letter-spacing: -0.2px;
}
.baas__layers-question strong {
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}

@media (max-width: 1100px) { .baas__layers { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 768px)  { .baas__layers { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px)  { .baas__layers { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §D · WHO IT IS FOR — 5-sector horizontal "ledger" rows
   ─────────────────────────────────────────────────────────────────────────── */
.baas__sectors {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 18px 44px rgba(10, 22, 40, 0.06);
}
.baas__sector {
    display: grid;
    grid-template-columns: 72px 220px 1fr;
    gap: 22px;
    padding: 26px 30px;
    border-bottom: 1px solid var(--esds-gray-100);
    align-items: center;
    transition: background 0.25s;
}
.baas__sector:last-child { border-bottom: 0; }
.baas__sector:hover { background: rgba(0, 97, 255, 0.025); }

.baas__sector-icon {
    width: 56px; height: 56px;
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.12), rgba(126, 233, 255, 0.04));
    border: 1px solid rgba(0, 97, 255, 0.22);
    display: grid;
    place-items: center;
    color: var(--highlight-blue);
    transition: transform 0.3s var(--esds-ease);
}
.baas__sector:hover .baas__sector-icon { transform: rotate(-6deg) scale(1.08); }
.baas__sector-icon svg { width: 28px; height: 28px; }

.baas__sector-name {
    font-size: 17px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.4px;
    margin: 0;
    line-height: 1.2;
    border-right: 1px solid var(--esds-gray-100);
    padding-right: 22px;
    height: 100%;
    display: flex;
    align-items: center;
}
.baas__sector-text {
    font-size: 13.5px;
    color: var(--esds-gray-600);
    line-height: 1.65;
    margin: 0;
    padding-left: 4px;
}
.baas__sector-text strong { color: var(--esds-navy); font-weight: 700; }
.baas__sector-text em {
    font-style: normal;
    color: var(--highlight-blue);
    font-weight: 700;
}

@media (max-width: 992px) {
    .baas__sector { grid-template-columns: 56px 1fr; gap: 16px; padding: 22px 22px; }
    .baas__sector-name { border-right: 0; padding-right: 0; padding-bottom: 4px; height: auto; grid-column: 2; }
    .baas__sector-text { grid-column: 2; padding-left: 0; }
    .baas__sector-icon { grid-row: span 2; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §F · CLOSING CTA — trust extras strip with 5 ✓-cells
   ─────────────────────────────────────────────────────────────────────────── */
.baas__cta-trust-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-top: 32px;
    padding: 18px 22px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(126, 233, 255, 0.20);
    border-radius: 12px;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.baas__cta-trust-cell {
    display: flex;
    align-items: center;
    gap: 9px;
    text-align: left;
    border-right: 1px solid rgba(255, 255, 255, 0.06);
    padding-right: 12px;
}
.baas__cta-trust-cell:last-child { border-right: 0; }
.baas__cta-trust-tick {
    width: 24px; height: 24px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 13px;
    font-weight: 800;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(0, 97, 255, 0.40);
}
.baas__cta-trust-text {
    font-size: 12px;
    font-weight: 600;
    color: #fff;
    line-height: 1.3;
    letter-spacing: -0.2px;
}

@media (max-width: 992px) {
    .baas__cta-trust-strip { grid-template-columns: repeat(2, 1fr); }
    .baas__cta-trust-cell { border-right: 0; padding-right: 0; }
}
@media (max-width: 540px) {
    .baas__cta-trust-strip { grid-template-columns: 1fr; }
}



/* ═══════════════════════════════════════════════════════════════════════════
   BFSI · BFSI SOLUTIONS — Page-specific styles (bfsi__ prefix)
   Common patterns (sec, inner-hero, faq-acc, page-cta, container, tokens,
   stat-card, breadcrumb) come from shared style.css.
   ═══════════════════════════════════════════════════════════════════════════ */


/* ───────────────────────────────────────────────────────────────────────────
   §A · HERO — "Compliance Posture · LIVE" dashboard panel
   ─────────────────────────────────────────────────────────────────────────── */
.bfsi__hero-grid {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    gap: 56px;
    align-items: center;
    margin-bottom: 56px;
}
.bfsi__hero-since {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 6px 12px 6px 6px;
    background: rgba(126, 233, 255, 0.06);
    border: 1px solid rgba(126, 233, 255, 0.20);
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 700;
    color: var(--highlight-blue-light);
    letter-spacing: 0.10em;
    margin: 14px 0 0;
}
.bfsi__hero-since strong {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    letter-spacing: 0.14em;
}

/* The LIVE dashboard panel */
.bfsi__panel {
    background: linear-gradient(180deg, rgba(15, 29, 50, 0.92), rgba(10, 22, 40, 0.96));
    border: 1px solid rgba(126, 233, 255, 0.18);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.40);
    position: relative;
}
.bfsi__panel::before {
    content: '';
    position: absolute;
    top: -120px; right: -120px;
    width: 320px; height: 320px;
    background: radial-gradient(circle, rgba(0, 97, 255, 0.32), transparent 65%);
    filter: blur(40px);
    pointer-events: none;
}
.bfsi__panel-tricolor {
    height: 4px;
    background: linear-gradient(90deg,
        var(--india-saffron) 0%, var(--india-saffron) 33.33%,
        #ffffff 33.33%, #ffffff 66.66%,
        var(--india-green) 66.66%, var(--india-green) 100%);
}
.bfsi__panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px 14px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    position: relative;
    z-index: 1;
}
.bfsi__panel-title {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.18em;
    color: var(--esds-gray-300);
    text-transform: uppercase;
    margin: 0;
}
.bfsi__panel-title strong {
    color: var(--highlight-blue-light);
    font-weight: 800;
}
.bfsi__panel-live {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: rgba(74, 222, 128, 0.12);
    border: 1px solid rgba(74, 222, 128, 0.30);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: #4ade80;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}
.bfsi__panel-live .dot {
    width: 6px; height: 6px;
    border-radius: 50%;
    background: #4ade80;
    box-shadow: 0 0 0 0 rgba(74, 222, 128, 0.6);
    animation: bfsi-pulse-dot 1.4s ease-in-out infinite;
}
@keyframes bfsi-pulse-dot {
    0%, 100% { opacity: 0.45; transform: scale(0.85); }
    50%      { opacity: 1;    transform: scale(1.15); }
}

.bfsi__panel-rows {
    display: grid;
    gap: 0;
    padding: 4px 0;
    position: relative;
    z-index: 1;
}
.bfsi__panel-row {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 14px;
    align-items: center;
    padding: 12px 20px;
    border-bottom: 1px dashed rgba(255, 255, 255, 0.05);
}
.bfsi__panel-row:last-child { border-bottom: 0; }
.bfsi__panel-row-dot {
    width: 8px; height: 8px;
    border-radius: 50%;
    background: #4ade80;
    box-shadow: 0 0 12px rgba(74, 222, 128, 0.5);
}
.bfsi__panel-row--alert .bfsi__panel-row-dot {
    background: var(--highlight-blue-light);
    box-shadow: 0 0 12px rgba(126, 233, 255, 0.5);
}
.bfsi__panel-row-key {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    color: var(--esds-gray-400);
    letter-spacing: 0.10em;
    text-transform: uppercase;
}
.bfsi__panel-row-val {
    font-family: 'JetBrains Mono', monospace;
    font-size: 13px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.2px;
    text-align: right;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}
.bfsi__panel-row-val.is-num {
    color: var(--highlight-blue-light);
    font-variant-numeric: tabular-nums;
    font-size: 14px;
}
.bfsi__panel-row-val.is-ok    { color: #4ade80; }

.bfsi__panel-foot {
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    padding: 12px 20px;
    background: rgba(0, 0, 0, 0.22);
    position: relative;
    z-index: 1;
}
.bfsi__panel-foot-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: 0.16em;
    color: var(--esds-gray-500);
    text-transform: uppercase;
    margin-bottom: 8px;
}
.bfsi__panel-ticker {
    height: 22px;
    overflow: hidden;
    position: relative;
}
.bfsi__panel-ticker-track {
    display: flex;
    flex-direction: column;
    animation: bfsi-ticker 14s steps(7, end) infinite;
}
.bfsi__panel-ticker-line {
    height: 22px;
    line-height: 22px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    color: var(--esds-gray-300);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.bfsi__panel-ticker-line span.t {
    color: var(--india-saffron);
    margin-right: 8px;
    font-weight: 700;
}
.bfsi__panel-ticker-line span.ok {
    color: #4ade80;
    font-weight: 700;
    margin-left: 6px;
}
@keyframes bfsi-ticker {
    0%   { transform: translateY(0); }
    100% { transform: translateY(-154px); } /* 7 lines × 22px */
}

@media (max-width: 992px) {
    .bfsi__hero-grid { grid-template-columns: 1fr; gap: 36px; }
    .bfsi__panel { max-width: 540px; margin: 0 auto; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §B · PROBLEM — 3 "incident-time" scenario cards
   ─────────────────────────────────────────────────────────────────────────── */
.bfsi__problem-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin-bottom: 28px;
}
.bfsi__problem {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 16px;
    padding: 28px 26px 26px;
    position: relative;
    overflow: hidden;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease);
}
.bfsi__problem::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(90deg, #dc2626, #f97316);
    border-radius: 16px 16px 0 0;
}
.bfsi__problem:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(220, 38, 38, 0.12);
}
.bfsi__problem-time {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.14em;
    color: #dc2626;
    margin-bottom: 14px;
}
.bfsi__problem-time::before {
    content: '';
    width: 7px; height: 7px;
    border-radius: 50%;
    background: #dc2626;
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.18);
    animation: bfsi-pulse-dot 1.6s ease-in-out infinite;
}
.bfsi__problem-name {
    font-size: 18px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.4px;
    margin: 0 0 14px;
    line-height: 1.25;
}
.bfsi__problem-text {
    font-size: 14px;
    color: var(--esds-gray-600);
    line-height: 1.65;
    margin: 0;
}

.bfsi__accountability {
    margin-top: 22px;
    padding: 26px 32px;
    background: linear-gradient(135deg, var(--esds-navy), var(--esds-deep));
    border-radius: 16px;
    color: #fff;
    font-size: 17px;
    font-weight: 600;
    line-height: 1.55;
    letter-spacing: -0.2px;
    position: relative;
    overflow: hidden;
}
.bfsi__accountability::after {
    content: '';
    position: absolute;
    top: -60px; right: -60px;
    width: 200px; height: 200px;
    background: radial-gradient(circle, rgba(0, 97, 255, 0.28), transparent 65%);
    filter: blur(30px);
}
.bfsi__accountability strong {
    background: linear-gradient(135deg, var(--highlight-blue-light), #fff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.bfsi__accountability em {
    font-style: normal;
    color: var(--highlight-blue-light);
    font-weight: 700;
}

@media (max-width: 992px) {
    .bfsi__problem-grid { grid-template-columns: 1fr; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §C · SOLUTION FLOW — 5-node horizontal pipeline with animated dot
   ─────────────────────────────────────────────────────────────────────────── */
.bfsi__flow-wrap {
    position: relative;
    padding: 24px 0 12px;
}
.bfsi__flow {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    align-items: stretch;
    position: relative;
    z-index: 1;
}
.bfsi__flow::before {
    /* connecting line behind nodes */
    content: '';
    position: absolute;
    top: 50%;
    left: 6%; right: 6%;
    height: 2px;
    background: repeating-linear-gradient(90deg,
        rgba(0, 97, 255, 0.40) 0 6px, transparent 6px 14px);
    transform: translateY(-50%);
    z-index: 0;
}
.bfsi__flow::after {
    /* moving dot along the line */
    content: '';
    position: absolute;
    top: 50%;
    left: 6%;
    width: 12px; height: 12px;
    border-radius: 50%;
    background: var(--highlight-blue-light);
    box-shadow: 0 0 16px rgba(126, 233, 255, 0.85), 0 0 0 4px rgba(126, 233, 255, 0.18);
    transform: translateY(-50%);
    animation: bfsi-flow-dot 6s linear infinite;
    z-index: 0;
}
@keyframes bfsi-flow-dot {
    0%   { left: 6%;   opacity: 0; }
    8%   { opacity: 1; }
    92%  { opacity: 1; }
    100% { left: 94%;  opacity: 0; }
}
.bfsi__flow-node {
    position: relative;
    z-index: 2;
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 12px;
    padding: 20px 16px;
    text-align: center;
    box-shadow: 0 6px 18px rgba(10, 22, 40, 0.06);
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease);
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.bfsi__flow-node:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 36px rgba(0, 97, 255, 0.18);
    border-color: rgba(0, 97, 255, 0.30);
}
.bfsi__flow-step {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.18em;
    color: var(--highlight-blue);
    text-transform: uppercase;
    margin-bottom: 6px;
}
.bfsi__flow-text {
    font-size: 13px;
    font-weight: 700;
    color: var(--esds-navy);
    line-height: 1.35;
    letter-spacing: -0.2px;
    margin: 0;
}
.bfsi__flow-text em {
    font-style: normal;
    color: var(--highlight-blue);
}

@media (max-width: 1100px) {
    .bfsi__flow { grid-template-columns: repeat(2, 1fr); gap: 14px; }
    .bfsi__flow::before, .bfsi__flow::after { display: none; }
}
@media (max-width: 540px) {
    .bfsi__flow { grid-template-columns: 1fr; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §D · HOW IT WORKS — 4-step blueprint grid with chevrons
   ─────────────────────────────────────────────────────────────────────────── */
.bfsi__steps {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    align-items: stretch;
    position: relative;
}
.bfsi__step {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 16px;
    padding: 28px 24px 26px;
    position: relative;
    overflow: hidden;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
    background-image:
        linear-gradient(rgba(0, 97, 255, 0.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0, 97, 255, 0.025) 1px, transparent 1px);
    background-size: 20px 20px;
    background-position: -1px -1px;
}
.bfsi__step:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 44px rgba(10, 22, 40, 0.10);
    border-color: rgba(0, 97, 255, 0.25);
}
.bfsi__step-eyebrow {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}
.bfsi__step-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.18em;
    color: var(--highlight-blue);
    text-transform: uppercase;
}
.bfsi__step-coord {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.10em;
    color: var(--esds-gray-400);
}
.bfsi__step-icon {
    width: 48px; height: 48px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.10), rgba(126, 233, 255, 0.04));
    border: 1px solid rgba(0, 97, 255, 0.20);
    display: grid;
    place-items: center;
    color: var(--highlight-blue);
    margin-bottom: 16px;
}
.bfsi__step-icon svg { width: 24px; height: 24px; }
.bfsi__step-name {
    font-size: 16px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    margin: 0 0 8px;
    line-height: 1.3;
}
.bfsi__step-text {
    font-size: 13px;
    color: var(--esds-gray-600);
    line-height: 1.6;
    margin: 0;
}

/* chevron between steps */
.bfsi__step-chev {
    position: absolute;
    top: 50%;
    right: -18px;
    transform: translateY(-50%);
    width: 28px; height: 28px;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    border-radius: 50%;
    display: grid;
    place-items: center;
    color: #fff;
    box-shadow: 0 4px 14px rgba(0, 97, 255, 0.30);
    z-index: 2;
    pointer-events: none;
}
.bfsi__step-chev svg { width: 14px; height: 14px; }
.bfsi__step:last-child .bfsi__step-chev { display: none; }

@media (max-width: 992px) {
    .bfsi__steps { grid-template-columns: repeat(2, 1fr); gap: 14px; }
    .bfsi__step:nth-child(2) .bfsi__step-chev { display: none; }
}
@media (max-width: 540px) {
    .bfsi__steps { grid-template-columns: 1fr; }
    .bfsi__step-chev { display: none !important; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §E · CAPABILITIES — 6 cards with branded SVG icons + scale stamps
   ─────────────────────────────────────────────────────────────────────────── */
.bfsi__caps {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}
.bfsi__cap {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 16px;
    padding: 28px 28px 26px;
    position: relative;
    overflow: hidden;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.bfsi__cap::before {
    content: '';
    position: absolute;
    top: 0; right: 0;
    width: 120px; height: 120px;
    background: radial-gradient(circle at top right, rgba(0, 97, 255, 0.10), transparent 70%);
    opacity: 0;
    transition: opacity 0.35s;
}
.bfsi__cap:hover {
    transform: translateY(-5px);
    box-shadow: 0 22px 50px rgba(10, 22, 40, 0.10);
    border-color: rgba(0, 97, 255, 0.25);
}
.bfsi__cap:hover::before { opacity: 1; }
.bfsi__cap-stamp {
    position: absolute;
    top: 18px; right: 18px;
    padding: 4px 10px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.10), rgba(126, 233, 255, 0.06));
    border: 1px solid rgba(0, 97, 255, 0.20);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.10em;
    text-transform: uppercase;
    z-index: 1;
}
.bfsi__cap-icon {
    width: 56px; height: 56px;
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.12), rgba(126, 233, 255, 0.06));
    border: 1px solid rgba(0, 97, 255, 0.20);
    display: grid;
    place-items: center;
    color: var(--highlight-blue);
    margin-bottom: 18px;
    transition: transform 0.3s var(--esds-ease);
}
.bfsi__cap:hover .bfsi__cap-icon { transform: rotate(-6deg) scale(1.05); }
.bfsi__cap-icon svg { width: 28px; height: 28px; }
.bfsi__cap-name {
    font-size: 18px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.4px;
    margin: 0 0 10px;
    line-height: 1.25;
}
.bfsi__cap-text {
    font-size: 13.5px;
    color: var(--esds-gray-600);
    line-height: 1.65;
    margin: 0 0 14px;
}
.bfsi__cap-text strong { color: var(--esds-navy); font-weight: 700; }
.bfsi__cap-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    color: var(--highlight-blue);
    text-decoration: none;
    text-transform: uppercase;
    transition: gap 0.25s var(--esds-ease);
}
.bfsi__cap-link:hover {
    gap: 10px;
    color: var(--highlight-blue);
}
.bfsi__cap-link svg { width: 12px; height: 12px; }

@media (max-width: 1100px) { .bfsi__caps { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px)  { .bfsi__caps { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §F · INDUSTRY FIT — 4 split-layout institution cards
   ─────────────────────────────────────────────────────────────────────────── */
.bfsi__industry-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}
.bfsi__industry {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 16px;
    padding: 0;
    overflow: hidden;
    display: grid;
    grid-template-columns: 200px 1fr;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.bfsi__industry:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(10, 22, 40, 0.10);
    border-color: rgba(0, 97, 255, 0.22);
}
.bfsi__industry-side {
    padding: 28px 24px;
    background: linear-gradient(180deg, rgba(0, 97, 255, 0.08), rgba(126, 233, 255, 0.03));
    border-right: 1px solid var(--esds-gray-100);
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.bfsi__industry-icon {
    width: 48px; height: 48px;
    border-radius: 12px;
    background: #fff;
    border: 1px solid rgba(0, 97, 255, 0.20);
    display: grid;
    place-items: center;
    color: var(--highlight-blue);
    margin-bottom: 14px;
    box-shadow: 0 6px 16px rgba(0, 97, 255, 0.10);
}
.bfsi__industry-icon svg { width: 24px; height: 24px; }
.bfsi__industry-name {
    font-size: 15px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    margin: 0 0 6px;
    line-height: 1.25;
}
.bfsi__industry-tag {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--highlight-blue);
    letter-spacing: 0.06em;
    line-height: 1.4;
}
.bfsi__industry-body {
    padding: 28px 28px;
    display: flex;
    align-items: center;
}
.bfsi__industry-text {
    font-size: 13.5px;
    color: var(--esds-gray-600);
    line-height: 1.65;
    margin: 0;
}
.bfsi__industry-text strong { color: var(--esds-navy); font-weight: 700; }

@media (max-width: 992px) {
    .bfsi__industry-grid { grid-template-columns: 1fr; }
}
@media (max-width: 540px) {
    .bfsi__industry { grid-template-columns: 1fr; }
    .bfsi__industry-side { border-right: 0; border-bottom: 1px solid var(--esds-gray-100); }
}


/* ───────────────────────────────────────────────────────────────────────────
   §G · TRUST INFRASTRUCTURE — 3-tier compliance grid (staggered reveal)
   ─────────────────────────────────────────────────────────────────────────── */
.bfsi__trust-tier {
    margin-bottom: 22px;
}
.bfsi__trust-tier:last-child { margin-bottom: 0; }
.bfsi__trust-tier-label {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.18em;
    color: var(--highlight-blue-light);
    text-transform: uppercase;
    margin-bottom: 12px;
}
.bfsi__trust-tier-label::before {
    content: '';
    width: 24px; height: 1px;
    background: var(--highlight-blue-light);
}
.bfsi__trust-tier-label::after {
    content: '';
    flex: 1;
    height: 1px;
    background: rgba(126, 233, 255, 0.10);
    min-width: 80px;
}
.bfsi__trust-cells {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
}
.bfsi__trust-cell {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    padding: 16px 18px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    opacity: 0;
    transform: translateY(8px);
    transition: opacity 0.5s var(--esds-ease), transform 0.5s var(--esds-ease), border-color 0.3s, background 0.3s;
}
.bfsi__trust-cell.is-visible {
    opacity: 1;
    transform: translateY(0);
}
.bfsi__trust-cell:hover {
    border-color: rgba(126, 233, 255, 0.40);
    background: rgba(0, 97, 255, 0.06);
}
.bfsi__trust-cell-tick {
    display: inline-grid;
    place-items: center;
    width: 18px; height: 18px;
    border-radius: 50%;
    background: rgba(74, 222, 128, 0.20);
    color: #4ade80;
    font-size: 10px;
    font-weight: 800;
    flex-shrink: 0;
}
.bfsi__trust-cell-name {
    font-size: 13px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.2px;
    line-height: 1.3;
}
.bfsi__trust-cell-meta {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 700;
    color: var(--esds-gray-400);
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.bfsi__trust-cell-row {
    display: flex;
    align-items: center;
    gap: 8px;
}

.bfsi__trust-cta {
    margin-top: 30px;
    padding: 20px 26px;
    background: rgba(0, 97, 255, 0.08);
    border: 1px solid rgba(126, 233, 255, 0.25);
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
}
.bfsi__trust-cta-text {
    font-size: 15px;
    font-weight: 700;
    color: #fff;
    margin: 0;
}
.bfsi__trust-cta-text small {
    display: block;
    font-size: 12.5px;
    font-weight: 500;
    color: var(--esds-gray-400);
    margin-top: 4px;
}

@media (max-width: 992px) { .bfsi__trust-cells { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .bfsi__trust-cells { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §H · PROOF — SIDBI featured outcome card
   ─────────────────────────────────────────────────────────────────────────── */
.bfsi__proof {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 20px;
    overflow: hidden;
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    box-shadow: 0 22px 60px rgba(10, 22, 40, 0.08);
}
.bfsi__proof-side {
    padding: 38px 38px 36px;
    background: linear-gradient(135deg, var(--esds-navy), var(--esds-deep));
    color: #fff;
    position: relative;
    overflow: hidden;
}
.bfsi__proof-side::before {
    content: '';
    position: absolute;
    top: -100px; right: -100px;
    width: 280px; height: 280px;
    background: radial-gradient(circle, rgba(0, 97, 255, 0.32), transparent 65%);
    filter: blur(40px);
}
.bfsi__proof-tag {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.18em;
    color: var(--highlight-blue-light);
    text-transform: uppercase;
    margin-bottom: 8px;
    position: relative;
    z-index: 1;
}
.bfsi__proof-name {
    font-size: 36px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -1.2px;
    margin: 0 0 12px;
    position: relative;
    z-index: 1;
}
.bfsi__proof-meta {
    font-size: 13px;
    font-weight: 700;
    color: var(--esds-gray-300);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin-bottom: 24px;
    position: relative;
    z-index: 1;
}
.bfsi__proof-stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
    position: relative;
    z-index: 1;
}
.bfsi__proof-stat-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 26px;
    font-weight: 800;
    background: linear-gradient(135deg, var(--highlight-blue-light), #fff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    letter-spacing: -1px;
    line-height: 1;
}
.bfsi__proof-stat-num small {
    font-size: 14px;
    color: var(--esds-gray-300);
    -webkit-text-fill-color: var(--esds-gray-300);
    margin-left: 2px;
}
.bfsi__proof-stat-label {
    font-size: 11.5px;
    color: var(--esds-gray-400);
    line-height: 1.4;
    margin-top: 6px;
}
.bfsi__proof-body {
    padding: 38px 36px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.bfsi__proof-narrative {
    font-size: 17px;
    color: var(--esds-navy);
    line-height: 1.6;
    font-weight: 600;
    letter-spacing: -0.3px;
    margin: 0 0 18px;
}
.bfsi__proof-narrative em {
    font-style: normal;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.bfsi__proof-detail {
    font-size: 13.5px;
    color: var(--esds-gray-600);
    line-height: 1.65;
    margin: 0;
}

.bfsi__proof-coming {
    margin-top: 24px;
    text-align: center;
    padding: 18px;
    background: rgba(255, 255, 255, 0.55);
    border: 1px dashed var(--esds-gray-200);
    border-radius: 12px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11.5px;
    font-weight: 700;
    color: var(--esds-gray-500);
    letter-spacing: 0.10em;
    text-transform: uppercase;
}
.bfsi__proof-coming::before {
    content: '+ ';
    color: var(--highlight-blue);
    font-weight: 800;
}

@media (max-width: 992px) {
    .bfsi__proof { grid-template-columns: 1fr; }
}
@media (max-width: 540px) {
    .bfsi__proof-stats { grid-template-columns: 1fr; }
    .bfsi__proof-name { font-size: 28px; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §I · COMPETITIVE CLARITY — 2×2 risk-resolution split cards
   ─────────────────────────────────────────────────────────────────────────── */
.bfsi__risks {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
    margin-bottom: 28px;
}
.bfsi__risk {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 16px;
    overflow: hidden;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease);
}
.bfsi__risk:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 44px rgba(10, 22, 40, 0.10);
}
.bfsi__risk-foreign {
    padding: 24px 26px;
    background: linear-gradient(135deg, rgba(220, 38, 38, 0.04), rgba(248, 113, 113, 0.02));
    border-bottom: 1px solid rgba(220, 38, 38, 0.10);
    position: relative;
}
.bfsi__risk-foreign::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 4px; height: 100%;
    background: linear-gradient(180deg, #dc2626, #f97316);
}
.bfsi__risk-tag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.16em;
    color: #dc2626;
    text-transform: uppercase;
    margin-bottom: 6px;
}
.bfsi__risk-tag::before {
    content: '✗';
    width: 16px; height: 16px;
    border-radius: 50%;
    background: rgba(220, 38, 38, 0.12);
    color: #dc2626;
    display: grid;
    place-items: center;
    font-size: 10px;
    font-weight: 800;
}
.bfsi__risk-name {
    font-size: 18px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.4px;
    margin: 0 0 10px;
    line-height: 1.25;
}
.bfsi__risk-text {
    font-size: 13.5px;
    color: var(--esds-gray-600);
    line-height: 1.6;
    margin: 0;
}
.bfsi__risk-esds {
    padding: 22px 26px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.06), rgba(126, 233, 255, 0.02));
    position: relative;
}
.bfsi__risk-esds::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 4px; height: 100%;
    background: linear-gradient(180deg, var(--highlight-blue), var(--highlight-blue-light));
}
.bfsi__risk-esds-tag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.16em;
    color: var(--highlight-blue);
    text-transform: uppercase;
    margin-bottom: 6px;
}
.bfsi__risk-esds-tag::before {
    content: '✓';
    width: 16px; height: 16px;
    border-radius: 50%;
    background: var(--highlight-blue);
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 10px;
    font-weight: 800;
}
.bfsi__risk-esds-text {
    font-size: 13.5px;
    color: var(--esds-navy);
    line-height: 1.6;
    margin: 0;
    font-weight: 600;
}
.bfsi__risk-esds-text strong {
    color: var(--highlight-blue);
    font-weight: 800;
}

.bfsi__risks-conclusion {
    padding: 24px 32px;
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-left: 4px solid var(--highlight-blue);
    border-radius: 12px;
    font-size: 16px;
    color: var(--esds-navy);
    line-height: 1.6;
    font-weight: 600;
    letter-spacing: -0.2px;
}
.bfsi__risks-conclusion strong {
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}

@media (max-width: 992px) { .bfsi__risks { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §K · CLOSING CTA — bfsi__ extras layered on shared .page-cta
   ─────────────────────────────────────────────────────────────────────────── */
.bfsi__cta-trust-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 16px;
    margin-top: 36px;
    padding: 20px 24px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(126, 233, 255, 0.20);
    border-radius: 12px;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.bfsi__cta-trust-cell {
    text-align: center;
    border-right: 1px solid rgba(255, 255, 255, 0.06);
    padding: 4px 0;
}
.bfsi__cta-trust-cell:last-child { border-right: 0; }
.bfsi__cta-trust-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 18px;
    font-weight: 800;
    color: var(--highlight-blue-light);
    letter-spacing: -0.4px;
    margin-bottom: 2px;
}
.bfsi__cta-trust-label {
    font-size: 11px;
    color: var(--esds-gray-400);
    font-weight: 600;
    line-height: 1.35;
}

@media (max-width: 768px) {
    .bfsi__cta-trust-strip { grid-template-columns: repeat(2, 1fr); }
    .bfsi__cta-trust-cell { border-right: 0; border-bottom: 1px solid rgba(255, 255, 255, 0.06); padding: 8px 0; }
    .bfsi__cta-trust-cell:last-child { border-bottom: 0; }
    .bfsi__cta-trust-cell:nth-last-child(2) { border-bottom: 0; }
}



/* ═══════════════════════════════════════════════════════════════════════════
   E360 · ENLIGHT 360° — Page-specific styles (e360__ prefix)
   Common patterns (sec, inner-hero, faq-acc, page-cta, container, tokens,
   stat-card, breadcrumb) come from shared style.css.
   ═══════════════════════════════════════════════════════════════════════════ */


/* ───────────────────────────────────────────────────────────────────────────
   §A · HERO — "Live Auto-Scale Console"
   ─────────────────────────────────────────────────────────────────────────── */
.e360__hero-grid {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 56px;
    align-items: center;
    margin-bottom: 24px;
}

.e360__hero-credentials {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 22px;
}
.e360__hero-cred {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(126, 233, 255, 0.20);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--esds-gray-300);
    letter-spacing: 0.10em;
    text-transform: uppercase;
}
.e360__hero-cred::before {
    content: '✓';
    color: #4ade80;
    font-weight: 800;
    font-size: 11px;
}

/* Live Auto-Scale Console */
.e360__console {
    background: linear-gradient(180deg, rgba(15, 29, 50, 0.96), rgba(10, 22, 40, 0.98));
    border: 1px solid rgba(126, 233, 255, 0.22);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.45);
    position: relative;
}
.e360__console::before {
    content: '';
    position: absolute;
    top: -120px; right: -120px;
    width: 320px; height: 320px;
    background: radial-gradient(circle, rgba(0, 97, 255, 0.30), transparent 65%);
    filter: blur(40px);
    pointer-events: none;
}
.e360__console-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 22px 14px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    position: relative;
    z-index: 1;
}
.e360__console-title {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.14em;
    color: var(--esds-gray-300);
    text-transform: uppercase;
    margin: 0;
}
.e360__console-title strong {
    color: var(--highlight-blue-light);
    font-weight: 800;
}
.e360__console-patent {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: rgba(255, 153, 51, 0.10);
    border: 1px solid rgba(255, 153, 51, 0.30);
    border-radius: 4px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.14em;
    text-transform: uppercase;
}
.e360__console-patent::before {
    content: '◆';
    font-size: 8px;
}

.e360__gauges {
    padding: 24px 22px 18px;
    position: relative;
    z-index: 1;
}
.e360__gauge {
    margin-bottom: 16px;
}
.e360__gauge:last-child { margin-bottom: 0; }
.e360__gauge-row {
    display: grid;
    grid-template-columns: 60px 1fr 50px auto;
    gap: 12px;
    align-items: center;
    margin-bottom: 6px;
}
.e360__gauge-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--esds-gray-300);
    letter-spacing: 0.12em;
    text-transform: uppercase;
}
.e360__gauge-track {
    height: 10px;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 5px;
    overflow: hidden;
    position: relative;
}
.e360__gauge-fill {
    position: absolute;
    top: 0; left: 0; bottom: 0;
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
    border-radius: 5px;
    width: 30%;
    box-shadow: 0 0 8px rgba(126, 233, 255, 0.50);
}
.e360__gauge-fill--cpu { animation: e360-flux-cpu 8s ease-in-out infinite; }
.e360__gauge-fill--ram { animation: e360-flux-ram 7s ease-in-out infinite; }
.e360__gauge-fill--bw  { animation: e360-flux-bw  9s ease-in-out infinite; }

@keyframes e360-flux-cpu {
    0%, 100% { width: 32%; }
    25%      { width: 78%; }
    50%      { width: 62%; }
    75%      { width: 88%; }
}
@keyframes e360-flux-ram {
    0%, 100% { width: 48%; }
    30%      { width: 92%; }
    65%      { width: 68%; }
}
@keyframes e360-flux-bw {
    0%, 100% { width: 40%; }
    35%      { width: 56%; }
    70%      { width: 30%; }
}

.e360__gauge-value {
    font-family: 'JetBrains Mono', monospace;
    font-size: 13px;
    font-weight: 800;
    color: #fff;
    text-align: right;
    min-width: 50px;
}
.e360__gauge-value--cpu::after { content: '64%'; animation: e360-num-cpu 8s ease-in-out infinite; }
.e360__gauge-value--ram::after { content: '78%'; animation: e360-num-ram 7s ease-in-out infinite; }
.e360__gauge-value--bw::after  { content: '48%'; animation: e360-num-bw  9s ease-in-out infinite; }

@keyframes e360-num-cpu {
    0%, 100% { content: '32%'; }
    25%      { content: '78%'; }
    50%      { content: '62%'; }
    75%      { content: '88%'; }
}
@keyframes e360-num-ram {
    0%, 100% { content: '48%'; }
    30%      { content: '92%'; }
    65%      { content: '68%'; }
}
@keyframes e360-num-bw {
    0%, 100% { content: '40%'; }
    35%      { content: '56%'; }
    70%      { content: '30%'; }
}
.e360__gauge-trend {
    width: 22px; height: 22px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 11px;
    font-weight: 800;
    color: #4ade80;
    background: rgba(74, 222, 128, 0.12);
    border: 1px solid rgba(74, 222, 128, 0.30);
}
.e360__gauge-bar-meta {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 600;
    color: var(--esds-gray-500);
    letter-spacing: 0.06em;
    margin-left: 72px;
}

/* Activity ribbon */
.e360__activity {
    margin: 18px 22px 0;
    padding: 12px 16px;
    background: rgba(0, 97, 255, 0.08);
    border: 1px solid rgba(0, 97, 255, 0.25);
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11.5px;
    font-weight: 700;
    color: var(--highlight-blue-light);
    letter-spacing: 0.04em;
    position: relative;
    z-index: 1;
}
.e360__activity-icon {
    width: 22px; height: 22px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 12px;
    font-weight: 800;
    flex-shrink: 0;
    animation: e360-spin 4s linear infinite;
}
@keyframes e360-spin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}
.e360__activity-text {
    transition: opacity 0.3s ease;
}

.e360__console-foot {
    padding: 14px 22px;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    background: rgba(0, 0, 0, 0.25);
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: #4ade80;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    text-align: center;
    position: relative;
    z-index: 1;
}
.e360__console-foot small {
    display: block;
    color: var(--esds-gray-400);
    font-size: 9.5px;
    font-weight: 600;
    letter-spacing: 0.08em;
    margin-top: 4px;
}

@media (max-width: 992px) {
    .e360__hero-grid { grid-template-columns: 1fr; gap: 36px; }
    .e360__console { max-width: 540px; margin: 0 auto; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §B · PULL QUOTE — full-width oversized blockquote
   ─────────────────────────────────────────────────────────────────────────── */
.e360__quote-wrap {
    position: relative;
    max-width: 980px;
    margin: 0 auto;
    padding: 20px 60px;
}
.e360__quote-mark {
    position: absolute;
    top: -8px;
    left: 0;
    font-family: Georgia, serif;
    font-size: 110px;
    line-height: 1;
    color: var(--highlight-blue);
    opacity: 0.18;
    font-weight: 700;
}
.e360__quote-text {
    font-size: 24px;
    line-height: 1.5;
    color: var(--esds-navy);
    font-weight: 600;
    letter-spacing: -0.4px;
    margin: 0;
    position: relative;
    z-index: 1;
}
.e360__quote-text strong {
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.e360__quote-text em {
    font-style: italic;
    color: var(--highlight-blue);
}

@media (max-width: 768px) {
    .e360__quote-wrap { padding: 16px 24px 16px 44px; }
    .e360__quote-text { font-size: 18px; }
    .e360__quote-mark { font-size: 80px; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §C · 4 OUTCOME CARDS — 4-up grid
   ─────────────────────────────────────────────────────────────────────────── */
.e360__outcomes {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
.e360__outcome {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 26px 22px 22px;
    position: relative;
    overflow: hidden;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.e360__outcome::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 3px;
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
    transform: scaleX(0.30);
    transform-origin: left;
    transition: transform 0.4s var(--esds-ease);
}
.e360__outcome:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 44px rgba(0, 97, 255, 0.12);
    border-color: rgba(0, 97, 255, 0.20);
}
.e360__outcome:hover::before { transform: scaleX(1); }
.e360__outcome-icon {
    width: 44px; height: 44px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.12), rgba(126, 233, 255, 0.04));
    border: 1px solid rgba(0, 97, 255, 0.20);
    display: grid;
    place-items: center;
    color: var(--highlight-blue);
    margin-bottom: 14px;
}
.e360__outcome-icon svg { width: 22px; height: 22px; }
.e360__outcome-name {
    font-size: 16px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    margin: 0 0 8px;
    line-height: 1.3;
}
.e360__outcome-text {
    font-size: 13px;
    color: var(--esds-gray-600);
    line-height: 1.6;
    margin: 0;
}

@media (max-width: 1100px) { .e360__outcomes { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px)  { .e360__outcomes { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §D · PRODUCT INTRO — centered intro + 2-card Software/Appliance split
   ─────────────────────────────────────────────────────────────────────────── */
.e360__intro {
    max-width: 880px;
    margin: 0 auto 32px;
    text-align: center;
    font-size: 16px;
    line-height: 1.7;
    color: var(--esds-gray-700);
}
.e360__intro strong { color: var(--esds-navy); font-weight: 700; }
.e360__intro em {
    font-style: normal;
    color: var(--highlight-blue);
    font-weight: 700;
}

.e360__delivery {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
    max-width: 880px;
    margin: 0 auto;
}
.e360__delivery-card {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 16px;
    padding: 26px 28px;
    position: relative;
    overflow: hidden;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.e360__delivery-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 40px rgba(0, 97, 255, 0.10);
    border-color: rgba(0, 97, 255, 0.20);
}
.e360__delivery-eyebrow {
    display: inline-flex;
    align-items: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.16em;
    color: var(--highlight-blue);
    text-transform: uppercase;
    margin-bottom: 10px;
    padding: 4px 9px;
    background: rgba(0, 97, 255, 0.06);
    border-radius: 4px;
}
.e360__delivery-name {
    font-size: 17px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    margin: 0 0 8px;
    line-height: 1.3;
}
.e360__delivery-text {
    font-size: 13.5px;
    color: var(--esds-gray-600);
    line-height: 1.6;
    margin: 0;
}
.e360__delivery-text strong { color: var(--esds-navy); font-weight: 700; }

@media (max-width: 768px) { .e360__delivery { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §E · PATENT MOAT — centered patent-medallion focal element
   ─────────────────────────────────────────────────────────────────────────── */
.e360__patent {
    max-width: 880px;
    margin: 0 auto;
    text-align: center;
    background: linear-gradient(135deg, var(--esds-navy), var(--esds-deep));
    color: #fff;
    border-radius: 22px;
    padding: 48px 56px 44px;
    position: relative;
    overflow: hidden;
}
.e360__patent::before {
    content: '';
    position: absolute;
    top: -120px; left: 50%;
    transform: translateX(-50%);
    width: 480px; height: 320px;
    background: radial-gradient(ellipse, rgba(0, 97, 255, 0.35), transparent 65%);
    filter: blur(50px);
    pointer-events: none;
}
.e360__patent-medallions {
    display: inline-flex;
    gap: 14px;
    margin-bottom: 24px;
    flex-wrap: wrap;
    justify-content: center;
    position: relative;
    z-index: 1;
}
.e360__patent-medallion {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 18px 10px 14px;
    background: rgba(255, 153, 51, 0.10);
    border: 1.5px solid rgba(255, 153, 51, 0.40);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11.5px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.12em;
    text-transform: uppercase;
}
.e360__patent-medallion-mark {
    width: 22px; height: 22px;
    border-radius: 50%;
    background: var(--india-saffron);
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 11px;
    font-weight: 800;
}
.e360__patent-headline {
    font-size: 28px;
    font-weight: 800;
    margin: 0 0 16px;
    line-height: 1.25;
    letter-spacing: -0.6px;
    position: relative;
    z-index: 1;
}
.e360__patent-headline em {
    font-style: normal;
    background: linear-gradient(135deg, var(--highlight-blue-light), #fff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.e360__patent-text {
    font-size: 15px;
    color: var(--esds-gray-300);
    line-height: 1.7;
    margin: 0 0 22px;
    position: relative;
    z-index: 1;
}
.e360__patent-text strong { color: #fff; font-weight: 700; }
.e360__patent-callout {
    display: inline-block;
    padding: 14px 22px;
    background: rgba(74, 222, 128, 0.10);
    border: 1px solid rgba(74, 222, 128, 0.30);
    border-radius: 10px;
    font-size: 14px;
    font-weight: 700;
    color: #4ade80;
    letter-spacing: -0.2px;
    position: relative;
    z-index: 1;
}
.e360__patent-callout::before {
    content: '↑ OUTCOME · ';
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.14em;
    color: rgba(74, 222, 128, 0.70);
    margin-right: 4px;
}
.e360__patent-callout strong { color: #fff; font-weight: 800; }

.e360__protected {
    text-align: center;
    margin-top: 22px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    color: var(--esds-gray-500);
    letter-spacing: 0.18em;
    text-transform: uppercase;
}
.e360__protected strong {
    color: var(--esds-navy);
    font-weight: 800;
}

@media (max-width: 768px) {
    .e360__patent { padding: 36px 28px 32px; }
    .e360__patent-headline { font-size: 22px; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §F · CAPABILITIES LEDGER — 7 rows with ↑ outcome arrows
   ─────────────────────────────────────────────────────────────────────────── */
.e360__caps-head {
    text-align: center;
    margin-bottom: 32px;
    max-width: 880px;
    margin-left: auto;
    margin-right: auto;
    font-size: 16px;
    line-height: 1.7;
    color: var(--esds-gray-700);
}
.e360__caps-head strong { color: var(--esds-navy); font-weight: 700; }

.e360__caps {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 18px 44px rgba(10, 22, 40, 0.06);
}
.e360__cap-row {
    display: grid;
    grid-template-columns: 1.2fr auto 1fr;
    gap: 0;
    padding: 22px 28px;
    border-bottom: 1px solid var(--esds-gray-100);
    align-items: center;
    transition: background 0.25s;
}
.e360__cap-row:last-child { border-bottom: 0; }
.e360__cap-row:hover { background: rgba(0, 97, 255, 0.02); }
.e360__cap-name {
    font-size: 15px;
    font-weight: 700;
    color: var(--esds-navy);
    letter-spacing: -0.2px;
    line-height: 1.45;
    padding-right: 24px;
}
.e360__cap-name strong { color: var(--esds-navy); font-weight: 800; }
.e360__cap-name small {
    display: block;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--esds-gray-500);
    letter-spacing: 0.04em;
    margin-top: 4px;
    text-transform: uppercase;
}
.e360__cap-arrow {
    width: 32px; height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.10), rgba(126, 233, 255, 0.04));
    border: 1px solid rgba(0, 97, 255, 0.20);
    color: var(--highlight-blue);
    display: grid;
    place-items: center;
    font-size: 14px;
    font-weight: 800;
    flex-shrink: 0;
    margin: 0 18px;
}
.e360__cap-outcome {
    font-size: 14px;
    color: var(--highlight-blue);
    font-weight: 700;
    line-height: 1.5;
    padding-left: 8px;
}
.e360__cap-outcome strong {
    color: var(--esds-navy);
    font-weight: 800;
}

@media (max-width: 768px) {
    .e360__cap-row { grid-template-columns: 1fr; gap: 10px; padding: 18px 20px; }
    .e360__cap-arrow { margin: 0; transform: rotate(90deg); }
    .e360__cap-name { padding-right: 0; }
    .e360__cap-outcome { padding-left: 0; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §G · 4-IN-1 APPLIANCE — 2×2 threat→component grid
   ─────────────────────────────────────────────────────────────────────────── */
.e360__appliance-eyebrow {
    text-align: center;
    margin-bottom: 22px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11.5px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.18em;
    text-transform: uppercase;
}
.e360__appliance-eyebrow strong { color: var(--india-saffron); font-weight: 800; }
.e360__appliance {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
}
.e360__component {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 16px;
    padding: 28px 28px 24px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.e360__component:hover {
    transform: translateY(-5px);
    box-shadow: 0 22px 50px rgba(10, 22, 40, 0.10);
    border-color: rgba(0, 97, 255, 0.25);
}
.e360__component-threat {
    display: inline-flex;
    align-items: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: #dc2626;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    padding: 4px 10px;
    background: rgba(220, 38, 38, 0.06);
    border-radius: 4px;
    margin-bottom: 14px;
    align-self: flex-start;
}
.e360__component-threat::before {
    content: '⚠ ';
    margin-right: 4px;
}
.e360__component-icon {
    width: 56px; height: 56px;
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.12), rgba(126, 233, 255, 0.06));
    border: 1px solid rgba(0, 97, 255, 0.20);
    display: grid;
    place-items: center;
    color: var(--highlight-blue);
    margin-bottom: 16px;
    transition: transform 0.3s var(--esds-ease);
}
.e360__component:hover .e360__component-icon { transform: rotate(-6deg) scale(1.05); }
.e360__component-icon svg { width: 28px; height: 28px; }
.e360__component-name {
    font-size: 18px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.4px;
    margin: 0 0 4px;
    line-height: 1.25;
}
.e360__component-tagline {
    font-size: 13px;
    color: var(--highlight-blue);
    font-weight: 700;
    letter-spacing: -0.2px;
    margin: 0 0 12px;
    font-style: italic;
}
.e360__component-text {
    font-size: 13px;
    color: var(--esds-gray-600);
    line-height: 1.65;
    margin: 0 0 16px;
    flex-grow: 1;
}
.e360__component-text strong { color: var(--esds-navy); font-weight: 700; }
.e360__component-checks {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 0 0 16px;
    padding: 12px 14px;
    background: var(--esds-gray-50);
    border-radius: 8px;
}
.e360__component-check {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12.5px;
    color: var(--esds-navy);
    font-weight: 600;
    line-height: 1.4;
}
.e360__component-check::before {
    content: '✓';
    width: 16px; height: 16px;
    flex-shrink: 0;
    background: rgba(74, 222, 128, 0.18);
    color: #4ade80;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 10px;
    font-weight: 800;
}
.e360__component-gain {
    margin-top: auto;
    padding: 12px 14px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.06), rgba(126, 233, 255, 0.02));
    border-left: 3px solid var(--highlight-blue);
    border-radius: 0 8px 8px 0;
    font-size: 13px;
    color: var(--esds-navy);
    font-weight: 700;
    line-height: 1.5;
}
.e360__component-gain::before {
    content: '↑ YOU GAIN ';
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.14em;
    margin-right: 4px;
}

@media (max-width: 992px) { .e360__appliance { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §H · SOVEREIGNTY MANIFESTO — 6 pillars 3×2 with tricolor strip
   ─────────────────────────────────────────────────────────────────────────── */
.e360__sovereignty-intro {
    max-width: 880px;
    margin: 0 auto 32px;
    text-align: center;
    font-size: 15.5px;
    line-height: 1.7;
    color: var(--esds-gray-300);
}
.e360__sovereignty-intro strong {
    color: #fff;
    font-weight: 700;
}
.e360__sovereignty-intro em {
    font-style: normal;
    background: linear-gradient(135deg, var(--highlight-blue-light), #fff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.e360__pillars {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}
.e360__pillar {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 14px;
    padding: 24px 22px 20px;
    position: relative;
    overflow: hidden;
    transition: border-color 0.3s, background 0.3s;
}
.e360__pillar::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 3px;
    background: linear-gradient(90deg,
        var(--india-saffron) 0%, var(--india-saffron) 33.33%,
        #ffffff 33.33%, #ffffff 66.66%,
        var(--india-green) 66.66%, var(--india-green) 100%);
    transform: scaleX(0.30);
    transform-origin: left;
    transition: transform 0.4s var(--esds-ease);
}
.e360__pillar:hover {
    border-color: rgba(126, 233, 255, 0.30);
    background: rgba(0, 97, 255, 0.04);
}
.e360__pillar:hover::before { transform: scaleX(1); }
.e360__pillar-mark {
    width: 36px; height: 36px;
    border-radius: 10px;
    background: rgba(255, 153, 51, 0.10);
    border: 1px solid rgba(255, 153, 51, 0.30);
    color: var(--india-saffron);
    display: grid;
    place-items: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    margin-bottom: 14px;
    letter-spacing: 0.04em;
}
.e360__pillar-name {
    font-size: 15.5px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.3px;
    margin: 0 0 8px;
    line-height: 1.3;
}
.e360__pillar-text {
    font-size: 13px;
    color: var(--esds-gray-300);
    line-height: 1.6;
    margin: 0;
}
.e360__pillar-text strong { color: #fff; font-weight: 700; }

@media (max-width: 992px) { .e360__pillars { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .e360__pillars { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §I · COMPLIANCE CERTS — 6 cert cards with ↑ outcome
   ─────────────────────────────────────────────────────────────────────────── */
.e360__certs {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}
.e360__cert {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 26px 24px 22px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.e360__cert:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0, 97, 255, 0.10);
    border-color: rgba(0, 97, 255, 0.20);
}
.e360__cert-shield {
    width: 48px; height: 48px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.12), rgba(126, 233, 255, 0.04));
    border: 1px solid rgba(0, 97, 255, 0.22);
    color: var(--highlight-blue);
    display: grid;
    place-items: center;
    margin-bottom: 14px;
}
.e360__cert-shield svg { width: 24px; height: 24px; }
.e360__cert-name {
    font-size: 16px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    margin: 0 0 6px;
    line-height: 1.3;
}
.e360__cert-text {
    font-size: 13px;
    color: var(--esds-gray-600);
    line-height: 1.55;
    margin: 0 0 14px;
    flex-grow: 1;
}
.e360__cert-outcome {
    margin-top: auto;
    padding: 10px 12px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.06), rgba(126, 233, 255, 0.02));
    border-left: 3px solid var(--highlight-blue);
    border-radius: 0 6px 6px 0;
    font-size: 12.5px;
    color: var(--esds-navy);
    font-weight: 700;
    line-height: 1.5;
}
.e360__cert-outcome::before {
    content: '↑ ';
    font-family: 'JetBrains Mono', monospace;
    color: var(--highlight-blue);
    font-weight: 800;
}

@media (max-width: 1100px) { .e360__certs { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px)  { .e360__certs { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §J · COMPARISON TABLE — 8-row Foreign Tools vs Enlight 360°
   ─────────────────────────────────────────────────────────────────────────── */
.e360__compare {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 22px 50px rgba(10, 22, 40, 0.08);
}
.e360__compare-row {
    display: grid;
    grid-template-columns: 1fr 1.4fr 1.4fr;
    gap: 0;
    border-bottom: 1px solid var(--esds-gray-100);
    transition: background 0.25s;
}
.e360__compare-row:last-child { border-bottom: 0; }
.e360__compare-row:hover .e360__compare-cell { background-color: rgba(0, 97, 255, 0.02); }
.e360__compare-row:hover .e360__compare-cell--ours { background-color: rgba(0, 97, 255, 0.06); }
.e360__compare-cell {
    padding: 16px 22px;
    font-size: 13.5px;
    line-height: 1.55;
    border-right: 1px solid var(--esds-gray-100);
    transition: background-color 0.25s;
}
.e360__compare-cell:last-child { border-right: 0; }
.e360__compare-cell--head {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: 0.10em;
    color: var(--esds-navy);
    text-transform: uppercase;
    background: var(--esds-gray-50);
    padding: 18px 22px;
}
.e360__compare-cell--head.e360__compare-cell--theirs {
    background: linear-gradient(135deg, rgba(220, 38, 38, 0.06), rgba(248, 113, 113, 0.02));
    color: #b91c1c;
}
.e360__compare-cell--head.e360__compare-cell--ours {
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.08), rgba(126, 233, 255, 0.04));
    color: var(--highlight-blue);
}
.e360__compare-cell--key {
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: var(--esds-navy);
    background: var(--esds-gray-50);
    text-transform: uppercase;
}
.e360__compare-cell--theirs {
    color: var(--esds-gray-600);
    position: relative;
    padding-left: 36px;
}
.e360__compare-cell--theirs::before {
    content: '✗';
    position: absolute;
    top: 16px; left: 16px;
    color: rgba(220, 38, 38, 0.45);
    font-size: 12px;
    font-weight: 800;
}
.e360__compare-cell--ours {
    color: var(--esds-navy);
    font-weight: 600;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.025), transparent);
    position: relative;
    padding-left: 36px;
}
.e360__compare-cell--ours::before {
    content: '✓';
    position: absolute;
    top: 16px; left: 16px;
    color: var(--highlight-blue);
    font-size: 12px;
    font-weight: 800;
}
.e360__compare-cell--ours strong {
    color: var(--highlight-blue);
    font-weight: 800;
}
.e360__compare-cell--ours .e360__compare-patent-badge {
    display: inline-flex;
    align-items: center;
    margin-left: 6px;
    padding: 2px 7px;
    background: rgba(255, 153, 51, 0.10);
    border: 1px solid rgba(255, 153, 51, 0.30);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.10em;
    text-transform: uppercase;
}

@media (max-width: 992px) {
    .e360__compare-row { grid-template-columns: 1fr; }
    .e360__compare-cell { border-right: 0; border-bottom: 1px solid var(--esds-gray-100); }
    .e360__compare-cell:last-child { border-bottom: 0; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §K · INDUSTRIES — 7-pill horizontal strip
   ─────────────────────────────────────────────────────────────────────────── */
.e360__industries {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
    max-width: 980px;
    margin: 0 auto;
}
.e360__ind {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 22px;
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 999px;
    font-size: 14px;
    font-weight: 700;
    color: var(--esds-navy);
    letter-spacing: -0.2px;
    transition: transform 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease), color 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease);
}
.e360__ind:hover {
    transform: translateY(-2px);
    border-color: rgba(0, 97, 255, 0.30);
    color: var(--highlight-blue);
    box-shadow: 0 8px 22px rgba(0, 97, 255, 0.10);
}
.e360__ind-icon {
    width: 22px; height: 22px;
    color: var(--highlight-blue);
    flex-shrink: 0;
}
.e360__ind-icon svg { width: 100%; height: 100%; display: block; }


/* ───────────────────────────────────────────────────────────────────────────
   §L · CLOSING CTA — trust extras strip
   ─────────────────────────────────────────────────────────────────────────── */
.e360__cta-trust-strip {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-top: 32px;
    padding: 18px 22px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(126, 233, 255, 0.20);
    border-radius: 12px;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.e360__cta-trust-cell {
    display: flex;
    align-items: center;
    gap: 10px;
    text-align: left;
    border-right: 1px solid rgba(255, 255, 255, 0.06);
    padding-right: 14px;
}
.e360__cta-trust-cell:last-child { border-right: 0; }
.e360__cta-trust-tick {
    width: 26px; height: 26px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 14px;
    font-weight: 800;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(0, 97, 255, 0.40);
}
.e360__cta-trust-text {
    font-size: 12.5px;
    font-weight: 600;
    color: #fff;
    line-height: 1.3;
    letter-spacing: -0.2px;
}

@media (max-width: 768px) {
    .e360__cta-trust-strip { grid-template-columns: repeat(2, 1fr); }
    .e360__cta-trust-cell { border-right: 0; padding-right: 0; }
}


/* ═══════════════════════════════════════════════════════════════════════════
   DRA · DRaaS — Page-specific styles (dra__ prefix)
   Common patterns (sec, inner-hero, faq-acc, page-cta, container, tokens,
   stat-card, breadcrumb) come from shared style.css.
   ═══════════════════════════════════════════════════════════════════════════ */


/* ───────────────────────────────────────────────────────────────────────────
   §A · HERO — "DR Console" with 6-stat readiness panel
   ─────────────────────────────────────────────────────────────────────────── */
.dra__hero-grid {
    display: grid;
    grid-template-columns: 1fr 1.05fr;
    gap: 56px;
    align-items: center;
    margin-bottom: 56px;
}

.dra__console {
    background: linear-gradient(180deg, rgba(15, 29, 50, 0.96), rgba(10, 22, 40, 0.98));
    border: 1px solid rgba(126, 233, 255, 0.22);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.45);
    position: relative;
}
.dra__console::before {
    content: '';
    position: absolute;
    top: -120px; right: -120px;
    width: 320px; height: 320px;
    background: radial-gradient(circle, rgba(0, 97, 255, 0.30), transparent 65%);
    filter: blur(40px);
    pointer-events: none;
}
.dra__console-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 22px 14px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    position: relative;
    z-index: 1;
}
.dra__console-title {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.16em;
    color: var(--esds-gray-300);
    text-transform: uppercase;
    margin: 0;
}
.dra__console-title strong { color: var(--highlight-blue-light); font-weight: 800; }
.dra__console-armed {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: rgba(74, 222, 128, 0.12);
    border: 1px solid rgba(74, 222, 128, 0.30);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: #4ade80;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}
.dra__console-armed::before {
    content: '';
    width: 6px; height: 6px;
    border-radius: 50%;
    background: #4ade80;
    animation: dra-pulse 1.6s ease-in-out infinite;
}
@keyframes dra-pulse {
    0%, 100% { opacity: 0.45; transform: scale(0.85); }
    50%      { opacity: 1;    transform: scale(1.15); }
}

.dra__readiness {
    padding: 12px 22px;
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}
.dra__readiness-cell {
    padding: 12px 14px;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 8px;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    align-items: center;
}
.dra__readiness-meta {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}
.dra__readiness-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 16px;
    font-weight: 800;
    color: var(--highlight-blue-light);
    letter-spacing: -0.4px;
    line-height: 1;
}
.dra__readiness-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9px;
    color: var(--esds-gray-400);
    line-height: 1.3;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.dra__readiness-tick {
    width: 22px; height: 22px;
    border-radius: 50%;
    background: rgba(74, 222, 128, 0.14);
    border: 1px solid rgba(74, 222, 128, 0.30);
    color: #4ade80;
    display: grid;
    place-items: center;
    font-size: 11px;
    font-weight: 800;
    flex-shrink: 0;
}

.dra__console-activity {
    margin: 14px 22px 0;
    padding: 11px 14px;
    background: rgba(0, 97, 255, 0.08);
    border: 1px solid rgba(0, 97, 255, 0.25);
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    color: var(--highlight-blue-light);
    letter-spacing: 0.04em;
    position: relative;
    z-index: 1;
}
.dra__console-activity-icon {
    width: 20px; height: 20px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 11px;
    font-weight: 800;
    flex-shrink: 0;
    animation: dra-spin 4s linear infinite;
}
@keyframes dra-spin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}
.dra__console-activity-text { transition: opacity 0.3s ease; }

.dra__console-foot {
    padding: 12px 22px;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    margin-top: 14px;
    background: rgba(0, 0, 0, 0.25);
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: #4ade80;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    text-align: center;
    position: relative;
    z-index: 1;
}
.dra__console-foot small {
    display: block;
    color: var(--esds-gray-400);
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.10em;
    margin-top: 4px;
}

@media (max-width: 992px) {
    .dra__hero-grid { grid-template-columns: 1fr; gap: 36px; }
    .dra__console { max-width: 540px; margin: 0 auto; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §B · DR TIERS — 3 tier columns with side-by-side RPO/RTO strips
   ─────────────────────────────────────────────────────────────────────────── */
.dra__tiers-lede {
    text-align: center;
    margin-bottom: 36px;
    max-width: 920px;
    margin-left: auto;
    margin-right: auto;
    font-size: 15.5px;
    color: var(--esds-gray-700);
    line-height: 1.65;
}
.dra__tiers-lede strong { color: var(--esds-navy); font-weight: 700; }
.dra__tiers-lede em {
    font-style: normal;
    color: var(--highlight-blue);
    font-weight: 700;
}

.dra__tiers {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}
.dra__tier {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 18px;
    overflow: hidden;
    position: relative;
    display: flex;
    flex-direction: column;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease);
}
.dra__tier:hover {
    transform: translateY(-6px);
    box-shadow: 0 26px 60px rgba(0, 97, 255, 0.14);
}
.dra__tier--popular {
    border: 2px solid var(--india-saffron);
    box-shadow: 0 22px 50px rgba(255, 153, 51, 0.16);
}
.dra__tier-popular-ribbon {
    position: absolute;
    top: 0; right: 18px;
    padding: 5px 14px;
    background: linear-gradient(135deg, var(--india-saffron), #ffb84d);
    color: #fff;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    border-radius: 0 0 6px 6px;
    box-shadow: 0 4px 10px rgba(255, 153, 51, 0.30);
}
.dra__tier-head {
    padding: 24px 28px 20px;
    border-bottom: 1px solid var(--esds-gray-100);
}
.dra__tier--hot .dra__tier-head {
    background: linear-gradient(135deg, rgba(220, 38, 38, 0.04), rgba(248, 113, 113, 0.02));
    border-bottom-color: rgba(220, 38, 38, 0.15);
}
.dra__tier--warm .dra__tier-head {
    background: linear-gradient(135deg, rgba(255, 153, 51, 0.04), rgba(255, 184, 77, 0.02));
    border-bottom-color: rgba(255, 153, 51, 0.18);
}
.dra__tier--cold .dra__tier-head {
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.04), rgba(126, 233, 255, 0.02));
    border-bottom-color: rgba(0, 97, 255, 0.15);
}
.dra__tier-temp {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 12px;
    border: 1px solid;
}
.dra__tier--hot  .dra__tier-temp { background: rgba(220, 38, 38, 0.08); border-color: rgba(220, 38, 38, 0.30); color: #dc2626; }
.dra__tier--warm .dra__tier-temp { background: rgba(255, 153, 51, 0.10); border-color: rgba(255, 153, 51, 0.35); color: #b45309; }
.dra__tier--cold .dra__tier-temp { background: rgba(0, 97, 255, 0.08);  border-color: rgba(0, 97, 255, 0.25);  color: var(--highlight-blue); }
.dra__tier-temp-dot {
    width: 7px; height: 7px;
    border-radius: 50%;
}
.dra__tier--hot  .dra__tier-temp-dot { background: #dc2626; }
.dra__tier--warm .dra__tier-temp-dot { background: var(--india-saffron); }
.dra__tier--cold .dra__tier-temp-dot { background: var(--highlight-blue); }
.dra__tier-name {
    font-size: 22px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.5px;
    margin: 0 0 6px;
    line-height: 1.2;
}
.dra__tier-tag {
    font-size: 12.5px;
    color: var(--esds-gray-600);
    font-weight: 600;
    line-height: 1.4;
    margin: 0;
}
.dra__tier-tag strong { color: var(--esds-navy); font-weight: 800; }
.dra__tier-rpo-rto {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border-bottom: 1px solid var(--esds-gray-100);
}
.dra__tier-metric {
    padding: 16px 20px;
    text-align: center;
    border-right: 1px solid var(--esds-gray-100);
}
.dra__tier-metric:last-child { border-right: 0; }
.dra__tier-metric-key {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: var(--esds-gray-500);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 6px;
}
.dra__tier-metric-val {
    font-size: 14.5px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    line-height: 1.25;
}
.dra__tier--hot  .dra__tier-metric-val { color: #dc2626; }
.dra__tier--warm .dra__tier-metric-val { color: #b45309; }
.dra__tier--cold .dra__tier-metric-val { color: var(--highlight-blue); }
.dra__tier-feats {
    padding: 18px 28px 14px;
    list-style: none;
    margin: 0;
    flex-grow: 1;
}
.dra__tier-feat {
    padding: 8px 0 8px 24px;
    font-size: 13px;
    color: var(--esds-gray-700);
    line-height: 1.5;
    position: relative;
    border-bottom: 1px dashed var(--esds-gray-100);
}
.dra__tier-feat:last-child { border-bottom: 0; }
.dra__tier-feat::before {
    content: '✓';
    position: absolute;
    left: 0; top: 9px;
    width: 16px; height: 16px;
    background: rgba(0, 97, 255, 0.10);
    color: var(--highlight-blue);
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 10px;
    font-weight: 800;
}
.dra__tier-for {
    margin: 0 28px 22px;
    padding: 10px 14px;
    background: var(--esds-gray-50);
    border: 1px solid var(--esds-gray-100);
    border-radius: 8px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--esds-gray-600);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    text-align: center;
}
.dra__tier-for strong { color: var(--esds-navy); font-weight: 800; }

@media (max-width: 992px) { .dra__tiers { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §C · SPECIALIZED DR — 4 workload cards in 2×2 with bullet sub-lists
   ─────────────────────────────────────────────────────────────────────────── */
.dra__spec-lede {
    text-align: center;
    margin-bottom: 36px;
    max-width: 920px;
    margin-left: auto;
    margin-right: auto;
    font-size: 15.5px;
    color: var(--esds-gray-700);
    line-height: 1.65;
}
.dra__spec-lede strong { color: var(--esds-navy); font-weight: 700; }
.dra__spec-lede em {
    font-style: normal;
    color: var(--highlight-blue);
    font-weight: 700;
}

.dra__spec {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
}
.dra__spec-card {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 16px;
    padding: 28px 30px 24px;
    position: relative;
    overflow: hidden;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.dra__spec-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 4px; height: 100%;
    background: linear-gradient(180deg, var(--highlight-blue), var(--highlight-blue-light));
    transform: scaleY(0.30);
    transform-origin: top;
    transition: transform 0.4s var(--esds-ease);
}
.dra__spec-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 22px 50px rgba(0, 97, 255, 0.12);
    border-color: rgba(0, 97, 255, 0.25);
}
.dra__spec-card:hover::before { transform: scaleY(1); }

.dra__spec-head {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 12px;
}
.dra__spec-icon {
    width: 48px; height: 48px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.12), rgba(126, 233, 255, 0.04));
    border: 1px solid rgba(0, 97, 255, 0.22);
    color: var(--highlight-blue);
    display: grid;
    place-items: center;
    flex-shrink: 0;
}
.dra__spec-icon svg { width: 24px; height: 24px; }
.dra__spec-name {
    font-size: 18px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.4px;
    margin: 0;
    line-height: 1.25;
}
.dra__spec-stat {
    display: inline-block;
    padding: 4px 10px;
    background: rgba(0, 97, 255, 0.06);
    border-radius: 4px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.10em;
    text-transform: uppercase;
    margin-bottom: 10px;
}
.dra__spec-text {
    font-size: 13.5px;
    color: var(--esds-gray-600);
    line-height: 1.65;
    margin: 0 0 14px;
}
.dra__spec-text strong { color: var(--esds-navy); font-weight: 700; }
.dra__spec-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.dra__spec-list li {
    padding: 6px 0 6px 24px;
    font-size: 12.5px;
    color: var(--esds-gray-700);
    line-height: 1.5;
    position: relative;
    border-bottom: 1px dashed var(--esds-gray-100);
}
.dra__spec-list li:last-child { border-bottom: 0; }
.dra__spec-list li::before {
    content: '✓';
    position: absolute;
    left: 0; top: 6px;
    color: var(--highlight-blue);
    font-size: 12px;
    font-weight: 800;
}

@media (max-width: 768px) { .dra__spec { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §D · DR GEOGRAPHY — 4 city tiles + DR pair connectors
   ─────────────────────────────────────────────────────────────────────────── */
.dra__geo-lede {
    text-align: center;
    margin-bottom: 36px;
    max-width: 920px;
    margin-left: auto;
    margin-right: auto;
    font-size: 15px;
    color: var(--esds-gray-300);
    line-height: 1.65;
}
.dra__geo-lede strong { color: #fff; font-weight: 700; }
.dra__geo-lede em {
    font-style: normal;
    color: var(--highlight-blue-light);
    font-weight: 700;
}

.dra__cities {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 36px;
}
.dra__city {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(126, 233, 255, 0.20);
    border-radius: 14px;
    padding: 24px 22px 20px;
    text-align: center;
    position: relative;
    transition: transform 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease), background 0.3s var(--esds-ease);
}
.dra__city:hover {
    transform: translateY(-5px);
    border-color: rgba(126, 233, 255, 0.45);
    background: rgba(0, 97, 255, 0.04);
}
.dra__city-pin {
    width: 36px; height: 36px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.20), rgba(126, 233, 255, 0.06));
    border: 1px solid rgba(126, 233, 255, 0.30);
    color: var(--highlight-blue-light);
    display: grid;
    place-items: center;
    margin: 0 auto 12px;
    position: relative;
}
.dra__city-pin::after {
    content: '';
    position: absolute;
    top: -3px; left: -3px;
    right: -3px; bottom: -3px;
    border-radius: 50%;
    border: 1px solid rgba(126, 233, 255, 0.20);
    animation: dra-ping 2.4s ease-in-out infinite;
}
@keyframes dra-ping {
    0%   { transform: scale(1);    opacity: 0.6; }
    100% { transform: scale(1.45); opacity: 0; }
}
.dra__city-pin svg { width: 18px; height: 18px; }
.dra__city-name {
    font-size: 17px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.4px;
    margin: 0 0 4px;
    line-height: 1.2;
}
.dra__city-meta {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 700;
    color: var(--esds-gray-400);
    letter-spacing: 0.10em;
    text-transform: uppercase;
    line-height: 1.4;
    margin: 0;
}

@media (max-width: 768px) { .dra__cities { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .dra__cities { grid-template-columns: 1fr; } }

.dra__pairs-eyebrow {
    text-align: center;
    margin-bottom: 18px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.18em;
    text-transform: uppercase;
}
.dra__pairs {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-bottom: 28px;
}
.dra__pair {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    padding: 16px 20px;
}
.dra__pair-route {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 12.5px;
    font-weight: 800;
    color: #fff;
    letter-spacing: 0.04em;
}
.dra__pair-route span {
    padding: 2px 8px;
    background: rgba(0, 97, 255, 0.12);
    border: 1px solid rgba(126, 233, 255, 0.25);
    border-radius: 4px;
    color: var(--highlight-blue-light);
}
.dra__pair-arrow {
    color: var(--india-saffron);
    font-size: 14px;
    font-weight: 800;
}
.dra__pair-text {
    font-size: 12px;
    color: var(--esds-gray-300);
    line-height: 1.5;
    margin: 0;
}

@media (max-width: 992px) { .dra__pairs { grid-template-columns: 1fr; } }

.dra__geo-foot {
    padding: 18px 26px;
    background: rgba(0, 0, 0, 0.30);
    border: 1px dashed rgba(255, 255, 255, 0.10);
    border-radius: 12px;
    text-align: center;
    font-size: 13px;
    color: var(--esds-gray-300);
    line-height: 1.6;
}
.dra__geo-foot strong { color: #fff; font-weight: 700; }
.dra__geo-foot em {
    font-style: italic;
    color: var(--india-saffron);
}


/* ───────────────────────────────────────────────────────────────────────────
   §E · DR ACCOUNTABILITY — 4 commitments + closing credo
   ─────────────────────────────────────────────────────────────────────────── */
.dra__acc-lede {
    text-align: center;
    margin-bottom: 36px;
    max-width: 920px;
    margin-left: auto;
    margin-right: auto;
    font-size: 16px;
    color: var(--esds-gray-700);
    line-height: 1.6;
    font-weight: 600;
}
.dra__acc-lede strong { color: var(--esds-navy); font-weight: 800; }
.dra__acc-lede em {
    font-style: normal;
    color: var(--highlight-blue);
    font-weight: 800;
}

.dra__commits {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    margin-bottom: 32px;
}
.dra__commit {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 16px;
    padding: 26px 30px 24px;
    display: grid;
    grid-template-columns: 56px 1fr;
    gap: 20px;
    align-items: start;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.dra__commit:hover {
    transform: translateY(-4px);
    box-shadow: 0 22px 50px rgba(0, 97, 255, 0.10);
    border-color: rgba(0, 97, 255, 0.20);
}
.dra__commit-num {
    width: 56px; height: 56px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    display: grid;
    place-items: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 18px;
    font-weight: 800;
    letter-spacing: -0.5px;
    box-shadow: 0 6px 16px rgba(0, 97, 255, 0.30);
}
.dra__commit-name {
    font-size: 16px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    margin: 0 0 8px;
    line-height: 1.3;
}
.dra__commit-text {
    font-size: 13px;
    color: var(--esds-gray-600);
    line-height: 1.65;
    margin: 0;
}
.dra__commit-text strong { color: var(--esds-navy); font-weight: 700; }
.dra__commit-text em {
    font-style: normal;
    color: var(--highlight-blue);
    font-weight: 700;
}

@media (max-width: 768px) { .dra__commits { grid-template-columns: 1fr; } }

.dra__credo {
    max-width: 980px;
    margin: 0 auto;
    padding: 28px 36px;
    background: linear-gradient(135deg, var(--esds-navy), var(--esds-deep));
    border-radius: 14px;
    color: #fff;
    text-align: center;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.55;
    letter-spacing: -0.3px;
    position: relative;
    overflow: hidden;
}
.dra__credo::after {
    content: '';
    position: absolute;
    top: -60px; right: -60px;
    width: 220px; height: 220px;
    background: radial-gradient(circle, rgba(0, 97, 255, 0.30), transparent 65%);
    filter: blur(34px);
}
.dra__credo strong {
    background: linear-gradient(135deg, var(--highlight-blue-light), #fff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}


/* ───────────────────────────────────────────────────────────────────────────
   §F · RANSOMWARE RECOVERY — 5-step playbook timeline
   ─────────────────────────────────────────────────────────────────────────── */
.dra__rw-block {
    max-width: 980px;
    margin: 0 auto 36px;
    padding: 24px 32px;
    background: linear-gradient(135deg, rgba(220, 38, 38, 0.04), rgba(248, 113, 113, 0.02));
    border: 1px solid rgba(220, 38, 38, 0.18);
    border-left: 4px solid #dc2626;
    border-radius: 12px;
    font-size: 15px;
    color: var(--esds-gray-700);
    line-height: 1.65;
}
.dra__rw-block p { margin: 0 0 10px; }
.dra__rw-block p:last-child { margin-bottom: 0; }
.dra__rw-block strong { color: var(--esds-navy); font-weight: 700; }
.dra__rw-block em {
    font-style: normal;
    color: #b91c1c;
    font-weight: 700;
}

.dra__rw-eyebrow {
    text-align: center;
    margin-bottom: 24px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.18em;
    text-transform: uppercase;
}
.dra__rw-eyebrow strong { color: var(--highlight-blue); font-weight: 800; }

.dra__rw {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 28px;
    position: relative;
}
.dra__rw-step {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 22px 18px 20px;
    text-align: center;
    position: relative;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease);
}
.dra__rw-step:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 38px rgba(0, 97, 255, 0.12);
}
.dra__rw-step::after {
    content: '';
    position: absolute;
    top: 50%; right: -10px;
    transform: translateY(-50%);
    width: 0; height: 0;
    border-left: 9px solid;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    z-index: 2;
}
/* gradient red→green across steps */
.dra__rw-step:nth-child(1)::after { border-left-color: #dc2626; }
.dra__rw-step:nth-child(2)::after { border-left-color: #f97316; }
.dra__rw-step:nth-child(3)::after { border-left-color: var(--india-saffron); }
.dra__rw-step:nth-child(4)::after { border-left-color: var(--highlight-blue); }
.dra__rw-step:last-child::after { display: none; }
.dra__rw-num {
    width: 36px; height: 36px;
    border-radius: 50%;
    color: #fff;
    display: grid;
    place-items: center;
    margin: 0 auto 10px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    font-weight: 800;
}
.dra__rw-step:nth-child(1) .dra__rw-num { background: linear-gradient(135deg, #dc2626, #f97316); }
.dra__rw-step:nth-child(2) .dra__rw-num { background: linear-gradient(135deg, #f97316, var(--india-saffron)); }
.dra__rw-step:nth-child(3) .dra__rw-num { background: linear-gradient(135deg, var(--india-saffron), #fcd34d); }
.dra__rw-step:nth-child(4) .dra__rw-num { background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light)); }
.dra__rw-step:nth-child(5) .dra__rw-num { background: linear-gradient(135deg, #4ade80, #22c55e); }
.dra__rw-name {
    font-size: 13px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.2px;
    line-height: 1.3;
    margin: 0 0 6px;
}
.dra__rw-text {
    font-size: 11.5px;
    color: var(--esds-gray-600);
    line-height: 1.5;
    margin: 0;
}

@media (max-width: 1100px) {
    .dra__rw { grid-template-columns: repeat(2, 1fr); }
    .dra__rw-step::after { display: none; }
}
@media (max-width: 480px) { .dra__rw { grid-template-columns: 1fr; } }

.dra__rw-foot {
    max-width: 980px;
    margin: 0 auto;
    padding: 22px 32px;
    background: linear-gradient(135deg, var(--esds-navy), var(--esds-deep));
    border-radius: 12px;
    color: #fff;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.6;
    letter-spacing: -0.2px;
    position: relative;
    overflow: hidden;
}
.dra__rw-foot::after {
    content: '';
    position: absolute;
    top: -60px; right: -60px;
    width: 200px; height: 200px;
    background: radial-gradient(circle, rgba(74, 222, 128, 0.20), transparent 65%);
    filter: blur(30px);
}
.dra__rw-foot strong {
    color: #4ade80;
    font-weight: 800;
}


/* ───────────────────────────────────────────────────────────────────────────
   §H · CLOSING CTA — 4 ✓-trust extras
   ─────────────────────────────────────────────────────────────────────────── */
.dra__cta-trust-strip {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-top: 32px;
    padding: 18px 22px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(126, 233, 255, 0.20);
    border-radius: 12px;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.dra__cta-trust-cell {
    display: flex;
    align-items: center;
    gap: 10px;
    text-align: left;
    border-right: 1px solid rgba(255, 255, 255, 0.06);
    padding-right: 14px;
}
.dra__cta-trust-cell:last-child { border-right: 0; }
.dra__cta-trust-tick {
    width: 26px; height: 26px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 14px;
    font-weight: 800;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(0, 97, 255, 0.40);
}
.dra__cta-trust-text {
    font-size: 12.5px;
    font-weight: 600;
    color: #fff;
    line-height: 1.3;
    letter-spacing: -0.2px;
}

@media (max-width: 768px) {
    .dra__cta-trust-strip { grid-template-columns: repeat(2, 1fr); }
    .dra__cta-trust-cell { border-right: 0; padding-right: 0; }
}



/* ═══════════════════════════════════════════════════════════════════════════
   WAF · ENLIGHT WAF — Page-specific styles (waf__ prefix)
   Common patterns (sec, inner-hero, faq-acc, page-cta, container, tokens,
   stat-card, breadcrumb) come from shared style.css.
   ═══════════════════════════════════════════════════════════════════════════ */


/* ───────────────────────────────────────────────────────────────────────────
   §A · HERO — "Live Traffic Inspection Console"
   ─────────────────────────────────────────────────────────────────────────── */
.waf__hero-grid {
    display: grid;
    grid-template-columns: 1fr 1.05fr;
    gap: 56px;
    align-items: center;
    margin-bottom: 56px;
}

.waf__hero-creds {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 22px;
}
.waf__hero-cred {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(126, 233, 255, 0.20);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--esds-gray-300);
    letter-spacing: 0.10em;
    text-transform: uppercase;
}
.waf__hero-cred::before {
    content: '✓';
    color: #4ade80;
    font-weight: 800;
    font-size: 11px;
}

/* Live Traffic Inspection Console */
.waf__inspector {
    background: linear-gradient(180deg, rgba(15, 29, 50, 0.96), rgba(10, 22, 40, 0.98));
    border: 1px solid rgba(126, 233, 255, 0.22);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.45);
    position: relative;
}
.waf__inspector::before {
    content: '';
    position: absolute;
    top: -120px; right: -120px;
    width: 320px; height: 320px;
    background: radial-gradient(circle, rgba(0, 97, 255, 0.30), transparent 65%);
    filter: blur(40px);
    pointer-events: none;
}
.waf__inspector-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 22px 14px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    position: relative;
    z-index: 1;
}
.waf__inspector-title {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.16em;
    color: var(--esds-gray-300);
    text-transform: uppercase;
    margin: 0;
}
.waf__inspector-title strong { color: var(--highlight-blue-light); font-weight: 800; }
.waf__inspector-flat {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: rgba(255, 153, 51, 0.10);
    border: 1px solid rgba(255, 153, 51, 0.30);
    border-radius: 4px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.14em;
    text-transform: uppercase;
}
.waf__inspector-flat::before { content: '◆'; font-size: 8px; }

.waf__requests {
    padding: 8px 22px 6px;
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.waf__request {
    display: grid;
    grid-template-columns: 50px 1fr auto;
    gap: 10px;
    align-items: center;
    padding: 9px 12px;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 8px;
}
.waf__request-method {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.06em;
    padding: 3px 6px;
    border-radius: 3px;
    text-align: center;
}
.waf__request-method--get  { color: #4ade80; background: rgba(74, 222, 128, 0.10); }
.waf__request-method--post { color: var(--highlight-blue-light); background: rgba(126, 233, 255, 0.10); }
.waf__request-method--put  { color: #fcd34d; background: rgba(245, 158, 11, 0.10); }
.waf__request-path {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    color: var(--esds-gray-300);
    letter-spacing: 0.02em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.waf__request-path strong { color: #fff; font-weight: 700; }
.waf__request-action {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 8px;
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.10em;
    text-transform: uppercase;
    border: 1px solid;
    flex-shrink: 0;
}
.waf__request-action--allow {
    background: rgba(74, 222, 128, 0.10);
    color: #4ade80;
    border-color: rgba(74, 222, 128, 0.30);
}
.waf__request-action--block {
    background: rgba(220, 38, 38, 0.10);
    color: #fca5a5;
    border-color: rgba(220, 38, 38, 0.30);
}
.waf__request-action--inspect {
    background: rgba(126, 233, 255, 0.10);
    color: var(--highlight-blue-light);
    border-color: rgba(126, 233, 255, 0.30);
}

.waf__inspector-activity {
    margin: 14px 22px 0;
    padding: 11px 14px;
    background: rgba(0, 97, 255, 0.08);
    border: 1px solid rgba(0, 97, 255, 0.25);
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    color: var(--highlight-blue-light);
    letter-spacing: 0.04em;
    position: relative;
    z-index: 1;
}
.waf__inspector-activity-icon {
    width: 20px; height: 20px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 11px;
    font-weight: 800;
    flex-shrink: 0;
    animation: waf-spin 4s linear infinite;
}
@keyframes waf-spin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}
.waf__inspector-activity-text { transition: opacity 0.3s ease; }

.waf__inspector-foot {
    padding: 12px 22px;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    margin-top: 14px;
    background: rgba(0, 0, 0, 0.25);
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: #4ade80;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    text-align: center;
    position: relative;
    z-index: 1;
}
.waf__inspector-foot small {
    display: block;
    color: var(--esds-gray-400);
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.10em;
    margin-top: 4px;
}

@media (max-width: 992px) {
    .waf__hero-grid { grid-template-columns: 1fr; gap: 36px; }
    .waf__inspector { max-width: 540px; margin: 0 auto; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §B · THREAT STATEMENT
   ─────────────────────────────────────────────────────────────────────────── */
.waf__threat-block {
    max-width: 980px;
    margin: 0 auto;
    padding: 28px 36px;
    background: linear-gradient(135deg, rgba(220, 38, 38, 0.04), rgba(248, 113, 113, 0.02));
    border: 1px solid rgba(220, 38, 38, 0.18);
    border-left: 4px solid #dc2626;
    border-radius: 14px;
    font-size: 16px;
    color: var(--esds-gray-700);
    line-height: 1.7;
    margin-bottom: 18px;
}
.waf__threat-block p { margin: 0 0 12px; }
.waf__threat-block p:last-child { margin-bottom: 0; }
.waf__threat-block strong { color: var(--esds-navy); font-weight: 700; }
.waf__threat-block em {
    font-style: normal;
    color: #b91c1c;
    font-weight: 700;
}
.waf__behind-callout {
    max-width: 980px;
    margin: 0 auto;
    padding: 24px 32px;
    background: linear-gradient(135deg, var(--esds-navy), var(--esds-deep));
    border-radius: 14px;
    color: #fff;
    font-size: 16.5px;
    font-weight: 600;
    line-height: 1.55;
    letter-spacing: -0.2px;
    position: relative;
    overflow: hidden;
    text-align: center;
}
.waf__behind-callout::after {
    content: '';
    position: absolute;
    top: -60px; right: -60px;
    width: 220px; height: 220px;
    background: radial-gradient(circle, rgba(0, 97, 255, 0.30), transparent 65%);
    filter: blur(34px);
}
.waf__behind-callout strong {
    background: linear-gradient(135deg, var(--highlight-blue-light), #fff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}


/* ───────────────────────────────────────────────────────────────────────────
   §C · WHAT WAF DOES — 3 mini-statements + bidirectional inspection
   ─────────────────────────────────────────────────────────────────────────── */
.waf__three {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-bottom: 32px;
}
.waf__three-item {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 26px 24px 22px;
    text-align: center;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease);
}
.waf__three-item:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 38px rgba(0, 97, 255, 0.10);
    border-color: rgba(0, 97, 255, 0.20);
}
.waf__three-icon {
    width: 48px; height: 48px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.12), rgba(126, 233, 255, 0.04));
    border: 1px solid rgba(0, 97, 255, 0.22);
    color: var(--highlight-blue);
    display: grid;
    place-items: center;
    margin: 0 auto 14px;
}
.waf__three-icon svg { width: 24px; height: 24px; }
.waf__three-name {
    font-size: 16px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    margin: 0;
    line-height: 1.3;
}
.waf__three-name em {
    font-style: normal;
    color: var(--highlight-blue);
}

.waf__bidirectional {
    padding: 26px 32px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.06), rgba(126, 233, 255, 0.02));
    border: 1px solid rgba(0, 97, 255, 0.20);
    border-radius: 14px;
    font-size: 15px;
    color: var(--esds-gray-700);
    line-height: 1.7;
}
.waf__bidirectional p { margin: 0 0 10px; }
.waf__bidirectional p:last-child { margin-bottom: 0; }
.waf__bidirectional strong { color: var(--esds-navy); font-weight: 700; }
.waf__bidirectional em {
    font-style: normal;
    color: var(--highlight-blue);
    font-weight: 700;
}

@media (max-width: 768px) { .waf__three { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §D · 8 FEATURES — numbered cards with mono category tags + ↑ outcome
   ─────────────────────────────────────────────────────────────────────────── */
.waf__features-eyebrow {
    text-align: center;
    margin-bottom: 28px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.18em;
    text-transform: uppercase;
}
.waf__features-eyebrow strong { color: var(--india-saffron); font-weight: 800; }

.waf__features {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}
.waf__feature {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 16px;
    padding: 26px 28px 22px;
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: 56px 1fr;
    gap: 18px;
    align-items: start;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.waf__feature:hover {
    transform: translateY(-4px);
    box-shadow: 0 22px 50px rgba(0, 97, 255, 0.12);
    border-color: rgba(0, 97, 255, 0.25);
}
.waf__feature-num {
    width: 56px; height: 56px;
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.10), rgba(126, 233, 255, 0.04));
    border: 1px solid rgba(0, 97, 255, 0.22);
    color: var(--highlight-blue);
    display: grid;
    place-items: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 18px;
    font-weight: 800;
    letter-spacing: -0.5px;
}
.waf__feature-body {
    display: flex;
    flex-direction: column;
}
.waf__feature-name {
    font-size: 17px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.4px;
    margin: 0 0 6px;
    line-height: 1.25;
}
.waf__feature-tags {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 700;
    color: var(--esds-gray-500);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin: 0 0 14px;
    line-height: 1.6;
}
.waf__feature-text {
    font-size: 13px;
    color: var(--esds-gray-600);
    line-height: 1.65;
    margin: 0 0 14px;
}
.waf__feature-text strong { color: var(--esds-navy); font-weight: 700; }
.waf__feature-out {
    margin-top: auto;
    padding: 10px 14px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.06), rgba(126, 233, 255, 0.02));
    border-left: 3px solid var(--highlight-blue);
    border-radius: 0 8px 8px 0;
    font-size: 13px;
    color: var(--esds-navy);
    font-weight: 700;
    line-height: 1.5;
}
.waf__feature-out::before {
    content: '↑ ';
    color: var(--highlight-blue);
    font-family: 'JetBrains Mono', monospace;
    font-weight: 800;
}

@media (max-width: 992px) { .waf__features { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §E · OWASP TOP-10 — 10-item coverage table
   ─────────────────────────────────────────────────────────────────────────── */
.waf__owasp-lede {
    text-align: center;
    margin-bottom: 28px;
    max-width: 880px;
    margin-left: auto;
    margin-right: auto;
    font-size: 15px;
    color: var(--esds-gray-700);
    line-height: 1.65;
}
.waf__owasp-lede strong { color: var(--esds-navy); font-weight: 700; }
.waf__owasp-tagline {
    text-align: center;
    margin-bottom: 28px;
    padding: 18px 26px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.06), rgba(126, 233, 255, 0.02));
    border: 1px solid rgba(0, 97, 255, 0.20);
    border-radius: 12px;
    font-size: 15px;
    color: var(--esds-navy);
    font-weight: 700;
    line-height: 1.55;
    letter-spacing: -0.2px;
}
.waf__owasp-tagline strong {
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}

.waf__owasp {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 18px 44px rgba(10, 22, 40, 0.06);
}
.waf__owasp-row {
    display: grid;
    grid-template-columns: 70px 1.2fr 1.8fr;
    gap: 0;
    padding: 16px 22px;
    border-bottom: 1px solid var(--esds-gray-100);
    align-items: center;
    transition: background 0.25s;
}
.waf__owasp-row:last-child { border-bottom: 0; }
.waf__owasp-row:hover { background: rgba(0, 97, 255, 0.02); }
.waf__owasp-code {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 10px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.10), rgba(126, 233, 255, 0.04));
    border: 1px solid rgba(0, 97, 255, 0.22);
    border-radius: 4px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.10em;
    align-self: center;
    justify-self: start;
}
.waf__owasp-name {
    font-size: 14px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.2px;
    line-height: 1.3;
    margin: 0;
    padding: 0 18px;
    border-right: 1px solid var(--esds-gray-100);
}
.waf__owasp-text {
    font-size: 13px;
    color: var(--esds-gray-600);
    line-height: 1.55;
    margin: 0;
    padding-left: 22px;
    position: relative;
}
.waf__owasp-text::before {
    content: '✓';
    position: absolute;
    top: 1px; left: 0;
    color: var(--highlight-blue);
    font-size: 14px;
    font-weight: 800;
}
.waf__owasp-text strong { color: var(--esds-navy); font-weight: 700; }

@media (max-width: 768px) {
    .waf__owasp-row { grid-template-columns: 1fr; gap: 8px; padding: 18px 22px; }
    .waf__owasp-name { border-right: 0; padding: 0; }
    .waf__owasp-text { padding-left: 22px; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §F · SOVEREIGN PULL-QUOTE — "every rule, every log, every record"
   ─────────────────────────────────────────────────────────────────────────── */
.waf__sov-quote {
    max-width: 980px;
    margin: 0 auto;
    padding: 36px 48px;
    background: linear-gradient(135deg, var(--esds-navy), var(--esds-deep));
    border-radius: 18px;
    color: #fff;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.waf__sov-quote::before {
    content: '';
    position: absolute;
    top: -120px; left: 50%;
    transform: translateX(-50%);
    width: 480px; height: 320px;
    background: radial-gradient(ellipse, rgba(0, 97, 255, 0.30), transparent 65%);
    filter: blur(50px);
}
.waf__sov-quote-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 18px;
    padding: 5px 14px;
    background: rgba(255, 153, 51, 0.10);
    border: 1px solid rgba(255, 153, 51, 0.30);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    position: relative;
    z-index: 1;
}
.waf__sov-quote-eyebrow::before { content: '◆'; font-size: 8px; }
.waf__sov-quote-text {
    font-size: 22px;
    line-height: 1.5;
    color: #fff;
    font-weight: 600;
    letter-spacing: -0.4px;
    margin: 0;
    position: relative;
    z-index: 1;
}
.waf__sov-quote-text strong {
    background: linear-gradient(135deg, var(--highlight-blue-light), #fff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.waf__sov-quote-text em {
    font-style: italic;
    color: var(--highlight-blue-light);
}

@media (max-width: 768px) {
    .waf__sov-quote { padding: 28px 28px; }
    .waf__sov-quote-text { font-size: 17px; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §G · SOVEREIGN DIFFERENCE — 6 pillar cards with tricolor accent
   ─────────────────────────────────────────────────────────────────────────── */
.waf__sov-headline {
    text-align: center;
    margin-bottom: 36px;
    max-width: 880px;
    margin-left: auto;
    margin-right: auto;
}
.waf__sov-headline-q {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--esds-gray-500);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 12px;
}
.waf__sov-headline-h {
    font-size: 26px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.6px;
    line-height: 1.25;
    margin: 0;
}
.waf__sov-headline-h em {
    font-style: normal;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}

.waf__pillars {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}
.waf__pillar {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 26px 26px 22px;
    position: relative;
    overflow: hidden;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.waf__pillar::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 3px;
    background: linear-gradient(90deg,
        var(--india-saffron) 0%, var(--india-saffron) 33.33%,
        #ffffff 33.33%, #ffffff 66.66%,
        var(--india-green) 66.66%, var(--india-green) 100%);
    transform: scaleX(0.30);
    transform-origin: left;
    transition: transform 0.4s var(--esds-ease);
}
.waf__pillar:hover {
    transform: translateY(-5px);
    box-shadow: 0 22px 50px rgba(0, 97, 255, 0.12);
    border-color: rgba(0, 97, 255, 0.25);
}
.waf__pillar:hover::before { transform: scaleX(1); }
.waf__pillar-name {
    font-size: 15.5px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    margin: 0 0 10px;
    line-height: 1.3;
}
.waf__pillar-name em {
    font-style: normal;
    color: var(--highlight-blue);
    font-weight: 800;
}
.waf__pillar-text {
    font-size: 13px;
    color: var(--esds-gray-600);
    line-height: 1.65;
    margin: 0;
}
.waf__pillar-text strong { color: var(--esds-navy); font-weight: 700; }

@media (max-width: 992px) { .waf__pillars { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .waf__pillars { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §I · CLOSING CTA — trust extras strip
   ─────────────────────────────────────────────────────────────────────────── */
.waf__cta-trust-strip {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-top: 32px;
    padding: 18px 22px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(126, 233, 255, 0.20);
    border-radius: 12px;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.waf__cta-trust-cell {
    display: flex;
    align-items: center;
    gap: 10px;
    text-align: left;
    border-right: 1px solid rgba(255, 255, 255, 0.06);
    padding-right: 14px;
}
.waf__cta-trust-cell:last-child { border-right: 0; }
.waf__cta-trust-tick {
    width: 26px; height: 26px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 14px;
    font-weight: 800;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(0, 97, 255, 0.40);
}
.waf__cta-trust-text {
    font-size: 12.5px;
    font-weight: 600;
    color: #fff;
    line-height: 1.3;
    letter-spacing: -0.2px;
}

@media (max-width: 768px) {
    .waf__cta-trust-strip { grid-template-columns: repeat(2, 1fr); }
    .waf__cta-trust-cell { border-right: 0; padding-right: 0; }
}



/* ═══════════════════════════════════════════════════════════════════════════
   ENT · ENTERPRISE SOLUTIONS — Page-specific styles (ent__ prefix)
   Common patterns (sec, inner-hero, faq-acc, page-cta, container, tokens,
   stat-card, breadcrumb) come from shared style.css.
   ═══════════════════════════════════════════════════════════════════════════ */


/* ───────────────────────────────────────────────────────────────────────────
   §A · HERO — 6-layer "Full-Stack Owned" 3D-tilt visualization
   ─────────────────────────────────────────────────────────────────────────── */
.ent__hero-grid {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    gap: 56px;
    align-items: center;
    margin-bottom: 56px;
}
.ent__hero-industries {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 18px 0 0;
}
.ent__hero-ind {
    padding: 4px 12px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(126, 233, 255, 0.18);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--esds-gray-300);
    letter-spacing: 0.10em;
}

/* The 3D-tilt stack visualization */
.ent__stack {
    position: relative;
    perspective: 1400px;
    padding: 24px 0;
}
.ent__stack-inner {
    transform: rotateX(8deg) rotateY(-12deg);
    transform-style: preserve-3d;
    transition: transform 0.6s var(--esds-ease);
}
.ent__stack:hover .ent__stack-inner {
    transform: rotateX(4deg) rotateY(-6deg);
}
.ent__stack-eyebrow {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.18em;
    color: var(--highlight-blue-light);
    text-transform: uppercase;
    margin-bottom: 14px;
    text-align: right;
    padding-right: 12px;
}
.ent__stack-layer {
    background: linear-gradient(135deg, rgba(15, 29, 50, 0.95), rgba(10, 22, 40, 0.92));
    border: 1px solid rgba(126, 233, 255, 0.22);
    border-radius: 10px;
    padding: 14px 20px;
    margin-bottom: 6px;
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 14px;
    align-items: center;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.30);
    position: relative;
    transition: transform 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.ent__stack-layer::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 4px; height: 100%;
    background: linear-gradient(180deg, var(--highlight-blue), var(--highlight-blue-light));
    border-radius: 10px 0 0 10px;
}
.ent__stack-layer:hover {
    transform: translateZ(20px);
    border-color: var(--highlight-blue-light);
}
.ent__stack-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.10em;
    color: var(--esds-gray-400);
    background: rgba(255, 255, 255, 0.05);
    padding: 3px 8px;
    border-radius: 4px;
}
.ent__stack-name {
    font-size: 13.5px;
    font-weight: 700;
    color: #fff;
    letter-spacing: -0.2px;
}
.ent__stack-name small {
    display: block;
    font-size: 10.5px;
    font-weight: 500;
    color: var(--esds-gray-400);
    letter-spacing: 0.04em;
    margin-top: 2px;
    font-family: 'JetBrains Mono', monospace;
}
.ent__stack-owns {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: rgba(74, 222, 128, 0.12);
    border: 1px solid rgba(74, 222, 128, 0.30);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: #4ade80;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}
.ent__stack-owns::before {
    content: '✓';
    font-size: 11px;
}

/* Hyperscaler annotation */
.ent__stack-annot {
    position: relative;
    margin-top: 16px;
    padding: 10px 16px;
    background: rgba(220, 38, 38, 0.06);
    border: 1px dashed rgba(220, 38, 38, 0.30);
    border-radius: 8px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 700;
    color: #fca5a5;
    letter-spacing: 0.06em;
    text-align: center;
}
.ent__stack-annot::before { content: '{ '; opacity: 0.5; }
.ent__stack-annot::after  { content: ' }'; opacity: 0.5; }

@media (max-width: 992px) {
    .ent__hero-grid { grid-template-columns: 1fr; gap: 36px; }
    .ent__stack-inner { transform: none; }
    .ent__stack-eyebrow { text-align: left; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §B · PROBLEM — 3 cost-icon scenario cards + accountability band
   ─────────────────────────────────────────────────────────────────────────── */
.ent__problem-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin-bottom: 28px;
}
.ent__problem {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 16px;
    padding: 28px 26px 26px;
    position: relative;
    overflow: hidden;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease);
}
.ent__problem:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(220, 38, 38, 0.10);
}
.ent__problem-icon {
    width: 44px; height: 44px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, rgba(220, 38, 38, 0.10), rgba(248, 113, 113, 0.04));
    border: 1px solid rgba(220, 38, 38, 0.22);
    color: #dc2626;
    margin-bottom: 14px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 18px;
    font-weight: 800;
}
.ent__problem-tag {
    display: inline-flex;
    align-items: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.16em;
    color: #dc2626;
    text-transform: uppercase;
    margin-bottom: 8px;
    padding: 3px 8px;
    background: rgba(220, 38, 38, 0.06);
    border-radius: 4px;
}
.ent__problem-name {
    font-size: 18px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.4px;
    margin: 0 0 12px;
    line-height: 1.25;
}
.ent__problem-text {
    font-size: 14px;
    color: var(--esds-gray-600);
    line-height: 1.65;
    margin: 0;
}

.ent__accountability {
    margin-top: 22px;
    padding: 26px 32px;
    background: linear-gradient(135deg, var(--esds-navy), var(--esds-deep));
    border-radius: 16px;
    color: #fff;
    font-size: 17px;
    font-weight: 600;
    line-height: 1.55;
    letter-spacing: -0.2px;
    position: relative;
    overflow: hidden;
}
.ent__accountability::after {
    content: '';
    position: absolute;
    top: -60px; right: -60px;
    width: 220px; height: 220px;
    background: radial-gradient(circle, rgba(0, 97, 255, 0.30), transparent 65%);
    filter: blur(34px);
}
.ent__accountability strong {
    background: linear-gradient(135deg, var(--highlight-blue-light), #fff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.ent__accountability em {
    font-style: normal;
    color: var(--highlight-blue-light);
    font-weight: 700;
}

@media (max-width: 992px) {
    .ent__problem-grid { grid-template-columns: 1fr; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §C · SOLUTION FLOW — 4-node horizontal flow with stepped gradient
   ─────────────────────────────────────────────────────────────────────────── */
.ent__flow {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    align-items: stretch;
    position: relative;
}
.ent__flow-node {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 24px 22px 22px;
    position: relative;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
    display: flex;
    flex-direction: column;
}
.ent__flow-node:hover {
    transform: translateY(-5px);
    box-shadow: 0 18px 38px rgba(0, 97, 255, 0.14);
    border-color: rgba(0, 97, 255, 0.28);
}
.ent__flow-node::after {
    /* chevron between nodes */
    content: '';
    position: absolute;
    top: 50%;
    right: -16px;
    transform: translateY(-50%);
    width: 0; height: 0;
    border-left: 10px solid var(--highlight-blue);
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    z-index: 2;
    filter: drop-shadow(0 2px 4px rgba(0, 97, 255, 0.20));
}
.ent__flow-node:last-child::after { display: none; }
.ent__flow-stage {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 14px;
}
/* stepped colour gradient: red → orange → cyan → blue */
.ent__flow-node:nth-child(1) .ent__flow-stage { background: rgba(220, 38, 38, 0.10); color: #b91c1c; border: 1px solid rgba(220, 38, 38, 0.25); }
.ent__flow-node:nth-child(2) .ent__flow-stage { background: rgba(234, 88, 12, 0.10); color: #c2410c; border: 1px solid rgba(234, 88, 12, 0.25); }
.ent__flow-node:nth-child(3) .ent__flow-stage { background: rgba(126, 233, 255, 0.10); color: #0891b2; border: 1px solid rgba(126, 233, 255, 0.30); }
.ent__flow-node:nth-child(4) .ent__flow-stage { background: rgba(0, 97, 255, 0.10); color: var(--highlight-blue); border: 1px solid rgba(0, 97, 255, 0.30); }
.ent__flow-text {
    font-size: 14px;
    font-weight: 700;
    color: var(--esds-navy);
    line-height: 1.4;
    letter-spacing: -0.2px;
    margin: 0;
}
.ent__flow-text em {
    font-style: normal;
    color: var(--highlight-blue);
    font-weight: 800;
}

@media (max-width: 992px) {
    .ent__flow { grid-template-columns: repeat(2, 1fr); }
    .ent__flow-node:nth-child(2)::after { display: none; }
    .ent__flow-node::after { display: none; }
}
@media (max-width: 540px) {
    .ent__flow { grid-template-columns: 1fr; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §D · HOW IT WORKS — 4 step cards with deliverable pills
   ─────────────────────────────────────────────────────────────────────────── */
.ent__steps {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
}
.ent__step {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 16px;
    padding: 28px 26px 22px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.ent__step:hover {
    transform: translateY(-5px);
    box-shadow: 0 22px 46px rgba(10, 22, 40, 0.10);
    border-color: rgba(0, 97, 255, 0.25);
}
.ent__step-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 44px;
    font-weight: 800;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    line-height: 1;
    margin-bottom: 6px;
    letter-spacing: -2px;
}
.ent__step-eyebrow {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.14em;
    color: var(--esds-gray-500);
    text-transform: uppercase;
    margin-bottom: 14px;
}
.ent__step-name {
    font-size: 16px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    margin: 0 0 10px;
    line-height: 1.3;
}
.ent__step-text {
    font-size: 13px;
    color: var(--esds-gray-600);
    line-height: 1.6;
    margin: 0 0 16px;
    flex-grow: 1;
}
.ent__step-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: auto;
    padding: 6px 12px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.06), rgba(126, 233, 255, 0.03));
    border: 1px solid rgba(0, 97, 255, 0.18);
    border-radius: 8px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--highlight-blue);
    letter-spacing: 0.06em;
    align-self: flex-start;
}
.ent__step-pill::before { content: '▸ '; opacity: 0.55; }

@media (max-width: 992px) { .ent__steps { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .ent__steps { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §E · CAPABILITIES — 6 cards each with 3-keyword tag bar
   ─────────────────────────────────────────────────────────────────────────── */
.ent__caps {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}
.ent__cap {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 16px;
    padding: 30px 28px 0;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.ent__cap:hover {
    transform: translateY(-5px);
    box-shadow: 0 22px 50px rgba(10, 22, 40, 0.10);
    border-color: rgba(0, 97, 255, 0.25);
}
.ent__cap-icon {
    width: 56px; height: 56px;
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.12), rgba(126, 233, 255, 0.06));
    border: 1px solid rgba(0, 97, 255, 0.20);
    display: grid;
    place-items: center;
    color: var(--highlight-blue);
    margin-bottom: 18px;
    transition: transform 0.3s var(--esds-ease);
}
.ent__cap:hover .ent__cap-icon { transform: rotate(-6deg) scale(1.05); }
.ent__cap-icon svg { width: 28px; height: 28px; }
.ent__cap-name {
    font-size: 17px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    margin: 0 0 4px;
    line-height: 1.3;
}
.ent__cap-tagline {
    font-size: 13px;
    color: var(--highlight-blue);
    font-weight: 700;
    letter-spacing: -0.2px;
    margin: 0 0 12px;
    font-style: italic;
}
.ent__cap-text {
    font-size: 13px;
    color: var(--esds-gray-600);
    line-height: 1.65;
    margin: 0 0 18px;
    flex-grow: 1;
}
.ent__cap-text strong { color: var(--esds-navy); font-weight: 700; }
.ent__cap-keys {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 14px 0;
    border-top: 1px solid var(--esds-gray-100);
    margin-top: auto;
}
.ent__cap-key {
    padding: 4px 10px;
    background: var(--esds-gray-50);
    border: 1px solid var(--esds-gray-100);
    border-radius: 6px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 700;
    color: var(--esds-gray-700);
    letter-spacing: 0.04em;
    transition: background 0.25s, border-color 0.25s, color 0.25s;
}
.ent__cap:hover .ent__cap-key {
    background: rgba(0, 97, 255, 0.06);
    border-color: rgba(0, 97, 255, 0.20);
    color: var(--highlight-blue);
}

@media (max-width: 1100px) { .ent__caps { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px)  { .ent__caps { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §F · INDUSTRY FIT — 4×2 industry tile grid (8 industries)
   ─────────────────────────────────────────────────────────────────────────── */
.ent__industries-intro {
    margin-bottom: 28px;
    text-align: center;
    max-width: 880px;
    margin-left: auto;
    margin-right: auto;
    font-size: 15.5px;
    line-height: 1.65;
    color: var(--esds-gray-600);
}
.ent__industries {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
.ent__ind {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 22px 20px 20px;
    position: relative;
    overflow: hidden;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
    display: flex;
    flex-direction: column;
}
.ent__ind::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 3px;
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
    transform: scaleX(0.25);
    transform-origin: left;
    transition: transform 0.4s var(--esds-ease);
}
.ent__ind:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 38px rgba(0, 97, 255, 0.10);
    border-color: rgba(0, 97, 255, 0.20);
}
.ent__ind:hover::before { transform: scaleX(1); }
.ent__ind-icon {
    width: 40px; height: 40px;
    border-radius: 10px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.10), rgba(126, 233, 255, 0.04));
    display: grid;
    place-items: center;
    color: var(--highlight-blue);
    margin-bottom: 12px;
}
.ent__ind-icon svg { width: 22px; height: 22px; }
.ent__ind-name {
    font-size: 15px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    margin: 0 0 6px;
    line-height: 1.3;
}
.ent__ind-text {
    font-size: 12.5px;
    color: var(--esds-gray-600);
    line-height: 1.6;
    margin: 0 0 14px;
    flex-grow: 1;
}
.ent__ind-text strong { color: var(--esds-navy); font-weight: 700; }
.ent__ind-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}
.ent__ind-tag {
    padding: 3px 8px;
    background: rgba(0, 97, 255, 0.06);
    border-radius: 4px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 700;
    color: var(--highlight-blue);
    letter-spacing: 0.04em;
}

@media (max-width: 1100px) { .ent__industries { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px)  { .ent__industries { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §G · TRUST — Compliance badge marquee + 5 guarantees + CTA
   ─────────────────────────────────────────────────────────────────────────── */
.ent__marquee {
    overflow: hidden;
    margin: 0 -32px 36px;
    padding: 16px 0;
    background: rgba(0, 97, 255, 0.04);
    border-top: 1px solid rgba(126, 233, 255, 0.18);
    border-bottom: 1px solid rgba(126, 233, 255, 0.18);
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 8%, #000 92%, transparent 100%);
            mask-image: linear-gradient(90deg, transparent 0%, #000 8%, #000 92%, transparent 100%);
}
.ent__marquee-track {
    display: flex;
    gap: 14px;
    animation: ent-marquee 36s linear infinite;
    width: max-content;
}
.ent__marquee:hover .ent__marquee-track { animation-play-state: paused; }
@keyframes ent-marquee {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}
.ent__marquee-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 18px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(126, 233, 255, 0.22);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    font-weight: 700;
    color: #fff;
    letter-spacing: 0.08em;
    flex-shrink: 0;
}
.ent__marquee-pill::before {
    content: '✓';
    width: 16px; height: 16px;
    background: rgba(74, 222, 128, 0.18);
    color: #4ade80;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 10px;
    font-weight: 800;
}

.ent__guarantees {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 28px;
}
.ent__guarantee {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    padding: 18px 18px;
    text-align: center;
    transition: border-color 0.3s, background 0.3s;
}
.ent__guarantee:hover {
    border-color: rgba(126, 233, 255, 0.40);
    background: rgba(0, 97, 255, 0.06);
}
.ent__guarantee-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 22px;
    font-weight: 800;
    color: var(--highlight-blue-light);
    letter-spacing: -0.6px;
    line-height: 1;
    margin-bottom: 8px;
}
.ent__guarantee-label {
    font-size: 11.5px;
    color: var(--esds-gray-300);
    line-height: 1.45;
    font-weight: 600;
}

.ent__trust-cta {
    padding: 22px 28px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.14), rgba(126, 233, 255, 0.06));
    border: 1px solid rgba(126, 233, 255, 0.25);
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
}
.ent__trust-cta-text {
    font-size: 16px;
    font-weight: 700;
    color: #fff;
    margin: 0;
}
.ent__trust-cta-text small {
    display: block;
    font-size: 12.5px;
    font-weight: 500;
    color: var(--esds-gray-400);
    margin-top: 4px;
}

@media (max-width: 1100px) { .ent__guarantees { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 540px)  { .ent__guarantees { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §H · PROOF — 4 mega-stats row + 5 client outcome cards
   ─────────────────────────────────────────────────────────────────────────── */
.ent__proof-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 28px;
    padding: 26px 30px;
    background: linear-gradient(135deg, var(--esds-navy), var(--esds-deep));
    border-radius: 18px;
    color: #fff;
    position: relative;
    overflow: hidden;
}
.ent__proof-stats::before {
    content: '';
    position: absolute;
    top: -120px; right: -120px;
    width: 320px; height: 320px;
    background: radial-gradient(circle, rgba(0, 97, 255, 0.30), transparent 65%);
    filter: blur(40px);
}
.ent__proof-stat {
    text-align: center;
    border-right: 1px solid rgba(255, 255, 255, 0.08);
    padding: 6px 8px;
    position: relative;
    z-index: 1;
}
.ent__proof-stat:last-child { border-right: 0; }
.ent__proof-stat-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 30px;
    font-weight: 800;
    background: linear-gradient(135deg, var(--highlight-blue-light), #fff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    letter-spacing: -1px;
    line-height: 1;
    margin-bottom: 8px;
}
.ent__proof-stat-label {
    font-size: 12px;
    color: var(--esds-gray-300);
    line-height: 1.4;
    font-weight: 600;
}

.ent__clients {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 14px;
}
.ent__client {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 24px 22px 22px;
    position: relative;
    overflow: hidden;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease);
    display: flex;
    flex-direction: column;
}
.ent__client::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 4px; height: 100%;
    background: linear-gradient(180deg, var(--highlight-blue), var(--highlight-blue-light));
}
.ent__client:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 38px rgba(10, 22, 40, 0.10);
}
.ent__client-tag {
    display: inline-flex;
    align-items: center;
    padding: 3px 9px;
    background: var(--esds-gray-50);
    border-radius: 4px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 700;
    color: var(--esds-gray-600);
    letter-spacing: 0.10em;
    text-transform: uppercase;
    margin-bottom: 10px;
    align-self: flex-start;
}
.ent__client-name {
    font-size: 16px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.4px;
    margin: 0 0 8px;
    line-height: 1.25;
}
.ent__client-headline {
    font-size: 14px;
    font-weight: 700;
    color: var(--highlight-blue);
    margin: 0 0 8px;
    line-height: 1.35;
}
.ent__client-text {
    font-size: 12.5px;
    color: var(--esds-gray-600);
    line-height: 1.55;
    margin: 0;
    flex-grow: 1;
}

@media (max-width: 1100px) { .ent__proof-stats { grid-template-columns: repeat(2, 1fr); } .ent__proof-stat:nth-child(2) { border-right: 0; } }
@media (max-width: 1100px) { .ent__clients { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .ent__proof-stats { grid-template-columns: 1fr; } .ent__proof-stat { border-right: 0; border-bottom: 1px solid rgba(255,255,255,0.08); padding-bottom: 14px; } .ent__proof-stat:last-child { border-bottom: 0; } }
@media (max-width: 540px) { .ent__clients { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §I · COMPETITIVE CLARITY — 4 horizontal risk rows
   ─────────────────────────────────────────────────────────────────────────── */
.ent__risks {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 18px;
    overflow: hidden;
    margin-bottom: 28px;
    box-shadow: 0 18px 44px rgba(10, 22, 40, 0.06);
}
.ent__risk {
    display: grid;
    grid-template-columns: 220px 1fr 1.1fr;
    gap: 0;
    padding: 24px 28px;
    border-bottom: 1px solid var(--esds-gray-100);
    align-items: center;
    transition: background 0.25s;
}
.ent__risk:last-child { border-bottom: 0; }
.ent__risk:hover { background: rgba(0, 97, 255, 0.025); }
.ent__risk-name {
    font-size: 17px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.4px;
    line-height: 1.3;
    padding-right: 16px;
    border-right: 1px solid var(--esds-gray-100);
    margin: 0;
}
.ent__risk-name small {
    display: block;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: 0.18em;
    color: #dc2626;
    text-transform: uppercase;
    margin-bottom: 4px;
}
.ent__risk-foreign {
    padding: 0 22px;
    font-size: 13.5px;
    color: var(--esds-gray-600);
    line-height: 1.55;
    border-right: 1px solid var(--esds-gray-100);
    position: relative;
}
.ent__risk-foreign::before {
    content: '✗';
    position: absolute;
    top: -2px; left: 22px;
    color: #dc2626;
    font-size: 16px;
    font-weight: 800;
}
.ent__risk-foreign-body { padding-left: 22px; }
.ent__risk-esds {
    padding: 0 0 0 22px;
    font-size: 14px;
    color: var(--esds-navy);
    font-weight: 600;
    line-height: 1.55;
    position: relative;
}
.ent__risk-esds::before {
    content: '✓';
    position: absolute;
    top: -2px; left: 0;
    color: var(--highlight-blue);
    font-size: 16px;
    font-weight: 800;
    background: rgba(0, 97, 255, 0.08);
    width: 18px; height: 18px;
    border-radius: 50%;
    display: grid;
    place-items: center;
}
.ent__risk-esds-body { padding-left: 28px; }
.ent__risk-esds strong {
    color: var(--highlight-blue);
    font-weight: 800;
}

.ent__risks-conclusion {
    padding: 22px 28px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.06), rgba(126, 233, 255, 0.02));
    border: 1px solid rgba(0, 97, 255, 0.20);
    border-left: 4px solid var(--highlight-blue);
    border-radius: 12px;
    font-size: 16px;
    color: var(--esds-navy);
    font-weight: 600;
    line-height: 1.55;
    letter-spacing: -0.2px;
}
.ent__risks-conclusion strong {
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}

@media (max-width: 992px) {
    .ent__risk { grid-template-columns: 1fr; gap: 14px; }
    .ent__risk-name { border-right: 0; padding-right: 0; padding-bottom: 8px; border-bottom: 1px solid var(--esds-gray-100); }
    .ent__risk-foreign { border-right: 0; padding: 0; padding-bottom: 8px; border-bottom: 1px dashed var(--esds-gray-100); }
    .ent__risk-foreign-body { padding-left: 28px; }
    .ent__risk-esds { padding-left: 0; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §J · TCO SIGNAL — 11-row enterprise comparison table
   ─────────────────────────────────────────────────────────────────────────── */
.ent__tco-intro {
    margin-bottom: 24px;
    max-width: 880px;
    font-size: 15px;
    color: var(--esds-gray-600);
    line-height: 1.7;
}
.ent__tco {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 22px 50px rgba(10, 22, 40, 0.08);
    margin-bottom: 28px;
}
.ent__tco-row {
    display: grid;
    grid-template-columns: 1.2fr 1.5fr 1.5fr;
    gap: 0;
    border-bottom: 1px solid var(--esds-gray-100);
    transition: background 0.25s;
}
.ent__tco-row:last-child { border-bottom: 0; }
.ent__tco-row:hover .ent__tco-cell { background-color: rgba(0, 97, 255, 0.02); }
.ent__tco-row:hover .ent__tco-cell--esds { background-color: rgba(0, 97, 255, 0.06); }
.ent__tco-cell {
    padding: 16px 22px;
    font-size: 13px;
    line-height: 1.55;
    border-right: 1px solid var(--esds-gray-100);
    transition: background-color 0.25s;
}
.ent__tco-cell:last-child { border-right: 0; }
.ent__tco-cell--head {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: 0.10em;
    color: var(--esds-navy);
    text-transform: uppercase;
    background: var(--esds-gray-50);
    padding: 18px 22px;
}
.ent__tco-cell--head.ent__tco-cell--foreign {
    background: linear-gradient(135deg, rgba(220, 38, 38, 0.06), rgba(248, 113, 113, 0.02));
    color: #b91c1c;
}
.ent__tco-cell--head.ent__tco-cell--esds {
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.08), rgba(126, 233, 255, 0.04));
    color: var(--highlight-blue);
}
.ent__tco-cell--key {
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: var(--esds-navy);
    background: var(--esds-gray-50);
    text-transform: uppercase;
}
.ent__tco-cell--foreign {
    color: var(--esds-gray-600);
    position: relative;
}
.ent__tco-cell--foreign::before {
    content: '✗';
    position: absolute;
    top: 16px; left: 8px;
    color: rgba(220, 38, 38, 0.45);
    font-size: 11px;
    font-weight: 800;
}
.ent__tco-cell--esds {
    color: var(--esds-navy);
    font-weight: 600;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.025), transparent);
    position: relative;
}
.ent__tco-cell--esds::before {
    content: '✓';
    position: absolute;
    top: 16px; left: 8px;
    color: var(--highlight-blue);
    font-size: 11px;
    font-weight: 800;
}
.ent__tco-cell--esds strong {
    color: var(--highlight-blue);
    font-weight: 800;
}
.ent__tco-cell--foreign,
.ent__tco-cell--esds {
    padding-left: 28px;
}

.ent__tco-row--final .ent__tco-cell {
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.10), rgba(126, 233, 255, 0.04));
    font-weight: 800;
    color: var(--esds-navy);
}
.ent__tco-row--final .ent__tco-cell--key { color: var(--highlight-blue); }
.ent__tco-row--final .ent__tco-cell--foreign { color: #b91c1c; font-style: italic; }
.ent__tco-row--final .ent__tco-cell--esds strong { font-size: 14px; }

.ent__tco-cta {
    padding: 22px 28px;
    background: var(--esds-gray-50);
    border: 1px solid var(--esds-gray-100);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
}
.ent__tco-cta-text {
    font-size: 15px;
    font-weight: 700;
    color: var(--esds-navy);
    margin: 0;
}
.ent__tco-cta-text small {
    display: block;
    font-size: 12.5px;
    font-weight: 500;
    color: var(--esds-gray-500);
    margin-top: 4px;
}

@media (max-width: 992px) {
    .ent__tco-row { grid-template-columns: 1fr; }
    .ent__tco-cell { border-right: 0; border-bottom: 1px solid var(--esds-gray-100); }
    .ent__tco-cell:last-child { border-bottom: 0; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §L · CLOSING CTA — trust extras strip
   ─────────────────────────────────────────────────────────────────────────── */
.ent__cta-trust-strip {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-top: 32px;
    padding: 18px 22px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(126, 233, 255, 0.20);
    border-radius: 12px;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.ent__cta-trust-cell {
    display: flex;
    align-items: center;
    gap: 10px;
    text-align: left;
    border-right: 1px solid rgba(255, 255, 255, 0.06);
    padding-right: 14px;
}
.ent__cta-trust-cell:last-child { border-right: 0; }
.ent__cta-trust-tick {
    width: 26px; height: 26px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 14px;
    font-weight: 800;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(0, 97, 255, 0.40);
}
.ent__cta-trust-text {
    font-size: 12.5px;
    font-weight: 600;
    color: #fff;
    line-height: 1.3;
    letter-spacing: -0.2px;
}

@media (max-width: 768px) {
    .ent__cta-trust-strip { grid-template-columns: repeat(2, 1fr); }
    .ent__cta-trust-cell { border-right: 0; padding-right: 0; }
}


/* ═══════════════════════════════════════════════════════════════════════════
   STPI · ESDS × STPI ALLIANCE — Page-specific styles (stpi__ prefix)
   Common patterns (sec, inner-hero, faq-acc, page-cta, container, tokens,
   stat-card, breadcrumb) come from shared style.css.
   ═══════════════════════════════════════════════════════════════════════════ */


/* ───────────────────────────────────────────────────────────────────────────
   §A · HERO — Two-pillar alliance hero
   ─────────────────────────────────────────────────────────────────────────── */
.stpi__alliance {
    display: grid;
    grid-template-columns: 1fr 60px 1fr;
    gap: 18px;
    align-items: stretch;
    margin: 32px 0 28px;
    max-width: 980px;
    margin-left: auto;
    margin-right: auto;
}
.stpi__pillar {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(126, 233, 255, 0.20);
    border-radius: 16px;
    padding: 28px 28px 24px;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    position: relative;
    overflow: hidden;
    transition: transform 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.stpi__pillar:hover {
    transform: translateY(-4px);
    border-color: rgba(126, 233, 255, 0.40);
}
.stpi__pillar--esds::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 3px;
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
}
.stpi__pillar--stpi::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 3px;
    background: linear-gradient(90deg, var(--india-saffron), #ffb84d);
}
.stpi__pillar-eyebrow {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 4px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 12px;
}
.stpi__pillar--esds .stpi__pillar-eyebrow {
    color: var(--highlight-blue-light);
    background: rgba(126, 233, 255, 0.10);
    border: 1px solid rgba(126, 233, 255, 0.25);
}
.stpi__pillar--stpi .stpi__pillar-eyebrow {
    color: var(--india-saffron);
    background: rgba(255, 153, 51, 0.10);
    border: 1px solid rgba(255, 153, 51, 0.30);
}
.stpi__pillar-name {
    font-size: 22px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.5px;
    margin: 0 0 10px;
    line-height: 1.2;
}
.stpi__pillar-text {
    font-size: 13.5px;
    color: var(--esds-gray-300);
    line-height: 1.65;
    margin: 0;
}
.stpi__pillar-text strong { color: #fff; font-weight: 700; }
.stpi__cross {
    display: grid;
    place-items: center;
}
.stpi__cross-mark {
    width: 56px; height: 56px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--highlight-blue), var(--india-saffron));
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 22px;
    font-weight: 800;
    box-shadow: 0 12px 36px rgba(0, 97, 255, 0.30), 0 0 0 6px rgba(255, 255, 255, 0.04);
    animation: stpi-pulse 2.4s ease-in-out infinite;
}
@keyframes stpi-pulse {
    0%, 100% { transform: scale(1);    box-shadow: 0 12px 36px rgba(0, 97, 255, 0.30), 0 0 0 6px rgba(255, 255, 255, 0.04); }
    50%      { transform: scale(1.06); box-shadow: 0 12px 36px rgba(255, 153, 51, 0.40), 0 0 0 12px rgba(255, 255, 255, 0.06); }
}

@media (max-width: 768px) {
    .stpi__alliance { grid-template-columns: 1fr; gap: 12px; }
    .stpi__cross { padding: 8px 0; }
}

.stpi__hero-activity {
    margin: 28px auto 0;
    padding: 12px 18px;
    background: rgba(0, 97, 255, 0.08);
    border: 1px solid rgba(0, 97, 255, 0.25);
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11.5px;
    font-weight: 700;
    color: var(--highlight-blue-light);
    letter-spacing: 0.04em;
}
.stpi__hero-activity-icon {
    width: 22px; height: 22px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--highlight-blue), var(--india-saffron));
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 12px;
    font-weight: 800;
    flex-shrink: 0;
    animation: stpi-spin 4s linear infinite;
}
@keyframes stpi-spin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}
.stpi__hero-activity-text {
    transition: opacity 0.3s ease;
}
.stpi__hero-activity-wrap {
    text-align: center;
}


/* ───────────────────────────────────────────────────────────────────────────
   §B · CONVICTION — 3-pane manifesto strip + risk callout
   ─────────────────────────────────────────────────────────────────────────── */
.stpi__manifesto {
    max-width: 1080px;
    margin: 0 auto 32px;
    text-align: center;
    font-size: 16px;
    line-height: 1.7;
    color: var(--esds-gray-700);
}
.stpi__manifesto p { margin: 0 0 14px; }
.stpi__manifesto p:last-child { margin-bottom: 0; }
.stpi__manifesto strong { color: var(--esds-navy); font-weight: 700; }
.stpi__manifesto em {
    font-style: normal;
    color: var(--highlight-blue);
    font-weight: 700;
}

.stpi__strengths {
    display: grid;
    grid-template-columns: 1fr 1.2fr 1fr;
    gap: 18px;
    margin-bottom: 36px;
}
.stpi__strength {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 22px 24px 18px;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease);
}
.stpi__strength:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 38px rgba(0, 97, 255, 0.10);
    border-color: rgba(0, 97, 255, 0.20);
}
.stpi__strength--center {
    background: linear-gradient(135deg, var(--esds-navy), var(--esds-deep));
    border: none;
    color: #fff;
    position: relative;
    overflow: hidden;
}
.stpi__strength--center::after {
    content: '';
    position: absolute;
    top: -60px; right: -60px;
    width: 200px; height: 200px;
    background: radial-gradient(circle, rgba(255, 153, 51, 0.30), transparent 65%);
    filter: blur(34px);
}
.stpi__strength-eyebrow {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 4px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 10px;
}
.stpi__strength--esds .stpi__strength-eyebrow {
    color: var(--highlight-blue);
    background: rgba(0, 97, 255, 0.06);
    border: 1px solid rgba(0, 97, 255, 0.18);
}
.stpi__strength--center .stpi__strength-eyebrow {
    color: var(--india-saffron);
    background: rgba(255, 153, 51, 0.10);
    border: 1px solid rgba(255, 153, 51, 0.30);
}
.stpi__strength--stpi .stpi__strength-eyebrow {
    color: var(--india-saffron);
    background: rgba(255, 153, 51, 0.06);
    border: 1px solid rgba(255, 153, 51, 0.25);
}
.stpi__strength-name {
    font-size: 16px;
    font-weight: 800;
    margin: 0 0 8px;
    letter-spacing: -0.3px;
    line-height: 1.3;
    color: var(--esds-navy);
}
.stpi__strength--center .stpi__strength-name { color: #fff; font-size: 18px; }
.stpi__strength-text {
    font-size: 13px;
    color: var(--esds-gray-600);
    line-height: 1.6;
    margin: 0;
}
.stpi__strength--center .stpi__strength-text { color: var(--esds-gray-300); }

.stpi__risk-callout {
    padding: 24px 32px;
    background: linear-gradient(135deg, rgba(220, 38, 38, 0.04), rgba(248, 113, 113, 0.02));
    border: 1px solid rgba(220, 38, 38, 0.18);
    border-left: 4px solid #dc2626;
    border-radius: 12px;
    font-size: 15px;
    color: var(--esds-gray-700);
    line-height: 1.65;
}
.stpi__risk-callout p { margin: 0 0 10px; }
.stpi__risk-callout p:last-child { margin-bottom: 0; }
.stpi__risk-callout strong { color: var(--esds-navy); font-weight: 700; }
.stpi__risk-callout em {
    font-style: normal;
    color: #b91c1c;
    font-weight: 700;
}

@media (max-width: 992px) { .stpi__strengths { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §C · DATA CENTER SERVICES — 6 service cards + 7-spec ribbon
   ─────────────────────────────────────────────────────────────────────────── */
.stpi__services {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-bottom: 32px;
}
.stpi__service {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 24px 24px 22px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.stpi__service::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 3px;
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
    transform: scaleX(0.30);
    transform-origin: left;
    transition: transform 0.4s var(--esds-ease);
}
.stpi__service:hover {
    transform: translateY(-5px);
    box-shadow: 0 22px 50px rgba(0, 97, 255, 0.12);
    border-color: rgba(0, 97, 255, 0.25);
}
.stpi__service:hover::before { transform: scaleX(1); }
.stpi__service-icon {
    width: 52px; height: 52px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.12), rgba(126, 233, 255, 0.04));
    border: 1px solid rgba(0, 97, 255, 0.22);
    color: var(--highlight-blue);
    display: grid;
    place-items: center;
    margin-bottom: 14px;
    transition: transform 0.3s var(--esds-ease);
}
.stpi__service:hover .stpi__service-icon { transform: rotate(-6deg) scale(1.08); }
.stpi__service-icon svg { width: 26px; height: 26px; }
.stpi__service-name {
    font-size: 15.5px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    margin: 0 0 6px;
    line-height: 1.3;
}
.stpi__service-tagline {
    font-size: 12.5px;
    color: var(--highlight-blue);
    font-weight: 700;
    letter-spacing: -0.2px;
    margin: 0 0 10px;
    font-style: italic;
}
.stpi__service-text {
    font-size: 12.5px;
    color: var(--esds-gray-600);
    line-height: 1.6;
    margin: 0;
}
.stpi__service-text strong { color: var(--esds-navy); font-weight: 700; }

@media (max-width: 992px) { .stpi__services { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .stpi__services { grid-template-columns: 1fr; } }

.stpi__specs-eyebrow {
    text-align: center;
    margin-bottom: 18px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.18em;
    text-transform: uppercase;
}
.stpi__specs-eyebrow strong { color: var(--india-saffron); font-weight: 800; }

.stpi__specs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
}
.stpi__spec {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 18px;
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 999px;
    font-size: 13px;
    font-weight: 700;
    color: var(--esds-navy);
    letter-spacing: -0.2px;
    transition: transform 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease), color 0.3s var(--esds-ease);
}
.stpi__spec:hover {
    transform: translateY(-2px);
    border-color: rgba(0, 97, 255, 0.30);
    color: var(--highlight-blue);
}
.stpi__spec::before {
    content: '✓';
    width: 18px; height: 18px;
    flex-shrink: 0;
    background: rgba(0, 97, 255, 0.10);
    color: var(--highlight-blue);
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 10px;
    font-weight: 800;
}


/* ───────────────────────────────────────────────────────────────────────────
   §D · CLOUD SERVICES — patent eyebrow + 6 cloud cards
   ─────────────────────────────────────────────────────────────────────────── */
.stpi__cloud-eyebrow {
    text-align: center;
    margin-bottom: 32px;
    max-width: 880px;
    margin-left: auto;
    margin-right: auto;
}
.stpi__patent-strip {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 8px 18px 8px 14px;
    background: rgba(255, 153, 51, 0.10);
    border: 1.5px solid rgba(255, 153, 51, 0.40);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 16px;
}
.stpi__patent-strip-mark {
    width: 22px; height: 22px;
    border-radius: 50%;
    background: var(--india-saffron);
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 11px;
    font-weight: 800;
}
.stpi__cloud-eyebrow-text {
    font-size: 15.5px;
    color: var(--esds-gray-700);
    line-height: 1.65;
    margin: 0;
}
.stpi__cloud-eyebrow-text strong { color: var(--esds-navy); font-weight: 700; }
.stpi__cloud-eyebrow-text em {
    font-style: normal;
    color: var(--highlight-blue);
    font-weight: 700;
}

.stpi__clouds {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}
.stpi__cloud {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 24px 24px 22px;
    position: relative;
    overflow: hidden;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.stpi__cloud:hover {
    transform: translateY(-5px);
    box-shadow: 0 22px 50px rgba(0, 97, 255, 0.12);
    border-color: rgba(0, 97, 255, 0.25);
}
.stpi__cloud--patent {
    background: linear-gradient(135deg, var(--esds-navy), var(--esds-deep));
    border: 1px solid rgba(126, 233, 255, 0.22);
    color: #fff;
}
.stpi__cloud--patent::before {
    content: '';
    position: absolute;
    top: -60px; right: -60px;
    width: 200px; height: 200px;
    background: radial-gradient(circle, rgba(255, 153, 51, 0.30), transparent 65%);
    filter: blur(34px);
}
.stpi__cloud-tag {
    position: absolute;
    top: 14px; right: 14px;
    padding: 3px 8px;
    background: rgba(255, 153, 51, 0.12);
    border: 1px solid rgba(255, 153, 51, 0.35);
    border-radius: 4px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.14em;
    text-transform: uppercase;
}
.stpi__cloud-icon {
    width: 50px; height: 50px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.12), rgba(126, 233, 255, 0.04));
    border: 1px solid rgba(0, 97, 255, 0.22);
    color: var(--highlight-blue);
    display: grid;
    place-items: center;
    margin-bottom: 14px;
    position: relative;
    z-index: 1;
}
.stpi__cloud--patent .stpi__cloud-icon {
    background: rgba(255, 153, 51, 0.10);
    border-color: rgba(255, 153, 51, 0.35);
    color: var(--india-saffron);
}
.stpi__cloud-icon svg { width: 26px; height: 26px; }
.stpi__cloud-name {
    font-size: 15.5px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    margin: 0 0 6px;
    line-height: 1.3;
    position: relative;
    z-index: 1;
}
.stpi__cloud--patent .stpi__cloud-name { color: #fff; }
.stpi__cloud-tagline {
    font-size: 12.5px;
    color: var(--highlight-blue);
    font-weight: 700;
    letter-spacing: -0.2px;
    margin: 0 0 10px;
    font-style: italic;
    position: relative;
    z-index: 1;
}
.stpi__cloud--patent .stpi__cloud-tagline { color: var(--highlight-blue-light); }
.stpi__cloud-text {
    font-size: 12.5px;
    color: var(--esds-gray-600);
    line-height: 1.6;
    margin: 0;
    position: relative;
    z-index: 1;
}
.stpi__cloud--patent .stpi__cloud-text { color: var(--esds-gray-300); }
.stpi__cloud-text strong { color: var(--esds-navy); font-weight: 700; }
.stpi__cloud--patent .stpi__cloud-text strong { color: #fff; }

@media (max-width: 992px) { .stpi__clouds { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .stpi__clouds { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §E · SECURITY SERVICES — 6 security capabilities
   ─────────────────────────────────────────────────────────────────────────── */
.stpi__sec-lede {
    text-align: center;
    margin-bottom: 32px;
    max-width: 880px;
    margin-left: auto;
    margin-right: auto;
    font-size: 15px;
    color: var(--esds-gray-300);
    line-height: 1.65;
}
.stpi__sec-lede strong { color: #fff; font-weight: 700; }

.stpi__shields {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}
.stpi__shield {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 14px;
    padding: 24px 24px 20px;
    position: relative;
    overflow: hidden;
    transition: transform 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease), background 0.3s var(--esds-ease);
}
.stpi__shield:hover {
    transform: translateY(-5px);
    border-color: rgba(126, 233, 255, 0.30);
    background: rgba(0, 97, 255, 0.04);
}
.stpi__shield-icon {
    width: 50px; height: 50px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.16), rgba(126, 233, 255, 0.06));
    border: 1px solid rgba(126, 233, 255, 0.25);
    color: var(--highlight-blue-light);
    display: grid;
    place-items: center;
    margin-bottom: 14px;
}
.stpi__shield-icon svg { width: 26px; height: 26px; }
.stpi__shield-name {
    font-size: 15.5px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.3px;
    margin: 0 0 6px;
    line-height: 1.3;
}
.stpi__shield-tagline {
    font-size: 12.5px;
    color: var(--highlight-blue-light);
    font-weight: 700;
    letter-spacing: -0.2px;
    margin: 0 0 10px;
    font-style: italic;
}
.stpi__shield-text {
    font-size: 12.5px;
    color: var(--esds-gray-300);
    line-height: 1.6;
    margin: 0;
}
.stpi__shield-text strong { color: #fff; font-weight: 700; }

@media (max-width: 992px) { .stpi__shields { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .stpi__shields { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §F · COMBINED STRENGTHS — 5-row alliance ledger with attribution badges
   ─────────────────────────────────────────────────────────────────────────── */
.stpi__alliance-lede {
    text-align: center;
    margin-bottom: 36px;
    max-width: 880px;
    margin-left: auto;
    margin-right: auto;
    font-size: 15px;
    color: var(--esds-gray-700);
    line-height: 1.65;
}
.stpi__alliance-lede strong { color: var(--esds-navy); font-weight: 700; }
.stpi__alliance-lede em {
    font-style: normal;
    color: var(--highlight-blue);
    font-weight: 700;
}

.stpi__ledger {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 18px 44px rgba(10, 22, 40, 0.06);
}
.stpi__ledger-row {
    display: grid;
    grid-template-columns: 130px 1fr;
    gap: 24px;
    padding: 22px 28px;
    border-bottom: 1px solid var(--esds-gray-100);
    align-items: center;
    transition: background 0.25s;
}
.stpi__ledger-row:last-child { border-bottom: 0; }
.stpi__ledger-row:hover { background: rgba(0, 97, 255, 0.025); }
.stpi__ledger-attr {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 14px;
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    border: 1.5px solid;
}
.stpi__ledger-attr--esds {
    background: rgba(0, 97, 255, 0.06);
    color: var(--highlight-blue);
    border-color: rgba(0, 97, 255, 0.25);
}
.stpi__ledger-attr--together {
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.06), rgba(255, 153, 51, 0.06));
    color: var(--esds-navy);
    border-color: rgba(0, 97, 255, 0.25);
}
.stpi__ledger-attr--stpi {
    background: rgba(255, 153, 51, 0.08);
    color: #b45309;
    border-color: rgba(255, 153, 51, 0.35);
}
.stpi__ledger-content h3 {
    font-size: 16px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    margin: 0 0 6px;
    line-height: 1.3;
}
.stpi__ledger-content p {
    font-size: 13px;
    color: var(--esds-gray-600);
    line-height: 1.6;
    margin: 0;
}
.stpi__ledger-content p strong { color: var(--esds-navy); font-weight: 700; }
.stpi__ledger-content p em {
    font-style: normal;
    color: var(--highlight-blue);
    font-weight: 700;
}

@media (max-width: 768px) {
    .stpi__ledger-row { grid-template-columns: 1fr; gap: 12px; padding: 20px 22px; }
    .stpi__ledger-attr { justify-self: start; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §G · CERTIFICATIONS — 7-cert grid
   ─────────────────────────────────────────────────────────────────────────── */
.stpi__certs-lede {
    text-align: center;
    margin-bottom: 36px;
    max-width: 880px;
    margin-left: auto;
    margin-right: auto;
    font-size: 15px;
    color: var(--esds-gray-700);
    line-height: 1.65;
}
.stpi__certs-lede strong { color: var(--esds-navy); font-weight: 700; }

.stpi__certs {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
}
.stpi__cert {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 22px 20px 18px;
    text-align: center;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.stpi__cert:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 38px rgba(0, 97, 255, 0.10);
    border-color: rgba(0, 97, 255, 0.20);
}
.stpi__cert-shield {
    width: 48px; height: 48px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.12), rgba(126, 233, 255, 0.04));
    border: 1px solid rgba(0, 97, 255, 0.22);
    color: var(--highlight-blue);
    display: grid;
    place-items: center;
    margin: 0 auto 12px;
}
.stpi__cert--saffron .stpi__cert-shield {
    background: rgba(255, 153, 51, 0.10);
    border-color: rgba(255, 153, 51, 0.30);
    color: var(--india-saffron);
}
.stpi__cert-shield svg { width: 22px; height: 22px; }
.stpi__cert-name {
    font-size: 14px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    margin: 0 0 4px;
    line-height: 1.3;
}
.stpi__cert-text {
    font-size: 11.5px;
    color: var(--esds-gray-600);
    line-height: 1.4;
    margin: 0;
}

@media (max-width: 992px) { .stpi__certs { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 540px) { .stpi__certs { grid-template-columns: repeat(2, 1fr); } }


/* ───────────────────────────────────────────────────────────────────────────
   §H · CLOSING CTA — 4 ✓-trust extras
   ─────────────────────────────────────────────────────────────────────────── */
.stpi__cta-trust-strip {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-top: 32px;
    padding: 18px 22px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(126, 233, 255, 0.20);
    border-radius: 12px;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.stpi__cta-trust-cell {
    display: flex;
    align-items: center;
    gap: 10px;
    text-align: left;
    border-right: 1px solid rgba(255, 255, 255, 0.06);
    padding-right: 14px;
}
.stpi__cta-trust-cell:last-child { border-right: 0; }
.stpi__cta-trust-tick {
    width: 26px; height: 26px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--highlight-blue), var(--india-saffron));
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 14px;
    font-weight: 800;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(0, 97, 255, 0.40);
}
.stpi__cta-trust-text {
    font-size: 12.5px;
    font-weight: 600;
    color: #fff;
    line-height: 1.3;
    letter-spacing: -0.2px;
}

@media (max-width: 768px) {
    .stpi__cta-trust-strip { grid-template-columns: repeat(2, 1fr); }
    .stpi__cta-trust-cell { border-right: 0; padding-right: 0; }
}



/* ═══════════════════════════════════════════════════════════════════════════
   FAM · FAMRUT — Page-specific styles (fam__ prefix)
   Common patterns (sec, inner-hero, faq-acc, page-cta, container, tokens,
   stat-card, breadcrumb) come from shared style.css.
   ═══════════════════════════════════════════════════════════════════════════ */


/* ───────────────────────────────────────────────────────────────────────────
   §A · HERO — Famrut Field Console
   ─────────────────────────────────────────────────────────────────────────── */
.fam__hero-grid {
    display: grid;
    grid-template-columns: 1fr 1.05fr;
    gap: 56px;
    align-items: center;
    margin-bottom: 56px;
}

.fam__hero-creds {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 22px;
}
.fam__hero-cred {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(126, 233, 255, 0.20);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--esds-gray-300);
    letter-spacing: 0.10em;
    text-transform: uppercase;
}
.fam__hero-cred::before {
    content: '✓';
    color: var(--india-saffron);
    font-weight: 800;
    font-size: 11px;
}

/* Field Console */
.fam__field {
    background: linear-gradient(180deg, rgba(15, 29, 50, 0.96), rgba(10, 22, 40, 0.98));
    border: 1px solid rgba(255, 153, 51, 0.22);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.45);
    position: relative;
}
.fam__field::before {
    content: '';
    position: absolute;
    top: -120px; right: -120px;
    width: 320px; height: 320px;
    background: radial-gradient(circle, rgba(255, 153, 51, 0.30), transparent 65%);
    filter: blur(40px);
    pointer-events: none;
}
.fam__field-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 22px 14px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    position: relative;
    z-index: 1;
}
.fam__field-title {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.16em;
    color: var(--esds-gray-300);
    text-transform: uppercase;
    margin: 0;
}
.fam__field-title strong { color: var(--india-saffron); font-weight: 800; }
.fam__field-armed {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: rgba(74, 222, 128, 0.12);
    border: 1px solid rgba(74, 222, 128, 0.30);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: #4ade80;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}
.fam__field-armed::before {
    content: '';
    width: 6px; height: 6px;
    border-radius: 50%;
    background: #4ade80;
    animation: fam-pulse 1.6s ease-in-out infinite;
}
@keyframes fam-pulse {
    0%, 100% { opacity: 0.45; transform: scale(0.85); }
    50%      { opacity: 1;    transform: scale(1.15); }
}

.fam__field-tiles {
    padding: 8px 22px 6px;
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}
.fam__tile {
    display: grid;
    grid-template-columns: 32px 1fr;
    gap: 10px;
    align-items: center;
    padding: 10px 12px;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 8px;
}
.fam__tile-icon {
    width: 28px; height: 28px;
    border-radius: 6px;
    background: linear-gradient(135deg, rgba(255, 153, 51, 0.16), rgba(255, 153, 51, 0.04));
    border: 1px solid rgba(255, 153, 51, 0.25);
    color: var(--india-saffron);
    display: grid;
    place-items: center;
}
.fam__tile-icon svg { width: 16px; height: 16px; }
.fam__tile-meta {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.fam__tile-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9px;
    font-weight: 800;
    color: var(--esds-gray-400);
    letter-spacing: 0.10em;
    text-transform: uppercase;
}
.fam__tile-value {
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.2px;
}
.fam__tile-value strong { color: var(--highlight-blue-light); font-weight: 800; }
.fam__tile--full { grid-column: span 2; }

.fam__field-activity {
    margin: 14px 22px 0;
    padding: 11px 14px;
    background: rgba(255, 153, 51, 0.08);
    border: 1px solid rgba(255, 153, 51, 0.25);
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    color: var(--india-saffron);
    letter-spacing: 0.04em;
    position: relative;
    z-index: 1;
}
.fam__field-activity-icon {
    width: 20px; height: 20px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--india-saffron), #ffb84d);
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 11px;
    font-weight: 800;
    flex-shrink: 0;
    animation: fam-spin 4s linear infinite;
}
@keyframes fam-spin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}
.fam__field-activity-text { transition: opacity 0.3s ease; }

.fam__field-foot {
    padding: 12px 22px;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    margin-top: 14px;
    background: rgba(0, 0, 0, 0.25);
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    text-align: center;
    position: relative;
    z-index: 1;
}
.fam__field-foot small {
    display: block;
    color: var(--esds-gray-400);
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.10em;
    margin-top: 4px;
}

@media (max-width: 992px) {
    .fam__hero-grid { grid-template-columns: 1fr; gap: 36px; }
    .fam__field { max-width: 540px; margin: 0 auto; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §B · 4 PROBLEMS — 4-pane red-tinted grid
   ─────────────────────────────────────────────────────────────────────────── */
.fam__stat-lede {
    text-align: center;
    margin-bottom: 36px;
    max-width: 920px;
    margin-left: auto;
    margin-right: auto;
    font-size: 18px;
    color: var(--esds-gray-700);
    line-height: 1.55;
    font-weight: 600;
}
.fam__stat-lede strong { color: var(--india-saffron); font-weight: 800; }
.fam__stat-lede em {
    font-style: normal;
    color: var(--esds-navy);
    font-weight: 800;
}

.fam__problems {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}
.fam__problem {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 16px;
    padding: 28px 30px 24px;
    position: relative;
    overflow: hidden;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease);
}
.fam__problem::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 4px; height: 100%;
    background: linear-gradient(180deg, #dc2626, #f97316);
}
.fam__problem:hover {
    transform: translateY(-5px);
    box-shadow: 0 22px 50px rgba(220, 38, 38, 0.10);
    border-color: rgba(220, 38, 38, 0.20);
}
.fam__problem-tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: rgba(220, 38, 38, 0.06);
    border-radius: 4px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: #dc2626;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 14px;
}
.fam__problem-tag::before { content: '⚠'; font-size: 11px; }
.fam__problem-name {
    font-size: 18px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.4px;
    margin: 0 0 10px;
    line-height: 1.25;
}
.fam__problem-text {
    font-size: 13.5px;
    color: var(--esds-gray-600);
    line-height: 1.65;
    margin: 0;
}
.fam__problem-text strong { color: var(--esds-navy); font-weight: 700; }
.fam__problem-text em {
    font-style: italic;
    color: var(--india-saffron);
    font-weight: 700;
}

@media (max-width: 768px) { .fam__problems { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §C · PROMISE — sovereign-cloud pull-quote on dark
   ─────────────────────────────────────────────────────────────────────────── */
.fam__promise {
    max-width: 980px;
    margin: 0 auto;
    padding: 40px 56px;
    background: linear-gradient(135deg, var(--esds-navy), var(--esds-deep));
    border-radius: 18px;
    color: #fff;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.fam__promise::before {
    content: '';
    position: absolute;
    top: -120px; left: 50%;
    transform: translateX(-50%);
    width: 480px; height: 320px;
    background: radial-gradient(ellipse, rgba(255, 153, 51, 0.30), transparent 65%);
    filter: blur(50px);
}
.fam__promise-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
    padding: 5px 14px;
    background: rgba(255, 153, 51, 0.10);
    border: 1px solid rgba(255, 153, 51, 0.30);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    position: relative;
    z-index: 1;
}
.fam__promise-eyebrow::before { content: '◆'; font-size: 8px; }
.fam__promise-headline {
    font-size: 26px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.6px;
    line-height: 1.25;
    margin: 0 0 16px;
    position: relative;
    z-index: 1;
}
.fam__promise-headline em {
    font-style: normal;
    background: linear-gradient(135deg, var(--india-saffron), #ffb84d);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.fam__promise-text {
    font-size: 15px;
    color: var(--esds-gray-300);
    line-height: 1.7;
    margin: 0 0 16px;
    position: relative;
    z-index: 1;
}
.fam__promise-text strong { color: #fff; font-weight: 700; }
.fam__promise-pillars {
    display: flex;
    justify-content: center;
    gap: 18px;
    flex-wrap: wrap;
    position: relative;
    z-index: 1;
}
.fam__promise-pillar {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    padding: 6px 14px;
    border: 1px solid rgba(255, 153, 51, 0.30);
    border-radius: 999px;
    background: rgba(255, 153, 51, 0.06);
}

@media (max-width: 768px) {
    .fam__promise { padding: 32px 28px; }
    .fam__promise-headline { font-size: 22px; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §D · 4 STAKEHOLDERS — 2×2 stakeholder cards
   ─────────────────────────────────────────────────────────────────────────── */
.fam__stake-lede {
    text-align: center;
    margin-bottom: 36px;
    max-width: 920px;
    margin-left: auto;
    margin-right: auto;
    font-size: 15.5px;
    color: var(--esds-gray-700);
    line-height: 1.65;
}
.fam__stake-lede strong { color: var(--esds-navy); font-weight: 700; }
.fam__stake-lede em {
    font-style: normal;
    color: var(--india-saffron);
    font-weight: 700;
}

.fam__stakes {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
}
.fam__stake {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 16px;
    padding: 28px 30px 24px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.fam__stake::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 3px;
    background: linear-gradient(90deg, var(--india-saffron), #ffb84d);
    transform: scaleX(0.30);
    transform-origin: left;
    transition: transform 0.4s var(--esds-ease);
}
.fam__stake:hover {
    transform: translateY(-5px);
    box-shadow: 0 22px 50px rgba(255, 153, 51, 0.12);
    border-color: rgba(255, 153, 51, 0.30);
}
.fam__stake:hover::before { transform: scaleX(1); }
.fam__stake-icon {
    width: 56px; height: 56px;
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(255, 153, 51, 0.12), rgba(255, 153, 51, 0.02));
    border: 1px solid rgba(255, 153, 51, 0.25);
    color: var(--india-saffron);
    display: grid;
    place-items: center;
    margin-bottom: 16px;
    transition: transform 0.3s var(--esds-ease);
}
.fam__stake:hover .fam__stake-icon { transform: rotate(-6deg) scale(1.08); }
.fam__stake-icon svg { width: 28px; height: 28px; }
.fam__stake-eyebrow {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    background: rgba(0, 97, 255, 0.06);
    border-radius: 4px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 10px;
    align-self: flex-start;
}
.fam__stake-name {
    font-size: 18px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.4px;
    margin: 0 0 12px;
    line-height: 1.25;
}
.fam__stake-name em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), #ffb84d);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.fam__stake-text {
    font-size: 13.5px;
    color: var(--esds-gray-600);
    line-height: 1.65;
    margin: 0;
}
.fam__stake-text strong { color: var(--esds-navy); font-weight: 700; }
.fam__stake-text em {
    font-style: normal;
    color: var(--india-saffron);
    font-weight: 700;
}

@media (max-width: 768px) { .fam__stakes { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §E · 8-SERVICE ECOSYSTEM — 8 ecosystem rows (ledger)
   ─────────────────────────────────────────────────────────────────────────── */
.fam__eco-lede {
    text-align: center;
    margin-bottom: 36px;
    max-width: 920px;
    margin-left: auto;
    margin-right: auto;
    font-size: 15.5px;
    color: var(--esds-gray-700);
    line-height: 1.65;
}
.fam__eco-lede strong { color: var(--esds-navy); font-weight: 700; }
.fam__eco-lede em {
    font-style: normal;
    color: var(--india-saffron);
    font-weight: 700;
}

.fam__eco {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 18px 44px rgba(10, 22, 40, 0.06);
}
.fam__eco-row {
    display: grid;
    grid-template-columns: 64px 230px 1fr;
    gap: 22px;
    padding: 22px 28px;
    border-bottom: 1px solid var(--esds-gray-100);
    align-items: center;
    transition: background 0.25s;
}
.fam__eco-row:last-child { border-bottom: 0; }
.fam__eco-row:hover { background: rgba(255, 153, 51, 0.025); }
.fam__eco-icon {
    width: 50px; height: 50px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(255, 153, 51, 0.10), rgba(255, 153, 51, 0.02));
    border: 1px solid rgba(255, 153, 51, 0.22);
    color: var(--india-saffron);
    display: grid;
    place-items: center;
    transition: transform 0.3s var(--esds-ease);
}
.fam__eco-row:hover .fam__eco-icon { transform: rotate(-6deg) scale(1.08); }
.fam__eco-icon svg { width: 24px; height: 24px; }
.fam__eco-name {
    font-size: 15px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    margin: 0;
    line-height: 1.3;
    border-right: 1px solid var(--esds-gray-100);
    padding-right: 22px;
    height: 100%;
    display: flex;
    align-items: center;
}
.fam__eco-text {
    font-size: 13.5px;
    color: var(--esds-gray-600);
    line-height: 1.6;
    margin: 0;
    padding-left: 4px;
}
.fam__eco-text strong { color: var(--esds-navy); font-weight: 700; }

@media (max-width: 992px) {
    .fam__eco-row { grid-template-columns: 50px 1fr; gap: 16px; padding: 22px 22px; }
    .fam__eco-name { border-right: 0; padding-right: 0; padding-bottom: 4px; height: auto; grid-column: 2; }
    .fam__eco-text { grid-column: 2; padding-left: 0; }
    .fam__eco-icon { grid-row: span 2; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §F · 5 INTELLIGENCE FEATURES — 5-up row with custom icons
   ─────────────────────────────────────────────────────────────────────────── */
.fam__intel-lede {
    text-align: center;
    margin-bottom: 36px;
    max-width: 920px;
    margin-left: auto;
    margin-right: auto;
    font-size: 15.5px;
    color: var(--esds-gray-700);
    line-height: 1.65;
}
.fam__intel-lede strong { color: var(--esds-navy); font-weight: 700; }
.fam__intel-lede em {
    font-style: normal;
    color: var(--india-saffron);
    font-weight: 700;
}

.fam__intel {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 14px;
}
.fam__intel-card {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 24px 22px 22px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.fam__intel-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 22px 50px rgba(255, 153, 51, 0.14);
    border-color: rgba(255, 153, 51, 0.30);
}
.fam__intel-num {
    display: inline-flex;
    align-items: center;
    padding: 3px 8px;
    background: rgba(255, 153, 51, 0.08);
    border-radius: 4px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 14px;
    align-self: flex-start;
}
.fam__intel-icon {
    width: 50px; height: 50px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(255, 153, 51, 0.12), rgba(255, 153, 51, 0.02));
    border: 1px solid rgba(255, 153, 51, 0.22);
    color: var(--india-saffron);
    display: grid;
    place-items: center;
    margin-bottom: 14px;
    transition: transform 0.3s var(--esds-ease);
}
.fam__intel-card:hover .fam__intel-icon { transform: rotate(-6deg) scale(1.08); }
.fam__intel-icon svg { width: 24px; height: 24px; }
.fam__intel-name {
    font-size: 14.5px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    margin: 0 0 6px;
    line-height: 1.3;
}
.fam__intel-tagline {
    font-size: 12px;
    color: var(--india-saffron);
    font-weight: 700;
    letter-spacing: -0.1px;
    margin: 0 0 10px;
    font-style: italic;
}
.fam__intel-text {
    font-size: 12.5px;
    color: var(--esds-gray-600);
    line-height: 1.6;
    margin: 0;
    flex-grow: 1;
}
.fam__intel-text strong { color: var(--esds-navy); font-weight: 700; }

@media (max-width: 1100px) { .fam__intel { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 768px)  { .fam__intel { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px)  { .fam__intel { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §G · ESDS BACKING — centered sovereign-cloud block
   ─────────────────────────────────────────────────────────────────────────── */
.fam__backing {
    max-width: 920px;
    margin: 0 auto;
    padding: 40px 48px;
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 18px;
    text-align: center;
    box-shadow: 0 18px 44px rgba(10, 22, 40, 0.06);
    position: relative;
    overflow: hidden;
}
.fam__backing::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 4px;
    background: linear-gradient(90deg,
        var(--india-saffron) 0%, var(--india-saffron) 33.33%,
        #ffffff 33.33%, #ffffff 66.66%,
        var(--india-green) 66.66%, var(--india-green) 100%);
}
.fam__backing-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 18px;
    padding: 6px 14px;
    background: rgba(0, 97, 255, 0.06);
    border: 1px solid rgba(0, 97, 255, 0.18);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.16em;
    text-transform: uppercase;
}
.fam__backing-eyebrow::before { content: '◆'; font-size: 8px; }
.fam__backing-h {
    font-size: 24px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.5px;
    line-height: 1.25;
    margin: 0 0 16px;
}
.fam__backing-h em {
    font-style: normal;
    color: var(--highlight-blue);
}
.fam__backing-text {
    font-size: 15px;
    color: var(--esds-gray-700);
    line-height: 1.7;
    margin: 0 0 20px;
    text-align: left;
}
.fam__backing-text strong { color: var(--esds-navy); font-weight: 700; }
.fam__backing-text em {
    font-style: normal;
    color: var(--highlight-blue);
    font-weight: 700;
}
.fam__backing-pills {
    display: flex;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
}
.fam__backing-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    background: var(--esds-gray-50);
    border: 1px solid var(--esds-gray-100);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.fam__backing-pill::before {
    content: '✓';
    color: var(--highlight-blue);
    font-weight: 800;
}

@media (max-width: 768px) {
    .fam__backing { padding: 32px 28px; }
    .fam__backing-h { font-size: 20px; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §H · CLOSING CTA — saffron-tinted trust strip
   ─────────────────────────────────────────────────────────────────────────── */
.fam__cta-trust-strip {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    margin-top: 32px;
    padding: 18px 22px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 153, 51, 0.20);
    border-radius: 12px;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.fam__cta-trust-cell {
    display: flex;
    align-items: center;
    gap: 10px;
    text-align: left;
    border-right: 1px solid rgba(255, 255, 255, 0.06);
    padding-right: 14px;
}
.fam__cta-trust-cell:last-child { border-right: 0; }
.fam__cta-trust-tick {
    width: 26px; height: 26px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--india-saffron), #ffb84d);
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 14px;
    font-weight: 800;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(255, 153, 51, 0.40);
}
.fam__cta-trust-text {
    font-size: 12.5px;
    font-weight: 600;
    color: #fff;
    line-height: 1.3;
    letter-spacing: -0.2px;
}

@media (max-width: 768px) {
    .fam__cta-trust-strip { grid-template-columns: 1fr; }
    .fam__cta-trust-cell { border-right: 0; padding-right: 0; }
}


/* ═══════════════════════════════════════════════════════════════════════════
   GOV · GOVERNMENT SOLUTIONS — Page-specific styles (gov__ prefix)
   Common patterns (sec, inner-hero, faq-acc, page-cta, container, tokens,
   stat-card, breadcrumb) come from shared style.css.
   ═══════════════════════════════════════════════════════════════════════════ */


/* ───────────────────────────────────────────────────────────────────────────
   §A · HERO — "Sovereign Credentials Panel"
   ─────────────────────────────────────────────────────────────────────────── */
.gov__hero-grid {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    gap: 56px;
    align-items: center;
    margin-bottom: 56px;
}

/* Sovereign Credentials Panel */
.gov__panel {
    background: linear-gradient(180deg, rgba(15, 29, 50, 0.94), rgba(10, 22, 40, 0.97));
    border: 1px solid rgba(126, 233, 255, 0.18);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.40);
    position: relative;
}
.gov__panel::before {
    content: '';
    position: absolute;
    top: -120px; right: -120px;
    width: 320px; height: 320px;
    background: radial-gradient(circle, rgba(0, 97, 255, 0.30), transparent 65%);
    filter: blur(40px);
    pointer-events: none;
}
.gov__panel-tricolor {
    height: 4px;
    background: linear-gradient(90deg,
        var(--india-saffron) 0%, var(--india-saffron) 33.33%,
        #ffffff 33.33%, #ffffff 66.66%,
        var(--india-green) 66.66%, var(--india-green) 100%);
}
.gov__panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 22px 16px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    position: relative;
    z-index: 1;
}
.gov__panel-title {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: 0.18em;
    color: var(--esds-gray-300);
    text-transform: uppercase;
    margin: 0;
}
.gov__panel-title strong {
    color: #4ade80;
    font-weight: 800;
}
.gov__panel-verified {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: rgba(74, 222, 128, 0.12);
    border: 1px solid rgba(74, 222, 128, 0.30);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: #4ade80;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}
.gov__panel-verified .dot {
    width: 6px; height: 6px;
    border-radius: 50%;
    background: #4ade80;
    animation: gov-pulse-dot 1.6s ease-in-out infinite;
}
@keyframes gov-pulse-dot {
    0%, 100% { opacity: 0.45; transform: scale(0.85); }
    50%      { opacity: 1;    transform: scale(1.15); }
}

.gov__credentials {
    padding: 6px 0;
    position: relative;
    z-index: 1;
}
.gov__credential {
    display: grid;
    grid-template-columns: 32px 1fr auto;
    gap: 14px;
    align-items: center;
    padding: 13px 22px;
    border-bottom: 1px dashed rgba(255, 255, 255, 0.05);
    opacity: 0;
    transform: translateX(-8px);
    transition: opacity 0.5s var(--esds-ease), transform 0.5s var(--esds-ease);
}
.gov__credential:last-child { border-bottom: 0; }
.gov__credential.is-stamped {
    opacity: 1;
    transform: translateX(0);
}
.gov__credential-seal {
    width: 30px; height: 30px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.20), rgba(126, 233, 255, 0.10));
    border: 1.5px solid rgba(126, 233, 255, 0.30);
    display: grid;
    place-items: center;
    color: var(--highlight-blue-light);
    font-size: 14px;
    font-weight: 800;
    flex-shrink: 0;
}
.gov__credential-name {
    font-size: 13.5px;
    font-weight: 700;
    color: #fff;
    letter-spacing: -0.2px;
}
.gov__credential-name small {
    display: block;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 600;
    color: var(--esds-gray-400);
    letter-spacing: 0.04em;
    margin-top: 2px;
    text-transform: none;
}
.gov__credential-status {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 9px;
    background: rgba(74, 222, 128, 0.10);
    border: 1px solid rgba(74, 222, 128, 0.22);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: #4ade80;
    letter-spacing: 0.10em;
    text-transform: uppercase;
}
.gov__credential-status::before {
    content: '✓';
    font-size: 10px;
}
.gov__panel-foot {
    padding: 14px 22px;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    background: rgba(0, 0, 0, 0.25);
    position: relative;
    z-index: 1;
    text-align: center;
}
.gov__panel-foot-text {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.16em;
    text-transform: uppercase;
}
.gov__panel-foot-text small {
    display: block;
    font-size: 9.5px;
    color: var(--esds-gray-400);
    font-weight: 600;
    letter-spacing: 0.10em;
    margin-top: 4px;
}

@media (max-width: 992px) {
    .gov__hero-grid { grid-template-columns: 1fr; gap: 36px; }
    .gov__panel { max-width: 540px; margin: 0 auto; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §B · PROBLEM — 3 scenario cards + decision-paralysis paragraph + band
   ─────────────────────────────────────────────────────────────────────────── */
.gov__problem-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin-bottom: 24px;
}
.gov__problem {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 16px;
    padding: 28px 26px 24px;
    position: relative;
    overflow: hidden;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease);
}
.gov__problem::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(90deg, #dc2626, #f97316);
    border-radius: 16px 16px 0 0;
}
.gov__problem:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(220, 38, 38, 0.10);
}
.gov__problem-tag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.16em;
    color: #dc2626;
    text-transform: uppercase;
    margin-bottom: 12px;
    padding: 4px 9px;
    background: rgba(220, 38, 38, 0.06);
    border-radius: 4px;
}
.gov__problem-name {
    font-size: 18px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.4px;
    margin: 0 0 12px;
    line-height: 1.25;
}
.gov__problem-text {
    font-size: 13.5px;
    color: var(--esds-gray-600);
    line-height: 1.65;
    margin: 0;
}

.gov__paralysis {
    margin-bottom: 18px;
    padding: 22px 28px;
    background: var(--esds-gray-50);
    border: 1px solid var(--esds-gray-100);
    border-left: 4px solid #dc2626;
    border-radius: 12px;
    font-size: 14.5px;
    color: var(--esds-gray-700);
    line-height: 1.65;
    font-weight: 500;
}
.gov__paralysis strong {
    color: var(--esds-navy);
    font-weight: 700;
}

.gov__not-alone {
    padding: 26px 32px;
    background: linear-gradient(135deg, var(--esds-navy), var(--esds-deep));
    border-radius: 16px;
    color: #fff;
    font-size: 17px;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: -0.2px;
    position: relative;
    overflow: hidden;
    text-align: center;
}
.gov__not-alone::after {
    content: '';
    position: absolute;
    top: -60px; right: -60px;
    width: 220px; height: 220px;
    background: radial-gradient(circle, rgba(0, 97, 255, 0.30), transparent 65%);
    filter: blur(34px);
}
.gov__not-alone strong {
    background: linear-gradient(135deg, var(--highlight-blue-light), #fff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}

@media (max-width: 992px) {
    .gov__problem-grid { grid-template-columns: 1fr; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §C · SOLUTION FLOW — 5-node tricolor pipeline (flag homage)
   ─────────────────────────────────────────────────────────────────────────── */
.gov__flow {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    align-items: stretch;
    position: relative;
}
.gov__flow-node {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 12px;
    padding: 22px 18px;
    text-align: center;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease);
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
}
.gov__flow-node:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 38px rgba(0, 97, 255, 0.14);
}
.gov__flow-node::after {
    /* chevron between nodes */
    content: '';
    position: absolute;
    top: 50%;
    right: -14px;
    transform: translateY(-50%);
    width: 0; height: 0;
    border-left: 9px solid var(--esds-gray-300);
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    z-index: 2;
}
.gov__flow-node:last-child::after { display: none; }
.gov__flow-station {
    width: 36px; height: 36px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    margin: 0 auto 12px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.04em;
    color: #fff;
}
/* Tricolor station progression: saffron → saffron-soft → white-tinted → green-soft → green */
.gov__flow-node:nth-child(1) .gov__flow-station { background: linear-gradient(135deg, var(--india-saffron), #ea580c); }
.gov__flow-node:nth-child(2) .gov__flow-station { background: linear-gradient(135deg, #fb923c, #fdba74); }
.gov__flow-node:nth-child(3) .gov__flow-station { background: linear-gradient(135deg, #e2e8f0, #cbd5e1); color: var(--esds-navy); }
.gov__flow-node:nth-child(4) .gov__flow-station { background: linear-gradient(135deg, #86efac, #4ade80); color: #064e3b; }
.gov__flow-node:nth-child(5) .gov__flow-station { background: linear-gradient(135deg, var(--india-green), #047857); }
.gov__flow-text {
    font-size: 13px;
    font-weight: 700;
    color: var(--esds-navy);
    line-height: 1.4;
    letter-spacing: -0.2px;
    margin: 0;
}
.gov__flow-text em {
    font-style: normal;
    color: var(--highlight-blue);
    font-weight: 800;
}

@media (max-width: 1100px) { .gov__flow { grid-template-columns: repeat(2, 1fr); } .gov__flow-node::after { display: none; } }
@media (max-width: 540px)  { .gov__flow { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §D · HOW IT WORKS — 4 "stamped checklist" steps
   ─────────────────────────────────────────────────────────────────────────── */
.gov__steps {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
}
.gov__step {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 16px;
    padding: 28px 24px 22px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.gov__step:hover {
    transform: translateY(-5px);
    box-shadow: 0 22px 46px rgba(10, 22, 40, 0.10);
    border-color: rgba(0, 97, 255, 0.25);
}
.gov__step-seal {
    width: 56px; height: 56px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.10), rgba(126, 233, 255, 0.04));
    border: 2px solid rgba(0, 97, 255, 0.25);
    display: grid;
    place-items: center;
    color: var(--highlight-blue);
    font-family: 'JetBrains Mono', monospace;
    font-size: 18px;
    font-weight: 800;
    margin-bottom: 16px;
    position: relative;
}
.gov__step-seal::after {
    /* outer dashed ring (stamp aesthetic) */
    content: '';
    position: absolute;
    inset: -6px;
    border-radius: 50%;
    border: 1.5px dashed rgba(0, 97, 255, 0.20);
}
.gov__step-eyebrow {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.14em;
    color: var(--esds-gray-500);
    text-transform: uppercase;
    margin-bottom: 12px;
}
.gov__step-name {
    font-size: 16px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    margin: 0 0 10px;
    line-height: 1.3;
}
.gov__step-text {
    font-size: 13px;
    color: var(--esds-gray-600);
    line-height: 1.6;
    margin: 0 0 16px;
    flex-grow: 1;
}
.gov__step-text strong { color: var(--esds-navy); font-weight: 700; }
.gov__step-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: auto;
    padding: 6px 12px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.06), rgba(126, 233, 255, 0.03));
    border: 1px solid rgba(0, 97, 255, 0.18);
    border-radius: 8px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--highlight-blue);
    letter-spacing: 0.06em;
    align-self: flex-start;
}
.gov__step-pill::before { content: '▸ '; opacity: 0.55; }

@media (max-width: 992px) { .gov__steps { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .gov__steps { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §E · CAPABILITIES — 6 cards with 3-keyword tag bars
   ─────────────────────────────────────────────────────────────────────────── */
.gov__caps {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}
.gov__cap {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 16px;
    padding: 28px 26px 0;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.gov__cap::before {
    content: '';
    position: absolute;
    top: 0; right: 0;
    width: 110px; height: 110px;
    background: radial-gradient(circle at top right, rgba(0, 97, 255, 0.08), transparent 70%);
    opacity: 0;
    transition: opacity 0.35s;
}
.gov__cap:hover {
    transform: translateY(-5px);
    box-shadow: 0 22px 50px rgba(10, 22, 40, 0.10);
    border-color: rgba(0, 97, 255, 0.25);
}
.gov__cap:hover::before { opacity: 1; }
.gov__cap-icon {
    width: 56px; height: 56px;
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.12), rgba(126, 233, 255, 0.06));
    border: 1px solid rgba(0, 97, 255, 0.20);
    display: grid;
    place-items: center;
    color: var(--highlight-blue);
    margin-bottom: 18px;
    transition: transform 0.3s var(--esds-ease);
}
.gov__cap:hover .gov__cap-icon { transform: rotate(-6deg) scale(1.05); }
.gov__cap-icon svg { width: 28px; height: 28px; }
.gov__cap-name {
    font-size: 18px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.4px;
    margin: 0 0 10px;
    line-height: 1.25;
}
.gov__cap-text {
    font-size: 13px;
    color: var(--esds-gray-600);
    line-height: 1.65;
    margin: 0 0 18px;
    flex-grow: 1;
}
.gov__cap-text strong { color: var(--esds-navy); font-weight: 700; }
.gov__cap-keys {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 14px 0;
    border-top: 1px solid var(--esds-gray-100);
    margin-top: auto;
}
.gov__cap-key {
    padding: 4px 10px;
    background: var(--esds-gray-50);
    border: 1px solid var(--esds-gray-100);
    border-radius: 6px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 700;
    color: var(--esds-gray-700);
    letter-spacing: 0.04em;
    transition: background 0.25s, border-color 0.25s, color 0.25s;
}
.gov__cap:hover .gov__cap-key {
    background: rgba(0, 97, 255, 0.06);
    border-color: rgba(0, 97, 255, 0.20);
    color: var(--highlight-blue);
}

@media (max-width: 1100px) { .gov__caps { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px)  { .gov__caps { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §F · INSTITUTION FIT — 6-card 3×2 grid with hierarchy badges
   ─────────────────────────────────────────────────────────────────────────── */
.gov__inst-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}
.gov__inst {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 24px 24px 22px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.gov__inst::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 3px;
    background: linear-gradient(90deg, var(--india-saffron), var(--india-green));
    transform: scaleX(0.30);
    transform-origin: left;
    transition: transform 0.4s var(--esds-ease);
}
.gov__inst:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 38px rgba(0, 97, 255, 0.10);
    border-color: rgba(0, 97, 255, 0.20);
}
.gov__inst:hover::before { transform: scaleX(1); }
.gov__inst-level {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: 0.16em;
    color: var(--highlight-blue);
    text-transform: uppercase;
    margin-bottom: 12px;
    padding: 3px 9px;
    background: rgba(0, 97, 255, 0.06);
    border-radius: 4px;
    align-self: flex-start;
}
.gov__inst-name {
    font-size: 15.5px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    margin: 0 0 8px;
    line-height: 1.3;
}
.gov__inst-tagline {
    font-size: 13px;
    color: var(--highlight-blue);
    font-weight: 700;
    letter-spacing: -0.2px;
    margin: 0 0 10px;
    font-style: italic;
}
.gov__inst-text {
    font-size: 12.5px;
    color: var(--esds-gray-600);
    line-height: 1.6;
    margin: 0 0 14px;
    flex-grow: 1;
}
.gov__inst-text strong { color: var(--esds-navy); font-weight: 700; }
.gov__inst-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}
.gov__inst-tag {
    padding: 3px 8px;
    background: rgba(0, 97, 255, 0.06);
    border-radius: 4px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 700;
    color: var(--highlight-blue);
    letter-spacing: 0.04em;
}

@media (max-width: 1100px) { .gov__inst-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px)  { .gov__inst-grid { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §G · TRUST & PROCUREMENT — 2-col split (certs grid | guarantees) + CTA
   ─────────────────────────────────────────────────────────────────────────── */
.gov__trust-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 24px;
    margin-bottom: 28px;
}
.gov__trust-block {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 16px;
    padding: 24px 26px;
}
.gov__trust-block-label {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.18em;
    color: var(--highlight-blue-light);
    text-transform: uppercase;
    margin-bottom: 18px;
}
.gov__trust-block-label::before {
    content: '';
    width: 24px; height: 1px;
    background: var(--highlight-blue-light);
}
.gov__certs {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}
.gov__cert {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 10px 12px;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 8px;
    transition: border-color 0.3s, background 0.3s;
}
.gov__cert:hover {
    border-color: rgba(126, 233, 255, 0.30);
    background: rgba(0, 97, 255, 0.04);
}
.gov__cert-tick {
    width: 16px; height: 16px;
    border-radius: 50%;
    background: rgba(74, 222, 128, 0.18);
    color: #4ade80;
    display: grid;
    place-items: center;
    font-size: 9.5px;
    font-weight: 800;
    flex-shrink: 0;
}
.gov__cert-name {
    font-size: 11.5px;
    font-weight: 700;
    color: #fff;
    letter-spacing: -0.1px;
}

.gov__guarantees {
    display: grid;
    gap: 10px;
}
.gov__guarantee {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 12px;
    align-items: center;
    padding: 12px 14px;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 8px;
}
.gov__guarantee-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 16px;
    font-weight: 800;
    color: var(--highlight-blue-light);
    letter-spacing: -0.3px;
    line-height: 1;
    min-width: 60px;
}
.gov__guarantee-label {
    font-size: 11.5px;
    color: var(--esds-gray-300);
    font-weight: 600;
    line-height: 1.4;
}

.gov__trust-cta {
    padding: 22px 28px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.14), rgba(126, 233, 255, 0.06));
    border: 1px solid rgba(126, 233, 255, 0.25);
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
}
.gov__trust-cta-text {
    font-size: 16px;
    font-weight: 700;
    color: #fff;
    margin: 0;
}
.gov__trust-cta-text small {
    display: block;
    font-size: 12.5px;
    font-weight: 500;
    color: var(--esds-gray-400);
    margin-top: 4px;
}

@media (max-width: 992px) {
    .gov__trust-grid { grid-template-columns: 1fr; }
}
@media (max-width: 540px) {
    .gov__certs { grid-template-columns: 1fr; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §H · PROOF — 6 case study cards in 3×2 grid
   ─────────────────────────────────────────────────────────────────────────── */
.gov__proof-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}
.gov__proof {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 16px;
    padding: 26px 24px 22px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease);
}
.gov__proof::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 4px; height: 100%;
    background: linear-gradient(180deg, var(--highlight-blue), var(--highlight-blue-light));
}
.gov__proof:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 38px rgba(10, 22, 40, 0.10);
}
.gov__proof-stamp {
    position: absolute;
    top: 18px; right: 18px;
    padding: 4px 9px;
    background: rgba(0, 97, 255, 0.06);
    border: 1px solid rgba(0, 97, 255, 0.18);
    border-radius: 4px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.14em;
    text-transform: uppercase;
}
.gov__proof-tag {
    display: inline-flex;
    align-items: center;
    padding: 3px 9px;
    background: var(--esds-gray-50);
    border-radius: 4px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 700;
    color: var(--esds-gray-600);
    letter-spacing: 0.10em;
    text-transform: uppercase;
    margin-bottom: 10px;
    align-self: flex-start;
}
.gov__proof-name {
    font-size: 17px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.4px;
    margin: 0 0 8px;
    line-height: 1.25;
}
.gov__proof-headline {
    font-size: 14px;
    font-weight: 700;
    color: var(--highlight-blue);
    margin: 0 0 10px;
    line-height: 1.35;
    font-style: italic;
}
.gov__proof-text {
    font-size: 12.5px;
    color: var(--esds-gray-600);
    line-height: 1.6;
    margin: 0;
    flex-grow: 1;
}
.gov__proof-text strong { color: var(--esds-navy); font-weight: 700; }

@media (max-width: 1100px) { .gov__proof-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px)  { .gov__proof-grid { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §I · COMPETITIVE CLARITY — 2×2 risk cards with rotated stamps
   ─────────────────────────────────────────────────────────────────────────── */
.gov__risks {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
    margin-bottom: 24px;
}
.gov__risk {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 16px;
    padding: 28px 28px 26px;
    position: relative;
    overflow: hidden;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease);
}
.gov__risk:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(10, 22, 40, 0.08);
}
.gov__risk-stamp {
    position: absolute;
    top: 22px; right: 22px;
    padding: 5px 12px;
    background: rgba(220, 38, 38, 0.06);
    border: 2px solid rgba(220, 38, 38, 0.30);
    border-radius: 4px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: #dc2626;
    letter-spacing: 0.18em;
    transform: rotate(6deg);
    text-transform: uppercase;
}
.gov__risk-name {
    font-size: 19px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.5px;
    margin: 0 0 14px;
    line-height: 1.25;
    padding-right: 80px;
}
.gov__risk-foreign {
    margin-bottom: 14px;
    padding: 14px 16px;
    background: rgba(220, 38, 38, 0.04);
    border-left: 3px solid #dc2626;
    border-radius: 0 8px 8px 0;
    font-size: 13px;
    color: var(--esds-gray-700);
    line-height: 1.6;
}
.gov__risk-foreign-label {
    display: block;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: #dc2626;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 6px;
}
.gov__risk-arrow {
    text-align: center;
    margin: -2px 0 6px;
    color: var(--highlight-blue);
    font-size: 18px;
    line-height: 1;
}
.gov__risk-esds {
    padding: 14px 16px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.06), rgba(126, 233, 255, 0.02));
    border-left: 3px solid var(--highlight-blue);
    border-radius: 0 8px 8px 0;
    font-size: 13.5px;
    color: var(--esds-navy);
    line-height: 1.6;
    font-weight: 600;
}
.gov__risk-esds-label {
    display: block;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 6px;
}
.gov__risk-esds strong {
    color: var(--highlight-blue);
    font-weight: 800;
}

.gov__risks-conclusion {
    padding: 24px 32px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.06), rgba(126, 233, 255, 0.02));
    border: 1px solid rgba(0, 97, 255, 0.20);
    border-left: 4px solid var(--highlight-blue);
    border-radius: 12px;
    font-size: 16px;
    color: var(--esds-navy);
    font-weight: 600;
    line-height: 1.6;
    letter-spacing: -0.2px;
    margin-bottom: 14px;
}
.gov__risks-conclusion strong {
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.gov__risks-tagline {
    text-align: center;
    font-size: 14px;
    color: var(--esds-gray-600);
    font-weight: 600;
    line-height: 1.55;
    padding: 0 20px;
}
.gov__risks-tagline strong {
    color: var(--esds-navy);
    font-weight: 800;
}

@media (max-width: 992px) { .gov__risks { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §K · CLOSING CTA — trust extras strip with 4 ✓-cells
   ─────────────────────────────────────────────────────────────────────────── */
.gov__cta-trust-strip {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-top: 32px;
    padding: 18px 22px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(126, 233, 255, 0.20);
    border-radius: 12px;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.gov__cta-trust-cell {
    display: flex;
    align-items: center;
    gap: 10px;
    text-align: left;
    border-right: 1px solid rgba(255, 255, 255, 0.06);
    padding-right: 14px;
}
.gov__cta-trust-cell:last-child { border-right: 0; }
.gov__cta-trust-tick {
    width: 26px; height: 26px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 14px;
    font-weight: 800;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(0, 97, 255, 0.40);
}
.gov__cta-trust-text {
    font-size: 12.5px;
    font-weight: 600;
    color: #fff;
    line-height: 1.3;
    letter-spacing: -0.2px;
}

@media (max-width: 768px) {
    .gov__cta-trust-strip { grid-template-columns: repeat(2, 1fr); }
    .gov__cta-trust-cell { border-right: 0; padding-right: 0; }
}





  /* ═══════════════════════════════════════════════════════════════════
     §1 · HERO
  ═══════════════════════════════════════════════════════════════════ */
  .news__hero-sub {
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(15px, 1.8vw, 19px);
    font-weight: 700;
    color: var(--highlight-blue-light);
    margin: 0 0 28px;
    letter-spacing: -0.2px;
    line-height: 1.4;
    font-style: italic;
  }
  .news__hero-sub::before {
    content: '◆';
    color: var(--india-saffron);
    margin-right: 10px;
    font-size: 0.8em;
    vertical-align: middle;
    font-style: normal;
  }
  /* Live news ticker badge */
  .news__live-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(220,38,38,0.12);
    border: 1px solid rgba(239,68,68,0.4);
    padding: 6px 14px;
    border-radius: 100px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: #FCA5A5;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 18px;
  }
  .news__live-badge::before {
    content: '';
    width: 8px; height: 8px;
    border-radius: 50%;
    background: #EF4444;
    box-shadow: 0 0 0 0 rgba(239,68,68,0.6);
    animation: news-live-pulse 1.6s ease-in-out infinite;
  }
  @keyframes news-live-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(239,68,68,0.6); }
    50%      { box-shadow: 0 0 0 7px rgba(239,68,68,0); }
  }


  /* ═══════════════════════════════════════════════════════════════════
     §2 · NEWS GRID — filterable cards with media outlet logo zone
  ═══════════════════════════════════════════════════════════════════ */
  .news__intro {
    font-size: 16px;
    line-height: 1.7;
    color: var(--esds-gray-500);
    max-width: 820px;
    margin: 0 auto 36px;
    text-align: center;
  }
  .news__intro strong { color: var(--esds-navy); font-weight: 700; }

  /* Filter chips */
  .news__filters {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin: 0 auto 48px;
    max-width: 880px;
  }
  .news__filter {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 18px;
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 100px;
    font-size: 12.5px;
    font-weight: 800;
    color: var(--esds-gray-700);
    cursor: pointer;
    transition: all 0.25s var(--esds-ease);
    font-family: inherit;
  }
  .news__filter:hover {
    border-color: var(--highlight-blue);
    color: var(--highlight-blue);
    transform: translateY(-2px);
  }
  .news__filter.is-active {
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    border-color: transparent;
    color: #fff;
    box-shadow: 0 6px 18px rgba(0,97,255,0.25);
  }
  .news__filter__count {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    background: rgba(255,255,255,0.18);
    padding: 2px 6px;
    border-radius: 100px;
    letter-spacing: 0.05em;
  }
  .news__filter:not(.is-active) .news__filter__count {
    background: var(--esds-gray-100);
    color: var(--esds-gray-500);
  }

  /* News card grid */
  .news__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
  }
  @media (max-width: 1100px) { .news__grid { grid-template-columns: repeat(2, 1fr); } }
  @media (max-width: 640px)  { .news__grid { grid-template-columns: 1fr; } }

  .news__card {
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 18px;
    overflow: hidden;
    transition: all 0.4s var(--esds-ease);
    text-decoration: none;
    display: flex;
    flex-direction: column;
    position: relative;
  }
  .news__card:hover {
    transform: translateY(-6px);
    border-color: var(--highlight-blue);
    box-shadow: 0 18px 44px rgba(0,97,255,0.10);
  }
  .news__card.is-hidden {
    opacity: 0;
    pointer-events: none;
    transform: scale(0.95);
    height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    overflow: hidden;
  }
  /* Top zone — gradient with media outlet "logo" + category */
  .news__card__top {
    aspect-ratio: 16/9;
    position: relative;
    display: grid;
    place-items: center;
    overflow: hidden;
    color: #fff;
    transition: all 0.4s var(--esds-ease);
  }
  .news__card__top::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
      linear-gradient(rgba(255,255,255,0.05) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,0.05) 1px, transparent 1px);
    background-size: 22px 22px;
    pointer-events: none;
    opacity: 0.5;
  }
  .news__card__top::after {
    content: '';
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 220px; height: 220px;
    background: radial-gradient(circle, rgba(255,255,255,0.18), transparent 70%);
    pointer-events: none;
  }
  .news__card:hover .news__card__top { transform: scale(1.02); }
  .news__card__outlet {
    position: relative;
    z-index: 2;
    text-align: center;
    transition: transform 0.4s var(--esds-ease);
  }
  .news__card:hover .news__card__outlet { transform: scale(1.05); }
  .news__card__outlet-name {
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(20px, 2.6vw, 28px);
    font-weight: 800;
    letter-spacing: -1px;
    line-height: 1;
    text-shadow: 0 2px 12px rgba(0,0,0,0.2);
  }
  .news__card__outlet-tag {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.16em;
    margin-top: 6px;
    opacity: 0.85;
    text-transform: uppercase;
  }
  /* Category pill on top-left of top zone */
  .news__card__cat {
    position: absolute;
    top: 14px; left: 14px;
    background: rgba(0,0,0,0.4);
    backdrop-filter: blur(6px);
    color: #fff;
    padding: 4px 12px;
    border-radius: 100px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    z-index: 2;
    border: 1px solid rgba(255,255,255,0.18);
  }
  .news__card__date {
    position: absolute;
    top: 14px; right: 14px;
    background: rgba(0,0,0,0.4);
    backdrop-filter: blur(6px);
    color: #fff;
    padding: 4px 12px;
    border-radius: 100px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.06em;
    z-index: 2;
    border: 1px solid rgba(255,255,255,0.18);
  }
  /* Body */
  .news__card__body {
    padding: 22px 24px 24px;
    display: flex;
    flex-direction: column;
    flex: 1;
  }
  .news__card__title {
    font-size: 16px;
    font-weight: 800;
    color: var(--esds-navy);
    line-height: 1.35;
    letter-spacing: -0.3px;
    margin: 0 0 10px;
  }
  .news__card__excerpt {
    font-size: 13px;
    color: var(--esds-gray-500);
    line-height: 1.6;
    margin: 0 0 14px;
    flex: 1;
  }
  .news__card__excerpt strong {
    color: var(--esds-navy);
    font-weight: 700;
  }
  .news__card__cta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--highlight-blue);
    font-size: 12.5px;
    font-weight: 800;
    transition: gap 0.25s ease;
    padding-top: 12px;
    border-top: 1px dashed var(--esds-gray-100);
  }
  .news__card__cta::after { content: '→'; }
  .news__card:hover .news__card__cta { gap: 10px; }

  /* Outlet color variants */
  .news__card--et       { --news-c1: #C2410C; --news-c2: #FF6B35; }
  .news__card--cio      { --news-c1: #6D28D9; --news-c2: #A78BFA; }
  .news__card--var      { --news-c1: #B91C1C; --news-c2: #EF4444; }
  .news__card--bw       { --news-c1: #1E40AF; --news-c2: var(--highlight-blue); }
  .news__card--cnbc     { --news-c1: #B45309; --news-c2: #F59E0B; }
  .news__card--bs       { --news-c1: var(--esds-navy); --news-c2: #1E293B; }
  .news__card--mint     { --news-c1: #047857; --news-c2: #10B981; }
  .news__card--toi      { --news-c1: #DC2626; --news-c2: #B91C1C; }
  .news__card--dq       { --news-c1: #0F766E; --news-c2: #14B8A6; }
  .news__card .news__card__top { background: linear-gradient(135deg, var(--news-c1, var(--highlight-blue)), var(--news-c2, var(--highlight-blue-light))); }


  /* ═══════════════════════════════════════════════════════════════════
     §3 · FEATURED STORY — magazine hero card
  ═══════════════════════════════════════════════════════════════════ */
  .news__featured {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 0;
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 22px;
    overflow: hidden;
    transition: all 0.4s var(--esds-ease);
  }
  .news__featured:hover {
    transform: translateY(-4px);
    border-color: var(--highlight-blue);
    box-shadow: 0 22px 56px rgba(0,97,255,0.12);
  }
  @media (max-width: 900px) {
    .news__featured { grid-template-columns: 1fr; }
  }
  .news__featured__visual {
    aspect-ratio: 16/10;
    background: linear-gradient(135deg, var(--esds-navy), var(--highlight-blue));
    position: relative;
    overflow: hidden;
    display: grid;
    place-items: center;
    color: #fff;
    padding: 32px;
  }
  .news__featured__visual::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
      linear-gradient(rgba(126,233,255,0.06) 1px, transparent 1px),
      linear-gradient(90deg, rgba(126,233,255,0.06) 1px, transparent 1px);
    background-size: 32px 32px;
  }
  .news__featured__visual::after {
    content: '';
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 360px; height: 360px;
    background: radial-gradient(circle, rgba(126,233,255,0.2), transparent 70%);
  }
  .news__featured__brand {
    position: relative;
    z-index: 2;
    text-align: center;
  }
  .news__featured__brand-name {
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(28px, 4vw, 40px);
    font-weight: 800;
    letter-spacing: -1.5px;
    line-height: 1;
    color: var(--highlight-blue-light);
    text-shadow: 0 2px 16px rgba(0,0,0,0.3);
  }
  .news__featured__brand-tag {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.16em;
    margin-top: 10px;
    color: #fff;
    opacity: 0.9;
  }
  .news__featured__pill {
    position: absolute;
    top: 20px; left: 20px;
    background: rgba(255,107,53,0.15);
    border: 1px solid rgba(255,107,53,0.5);
    color: #FFB89E;
    padding: 5px 14px;
    border-radius: 100px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.12em;
    z-index: 3;
    text-transform: uppercase;
  }
  .news__featured__pill::before {
    content: '★ ';
    color: var(--india-saffron);
  }
  .news__featured__body {
    padding: 36px 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 14px;
  }
  .news__featured__meta {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--esds-gray-400);
    letter-spacing: 0.14em;
    text-transform: uppercase;
  }
  .news__featured__title {
    font-size: clamp(22px, 2.6vw, 30px);
    font-weight: 800;
    color: var(--esds-navy);
    line-height: 1.25;
    letter-spacing: -0.5px;
    margin: 0;
  }
  .news__featured__title em {
    font-style: italic;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
  }
  .news__featured__excerpt {
    font-size: 14.5px;
    color: var(--esds-gray-500);
    line-height: 1.7;
    margin: 0;
  }
  .news__featured__excerpt strong { color: var(--esds-navy); font-weight: 700; }
  .news__featured__cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 4px;
    padding: 12px 22px;
    background: var(--highlight-blue);
    color: #fff;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
    transition: all 0.25s var(--esds-ease);
    align-self: flex-start;
  }
  .news__featured__cta:hover {
    background: var(--esds-navy);
    transform: translateY(-2px);
    color: #fff;
    box-shadow: 0 10px 26px rgba(0,97,255,0.25);
  }


  /* ═══════════════════════════════════════════════════════════════════
     §4 · EVENTS — Upcoming + Past 2-column split
  ═══════════════════════════════════════════════════════════════════ */
  .news__events-intro {
    font-size: 16px;
    line-height: 1.7;
    color: var(--esds-gray-500);
    max-width: 820px;
    margin: 0 auto 48px;
    text-align: center;
  }
  .news__events-intro strong { color: var(--esds-navy); font-weight: 700; }
  .news__events-intro em {
    font-style: italic;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
  }
  .news__events-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
  }
  @media (max-width: 920px) { .news__events-split { grid-template-columns: 1fr; } }

  .news__events-col-head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
    padding-bottom: 14px;
    border-bottom: 2px solid var(--esds-gray-100);
  }
  .news__events-col-head__icon {
    width: 36px; height: 36px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    color: #fff;
    flex-shrink: 0;
  }
  .news__events-col-head__icon--up { background: linear-gradient(135deg, var(--india-saffron), #FF8856); box-shadow: 0 4px 12px rgba(255,107,53,0.30); }
  .news__events-col-head__icon--past { background: linear-gradient(135deg, var(--esds-gray-500), var(--esds-gray-400)); }
  .news__events-col-head__icon svg { width: 18px; height: 18px; }
  .news__events-col-head h3 {
    font-size: 18px;
    font-weight: 800;
    color: var(--esds-navy);
    margin: 0;
    letter-spacing: -0.3px;
    flex: 1;
  }
  .news__events-col-head__count {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--esds-gray-400);
    letter-spacing: 0.12em;
  }

  .news__events-list {
    display: grid;
    gap: 14px;
  }
  .news__event {
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 18px 20px 18px 24px;
    display: grid;
    grid-template-columns: 64px 1fr;
    gap: 16px;
    align-items: center;
    transition: all 0.3s var(--esds-ease);
    position: relative;
    overflow: hidden;
  }
  .news__event::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 4px;
    background: linear-gradient(180deg, var(--india-saffron), #FF8856);
    transform: scaleY(0.3);
    transform-origin: top;
    transition: transform 0.4s var(--esds-ease);
  }
  .news__event:hover {
    transform: translateX(4px);
    border-color: var(--india-saffron);
    box-shadow: 0 10px 24px rgba(255,107,53,0.10);
  }
  .news__event:hover::before { transform: scaleY(1); }
  .news__event--past::before { background: linear-gradient(180deg, var(--esds-gray-400), var(--esds-gray-500)); }
  .news__event--past:hover { border-color: var(--esds-gray-300); box-shadow: 0 10px 24px rgba(10,22,40,0.06); }

  .news__event__date {
    text-align: center;
    background: linear-gradient(135deg, rgba(255,107,53,0.08), rgba(244,166,35,0.06));
    border: 1.5px solid rgba(255,107,53,0.2);
    border-radius: 10px;
    padding: 8px 6px;
    flex-shrink: 0;
  }
  .news__event--past .news__event__date {
    background: var(--esds-gray-50);
    border-color: var(--esds-gray-100);
  }
  .news__event__date-day {
    font-family: 'JetBrains Mono', monospace;
    font-size: 22px;
    font-weight: 800;
    line-height: 1;
    color: var(--india-saffron);
  }
  .news__event--past .news__event__date-day { color: var(--esds-gray-500); }
  .news__event__date-month {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: var(--esds-gray-500);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-top: 2px;
  }
  .news__event__body {
    min-width: 0;
  }
  .news__event__type {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 4px;
  }
  .news__event--past .news__event__type { color: var(--esds-gray-400); }
  .news__event__title {
    font-size: 14.5px;
    font-weight: 800;
    color: var(--esds-navy);
    line-height: 1.3;
    letter-spacing: -0.2px;
    margin: 0 0 4px;
  }
  .news__event__loc {
    font-size: 12px;
    color: var(--esds-gray-500);
    line-height: 1.4;
  }
  .news__event__loc::before {
    content: '📍';
    margin-right: 4px;
  }
  /* Live status pulse for currently-running events */
  .news__event__live {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    background: rgba(16,185,129,0.10);
    border: 1px solid rgba(16,185,129,0.3);
    color: var(--esds-green);
    padding: 2px 8px;
    border-radius: 100px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.1em;
    margin-left: 6px;
    text-transform: uppercase;
  }
  .news__event__live::before {
    content: '';
    width: 5px; height: 5px;
    border-radius: 50%;
    background: var(--esds-green);
    box-shadow: 0 0 0 0 rgba(16,185,129,0.6);
    animation: news-live-pulse 1.4s ease-in-out infinite;
  }


  /* ═══════════════════════════════════════════════════════════════════
     §5 · MEDIA OUTLET WALL — partner-wall reuse with custom tile
  ═══════════════════════════════════════════════════════════════════ */
  .news__media-intro {
    font-size: 16px;
    line-height: 1.7;
    color: var(--esds-gray-500);
    max-width: 820px;
    margin: 0 auto 36px;
    text-align: center;
  }
  .news__media-intro strong { color: var(--esds-navy); font-weight: 700; }
  .news__media-tile {
    background: linear-gradient(180deg, #fff, var(--esds-gray-50));
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 18px 22px;
    text-align: center;
    transition: all 0.3s var(--esds-ease);
    min-width: 160px;
    flex: 0 0 auto;
  }
  .news__media-tile:hover {
    border-color: var(--highlight-blue);
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(0,97,255,0.08);
  }
  .news__media-tile__name {
    font-family: 'JetBrains Mono', monospace;
    font-size: 13.5px;
    font-weight: 800;
    color: var(--esds-navy);
    line-height: 1.25;
    letter-spacing: -0.3px;
  }
  .news__media-tile__count {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-top: 5px;
  }


  /* ═══════════════════════════════════════════════════════════════════
     §6 · NEWSLETTER SIGNUP — interactive email form mock
  ═══════════════════════════════════════════════════════════════════ */
  .news__signup {
    max-width: 620px;
    margin: 32px auto 0;
  }
  .news__signup-form {
    display: flex;
    gap: 8px;
    background: rgba(255,255,255,0.05);
    border: 1.5px solid rgba(126,233,255,0.18);
    border-radius: 14px;
    padding: 6px;
    transition: all 0.3s var(--esds-ease);
  }
  .news__signup-form:focus-within {
    border-color: var(--highlight-blue-light);
    box-shadow: 0 0 0 4px rgba(0,97,255,0.15);
  }
  .news__signup-input {
    flex: 1;
    background: transparent;
    border: 0;
    color: #fff;
    padding: 14px 18px;
    font-size: 14px;
    font-family: inherit;
    outline: 0;
  }
  .news__signup-input::placeholder {
    color: rgba(255,255,255,0.5);
  }
  .news__signup-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 22px;
    background: var(--highlight-blue);
    color: #fff;
    border: 0;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 800;
    font-family: inherit;
    cursor: pointer;
    transition: all 0.25s var(--esds-ease);
    white-space: nowrap;
  }
  .news__signup-btn:hover {
    background: var(--highlight-blue-light);
    color: var(--esds-navy);
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(126,233,255,0.3);
  }
  .news__signup-note {
    text-align: center;
    margin-top: 16px;
    font-size: 11.5px;
    color: var(--esds-gray-300);
    font-family: 'JetBrains Mono', monospace;
    letter-spacing: 0.06em;
  }


  /* ═══════════════════════════════════════════════════════════════════
     §7 · CTA pre-tagline
  ═══════════════════════════════════════════════════════════════════ */
  .news__cta-pre {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--highlight-blue-light);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 14px;
    display: inline-block;
    position: relative;
    z-index: 2;
  }
  .news__cta-pre::before, .news__cta-pre::after {
    content: '';
    display: inline-block;
    width: 24px; height: 1px;
    background: var(--highlight-blue-light);
    vertical-align: middle;
    opacity: 0.5;
    margin: 0 10px;
  }
  
  
  
/* ═══════════════════════════════════════════════════════════════════════════
   INV · INVESTOR RELATIONS — Tabbed hub layout (inv__ prefix)
   Reference design: 2-column with sticky sidebar nav + right detail panel.
   Only ONE section visible at a time → minimum scroll, no box stacking.
   ═══════════════════════════════════════════════════════════════════════════ */


/* ───────────────────────────────────────────────────────────────────────────
   §A · HUB LAYOUT — 2-column grid (sidebar + content panel)
   ─────────────────────────────────────────────────────────────────────────── */
.inv__hub {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: 24px;
    align-items: start;
    margin: 0 auto;
    max-width: 1280px;
    padding: 0 4px;
}

/* ── Sidebar ───────────────────────────────────────────────────────────── */
.inv__nav {
    position: sticky;
    top: 88px;
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 18px;
    padding: 22px 4px 22px 0;
    max-height: calc(100vh - 110px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-shadow: 0 8px 28px rgba(10, 22, 40, 0.04);
}
.inv__nav-head {
    padding: 0 26px 16px;
    border-bottom: 1px solid var(--esds-gray-100);
    flex-shrink: 0;
    margin-right: 4px;
}
.inv__nav-eyebrow {
    display: block;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 10px;
}
.inv__nav-title {
    font-size: 16px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    margin: 0;
    line-height: 1.3;
}
.inv__nav-list {
    list-style: none;
    margin: 8px 0 0;
    padding: 0;
    overflow-y: auto;
    overflow-x: hidden;
    flex: 1;
    scrollbar-width: thin;
    scrollbar-color: var(--esds-gray-200) transparent;
}
.inv__nav-list::-webkit-scrollbar { width: 6px; }
.inv__nav-list::-webkit-scrollbar-track { background: transparent; }
.inv__nav-list::-webkit-scrollbar-thumb {
    background: var(--esds-gray-200);
    border-radius: 3px;
}
.inv__nav-list::-webkit-scrollbar-thumb:hover {
    background: var(--esds-gray-300);
}
.inv__nav-item {
    display: grid;
    grid-template-columns: 36px 1fr auto;
    column-gap: 14px;
    align-items: start;
    padding: 14px 22px;
    cursor: pointer;
    border: 0;
    background: transparent;
    width: 100%;
    text-align: left;
    font-family: inherit;
    border-left: 3px solid transparent;
    transition: background 0.2s, border-color 0.2s;
    border-bottom: 1px solid var(--esds-gray-100);
    margin-right: 4px;
}
.inv__nav-list li:last-child .inv__nav-item { border-bottom: 0; }
.inv__nav-item:hover {
    background: rgba(0, 97, 255, 0.025);
}
.inv__nav-item.is-active {
    background: linear-gradient(90deg, rgba(0, 97, 255, 0.05), transparent);
    border-left-color: var(--highlight-blue);
}
.inv__nav-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.04em;
    padding-top: 2px;
}
.inv__nav-item.is-active .inv__nav-num { color: var(--highlight-blue); }
.inv__nav-text { min-width: 0; }
.inv__nav-name {
    font-size: 14px;
    font-weight: 700;
    color: var(--esds-navy);
    letter-spacing: -0.2px;
    line-height: 1.3;
    margin: 0 0 4px;
    word-wrap: break-word;
}
.inv__nav-meta {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 600;
    color: var(--esds-gray-500);
    letter-spacing: 0.04em;
    line-height: 1.4;
    margin: 0;
}
.inv__nav-pill {
    flex-shrink: 0;
    margin-top: 2px;
    padding: 3px 10px;
    background: rgba(255, 153, 51, 0.10);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    white-space: nowrap;
    line-height: 1.4;
}
.inv__nav-pill--gated {
    background: rgba(220, 38, 38, 0.08);
    color: #dc2626;
}
.inv__nav-pill--blue {
    background: rgba(0, 97, 255, 0.08);
    color: var(--highlight-blue);
}

/* ── Content panel ──────────────────────────────────────────────────────── */
.inv__panel {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 18px;
    padding: 38px 44px 44px;
    min-height: 540px;
    box-shadow: 0 8px 28px rgba(10, 22, 40, 0.04);
}
.inv__view {
    display: none;
    animation: inv-fade-in 0.32s var(--esds-ease);
}
.inv__view.is-active { display: block; }
@keyframes inv-fade-in {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: translateY(0); }
}

.inv__view-eyebrow {
    display: block;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 12px;
}
.inv__view-title {
    font-size: 32px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.8px;
    margin: 0 0 12px;
    line-height: 1.15;
}
.inv__view-title em {
    font-style: italic;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.inv__view-sub {
    font-family: 'JetBrains Mono', monospace;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--esds-gray-500);
    letter-spacing: 0.04em;
    line-height: 1.5;
    margin: 0 0 24px;
}
.inv__view-sub strong { color: var(--esds-navy); font-weight: 800; }
.inv__view-rule {
    height: 1px;
    background: linear-gradient(90deg, var(--esds-gray-100), transparent);
    margin: 0 0 28px;
}

@media (max-width: 992px) {
    .inv__hub { grid-template-columns: 1fr; }
    .inv__nav {
        position: relative;
        top: 0;
        max-height: none;
    }
    .inv__nav-list { max-height: 380px; }
    .inv__panel { padding: 30px 26px 32px; }
    .inv__view-title { font-size: 26px; }
}


/* ───────────────────────────────────────────────────────────────────────────
   DOC ROW — used inside views
   ─────────────────────────────────────────────────────────────────────────── */
.inv__doc-row {
    display: grid;
    grid-template-columns: 64px 1fr auto;
    gap: 22px;
    align-items: center;
    padding: 18px 22px;
    border: 1px solid var(--esds-gray-100);
    border-radius: 14px;
    margin-bottom: 14px;
    transition: transform 0.25s var(--esds-ease), border-color 0.25s var(--esds-ease), box-shadow 0.25s var(--esds-ease);
}
.inv__doc-row:last-child { margin-bottom: 0; }
.inv__doc-row:hover {
    transform: translateY(-2px);
    border-color: rgba(0, 97, 255, 0.18);
    box-shadow: 0 12px 28px rgba(0, 97, 255, 0.06);
}

.inv__pdf-thumb {
    width: 64px; height: 80px;
    background: linear-gradient(135deg, #ef4444, #dc2626);
    border-radius: 4px 8px 8px 4px;
    color: #fff;
    display: grid;
    place-items: center;
    position: relative;
    flex-shrink: 0;
    box-shadow: 0 6px 16px rgba(220, 38, 38, 0.20);
}
.inv__pdf-thumb::before {
    content: '';
    position: absolute;
    top: 0; right: 0;
    width: 14px; height: 14px;
    background: #fff;
    clip-path: polygon(0 0, 100% 100%, 0 100%);
    opacity: 0.30;
}
.inv__pdf-thumb-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.10em;
}

.inv__doc-name {
    font-size: 16px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    line-height: 1.3;
    margin: 0 0 4px;
}
.inv__doc-name strong { color: var(--esds-navy); font-weight: 800; }
.inv__doc-meta {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11.5px;
    font-weight: 600;
    color: var(--esds-gray-500);
    letter-spacing: 0.02em;
    line-height: 1.5;
    margin: 0;
}

.inv__btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 20px;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    text-decoration: none;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: -0.1px;
    box-shadow: 0 6px 18px rgba(0, 97, 255, 0.30);
    transition: transform 0.2s var(--esds-ease), box-shadow 0.2s var(--esds-ease);
    cursor: pointer;
    border: 0;
    font-family: inherit;
    white-space: nowrap;
}
.inv__btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 26px rgba(0, 97, 255, 0.40);
}
.inv__btn--gated {
    background: linear-gradient(135deg, var(--india-saffron), #ffb84d);
    box-shadow: 0 6px 18px rgba(255, 153, 51, 0.30);
}
.inv__btn--gated:hover {
    box-shadow: 0 10px 26px rgba(255, 153, 51, 0.40);
}
.inv__btn--ghost {
    background: transparent;
    color: var(--highlight-blue);
    border: 1.5px solid rgba(0, 97, 255, 0.25);
    box-shadow: none;
}
.inv__btn--ghost:hover {
    background: rgba(0, 97, 255, 0.04);
    border-color: var(--highlight-blue);
    box-shadow: 0 4px 12px rgba(0, 97, 255, 0.10);
}
.inv__btn svg { width: 14px; height: 14px; }

@media (max-width: 640px) {
    .inv__doc-row { grid-template-columns: 56px 1fr; }
    .inv__pdf-thumb { width: 56px; height: 70px; }
    .inv__btn { grid-column: 1 / -1; justify-self: stretch; justify-content: center; }
}


/* ───────────────────────────────────────────────────────────────────────────
   GATED VIEW — DRHP / AVO disclaimer summary
   ─────────────────────────────────────────────────────────────────────────── */
.inv__gated-strip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    background: rgba(220, 38, 38, 0.06);
    border: 1px solid rgba(220, 38, 38, 0.20);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: #dc2626;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 18px;
}
.inv__gated-strip::before { content: '⚠'; font-size: 13px; }
.inv__gated-summary {
    font-size: 14.5px;
    color: var(--esds-gray-700);
    line-height: 1.7;
    margin: 0 0 24px;
    max-width: 760px;
}
.inv__gated-summary strong { color: var(--esds-navy); font-weight: 700; }
.inv__gated-summary em {
    font-style: normal;
    color: #dc2626;
    font-weight: 700;
}

.inv__avo-videos {
    display: none;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    margin-top: 18px;
    padding-top: 22px;
    border-top: 1px dashed var(--esds-gray-200);
}
.inv__avo-videos.is-shown { display: grid; }
.inv__avo-video-frame {
    aspect-ratio: 16 / 9;
    background: linear-gradient(135deg, var(--esds-navy), var(--esds-deep));
    border-radius: 12px;
    position: relative;
    display: grid;
    place-items: center;
    overflow: hidden;
    cursor: pointer;
    transition: transform 0.3s var(--esds-ease);
}
.inv__avo-video-frame:hover { transform: translateY(-3px); }
.inv__avo-video-frame::after {
    content: '';
    position: absolute;
    top: -60px; right: -60px;
    width: 200px; height: 200px;
    background: radial-gradient(circle, rgba(0, 97, 255, 0.30), transparent 65%);
    filter: blur(34px);
}
.inv__avo-play {
    width: 56px; height: 56px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.95);
    color: var(--esds-navy);
    display: grid;
    place-items: center;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.30);
    position: relative;
    z-index: 1;
}
.inv__avo-play svg { width: 22px; height: 22px; margin-left: 3px; }
.inv__avo-video-cap {
    margin-top: 10px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: 0.10em;
    text-transform: uppercase;
}
.inv__avo-video-cap small {
    display: block;
    color: var(--india-saffron);
    font-size: 9.5px;
    font-weight: 700;
    margin-top: 2px;
    letter-spacing: 0.14em;
}

@media (max-width: 540px) { .inv__avo-videos { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   SUB-GROUP — used by Annual Reports / Notices / Financials
   ─────────────────────────────────────────────────────────────────────────── */
.inv__subgroup {
    margin-bottom: 28px;
}
.inv__subgroup:last-child { margin-bottom: 0; }
.inv__subgroup-head {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 10px;
    margin-bottom: 6px;
    border-bottom: 1px solid var(--esds-gray-100);
}
.inv__subgroup-name {
    font-size: 14.5px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.2px;
    margin: 0;
    line-height: 1.3;
}
.inv__subgroup-name small {
    display: block;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--esds-gray-500);
    letter-spacing: 0.04em;
    margin-top: 2px;
    text-transform: uppercase;
}
.inv__subgroup-count {
    margin-left: auto;
    padding: 3px 10px;
    background: rgba(0, 97, 255, 0.06);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.10em;
    text-transform: uppercase;
}

.inv__row {
    display: grid;
    grid-template-columns: 36px 1fr auto;
    gap: 14px;
    align-items: center;
    padding: 12px 0;
    border-bottom: 1px solid var(--esds-gray-100);
    transition: background 0.2s, padding-left 0.25s var(--esds-ease);
}
.inv__row:last-child { border-bottom: 0; }
.inv__row:hover {
    padding-left: 8px;
    background: linear-gradient(90deg, rgba(0, 97, 255, 0.025), transparent);
}
.inv__row-pdf {
    width: 32px; height: 38px;
    background: linear-gradient(135deg, #ef4444, #dc2626);
    border-radius: 3px 5px 5px 3px;
    color: #fff;
    display: grid;
    place-items: center;
    flex-shrink: 0;
    font-family: 'JetBrains Mono', monospace;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 0.06em;
    box-shadow: 0 3px 8px rgba(220, 38, 38, 0.18);
}
.inv__row-name {
    font-size: 13.5px;
    font-weight: 600;
    color: var(--esds-gray-700);
    letter-spacing: -0.1px;
    line-height: 1.4;
    margin: 0;
}
.inv__row-name strong { color: var(--esds-navy); font-weight: 800; }
.inv__row-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    background: rgba(0, 97, 255, 0.06);
    border: 1px solid rgba(0, 97, 255, 0.18);
    color: var(--highlight-blue);
    text-decoration: none;
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 700;
    transition: all 0.2s var(--esds-ease);
}
.inv__row-btn:hover {
    background: var(--highlight-blue);
    color: #fff;
    border-color: var(--highlight-blue);
    transform: translateY(-1px);
}
.inv__row-btn svg { width: 11px; height: 11px; }

@media (max-width: 640px) {
    .inv__row { grid-template-columns: 32px 1fr; }
    .inv__row-btn { grid-column: 1 / -1; justify-self: stretch; justify-content: center; }
}


/* ───────────────────────────────────────────────────────────────────────────
   POLICIES — searchable open list
   ─────────────────────────────────────────────────────────────────────────── */
.inv__search {
    position: relative;
    margin-bottom: 18px;
}
.inv__search input {
    width: 100%;
    padding: 12px 16px 12px 42px;
    background: var(--esds-gray-50);
    border: 1px solid var(--esds-gray-100);
    border-radius: 999px;
    font-size: 13.5px;
    font-family: inherit;
    color: var(--esds-navy);
    transition: all 0.25s var(--esds-ease);
}
.inv__search input:focus {
    outline: none;
    background: #fff;
    border-color: rgba(0, 97, 255, 0.30);
    box-shadow: 0 0 0 4px rgba(0, 97, 255, 0.08);
}
.inv__search input::placeholder { color: var(--esds-gray-400); }
.inv__search-icon {
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    width: 16px; height: 16px;
    color: var(--esds-gray-400);
    pointer-events: none;
}
.inv__policies {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px 32px;
}

@media (max-width: 768px) { .inv__policies { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   BOARD & COMMITTEES — switcher tabs
   ─────────────────────────────────────────────────────────────────────────── */
.inv__tabs {
    display: flex;
    gap: 6px;
    margin-bottom: 22px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 4px;
    border-bottom: 1px solid var(--esds-gray-100);
    scrollbar-width: thin;
}
.inv__tabs::-webkit-scrollbar { height: 4px; }
.inv__tabs::-webkit-scrollbar-thumb { background: var(--esds-gray-200); border-radius: 2px; }

.inv__tab {
    padding: 10px 16px;
    background: transparent;
    border: 0;
    border-bottom: 2px solid transparent;
    color: var(--esds-gray-600);
    font-family: inherit;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: -0.1px;
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.2s var(--esds-ease);
    margin-bottom: -1px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.inv__tab:hover { color: var(--highlight-blue); }
.inv__tab.is-active {
    color: var(--highlight-blue);
    border-bottom-color: var(--highlight-blue);
}
.inv__tab-count {
    padding: 2px 7px;
    background: var(--esds-gray-50);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: var(--esds-gray-500);
    letter-spacing: 0.04em;
}
.inv__tab.is-active .inv__tab-count {
    background: rgba(0, 97, 255, 0.10);
    color: var(--highlight-blue);
}

.inv__committee-pane { display: none; }
.inv__committee-pane.is-active {
    display: block;
    animation: inv-fade-in 0.3s var(--esds-ease);
}
.inv__member {
    display: grid;
    grid-template-columns: 36px 44px 1fr auto;
    gap: 16px;
    align-items: center;
    padding: 14px 0;
    border-bottom: 1px solid var(--esds-gray-100);
    transition: background 0.2s, padding-left 0.25s var(--esds-ease);
}
.inv__member:last-child { border-bottom: 0; }
.inv__member:hover {
    padding-left: 8px;
    background: linear-gradient(90deg, rgba(0, 97, 255, 0.025), transparent);
}
.inv__member-sr {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.04em;
}
.inv__member-avatar {
    width: 44px; height: 44px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: -0.5px;
    box-shadow: 0 4px 12px rgba(0, 97, 255, 0.25);
}
.inv__member-avatar--saffron {
    background: linear-gradient(135deg, var(--india-saffron), #ffb84d);
    box-shadow: 0 4px 12px rgba(255, 153, 51, 0.25);
}
.inv__member-name {
    font-size: 14px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.2px;
    line-height: 1.3;
    margin: 0 0 2px;
}
.inv__member-cat {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--esds-gray-500);
    letter-spacing: 0.04em;
    margin: 0;
}
.inv__member-role {
    padding: 4px 10px;
    background: rgba(0, 97, 255, 0.06);
    border: 1px solid rgba(0, 97, 255, 0.18);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    white-space: nowrap;
}
.inv__member-role--exec {
    background: rgba(255, 153, 51, 0.08);
    border-color: rgba(255, 153, 51, 0.25);
    color: var(--india-saffron);
}

.inv__committees-foot {
    margin-top: 22px;
    padding: 14px 18px;
    background: var(--esds-gray-50);
    border-radius: 10px;
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    color: var(--esds-gray-700);
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.inv__committees-foot a {
    color: var(--highlight-blue);
    text-decoration: none;
    font-weight: 800;
    border-bottom: 1px solid rgba(0, 97, 255, 0.30);
}
.inv__committees-foot a:hover { border-bottom-color: var(--highlight-blue); }

@media (max-width: 640px) {
    .inv__member { grid-template-columns: 32px 40px 1fr; gap: 12px; }
    .inv__member-role { grid-column: 2 / -1; justify-self: start; }
}


/* ───────────────────────────────────────────────────────────────────────────
   CONTACT — open contact layout (no boxes)
   ─────────────────────────────────────────────────────────────────────────── */
.inv__contact-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 36px;
    margin-bottom: 32px;
}
.inv__contact-block-eyebrow {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 8px;
}
.inv__contact-block-name {
    font-size: 18px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.4px;
    margin: 0 0 16px;
    line-height: 1.25;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--esds-gray-100);
}
.inv__contact-fields {
    list-style: none;
    margin: 0;
    padding: 0;
}
.inv__contact-fields li {
    display: grid;
    grid-template-columns: 120px 1fr;
    gap: 16px;
    padding: 10px 0;
    border-bottom: 1px solid var(--esds-gray-100);
    align-items: start;
}
.inv__contact-fields li:last-child { border-bottom: 0; }
.inv__contact-fields-key {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--esds-gray-500);
    letter-spacing: 0.10em;
    text-transform: uppercase;
    line-height: 1.5;
    padding-top: 2px;
}
.inv__contact-fields-val {
    font-size: 13px;
    font-weight: 600;
    color: var(--esds-navy);
    line-height: 1.55;
    word-break: break-word;
}
.inv__contact-fields-val a {
    color: var(--highlight-blue);
    text-decoration: none;
    font-weight: 700;
}
.inv__contact-fields-val a:hover { text-decoration: underline; }
.inv__contact-fields-val.mono {
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    letter-spacing: 0.04em;
}

.inv__contact-cs {
    padding: 22px 0 0;
    border-top: 2px solid var(--esds-gray-100);
}
.inv__contact-cs-eyebrow {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 8px;
}
.inv__contact-cs-name {
    font-size: 22px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.5px;
    margin: 0 0 14px;
    line-height: 1.2;
}
.inv__contact-cs-fields {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 28px;
}
.inv__contact-cs-field {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 600;
    color: var(--esds-gray-700);
}
.inv__contact-cs-field a {
    color: var(--highlight-blue);
    text-decoration: none;
    font-weight: 700;
}
.inv__contact-cs-field a:hover { text-decoration: underline; }
.inv__contact-cs-field strong { color: var(--esds-navy); font-weight: 800; }
.inv__contact-cs-icon {
    width: 28px; height: 28px;
    border-radius: 6px;
    background: rgba(0, 97, 255, 0.08);
    color: var(--highlight-blue);
    display: grid;
    place-items: center;
    flex-shrink: 0;
}
.inv__contact-cs-icon svg { width: 14px; height: 14px; }

@media (max-width: 768px) {
    .inv__contact-grid { grid-template-columns: 1fr; gap: 28px; }
    .inv__contact-fields li { grid-template-columns: 1fr; gap: 4px; }
}


/* ───────────────────────────────────────────────────────────────────────────
   DISCLAIMER MODAL
   ─────────────────────────────────────────────────────────────────────────── */
.inv__modal {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(10, 22, 40, 0.86);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    padding: 20px;
}
.inv__modal.is-open {
    display: flex;
    animation: inv-modal-fade 0.25s ease-out;
}
@keyframes inv-modal-fade {
    from { opacity: 0; }
    to   { opacity: 1; }
}
.inv__modal-card {
    width: 100%;
    max-width: 760px;
    max-height: 86vh;
    background: #fff;
    border-radius: 18px;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.45);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    animation: inv-modal-slide 0.3s var(--esds-ease);
}
@keyframes inv-modal-slide {
    from { opacity: 0; transform: translateY(20px); }
    to   { opacity: 1; transform: translateY(0); }
}
.inv__modal-head {
    padding: 22px 30px 18px;
    border-bottom: 1px solid var(--esds-gray-100);
    background: linear-gradient(135deg, rgba(255, 153, 51, 0.04), transparent);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-shrink: 0;
}
.inv__modal-head-text { flex: 1; min-width: 0; }
.inv__modal-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: rgba(255, 153, 51, 0.10);
    border: 1px solid rgba(255, 153, 51, 0.30);
    border-radius: 4px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 8px;
}
.inv__modal-eyebrow::before { content: '⚠'; font-size: 11px; }
.inv__modal-title {
    font-size: 20px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.4px;
    margin: 0;
    line-height: 1.25;
}
.inv__modal-close {
    width: 36px; height: 36px;
    background: var(--esds-gray-50);
    border: 1px solid var(--esds-gray-100);
    border-radius: 8px;
    cursor: pointer;
    display: grid;
    place-items: center;
    color: var(--esds-gray-600);
    transition: all 0.25s var(--esds-ease);
    flex-shrink: 0;
    padding: 0;
}
.inv__modal-close:hover {
    background: rgba(220, 38, 38, 0.06);
    border-color: rgba(220, 38, 38, 0.20);
    color: #dc2626;
}
.inv__modal-close svg { width: 16px; height: 16px; }
.inv__modal-body {
    padding: 22px 30px;
    overflow-y: auto;
    flex: 1;
    font-size: 13px;
    color: var(--esds-gray-700);
    line-height: 1.7;
}
.inv__modal-body p { margin: 0 0 12px; }
.inv__modal-body p:last-child { margin-bottom: 0; }
.inv__modal-body strong { color: var(--esds-navy); font-weight: 700; }
.inv__modal-body p.inv__modal-caps {
    background: linear-gradient(135deg, rgba(255, 153, 51, 0.04), rgba(255, 184, 77, 0.02));
    border-left: 3px solid var(--india-saffron);
    padding: 12px 16px;
    border-radius: 0 6px 6px 0;
    font-size: 12.5px;
    font-weight: 700;
    color: var(--esds-navy);
    letter-spacing: 0.04em;
    line-height: 1.55;
    margin: 12px 0;
}
.inv__modal-foot {
    padding: 18px 30px;
    border-top: 1px solid var(--esds-gray-100);
    background: var(--esds-gray-50);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-shrink: 0;
    flex-wrap: wrap;
}
.inv__modal-btn {
    padding: 11px 22px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: -0.1px;
    cursor: pointer;
    transition: all 0.25s var(--esds-ease);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: inherit;
    border: 1.5px solid;
}
.inv__modal-btn--reject {
    background: #fff;
    border-color: var(--esds-gray-200);
    color: var(--esds-gray-700);
}
.inv__modal-btn--reject:hover {
    background: rgba(220, 38, 38, 0.04);
    border-color: rgba(220, 38, 38, 0.30);
    color: #dc2626;
}
.inv__modal-btn--confirm {
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    border-color: transparent;
    color: #fff;
    box-shadow: 0 4px 14px rgba(0, 97, 255, 0.30);
}
.inv__modal-btn--confirm:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 22px rgba(0, 97, 255, 0.45);
}
.inv__modal-btn svg { width: 14px; height: 14px; }
.inv__modal-reject-msg {
    padding: 20px 30px;
    background: rgba(220, 38, 38, 0.04);
    border-top: 1px solid rgba(220, 38, 38, 0.18);
    text-align: center;
    color: #b91c1c;
    font-size: 13.5px;
    font-weight: 700;
    line-height: 1.5;
    flex-shrink: 0;
    display: none;
}
.inv__modal.is-rejected .inv__modal-foot { display: none; }
.inv__modal.is-rejected .inv__modal-reject-msg { display: block; }

@media (max-width: 540px) {
    .inv__modal-card { max-height: 92vh; border-radius: 12px; }
    .inv__modal-head, .inv__modal-body, .inv__modal-foot { padding-left: 20px; padding-right: 20px; }
    .inv__modal-title { font-size: 17px; }
}


  /* ═══════════════════════════════════════════════════════════════════
     §2 · SOVEREIGN THREAD — 9 government initiatives + 5 stats milestone strip
     Each initiative card has: icon, name, brief tag
     Below: 5-stat milestone strip with animated count effect
  ═══════════════════════════════════════════════════════════════════ */
  .gcc__thread-intro {
    font-size: 17px;
    line-height: 1.7;
    color: var(--esds-gray-500);
    max-width: 880px;
    margin: 0 auto 48px;
    text-align: center;
  }
  .gcc__thread-intro strong { color: var(--esds-navy); font-weight: 700; }
  .gcc__thread-intro em {
    font-style: italic;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
  }

  /* 9-initiative grid */
  .gcc__init-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-bottom: 56px;
  }
  @media (max-width: 900px) { .gcc__init-grid { grid-template-columns: repeat(2, 1fr); } }
  @media (max-width: 560px) { .gcc__init-grid { grid-template-columns: 1fr; } }

  .gcc__init-card {
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 18px 20px;
    display: flex;
    align-items: center;
    gap: 14px;
    transition: all 0.3s var(--esds-ease);
    position: relative;
    overflow: hidden;
  }
  .gcc__init-card::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 3px;
    background: linear-gradient(180deg, var(--india-saffron), var(--india-green));
    transform: scaleY(0);
    transform-origin: top;
    transition: transform 0.4s var(--esds-ease);
  }
  .gcc__init-card:hover {
    transform: translateY(-3px);
    border-color: var(--highlight-blue);
    box-shadow: 0 10px 26px rgba(0,97,255,0.10);
  }
  .gcc__init-card:hover::before { transform: scaleY(1); }
  .gcc__init-card__icon {
    width: 38px; height: 38px;
    border-radius: 10px;
    background: linear-gradient(135deg, rgba(255,107,53,0.10), rgba(19,136,8,0.10));
    color: var(--india-saffron);
    display: grid;
    place-items: center;
    font-size: 18px;
    flex-shrink: 0;
    border: 1px solid rgba(255,107,53,0.18);
  }
  .gcc__init-card__copy {
    flex: 1;
  }
  .gcc__init-card__name {
    font-size: 13.5px;
    font-weight: 800;
    color: var(--esds-navy);
    line-height: 1.3;
    letter-spacing: -0.2px;
    margin: 0 0 2px;
  }
  .gcc__init-card__tag {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 700;
    color: var(--esds-gray-400);
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }

  /* 5-stat milestone strip with animated lines */
  .gcc__milestone-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    background: linear-gradient(135deg, var(--esds-navy), #0d1c34);
    border-radius: 22px;
    padding: 32px 0;
    position: relative;
    overflow: hidden;
  }
  .gcc__milestone-strip::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
      linear-gradient(rgba(126,233,255,0.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(126,233,255,0.04) 1px, transparent 1px);
    background-size: 40px 40px;
    pointer-events: none;
  }
  .gcc__milestone-strip::after {
    content: '';
    position: absolute;
    top: 50%; left: 0; right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(126,233,255,0.3), transparent);
  }
  .gcc__milestone {
    text-align: center;
    padding: 8px 16px;
    border-right: 1px solid rgba(126,233,255,0.12);
    position: relative;
    z-index: 2;
  }
  .gcc__milestone:last-child { border-right: 0; }
  .gcc__milestone-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(24px, 2.8vw, 34px);
    font-weight: 800;
    line-height: 1;
    background: linear-gradient(135deg, var(--highlight-blue-light), #fff);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: 6px;
    letter-spacing: -1px;
  }
  .gcc__milestone-num--saffron {
    background: linear-gradient(135deg, var(--india-saffron), #F4A623);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .gcc__milestone-num--green {
    background: linear-gradient(135deg, #4ade80, #22c55e);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .gcc__milestone-lbl {
    font-size: 11px;
    color: var(--esds-gray-300);
    line-height: 1.45;
    font-weight: 600;
  }
  @media (max-width: 900px) {
    .gcc__milestone-strip { grid-template-columns: repeat(2, 1fr); padding: 16px 0; gap: 16px 0; }
    .gcc__milestone { border-right: 0; padding: 14px; }
    .gcc__milestone-strip::after { display: none; }
  }

  /* Plan deployment CTA below stats */
  .gcc__plan-cta {
    text-align: center;
    margin-top: 36px;
  }
  .gcc__plan-cta a {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 28px;
    background: linear-gradient(135deg, var(--india-saffron), #FF8856);
    color: #fff;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 800;
    text-decoration: none;
    transition: all 0.25s var(--esds-ease);
    box-shadow: 0 8px 22px rgba(255,107,53,0.25);
  }
  .gcc__plan-cta a:hover {
    transform: translateY(-3px);
    box-shadow: 0 14px 32px rgba(255,107,53,0.35);
    color: #fff;
  }


  /* ═══════════════════════════════════════════════════════════════════
     §3 · TRUST LOGO WALL — institutions
  ═══════════════════════════════════════════════════════════════════ */
  .gcc__inst-intro {
    font-size: 16px;
    line-height: 1.7;
    color: var(--esds-gray-500);
    max-width: 760px;
    margin: 0 auto 36px;
    text-align: center;
  }
  .gcc__inst-tile {
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 12px;
    padding: 18px 24px;
    text-align: center;
    transition: all 0.3s var(--esds-ease);
    min-width: 140px;
    flex: 0 0 auto;
    position: relative;
  }
  .gcc__inst-tile:hover {
    border-color: var(--india-saffron);
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(255,107,53,0.10);
  }
  .gcc__inst-tile__name {
    font-family: 'JetBrains Mono', monospace;
    font-size: 13px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: 0.04em;
    line-height: 1.2;
  }
  .gcc__inst-tile__sector {
    font-size: 9.5px;
    color: var(--esds-gray-400);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-weight: 700;
    margin-top: 4px;
  }
  .gcc__inst-tile--more {
    background: linear-gradient(135deg, rgba(0,97,255,0.04), rgba(126,233,255,0.02));
    border-style: dashed;
    border-color: rgba(0,97,255,0.25);
  }
  .gcc__inst-tile--more .gcc__inst-tile__name {
    color: var(--highlight-blue);
    font-style: italic;
  }


  /* ═══════════════════════════════════════════════════════════════════
     §4 · THREAT COUNTER — 4 policy mandate alarm cards (dark section)
     Each card: red-amber alarm bar, mandate text, source authority
  ═══════════════════════════════════════════════════════════════════ */
  .gcc__threat-headline {
    text-align: center;
    margin: 0 auto 36px;
    max-width: 800px;
  }
  .gcc__threat-headline h3 {
    font-size: clamp(20px, 2.6vw, 26px);
    font-weight: 800;
    color: #fff;
    line-height: 1.35;
    letter-spacing: -0.5px;
    margin: 0;
  }
  .gcc__threat-headline em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), #F4A623);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
  }
  .gcc__threat-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
    margin-bottom: 40px;
  }
  @media (max-width: 800px) { .gcc__threat-grid { grid-template-columns: 1fr; } }
  .gcc__threat-card {
    background: rgba(255,107,53,0.04);
    border: 1px solid rgba(255,107,53,0.20);
    border-radius: 16px;
    padding: 24px 26px 24px 28px;
    position: relative;
    overflow: hidden;
    transition: all 0.4s var(--esds-ease);
  }
  .gcc__threat-card::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 4px;
    background: linear-gradient(180deg, var(--india-saffron), #F4A623);
    animation: gcc-alarm-pulse 2.4s ease-in-out infinite;
  }
  @keyframes gcc-alarm-pulse {
    0%, 100% { opacity: 0.7; }
    50%      { opacity: 1; box-shadow: 4px 0 16px rgba(255,107,53,0.4); }
  }
  .gcc__threat-card:hover {
    transform: translateY(-3px);
    background: rgba(255,107,53,0.08);
    border-color: rgba(255,107,53,0.4);
  }
  .gcc__threat-card__head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
  }
  .gcc__threat-card__num {
    width: 28px; height: 28px;
    border-radius: 8px;
    background: rgba(255,107,53,0.15);
    border: 1px solid rgba(255,107,53,0.35);
    color: var(--india-saffron);
    display: grid;
    place-items: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    flex-shrink: 0;
  }
  .gcc__threat-card__authority {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.12em;
    text-transform: uppercase;
  }
  .gcc__threat-card__text {
    font-size: 14.5px;
    color: var(--esds-gray-200);
    line-height: 1.6;
    margin: 0;
  }
  .gcc__threat-card__text strong { color: #fff; font-weight: 700; }

  /* Verdict + Act Today CTA */
  .gcc__verdict {
    text-align: center;
    padding: 28px 32px;
    background: linear-gradient(135deg, rgba(126,233,255,0.04), rgba(0,97,255,0.06));
    border: 1.5px solid rgba(126,233,255,0.18);
    border-radius: 18px;
  }
  .gcc__verdict h4 {
    font-size: 18px;
    font-weight: 800;
    color: #fff;
    margin: 0 0 6px;
    letter-spacing: -0.3px;
  }
  .gcc__verdict p {
    font-size: 14px;
    color: var(--highlight-blue-light);
    line-height: 1.6;
    margin: 0 0 20px;
    font-weight: 600;
  }
  .gcc__verdict p strong { color: #fff; font-weight: 800; }
  .gcc__verdict-cta {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 13px 28px;
    background: var(--india-saffron);
    color: #fff;
    border-radius: 100px;
    font-size: 14px;
    font-weight: 800;
    text-decoration: none;
    transition: all 0.3s var(--esds-ease);
    box-shadow: 0 8px 22px rgba(255,107,53,0.4);
    position: relative;
    overflow: hidden;
  }
  .gcc__verdict-cta::before {
    content: '⚠';
    font-size: 14px;
  }
  .gcc__verdict-cta:hover {
    transform: translateY(-3px);
    box-shadow: 0 14px 32px rgba(255,107,53,0.5);
    color: #fff;
  }


  /* ═══════════════════════════════════════════════════════════════════
     §5 · DEPLOYMENT CHAPTERS — 6 cards using industry-mosaic + industry-tile
     Each card has a unique animated SVG icon
  ═══════════════════════════════════════════════════════════════════ */
  .gcc__chapters-intro {
    font-size: 16px;
    line-height: 1.7;
    color: var(--esds-gray-500);
    max-width: 820px;
    margin: 0 auto 48px;
    text-align: center;
  }
  .gcc__chapter-icon {
    width: 56px; height: 56px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    margin-bottom: 16px;
    position: relative;
    overflow: hidden;
    transition: all 0.35s var(--esds-ease);
  }
  .industry-tile:hover .gcc__chapter-icon {
    transform: scale(1.08) rotate(-4deg);
  }
  .gcc__chapter-icon svg {
    width: 32px; height: 32px;
    color: #fff;
    z-index: 2;
    position: relative;
  }
  .gcc__chapter-icon::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 30% 30%, rgba(255,255,255,0.25), transparent 70%);
    pointer-events: none;
  }
  .gcc__chapter-icon--smartmeters { background: linear-gradient(135deg, #047857, #10B981); box-shadow: 0 6px 16px rgba(16,185,129,0.25); }
  .gcc__chapter-icon--smartcities { background: linear-gradient(135deg, #1E40AF, var(--highlight-blue)); box-shadow: 0 6px 16px rgba(0,97,255,0.25); }
  .gcc__chapter-icon--pds         { background: linear-gradient(135deg, #B45309, #F59E0B); box-shadow: 0 6px 16px rgba(217,119,6,0.25); }
  .gcc__chapter-icon--elections   { background: linear-gradient(135deg, var(--india-saffron), #FF8856); box-shadow: 0 6px 16px rgba(255,107,53,0.25); }
  .gcc__chapter-icon--infra       { background: linear-gradient(135deg, var(--esds-navy), #1E293B); box-shadow: 0 6px 16px rgba(10,22,40,0.25); }
  .gcc__chapter-icon--municipal   { background: linear-gradient(135deg, #6D28D9, #A78BFA); box-shadow: 0 6px 16px rgba(124,58,237,0.25); }
  /* Smart Meters: pulse dot */
  .gcc__chapter-icon--smartmeters svg .pulse-meter {
    animation: gcc-pulse 1.6s ease-in-out infinite;
  }
  @keyframes gcc-pulse {
    0%, 100% { opacity: 0.4; }
    50%      { opacity: 1; }
  }
  /* Smart Cities: orbit */
  .gcc__chapter-icon--smartcities svg .orbit-node {
    transform-origin: center;
    animation: gcc-orbit 5s linear infinite;
  }
  @keyframes gcc-orbit {
    to { transform: rotate(360deg); }
  }

  .industry-tile.gcc__chapter-tile {
    padding: 28px 26px;
  }
  .gcc__chapter-tile h3 {
    font-size: 17px;
    font-weight: 800;
    color: var(--esds-navy);
    margin: 0 0 10px;
    letter-spacing: -0.3px;
    line-height: 1.3;
  }
  .gcc__chapter-tile__metric {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.06em;
    margin-bottom: 12px;
    display: block;
    text-transform: uppercase;
  }
  .gcc__chapter-tile p {
    font-size: 13px;
    color: var(--esds-gray-600);
    line-height: 1.7;
    margin: 0;
  }
  .gcc__chapter-tile p strong { color: var(--esds-navy); font-weight: 700; }
  .gcc__chapter-tile p em {
    font-style: italic;
    color: var(--highlight-blue);
    font-weight: 700;
  }


  /* ═══════════════════════════════════════════════════════════════════
     §6 · SERVICE STACK — pillar-grid reuse with 3 cards (Sovereign / Performance / Compliance)
  ═══════════════════════════════════════════════════════════════════ */
  .gcc__stack-intro {
    font-size: 16px;
    line-height: 1.7;
    color: var(--esds-gray-500);
    max-width: 820px;
    margin: 0 auto 48px;
    text-align: center;
  }
  .gcc__stack-intro strong { color: var(--esds-navy); font-weight: 700; }
  .gcc__stack-icon {
    width: 56px; height: 56px;
    border-radius: 14px;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    display: grid;
    place-items: center;
    margin-bottom: 20px;
    transition: transform 0.35s var(--esds-ease);
    box-shadow: 0 6px 16px rgba(0,97,255,0.25);
  }
  .gcc__stack-icon svg { width: 30px; height: 30px; }
  .pillar-card:hover .gcc__stack-icon {
    transform: scale(1.08);
  }
  .gcc__stack-icon--sovereign  { background: linear-gradient(135deg, var(--india-saffron), #F4A623); box-shadow: 0 6px 16px rgba(255,107,53,0.25); }
  .gcc__stack-icon--performance{ background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light)); box-shadow: 0 6px 16px rgba(0,97,255,0.25); }
  .gcc__stack-icon--compliance { background: linear-gradient(135deg, var(--india-green), #22C55E); box-shadow: 0 6px 16px rgba(19,136,8,0.25); }


  /* ═══════════════════════════════════════════════════════════════════
     §7 · COMPLIANCE CREDENTIALS — uses cert-row + cert-chip
  ═══════════════════════════════════════════════════════════════════ */
  .gcc__cred-callout {
    text-align: center;
    margin: 0 auto;
    max-width: 820px;
  }
  .gcc__cred-callout p {
    font-size: 16px;
    line-height: 1.7;
    color: var(--esds-gray-500);
    margin: 24px auto 0;
    max-width: 720px;
  }
  .gcc__cred-callout p strong { color: var(--esds-navy); font-weight: 700; }


  /* ═══════════════════════════════════════════════════════════════════
     §8 · CASE STUDIES SNAPSHOT — quick links into case-studies page
  ═══════════════════════════════════════════════════════════════════ */
  .gcc__case-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin-bottom: 36px;
  }
  @media (max-width: 900px) { .gcc__case-grid { grid-template-columns: repeat(2, 1fr); } }
  @media (max-width: 600px) { .gcc__case-grid { grid-template-columns: 1fr; } }

  .gcc__case-link {
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 22px 24px;
    text-decoration: none;
    transition: all 0.3s var(--esds-ease);
    display: flex;
    flex-direction: column;
    gap: 6px;
    position: relative;
    overflow: hidden;
  }
  .gcc__case-link::after {
    content: '→';
    position: absolute;
    top: 22px; right: 22px;
    color: var(--highlight-blue);
    font-weight: 800;
    font-size: 16px;
    transition: transform 0.3s var(--esds-ease);
  }
  .gcc__case-link:hover {
    transform: translateY(-3px);
    border-color: var(--highlight-blue);
    box-shadow: 0 10px 24px rgba(0,97,255,0.10);
  }
  .gcc__case-link:hover::after { transform: translateX(4px); }
  .gcc__case-link__metric {
    font-family: 'JetBrains Mono', monospace;
    font-size: 18px;
    font-weight: 800;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    letter-spacing: -0.5px;
    margin-bottom: 4px;
  }
  .gcc__case-link__title {
    font-size: 14.5px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.2px;
    line-height: 1.3;
  }
  .gcc__case-link__sector {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--esds-gray-400);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-top: 4px;
  }
  .gcc__case-cta {
    text-align: center;
  }


  /* ═══════════════════════════════════════════════════════════════════
     §9 · CTA pre-tagline
  ═══════════════════════════════════════════════════════════════════ */
  .gcc__cta-pre {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--highlight-blue-light);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 14px;
    display: inline-block;
    position: relative;
    z-index: 2;
  }
  .gcc__cta-pre::before, .gcc__cta-pre::after {
    content: '';
    display: inline-block;
    width: 24px; height: 1px;
    background: var(--highlight-blue-light);
    vertical-align: middle;
    opacity: 0.5;
    margin: 0 10px;
  }
  
  
  

  /* ═══ §1 HERO ═══ */
  .esg__hero-sub {
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(15px, 1.8vw, 19px);
    font-weight: 700;
    color: var(--highlight-blue-light);
    margin: 0 0 28px;
    letter-spacing: -0.2px;
    line-height: 1.4;
    font-style: italic;
  }
  .esg__hero-sub::before {
    content: '◆';
    color: var(--india-saffron);
    margin-right: 10px;
    font-size: 0.8em;
    vertical-align: middle;
    font-style: normal;
  }
  /* Maharashtra Govt recognition badge */
  .esg__hero-recog {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-top: 28px;
    padding: 12px 18px;
    background: rgba(255,107,53,0.1);
    border: 1.5px solid rgba(255,107,53,0.35);
    border-radius: 12px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11.5px;
    font-weight: 800;
    color: #FFB89E;
    letter-spacing: 0.04em;
  }
  .esg__hero-recog__icon {
    width: 28px; height: 28px;
    border-radius: 50%;
    background: rgba(255,107,53,0.2);
    display: grid;
    place-items: center;
    font-size: 14px;
    flex-shrink: 0;
  }


  /* ═══ §2 ESG FRAMEWORK — 3 pillar cards ═══ */
  .esg__framework-intro {
    font-size: 16px;
    line-height: 1.7;
    color: var(--esds-gray-500);
    max-width: 820px;
    margin: 0 auto 48px;
    text-align: center;
  }
  .esg__framework-intro strong { color: var(--esds-navy); font-weight: 700; }
  .esg__framework-intro em {
    font-style: italic;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
  }
  .esg__pillar-icon {
    width: 60px; height: 60px;
    border-radius: 16px;
    display: grid;
    place-items: center;
    font-size: 28px;
    margin-bottom: 18px;
    transition: all 0.4s var(--esds-ease);
    color: #fff;
    position: relative;
    overflow: hidden;
  }
  .esg__pillar-icon::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 30% 30%, rgba(255,255,255,0.25), transparent 70%);
  }
  .feature-card:hover .esg__pillar-icon {
    transform: scale(1.1) rotate(-6deg);
  }
  .esg__pillar-icon--planet     { background: linear-gradient(135deg, var(--india-green), #22C55E); box-shadow: 0 8px 22px rgba(19,136,8,0.30); }
  .esg__pillar-icon--people     { background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light)); box-shadow: 0 8px 22px rgba(0,97,255,0.30); }
  .esg__pillar-icon--principles { background: linear-gradient(135deg, var(--india-saffron), #F4A623); box-shadow: 0 8px 22px rgba(255,107,53,0.30); }


  /* ═══ §3 PLANET — 6 spec cards with animated icons ═══ */
  .esg__planet-intro {
    font-size: 16px;
    line-height: 1.7;
    color: var(--esds-gray-500);
    max-width: 820px;
    margin: 0 auto 48px;
    text-align: center;
  }
  .esg__planet-intro strong { color: var(--esds-navy); font-weight: 700; }
  .esg__planet-intro em {
    font-style: italic;
    color: var(--india-green);
    font-weight: 800;
  }
  .esg__planet-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
  }
  @media (max-width: 1024px) { .esg__planet-grid { grid-template-columns: repeat(2, 1fr); } }
  @media (max-width: 600px)  { .esg__planet-grid { grid-template-columns: 1fr; } }
  .esg__planet-card {
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 18px;
    padding: 26px 28px;
    transition: all 0.35s var(--esds-ease);
    position: relative;
    overflow: hidden;
  }
  .esg__planet-card::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 4px;
    background: linear-gradient(180deg, var(--india-green), #22C55E);
    transform: scaleY(0.3);
    transform-origin: top;
    transition: transform 0.4s var(--esds-ease);
  }
  .esg__planet-card:hover {
    transform: translateY(-4px);
    border-color: var(--india-green);
    box-shadow: 0 14px 32px rgba(19,136,8,0.10);
  }
  .esg__planet-card:hover::before { transform: scaleY(1); }
  .esg__planet-card__icon {
    width: 56px; height: 56px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    margin-bottom: 16px;
    transition: all 0.35s var(--esds-ease);
    position: relative;
    overflow: hidden;
    color: #fff;
  }
  .esg__planet-card__icon svg { width: 30px; height: 30px; z-index: 2; position: relative; }
  .esg__planet-card__icon::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 30% 30%, rgba(255,255,255,0.25), transparent 70%);
  }
  .esg__planet-card:hover .esg__planet-card__icon { transform: scale(1.08); }
  .esg__planet-card__icon--solar { background: linear-gradient(135deg, #B45309, #F59E0B); box-shadow: 0 6px 16px rgba(217,119,6,0.30); }
  .esg__planet-card__icon--patent { background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light)); box-shadow: 0 6px 16px rgba(0,97,255,0.30); }
  .esg__planet-card__icon--pue { background: linear-gradient(135deg, #6D28D9, #A78BFA); box-shadow: 0 6px 16px rgba(124,58,237,0.30); }
  .esg__planet-card__icon--water { background: linear-gradient(135deg, #0F766E, #14B8A6); box-shadow: 0 6px 16px rgba(15,118,110,0.30); }
  .esg__planet-card__icon--first { background: linear-gradient(135deg, var(--india-green), #22C55E); box-shadow: 0 6px 16px rgba(19,136,8,0.30); }
  .esg__planet-card__icon--trees { background: linear-gradient(135deg, #047857, #10B981); box-shadow: 0 6px 16px rgba(5,150,105,0.30); }
  /* Animated solar pulse */
  .esg__planet-card__icon--solar svg .pulse-sun {
    animation: esg-sun-pulse 2.4s ease-in-out infinite;
    transform-origin: center;
  }
  @keyframes esg-sun-pulse {
    0%, 100% { opacity: 0.85; }
    50%      { opacity: 1; }
  }
  /* Water drop ripple */
  .esg__planet-card__icon--water svg .ripple {
    animation: esg-water-ripple 2.5s ease-out infinite;
    transform-origin: center;
    opacity: 0;
  }
  @keyframes esg-water-ripple {
    0%   { opacity: 0.7; transform: scale(0.6); }
    100% { opacity: 0; transform: scale(1.6); }
  }

  .esg__planet-card h3 {
    font-size: 17px;
    font-weight: 800;
    color: var(--esds-navy);
    line-height: 1.3;
    letter-spacing: -0.3px;
    margin: 0 0 12px;
  }
  .esg__planet-card p {
    font-size: 13.5px;
    color: var(--esds-gray-600);
    line-height: 1.7;
    margin: 0 0 14px;
  }
  .esg__planet-card p strong { color: var(--esds-navy); font-weight: 700; }
  .esg__planet-card p em {
    font-style: italic;
    color: var(--india-green);
    font-weight: 700;
  }
  .esg__planet-card__patents {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px dashed var(--esds-gray-100);
  }
  .esg__planet-card__patent {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 8px;
    background: rgba(0,97,255,0.06);
    border: 1px solid rgba(0,97,255,0.15);
    border-radius: 5px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 700;
    color: var(--highlight-blue);
    letter-spacing: 0.04em;
  }


  /* ═══ §4 GHG EMISSIONS DASHBOARD (dark) ═══ */
  .esg__ghg-headline {
    text-align: center;
    color: #fff;
    margin: 0 auto 48px;
    max-width: 800px;
  }
  .esg__ghg-headline p {
    font-size: 16px;
    color: var(--esds-gray-300);
    line-height: 1.7;
    margin: 16px auto 0;
    max-width: 720px;
  }
  .esg__ghg-headline strong { color: #fff; font-weight: 700; }

  /* Top dashboard split: donut + scope strip */
  .esg__ghg-dashboard {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: 32px;
    background: rgba(126,233,255,0.04);
    border: 1.5px solid rgba(126,233,255,0.18);
    border-radius: 22px;
    padding: 36px;
    margin-bottom: 24px;
    align-items: center;
  }
  @media (max-width: 900px) {
    .esg__ghg-dashboard { grid-template-columns: 1fr; padding: 24px; }
  }

  /* SVG donut visualization for Scope 1 vs Scope 2 split */
  .esg__ghg-donut {
    width: 280px; height: 280px;
    position: relative;
    margin: 0 auto;
  }
  .esg__ghg-donut svg { transform: rotate(-90deg); width: 100%; height: 100%; }
  .esg__ghg-donut-bg { stroke: rgba(255,255,255,0.08); fill: none; stroke-width: 16; }
  .esg__ghg-donut-s2 {
    stroke: url(#esg-grad-s2);
    fill: none;
    stroke-width: 16;
    stroke-linecap: butt;
    stroke-dasharray: 0 600;
    animation: esg-donut-s2 1.6s ease-out 0.2s forwards;
  }
  .esg__ghg-donut-s1 {
    stroke: var(--india-saffron);
    fill: none;
    stroke-width: 16;
    stroke-linecap: butt;
    stroke-dasharray: 0 600;
    animation: esg-donut-s1 1s ease-out 1.6s forwards;
  }
  @keyframes esg-donut-s2 {
    /* 95.19% of 565.5 (2πr=90) ≈ 538 */
    to { stroke-dasharray: 538 600; }
  }
  @keyframes esg-donut-s1 {
    /* 4.81% of 565.5 ≈ 27.2 */
    to { stroke-dasharray: 27.2 600; stroke-dashoffset: -538; }
  }
  .esg__ghg-donut-center {
    position: absolute; inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #fff;
  }
  .esg__ghg-donut-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 36px;
    font-weight: 800;
    background: linear-gradient(135deg, #fff, var(--highlight-blue-light));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    line-height: 1;
    letter-spacing: -1.5px;
  }
  .esg__ghg-donut-unit {
    font-family: 'JetBrains Mono', monospace;
    font-size: 13px;
    font-weight: 800;
    color: var(--esds-gray-300);
    letter-spacing: 0.08em;
    margin-top: 4px;
  }
  .esg__ghg-donut-lbl {
    font-size: 11px;
    color: var(--esds-gray-300);
    margin-top: 8px;
    line-height: 1.4;
  }

  /* Scope details on the right */
  .esg__ghg-scope-list {
    display: flex;
    flex-direction: column;
    gap: 14px;
  }
  .esg__ghg-scope {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 14px;
    padding: 18px 22px;
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 16px;
    align-items: center;
    transition: all 0.3s var(--esds-ease);
  }
  .esg__ghg-scope:hover {
    background: rgba(126,233,255,0.06);
    border-color: rgba(126,233,255,0.25);
  }
  .esg__ghg-scope__num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 22px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.5px;
    line-height: 1;
  }
  .esg__ghg-scope--s1 .esg__ghg-scope__num { color: var(--india-saffron); }
  .esg__ghg-scope--s2 .esg__ghg-scope__num { color: var(--highlight-blue-light); }
  .esg__ghg-scope__copy h4 {
    font-size: 14px;
    font-weight: 800;
    color: #fff;
    margin: 0 0 3px;
    letter-spacing: -0.2px;
  }
  .esg__ghg-scope__copy p {
    font-size: 12px;
    color: var(--esds-gray-300);
    margin: 0;
  }
  .esg__ghg-scope__pct {
    font-family: 'JetBrains Mono', monospace;
    font-size: 13px;
    font-weight: 800;
    color: var(--esds-gray-300);
    letter-spacing: 0.05em;
  }

  /* Location bar chart */
  .esg__ghg-locations {
    background: rgba(126,233,255,0.04);
    border: 1.5px solid rgba(126,233,255,0.18);
    border-radius: 22px;
    padding: 28px 36px;
    margin-bottom: 32px;
  }
  .esg__ghg-locations__head {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--highlight-blue-light);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 18px;
  }
  .esg__ghg-bars {
    display: grid;
    gap: 12px;
  }
  .esg__ghg-bar {
    display: grid;
    grid-template-columns: 100px 1fr 110px;
    gap: 16px;
    align-items: center;
  }
  @media (max-width: 600px) {
    .esg__ghg-bar { grid-template-columns: 1fr; gap: 4px; }
  }
  .esg__ghg-bar__loc {
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    font-weight: 800;
    color: #fff;
    letter-spacing: 0.05em;
  }
  .esg__ghg-bar__track {
    height: 12px;
    background: rgba(255,255,255,0.06);
    border-radius: 100px;
    overflow: hidden;
  }
  .esg__ghg-bar__fill {
    height: 100%;
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
    border-radius: 100px;
    transform-origin: left;
    transform: scaleX(0);
    animation: esg-bar-grow 1.2s ease-out forwards;
  }
  .esg__ghg-bar:nth-child(1) .esg__ghg-bar__fill { animation-delay: 0.1s; }
  .esg__ghg-bar:nth-child(2) .esg__ghg-bar__fill { animation-delay: 0.25s; }
  .esg__ghg-bar:nth-child(3) .esg__ghg-bar__fill { animation-delay: 0.4s; }
  .esg__ghg-bar:nth-child(4) .esg__ghg-bar__fill { animation-delay: 0.55s; }
  @keyframes esg-bar-grow { to { transform: scaleX(1); } }
  .esg__ghg-bar__val {
    font-family: 'JetBrains Mono', monospace;
    font-size: 13px;
    font-weight: 800;
    color: var(--highlight-blue-light);
    letter-spacing: -0.3px;
    text-align: right;
  }

  /* 3 reduction levers */
  .esg__ghg-levers {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
  }
  @media (max-width: 900px) { .esg__ghg-levers { grid-template-columns: 1fr; } }
  .esg__ghg-lever {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 16px;
    padding: 24px 26px;
    transition: all 0.3s var(--esds-ease);
  }
  .esg__ghg-lever:hover {
    background: rgba(126,233,255,0.06);
    border-color: rgba(126,233,255,0.25);
    transform: translateY(-3px);
  }
  .esg__ghg-lever__icon {
    width: 44px; height: 44px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    color: #fff;
    margin-bottom: 14px;
  }
  .esg__ghg-lever__icon svg { width: 22px; height: 22px; }
  .esg__ghg-lever__icon--mobility { background: linear-gradient(135deg, var(--india-green), #22C55E); }
  .esg__ghg-lever__icon--renewable { background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light)); }
  .esg__ghg-lever__icon--monitor { background: linear-gradient(135deg, var(--india-saffron), #FF8856); }
  .esg__ghg-lever h4 {
    font-size: 15.5px;
    font-weight: 800;
    color: #fff;
    margin: 0 0 10px;
    letter-spacing: -0.3px;
  }
  .esg__ghg-lever p {
    font-size: 13px;
    color: var(--esds-gray-300);
    line-height: 1.7;
    margin: 0;
  }
  .esg__ghg-lever p strong { color: #fff; font-weight: 700; }


  /* ═══ §5 PEOPLE — Social Stats grid + Diversity ═══ */
  .esg__social-intro {
    font-size: 16px;
    line-height: 1.7;
    color: var(--esds-gray-500);
    max-width: 760px;
    margin: 0 auto 48px;
    text-align: center;
  }
  .esg__social-intro strong { color: var(--esds-navy); font-weight: 700; }

  .esg__social-block {
    margin-bottom: 36px;
  }
  .esg__social-block__head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
    padding-bottom: 14px;
    border-bottom: 2px solid var(--esds-gray-100);
  }
  .esg__social-block__icon {
    width: 36px; height: 36px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    color: #fff;
    flex-shrink: 0;
  }
  .esg__social-block__icon svg { width: 18px; height: 18px; }
  .esg__social-block__icon--invest { background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light)); }
  .esg__social-block__icon--diversity { background: linear-gradient(135deg, #BE185D, #EC4899); }
  .esg__social-block__head h3 {
    font-size: 19px;
    font-weight: 800;
    color: var(--esds-navy);
    margin: 0;
    letter-spacing: -0.3px;
  }

  .esg__social-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
  }
  @media (max-width: 900px) { .esg__social-stats { grid-template-columns: repeat(2, 1fr); } }
  @media (max-width: 500px) { .esg__social-stats { grid-template-columns: 1fr; } }
  .esg__social-stat {
    background: linear-gradient(135deg, #fff, var(--esds-gray-50));
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 22px 24px;
    text-align: left;
    transition: all 0.3s var(--esds-ease);
  }
  .esg__social-stat:hover {
    border-color: var(--highlight-blue);
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(0,97,255,0.08);
  }
  .esg__social-stat__num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 30px;
    font-weight: 800;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    line-height: 1;
    letter-spacing: -1px;
    margin-bottom: 6px;
  }
  .esg__social-stat__num--zero {
    background: linear-gradient(135deg, var(--india-green), #22C55E);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .esg__social-stat__num--saffron {
    background: linear-gradient(135deg, var(--india-saffron), #F4A623);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .esg__social-stat__lbl {
    font-size: 12.5px;
    color: var(--esds-gray-600);
    line-height: 1.5;
    font-weight: 600;
  }
  .esg__social-stat__lbl strong { color: var(--esds-navy); font-weight: 800; }


  /* ═══ §6 CSR — projects + spend timeline ═══ */
  .esg__csr-intro {
    font-size: 16px;
    line-height: 1.7;
    color: var(--esds-gray-500);
    max-width: 820px;
    margin: 0 auto 48px;
    text-align: center;
  }
  .esg__csr-intro strong { color: var(--esds-navy); font-weight: 700; }
  .esg__csr-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-bottom: 48px;
  }
  @media (max-width: 1024px) { .esg__csr-grid { grid-template-columns: repeat(2, 1fr); } }
  @media (max-width: 600px)  { .esg__csr-grid { grid-template-columns: 1fr; } }
  .esg__csr-card {
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 16px;
    padding: 24px 26px;
    transition: all 0.3s var(--esds-ease);
    position: relative;
  }
  .esg__csr-card:hover {
    transform: translateY(-3px);
    border-color: var(--india-green);
    box-shadow: 0 10px 24px rgba(19,136,8,0.08);
  }
  .esg__csr-card__num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-green);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 10px;
  }
  .esg__csr-card h4 {
    font-size: 15.5px;
    font-weight: 800;
    color: var(--esds-navy);
    line-height: 1.3;
    letter-spacing: -0.3px;
    margin: 0 0 10px;
  }
  .esg__csr-card p {
    font-size: 13px;
    color: var(--esds-gray-600);
    line-height: 1.65;
    margin: 0;
  }
  .esg__csr-card p strong { color: var(--esds-navy); font-weight: 700; }

  /* CSR spend timeline */
  .esg__csr-spend {
    background: linear-gradient(135deg, var(--esds-navy) 0%, #0d1c34 100%);
    border-radius: 22px;
    padding: 36px 40px;
    color: #fff;
    position: relative;
    overflow: hidden;
  }
  .esg__csr-spend::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
      linear-gradient(rgba(126,233,255,0.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(126,233,255,0.04) 1px, transparent 1px);
    background-size: 40px 40px;
    pointer-events: none;
  }
  .esg__csr-spend__head {
    position: relative;
    z-index: 2;
    text-align: center;
    margin-bottom: 28px;
  }
  .esg__csr-spend__label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--highlight-blue-light);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 8px;
  }
  .esg__csr-spend__title {
    font-size: 22px;
    font-weight: 800;
    color: #fff;
    margin: 0;
    letter-spacing: -0.3px;
  }
  .esg__csr-spend__years {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    position: relative;
    z-index: 2;
  }
  @media (max-width: 900px) { .esg__csr-spend__years { grid-template-columns: repeat(2, 1fr); gap: 16px; } }
  .esg__csr-year {
    text-align: center;
    padding: 16px 18px;
    border-right: 1px solid rgba(126,233,255,0.12);
    position: relative;
  }
  .esg__csr-year:last-child { border-right: 0; }
  @media (max-width: 900px) { .esg__csr-year { border-right: 0; } }
  .esg__csr-year__fy {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--esds-gray-300);
    letter-spacing: 0.12em;
    margin-bottom: 6px;
  }
  .esg__csr-year__amt {
    font-family: 'JetBrains Mono', monospace;
    font-size: 22px;
    font-weight: 800;
    background: linear-gradient(135deg, #fff, var(--highlight-blue-light));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    line-height: 1;
    letter-spacing: -0.5px;
    margin-bottom: 8px;
  }
  .esg__csr-year__org {
    font-size: 11.5px;
    font-weight: 800;
    color: #fff;
    line-height: 1.3;
    margin-bottom: 4px;
  }
  .esg__csr-year__cause {
    font-size: 10px;
    color: var(--esds-gray-300);
    line-height: 1.4;
  }
  .esg__csr-spend__quote {
    text-align: center;
    margin-top: 28px;
    padding-top: 24px;
    border-top: 1px dashed rgba(126,233,255,0.15);
    font-size: 14px;
    font-weight: 700;
    color: var(--highlight-blue-light);
    font-style: italic;
    letter-spacing: -0.3px;
    position: relative;
    z-index: 2;
  }


  /* ═══ §7 GOVERNANCE — 4 cards ═══ */
  .esg__gov-intro {
    font-size: 16px;
    line-height: 1.7;
    color: var(--esds-gray-500);
    max-width: 800px;
    margin: 0 auto 48px;
    text-align: center;
  }
  .esg__gov-intro strong { color: var(--esds-navy); font-weight: 700; }
  .esg__gov-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
    margin-bottom: 36px;
  }
  @media (max-width: 800px) { .esg__gov-grid { grid-template-columns: 1fr; } }
  .esg__gov-card {
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 16px;
    padding: 26px 28px;
    transition: all 0.3s var(--esds-ease);
  }
  .esg__gov-card:hover {
    border-color: var(--india-saffron);
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(255,107,53,0.08);
  }
  .esg__gov-card__head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
  }
  .esg__gov-card__icon {
    width: 44px; height: 44px;
    border-radius: 11px;
    display: grid;
    place-items: center;
    color: #fff;
  }
  .esg__gov-card__icon svg { width: 22px; height: 22px; }
  .esg__gov-card__icon--board   { background: linear-gradient(135deg, var(--esds-navy), #1E293B); }
  .esg__gov-card__icon--committee { background: linear-gradient(135deg, #6D28D9, #A78BFA); }
  .esg__gov-card__icon--zero    { background: linear-gradient(135deg, var(--india-green), #22C55E); }
  .esg__gov-card__icon--privacy { background: linear-gradient(135deg, #B91C1C, #EF4444); }
  .esg__gov-card h4 {
    font-size: 17px;
    font-weight: 800;
    color: var(--esds-navy);
    line-height: 1.3;
    letter-spacing: -0.3px;
    margin: 0;
    flex: 1;
  }
  .esg__gov-card p {
    font-size: 13.5px;
    color: var(--esds-gray-600);
    line-height: 1.7;
    margin: 0;
  }
  .esg__gov-card p strong { color: var(--esds-navy); font-weight: 700; }
  .esg__gov-card__zero-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 14px;
  }
  .esg__gov-card__zero-pill {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px 11px;
    background: rgba(19,136,8,0.08);
    border: 1px solid rgba(19,136,8,0.2);
    border-radius: 100px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--india-green);
    letter-spacing: 0.05em;
  }
  .esg__gov-card__zero-pill::before { content: '0'; font-weight: 800; }


  /* ═══ §8 4Bs MISSION (dark) ═══ */
  .esg__4b-intro {
    color: var(--esds-gray-200);
    font-size: 16px;
    line-height: 1.7;
    max-width: 820px;
    margin: 0 auto 48px;
    text-align: center;
  }
  .esg__4b-intro strong { color: #fff; font-weight: 700; }
  .esg__4b-intro em {
    font-style: italic;
    color: var(--highlight-blue-light);
    font-weight: 800;
  }
  .esg__4b-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
  }
  @media (max-width: 1100px) { .esg__4b-grid { grid-template-columns: repeat(2, 1fr); } }
  @media (max-width: 600px)  { .esg__4b-grid { grid-template-columns: 1fr; } }
  .esg__4b-card {
    background: rgba(126,233,255,0.04);
    border: 1.5px solid rgba(126,233,255,0.18);
    border-radius: 22px;
    padding: 32px 28px;
    text-align: center;
    transition: all 0.4s var(--esds-ease);
    position: relative;
    overflow: hidden;
  }
  .esg__4b-card::before {
    content: '';
    position: absolute;
    inset: -2px;
    border-radius: 22px;
    padding: 2px;
    background: linear-gradient(135deg, transparent, var(--highlight-blue) 50%, transparent);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
            mask-composite: exclude;
    opacity: 0;
    transition: opacity 0.4s ease;
  }
  .esg__4b-card:hover {
    transform: translateY(-6px);
    background: rgba(126,233,255,0.08);
  }
  .esg__4b-card:hover::before { opacity: 1; }
  .esg__4b-card__icon {
    width: 56px; height: 56px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    color: #fff;
    margin: 0 auto 16px;
    transition: transform 0.4s var(--esds-ease);
  }
  .esg__4b-card__icon svg { width: 28px; height: 28px; }
  .esg__4b-card:hover .esg__4b-card__icon { transform: scale(1.1) rotate(-6deg); }
  .esg__4b-card__icon--people  { background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light)); box-shadow: 0 6px 16px rgba(0,97,255,0.30); }
  .esg__4b-card__icon--devices { background: linear-gradient(135deg, #6D28D9, #A78BFA); box-shadow: 0 6px 16px rgba(124,58,237,0.30); }
  .esg__4b-card__icon--trees   { background: linear-gradient(135deg, var(--india-green), #22C55E); box-shadow: 0 6px 16px rgba(19,136,8,0.30); }
  .esg__4b-card__icon--dollars { background: linear-gradient(135deg, var(--india-saffron), #F4A623); box-shadow: 0 6px 16px rgba(255,107,53,0.30); }
  .esg__4b-card__num {
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(38px, 4.5vw, 52px);
    font-weight: 800;
    background: linear-gradient(135deg, #fff, var(--highlight-blue-light));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    line-height: 1;
    letter-spacing: -2px;
    margin-bottom: 4px;
  }
  .esg__4b-card__lbl {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--highlight-blue-light);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 16px;
  }
  .esg__4b-card__desc {
    font-size: 12.5px;
    color: var(--esds-gray-300);
    line-height: 1.6;
    margin: 0;
  }
  .esg__4b-card__desc strong { color: #fff; font-weight: 700; }


  /* ═══ §9 ROADMAP — 3 horizons ═══ */
  .esg__roadmap-intro {
    font-size: 16px;
    line-height: 1.7;
    color: var(--esds-gray-500);
    max-width: 760px;
    margin: 0 auto 48px;
    text-align: center;
  }
  .esg__roadmap-intro strong { color: var(--esds-navy); font-weight: 700; }
  .esg__roadmap-intro em {
    font-style: italic;
    color: var(--india-saffron);
    font-weight: 800;
  }
  .esg__roadmap {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
  }
  @media (max-width: 1024px) { .esg__roadmap { grid-template-columns: 1fr; } }
  .esg__roadmap-tier {
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 18px;
    padding: 0;
    transition: all 0.3s var(--esds-ease);
    overflow: hidden;
    position: relative;
  }
  .esg__roadmap-tier:hover {
    transform: translateY(-4px);
    border-color: var(--highlight-blue);
    box-shadow: 0 14px 32px rgba(0,97,255,0.08);
  }
  .esg__roadmap-tier__head {
    padding: 22px 26px 18px;
    color: #fff;
    background: linear-gradient(135deg, var(--esds-navy), #1E293B);
    position: relative;
  }
  .esg__roadmap-tier--near .esg__roadmap-tier__head { background: linear-gradient(135deg, var(--india-green), #22C55E); }
  .esg__roadmap-tier--mid .esg__roadmap-tier__head  { background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light)); }
  .esg__roadmap-tier--long .esg__roadmap-tier__head { background: linear-gradient(135deg, var(--india-saffron), #F4A623); }
  .esg__roadmap-tier__horizon {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    opacity: 0.85;
    margin-bottom: 6px;
  }
  .esg__roadmap-tier__year {
    font-family: 'JetBrains Mono', monospace;
    font-size: 28px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -1px;
    margin-bottom: 4px;
  }
  .esg__roadmap-tier__theme {
    font-size: 13px;
    font-weight: 700;
    opacity: 0.95;
    letter-spacing: -0.2px;
  }
  .esg__roadmap-tier__body {
    padding: 22px 26px 26px;
  }
  .esg__roadmap-tier__list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
  }
  .esg__roadmap-tier__item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 13px;
    color: var(--esds-gray-700);
    line-height: 1.5;
  }
  .esg__roadmap-tier__item::before {
    content: '✓';
    flex-shrink: 0;
    width: 18px; height: 18px;
    border-radius: 50%;
    background: rgba(19,136,8,0.1);
    color: var(--india-green);
    display: grid;
    place-items: center;
    font-size: 10px;
    font-weight: 800;
    margin-top: 2px;
  }
  .esg__roadmap-tier--near .esg__roadmap-tier__item::before { background: rgba(19,136,8,0.1); color: var(--india-green); }
  .esg__roadmap-tier--mid .esg__roadmap-tier__item::before  { background: rgba(0,97,255,0.1); color: var(--highlight-blue); }
  .esg__roadmap-tier--long .esg__roadmap-tier__item::before { background: rgba(255,107,53,0.1); color: var(--india-saffron); }


  /* ═══ §10 CTA pre + report card ═══ */
  .esg__cta-pre {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--highlight-blue-light);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 14px;
    display: inline-block;
    position: relative;
    z-index: 2;
  }
  .esg__cta-pre::before, .esg__cta-pre::after {
    content: '';
    display: inline-block;
    width: 24px; height: 1px;
    background: var(--highlight-blue-light);
    vertical-align: middle;
    opacity: 0.5;
    margin: 0 10px;
  }
  
  
  /* ═══ §1 HERO ═══ */
  .dpdp__hero-warn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: rgba(220,38,38,0.15);
    border: 1.5px solid rgba(239,68,68,0.4);
    color: #FCA5A5;
    padding: 8px 16px;
    border-radius: 100px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 22px;
  }
  .dpdp__hero-warn::before {
    content: '⚠';
    font-size: 14px;
    color: #FCA5A5;
    animation: dpdp-warn-pulse 1.4s ease-in-out infinite;
  }
  @keyframes dpdp-warn-pulse {
    0%, 100% { opacity: 0.7; transform: scale(1); }
    50%      { opacity: 1; transform: scale(1.15); }
  }
  .dpdp__hero-sub {
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(15px, 1.8vw, 19px);
    font-weight: 700;
    color: var(--highlight-blue-light);
    margin: 0 0 28px;
    letter-spacing: -0.2px;
    line-height: 1.4;
    font-style: italic;
  }
  .dpdp__hero-sub::before {
    content: '◆';
    color: var(--india-saffron);
    margin-right: 10px;
    font-size: 0.8em;
    vertical-align: middle;
    font-style: normal;
  }
  /* Live countdown badge */
  .dpdp__countdown {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    margin-top: 20px;
    padding: 16px 24px;
    background: linear-gradient(135deg, rgba(220,38,38,0.10), rgba(239,68,68,0.06));
    border: 1.5px solid rgba(239,68,68,0.30);
    border-radius: 14px;
  }
  .dpdp__countdown-pre {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: #FCA5A5;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    line-height: 1.3;
  }
  .dpdp__countdown-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(24px, 3vw, 30px);
    font-weight: 800;
    background: linear-gradient(135deg, #FF6B6B, #FF8856);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    line-height: 1;
    letter-spacing: -0.5px;
  }
  .dpdp__countdown-lbl {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--esds-gray-300);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-top: 2px;
  }


  /* ═══ §2 COMPLIANCE CLOCK — 3 enforcement phases ═══ */
  .dpdp__clock-intro {
    font-size: 16px;
    line-height: 1.7;
    color: var(--esds-gray-500);
    max-width: 820px;
    margin: 0 auto 48px;
    text-align: center;
  }
  .dpdp__clock-intro strong { color: var(--esds-navy); font-weight: 700; }
  .dpdp__clock-intro em {
    font-style: italic;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
  }

  .dpdp__phases {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    position: relative;
  }
  @media (max-width: 1024px) { .dpdp__phases { grid-template-columns: 1fr; } }

  /* Connecting timeline line behind phases */
  .dpdp__phases::before {
    content: '';
    position: absolute;
    top: 56px;
    left: 8%;
    right: 8%;
    height: 3px;
    background: linear-gradient(90deg, var(--india-green) 0%, var(--india-green) 33%, var(--india-saffron) 33%, var(--india-saffron) 66%, var(--esds-gray-200) 66%);
    border-radius: 4px;
    z-index: 0;
  }
  @media (max-width: 1024px) { .dpdp__phases::before { display: none; } }

  .dpdp__phase {
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 18px;
    padding: 0;
    overflow: hidden;
    transition: all 0.35s var(--esds-ease);
    position: relative;
    z-index: 1;
  }
  .dpdp__phase:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 32px rgba(0,97,255,0.08);
  }
  .dpdp__phase__head {
    padding: 22px 26px 20px;
    color: #fff;
    position: relative;
    text-align: center;
    border-radius: 18px 18px 0 0;
  }
  .dpdp__phase--complete .dpdp__phase__head { background: linear-gradient(135deg, var(--india-green), #22C55E); }
  .dpdp__phase--active .dpdp__phase__head   { background: linear-gradient(135deg, var(--india-saffron), #FF8856); }
  .dpdp__phase--pending .dpdp__phase__head  { background: linear-gradient(135deg, var(--esds-navy), #1E293B); }
  .dpdp__phase__num {
    width: 56px; height: 56px;
    border-radius: 50%;
    background: rgba(255,255,255,0.15);
    border: 2px solid rgba(255,255,255,0.4);
    color: #fff;
    display: grid;
    place-items: center;
    margin: 0 auto 12px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 18px;
    font-weight: 800;
    backdrop-filter: blur(8px);
  }
  .dpdp__phase__status {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 12px;
    background: rgba(255,255,255,0.15);
    border: 1px solid rgba(255,255,255,0.25);
    border-radius: 100px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 8px;
  }
  .dpdp__phase--complete .dpdp__phase__status::before { content: '✓'; }
  .dpdp__phase--active .dpdp__phase__status::before {
    content: '';
    width: 6px; height: 6px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 0 0 rgba(255,255,255,0.6);
    animation: dpdp-status-pulse 1.6s ease-in-out infinite;
  }
  @keyframes dpdp-status-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,255,255,0.6); }
    50%      { box-shadow: 0 0 0 6px rgba(255,255,255,0); }
  }
  .dpdp__phase--pending .dpdp__phase__status::before { content: '◷'; }
  .dpdp__phase__date {
    font-family: 'JetBrains Mono', monospace;
    font-size: 22px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.5px;
    margin-bottom: 4px;
  }
  .dpdp__phase__name {
    font-size: 12px;
    font-weight: 700;
    opacity: 0.92;
  }
  .dpdp__phase__body {
    padding: 22px 26px 26px;
  }
  .dpdp__phase__body h4 {
    font-size: 16px;
    font-weight: 800;
    color: var(--esds-navy);
    margin: 0 0 10px;
    letter-spacing: -0.3px;
  }
  .dpdp__phase__body p {
    font-size: 13px;
    color: var(--esds-gray-600);
    line-height: 1.65;
    margin: 0;
  }
  .dpdp__phase__body p strong { color: var(--esds-navy); font-weight: 700; }
  .dpdp__phase__body p em {
    font-style: italic;
    color: var(--india-saffron);
    font-weight: 700;
  }

  /* Verdict banner under phases */
  .dpdp__verdict {
    margin-top: 36px;
    text-align: center;
    padding: 24px 32px;
    background: linear-gradient(135deg, rgba(255,107,53,0.06), rgba(244,166,35,0.04));
    border: 1.5px dashed rgba(255,107,53,0.3);
    border-radius: 18px;
    max-width: 820px;
    margin-left: auto;
    margin-right: auto;
  }
  .dpdp__verdict p {
    font-size: 16px;
    font-weight: 800;
    color: var(--esds-navy);
    margin: 0;
    line-height: 1.5;
    letter-spacing: -0.3px;
    font-style: italic;
  }
  .dpdp__verdict em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), #F4A623);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
  }


  /* ═══ §3 SIX OBLIGATIONS ═══ */
  .dpdp__oblig-intro {
    font-size: 16px;
    line-height: 1.7;
    color: var(--esds-gray-500);
    max-width: 820px;
    margin: 0 auto 48px;
    text-align: center;
  }
  .dpdp__oblig-intro strong { color: var(--esds-navy); font-weight: 700; }
  .dpdp__oblig-icon {
    width: 56px; height: 56px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    margin-bottom: 16px;
    transition: all 0.4s var(--esds-ease);
    color: #fff;
    position: relative;
    overflow: hidden;
  }
  .dpdp__oblig-icon::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 30% 30%, rgba(255,255,255,0.25), transparent 70%);
  }
  .dpdp__oblig-icon svg { width: 30px; height: 30px; z-index: 2; position: relative; }
  .feature-card:hover .dpdp__oblig-icon { transform: scale(1.1) rotate(-5deg); }
  .dpdp__oblig-icon--consent  { background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light)); box-shadow: 0 6px 16px rgba(0,97,255,0.30); }
  .dpdp__oblig-icon--notice   { background: linear-gradient(135deg, #6D28D9, #A78BFA); box-shadow: 0 6px 16px rgba(124,58,237,0.30); }
  .dpdp__oblig-icon--security { background: linear-gradient(135deg, #B91C1C, #EF4444); box-shadow: 0 6px 16px rgba(185,28,28,0.30); }
  .dpdp__oblig-icon--breach   { background: linear-gradient(135deg, var(--india-saffron), #FF8856); box-shadow: 0 6px 16px rgba(255,107,53,0.30); }
  .dpdp__oblig-icon--erasure  { background: linear-gradient(135deg, #B45309, #F59E0B); box-shadow: 0 6px 16px rgba(217,119,6,0.30); }
  .dpdp__oblig-icon--rights   { background: linear-gradient(135deg, var(--india-green), #22C55E); box-shadow: 0 6px 16px rgba(19,136,8,0.30); }
  /* Pulsing 72-hour badge on Breach card */
  .dpdp__72hr-pulse {
    display: inline-block;
    padding: 3px 8px;
    background: rgba(255,107,53,0.10);
    border: 1px solid rgba(255,107,53,0.3);
    border-radius: 6px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.06em;
    margin-top: 8px;
    animation: dpdp-warn-pulse 2s ease-in-out infinite;
  }


  /* ═══ §4 PENALTY TIERS (dark) ═══ */
  .dpdp__penalty-headline {
    text-align: center;
    margin: 0 auto 48px;
    max-width: 820px;
  }
  .dpdp__penalty-headline p {
    font-size: 17px;
    font-weight: 800;
    color: #fff;
    line-height: 1.5;
    letter-spacing: -0.3px;
    margin: 0;
    font-style: italic;
  }
  .dpdp__penalty-headline em {
    font-style: italic;
    background: linear-gradient(135deg, #FF6B6B, #F4A623);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .dpdp__penalty-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin-bottom: 36px;
  }
  @media (max-width: 900px) { .dpdp__penalty-grid { grid-template-columns: 1fr; } }
  .dpdp__penalty-card {
    background: rgba(220,38,38,0.06);
    border: 1.5px solid rgba(239,68,68,0.20);
    border-radius: 22px;
    padding: 32px 28px;
    text-align: center;
    transition: all 0.4s var(--esds-ease);
    position: relative;
    overflow: hidden;
  }
  .dpdp__penalty-card::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 50% 0%, rgba(239,68,68,0.10), transparent 60%);
    pointer-events: none;
  }
  .dpdp__penalty-card:hover {
    transform: translateY(-6px);
    background: rgba(220,38,38,0.10);
    border-color: rgba(239,68,68,0.40);
  }
  .dpdp__penalty-card__tier {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    background: rgba(239,68,68,0.12);
    border: 1px solid rgba(239,68,68,0.30);
    border-radius: 100px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: #FCA5A5;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 18px;
    position: relative;
    z-index: 2;
  }
  .dpdp__penalty-card__tier::before { content: '⚠'; }
  .dpdp__penalty-card__amount {
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(40px, 5.4vw, 56px);
    font-weight: 800;
    background: linear-gradient(135deg, #FF6B6B, #F4A623);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    line-height: 1;
    letter-spacing: -2px;
    margin-bottom: 6px;
    position: relative;
    z-index: 2;
  }
  .dpdp__penalty-card__unit {
    font-family: 'JetBrains Mono', monospace;
    font-size: 13px;
    font-weight: 800;
    color: #FCA5A5;
    letter-spacing: 0.1em;
    margin-bottom: 16px;
    text-transform: uppercase;
    position: relative;
    z-index: 2;
  }
  .dpdp__penalty-card__desc {
    font-size: 13px;
    color: var(--esds-gray-200);
    line-height: 1.6;
    margin: 0;
    position: relative;
    z-index: 2;
  }
  .dpdp__penalty-card__desc strong { color: #fff; font-weight: 700; }
  .dpdp__penalty-explain {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 14px;
    padding: 22px 28px;
    margin-bottom: 32px;
  }
  .dpdp__penalty-explain p {
    font-size: 14px;
    color: var(--esds-gray-300);
    line-height: 1.75;
    margin: 0;
  }
  .dpdp__penalty-explain p strong { color: #fff; font-weight: 700; }
  .dpdp__penalty-verdict {
    text-align: center;
    padding: 24px 32px;
    background: linear-gradient(135deg, rgba(126,233,255,0.06), rgba(0,97,255,0.04));
    border: 1.5px solid rgba(126,233,255,0.20);
    border-radius: 18px;
  }
  .dpdp__penalty-verdict p {
    font-size: 15.5px;
    font-weight: 800;
    color: #fff;
    margin: 0;
    line-height: 1.5;
    letter-spacing: -0.3px;
    font-style: italic;
  }
  .dpdp__penalty-verdict em {
    font-style: italic;
    color: var(--highlight-blue-light);
    font-weight: 800;
  }


  /* ═══ §5 INFRASTRUCTURE REQUIREMENTS — 7 cards ═══ */
  .dpdp__req-intro {
    font-size: 16px;
    line-height: 1.7;
    color: var(--esds-gray-500);
    max-width: 820px;
    margin: 0 auto 48px;
    text-align: center;
  }
  .dpdp__req-intro strong { color: var(--esds-navy); font-weight: 700; }
  .dpdp__req-intro em {
    font-style: italic;
    color: var(--highlight-blue);
    font-weight: 800;
  }
  .dpdp__req-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }
  @media (max-width: 800px) { .dpdp__req-grid { grid-template-columns: 1fr; } }
  .dpdp__req-card {
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 16px;
    padding: 24px 28px;
    transition: all 0.3s var(--esds-ease);
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 18px;
    align-items: flex-start;
    position: relative;
    overflow: hidden;
  }
  .dpdp__req-card::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 4px;
    background: linear-gradient(180deg, var(--highlight-blue), var(--highlight-blue-light));
    transform: scaleY(0.3);
    transform-origin: top;
    transition: transform 0.4s var(--esds-ease);
  }
  .dpdp__req-card:hover {
    transform: translateY(-3px);
    border-color: var(--highlight-blue);
    box-shadow: 0 10px 24px rgba(0,97,255,0.08);
  }
  .dpdp__req-card:hover::before { transform: scaleY(1); }
  .dpdp__req-card__num {
    width: 36px; height: 36px;
    border-radius: 10px;
    background: linear-gradient(135deg, rgba(0,97,255,0.10), rgba(126,233,255,0.10));
    color: var(--highlight-blue);
    display: grid;
    place-items: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    font-weight: 800;
    border: 1px solid rgba(0,97,255,0.18);
    flex-shrink: 0;
  }
  .dpdp__req-card__body h4 {
    font-size: 15.5px;
    font-weight: 800;
    color: var(--esds-navy);
    margin: 0 0 10px;
    letter-spacing: -0.3px;
    line-height: 1.3;
  }
  .dpdp__req-card__body p {
    font-size: 13px;
    color: var(--esds-gray-600);
    line-height: 1.7;
    margin: 0;
  }
  .dpdp__req-card__body p strong { color: var(--esds-navy); font-weight: 700; }
  .dpdp__req-card__body p em {
    font-style: italic;
    color: var(--india-saffron);
    font-weight: 700;
  }


  /* ═══ §6 ENFORCEMENT CASES — 8 cards with filter ═══ */
  .dpdp__cases-intro {
    font-size: 16px;
    line-height: 1.7;
    color: var(--esds-gray-500);
    max-width: 820px;
    margin: 0 auto 36px;
    text-align: center;
  }
  .dpdp__cases-intro strong { color: var(--esds-navy); font-weight: 700; }
  .dpdp__cases-filters {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin: 0 auto 40px;
    max-width: 720px;
  }
  .dpdp__filter {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 18px;
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 100px;
    font-size: 12.5px;
    font-weight: 800;
    color: var(--esds-gray-700);
    cursor: pointer;
    transition: all 0.25s var(--esds-ease);
    font-family: inherit;
  }
  .dpdp__filter:hover {
    border-color: var(--highlight-blue);
    color: var(--highlight-blue);
    transform: translateY(-2px);
  }
  .dpdp__filter.is-active {
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    border-color: transparent;
    color: #fff;
    box-shadow: 0 6px 18px rgba(0,97,255,0.25);
  }
  .dpdp__filter__count {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    background: rgba(255,255,255,0.18);
    padding: 2px 6px;
    border-radius: 100px;
    letter-spacing: 0.05em;
  }
  .dpdp__filter:not(.is-active) .dpdp__filter__count {
    background: var(--esds-gray-100);
    color: var(--esds-gray-500);
  }

  .dpdp__cases-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
  }
  @media (max-width: 900px) { .dpdp__cases-grid { grid-template-columns: 1fr; } }
  .dpdp__case-card {
    background: #fff;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 16px;
    overflow: hidden;
    transition: all 0.4s var(--esds-ease), opacity 0.3s, transform 0.3s, height 0.3s;
    display: grid;
    grid-template-columns: 130px 1fr;
  }
  @media (max-width: 600px) { .dpdp__case-card { grid-template-columns: 1fr; } }
  .dpdp__case-card.is-hidden {
    opacity: 0;
    pointer-events: none;
    transform: scale(0.95);
    height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    overflow: hidden;
  }
  .dpdp__case-card:hover:not(.is-hidden) {
    transform: translateY(-4px);
    border-color: var(--india-saffron);
    box-shadow: 0 14px 32px rgba(255,107,53,0.10);
  }
  .dpdp__case-card__amount-side {
    background: linear-gradient(160deg, var(--esds-navy), #1E293B);
    padding: 22px 18px;
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    position: relative;
    overflow: hidden;
  }
  .dpdp__case-card__amount-side::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
      linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px);
    background-size: 16px 16px;
  }
  .dpdp__case-card[data-region="gdpr"] .dpdp__case-card__amount-side {
    background: linear-gradient(160deg, #1E40AF, #6D28D9);
  }
  .dpdp__case-card[data-region="india"] .dpdp__case-card__amount-side {
    background: linear-gradient(160deg, var(--india-saffron), #B45309);
  }
  .dpdp__case-card__flag {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    background: rgba(255,255,255,0.15);
    border: 1px solid rgba(255,255,255,0.25);
    padding: 3px 9px;
    border-radius: 100px;
    margin-bottom: 12px;
    backdrop-filter: blur(6px);
    position: relative;
    z-index: 2;
  }
  .dpdp__case-card__amount {
    font-family: 'JetBrains Mono', monospace;
    font-size: 24px;
    font-weight: 800;
    color: #fff;
    line-height: 1;
    letter-spacing: -0.5px;
    text-shadow: 0 2px 8px rgba(0,0,0,0.2);
    position: relative;
    z-index: 2;
    word-break: break-word;
  }
  .dpdp__case-card__year {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    opacity: 0.85;
    margin-top: 6px;
    letter-spacing: 0.06em;
    position: relative;
    z-index: 2;
  }
  .dpdp__case-card__body {
    padding: 22px 24px;
  }
  .dpdp__case-card__regulator {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--esds-gray-500);
    letter-spacing: 0.10em;
    text-transform: uppercase;
    margin-bottom: 6px;
  }
  .dpdp__case-card__title {
    font-size: 16px;
    font-weight: 800;
    color: var(--esds-navy);
    line-height: 1.3;
    letter-spacing: -0.3px;
    margin: 0 0 10px;
  }
  .dpdp__case-card__desc {
    font-size: 12.5px;
    color: var(--esds-gray-600);
    line-height: 1.65;
    margin: 0 0 12px;
  }
  .dpdp__case-card__desc strong { color: var(--esds-navy); font-weight: 700; }
  .dpdp__case-card__lesson {
    font-size: 12.5px;
    color: var(--india-saffron);
    line-height: 1.55;
    margin: 0;
    padding: 10px 14px;
    background: rgba(255,107,53,0.05);
    border-left: 3px solid var(--india-saffron);
    border-radius: 0 6px 6px 0;
    font-style: italic;
    font-weight: 600;
  }
  .dpdp__case-card__lesson strong {
    color: var(--india-saffron);
    font-weight: 800;
  }

  /* Closing Indian regulator commentary */
  .dpdp__cases-closer {
    margin-top: 36px;
    padding: 26px 30px;
    background: linear-gradient(135deg, var(--esds-navy) 0%, #0d1c34 100%);
    border-radius: 18px;
    color: #fff;
    text-align: center;
    position: relative;
    overflow: hidden;
  }
  .dpdp__cases-closer::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
      linear-gradient(rgba(126,233,255,0.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(126,233,255,0.04) 1px, transparent 1px);
    background-size: 30px 30px;
  }
  .dpdp__cases-closer p {
    font-size: 14.5px;
    color: var(--esds-gray-200);
    line-height: 1.7;
    margin: 0;
    font-style: italic;
    font-weight: 600;
    position: relative;
    z-index: 2;
  }
  .dpdp__cases-closer p strong { color: #fff; font-weight: 700; font-style: normal; }
  .dpdp__cases-closer p em {
    font-style: italic;
    color: var(--highlight-blue-light);
    font-weight: 800;
  }


  /* ═══ §7 THE ESDS ANSWER (dark) — 8 sovereign-ready cards ═══ */
  .dpdp__answer-headline {
    text-align: center;
    margin: 0 auto 48px;
    max-width: 800px;
  }
  .dpdp__answer-headline p {
    font-size: 16px;
    color: var(--esds-gray-300);
    line-height: 1.75;
    margin: 0 auto 18px;
  }
  .dpdp__answer-headline strong { color: #fff; font-weight: 700; }
  .dpdp__answer-headline em {
    font-style: italic;
    background: linear-gradient(135deg, var(--highlight-blue-light), #fff);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
  }
  .dpdp__answer-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }
  @media (max-width: 800px) { .dpdp__answer-grid { grid-template-columns: 1fr; } }
  .dpdp__answer-card {
    background: rgba(126,233,255,0.04);
    border: 1.5px solid rgba(126,233,255,0.20);
    border-radius: 16px;
    padding: 22px 26px;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 18px;
    align-items: flex-start;
    transition: all 0.3s var(--esds-ease);
  }
  .dpdp__answer-card:hover {
    background: rgba(126,233,255,0.08);
    border-color: rgba(126,233,255,0.4);
    transform: translateY(-3px);
  }
  .dpdp__answer-card__check {
    width: 36px; height: 36px;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--india-green), #22C55E);
    color: #fff;
    display: grid;
    place-items: center;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(19,136,8,0.30);
  }
  .dpdp__answer-card__check svg { width: 18px; height: 18px; }
  .dpdp__answer-card__body h4 {
    font-size: 15.5px;
    font-weight: 800;
    color: #fff;
    margin: 0 0 8px;
    letter-spacing: -0.3px;
    line-height: 1.3;
  }
  .dpdp__answer-card__body p {
    font-size: 13px;
    color: var(--esds-gray-300);
    line-height: 1.7;
    margin: 0;
  }
  .dpdp__answer-card__body p strong { color: #fff; font-weight: 700; }


  /* ═══ §8 CTA pre + readiness strip ═══ */
  .dpdp__cta-pre {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--highlight-blue-light);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 14px;
    display: inline-block;
    position: relative;
    z-index: 2;
  }
  .dpdp__cta-pre::before, .dpdp__cta-pre::after {
    content: '';
    display: inline-block;
    width: 24px; height: 1px;
    background: var(--highlight-blue-light);
    vertical-align: middle;
    opacity: 0.5;
    margin: 0 10px;
  }
  
  
  

/* ───────────────────────────────────────────────────────────────────────────
   §A · HERO — year-anchor masthead with watermark "2005" behind title
   ─────────────────────────────────────────────────────────────────────────── */
.abt__hero-anchor {
    position: relative;
    text-align: center;
    padding-top: 28px;
}
.abt__hero-watermark {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -52%);
    font-family: var(--font-display);
    font-size: clamp(220px, 28vw, 360px);
    font-weight: 800;
    line-height: 0.85;
    letter-spacing: -8px;
    background: linear-gradient(180deg,
        rgba(255, 153, 51, 0.10) 0%,
        rgba(0, 97, 255, 0.06) 50%,
        rgba(19, 136, 8, 0.05) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    user-select: none;
    pointer-events: none;
    z-index: 0;
    white-space: nowrap;
}
.abt__hero-content {
    position: relative;
    z-index: 1;
}
.abt__hero-tag {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 6px 16px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 153, 51, 0.30);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 22px;
}
.abt__hero-tag::before {
    content: '';
    width: 22px;
    height: 7px;
    background: linear-gradient(180deg,
        var(--india-saffron) 0%, var(--india-saffron) 33%,
        #fff 33%, #fff 66%,
        var(--india-green) 66%, var(--india-green) 100%);
    border-radius: 1.5px;
    flex-shrink: 0;
}
.abt__hero-conviction {
    max-width: 880px;
    margin: 28px auto 0;
    font-size: 17px;
    color: var(--esds-gray-200);
    line-height: 1.75;
    font-weight: 400;
    letter-spacing: -0.1px;
}
.abt__hero-conviction strong {
    color: #fff;
    font-weight: 700;
}
.abt__hero-conviction em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 600;
}

/* Founding stats ribbon — 6 metric ribbon below hero */
.abt__found-ribbon {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 0;
    margin: 56px auto 0;
    padding: 32px 0 8px;
    max-width: 1180px;
    border-top: 1px solid rgba(255, 255, 255, 0.10);
    position: relative;
    z-index: 1;
}
.abt__found-cell {
    text-align: center;
    padding: 0 12px;
    border-right: 1px solid rgba(255, 255, 255, 0.10);
    transition: transform 0.3s var(--esds-ease);
}
.abt__found-cell:last-child { border-right: 0; }
.abt__found-cell:hover { transform: translateY(-3px); }
.abt__found-num {
    font-family: var(--font-display);
    font-size: clamp(28px, 3.4vw, 40px);
    font-weight: 800;
    line-height: 1;
    margin: 0 0 6px;
    letter-spacing: -1.2px;
    color: #fff;
}
.abt__found-cell:nth-child(1) .abt__found-num,
.abt__found-cell:nth-child(4) .abt__found-num {
    background: linear-gradient(135deg, var(--india-saffron), #ffb84d);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.abt__found-cell:nth-child(2) .abt__found-num,
.abt__found-cell:nth-child(5) .abt__found-num {
    background: linear-gradient(135deg, var(--highlight-blue-light), #fff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.abt__found-cell:nth-child(3) .abt__found-num,
.abt__found-cell:nth-child(6) .abt__found-num {
    background: linear-gradient(135deg, #22c55e, #7EE9FF);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.abt__found-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.55);
    letter-spacing: 0.10em;
    line-height: 1.5;
    margin: 0;
    text-transform: uppercase;
}

@media (max-width: 992px) {
    .abt__found-ribbon { grid-template-columns: repeat(3, 1fr); gap: 32px 0; }
    .abt__found-cell:nth-child(3n) { border-right: 0; }
}
@media (max-width: 540px) {
    .abt__found-ribbon { grid-template-columns: repeat(2, 1fr); gap: 28px 0; }
    .abt__found-cell:nth-child(2n), .abt__found-cell:nth-child(3n) { border-right: 0; }
    .abt__found-cell:nth-child(odd) { border-right: 1px solid rgba(255, 255, 255, 0.10); }
}

@media (max-width: 768px) {
    .abt__hero-watermark { font-size: 200px; letter-spacing: -4px; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §B · ORIGIN TIMELINE — alternating magazine layout, 19 milestones
   ─────────────────────────────────────────────────────────────────────────── */
.abt__origin-eyebrow {
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.20em;
    text-transform: uppercase;
    margin: 0 0 14px;
}
.abt__origin-eyebrow::before,
.abt__origin-eyebrow::after {
    content: '';
    display: inline-block;
    width: 28px; height: 1px;
    background: var(--india-saffron);
    opacity: 0.4;
    vertical-align: middle;
    margin: 0 12px 4px;
}
.abt__origin-head {
    text-align: center;
    font-size: clamp(28px, 4.4vw, 46px);
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -1.2px;
    line-height: 1.12;
    margin: 0 auto 6px;
    max-width: 880px;
}
.abt__origin-head em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.abt__origin-sub {
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    font-weight: 700;
    color: var(--esds-gray-500);
    letter-spacing: 0.06em;
    margin: 0 auto 64px;
}
.abt__origin-sub span {
    color: var(--india-saffron);
    margin: 0 8px;
}

/* Vertical thread connecting all milestones */
.abt__timeline {
    position: relative;
    max-width: 1080px;
    margin: 0 auto;
    padding: 0;
}
.abt__timeline::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 30px;
    bottom: 30px;
    width: 2px;
    background: linear-gradient(180deg,
        var(--india-saffron) 0%,
        var(--india-saffron) 12%,
        var(--highlight-blue) 28%,
        var(--highlight-blue) 50%,
        var(--india-saffron) 72%,
        var(--india-green) 92%,
        var(--india-green) 100%);
    transform: translateX(-50%);
    z-index: 0;
}
.abt__milestone {
    display: grid;
    grid-template-columns: 1fr 80px 1fr;
    gap: 0;
    align-items: center;
    padding: 28px 0;
    position: relative;
    z-index: 1;
}
.abt__milestone-year-col,
.abt__milestone-text-col {
    padding: 0 36px;
    transition: transform 0.3s var(--esds-ease);
}
.abt__milestone:nth-child(odd) .abt__milestone-year-col {
    text-align: right;
    order: 1;
}
.abt__milestone:nth-child(odd) .abt__milestone-dot { order: 2; }
.abt__milestone:nth-child(odd) .abt__milestone-text-col {
    text-align: left;
    order: 3;
}
.abt__milestone:nth-child(even) .abt__milestone-text-col {
    text-align: right;
    order: 1;
}
.abt__milestone:nth-child(even) .abt__milestone-dot { order: 2; }
.abt__milestone:nth-child(even) .abt__milestone-year-col {
    text-align: left;
    order: 3;
}
.abt__milestone:hover .abt__milestone-year-col,
.abt__milestone:hover .abt__milestone-text-col {
    transform: translateY(-3px);
}

.abt__milestone-year {
    font-family: var(--font-display);
    font-size: clamp(48px, 6vw, 72px);
    font-weight: 800;
    line-height: 1;
    margin: 0;
    letter-spacing: -2px;
    color: var(--esds-gray-200);
    transition: color 0.4s var(--esds-ease);
    user-select: none;
}
.abt__milestone:hover .abt__milestone-year {
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.abt__milestone:nth-child(1) .abt__milestone-year,
.abt__milestone:nth-child(2) .abt__milestone-year,
.abt__milestone:nth-child(3) .abt__milestone-year,
.abt__milestone:nth-child(4) .abt__milestone-year {
    background: linear-gradient(135deg, var(--india-saffron), #ffb84d);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.abt__milestone:nth-last-child(-n+3) .abt__milestone-year {
    background: linear-gradient(135deg, var(--india-green), #22c55e);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.abt__milestone-dot {
    width: 80px;
    display: grid;
    place-items: center;
    z-index: 2;
    align-self: center;
}
.abt__milestone-dot-inner {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fff;
    border: 3px solid var(--highlight-blue);
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 1), 0 6px 16px rgba(0, 97, 255, 0.30);
    transition: all 0.3s var(--esds-ease);
}
.abt__milestone:hover .abt__milestone-dot-inner {
    transform: scale(1.4);
    border-color: var(--india-saffron);
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 1), 0 8px 22px rgba(255, 153, 51, 0.45);
}
.abt__milestone:nth-child(1) .abt__milestone-dot-inner,
.abt__milestone:nth-child(2) .abt__milestone-dot-inner,
.abt__milestone:nth-child(3) .abt__milestone-dot-inner,
.abt__milestone:nth-child(4) .abt__milestone-dot-inner {
    border-color: var(--india-saffron);
}
.abt__milestone:nth-last-child(-n+3) .abt__milestone-dot-inner {
    border-color: var(--india-green);
}

.abt__milestone-event {
    font-size: 17px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.4px;
    line-height: 1.35;
    margin: 0 0 8px;
}
.abt__milestone-event strong {
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.abt__milestone-significance {
    font-size: 14px;
    color: var(--esds-gray-700);
    line-height: 1.65;
    margin: 0;
    font-style: italic;
}
.abt__milestone-significance strong {
    color: var(--esds-navy);
    font-weight: 700;
    font-style: normal;
}

@media (max-width: 880px) {
    .abt__timeline::before { left: 30px; }
    .abt__milestone {
        grid-template-columns: 60px 1fr;
        padding: 18px 0;
    }
    .abt__milestone:nth-child(odd) .abt__milestone-year-col,
    .abt__milestone:nth-child(even) .abt__milestone-year-col,
    .abt__milestone:nth-child(odd) .abt__milestone-text-col,
    .abt__milestone:nth-child(even) .abt__milestone-text-col {
        order: unset;
        text-align: left;
        padding: 0 0 0 18px;
    }
    .abt__milestone:nth-child(odd) .abt__milestone-dot,
    .abt__milestone:nth-child(even) .abt__milestone-dot {
        order: unset;
        width: 60px;
        justify-self: start;
    }
    .abt__milestone-year-col {
        grid-column: 1 / -1;
        margin-bottom: 4px;
        padding-left: 78px !important;
    }
    .abt__milestone-text-col {
        grid-column: 2 / -1;
    }
    .abt__milestone-dot {
        grid-row: 2;
        grid-column: 1;
    }
    .abt__milestone-year { font-size: 40px; letter-spacing: -1.2px; }
    .abt__milestone-event { font-size: 15px; }
    .abt__milestone-significance { font-size: 13px; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §C · 4Bs MISSION — billion-counter typographic spread, no boxes
   ─────────────────────────────────────────────────────────────────────────── */
.abt__bs-eyebrow {
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.20em;
    text-transform: uppercase;
    margin: 0 0 12px;
}
.abt__bs-head {
    text-align: center;
    font-size: clamp(28px, 4.4vw, 46px);
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -1px;
    line-height: 1.12;
    margin: 0 auto 14px;
    max-width: 880px;
}
.abt__bs-head em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue), var(--india-green));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.abt__bs-lede {
    text-align: center;
    font-size: 16px;
    color: var(--esds-gray-700);
    line-height: 1.65;
    margin: 0 auto 64px;
    max-width: 760px;
}
.abt__bs-lede strong { color: var(--esds-navy); font-weight: 700; }

/* 4 commitments spread — no card containers */
.abt__bs-list {
    list-style: none;
    margin: 0;
    padding: 0;
    counter-reset: abt-bs;
}
.abt__bs-row {
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: 56px;
    align-items: center;
    padding: 56px 0;
    border-bottom: 1px solid var(--esds-gray-100);
    counter-increment: abt-bs;
    position: relative;
    overflow: hidden;
}
.abt__bs-row:last-child { border-bottom: 0; padding-bottom: 24px; }
.abt__bs-row:nth-child(even) .abt__bs-counter { order: 2; text-align: left; }
.abt__bs-row:nth-child(even) .abt__bs-content { order: 1; text-align: right; }

.abt__bs-counter {
    position: relative;
    text-align: right;
    padding: 0 12px;
}
.abt__bs-counter-mega {
    font-family: var(--font-display);
    font-size: clamp(120px, 18vw, 200px);
    font-weight: 800;
    line-height: 0.85;
    letter-spacing: -8px;
    margin: 0;
    background: linear-gradient(135deg, var(--india-saffron), #ffb84d);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.abt__bs-row:nth-child(2) .abt__bs-counter-mega {
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.abt__bs-row:nth-child(3) .abt__bs-counter-mega {
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.abt__bs-row:nth-child(4) .abt__bs-counter-mega {
    background: linear-gradient(135deg, var(--india-green), #22c55e);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.abt__bs-counter-tag {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin: 0 0 8px;
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: flex-end;
}
.abt__bs-counter-tag::before {
    content: '';
    width: 28px; height: 1px;
    background: var(--india-saffron);
    opacity: 0.5;
}
.abt__bs-counter-tag::after {
    content: 'B';
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px; height: 22px;
    background: var(--india-saffron);
    color: #fff;
    font-family: var(--font-display);
    font-size: 12px;
    font-weight: 800;
    border-radius: 50%;
    margin-left: 4px;
}
.abt__bs-row:nth-child(even) .abt__bs-counter-tag {
    justify-content: flex-start;
}
.abt__bs-row:nth-child(even) .abt__bs-counter-tag::before {
    order: 2;
}
.abt__bs-row:nth-child(2) .abt__bs-counter-tag,
.abt__bs-row:nth-child(2) .abt__bs-counter-tag::before { color: var(--highlight-blue); background: var(--highlight-blue); }
.abt__bs-row:nth-child(2) .abt__bs-counter-tag { color: var(--highlight-blue); }
.abt__bs-row:nth-child(2) .abt__bs-counter-tag::before { background: var(--highlight-blue); }
.abt__bs-row:nth-child(2) .abt__bs-counter-tag::after { background: var(--highlight-blue); }
.abt__bs-row:nth-child(4) .abt__bs-counter-tag { color: var(--india-green); }
.abt__bs-row:nth-child(4) .abt__bs-counter-tag::before { background: var(--india-green); }
.abt__bs-row:nth-child(4) .abt__bs-counter-tag::after { background: var(--india-green); }

.abt__bs-icon {
    position: absolute;
    top: 50%;
    right: 56%;
    transform: translateY(-50%);
    width: 56px; height: 56px;
    display: grid;
    place-items: center;
    color: rgba(255, 153, 51, 0.45);
    z-index: 2;
    pointer-events: none;
}
.abt__bs-icon svg { width: 100%; height: 100%; }
.abt__bs-row:nth-child(even) .abt__bs-icon {
    right: auto;
    left: 56%;
}

.abt__bs-title {
    font-size: clamp(22px, 2.6vw, 30px);
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.6px;
    line-height: 1.2;
    margin: 0 0 14px;
}
.abt__bs-title em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.abt__bs-desc {
    font-size: 15.5px;
    color: var(--esds-gray-700);
    line-height: 1.7;
    margin: 0;
}
.abt__bs-desc strong { color: var(--esds-navy); font-weight: 700; }
.abt__bs-desc em {
    font-style: normal;
    color: var(--india-saffron);
    font-weight: 700;
}

@media (max-width: 880px) {
    .abt__bs-row,
    .abt__bs-row:nth-child(even) {
        grid-template-columns: 1fr;
        gap: 22px;
        padding: 40px 0;
    }
    .abt__bs-row:nth-child(even) .abt__bs-counter,
    .abt__bs-row:nth-child(even) .abt__bs-content { order: unset; text-align: left; }
    .abt__bs-counter, .abt__bs-content { text-align: left; padding: 0; }
    .abt__bs-counter-mega { font-size: 120px; letter-spacing: -4px; }
    .abt__bs-counter-tag { justify-content: flex-start; }
    .abt__bs-row:nth-child(even) .abt__bs-counter-tag { justify-content: flex-start; }
    .abt__bs-icon { display: none; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §D · GLOBAL PRESENCE — SVG cartographic line-art
   ─────────────────────────────────────────────────────────────────────────── */
.abt__globe-eyebrow {
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.20em;
    text-transform: uppercase;
    margin: 0 0 14px;
}
.abt__globe-head {
    text-align: center;
    font-size: clamp(28px, 4.4vw, 46px);
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -1px;
    line-height: 1.12;
    margin: 0 auto 14px;
    max-width: 820px;
}
.abt__globe-head em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.abt__globe-statement {
    max-width: 880px;
    margin: 0 auto 56px;
    text-align: center;
    font-size: 15.5px;
    color: var(--esds-gray-700);
    line-height: 1.75;
}
.abt__globe-statement strong { color: var(--esds-navy); font-weight: 700; }
.abt__globe-statement em {
    font-style: italic;
    color: var(--india-saffron);
    font-weight: 700;
}

.abt__map {
    max-width: 1100px;
    margin: 0 auto 56px;
    position: relative;
}
.abt__map svg { width: 100%; height: auto; display: block; }

.abt__locations {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    max-width: 1080px;
    margin: 0 auto;
    border-top: 1px solid var(--esds-gray-100);
    border-bottom: 1px solid var(--esds-gray-100);
}
.abt__loc-col {
    padding: 32px 36px;
    border-right: 1px solid var(--esds-gray-100);
}
.abt__loc-col:last-child { border-right: 0; }
.abt__loc-eyebrow {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin: 0 0 14px;
    display: flex;
    align-items: center;
    gap: 10px;
}
.abt__loc-eyebrow::before {
    content: '';
    width: 8px; height: 8px;
    background: var(--india-saffron);
    border-radius: 50%;
    box-shadow: 0 0 0 3px rgba(255, 153, 51, 0.20);
}
.abt__loc-col:nth-child(2) .abt__loc-eyebrow { color: var(--highlight-blue); }
.abt__loc-col:nth-child(2) .abt__loc-eyebrow::before {
    background: var(--highlight-blue);
    box-shadow: 0 0 0 3px rgba(0, 97, 255, 0.20);
}
.abt__loc-list {
    font-size: 17px;
    color: var(--esds-navy);
    font-weight: 700;
    line-height: 1.85;
    letter-spacing: -0.3px;
}
.abt__loc-list .abt__loc-pipe {
    color: var(--india-saffron);
    font-weight: 800;
    margin: 0 8px;
    opacity: 0.7;
}
.abt__loc-col:nth-child(2) .abt__loc-list .abt__loc-pipe {
    color: var(--highlight-blue);
}
.abt__loc-list .abt__loc-hq {
    background: linear-gradient(135deg, var(--india-saffron), #ffb84d);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}

@media (max-width: 768px) {
    .abt__locations { grid-template-columns: 1fr; }
    .abt__loc-col { border-right: 0; border-bottom: 1px solid var(--esds-gray-100); }
    .abt__loc-col:last-child { border-bottom: 0; }
    .abt__loc-list { font-size: 15px; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §E · CLOSING CTA — construction-schedule layout
   ─────────────────────────────────────────────────────────────────────────── */
.abt__close-eyebrow {
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.20em;
    text-transform: uppercase;
    margin: 0 0 14px;
}
.abt__close-head {
    text-align: center;
    font-size: clamp(28px, 4.4vw, 48px);
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -1.2px;
    line-height: 1.12;
    margin: 0 auto 36px;
    max-width: 880px;
}
.abt__close-head em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Construction schedule — 3 status rows with hairline dividers */
.abt__schedule {
    max-width: 880px;
    margin: 0 auto 48px;
    border-top: 1px dashed var(--esds-gray-200);
    border-bottom: 1px dashed var(--esds-gray-200);
}
.abt__schedule-row {
    display: grid;
    grid-template-columns: 110px 1fr;
    gap: 24px;
    align-items: center;
    padding: 22px 4px;
    border-bottom: 1px dashed var(--esds-gray-100);
}
.abt__schedule-row:last-child { border-bottom: 0; }
.abt__schedule-status {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.10em;
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 5px 10px;
    border-radius: 999px;
    width: fit-content;
}
.abt__schedule-row:nth-child(1) .abt__schedule-status {
    background: rgba(34, 197, 94, 0.10);
    color: var(--india-green);
}
.abt__schedule-row:nth-child(2) .abt__schedule-status {
    background: rgba(255, 153, 51, 0.10);
    color: var(--india-saffron);
}
.abt__schedule-row:nth-child(3) .abt__schedule-status {
    background: rgba(0, 97, 255, 0.10);
    color: var(--highlight-blue);
}
.abt__schedule-status::before {
    content: '';
    width: 6px; height: 6px;
    background: currentColor;
    border-radius: 50%;
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 1), 0 0 0 4px currentColor;
}
.abt__schedule-text {
    font-size: 15.5px;
    color: var(--esds-gray-700);
    line-height: 1.6;
    margin: 0;
}
.abt__schedule-text strong { color: var(--esds-navy); font-weight: 800; }

@media (max-width: 540px) {
    .abt__schedule-row { grid-template-columns: 1fr; gap: 6px; padding: 18px 4px; }
}

.abt__close-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
}


  
.hero-video-wrapper {
  position: absolute;
  z-index: -1;
  pointer-events: none;
  inset: 0;
  width: 100%;
  height: 100%;
}
.hero-video-wrapper .hero-video {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 25%;
	margin-left: auto;
}
.hero-video-wrapper::before {
	content: '';
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	background: #0E1220;
	background: linear-gradient(222deg, rgba(14, 18, 32, 0) 9%, rgba(14, 18, 32, 0.9) 63%, rgba(14, 18, 32, 1) 100%);
	background: #0E1220;
	background: linear-gradient(260deg, rgba(14, 18, 32, 0) 23%, rgba(14, 18, 32, 0.83) 80%);
}

.inner-hero .container {
  position: relative;
}
.stat-card {
  backdrop-filter: blur(26px);
}
.stat-label {
  /* color: #fff; */
}
.inner-hero__badge {
	backdrop-filter: blur(20px);
}

.inner-hero__title {
	font-size: clamp(34px, 5.4vw, 54px);
}
.inner-hero__lede {
	font-size: clamp(15px, 1.35vw, 16px);
}


 <style>
/* ═══════════════════════════════════════════════════════════════════════════
   SOC · SOC 2.0 — Page-specific styles (soc__ prefix)
   Common patterns (sec, inner-hero, faq-acc, page-cta, container, tokens,
   stat-card, breadcrumb) come from shared style.css.
   ═══════════════════════════════════════════════════════════════════════════ */


/* ───────────────────────────────────────────────────────────────────────────
   §A · HERO — "SOC Watchtower" console
   ─────────────────────────────────────────────────────────────────────────── */
.soc__hero-grid {
    display: grid;
    grid-template-columns: 1fr 1.05fr;
    gap: 56px;
    align-items: center;
    margin-bottom: 56px;
}

.soc__watchtower {
    background: linear-gradient(180deg, rgba(15, 29, 50, 0.96), rgba(10, 22, 40, 0.98));
    border: 1px solid rgba(126, 233, 255, 0.22);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.45);
    position: relative;
}
.soc__watchtower::before {
    content: '';
    position: absolute;
    top: -120px; right: -120px;
    width: 320px; height: 320px;
    background: radial-gradient(circle, rgba(0, 97, 255, 0.30), transparent 65%);
    filter: blur(40px);
    pointer-events: none;
}
.soc__watchtower-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 22px 14px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    position: relative;
    z-index: 1;
}
.soc__watchtower-title {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.16em;
    color: var(--esds-gray-300);
    text-transform: uppercase;
    margin: 0;
}
.soc__watchtower-title strong { color: var(--highlight-blue-light); font-weight: 800; }
.soc__watchtower-armed {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: rgba(74, 222, 128, 0.12);
    border: 1px solid rgba(74, 222, 128, 0.30);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: #4ade80;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}
.soc__watchtower-armed::before {
    content: '';
    width: 6px; height: 6px;
    border-radius: 50%;
    background: #4ade80;
    animation: soc-pulse 1.6s ease-in-out infinite;
}
@keyframes soc-pulse {
    0%, 100% { opacity: 0.45; transform: scale(0.85); }
    50%      { opacity: 1;    transform: scale(1.15); }
}

.soc__watchtower-metrics {
    padding: 8px 22px 6px;
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}
.soc__metric {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 10px;
    align-items: center;
    padding: 10px 12px;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 8px;
}
.soc__metric-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 18px;
    font-weight: 800;
    color: var(--highlight-blue-light);
    letter-spacing: -0.4px;
    line-height: 1;
}
.soc__metric-num small {
    font-size: 11px;
    color: var(--esds-gray-400);
    margin-left: 2px;
    font-weight: 700;
}
.soc__metric-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    color: var(--esds-gray-400);
    line-height: 1.4;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.soc__metric--full {
    grid-column: span 2;
}

.soc__watchtower-activity {
    margin: 14px 22px 0;
    padding: 11px 14px;
    background: rgba(0, 97, 255, 0.08);
    border: 1px solid rgba(0, 97, 255, 0.25);
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    color: var(--highlight-blue-light);
    letter-spacing: 0.04em;
    position: relative;
    z-index: 1;
}
.soc__watchtower-activity-icon {
    width: 20px; height: 20px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 11px;
    font-weight: 800;
    flex-shrink: 0;
    animation: soc-spin 4s linear infinite;
}
@keyframes soc-spin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}
.soc__watchtower-activity-text { transition: opacity 0.3s ease; }

.soc__watchtower-foot {
    padding: 12px 22px;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    margin-top: 14px;
    background: rgba(0, 0, 0, 0.25);
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: #4ade80;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    text-align: center;
    position: relative;
    z-index: 1;
}
.soc__watchtower-foot small {
    display: block;
    color: var(--esds-gray-400);
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.10em;
    margin-top: 4px;
}

.soc__hero-tagline {
    text-align: center;
    margin-top: 40px;
    padding: 26px 32px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.06), rgba(126, 233, 255, 0.02));
    border: 1px solid rgba(126, 233, 255, 0.20);
    border-radius: 14px;
    font-size: 17px;
    color: var(--esds-navy);
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: -0.2px;
}
.soc__hero-tagline strong {
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}

@media (max-width: 992px) {
    .soc__hero-grid { grid-template-columns: 1fr; gap: 36px; }
    .soc__watchtower { max-width: 540px; margin: 0 auto; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §B · THREAT LANDSCAPE — 5 red-tinted threat-stat cards
   ─────────────────────────────────────────────────────────────────────────── */
.soc__threat-lede {
    text-align: center;
    margin-bottom: 36px;
    max-width: 880px;
    margin-left: auto;
    margin-right: auto;
    font-size: 17px;
    color: var(--esds-gray-700);
    line-height: 1.6;
    font-weight: 600;
}
.soc__threat-lede strong { color: #dc2626; font-weight: 800; }
.soc__threat-lede em {
    font-style: normal;
    color: var(--esds-navy);
    font-weight: 800;
}

.soc__threats {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 14px;
}
.soc__threat {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 22px 20px 20px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease);
}
.soc__threat::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(90deg, #dc2626, #f97316);
}
.soc__threat:hover {
    transform: translateY(-5px);
    box-shadow: 0 22px 50px rgba(220, 38, 38, 0.12);
    border-color: rgba(220, 38, 38, 0.20);
}
.soc__threat-tag {
    display: inline-flex;
    align-items: center;
    padding: 3px 9px;
    background: rgba(220, 38, 38, 0.06);
    border-radius: 4px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: #dc2626;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 14px;
    align-self: flex-start;
}
.soc__threat-stat {
    font-size: 30px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -1px;
    line-height: 1;
    margin-bottom: 8px;
}
.soc__threat-stat-unit {
    font-size: 14px;
    font-weight: 700;
    color: var(--esds-gray-500);
    letter-spacing: 0;
    margin-left: 2px;
}
.soc__threat-name {
    font-size: 13px;
    color: var(--esds-gray-600);
    line-height: 1.55;
    margin: 0;
    flex-grow: 1;
}
.soc__threat-name strong { color: var(--esds-navy); font-weight: 700; }

@media (max-width: 1100px) { .soc__threats { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px)  { .soc__threats { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §C · ARSENAL — 8 capability cards in 4×2 grid with corner ribbons
   ─────────────────────────────────────────────────────────────────────────── */
.soc__arsenal-lede {
    text-align: center;
    margin-bottom: 36px;
    max-width: 880px;
    margin-left: auto;
    margin-right: auto;
    font-size: 15px;
    color: var(--esds-gray-700);
    line-height: 1.65;
}
.soc__arsenal {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
.soc__weapon {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 24px 22px 20px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.soc__weapon-ribbon {
    /* corner-pinned mono index */
    position: absolute;
    top: 14px; right: 14px;
    padding: 3px 8px;
    background: rgba(0, 97, 255, 0.06);
    border: 1px solid rgba(0, 97, 255, 0.18);
    border-radius: 4px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.14em;
    text-transform: uppercase;
}
.soc__weapon:hover {
    transform: translateY(-5px);
    box-shadow: 0 22px 50px rgba(0, 97, 255, 0.14);
    border-color: rgba(0, 97, 255, 0.25);
}
.soc__weapon-icon {
    width: 48px; height: 48px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.12), rgba(126, 233, 255, 0.04));
    border: 1px solid rgba(0, 97, 255, 0.22);
    display: grid;
    place-items: center;
    color: var(--highlight-blue);
    margin-bottom: 16px;
    transition: transform 0.3s var(--esds-ease);
}
.soc__weapon:hover .soc__weapon-icon { transform: rotate(-6deg) scale(1.08); }
.soc__weapon-icon svg { width: 24px; height: 24px; }
.soc__weapon-name {
    font-size: 14.5px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    margin: 0 0 8px;
    line-height: 1.3;
}
.soc__weapon-text {
    font-size: 12.5px;
    color: var(--esds-gray-600);
    line-height: 1.6;
    margin: 0;
    flex-grow: 1;
}

@media (max-width: 1100px) { .soc__arsenal { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px)  { .soc__arsenal { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §D · COMPARISON — 4-column table (ESDS / In-House / Generic / Non-Sov)
   ─────────────────────────────────────────────────────────────────────────── */
.soc__compare-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.soc__compare {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 22px 50px rgba(10, 22, 40, 0.08);
    min-width: 880px;
}
.soc__compare-row {
    display: grid;
    grid-template-columns: 1.1fr 1.4fr 1fr 1fr 1fr;
    gap: 0;
    border-bottom: 1px solid var(--esds-gray-100);
    transition: background 0.25s;
}
.soc__compare-row:last-child { border-bottom: 0; }
.soc__compare-row:hover .soc__compare-cell { background-color: rgba(0, 97, 255, 0.02); }
.soc__compare-row:hover .soc__compare-cell--ours { background-color: rgba(0, 97, 255, 0.06); }
.soc__compare-cell {
    padding: 14px 18px;
    font-size: 13px;
    line-height: 1.5;
    border-right: 1px solid var(--esds-gray-100);
    transition: background-color 0.25s;
}
.soc__compare-cell:last-child { border-right: 0; }
.soc__compare-cell--head {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.10em;
    color: var(--esds-navy);
    text-transform: uppercase;
    background: var(--esds-gray-50);
    padding: 16px 18px;
}
.soc__compare-cell--head.soc__compare-cell--ours {
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.10), rgba(126, 233, 255, 0.04));
    color: var(--highlight-blue);
}
.soc__compare-cell--head.soc__compare-cell--theirs {
    color: var(--esds-gray-600);
}
.soc__compare-cell--key {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: 0.04em;
    color: var(--esds-navy);
    background: var(--esds-gray-50);
    text-transform: uppercase;
}
.soc__compare-cell--ours {
    color: var(--esds-navy);
    font-weight: 700;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.025), transparent);
    position: relative;
    padding-left: 32px;
}
.soc__compare-cell--ours::before {
    content: '✓';
    position: absolute;
    top: 14px; left: 14px;
    color: var(--highlight-blue);
    font-size: 12px;
    font-weight: 800;
}
.soc__compare-cell--ours strong { color: var(--highlight-blue); font-weight: 800; }
.soc__compare-cell--theirs {
    color: var(--esds-gray-600);
    position: relative;
    padding-left: 30px;
}
.soc__compare-cell--theirs::before {
    content: '✗';
    position: absolute;
    top: 14px; left: 14px;
    color: rgba(220, 38, 38, 0.40);
    font-size: 11px;
    font-weight: 800;
}


/* ───────────────────────────────────────────────────────────────────────────
   §E · 6-STEP IR — phase timeline
   ─────────────────────────────────────────────────────────────────────────── */
.soc__ir-lede {
    text-align: center;
    margin-bottom: 36px;
    max-width: 880px;
    margin-left: auto;
    margin-right: auto;
    font-size: 15.5px;
    color: var(--esds-gray-700);
    line-height: 1.65;
}
.soc__ir-lede strong { color: var(--esds-navy); font-weight: 700; }
.soc__ir-lede em {
    font-style: normal;
    color: var(--highlight-blue);
    font-weight: 700;
}

.soc__ir {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 12px;
    position: relative;
}
.soc__ir-phase {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 22px 18px 20px;
    text-align: center;
    position: relative;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease);
}
.soc__ir-phase:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 38px rgba(0, 97, 255, 0.14);
}
.soc__ir-phase::after {
    content: '';
    position: absolute;
    top: 50%; right: -10px;
    transform: translateY(-50%);
    width: 0; height: 0;
    border-left: 9px solid var(--highlight-blue);
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    z-index: 2;
    filter: drop-shadow(0 2px 4px rgba(0, 97, 255, 0.20));
}
.soc__ir-phase:last-child::after { display: none; }
.soc__ir-num {
    width: 38px; height: 38px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    display: grid;
    place-items: center;
    margin: 0 auto 10px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    font-weight: 800;
    box-shadow: 0 4px 12px rgba(0, 97, 255, 0.30);
}
.soc__ir-name {
    font-size: 12.5px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.2px;
    line-height: 1.3;
    margin: 0;
}
.soc__ir-frame {
    margin-top: 22px;
    padding: 16px 22px;
    background: var(--esds-gray-50);
    border: 1px solid var(--esds-gray-100);
    border-radius: 10px;
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--esds-gray-600);
    letter-spacing: 0.14em;
    text-transform: uppercase;
}
.soc__ir-frame strong { color: var(--highlight-blue); font-weight: 800; }

@media (max-width: 1100px) { .soc__ir { grid-template-columns: repeat(3, 1fr); } .soc__ir-phase:nth-child(3)::after { display: none; } }
@media (max-width: 540px)  { .soc__ir { grid-template-columns: repeat(2, 1fr); } .soc__ir-phase:nth-child(2)::after { display: none; } .soc__ir-phase:nth-child(4)::after { display: none; } }


/* ───────────────────────────────────────────────────────────────────────────
   §F · COMPLIANCE BADGES — 9-badge 3×3 grid
   ─────────────────────────────────────────────────────────────────────────── */
.soc__compliance-lede {
    text-align: center;
    margin-bottom: 32px;
    font-size: 14.5px;
    color: var(--esds-gray-300);
    line-height: 1.65;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}
.soc__compliance-lede strong { color: #fff; font-weight: 700; }
.soc__badges {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    max-width: 880px;
    margin: 0 auto;
}
.soc__badge {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    padding: 18px 20px;
    display: flex;
    align-items: center;
    gap: 12px;
    transition: border-color 0.3s, background 0.3s, transform 0.3s var(--esds-ease);
}
.soc__badge:hover {
    border-color: rgba(126, 233, 255, 0.35);
    background: rgba(0, 97, 255, 0.04);
    transform: translateY(-2px);
}
.soc__badge-shield {
    width: 36px; height: 36px;
    border-radius: 10px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.16), rgba(126, 233, 255, 0.06));
    border: 1px solid rgba(126, 233, 255, 0.25);
    color: var(--highlight-blue-light);
    display: grid;
    place-items: center;
    flex-shrink: 0;
}
.soc__badge-shield svg { width: 18px; height: 18px; }
.soc__badge-name {
    font-size: 13.5px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.2px;
    margin: 0;
    line-height: 1.25;
}
.soc__badge-name small {
    display: block;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 700;
    color: var(--esds-gray-400);
    letter-spacing: 0.08em;
    margin-top: 2px;
    text-transform: uppercase;
}

@media (max-width: 768px) { .soc__badges { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .soc__badges { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §G · PROOF — trust statement + logo wall placeholder
   ─────────────────────────────────────────────────────────────────────────── */
.soc__proof {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 18px;
    padding: 36px 40px;
    box-shadow: 0 18px 44px rgba(10, 22, 40, 0.06);
}
.soc__proof-statement {
    text-align: center;
    margin: 0 0 28px;
    font-size: 16.5px;
    color: var(--esds-gray-700);
    line-height: 1.6;
    font-weight: 600;
}
.soc__proof-statement strong { color: var(--esds-navy); font-weight: 800; }
.soc__proof-logos {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 14px;
}
.soc__proof-logo {
    aspect-ratio: 16 / 9;
    background: var(--esds-gray-50);
    border: 1px dashed var(--esds-gray-200);
    border-radius: 10px;
    display: grid;
    place-items: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 700;
    color: var(--esds-gray-400);
    letter-spacing: 0.10em;
    text-transform: uppercase;
    transition: background 0.25s, border-color 0.25s;
}
.soc__proof-logo:hover {
    background: rgba(0, 97, 255, 0.04);
    border-color: rgba(0, 97, 255, 0.30);
    color: var(--highlight-blue);
}
.soc__proof-logo small {
    font-size: 8.5px;
    font-weight: 600;
    letter-spacing: 0.04em;
    margin-top: 2px;
    text-transform: none;
    color: var(--esds-gray-500);
}

@media (max-width: 992px) { .soc__proof-logos { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 540px) { .soc__proof-logos { grid-template-columns: repeat(2, 1fr); } }


/* ───────────────────────────────────────────────────────────────────────────
   §H · CLOSING CTA — trust extras strip
   ─────────────────────────────────────────────────────────────────────────── */
.soc__cta-trust-strip {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-top: 32px;
    padding: 18px 22px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(126, 233, 255, 0.20);
    border-radius: 12px;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.soc__cta-trust-cell {
    display: flex;
    align-items: center;
    gap: 10px;
    text-align: left;
    border-right: 1px solid rgba(255, 255, 255, 0.06);
    padding-right: 14px;
}
.soc__cta-trust-cell:last-child { border-right: 0; }
.soc__cta-trust-tick {
    width: 26px; height: 26px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 14px;
    font-weight: 800;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(0, 97, 255, 0.40);
}
.soc__cta-trust-text {
    font-size: 12.5px;
    font-weight: 600;
    color: #fff;
    line-height: 1.3;
    letter-spacing: -0.2px;
}

@media (max-width: 768px) {
    .soc__cta-trust-strip { grid-template-columns: repeat(2, 1fr); }
    .soc__cta-trust-cell { border-right: 0; padding-right: 0; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   HCC · HANA COMMUNITY CLOUD — Page-specific styles (hcc__ prefix)
   Common patterns (sec, inner-hero, faq-acc, page-cta, container, tokens,
   stat-card, breadcrumb) come from shared style.css.
   ═══════════════════════════════════════════════════════════════════════════ */


/* ───────────────────────────────────────────────────────────────────────────
   §A · HERO — SAP HANA Operations Console
   ─────────────────────────────────────────────────────────────────────────── */
.hcc__hero-grid {
    display: grid;
    grid-template-columns: 1fr 1.05fr;
    gap: 56px;
    align-items: center;
    margin-bottom: 56px;
}

.hcc__sap-mark {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 5px 12px;
    background: rgba(0, 103, 178, 0.08);
    border: 1px solid rgba(0, 103, 178, 0.25);
    border-radius: 999px;
    margin-bottom: 16px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: #0067b2;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}
.hcc__sap-mark::before {
    content: '◆';
    font-size: 9px;
    color: #0067b2;
}

.hcc__console {
    background: linear-gradient(180deg, rgba(15, 29, 50, 0.96), rgba(10, 22, 40, 0.98));
    border: 1px solid rgba(126, 233, 255, 0.22);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.45);
    position: relative;
}
.hcc__console::before {
    content: '';
    position: absolute;
    top: -120px; right: -120px;
    width: 320px; height: 320px;
    background: radial-gradient(circle, rgba(0, 97, 255, 0.30), transparent 65%);
    filter: blur(40px);
    pointer-events: none;
}
.hcc__console-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 22px 14px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    position: relative;
    z-index: 1;
}
.hcc__console-title {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.16em;
    color: var(--esds-gray-300);
    text-transform: uppercase;
    margin: 0;
}
.hcc__console-title strong { color: var(--highlight-blue-light); font-weight: 800; }
.hcc__console-armed {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: rgba(74, 222, 128, 0.12);
    border: 1px solid rgba(74, 222, 128, 0.30);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: #4ade80;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}
.hcc__console-armed::before {
    content: '';
    width: 6px; height: 6px;
    border-radius: 50%;
    background: #4ade80;
    animation: hcc-pulse 1.6s ease-in-out infinite;
}
@keyframes hcc-pulse {
    0%, 100% { opacity: 0.45; transform: scale(0.85); }
    50%      { opacity: 1;    transform: scale(1.15); }
}

.hcc__metrics {
    padding: 12px 22px 8px;
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}
.hcc__metric {
    padding: 14px 16px;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 10px;
}
.hcc__metric-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 22px;
    font-weight: 800;
    color: var(--highlight-blue-light);
    letter-spacing: -0.6px;
    line-height: 1;
    margin-bottom: 6px;
    display: block;
}
.hcc__metric-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 700;
    color: var(--esds-gray-400);
    letter-spacing: 0.10em;
    text-transform: uppercase;
    line-height: 1.4;
}
.hcc__metric-label strong { color: var(--esds-gray-300); font-weight: 800; }

.hcc__console-activity {
    margin: 14px 22px 0;
    padding: 11px 14px;
    background: rgba(0, 97, 255, 0.08);
    border: 1px solid rgba(0, 97, 255, 0.25);
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    color: var(--highlight-blue-light);
    letter-spacing: 0.04em;
    position: relative;
    z-index: 1;
}
.hcc__console-activity-icon {
    width: 20px; height: 20px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 11px;
    font-weight: 800;
    flex-shrink: 0;
    animation: hcc-spin 4s linear infinite;
}
@keyframes hcc-spin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}
.hcc__console-activity-text { transition: opacity 0.3s ease; }

.hcc__console-foot {
    padding: 12px 22px;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    margin-top: 14px;
    background: rgba(0, 0, 0, 0.25);
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: #4ade80;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    text-align: center;
    position: relative;
    z-index: 1;
}
.hcc__console-foot small {
    display: block;
    color: var(--esds-gray-400);
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.10em;
    margin-top: 4px;
}

@media (max-width: 992px) {
    .hcc__hero-grid { grid-template-columns: 1fr; gap: 36px; }
    .hcc__console { max-width: 540px; margin: 0 auto; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §B · 4 PROMISE PILLARS — total ownership / sovereignty / TCO / certified
   ─────────────────────────────────────────────────────────────────────────── */
.hcc__promise-lede {
    text-align: center;
    margin-bottom: 36px;
    max-width: 920px;
    margin-left: auto;
    margin-right: auto;
    font-size: 16px;
    color: var(--esds-gray-700);
    line-height: 1.65;
}
.hcc__promise-lede strong { color: var(--esds-navy); font-weight: 700; }
.hcc__promise-lede em {
    font-style: normal;
    color: var(--highlight-blue);
    font-weight: 700;
}

.hcc__promises {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
}
.hcc__promise {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 22px 24px 20px;
    position: relative;
    overflow: hidden;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.hcc__promise::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 3px;
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
}
.hcc__promise:hover {
    transform: translateY(-5px);
    box-shadow: 0 22px 50px rgba(0, 97, 255, 0.12);
    border-color: rgba(0, 97, 255, 0.25);
}
.hcc__promise-icon {
    width: 38px; height: 38px;
    border-radius: 10px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.12), rgba(126, 233, 255, 0.04));
    border: 1px solid rgba(0, 97, 255, 0.22);
    color: var(--highlight-blue);
    display: grid;
    place-items: center;
    margin-bottom: 14px;
}
.hcc__promise-icon svg { width: 20px; height: 20px; }
.hcc__promise-name {
    font-size: 14.5px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    margin: 0 0 6px;
    line-height: 1.3;
}
.hcc__promise-text {
    font-size: 12.5px;
    color: var(--esds-gray-600);
    line-height: 1.55;
    margin: 0;
}
.hcc__promise-text strong { color: var(--esds-navy); font-weight: 700; }

@media (max-width: 1100px) { .hcc__promises { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px)  { .hcc__promises { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §C · TOTAL SAP ENVIRONMENT — 8 service cards in 2×4 with horizontal icon
   ─────────────────────────────────────────────────────────────────────────── */
.hcc__env-lede {
    text-align: center;
    margin-bottom: 36px;
    max-width: 920px;
    margin-left: auto;
    margin-right: auto;
    font-size: 15.5px;
    color: var(--esds-gray-700);
    line-height: 1.65;
}
.hcc__env-lede strong { color: var(--esds-navy); font-weight: 700; }
.hcc__env-lede em {
    font-style: normal;
    color: var(--highlight-blue);
    font-weight: 700;
}

.hcc__services {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}
.hcc__svc {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 16px;
    padding: 24px 26px 22px;
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: 56px 1fr;
    gap: 20px;
    align-items: start;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.hcc__svc:hover {
    transform: translateY(-4px);
    box-shadow: 0 22px 50px rgba(0, 97, 255, 0.12);
    border-color: rgba(0, 97, 255, 0.25);
}
.hcc__svc-icon {
    width: 56px; height: 56px;
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.12), rgba(126, 233, 255, 0.04));
    border: 1px solid rgba(0, 97, 255, 0.22);
    color: var(--highlight-blue);
    display: grid;
    place-items: center;
    transition: transform 0.3s var(--esds-ease);
}
.hcc__svc:hover .hcc__svc-icon { transform: rotate(-6deg) scale(1.08); }
.hcc__svc-icon svg { width: 26px; height: 26px; }
.hcc__svc-body {
    display: flex;
    flex-direction: column;
}
.hcc__svc-name {
    font-size: 16px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    margin: 0 0 6px;
    line-height: 1.3;
}
.hcc__svc-tags {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 700;
    color: var(--esds-gray-500);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin: 0 0 10px;
    line-height: 1.6;
}
.hcc__svc-text {
    font-size: 12.5px;
    color: var(--esds-gray-600);
    line-height: 1.6;
    margin: 0 0 12px;
}
.hcc__svc-text strong { color: var(--esds-navy); font-weight: 700; }
.hcc__svc-out {
    margin-top: auto;
    padding: 8px 12px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.06), rgba(126, 233, 255, 0.02));
    border-left: 3px solid var(--highlight-blue);
    border-radius: 0 6px 6px 0;
    font-size: 12px;
    color: var(--esds-navy);
    font-weight: 700;
    line-height: 1.45;
}
.hcc__svc-out::before {
    content: '↑ ';
    color: var(--highlight-blue);
    font-family: 'JetBrains Mono', monospace;
    font-weight: 800;
}

@media (max-width: 992px) { .hcc__services { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §D · NON-NEGOTIABLES LEDGER — 7-row with ↑ outcome chips
   ─────────────────────────────────────────────────────────────────────────── */
.hcc__non-neg-lede {
    text-align: center;
    margin-bottom: 36px;
    max-width: 920px;
    margin-left: auto;
    margin-right: auto;
    font-size: 18px;
    color: var(--esds-navy);
    line-height: 1.5;
    font-weight: 700;
    letter-spacing: -0.4px;
}
.hcc__non-neg-lede em {
    font-style: italic;
    color: var(--highlight-blue);
}

.hcc__ledger {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 18px 44px rgba(10, 22, 40, 0.06);
}
.hcc__ledger-row {
    display: grid;
    grid-template-columns: 36px 1fr 240px;
    gap: 22px;
    padding: 20px 28px;
    border-bottom: 1px solid var(--esds-gray-100);
    align-items: center;
    transition: background 0.25s;
}
.hcc__ledger-row:last-child { border-bottom: 0; }
.hcc__ledger-row:hover { background: rgba(0, 97, 255, 0.025); }
.hcc__ledger-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.10em;
    background: rgba(0, 97, 255, 0.06);
    border: 1px solid rgba(0, 97, 255, 0.18);
    border-radius: 4px;
    padding: 6px 8px;
    text-align: center;
}
.hcc__ledger-text {
    font-size: 14px;
    color: var(--esds-gray-700);
    line-height: 1.55;
    margin: 0;
}
.hcc__ledger-text strong { color: var(--esds-navy); font-weight: 700; }
.hcc__ledger-out {
    padding: 8px 14px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.06), rgba(126, 233, 255, 0.02));
    border: 1px solid rgba(0, 97, 255, 0.18);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--highlight-blue);
    letter-spacing: 0.06em;
    text-align: center;
    line-height: 1.3;
}
.hcc__ledger-out::before {
    content: '↑ ';
    color: var(--highlight-blue);
    font-weight: 800;
}

@media (max-width: 992px) {
    .hcc__ledger-row { grid-template-columns: 36px 1fr; gap: 14px; padding: 18px 22px; }
    .hcc__ledger-out { grid-column: 1 / -1; justify-self: stretch; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §E · SOVEREIGNTY — 6-pillar dark grid
   ─────────────────────────────────────────────────────────────────────────── */
.hcc__sov-lede {
    text-align: center;
    margin-bottom: 36px;
    max-width: 920px;
    margin-left: auto;
    margin-right: auto;
    font-size: 15px;
    color: var(--esds-gray-300);
    line-height: 1.65;
}
.hcc__sov-lede strong { color: #fff; font-weight: 700; }
.hcc__sov-lede em {
    font-style: italic;
    color: var(--highlight-blue-light);
}

.hcc__sov-pillars {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}
.hcc__sov-pillar {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 14px;
    padding: 24px 26px 22px;
    transition: transform 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease), background 0.3s var(--esds-ease);
}
.hcc__sov-pillar:hover {
    transform: translateY(-4px);
    border-color: rgba(126, 233, 255, 0.30);
    background: rgba(0, 97, 255, 0.04);
}
.hcc__sov-pillar-shield {
    width: 44px; height: 44px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.16), rgba(126, 233, 255, 0.06));
    border: 1px solid rgba(126, 233, 255, 0.25);
    color: var(--highlight-blue-light);
    display: grid;
    place-items: center;
    margin-bottom: 14px;
}
.hcc__sov-pillar-shield svg { width: 22px; height: 22px; }
.hcc__sov-pillar-name {
    font-size: 15.5px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.3px;
    margin: 0 0 8px;
    line-height: 1.3;
}
.hcc__sov-pillar-text {
    font-size: 12.5px;
    color: var(--esds-gray-300);
    line-height: 1.6;
    margin: 0;
}
.hcc__sov-pillar-text strong { color: #fff; font-weight: 700; }

@media (max-width: 992px) { .hcc__sov-pillars { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .hcc__sov-pillars { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §F · COMPARISON TABLE — Self-Managed vs ESDS SAP Community Cloud
   ─────────────────────────────────────────────────────────────────────────── */
.hcc__compare-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.hcc__compare {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 22px 50px rgba(10, 22, 40, 0.08);
    min-width: 800px;
}
.hcc__compare-row {
    display: grid;
    grid-template-columns: 1fr 1.4fr 1.4fr;
    gap: 0;
    border-bottom: 1px solid var(--esds-gray-100);
    transition: background 0.25s;
}
.hcc__compare-row:last-child { border-bottom: 0; }
.hcc__compare-row:hover .hcc__compare-cell--ours { background-color: rgba(0, 97, 255, 0.06); }
.hcc__compare-cell {
    padding: 16px 22px;
    font-size: 13px;
    line-height: 1.5;
    border-right: 1px solid var(--esds-gray-100);
    transition: background-color 0.25s;
}
.hcc__compare-cell:last-child { border-right: 0; }
.hcc__compare-cell--head {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.10em;
    color: var(--esds-navy);
    text-transform: uppercase;
    background: var(--esds-gray-50);
}
.hcc__compare-cell--head.hcc__compare-cell--ours {
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.10), rgba(126, 233, 255, 0.04));
    color: var(--highlight-blue);
}
.hcc__compare-cell--head.hcc__compare-cell--theirs {
    color: var(--esds-gray-600);
}
.hcc__compare-cell--key {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: 0.04em;
    color: var(--esds-navy);
    background: var(--esds-gray-50);
    text-transform: uppercase;
}
.hcc__compare-cell--ours {
    color: var(--esds-navy);
    font-weight: 700;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.025), transparent);
    position: relative;
    padding-left: 36px;
}
.hcc__compare-cell--ours::before {
    content: '✓';
    position: absolute;
    top: 16px; left: 16px;
    color: var(--highlight-blue);
    font-size: 13px;
    font-weight: 800;
}
.hcc__compare-cell--ours strong { color: var(--highlight-blue); font-weight: 800; }
.hcc__compare-cell--theirs {
    color: var(--esds-gray-600);
    position: relative;
    padding-left: 34px;
}
.hcc__compare-cell--theirs::before {
    content: '✗';
    position: absolute;
    top: 16px; left: 16px;
    color: rgba(220, 38, 38, 0.40);
    font-size: 12px;
    font-weight: 800;
}


/* ───────────────────────────────────────────────────────────────────────────
   §H · CLOSING CTA — 3-row trust strip
   ─────────────────────────────────────────────────────────────────────────── */
.hcc__cta-trust-strip {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    margin-top: 32px;
    padding: 18px 22px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(126, 233, 255, 0.20);
    border-radius: 12px;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.hcc__cta-trust-cell {
    display: flex;
    align-items: center;
    gap: 10px;
    text-align: left;
    border-right: 1px solid rgba(255, 255, 255, 0.06);
    padding-right: 14px;
}
.hcc__cta-trust-cell:last-child { border-right: 0; }
.hcc__cta-trust-tick {
    width: 26px; height: 26px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 14px;
    font-weight: 800;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(0, 97, 255, 0.40);
}
.hcc__cta-trust-text {
    font-size: 12.5px;
    font-weight: 600;
    color: #fff;
    line-height: 1.3;
    letter-spacing: -0.2px;
}

@media (max-width: 768px) {
    .hcc__cta-trust-strip { grid-template-columns: 1fr; }
    .hcc__cta-trust-cell { border-right: 0; padding-right: 0; }
}




/* ═══════════════════════════════════════════════════════════════════════════
   §00 · TOKENS + GLOBAL RESETS
   ═══════════════════════════════════════════════════════════════════════════ */
:root {
  /* Brand core */
  --esds-navy: #0A1628;
  --esds-deep: #0F1D32;
  --esds-surface: #1B2838;

  /* ── ESDS-NAV PRIMARY ACCENT (highlight blue gradient) ───────────────── */
  --highlight-blue: hsla(217, 100%, 50%, 1);
  --highlight-blue-light: hsla(186, 100%, 69%, 1);
  --highlight-bg: rgba(0, 97, 255, 0.08);

  /* ── LEGACY ACCENT TOKENS · remapped to new blue scheme ─────────────── */
  /* Every existing selector that used `--esds-accent` / `--esds-gold` /
     `--esds-saffron` for DECORATIVE purposes automatically picks up blue. */
  --esds-accent:       var(--highlight-blue);
  --esds-accent-light: var(--highlight-blue-light);
  --esds-accent-glow:  rgba(0, 97, 255, 0.25);

  --esds-gold:         var(--highlight-blue);
  --esds-gold-light:   var(--highlight-blue-light);

  --esds-saffron:      var(--highlight-blue);

  /* ── INDIA IDENTITY (flag / tricolor only — not for decoration) ─────── */
  --india-saffron: #FF6B35;
  --india-green:   #138808;

  /* Gray scale */
  --esds-white: #FFFFFF;
  --esds-gray-50:  #F8FAFC;
  --esds-gray-100: #E2E8F0;
  --esds-gray-200: #CBD5E1;
  --esds-gray-300: #94A3B8;
  --esds-gray-400: #64748B;
  --esds-gray-500: #475569;
  --esds-gray-700: #334155;
  --esds-gray-900: #0F172A;

  /* Semantic */
  --esds-red:         #EF4444;
  --esds-red-light:   #F87171;
  --esds-red-bg:      rgba(239, 68, 68, 0.1);
  --esds-green:       #10B981;
  --esds-green-light: #34D399;
  --esds-green-bg:    rgba(16, 185, 129, 0.1);

  /* Aliased for backwards compatibility with shared file */
  --esds-india-green: var(--india-green);

  /* Motion */
  --esds-ease: cubic-bezier(0.16, 1, 0.3, 1);
  --esds-transition: 0.25s var(--esds-ease);

  /* Layout */
  --esds-nav-h: 80px;
  --esds-util-h: 36px;

  /* Elevation */
  --shadow-sm:  0 1px 2px   rgba(10, 22, 40, 0.06);
  --shadow-md:  0 8px 24px  rgba(10, 22, 40, 0.08);
  --shadow-lg:  0 20px 60px rgba(10, 22, 40, 0.15);
  --shadow-nav: 0 2px 20px  rgba(10, 22, 40, 0.06);
}

* { box-sizing: border-box; }
html, body {
  margin: 0;
  padding: 0;
  font-family: 'Plus Jakarta Sans', sans-serif;
  color: var(--esds-gray-700);
  background: #fff;
  -webkit-font-smoothing: antialiased;
  scroll-padding-top: calc(var(--esds-nav-h) + var(--esds-util-h) + 20px);
}
html { scroll-behavior: smooth; }
body { overflow-x: hidden; font-size: 15px; line-height: 1.6; }
img, svg { max-width: 100%; display: block; }

/* Typography utilities */
.fw-800 { font-weight: 800; }
.fw-600 { font-weight: 600; }
.text-gradient-hero {
  background: linear-gradient(90deg, var(--highlight-blue) 0%, var(--highlight-blue-light) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* HIGHLIGHTER BUTTON (canonical primary CTA style) */
.btn-highlighter {
  background: linear-gradient(90deg, var(--highlight-blue) 0%, var(--highlight-blue-light) 100%);
  color: #fff !important;
  border: none;
  border-radius: 12px;
  padding: 14px 32px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  font-size: 0.95rem;
  box-shadow: 0 8px 25px rgba(0, 97, 255, 0.4);
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  position: relative;
  overflow: hidden;
  z-index: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  font-family: inherit;
}
.btn-highlighter::before {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(90deg, var(--highlight-blue-light) 0%, var(--highlight-blue) 100%);
  z-index: -1;
  transition: opacity 0.4s ease;
  opacity: 0;
}
.btn-highlighter:hover::before { opacity: 1; }
.btn-highlighter:hover {
  transform: translateY(-4px) scale(1.02);
  box-shadow: 0 15px 35px rgba(0, 97, 255, 0.6);
}
.btn-highlighter.btn-sm {
  padding: 10px 22px;
  font-size: 0.78rem;
  border-radius: 10px;
  letter-spacing: 0.3px;
}

.btn-outline-light-custom {
  border: none;
  color: #fff;
  border-radius: 12px;
  padding: 14px 32px;
  font-weight: 700;
  transition: var(--esds-transition);
  background: rgba(255,255,255,0.1);
  box-shadow: 0 4px 15px rgba(0,0,0,0.1);
  cursor: pointer;
}
.btn-outline-light-custom:hover {
  background: rgba(255,255,255,0.2);
  transform: translateY(-4px);
  color: #fff;
}


/* ═══════════════════════════════════════════════════════════════════════════
   §01 · NAVBAR · ESDS-nav (light · mega menu · search overlay · drawer)
   ═══════════════════════════════════════════════════════════════════════════ */

/* Top utility bar */
.top-bar {
  background: var(--esds-gray-50);
  border-bottom: 1px solid var(--esds-gray-100);
  color: var(--esds-gray-500);
  font-size: 12px;
  padding: 8px 0;
}
.top-bar-inner {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.top-bar-left { display: flex; align-items: center; gap: 18px; }
.top-bar-badge {
  display: inline-flex; align-items: center; gap: 6px;
  color: var(--esds-gray-700);
  font-weight: 600;
  letter-spacing: 0.02em;
}
.top-bar-badge .dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--esds-green);
  box-shadow: 0 0 0 3px rgba(16,185,129,0.15);
  animation: nav-pulseLive 2s ease-in-out infinite;
}
@keyframes nav-pulseLive {
  0%, 100% { opacity: 1; box-shadow: 0 0 0 3px rgba(16,185,129,0.15); }
  50%      { opacity: 0.5; box-shadow: 0 0 0 6px rgba(16,185,129,0); }
}
.top-bar-right { display: flex; align-items: center; gap: 20px; }
.top-bar-link {
  color: var(--esds-gray-500);
  text-decoration: none;
  transition: color 0.2s;
  display: inline-flex; align-items: center; gap: 6px;
}
.top-bar-link:hover { color: var(--esds-navy); }
.top-bar-sep { width: 1px; height: 12px; background: var(--esds-gray-200); }

/* Main nav shell */
.nav-shell {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: #fff;
  border-bottom: 1px solid var(--esds-gray-100);
  transition: background 0.3s ease, box-shadow 0.3s ease, backdrop-filter 0.3s ease;
}
.nav-shell.scrolled {
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: saturate(180%) blur(18px);
  -webkit-backdrop-filter: saturate(180%) blur(18px);
  box-shadow: var(--shadow-nav);
}

.nav {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 32px;
  height: var(--esds-nav-h);
  display: flex;
  align-items: center;
  gap: 32px;
  position: relative;
}

/* Logo */
.nav-logo {
  display: flex; align-items: center; gap: 10px;
  text-decoration: none;
  color: var(--esds-navy);
  flex-shrink: 0;
}
.nav-logo-mark {
  width: 38px; height: 38px;
  border-radius: 10px;
  background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
  display: grid; place-items: center;
  box-shadow: 0 6px 18px rgba(0, 97, 255, 0.3);
  position: relative; overflow: hidden;
}
.nav-logo-mark::before {
  content:''; position: absolute; inset: 0;
  background: linear-gradient(120deg, transparent 30%, rgba(255,255,255,0.4) 50%, transparent 70%);
  transform: translateX(-100%);
  animation: nav-shimmer 5s ease-in-out infinite;
}
@keyframes nav-shimmer {
  0%, 100% { transform: translateX(-120%); }
  50%      { transform: translateX(120%); }
}
.nav-logo-mark svg { width: 22px; height: 22px; position: relative; z-index: 1; }
.nav-logo-text { display: flex; flex-direction: column; line-height: 1; }
.nav-logo-name { font-size: 20px; font-weight: 800; letter-spacing: -0.02em; color: var(--esds-navy); }
.nav-logo-tag {
  font-size: 9.5px; font-weight: 700;
  color: var(--highlight-blue);
  text-transform: uppercase; letter-spacing: 0.15em;
  margin-top: 4px;
}

/* Nav menu */
.nav-menu {
  display: flex; align-items: center;
  flex: 1; gap: 2px;
  list-style: none; margin: 0; padding: 0;
}
.nav-item { position: static; }
.nav-link {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 0 16px;
  height: var(--esds-nav-h);
  font-size: 14px;
  font-weight: 600;
  color: var(--esds-gray-700);
  background: none; border: none; cursor: pointer;
  font-family: inherit;
  position: relative;
  transition: color 0.2s;
  white-space: nowrap;
}
.nav-link .chev {
  width: 11px; height: 11px;
  transition: transform 0.3s var(--esds-ease);
  opacity: 0.6;
}
.nav-link::after {
  content: '';
  position: absolute;
  left: 16px; right: 16px; bottom: 18px;
  height: 2px;
  background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
  border-radius: 2px;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.4s var(--esds-ease);
}
.nav-item:hover .nav-link,
.nav-item.active .nav-link { color: var(--esds-navy); }
.nav-item:hover .nav-link::after,
.nav-item.active .nav-link::after { transform: scaleX(1); }
.nav-item:hover .nav-link .chev,
.nav-item.active .nav-link .chev { transform: rotate(180deg); opacity: 1; color: var(--highlight-blue); }

/* Nav actions */
.nav-actions {
  display: flex; align-items: center; gap: 10px;
  flex-shrink: 0;
  margin-left: auto;
}
.icon-btn {
  width: 40px; height: 40px;
  display: grid; place-items: center;
  background: var(--esds-gray-50);
  border: 1px solid var(--esds-gray-100);
  color: var(--esds-gray-500);
  border-radius: 10px;
  cursor: pointer;
  transition: var(--esds-transition);
}
.icon-btn:hover {
  background: var(--highlight-bg);
  color: var(--highlight-blue);
  border-color: rgba(0, 97, 255, 0.2);
}
.icon-btn.active {
  background: var(--highlight-bg);
  color: var(--highlight-blue);
  border-color: rgba(0, 97, 255, 0.3);
}
.icon-btn svg { width: 18px; height: 18px; }

.burger {
  display: none;
  width: 42px; height: 42px;
  background: var(--esds-gray-50);
  border: 1px solid var(--esds-gray-100);
  border-radius: 10px;
  cursor: pointer;
  position: relative;
}
.burger span {
  position: absolute; left: 11px; right: 11px; height: 2px;
  background: var(--esds-navy); border-radius: 2px;
  transition: transform 0.35s var(--esds-ease), opacity 0.2s;
}
.burger span:nth-child(1) { top: 14px; }
.burger span:nth-child(2) { top: 20px; }
.burger span:nth-child(3) { top: 26px; }
.burger.open span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.burger.open span:nth-child(2) { opacity: 0; }
.burger.open span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* MEGA PANELS */
.mega {
  position: absolute;
  top: 100%;
  left: 0; right: 0;
  background: #fff;
  border-top: 1px solid var(--esds-gray-100);
  box-shadow: var(--shadow-lg);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-8px);
  transition: opacity 0.25s var(--esds-ease),
              transform 0.3s var(--esds-ease),
              visibility 0.25s;
  z-index: 999;
  max-height: calc(100vh - var(--esds-nav-h));
  overflow-y: auto;
}
.mega.open { opacity: 1; visibility: visible; transform: translateY(0); }
.mega::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, transparent, var(--highlight-blue), var(--highlight-blue-light), transparent);
}

.mega-inner {
  max-width: 1440px;
  margin: 0 auto;
  padding: 40px 32px 48px;
}

.mega-grid { display: grid; gap: 32px; }
.mega-grid.cols-4 { grid-template-columns: 1.2fr 1fr 1fr 1fr; }
.mega-grid.cols-3 { grid-template-columns: 1.3fr 1fr 1fr; }
.mega-grid.cols-5 { grid-template-columns: repeat(4, 1fr) 1.1fr; }

.mg-group h4 {
  font-size: 10.5px;
  font-weight: 800;
  color: var(--highlight-blue);
  letter-spacing: 0.2em;
  text-transform: uppercase;
  margin: 0 0 16px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--esds-gray-100);
}

.mg-link {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 10px;
  margin: 0 -10px;
  text-decoration: none;
  color: inherit;
  border-radius: 8px;
  transition: background 0.2s, padding 0.2s;
  position: relative;
}
.mg-link:hover {
  background: var(--highlight-bg);
  padding-left: 14px;
}
.mg-bullet {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--esds-gray-200);
  flex-shrink: 0;
  margin-top: 9px;
  transition: background 0.25s var(--esds-ease), transform 0.25s var(--esds-ease);
}
.mg-link:hover .mg-bullet {
  background: var(--highlight-blue);
  transform: scale(1.5);
  box-shadow: 0 0 0 4px rgba(0, 97, 255, 0.15);
}
.mg-body { flex: 1; min-width: 0; }
.mg-name {
  font-size: 13.5px;
  font-weight: 700;
  color: var(--esds-navy);
  line-height: 1.3;
  transition: color 0.2s;
}
.mg-link:hover .mg-name { color: var(--highlight-blue); }
.mg-desc {
  font-size: 11.5px;
  color: var(--esds-gray-400);
  line-height: 1.5;
  margin-top: 4px;
}
.mg-badge {
  display: inline-block;
  font-size: 9px;
  font-weight: 800;
  padding: 2px 8px;
  border-radius: 4px;
  margin-top: 6px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border: 1px solid;
}
.mg-badge.new {
  background: var(--highlight-bg);
  color: var(--highlight-blue);
  border-color: rgba(0, 97, 255, 0.2);
}
.mg-badge.hot {
  background: var(--esds-red-bg);
  color: var(--esds-red);
  border-color: rgba(239, 68, 68, 0.2);
}

.mg-cta {
  background: linear-gradient(160deg, rgba(0, 97, 255, 0.06), rgba(126, 233, 255, 0.04));
  border: 1px solid rgba(0, 97, 255, 0.15);
  border-radius: 14px;
  padding: 20px;
  display: flex; flex-direction: column; gap: 14px;
  position: relative;
  overflow: hidden;
}
.mg-cta::after {
  content: '';
  position: absolute;
  top: -40%; right: -30%;
  width: 140px; height: 140px;
  background: radial-gradient(circle, rgba(0, 97, 255, 0.15), transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}
.mg-cta h4 {
  color: var(--highlight-blue) !important;
  border-bottom-color: rgba(0, 97, 255, 0.2) !important;
  margin-bottom: 4px !important;
}
.mg-cta-label {
  font-size: 10px; font-weight: 700;
  color: var(--esds-gray-500);
  letter-spacing: 0.15em; text-transform: uppercase;
}
.mg-cta-title {
  font-size: 15px;
  font-weight: 800;
  color: var(--esds-navy);
  line-height: 1.35;
  margin: 2px 0 4px;
}
.mg-cta-btn {
  display: inline-flex; align-items: center; gap: 6px;
  background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
  color: #fff;
  padding: 9px 16px;
  border-radius: 8px;
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: 0.04em;
  width: fit-content;
  box-shadow: 0 6px 18px rgba(0, 97, 255, 0.35);
  transition: transform 0.3s var(--esds-ease);
  cursor: pointer;
  text-decoration: none;
}
.mg-cta-btn:hover { transform: translateY(-2px); color: #fff; }
.mg-cta-stats {
  display: flex; flex-direction: column; gap: 10px;
  padding-top: 14px;
  border-top: 1px dashed var(--esds-gray-200);
}
.mg-stat {
  display: flex; align-items: center; justify-content: space-between;
  font-size: 12px;
}
.mg-stat-label { color: var(--esds-gray-500); }
.mg-stat-val {
  font-weight: 800;
  color: var(--esds-navy);
  font-feature-settings: "tnum";
}

.mega-backdrop {
  position: fixed; inset: var(--esds-nav-h) 0 0 0;
  background: rgba(10, 22, 40, 0.25);
  backdrop-filter: blur(2px);
  opacity: 0; visibility: hidden;
  transition: opacity 0.25s ease, visibility 0.25s;
  z-index: 998;
  pointer-events: none;
}
.mega-backdrop.show { opacity: 1; visibility: visible; }

/* SEARCH OVERLAY */
.search-overlay {
  position: absolute;
  top: 100%;
  left: 0; right: 0;
  background: #fff;
  border-top: 1px solid var(--esds-gray-100);
  box-shadow: var(--shadow-lg);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-8px);
  transition: opacity 0.25s var(--esds-ease),
              transform 0.3s var(--esds-ease),
              visibility 0.25s;
  z-index: 999;
  max-height: calc(100vh - var(--esds-nav-h));
  overflow-y: auto;
}
.search-overlay.open { opacity: 1; visibility: visible; transform: translateY(0); }
.search-overlay::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, transparent, var(--highlight-blue), var(--highlight-blue-light), transparent);
}
.search-inner {
  max-width: 1440px;
  margin: 0 auto;
  padding: 36px 32px 44px;
}
.search-input-wrap { position: relative; margin-bottom: 32px; }
.search-input-wrap svg {
  position: absolute; left: 20px; top: 50%;
  transform: translateY(-50%);
  width: 22px; height: 22px;
  color: var(--esds-gray-400);
  pointer-events: none;
}
.search-input {
  width: 100%;
  padding: 18px 52px 18px 58px;
  font-size: 18px;
  font-weight: 500;
  font-family: inherit;
  color: var(--esds-navy);
  background: var(--esds-gray-50);
  border: 2px solid var(--esds-gray-100);
  border-radius: 14px;
  outline: none;
  transition: var(--esds-transition);
}
.search-input::placeholder { color: var(--esds-gray-400); font-weight: 400; }
.search-input:focus {
  background: #fff;
  border-color: var(--highlight-blue);
  box-shadow: 0 0 0 4px rgba(0, 97, 255, 0.1);
}
.search-clear {
  position: absolute; right: 16px; top: 50%;
  transform: translateY(-50%);
  width: 32px; height: 32px;
  display: none; place-items: center;
  background: var(--esds-gray-100);
  border: none; border-radius: 8px;
  color: var(--esds-gray-500);
  cursor: pointer;
  transition: var(--esds-transition);
}
.search-clear.show { display: grid; }
.search-clear:hover { background: var(--esds-gray-200); color: var(--esds-navy); }
.search-clear svg { width: 14px; height: 14px; }

.search-section { margin-bottom: 28px; }
.search-section:last-child { margin-bottom: 0; }
.search-section h4 {
  font-size: 10.5px;
  font-weight: 800;
  color: var(--highlight-blue);
  letter-spacing: 0.22em;
  text-transform: uppercase;
  margin: 0 0 14px;
}
.search-badges { display: flex; flex-wrap: wrap; gap: 8px; }
.search-badge {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 9px 16px;
  background: #fff;
  color: var(--esds-navy);
  border: 1.5px solid var(--esds-gray-100);
  border-radius: 30px;
  font-size: 12.5px;
  font-weight: 600;
  text-decoration: none;
  transition: var(--esds-transition);
  cursor: pointer;
}
.search-badge:hover {
  background: var(--highlight-bg);
  border-color: var(--highlight-blue);
  color: var(--highlight-blue);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 97, 255, 0.15);
}
.search-badge.category {
  background: var(--highlight-bg);
  border-color: rgba(0, 97, 255, 0.2);
  color: var(--highlight-blue);
  font-weight: 700;
}
.search-badge.category:hover {
  background: var(--highlight-blue);
  color: #fff;
  border-color: var(--highlight-blue);
}
.search-badge .arr {
  width: 12px; height: 12px;
  opacity: 0.5;
  transition: transform 0.25s var(--esds-ease), opacity 0.2s;
}
.search-badge:hover .arr { opacity: 1; transform: translateX(3px); }
.search-badge.hidden { display: none; }

.search-empty {
  padding: 40px 20px;
  text-align: center;
  color: var(--esds-gray-400);
  font-size: 14px;
  display: none;
}
.search-empty.show { display: block; }

.search-hint {
  padding-top: 20px;
  margin-top: 20px;
  border-top: 1px solid var(--esds-gray-100);
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 12px;
  font-size: 11px; color: var(--esds-gray-400);
}
.kbd {
  display: inline-block;
  padding: 2px 7px;
  background: var(--esds-gray-50);
  border: 1px solid var(--esds-gray-100);
  border-radius: 5px;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 10.5px;
  color: var(--esds-gray-500);
  font-weight: 600;
}

/* MOBILE DRAWER */
.drawer {
  position: fixed;
  top: 0; right: 0; bottom: 0;
  width: min(420px, 92vw);
  background: #fff;
  border-left: 1px solid var(--esds-gray-100);
  z-index: 1100;
  transform: translateX(100%);
  transition: transform 0.45s var(--esds-ease);
  display: flex; flex-direction: column;
  box-shadow: -20px 0 60px rgba(10, 22, 40, 0.15);
}
.drawer.open { transform: translateX(0); }
.drawer-head {
  padding: 20px 24px;
  display: flex; align-items: center; justify-content: space-between;
  border-bottom: 1px solid var(--esds-gray-100);
  flex-shrink: 0;
}
.drawer-close {
  width: 40px; height: 40px;
  display: grid; place-items: center;
  background: var(--esds-gray-50);
  border: 1px solid var(--esds-gray-100);
  color: var(--esds-navy);
  border-radius: 10px; cursor: pointer;
}
.drawer-close:hover { background: var(--highlight-bg); color: var(--highlight-blue); }
.drawer-close svg { width: 18px; height: 18px; }
.drawer-body { flex: 1; overflow-y: auto; padding: 16px 0 24px; }
.d-accordion { border-bottom: 1px solid var(--esds-gray-100); }
.d-trigger {
  width: 100%;
  padding: 18px 24px;
  background: none; border: none;
  display: flex; align-items: center; justify-content: space-between;
  color: var(--esds-navy);
  font-family: inherit;
  font-size: 15px; font-weight: 700;
  cursor: pointer;
  text-align: left;
  transition: background 0.2s;
}
.d-trigger:hover { background: var(--esds-gray-50); }
.d-trigger svg {
  width: 14px; height: 14px;
  transition: transform 0.35s var(--esds-ease);
  color: var(--highlight-blue);
}
.d-accordion.open .d-trigger svg { transform: rotate(180deg); }
.d-accordion.open .d-trigger { background: var(--esds-gray-50); color: var(--highlight-blue); }
.d-content {
  max-height: 0; overflow: hidden;
  transition: max-height 0.4s var(--esds-ease);
  background: var(--esds-gray-50);
}
.d-accordion.open .d-content { max-height: 4000px; }
.d-inner { padding: 4px 24px 18px; }
.d-group { margin-bottom: 14px; }
.d-group h5 {
  font-size: 10px;
  font-weight: 800;
  color: var(--highlight-blue);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  margin: 14px 0 8px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--esds-gray-100);
}
.d-link {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 10px 12px;
  margin: 0 -12px;
  text-decoration: none;
  color: inherit;
  border-radius: 8px;
  transition: background 0.2s;
}
.d-link:hover, .d-link:active { background: #fff; }
.d-link .mg-bullet { margin-top: 8px; }
.d-link .mg-name { font-size: 13px; }
.d-link .mg-desc { font-size: 11px; }

.drawer-foot {
  padding: 20px 24px 24px;
  border-top: 1px solid var(--esds-gray-100);
  flex-shrink: 0;
  background: var(--esds-gray-50);
}
.drawer-foot .btn-highlighter { width: 100%; justify-content: center; }
.drawer-foot-meta {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: 14px;
  font-size: 11px;
  color: var(--esds-gray-400);
}
.drawer-foot-meta a { color: var(--esds-gray-700); text-decoration: none; font-weight: 600; }
.drawer-foot-meta a:hover { color: var(--highlight-blue); }

.page-backdrop {
  position: fixed; inset: 0;
  background: rgba(10, 22, 40, 0.45);
  backdrop-filter: blur(4px);
  opacity: 0; visibility: hidden;
  transition: opacity 0.35s ease, visibility 0.35s;
  z-index: 1050;
}
.page-backdrop.show { opacity: 1; visibility: visible; }

.mega::-webkit-scrollbar,
.search-overlay::-webkit-scrollbar,
.drawer-body::-webkit-scrollbar { width: 6px; }
.mega::-webkit-scrollbar-thumb,
.search-overlay::-webkit-scrollbar-thumb,
.drawer-body::-webkit-scrollbar-thumb {
  background: var(--esds-gray-200);
  border-radius: 3px;
}



/* ═══════════════════════════════════════════════════════════════════════════
   §12 · RESPONSIVE (Bootstrap breakpoints · lg 992 · md 768)
   ═══════════════════════════════════════════════════════════════════════════ */
@media (max-width: 1200px) {
  .mega-grid.cols-5 { grid-template-columns: repeat(3, 1fr); }
  .nav-link { padding: 0 12px; font-size: 13px; }
}

@media (max-width: 1199px) {
 .site-hero__ticker{width: 800px; margin: 40px auto!important;
}
}

@media (max-width: 991.98px) {
  .nav-menu, .nav-actions .btn-highlighter { display: none; }
  .burger { display: block; }
  .top-bar { display: none; }
  .nav { gap: 16px; padding: 0 20px; }
  .nav-actions { gap: 8px; }
  .search-inner { padding: 24px 20px 30px; }
  .search-input { font-size: 16px; padding: 15px 46px 15px 48px; }
  .search-input-wrap svg { left: 16px; width: 18px; height: 18px; }
  .mega, .search-overlay { position: fixed; top: var(--esds-nav-h); }

  .cmd-stage { grid-template-columns: 1fr; gap: 24px; }
  .split-stage { grid-template-columns: 1fr; gap: 16px; }
  .page-home .h-policy__grid { grid-template-columns: 1fr; gap: 40px; }
  .page-home .h-policy__pullquote { top: 0; }
  .page-home .h-dep__compare { grid-template-columns: 1fr; }
  
  .site-hero__ticker{
	width: 700px;    
    margin: 40px auto!important;
}

}

/* ═══════════════════════════════════════════════════════════════════════════
   §13 · INNER-PAGE HERO · Shared across every inner page
   ───────────────────────────────────────────────────────────────────────────
   Dark navy spotlight + breadcrumb + badge + H1 with blue-gradient highlight
   + 6-slot stat grid. Used on all 6 product pages for consistency.
═══════════════════════════════════════════════════════════════════════════ */
.inner-hero {
    position: relative;
    background: var(--esds-navy);
    color: #fff;
    padding: 40px 0 40px;
    overflow: hidden;
    isolation: isolate;
}
.inner-hero::before {
    content: '';
    position: absolute; inset: 0;
    background-image:
        linear-gradient(rgba(0, 97, 255, 0.02) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0, 97, 255, 0.02) 1px, transparent 1px);
    background-size: 72px 72px;
    mask-image: radial-gradient(ellipse at center top, #000 0%, transparent 75%);
    -webkit-mask-image: radial-gradient(ellipse at center top, #000 0%, transparent 75%);
    z-index: 0;
}
.hero-orb {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    filter: blur(40px);
    z-index: 0;
}
.hero-orb--blue   { top: -10%; right: -5%; width: 540px; height: 540px; background: radial-gradient(circle, rgba(0, 97, 255, 0.28), transparent 60%); }
.hero-orb--cyan   { bottom: -12%; left: -4%; width: 420px; height: 420px; background: radial-gradient(circle, rgba(126, 233, 255, 0.18), transparent 60%); }
.hero-orb--saffron{ top: 20%; left: 45%; width: 300px; height: 300px; background: radial-gradient(circle, rgba(255, 107, 53, 0.12), transparent 65%); }

.container { max-width: 1280px; margin: 0 auto; padding: 0 32px; }

/* Breadcrumb */
.breadcrumb {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 18px 0 32px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--esds-gray-400);
    letter-spacing: 0.02em;
    position: relative;
    z-index: 2;
}
.breadcrumb a {
    color: var(--esds-gray-300);
    text-decoration: none;
    transition: color 0.2s;
}
.breadcrumb a:hover { color: var(--highlight-blue-light); }
.breadcrumb .sep { color: var(--esds-gray-500); opacity: 0.6; }
.breadcrumb .current { color: #fff; font-weight: 700; }

/* Hero content */
.inner-hero__inner { position: relative; z-index: 2; }
.inner-hero__badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 16px;
    background: rgba(0, 97, 255, 0.12);
    border: 1px solid rgba(126, 233, 255, 0.30);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: var(--highlight-blue-light);
    margin-bottom: 28px;
}
.inner-hero__badge .pulse {
    width: 7px; height: 7px; border-radius: 50%;
    background: var(--highlight-blue-light);
    box-shadow: 0 0 0 0 rgba(126, 233, 255, 0.7);
    animation: hero-pulse 1.8s ease-in-out infinite;
}
@keyframes hero-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(126, 233, 255, 0.6); }
    50%      { box-shadow: 0 0 0 8px rgba(126, 233, 255, 0); }
}
.inner-hero__title {
    font-size: clamp(34px, 5.4vw, 68px);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -1.6px;
    margin: 0 0 22px;
    max-width: 900px;
}
.inner-hero__title .hl {
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.inner-hero__lede {
    font-size: clamp(15px, 1.35vw, 19px);
    color: var(--esds-gray-300);
    line-height: 1.65;
    max-width: 720px;
    margin: 0 0 36px;
    font-weight: 500;
}
.inner-hero__lede strong { color: #fff; font-weight: 700; }
.inner-hero__ctas {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 56px;
}
.inner-hero__cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 15px 28px;
    border-radius: 10px;
    font-size: 14.5px;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.25s var(--esds-ease);
}
.inner-hero__cta--primary {
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    box-shadow: 0 6px 22px rgba(0, 97, 255, 0.40);
}
.inner-hero__cta--primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 32px rgba(0, 97, 255, 0.55);
    color: #fff;
}
.inner-hero__cta--ghost {
    background: rgba(255, 255, 255, 0.05);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.15);
}
.inner-hero__cta--ghost:hover {
    background: rgba(255, 255, 255, 0.10);
    border-color: rgba(255, 255, 255, 0.35);
    transform: translateY(-2px);
}
.inner-hero__cta--link {
    color: var(--esds-gray-300);
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.08);
}
.inner-hero__cta--link:hover { color: #fff; border-color: rgba(255, 255, 255, 0.25); }

/* Hero stats grid */
.inner-hero__stats {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 14px;
    padding-top: 40px;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.stat-card {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.07);
    border-radius: 14px;
    padding: 22px 20px;
    transition: all 0.3s var(--esds-ease);
}
.stat-card:hover {
    background: rgba(0, 97, 255, 0.08);
    border-color: rgba(126, 233, 255, 0.25);
    transform: translateY(-3px);
}
.stat-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(22px, 2.2vw, 32px);
    font-weight: 800;
    color: #fff;
    letter-spacing: -1.2px;
    line-height: 1;
}
.stat-num .u {
    font-size: 0.55em;
    color: var(--highlight-blue-light);
    margin-left: 2px;
}
.stat-label {
    font-size: 11px;
    color: var(--esds-gray-400);
    margin-top: 8px;
    line-height: 1.45;
    font-weight: 500;
}

/* Stat grids variants */
.inner-hero__stats--4 { grid-template-columns: repeat(4, 1fr); }
.inner-hero__stats--5 { grid-template-columns: repeat(5, 1fr); }

@media (max-width: 992px) {
    .inner-hero__stats, .inner-hero__stats--4, .inner-hero__stats--5 { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 640px) {
    .inner-hero { padding: 24px 0 60px; }
    .inner-hero__stats, .inner-hero__stats--4, .inner-hero__stats--5 { grid-template-columns: repeat(2, 1fr); }
    .inner-hero__ctas { flex-direction: column; }
    .inner-hero__cta { justify-content: center; }
}



/* ═══════════════════════════════════════════════════════════════════════════
   §14 · SECTION TOKENS · Reusable section header/layout primitives
═══════════════════════════════════════════════════════════════════════════ */
.sec { padding: 100px 0; position: relative; }
.sec--light  { background: #fff; border-bottom: 1px solid var(--esds-gray-100); }
.sec--gray   { background: var(--esds-gray-50); border-top: 1px solid var(--esds-gray-100); border-bottom: 1px solid var(--esds-gray-100); }
.sec--dark   {
    background: linear-gradient(165deg, var(--esds-navy), var(--esds-deep));
    color: #fff;
    overflow: hidden;
}
.sec--dark::before {
    content: '';
    position: absolute; inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.012) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.012) 1px, transparent 1px);
    background-size: 72px 72px;
    pointer-events: none;
}
.sec--dark .container { position: relative; z-index: 1; }

.sec-head { max-width: 760px; margin-bottom: 48px; }
.sec-head--center { margin-left: auto; margin-right: auto; text-align: center; }

.sec-label {
    display: inline-block;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: var(--highlight-blue);
    margin-bottom: 14px;
}
.sec-label--cyan { color: var(--highlight-blue-light); }
.sec--dark .sec-label { color: var(--highlight-blue-light); }

.sec-title {
    font-size: clamp(28px, 3.4vw, 44px);
    font-weight: 800;
    color: var(--esds-navy);
    line-height: 1.1;
    letter-spacing: -1px;
    margin: 0 0 18px;
}
.sec-title em {
    font-style: normal;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.sec--dark .sec-title { color: #fff; }
.sec-sub {
    font-size: 16px;
    color: var(--esds-gray-500);
    line-height: 1.7;
    margin: 0;
    max-width: 680px;
}
.full-sec-sub {
    font-size: 16px;
    color: var(--esds-gray-500);
    line-height: 1.7;
    margin: 0 auto;
    max-width: 80%;
    text-align: center;
}
.sec--dark .sec-sub { color: var(--esds-gray-300); }




/* ═══════════════════════════════════════════════════════════════════════════
   §24 · FAQ ACCORDION · Expand-collapse faq list
   Design pattern: FAQ Accordion Column · click-to-expand with chevron
═══════════════════════════════════════════════════════════════════════════ */
.faq-list {
    display: grid;
    gap: 12px;
    max-width: 920px;
    margin: 0 auto;
}
.faq-acc {
    background: var(--esds-gray-50);
    border: 1px solid var(--esds-gray-100);
    border-radius: 14px;
    overflow: hidden;
    transition: border-color 0.2s, background 0.2s;
}
.faq-acc.open {
    background: #fff;
    border-color: var(--highlight-blue);
    box-shadow: 0 8px 24px rgba(0, 97, 255, 0.08);
}
.faq-acc__trigger {
    width: 100%;
    padding: 20px 26px;
    background: none;
    border: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    text-align: left;
    font-family: inherit;
    font-size: 15.5px;
    font-weight: 700;
    color: var(--esds-navy);
    transition: color 0.2s;
}
.faq-acc__trigger:hover { color: var(--highlight-blue); }
.faq-acc__trigger svg {
    width: 18px; height: 18px;
    color: var(--highlight-blue);
    transition: transform 0.3s var(--esds-ease);
    flex-shrink: 0;
}
.faq-acc.open .faq-acc__trigger svg { transform: rotate(45deg); }
.faq-acc__content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s var(--esds-ease);
}
.faq-acc.open .faq-acc__content { max-height: 600px; }
.faq-acc__content-inner {
    padding: 0 26px 22px;
    font-size: 14.5px;
    color: var(--esds-gray-500);
    line-height: 1.7;
}


/* ═══════════════════════════════════════════════════════════════════════════
   §25 · SECTION CTA · Per-page call-to-action bottom band
   Design pattern: Floating Islands CTA · dark navy with glow + checkmark row
═══════════════════════════════════════════════════════════════════════════ */
.page-cta {
    background: linear-gradient(165deg, var(--esds-navy), var(--esds-deep));
    color: #fff;
    text-align: center;
    padding: 110px 0;
    position: relative;
    overflow: hidden;
}
.page-cta::before {
    content: '';
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 800px; height: 800px;
    background: radial-gradient(circle, rgba(0, 97, 255, 0.15) 0%, transparent 55%);
    border-radius: 50%;
    filter: blur(20px);
}
.page-cta__hindi {
    font-size: clamp(22px, 3vw, 34px);
    font-weight: 800;
    color: var(--highlight-blue-light);
    margin-bottom: 8px;
    position: relative;
    z-index: 2;
}
.page-cta h2 {
    font-size: clamp(28px, 4vw, 44px);
    font-weight: 800;
    margin: 0 0 12px;
    position: relative;
    z-index: 2;
    letter-spacing: -1px;
    line-height: 1.12;
}
.page-cta h2 br { display: inline; }
.page-cta__sub {
    font-size: 17px;
    color: var(--esds-gray-300);
    margin: 0 auto 36px;
    max-width: 560px;
    position: relative;
    z-index: 2;
    line-height: 1.65;
}
.page-cta__ctas {
    display: flex;
    justify-content: center;
    gap: 14px;
    flex-wrap: wrap;
    position: relative;
    z-index: 2;
}
.page-cta__extras {
    display: flex;
    justify-content: center;
    gap: 28px;
    margin-top: 32px;
    position: relative;
    z-index: 2;
    flex-wrap: wrap;
}
.page-cta__extra {
    font-size: 13px;
    color: var(--esds-gray-400);
    display: flex;
    align-items: center;
    gap: 6px;
}
.page-cta__extra .c {
    color: var(--esds-green-light);
    font-weight: 800;
}
@media (max-width: 640px) {
    .page-cta__extras { flex-direction: column; align-items: center; gap: 12px; }
    .page-cta__ctas { flex-direction: column; }
    .page-cta__ctas .inner-hero__cta { width: 100%; justify-content: center; }
}



/* ═══════════════════════════════════════════════════════════════════════════
   §39 · SCROLL-REVEAL ANIMATIONS · Applied by JS IntersectionObserver
═══════════════════════════════════════════════════════════════════════════ */
.trinity-card, .feature-card, .why-card, .industry-tile,
.storyboard__frame, .pillar-card, .stack-card, .proof-card,
.compliance-stack__card, .how-card, .chip-item,
.mission-card, .board-card, .cxo-card, .cert-card, .esg-card {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.6s var(--esds-ease), transform 0.6s var(--esds-ease);
}
.revealed {
    opacity: 1 !important;
    transform: translateY(0) !important;
}
@media (prefers-reduced-motion: reduce) {
    .trinity-card, .feature-card, .why-card, .industry-tile,
    .storyboard__frame, .pillar-card, .stack-card, .proof-card,
    .compliance-stack__card, .how-card, .chip-item,
    .mission-card, .board-card, .cxo-card, .cert-card, .esg-card {
        opacity: 1;
        transform: none;
    }
}


/* ═══════════════════════════════════════════════════════════════════════════
   VTM · VTMScan — Page-specific styles (vtm__ prefix)
   ═══════════════════════════════════════════════════════════════════════════ */

/* ───────────────────────────────────────────────────────────────────────────
   §A · HERO — Live-scan terminal mockup (right column)
   ─────────────────────────────────────────────────────────────────────────── */
.vtm__hero-grid {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    gap: 56px;
    align-items: center;
    margin-bottom: 56px;
}

/* Terminal window */
.vtm__terminal {
    background: #0B1424;
    border: 1px solid rgba(126, 233, 255, 0.18);
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.45);
    font-family: 'JetBrains Mono', monospace;
    position: relative;
}
.vtm__terminal::before {
    /* corner glow */
    content: '';
    position: absolute;
    top: -100px; right: -100px;
    width: 280px; height: 280px;
    background: radial-gradient(circle, rgba(0, 97, 255, 0.35), transparent 60%);
    filter: blur(30px);
    pointer-events: none;
}
.vtm__term-bar {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: rgba(255, 255, 255, 0.03);
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    position: relative;
    z-index: 1;
}
.vtm__term-dots { display: flex; gap: 6px; }
.vtm__term-dot {
    width: 11px; height: 11px;
    border-radius: 50%;
    background: #ff5f56;
}
.vtm__term-dot:nth-child(2) { background: #ffbd2e; }
.vtm__term-dot:nth-child(3) { background: #27c93f; }
.vtm__term-url {
    flex: 1;
    padding: 4px 12px;
    background: rgba(0, 0, 0, 0.30);
    border-radius: 6px;
    font-size: 11.5px;
    color: var(--esds-gray-300);
    text-align: center;
    letter-spacing: 0.02em;
}
.vtm__term-url::before {
    content: '🔒';
    margin-right: 6px;
    filter: grayscale(1);
    opacity: 0.7;
}
.vtm__term-status {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 9px;
    background: rgba(74, 222, 128, 0.12);
    border: 1px solid rgba(74, 222, 128, 0.30);
    border-radius: 999px;
    font-size: 9.5px;
    font-weight: 700;
    color: #4ade80;
    letter-spacing: 0.10em;
    text-transform: uppercase;
}
.vtm__term-status .dot {
    width: 5px; height: 5px;
    border-radius: 50%;
    background: #4ade80;
    animation: vtm-pulse-dot 1.5s ease-in-out infinite;
}
@keyframes vtm-pulse-dot {
    0%, 100% { opacity: 0.4; }
    50% { opacity: 1; }
}

.vtm__term-body {
    padding: 18px 18px 8px;
    font-size: 12.5px;
    line-height: 1.85;
    color: var(--esds-gray-300);
    min-height: 320px;
    position: relative;
    z-index: 1;
}
.vtm__term-line {
    display: flex;
    gap: 10px;
    align-items: baseline;
    margin-bottom: 4px;
    opacity: 0;
    transform: translateY(4px);
    animation: vtm-term-in 0.5s var(--esds-ease) forwards;
}
.vtm__term-line:nth-child(1)  { animation-delay: 0.30s; }
.vtm__term-line:nth-child(2)  { animation-delay: 0.65s; }
.vtm__term-line:nth-child(3)  { animation-delay: 1.00s; }
.vtm__term-line:nth-child(4)  { animation-delay: 1.40s; }
.vtm__term-line:nth-child(5)  { animation-delay: 1.85s; }
.vtm__term-line:nth-child(6)  { animation-delay: 2.30s; }
.vtm__term-line:nth-child(7)  { animation-delay: 2.75s; }
.vtm__term-line:nth-child(8)  { animation-delay: 3.20s; }
.vtm__term-line:nth-child(9)  { animation-delay: 3.65s; }
.vtm__term-line:nth-child(10) { animation-delay: 4.10s; }
@keyframes vtm-term-in {
    to { opacity: 1; transform: translateY(0); }
}
.vtm__term-prompt { color: #4ade80; flex-shrink: 0; }
.vtm__term-tag {
    display: inline-flex;
    align-items: center;
    padding: 1px 7px;
    border-radius: 4px;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    flex-shrink: 0;
    font-family: 'JetBrains Mono', monospace;
}
.vtm__term-tag--crit { background: rgba(220, 38, 38, 0.18); color: #fca5a5; border: 1px solid rgba(220, 38, 38, 0.35); }
.vtm__term-tag--warn { background: rgba(234, 179, 8, 0.16); color: #fde68a; border: 1px solid rgba(234, 179, 8, 0.35); }
.vtm__term-tag--info { background: rgba(0, 97, 255, 0.16); color: #93c5fd; border: 1px solid rgba(0, 97, 255, 0.35); }
.vtm__term-tag--ok   { background: rgba(74, 222, 128, 0.14); color: #86efac; border: 1px solid rgba(74, 222, 128, 0.30); }
.vtm__term-msg { color: #e2e8f0; word-break: break-word; }
.vtm__term-msg .file { color: var(--highlight-blue-light); }
.vtm__term-cursor {
    display: inline-block;
    width: 8px; height: 14px;
    background: var(--highlight-blue-light);
    margin-left: 4px;
    animation: vtm-cursor 1s steps(2) infinite;
    vertical-align: middle;
}
@keyframes vtm-cursor { 50% { opacity: 0; } }

.vtm__term-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 16px;
    background: rgba(0, 0, 0, 0.30);
    border-top: 1px solid rgba(255, 255, 255, 0.05);
    font-size: 10.5px;
    color: var(--esds-gray-400);
    letter-spacing: 0.06em;
}
.vtm__term-foot strong { color: var(--highlight-blue-light); font-weight: 700; }
.vtm__term-progress {
    flex: 1;
    max-width: 200px;
    height: 4px;
    background: rgba(255, 255, 255, 0.06);
    border-radius: 999px;
    overflow: hidden;
    position: relative;
}
.vtm__term-progress::after {
    content: '';
    position: absolute;
    top: 0; left: 0;
    height: 100%;
    width: 30%;
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
    border-radius: 999px;
    animation: vtm-progress-slide 2.4s ease-in-out infinite;
}
@keyframes vtm-progress-slide {
    0%   { transform: translateX(-50%); width: 25%; }
    50%  { transform: translateX(150%); width: 50%; }
    100% { transform: translateX(350%); width: 25%; }
}

.vtm__hero-quote {
    margin: 32px 0 0;
    padding: 22px 28px;
    background: rgba(255, 255, 255, 0.04);
    border-left: 3px solid #fca5a5;
    border-radius: 4px;
    font-size: 15.5px;
    line-height: 1.65;
    color: var(--esds-gray-200);
    font-style: italic;
    max-width: 820px;
    position: relative;
    z-index: 2;
}

@media (max-width: 992px) {
    .vtm__hero-grid { grid-template-columns: 1fr; gap: 36px; }
    .vtm__terminal { max-width: 560px; margin: 0 auto; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §B · THREAT REALITY (sec--light) — Editorial radar split
   ─────────────────────────────────────────────────────────────────────────── */
.vtm__threat-grid {
    display: grid;
    grid-template-columns: 1fr 0.85fr;
    gap: 64px;
    align-items: center;
}
.vtm__threat-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 6px 14px;
    background: rgba(220, 38, 38, 0.08);
    border: 1px solid rgba(220, 38, 38, 0.25);
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #b91c1c;
    margin-bottom: 22px;
}
.vtm__threat-eyebrow .dot {
    width: 7px; height: 7px;
    border-radius: 50%;
    background: #dc2626;
    box-shadow: 0 0 0 0 rgba(220, 38, 38, 0.6);
    animation: hero-pulse 1.6s ease-in-out infinite;
}
.vtm__threat-title {
    font-size: clamp(30px, 3.6vw, 48px);
    font-weight: 800;
    line-height: 1.06;
    letter-spacing: -1.2px;
    color: var(--esds-navy);
    margin: 0 0 22px;
}
.vtm__threat-title em {
    font-style: normal;
    background: linear-gradient(135deg, #dc2626, #f97316);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.vtm__threat-lede {
    font-size: 17px;
    color: var(--esds-gray-600);
    line-height: 1.75;
    margin: 0 0 22px;
}
.vtm__threat-lede strong { color: var(--esds-navy); font-weight: 700; }
.vtm__threat-callout {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    padding: 14px 20px;
    background: linear-gradient(135deg, var(--esds-navy), var(--esds-deep));
    border-radius: 12px;
    color: #fff;
    font-size: 14.5px;
    font-weight: 700;
    margin-top: 12px;
    box-shadow: 0 12px 32px rgba(10, 22, 40, 0.18);
}
.vtm__threat-callout .arrow {
    display: inline-grid;
    place-items: center;
    width: 28px; height: 28px;
    border-radius: 50%;
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    font-family: 'JetBrains Mono', monospace;
}

/* Radar visual */
.vtm__radar {
    position: relative;
    width: 100%;
    aspect-ratio: 1;
    max-width: 460px;
    margin: 0 auto;
}
.vtm__radar-svg {
    width: 100%;
    height: 100%;
    display: block;
}
.vtm__radar-svg .sweep {
    transform-origin: 250px 250px;
    animation: vtm-sweep 4s linear infinite;
}
@keyframes vtm-sweep { to { transform: rotate(360deg); } }
.vtm__radar-svg .ping {
    transform-origin: center;
    animation: vtm-ping 2.4s ease-out infinite;
}
.vtm__radar-svg .ping.p2 { animation-delay: 0.6s; }
.vtm__radar-svg .ping.p3 { animation-delay: 1.2s; }
.vtm__radar-svg .ping.p4 { animation-delay: 1.8s; }
@keyframes vtm-ping {
    0%   { opacity: 0; transform: scale(0.4); }
    35%  { opacity: 0.85; }
    100% { opacity: 0; transform: scale(2.0); }
}
.vtm__radar-stat {
    position: absolute;
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 12px;
    padding: 10px 14px;
    box-shadow: 0 10px 30px rgba(10, 22, 40, 0.10);
    font-size: 12px;
    font-weight: 700;
    color: var(--esds-navy);
    line-height: 1.35;
}
.vtm__radar-stat--tl { top: 4%;  left: -6%; }
.vtm__radar-stat--br { bottom: 4%; right: -6%; }
.vtm__radar-stat strong {
    display: block;
    font-family: 'JetBrains Mono', monospace;
    font-size: 16px;
    color: #dc2626;
}
.vtm__radar-stat--ok strong { color: var(--india-green); }

@media (max-width: 992px) {
    .vtm__threat-grid { grid-template-columns: 1fr; gap: 36px; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §C · INDIA NARRATIVE (sec--gray) — ₹ vs $ ladder
   ─────────────────────────────────────────────────────────────────────────── */
.vtm__india-grid {
    display: grid;
    grid-template-columns: 1.1fr 0.9fr;
    gap: 56px;
    align-items: center;
}
.vtm__india-tricolor {
    display: flex;
    height: 5px;
    border-radius: 3px;
    overflow: hidden;
    width: 80px;
    margin-bottom: 18px;
    box-shadow: 0 2px 8px rgba(10, 22, 40, 0.10);
}
.vtm__india-tricolor i { flex: 1; display: block; }
.vtm__india-tricolor i:nth-child(1) { background: var(--india-saffron); }
.vtm__india-tricolor i:nth-child(2) { background: #fff; border-top: 1px solid var(--esds-gray-100); border-bottom: 1px solid var(--esds-gray-100); }
.vtm__india-tricolor i:nth-child(3) { background: var(--india-green); }
.vtm__india-eyebrow {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.20em;
    text-transform: uppercase;
    color: var(--india-saffron);
    margin-bottom: 12px;
}
.vtm__india-title {
    font-size: clamp(28px, 3.4vw, 44px);
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -1px;
    color: var(--esds-navy);
    margin: 0 0 22px;
}
.vtm__india-title em {
    font-style: normal;
    background: linear-gradient(135deg, var(--india-saffron), var(--india-green));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.vtm__india-lede {
    font-size: 16px;
    color: var(--esds-gray-600);
    line-height: 1.75;
    margin: 0 0 16px;
}
.vtm__india-lede strong { color: var(--esds-navy); font-weight: 700; }
.vtm__india-anchor {
    margin-top: 22px;
    padding: 22px 26px;
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-left: 4px solid var(--india-saffron);
    border-radius: 12px;
    font-size: 18px;
    font-weight: 800;
    color: var(--esds-navy);
    line-height: 1.4;
}
.vtm__india-anchor small {
    display: block;
    font-size: 13px;
    font-weight: 500;
    color: var(--esds-gray-500);
    margin-top: 4px;
}

/* Versus panels */
.vtm__versus {
    display: grid;
    gap: 16px;
}
.vtm__versus-card {
    border-radius: 16px;
    padding: 24px 26px;
    transition: transform 0.25s var(--esds-ease), box-shadow 0.25s var(--esds-ease);
}
.vtm__versus-card--foreign {
    background: linear-gradient(135deg, #f3f4f6, #ffffff);
    border: 1px solid var(--esds-gray-200);
    color: var(--esds-gray-500);
    text-decoration: line-through;
    text-decoration-color: rgba(220, 38, 38, 0.45);
    text-decoration-thickness: 2px;
    opacity: 0.85;
}
.vtm__versus-card--vtm {
    background: linear-gradient(135deg, var(--esds-navy), var(--esds-deep));
    color: #fff;
    border: 1px solid rgba(126, 233, 255, 0.30);
    box-shadow: 0 18px 40px rgba(10, 22, 40, 0.20);
    position: relative;
    overflow: hidden;
}
.vtm__versus-card--vtm::before {
    content: '';
    position: absolute;
    top: -40px; right: -40px;
    width: 180px; height: 180px;
    background: radial-gradient(circle, rgba(0, 97, 255, 0.35), transparent 65%);
    filter: blur(20px);
}
.vtm__versus-card:hover { transform: translateY(-3px); }
.vtm__versus-tag {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 14px;
    text-decoration: none;
}
.vtm__versus-card--foreign .vtm__versus-tag { color: var(--esds-gray-500); }
.vtm__versus-card--vtm .vtm__versus-tag { color: var(--highlight-blue-light); }
.vtm__versus-price {
    font-family: 'JetBrains Mono', monospace;
    font-size: 36px;
    font-weight: 800;
    letter-spacing: -1.5px;
    line-height: 1;
    margin-bottom: 14px;
    text-decoration: inherit;
    position: relative;
    z-index: 1;
}
.vtm__versus-card--foreign .vtm__versus-price { color: var(--esds-gray-500); }
.vtm__versus-card--vtm .vtm__versus-price {
    background: linear-gradient(135deg, var(--highlight-blue-light), #fff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.vtm__versus-meta {
    font-size: 12.5px;
    line-height: 1.65;
    margin: 0;
    text-decoration: inherit;
    position: relative;
    z-index: 1;
}

@media (max-width: 992px) {
    .vtm__india-grid { grid-template-columns: 1fr; gap: 36px; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §D · 16 ENGINES (sec--light) — 4×4 card grid with branded SVG icons
   ─────────────────────────────────────────────────────────────────────────── */
.vtm__engines-meta {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    margin-bottom: 40px;
}
.vtm__engines-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    background: #fff;
    border: 1px solid var(--esds-gray-200);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11.5px;
    font-weight: 700;
    color: var(--esds-navy);
    letter-spacing: 0.08em;
}
.vtm__engines-pill strong {
    color: var(--highlight-blue);
    font-size: 14px;
    font-weight: 800;
    margin-right: 2px;
}
.vtm__engines-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
.vtm__engine {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 16px;
    padding: 24px 22px 22px;
    position: relative;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
.vtm__engine::before {
    /* corner gradient on hover */
    content: '';
    position: absolute;
    top: 0; right: 0;
    width: 80px; height: 80px;
    background: radial-gradient(circle at top right, rgba(0, 97, 255, 0.08), transparent 70%);
    opacity: 0;
    transition: opacity 0.3s;
    pointer-events: none;
}
.vtm__engine:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 40px rgba(10, 22, 40, 0.10);
    border-color: rgba(0, 97, 255, 0.25);
}
.vtm__engine:hover::before { opacity: 1; }

.vtm__engine-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--esds-gray-400);
    margin-bottom: 14px;
}
.vtm__engine-icon {
    width: 46px; height: 46px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.12), rgba(126, 233, 255, 0.08));
    border: 1px solid rgba(0, 97, 255, 0.18);
    display: grid;
    place-items: center;
    margin-bottom: 16px;
    color: var(--highlight-blue);
    flex-shrink: 0;
}
.vtm__engine-icon svg { width: 24px; height: 24px; }

/* Severity-coded icon backgrounds */
.vtm__engine[data-sev="crit"] .vtm__engine-icon { background: linear-gradient(135deg, rgba(220, 38, 38, 0.10), rgba(248, 113, 113, 0.06)); border-color: rgba(220, 38, 38, 0.22); color: #dc2626; }
.vtm__engine[data-sev="high"] .vtm__engine-icon { background: linear-gradient(135deg, rgba(234, 88, 12, 0.10), rgba(251, 146, 60, 0.06)); border-color: rgba(234, 88, 12, 0.22); color: #ea580c; }
.vtm__engine[data-sev="rep"]  .vtm__engine-icon { background: linear-gradient(135deg, rgba(124, 58, 237, 0.10), rgba(167, 139, 250, 0.06)); border-color: rgba(124, 58, 237, 0.22); color: #7c3aed; }
.vtm__engine[data-sev="mon"]  .vtm__engine-icon { background: linear-gradient(135deg, rgba(19, 136, 8, 0.10), rgba(74, 222, 128, 0.06)); border-color: rgba(19, 136, 8, 0.22); color: var(--india-green); }

.vtm__engine-cat {
    display: inline-block;
    padding: 2px 8px;
    background: var(--esds-gray-50);
    border: 1px solid var(--esds-gray-100);
    border-radius: 4px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.10em;
    color: var(--esds-gray-600);
    text-transform: uppercase;
    margin-bottom: 10px;
    align-self: flex-start;
}
.vtm__engine[data-sev="crit"] .vtm__engine-cat { background: rgba(220, 38, 38, 0.06); color: #dc2626; border-color: rgba(220, 38, 38, 0.20); }
.vtm__engine[data-sev="high"] .vtm__engine-cat { background: rgba(234, 88, 12, 0.06); color: #ea580c; border-color: rgba(234, 88, 12, 0.20); }
.vtm__engine[data-sev="rep"]  .vtm__engine-cat { background: rgba(124, 58, 237, 0.06); color: #7c3aed; border-color: rgba(124, 58, 237, 0.20); }
.vtm__engine[data-sev="mon"]  .vtm__engine-cat { background: rgba(19, 136, 8, 0.06); color: var(--india-green); border-color: rgba(19, 136, 8, 0.20); }

.vtm__engine-title {
    font-size: 15.5px;
    font-weight: 800;
    color: var(--esds-navy);
    margin: 0 0 8px;
    letter-spacing: -0.2px;
    line-height: 1.3;
}
.vtm__engine-text {
    font-size: 12.5px;
    color: var(--esds-gray-600);
    line-height: 1.6;
    margin: 0;
}

@media (max-width: 1100px) { .vtm__engines-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 768px)  { .vtm__engines-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px)  { .vtm__engines-grid { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §E · HOW IT WORKS (sec--gray) — 5-step horizontal timeline + loop
   ─────────────────────────────────────────────────────────────────────────── */
.vtm__steps {
    position: relative;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    padding: 0 4px;
    margin-bottom: 32px;
}
.vtm__steps::before {
    /* connecting line */
    content: '';
    position: absolute;
    top: 38px;
    left: 6%; right: 6%;
    height: 2px;
    background: linear-gradient(90deg,
        rgba(0, 97, 255, 0.10) 0%,
        rgba(0, 97, 255, 0.55) 25%,
        rgba(0, 97, 255, 0.55) 75%,
        rgba(0, 97, 255, 0.10) 100%);
}
.vtm__step {
    position: relative;
    padding: 0 14px;
    text-align: center;
    z-index: 1;
}
.vtm__step-num {
    width: 76px; height: 76px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid rgba(0, 97, 255, 0.25);
    display: grid;
    place-items: center;
    margin: 0 auto 18px;
    box-shadow: 0 8px 24px rgba(0, 97, 255, 0.10);
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease);
    position: relative;
}
.vtm__step:hover .vtm__step-num {
    transform: scale(1.06);
    box-shadow: 0 12px 32px rgba(0, 97, 255, 0.20);
}
.vtm__step-num svg { width: 30px; height: 30px; color: var(--highlight-blue); }
.vtm__step-num-text {
    position: absolute;
    bottom: -8px;
    right: -8px;
    width: 28px; height: 28px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    font-weight: 800;
    display: grid;
    place-items: center;
    box-shadow: 0 4px 10px rgba(0, 97, 255, 0.30);
}
.vtm__step-title {
    font-size: 14.5px;
    font-weight: 800;
    color: var(--esds-navy);
    margin: 0 0 8px;
    letter-spacing: -0.2px;
    line-height: 1.3;
}
.vtm__step-text {
    font-size: 12.5px;
    color: var(--esds-gray-600);
    line-height: 1.6;
    margin: 0;
}

.vtm__steps-loop {
    text-align: center;
    margin-top: 12px;
    padding: 14px 24px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: linear-gradient(90deg, rgba(0, 97, 255, 0.08), rgba(126, 233, 255, 0.04));
    border: 1px dashed rgba(0, 97, 255, 0.30);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11.5px;
    font-weight: 700;
    color: var(--highlight-blue);
    letter-spacing: 0.10em;
    margin: 0 auto;
    width: max-content;
    max-width: 100%;
}
.vtm__steps-loop svg {
    width: 16px; height: 16px;
    animation: vtm-spin-cycle 4s linear infinite;
}
@keyframes vtm-spin-cycle { to { transform: rotate(360deg); } }
.vtm__steps-loop-wrap { text-align: center; }

@media (max-width: 992px) {
    .vtm__steps { grid-template-columns: repeat(2, 1fr); gap: 32px 16px; }
    .vtm__steps::before { display: none; }
}
@media (max-width: 540px) {
    .vtm__steps { grid-template-columns: 1fr; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §F · PRICING (sec--light) — 4-tier cards with featured glow
   ─────────────────────────────────────────────────────────────────────────── */
.vtm__pricing {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
    align-items: stretch;
}
.vtm__plan {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 18px;
    padding: 32px 26px 28px;
    position: relative;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
    display: flex;
    flex-direction: column;
}
.vtm__plan:hover {
    transform: translateY(-6px);
    box-shadow: 0 22px 50px rgba(10, 22, 40, 0.10);
    border-color: rgba(0, 97, 255, 0.20);
}
.vtm__plan--featured {
    background: linear-gradient(180deg, rgba(0, 97, 255, 0.04) 0%, #ffffff 60%);
    border: 1.5px solid var(--highlight-blue);
    box-shadow: 0 22px 60px rgba(0, 97, 255, 0.18);
    transform: translateY(-8px);
}
.vtm__plan--featured:hover { transform: translateY(-12px); }
.vtm__plan-flag {
    position: absolute;
    top: -12px; left: 50%;
    transform: translateX(-50%);
    padding: 5px 14px;
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.16em;
    border-radius: 999px;
    text-transform: uppercase;
    box-shadow: 0 6px 16px rgba(0, 97, 255, 0.40);
}
.vtm__plan-tag {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--esds-gray-500);
    margin-bottom: 6px;
}
.vtm__plan--featured .vtm__plan-tag { color: var(--highlight-blue); }
.vtm__plan-name {
    font-size: 18px;
    font-weight: 800;
    color: var(--esds-navy);
    margin: 0 0 18px;
    letter-spacing: -0.4px;
}
.vtm__plan-price {
    display: flex;
    align-items: baseline;
    gap: 6px;
    margin-bottom: 4px;
}
.vtm__plan-price-amt {
    font-family: 'JetBrains Mono', monospace;
    font-size: 32px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -1px;
    line-height: 1;
}
.vtm__plan--featured .vtm__plan-price-amt {
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.vtm__plan-price-per {
    font-size: 13px;
    color: var(--esds-gray-500);
    font-weight: 600;
}
.vtm__plan-feat {
    list-style: none;
    padding: 0;
    margin: 22px 0 26px;
    display: grid;
    gap: 10px;
    border-top: 1px solid var(--esds-gray-100);
    padding-top: 22px;
    flex-grow: 1;
}
.vtm__plan-feat li {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 13px;
    color: var(--esds-gray-700);
    line-height: 1.45;
}
.vtm__plan-feat .check {
    flex-shrink: 0;
    width: 16px; height: 16px;
    border-radius: 50%;
    background: rgba(0, 97, 255, 0.10);
    color: var(--highlight-blue);
    display: grid;
    place-items: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    margin-top: 2px;
}
.vtm__plan--featured .vtm__plan-feat .check { background: var(--highlight-blue); color: #fff; }
.vtm__plan-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 12px 18px;
    background: var(--esds-navy);
    color: #fff;
    border: 0;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
    font-family: inherit;
    transition: transform 0.2s, box-shadow 0.2s, background 0.2s;
}
.vtm__plan-cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 26px rgba(10, 22, 40, 0.20);
    color: #fff;
    background: var(--esds-deep);
}
.vtm__plan--featured .vtm__plan-cta {
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
    box-shadow: 0 8px 22px rgba(0, 97, 255, 0.30);
}
.vtm__plan--featured .vtm__plan-cta:hover {
    box-shadow: 0 14px 32px rgba(0, 97, 255, 0.45);
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
}

@media (max-width: 1100px) { .vtm__pricing { grid-template-columns: repeat(2, 1fr); } .vtm__plan--featured { transform: none; } .vtm__plan--featured:hover { transform: translateY(-4px); } }
@media (max-width: 540px)  { .vtm__pricing { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §G · WHY VTMSCAN (sec--dark) — Side-by-side panels, 8 row pairs
   ─────────────────────────────────────────────────────────────────────────── */
.vtm__compare {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}
.vtm__compare-col {
    border-radius: 18px;
    padding: 32px 30px;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}
.vtm__compare-col--foreign {
    background: rgba(255, 255, 255, 0.025);
    border: 1px solid rgba(255, 255, 255, 0.06);
}
.vtm__compare-col--vtm {
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.16), rgba(126, 233, 255, 0.06));
    border: 1px solid rgba(126, 233, 255, 0.30);
    box-shadow: 0 22px 60px rgba(0, 97, 255, 0.16);
    position: relative;
    overflow: hidden;
}
.vtm__compare-col--vtm::before {
    content: '';
    position: absolute;
    top: -100px; right: -100px;
    width: 280px; height: 280px;
    background: radial-gradient(circle, rgba(126, 233, 255, 0.30), transparent 60%);
    filter: blur(40px);
    pointer-events: none;
}
.vtm__compare-tag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.20em;
    text-transform: uppercase;
    margin-bottom: 4px;
}
.vtm__compare-col--foreign .vtm__compare-tag { color: rgba(252, 165, 165, 0.95); }
.vtm__compare-col--foreign .vtm__compare-tag::before {
    content: ''; width: 6px; height: 6px; border-radius: 50%; background: #ef4444;
}
.vtm__compare-col--vtm .vtm__compare-tag { color: var(--highlight-blue-light); }
.vtm__compare-col--vtm .vtm__compare-tag::before {
    content: ''; width: 6px; height: 6px; border-radius: 50%;
    background: var(--highlight-blue-light);
    box-shadow: 0 0 10px var(--highlight-blue-light);
}
.vtm__compare-name {
    font-size: 22px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.5px;
    margin: 0 0 24px;
    position: relative;
    z-index: 1;
}
.vtm__compare-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 14px;
    position: relative;
    z-index: 1;
}
.vtm__compare-row-item {
    display: grid;
    grid-template-columns: 110px 1fr;
    gap: 14px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    align-items: center;
}
.vtm__compare-row-item:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}
.vtm__compare-key {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.10em;
    text-transform: uppercase;
    color: var(--esds-gray-400);
}
.vtm__compare-val {
    font-size: 14px;
    line-height: 1.45;
    font-weight: 600;
}
.vtm__compare-col--foreign .vtm__compare-val {
    color: rgba(252, 165, 165, 0.90);
}
.vtm__compare-col--vtm .vtm__compare-val {
    color: #fff;
}
.vtm__compare-col--vtm .vtm__compare-val strong {
    color: var(--highlight-blue-light);
    font-weight: 800;
}

@media (max-width: 992px) {
    .vtm__compare { grid-template-columns: 1fr; }
}
@media (max-width: 540px) {
    .vtm__compare-row-item { grid-template-columns: 1fr; gap: 4px; padding-bottom: 12px; }
}


/* ═══════════════════════════════════════════════════════════════════════════
   FOOTER · esds-foot (linear-gradient navy → deep → navy, never radial)
   ═══════════════════════════════════════════════════════════════════════════ */
.esds-foot {
    background: linear-gradient(180deg, var(--esds-navy) 0%, var(--esds-deep) 50%, var(--esds-navy) 100%);
    color: var(--esds-gray-300);
    position: relative;
    overflow: hidden;
}
.esds-foot::before {
    content: '';
    position: absolute; inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.012) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.012) 1px, transparent 1px);
    background-size: 64px 64px;
    pointer-events: none;
}
.esds-foot__strip {
    position: relative;
    z-index: 1;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    padding: 36px 0;
}
.esds-foot__strip-inner {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    flex-wrap: wrap;
}
.esds-foot__strip-text {
    font-size: 17px;
    font-weight: 700;
    color: #fff;
    letter-spacing: -0.3px;
}
.esds-foot__strip-text small {
    display: block;
    font-size: 12.5px;
    font-weight: 500;
    color: var(--esds-gray-400);
    margin-top: 4px;
    letter-spacing: 0;
}
.esds-foot__strip-cta {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 13px 26px;
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    border-radius: 10px;
    text-decoration: none;
    box-shadow: 0 6px 22px rgba(0, 97, 255, 0.40);
    border: 0;
    cursor: pointer;
    font-family: inherit;
    position: relative;
    transition: transform 0.25s, box-shadow 0.25s;
}
.esds-foot__strip-cta::before {
    content: '';
    position: absolute;
    inset: -3px;
    border: 2px solid rgba(126, 233, 255, 0.4);
    border-radius: 13px;
    animation: vtm-pulse-ring 2s ease-out infinite;
    pointer-events: none;
}
@keyframes vtm-pulse-ring {
    0%   { opacity: 1; transform: scale(0.95); }
    100% { opacity: 0; transform: scale(1.15); }
}
.esds-foot__strip-cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 32px rgba(0, 97, 255, 0.55);
    color: #fff;
}

.esds-foot__main {
    position: relative;
    z-index: 1;
    padding: 64px 0 36px;
}
.esds-foot__container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 32px;
}
.esds-foot__nav {
    display: grid;
    grid-template-columns: 1.4fr repeat(4, 1fr);
    gap: 48px;
    align-items: start;
}
.esds-foot__brand { max-width: 320px; }
.esds-foot__logo {
    display: inline-flex;
    align-items: baseline;
    font-family: inherit;
    font-size: 26px;
    font-weight: 800;
    color: #fff;
    text-decoration: none;
    letter-spacing: -1px;
    margin-bottom: 16px;
}
.esds-foot__logo-dot {
    display: inline-block;
    width: 7px; height: 7px;
    border-radius: 50%;
    background: var(--highlight-blue-light);
    margin-left: 4px;
    box-shadow: 0 0 12px var(--highlight-blue-light);
}
.esds-foot__tag {
    font-size: 13px;
    line-height: 1.7;
    color: var(--esds-gray-400);
    margin: 0 0 20px;
}
.esds-foot__noc {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 14px;
    background: rgba(0, 97, 255, 0.12);
    border: 1px solid rgba(126, 233, 255, 0.25);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    color: var(--highlight-blue-light);
    letter-spacing: 0.06em;
    margin-bottom: 18px;
}
.esds-foot__noc .dot {
    width: 6px; height: 6px;
    border-radius: 50%;
    background: #4ade80;
    box-shadow: 0 0 0 0 rgba(74, 222, 128, 0.6);
    animation: hero-pulse 1.8s ease-in-out infinite;
}
.esds-foot__social {
    display: flex;
    gap: 10px;
}
.esds-foot__social a {
    width: 34px; height: 34px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.08);
    color: var(--esds-gray-300);
    transition: all 0.25s;
}
.esds-foot__social a:hover {
    background: var(--highlight-blue);
    border-color: var(--highlight-blue);
    color: #fff;
    transform: translateY(-2px);
}
.esds-foot__social svg { width: 15px; height: 15px; }
.esds-foot__col h4 {
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #fff;
    margin: 0 0 18px;
}
.esds-foot__col ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.esds-foot__col a {
    color: var(--esds-gray-400);
    font-size: 13px;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s;
}
.esds-foot__col a:hover { color: var(--highlight-blue-light); }

.esds-foot__badges {
    position: relative;
    z-index: 1;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    padding: 28px 0;
}
.esds-foot__badges-inner {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 32px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 14px;
}
.esds-foot__badge {
    padding: 7px 14px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 8px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 700;
    color: var(--esds-gray-400);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.esds-foot__base {
    position: relative;
    z-index: 1;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    padding: 22px 0;
    background: rgba(0, 0, 0, 0.18);
}
.esds-foot__base-inner {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
}
.esds-foot__legal {
    font-size: 12px;
    color: var(--esds-gray-500);
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}
.esds-foot__flag { display: inline-flex; align-items: center; gap: 6px; }
.esds-foot__flag-bars {
    display: inline-flex;
    flex-direction: column;
    width: 16px;
    border-radius: 2px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.15);
}
.esds-foot__flag-bars i { display: block; height: 4px; }
.esds-foot__flag-bars i:nth-child(1) { background: var(--india-saffron); }
.esds-foot__flag-bars i:nth-child(2) { background: #fff; }
.esds-foot__flag-bars i:nth-child(3) { background: var(--india-green); }
.esds-foot__base-links { display: flex; gap: 18px; flex-wrap: wrap; }
.esds-foot__base-links a {
    font-size: 12px;
    color: var(--esds-gray-400);
    text-decoration: none;
    transition: color 0.2s;
}
.esds-foot__base-links a:hover { color: var(--highlight-blue-light); }

@media (max-width: 992px) {
    .esds-foot__nav { grid-template-columns: 1fr 1fr; gap: 36px; }
    .esds-foot__brand { grid-column: span 2; max-width: none; }
}
@media (max-width: 560px) {
    .esds-foot__nav { grid-template-columns: 1fr; }
    .esds-foot__brand { grid-column: span 1; }
    .esds-foot__strip-inner { flex-direction: column; align-items: flex-start; }
}


/* ═══════════════════════════════════════════════════════════════════════════
   CONNECT MODAL · esds-modal__ prefix
   ═══════════════════════════════════════════════════════════════════════════ */
.esds-modal {
    position: fixed; inset: 0;
    background: rgba(10, 22, 40, 0.82);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
    overflow-y: auto;
}
.esds-modal.is-open { display: flex; }
.esds-modal__dialog {
    background: #fff;
    border-radius: 20px;
    max-width: 580px;
    width: 100%;
    max-height: 92vh;
    overflow-y: auto;
    position: relative;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.40);
    animation: vtm-modal-in 0.3s var(--esds-ease);
}
@keyframes vtm-modal-in {
    from { opacity: 0; transform: scale(0.96) translateY(12px); }
    to   { opacity: 1; transform: scale(1) translateY(0); }
}
.esds-modal__close {
    position: absolute; top: 18px; right: 18px;
    width: 36px; height: 36px;
    border-radius: 50%;
    background: var(--esds-gray-50);
    border: 0; cursor: pointer;
    display: grid; place-items: center;
    color: var(--esds-gray-600);
    transition: all 0.2s;
    z-index: 2;
}
.esds-modal__close:hover {
    background: var(--esds-gray-100);
    color: var(--esds-navy);
    transform: rotate(90deg);
}
.esds-modal__head { padding: 36px 36px 0; }
.esds-modal__eyebrow {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px; font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--highlight-blue);
    margin-bottom: 8px;
}
.esds-modal__title {
    font-size: 22px; font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.5px;
    margin: 0 0 6px;
}
.esds-modal__sub {
    font-size: 13.5px;
    color: var(--esds-gray-500);
    line-height: 1.55;
    margin: 0;
}
.esds-modal__form { padding: 26px 36px 32px; }
.esds-modal__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 12px;
}
.esds-modal__field { display: flex; flex-direction: column; gap: 6px; }
.esds-modal__field--full { grid-column: span 2; }
.esds-modal__label {
    font-size: 11.5px; font-weight: 700;
    color: var(--esds-gray-600);
    letter-spacing: 0.04em;
}
.esds-modal__label .req { color: #dc2626; }
.esds-modal__input,
.esds-modal__select,
.esds-modal__textarea {
    padding: 11px 14px;
    background: #fff;
    border: 1px solid var(--esds-gray-200);
    border-radius: 8px;
    font-size: 13.5px;
    font-family: inherit;
    color: var(--esds-navy);
    transition: border-color 0.2s, box-shadow 0.2s;
    width: 100%;
}
.esds-modal__input:focus,
.esds-modal__select:focus,
.esds-modal__textarea:focus {
    outline: none;
    border-color: var(--highlight-blue);
    box-shadow: 0 0 0 3px rgba(0, 97, 255, 0.10);
}
.esds-modal__input.is-invalid,
.esds-modal__select.is-invalid,
.esds-modal__textarea.is-invalid {
    border-color: #dc2626;
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.08);
}
.esds-modal__textarea { min-height: 80px; resize: vertical; }
.esds-modal__consent {
    grid-column: span 2;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px;
    background: var(--esds-gray-50);
    border-radius: 8px;
    margin: 6px 0 16px;
    font-size: 12px;
    color: var(--esds-gray-600);
    line-height: 1.5;
}
.esds-modal__consent input {
    margin-top: 2px;
    accent-color: var(--highlight-blue);
    flex-shrink: 0;
}
.esds-modal__consent input.is-invalid { outline: 2px solid #dc2626; outline-offset: 2px; }
.esds-modal__consent a { color: var(--highlight-blue); text-decoration: underline; }
.esds-modal__submit {
    grid-column: span 2;
    padding: 13px 24px;
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    border: 0;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    font-family: inherit;
    transition: transform 0.2s, box-shadow 0.2s;
    box-shadow: 0 6px 18px rgba(0, 97, 255, 0.30);
}
.esds-modal__submit:hover:not(:disabled) {
    transform: translateY(-1px);
    box-shadow: 0 10px 26px rgba(0, 97, 255, 0.45);
}
.esds-modal__submit:disabled { opacity: 0.6; cursor: wait; }
.esds-modal__success {
    grid-column: span 2;
    margin-top: 14px;
    padding: 14px 16px;
    background: rgba(19, 136, 8, 0.08);
    border: 1px solid rgba(19, 136, 8, 0.25);
    border-radius: 10px;
    color: var(--india-green);
    font-size: 13px; font-weight: 700;
    text-align: center;
}
@media (max-width: 540px) {
    .esds-modal__row { grid-template-columns: 1fr; }
    .esds-modal__field--full,
    .esds-modal__consent,
    .esds-modal__submit { grid-column: span 1; }
    .esds-modal__head { padding: 28px 24px 0; }
    .esds-modal__form { padding: 22px 24px 28px; }
}



/* ═══════════════════════════════════════════════════════════════════════════
   MS · MANAGED SERVICES — Page-specific styles (ms__ prefix)
   ═══════════════════════════════════════════════════════════════════════════ */

/* ───────────────────────────────────────────────────────────────────────────
   §A · HERO — Stacked Callouts around animated SVG fortress shield
   ─────────────────────────────────────────────────────────────────────────── */
.ms__hero-grid {
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    gap: 56px;
    align-items: center;
    margin-bottom: 56px;
}
.ms__hero-shield {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    max-width: 460px;
    margin: 0 auto;
}
.ms__shield-svg {
    width: 100%; height: 100%;
    display: block;
    filter: drop-shadow(0 18px 60px rgba(0, 97, 255, 0.30));
}
.ms__shield-svg .ring-rotate {
    transform-origin: 250px 250px;
    animation: ms-ring-spin 22s linear infinite;
}
.ms__shield-svg .ring-rotate-r {
    transform-origin: 250px 250px;
    animation: ms-ring-spin-r 30s linear infinite;
}
@keyframes ms-ring-spin   { to { transform: rotate(360deg); } }
@keyframes ms-ring-spin-r { to { transform: rotate(-360deg); } }
.ms__shield-svg .pulse-dot {
    transform-origin: center;
    animation: ms-pulse 2.4s ease-in-out infinite;
}
.ms__shield-svg .pulse-dot.d2 { animation-delay: 0.6s; }
.ms__shield-svg .pulse-dot.d3 { animation-delay: 1.2s; }
.ms__shield-svg .pulse-dot.d4 { animation-delay: 1.8s; }
@keyframes ms-pulse {
    0%, 100% { opacity: 0.45; transform: scale(1); }
    50%      { opacity: 1;    transform: scale(1.15); }
}

/* Floating callout cards pinned around shield */
.ms__callout {
    position: absolute;
    background: rgba(13, 27, 50, 0.85);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid rgba(126, 233, 255, 0.25);
    border-radius: 12px;
    padding: 12px 14px;
    min-width: 165px;
    max-width: 200px;
    color: #fff;
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.30);
    transition: transform 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
    animation: ms-float 6s ease-in-out infinite;
    z-index: 2;
}
.ms__callout:hover {
    transform: translateY(-4px) scale(1.04);
    border-color: rgba(126, 233, 255, 0.6);
}
.ms__callout--tl { top: 4%;   left: -8%;  animation-delay: 0s; }
.ms__callout--tr { top: 8%;   right: -6%; animation-delay: 1.5s; }
.ms__callout--bl { bottom: 8%; left: -10%; animation-delay: 3s; }
.ms__callout--br { bottom: 2%; right: -4%; animation-delay: 4.5s; }
@keyframes ms-float {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-8px); }
}
.ms__callout-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.14em;
    color: var(--highlight-blue-light);
    text-transform: uppercase;
    margin-bottom: 5px;
    display: flex;
    align-items: center;
    gap: 6px;
}
.ms__callout-label::before {
    content: '';
    width: 5px; height: 5px;
    border-radius: 50%;
    background: var(--highlight-blue-light);
    box-shadow: 0 0 8px var(--highlight-blue-light);
}
.ms__callout-text {
    font-size: 13px;
    font-weight: 700;
    line-height: 1.35;
}

.ms__hero-quote {
    margin: 32px 0 0;
    padding: 22px 28px;
    background: rgba(255, 255, 255, 0.04);
    border-left: 3px solid var(--highlight-blue);
    border-radius: 4px;
    font-size: 15.5px;
    line-height: 1.65;
    color: var(--esds-gray-200);
    font-style: italic;
    max-width: 760px;
    position: relative;
    z-index: 2;
}

@media (max-width: 992px) {
    .ms__hero-grid { grid-template-columns: 1fr; gap: 48px; }
    .ms__hero-shield { max-width: 360px; }
    .ms__callout { min-width: 145px; padding: 10px 12px; }
    .ms__callout-text { font-size: 12px; }
}
@media (max-width: 640px) {
    .ms__callout--tl { left: 0;  }
    .ms__callout--tr { right: 0; }
    .ms__callout--bl { left: 0;  }
    .ms__callout--br { right: 0; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §B · DPDP — Layered Overprint (giant numeral + fine cards)
   ─────────────────────────────────────────────────────────────────────────── */
.ms__dpdp {
    position: relative;
    overflow: hidden;
}
.ms__dpdp-numeral {
    position: absolute;
    top: 50%; left: -2%;
    transform: translateY(-50%);
    font-family: 'JetBrains Mono', monospace;
    font-size: clamp(220px, 32vw, 480px);
    font-weight: 800;
    line-height: 1;
    background: linear-gradient(180deg,
        rgba(0, 97, 255, 0.06) 0%,
        rgba(0, 97, 255, 0.02) 60%,
        transparent 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    letter-spacing: -0.06em;
    pointer-events: none;
    user-select: none;
    z-index: 0;
    white-space: nowrap;
}
.ms__dpdp-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 56px;
    align-items: center;
}
.ms__dpdp-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    background: rgba(220, 38, 38, 0.10);
    border: 1px solid rgba(220, 38, 38, 0.30);
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #b91c1c;
    margin-bottom: 18px;
}
.ms__dpdp-eyebrow .dot {
    width: 6px; height: 6px;
    border-radius: 50%;
    background: #dc2626;
    box-shadow: 0 0 0 0 rgba(220, 38, 38, 0.6);
    animation: hero-pulse 1.8s ease-in-out infinite;
}
.ms__dpdp-title {
    font-size: clamp(30px, 3.6vw, 46px);
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -1px;
    color: var(--esds-navy);
    margin: 0 0 22px;
}
.ms__dpdp-title em {
    font-style: normal;
    background: linear-gradient(135deg, #dc2626, #f97316);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.ms__dpdp-lede {
    font-size: 16px;
    color: var(--esds-gray-600);
    line-height: 1.75;
    margin: 0 0 16px;
}
.ms__dpdp-lede strong { color: var(--esds-navy); font-weight: 700; }

.ms__dpdp-fines {
    display: grid;
    gap: 14px;
}
.ms__fine-card {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-left: 4px solid #dc2626;
    border-radius: 10px;
    padding: 22px 24px;
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 22px;
    transition: transform 0.25s var(--esds-ease), box-shadow 0.25s var(--esds-ease);
}
.ms__fine-card:nth-child(2) { border-left-color: #f97316; }
.ms__fine-card:nth-child(3) { border-left-color: #ca8a04; }
.ms__fine-card:hover {
    transform: translateX(4px);
    box-shadow: 0 12px 36px rgba(10, 22, 40, 0.08);
}
.ms__fine-amount {
    font-family: 'JetBrains Mono', monospace;
    font-size: 32px;
    font-weight: 800;
    color: #dc2626;
    letter-spacing: -1px;
    line-height: 1;
}
.ms__fine-card:nth-child(2) .ms__fine-amount { color: #ea580c; }
.ms__fine-card:nth-child(3) .ms__fine-amount { color: #ca8a04; }
.ms__fine-amount-u {
    display: block;
    font-size: 11px;
    font-weight: 700;
    color: var(--esds-gray-500);
    letter-spacing: 0.08em;
    margin-top: 2px;
    text-transform: uppercase;
}
.ms__fine-text {
    font-size: 14.5px;
    font-weight: 600;
    color: var(--esds-navy);
    line-height: 1.5;
}
.ms__fine-text small {
    display: block;
    font-size: 12.5px;
    font-weight: 500;
    color: var(--esds-gray-500);
    margin-top: 4px;
    line-height: 1.5;
}
.ms__dpdp-question {
    margin-top: 32px;
    padding: 26px 28px;
    background: linear-gradient(135deg, var(--esds-navy), var(--esds-deep));
    color: #fff;
    border-radius: 14px;
    font-size: 14.5px;
    line-height: 1.65;
    box-shadow: 0 12px 32px rgba(10, 22, 40, 0.10);
}
.ms__dpdp-question strong { color: var(--highlight-blue-light); display: block; margin-bottom: 6px; font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase; }
@media (max-width: 992px) {
    .ms__dpdp-grid { grid-template-columns: 1fr; gap: 36px; }
    .ms__dpdp-numeral { opacity: 0.4; font-size: clamp(180px, 50vw, 320px); }
}


/* ───────────────────────────────────────────────────────────────────────────
   §C · SOVEREIGNTY PILLARS — Floating Islands (4 cards with branded SVG)
   ─────────────────────────────────────────────────────────────────────────── */
.ms__pillars {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
}
.ms__pillar {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 18px;
    padding: 30px 26px 28px;
    position: relative;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
    overflow: hidden;
}
.ms__pillar::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.4s var(--esds-ease);
}
.ms__pillar:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 48px rgba(10, 22, 40, 0.10);
    border-color: rgba(0, 97, 255, 0.20);
}
.ms__pillar:hover::before { transform: scaleX(1); }
.ms__pillar-icon {
    width: 56px; height: 56px;
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.12), rgba(126, 233, 255, 0.08));
    border: 1px solid rgba(0, 97, 255, 0.18);
    display: grid;
    place-items: center;
    margin-bottom: 22px;
    color: var(--highlight-blue);
}
.ms__pillar-icon svg { width: 28px; height: 28px; }
.ms__pillar:nth-child(2) .ms__pillar-icon { background: linear-gradient(135deg, rgba(255, 107, 53, 0.12), rgba(255, 168, 92, 0.08)); border-color: rgba(255, 107, 53, 0.20); color: var(--india-saffron); }
.ms__pillar:nth-child(3) .ms__pillar-icon { background: linear-gradient(135deg, rgba(19, 136, 8, 0.12), rgba(82, 195, 68, 0.08)); border-color: rgba(19, 136, 8, 0.20); color: var(--india-green); }
.ms__pillar:nth-child(4) .ms__pillar-icon { background: linear-gradient(135deg, rgba(126, 233, 255, 0.16), rgba(0, 97, 255, 0.08)); border-color: rgba(126, 233, 255, 0.30); color: var(--highlight-blue); }
.ms__pillar-tag {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--esds-gray-500);
    margin-bottom: 6px;
}
.ms__pillar-title {
    font-size: 17px;
    font-weight: 800;
    color: var(--esds-navy);
    margin: 0 0 12px;
    letter-spacing: -0.3px;
    line-height: 1.25;
}
.ms__pillar-text {
    font-size: 13.5px;
    color: var(--esds-gray-600);
    line-height: 1.65;
    margin: 0;
}
@media (max-width: 992px) { .ms__pillars { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .ms__pillars { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §D · COMPARE — Split-narrative scroll rows (red → blue)
   ─────────────────────────────────────────────────────────────────────────── */
.ms__compare-head {
    display: grid;
    grid-template-columns: 1fr 80px 1fr;
    gap: 20px;
    margin-bottom: 18px;
    padding: 0 4px;
}
.ms__compare-head-cell {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--esds-gray-400);
}
.ms__compare-head-cell--red  { color: rgba(252, 165, 165, 0.95); }
.ms__compare-head-cell--blue { color: var(--highlight-blue-light); text-align: right; }
.ms__compare-rows {
    display: grid;
    gap: 14px;
}
.ms__compare-row {
    display: grid;
    grid-template-columns: 1fr 80px 1fr;
    gap: 20px;
    align-items: center;
    padding: 22px 24px;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 14px;
    transition: background 0.3s var(--esds-ease), border-color 0.3s var(--esds-ease);
}
.ms__compare-row:hover {
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(126, 233, 255, 0.15);
}
.ms__compare-cell--red {
    color: rgba(252, 165, 165, 0.85);
    font-size: 14.5px;
    line-height: 1.55;
    font-weight: 500;
    position: relative;
    padding-left: 18px;
}
.ms__compare-cell--red::before {
    content: '';
    position: absolute;
    left: 0; top: 8px;
    width: 8px; height: 8px;
    border-radius: 50%;
    background: #ef4444;
    box-shadow: 0 0 12px rgba(239, 68, 68, 0.55);
}
.ms__compare-arrow {
    display: grid;
    place-items: center;
    color: var(--highlight-blue-light);
    font-family: 'JetBrains Mono', monospace;
    font-size: 22px;
    font-weight: 700;
}
.ms__compare-cell--blue {
    color: #fff;
    font-size: 14.5px;
    line-height: 1.55;
    font-weight: 600;
    text-align: right;
    position: relative;
    padding-right: 18px;
}
.ms__compare-cell--blue::after {
    content: '✓';
    position: absolute;
    right: 0; top: 0;
    font-family: 'JetBrains Mono', monospace;
    color: var(--highlight-blue-light);
    font-size: 14px;
    font-weight: 800;
}
@media (max-width: 768px) {
    .ms__compare-head, .ms__compare-row { grid-template-columns: 1fr; gap: 8px; }
    .ms__compare-arrow { display: none; }
    .ms__compare-cell--blue { text-align: left; padding-right: 0; padding-left: 18px; }
    .ms__compare-cell--blue::after { display: none; }
    .ms__compare-cell--blue::before {
        content: ''; position: absolute; left: 0; top: 8px;
        width: 8px; height: 8px; border-radius: 50%;
        background: var(--highlight-blue-light);
        box-shadow: 0 0 12px rgba(126, 233, 255, 0.55);
    }
}


/* ───────────────────────────────────────────────────────────────────────────
   §E · CATALOG — Filter chips + multi-column card wall (28 services)
   ─────────────────────────────────────────────────────────────────────────── */
.ms__catalog-chips {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin-bottom: 40px;
}
.ms__chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background: #fff;
    border: 1px solid var(--esds-gray-200);
    border-radius: 999px;
    font-size: 13px;
    font-weight: 700;
    color: var(--esds-gray-600);
    cursor: pointer;
    transition: all 0.25s var(--esds-ease);
    font-family: inherit;
}
.ms__chip:hover {
    border-color: var(--highlight-blue);
    color: var(--highlight-blue);
}
.ms__chip.is-active {
    background: linear-gradient(90deg, var(--highlight-blue), var(--highlight-blue-light));
    border-color: transparent;
    color: #fff;
    box-shadow: 0 6px 18px rgba(0, 97, 255, 0.25);
}
.ms__chip-count {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    padding: 1px 7px;
    background: rgba(10, 22, 40, 0.07);
    border-radius: 999px;
    color: var(--esds-gray-500);
}
.ms__chip.is-active .ms__chip-count { background: rgba(255, 255, 255, 0.20); color: #fff; }

.ms__catalog-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
}
.ms__catalog-card {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 14px;
    padding: 22px 22px 20px;
    position: relative;
    transition: all 0.3s var(--esds-ease);
    display: flex;
    flex-direction: column;
    min-height: 140px;
}
.ms__catalog-card.is-hidden { display: none; }
.ms__catalog-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 36px rgba(10, 22, 40, 0.08);
    border-color: rgba(0, 97, 255, 0.25);
}
.ms__catalog-cat {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--highlight-blue);
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 6px;
}
.ms__catalog-cat::before {
    content: '';
    width: 5px; height: 5px;
    border-radius: 50%;
    background: var(--highlight-blue);
}
.ms__catalog-card[data-cat="consulting"] .ms__catalog-cat { color: #d97706; }
.ms__catalog-card[data-cat="consulting"] .ms__catalog-cat::before { background: #d97706; }
.ms__catalog-card[data-cat="devops"] .ms__catalog-cat { color: #7c3aed; }
.ms__catalog-card[data-cat="devops"] .ms__catalog-cat::before { background: #7c3aed; }
.ms__catalog-card[data-cat="security"] .ms__catalog-cat { color: #dc2626; }
.ms__catalog-card[data-cat="security"] .ms__catalog-cat::before { background: #dc2626; }
.ms__catalog-card[data-cat="continuity"] .ms__catalog-cat { color: var(--india-green); }
.ms__catalog-card[data-cat="continuity"] .ms__catalog-cat::before { background: var(--india-green); }

.ms__catalog-name {
    font-size: 14.5px;
    font-weight: 700;
    color: var(--esds-navy);
    line-height: 1.4;
    margin: 0;
    letter-spacing: -0.2px;
}
.ms__catalog-name small {
    display: block;
    font-size: 12px;
    font-weight: 500;
    color: var(--esds-gray-500);
    margin-top: 6px;
    line-height: 1.5;
}
.ms__catalog-arrow {
    margin-top: auto;
    padding-top: 14px;
    color: var(--esds-gray-400);
    font-family: 'JetBrains Mono', monospace;
    font-size: 16px;
    transition: color 0.25s, transform 0.25s;
    align-self: flex-start;
}
.ms__catalog-card:hover .ms__catalog-arrow {
    color: var(--highlight-blue);
    transform: translateX(4px);
}
@media (max-width: 1024px) { .ms__catalog-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 720px)  { .ms__catalog-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px)  { .ms__catalog-grid { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §F · DESERVES — 5-column storyboard cards
   ─────────────────────────────────────────────────────────────────────────── */
.ms__deserves {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 18px;
}
.ms__deserve-card {
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 16px;
    padding: 28px 24px;
    position: relative;
    transition: transform 0.3s var(--esds-ease), box-shadow 0.3s var(--esds-ease);
    display: flex;
    flex-direction: column;
}
.ms__deserve-card::after {
    content: '';
    position: absolute;
    top: 50%;
    right: -12px;
    transform: translateY(-50%);
    width: 0; height: 0;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: 8px solid var(--highlight-blue);
    opacity: 0.4;
    z-index: 1;
}
.ms__deserve-card:last-child::after { display: none; }
.ms__deserve-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 40px rgba(10, 22, 40, 0.10);
}
.ms__deserve-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 38px;
    font-weight: 800;
    letter-spacing: -2px;
    line-height: 1;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: 18px;
}
.ms__deserve-title {
    font-size: 16px;
    font-weight: 800;
    color: var(--esds-navy);
    line-height: 1.3;
    margin: 0 0 12px;
    letter-spacing: -0.3px;
}
.ms__deserve-text {
    font-size: 13.5px;
    color: var(--esds-gray-600);
    line-height: 1.6;
    margin: 0;
}
@media (max-width: 992px) { .ms__deserves { grid-template-columns: repeat(2, 1fr); } .ms__deserve-card::after { display: none; } }
@media (max-width: 540px) { .ms__deserves { grid-template-columns: 1fr; } }


/* ───────────────────────────────────────────────────────────────────────────
   §G · TESTIMONIAL CHAT — Avatar gradients (override §51 base)
   ─────────────────────────────────────────────────────────────────────────── */
.testimonial-card__avatar--g1 { background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light)); }
.testimonial-card__avatar--g2 { background: linear-gradient(135deg, var(--india-green), #4ade80); }
.testimonial-card__avatar--g3 { background: linear-gradient(135deg, var(--india-saffron), #fbbf24); }

/* ═══════════════════════════════════════════════════════════════════════════
   GLOBAL UTILITIES — additional sec utility classes used in this page
   ═══════════════════════════════════════════════════════════════════════════ */
.sec--tight { padding: 80px 0; }
.sec-head--narrow { max-width: 680px; }
.sec-head--wide   { max-width: 880px; }



/* ═══════════════════════════════════════════════════════════════════════════
   APM · ENLIGHT GARUD — page-specific styles (apm__ prefix)
   Application Performance Monitoring · Observability platform
   ═══════════════════════════════════════════════════════════════════════════ */


/* ───────────────────────────────────────────────────────────────────────────
   §A · HERO — split layout: title+stats left / live-dashboard mockup right
   ─────────────────────────────────────────────────────────────────────────── */
.apm__hero {
    position: relative;
    padding: 64px 0 56px;
    overflow: hidden;
}
.apm__hero-grid {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 56px;
    align-items: center;
}

.apm__hero-brand {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 22px;
    padding: 6px 12px 6px 6px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(0, 97, 255, 0.30);
    border-radius: 999px;
}
.apm__hero-brand-logo {
    width: 28px; height: 28px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--india-saffron), #ffb84d);
    display: grid;
    place-items: center;
    color: #fff;
    font-family: var(--font-display);
    font-size: 14px;
    font-weight: 800;
    flex-shrink: 0;
}
.apm__hero-brand-text {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: #fff;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}
.apm__hero-brand-text small {
    color: var(--india-saffron);
    margin-left: 6px;
    font-size: 9.5px;
}

.apm__hero-title {
    font-size: clamp(32px, 4.6vw, 52px);
    font-weight: 800;
    color: #fff;
    letter-spacing: -1.4px;
    line-height: 1.08;
    margin: 0 0 18px;
}
.apm__hero-title em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.apm__hero-lede {
    font-size: 16px;
    color: var(--esds-gray-200);
    line-height: 1.65;
    max-width: 560px;
    margin: 0 0 28px;
}
.apm__hero-lede strong {
    color: #fff;
    font-weight: 700;
}

.apm__hero-ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 36px; }

/* 4 hero stats inline */
.apm__hero-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    padding-top: 28px;
    border-top: 1px solid rgba(255, 255, 255, 0.10);
}
.apm__hero-stat {
    padding: 0 14px 0 0;
    border-right: 1px solid rgba(255, 255, 255, 0.10);
}
.apm__hero-stat:last-child { border-right: 0; }
.apm__hero-stat-num {
    font-family: var(--font-display);
    font-size: clamp(22px, 2.4vw, 30px);
    font-weight: 800;
    background: linear-gradient(135deg, #fff, rgba(255, 255, 255, 0.65));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    letter-spacing: -0.8px;
    line-height: 1;
    margin: 0 0 6px;
}
.apm__hero-stat:nth-child(2) .apm__hero-stat-num,
.apm__hero-stat:nth-child(4) .apm__hero-stat-num {
    background: linear-gradient(135deg, var(--india-saffron), #ffb84d);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.apm__hero-stat-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.55);
    letter-spacing: 0.10em;
    text-transform: uppercase;
    line-height: 1.45;
    margin: 0;
}


/* RIGHT column — Live dashboard mockup */
.apm__dash {
    position: relative;
    background: #0a1628;
    border: 1px solid rgba(255, 255, 255, 0.10);
    border-radius: 14px;
    padding: 18px;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.40);
    overflow: hidden;
}
.apm__dash::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 20% 0%, rgba(0, 97, 255, 0.20), transparent 40%),
        radial-gradient(circle at 80% 100%, rgba(255, 153, 51, 0.10), transparent 50%);
    pointer-events: none;
}

/* Top alert bar */
.apm__dash-alert {
    position: relative;
    padding: 10px 14px;
    background: linear-gradient(90deg, rgba(220, 38, 38, 0.18), rgba(220, 38, 38, 0.04));
    border: 1px solid rgba(239, 68, 68, 0.40);
    border-radius: 8px;
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    color: #fecaca;
    z-index: 1;
}
.apm__dash-alert::before {
    content: '';
    width: 6px; height: 6px;
    background: #ef4444;
    border-radius: 50%;
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.30);
    animation: apm-blink 1.4s ease-in-out infinite;
    flex-shrink: 0;
}
@keyframes apm-blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.45; }
}
.apm__dash-alert-tag {
    padding: 2px 8px;
    background: rgba(239, 68, 68, 0.20);
    border-radius: 4px;
    font-weight: 800;
    letter-spacing: 0.10em;
    text-transform: uppercase;
    color: #fff;
    font-size: 9.5px;
}

/* Top metrics row — 3 cells */
.apm__dash-metrics {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin-bottom: 14px;
    position: relative;
    z-index: 1;
}
.apm__dash-metric {
    padding: 10px 12px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 8px;
}
.apm__dash-metric-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 8.5px;
    font-weight: 800;
    color: rgba(255, 255, 255, 0.50);
    letter-spacing: 0.10em;
    text-transform: uppercase;
    margin: 0 0 4px;
}
.apm__dash-metric-num {
    font-family: var(--font-display);
    font-size: 18px;
    font-weight: 800;
    color: #fff;
    line-height: 1;
    margin: 0;
    letter-spacing: -0.5px;
}
.apm__dash-metric:nth-child(1) .apm__dash-metric-num { color: var(--highlight-blue-light); }
.apm__dash-metric:nth-child(2) .apm__dash-metric-num { color: #fff; }
.apm__dash-metric:nth-child(3) .apm__dash-metric-num { color: #4ade80; }

/* Title strip */
.apm__dash-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px;
    background: rgba(0, 0, 0, 0.40);
    border-radius: 6px;
    margin-bottom: 12px;
    position: relative;
    z-index: 1;
}
.apm__dash-title-text {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: #fff;
    letter-spacing: 0.06em;
    margin: 0;
}
.apm__dash-title-live {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 2px 8px;
    background: rgba(34, 197, 94, 0.18);
    border-radius: 4px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9px;
    font-weight: 800;
    color: #4ade80;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}
.apm__dash-title-live::before {
    content: '';
    width: 5px; height: 5px;
    background: #4ade80;
    border-radius: 50%;
    box-shadow: 0 0 6px #4ade80;
    animation: apm-blink 1.6s ease-in-out infinite;
}

/* 4-cell stat grid */
.apm__dash-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
    margin-bottom: 14px;
    position: relative;
    z-index: 1;
}
.apm__dash-cell {
    padding: 10px 12px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 8px;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 4px 8px;
    align-items: baseline;
}
.apm__dash-cell-label {
    grid-column: 1 / -1;
    font-family: 'JetBrains Mono', monospace;
    font-size: 8.5px;
    font-weight: 800;
    color: rgba(255, 255, 255, 0.50);
    letter-spacing: 0.10em;
    text-transform: uppercase;
    margin: 0;
}
.apm__dash-cell-num {
    font-family: var(--font-display);
    font-size: 17px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.4px;
    line-height: 1;
    margin: 0;
}
.apm__dash-cell-trend {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: #4ade80;
    letter-spacing: 0.04em;
}
.apm__dash-cell-trend.is-down { color: #f87171; }
.apm__dash-cell-trend.is-flat { color: rgba(255, 255, 255, 0.55); }

/* Service rows */
.apm__dash-services {
    position: relative;
    z-index: 1;
    background: rgba(0, 0, 0, 0.20);
    border-radius: 8px;
    padding: 4px;
}
.apm__dash-service {
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: 12px;
    align-items: center;
    padding: 8px 12px;
    border-bottom: 1px dashed rgba(255, 255, 255, 0.06);
}
.apm__dash-service:last-child { border-bottom: 0; }
.apm__dash-service-name {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    color: #fff;
    margin: 0;
    letter-spacing: -0.1px;
}
.apm__dash-service-time {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: rgba(255, 255, 255, 0.85);
    letter-spacing: -0.2px;
}
.apm__dash-service-bar {
    display: inline-flex;
    gap: 2px;
}
.apm__dash-service-bar span {
    width: 6px; height: 12px;
    background: #4ade80;
    border-radius: 1px;
}
.apm__dash-service-bar span.is-empty {
    background: rgba(255, 255, 255, 0.12);
}
.apm__dash-service.is-warn .apm__dash-service-bar span:not(.is-empty) { background: #fbbf24; }
.apm__dash-service.is-crit .apm__dash-service-bar span:not(.is-empty) { background: #f87171; }
.apm__dash-service.is-crit .apm__dash-service-time { color: #f87171; }

@media (max-width: 992px) {
    .apm__hero-grid { grid-template-columns: 1fr; gap: 36px; }
    .apm__dash { max-width: 540px; margin: 0 auto; width: 100%; }
}
@media (max-width: 540px) {
    .apm__hero-stats { grid-template-columns: repeat(2, 1fr); gap: 20px 0; }
    .apm__hero-stat:nth-child(2) { border-right: 0; }
    .apm__hero-stat:nth-child(3) {
        border-top: 1px dashed rgba(255, 255, 255, 0.10);
        padding-top: 18px;
    }
    .apm__hero-stat:nth-child(4) {
        border-top: 1px dashed rgba(255, 255, 255, 0.10);
        padding-top: 18px;
    }
    .apm__dash-metrics { grid-template-columns: 1fr; }
    .apm__dash-grid { grid-template-columns: 1fr; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §B · TRUST MARQUEE — capability tags
   ─────────────────────────────────────────────────────────────────────────── */
.apm__trust {
    padding: 28px 0;
    background: var(--esds-gray-50);
    border-top: 1px solid var(--esds-gray-100);
    border-bottom: 1px solid var(--esds-gray-100);
    overflow: hidden;
    mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.apm__trust-track {
    display: flex;
    gap: 36px;
    animation: apm-trust-scroll 32s linear infinite;
    width: max-content;
    align-items: center;
}
@keyframes apm-trust-scroll {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}
.apm__trust:hover .apm__trust-track { animation-play-state: paused; }
.apm__trust-tag {
    flex-shrink: 0;
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    font-weight: 800;
    color: var(--esds-gray-700);
    letter-spacing: 0.04em;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    white-space: nowrap;
}
.apm__trust-tag::before {
    content: '✓';
    width: 18px; height: 18px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--india-saffron), #ffb84d);
    color: #fff;
    display: inline-grid;
    place-items: center;
    font-size: 10px;
    font-weight: 800;
    flex-shrink: 0;
}
.apm__trust-divider {
    width: 4px; height: 4px;
    background: var(--esds-gray-300);
    border-radius: 50%;
    flex-shrink: 0;
}


/* ───────────────────────────────────────────────────────────────────────────
   §C · STACK — supported tech logos (placeholder grid)
   ─────────────────────────────────────────────────────────────────────────── */
.apm__stack {
    padding: 64px 0;
    background: #fff;
}
.apm__stack-eyebrow {
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.20em;
    text-transform: uppercase;
    margin: 0 0 12px;
}
.apm__stack-head {
    text-align: center;
    font-size: clamp(26px, 3.6vw, 36px);
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.8px;
    line-height: 1.18;
    margin: 0 auto 36px;
    max-width: 720px;
}
.apm__stack-head em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.apm__stack-grid {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    gap: 0;
    border-top: 1px solid var(--esds-gray-100);
    border-left: 1px solid var(--esds-gray-100);
    border-radius: 16px;
    overflow: hidden;
}
.apm__stack-cell {
    aspect-ratio: 1.4 / 1;
    border-right: 1px solid var(--esds-gray-100);
    border-bottom: 1px solid var(--esds-gray-100);
    display: grid;
    place-items: center;
    padding: 14px;
    background: #fff;
    transition: all 0.3s var(--esds-ease);
}
.apm__stack-cell:hover {
    background: var(--esds-gray-50);
    transform: scale(1.04);
    z-index: 2;
    box-shadow: 0 8px 24px rgba(0, 97, 255, 0.10);
}
.apm__stack-img {
    width: 100%;
    height: 60%;
    object-fit: contain;
    filter: grayscale(0.4) opacity(0.85);
    transition: filter 0.3s;
}
.apm__stack-cell:hover .apm__stack-img { filter: grayscale(0) opacity(1); }

/* Placeholder for missing img — show name */
.apm__stack-ph {
    width: 100%;
    height: 100%;
    display: grid;
    place-items: center;
    text-align: center;
    background:
        linear-gradient(135deg, var(--esds-gray-50), #fff),
        radial-gradient(circle at center, transparent 60%, var(--esds-gray-100) 100%);
    border-radius: 8px;
    padding: 12px;
}
.apm__stack-ph-name {
    font-family: var(--font-display);
    font-size: 13px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.3px;
    line-height: 1.2;
    margin: 0;
}
.apm__stack-ph-tag {
    font-family: 'JetBrains Mono', monospace;
    font-size: 8px;
    font-weight: 700;
    color: var(--esds-gray-500);
    letter-spacing: 0.10em;
    text-transform: uppercase;
    margin-top: 4px;
}

@media (max-width: 992px) { .apm__stack-grid { grid-template-columns: repeat(6, 1fr); } }
@media (max-width: 768px) { .apm__stack-grid { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 480px) { .apm__stack-grid { grid-template-columns: repeat(3, 1fr); } }


/* ───────────────────────────────────────────────────────────────────────────
   §D · COMPROMISE NOTHING — dark split-spread with image placeholder
   ─────────────────────────────────────────────────────────────────────────── */
.apm__comp {
    padding: 80px 0;
    background: linear-gradient(180deg, var(--esds-navy) 0%, var(--esds-deep) 100%);
    color: #fff;
    position: relative;
    overflow: hidden;
}
.apm__comp::before {
    content: '';
    position: absolute;
    top: -80px; right: -80px;
    width: 400px; height: 400px;
    background: radial-gradient(circle, rgba(255, 153, 51, 0.10), transparent 70%);
    filter: blur(60px);
    pointer-events: none;
}
.apm__comp::after {
    content: '';
    position: absolute;
    bottom: -120px; left: -100px;
    width: 500px; height: 500px;
    background: radial-gradient(circle, rgba(0, 97, 255, 0.18), transparent 70%);
    filter: blur(80px);
    pointer-events: none;
}
.apm__comp-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 56px;
    align-items: center;
    position: relative;
    z-index: 1;
}
.apm__comp-eyebrow {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.20em;
    text-transform: uppercase;
    margin: 0 0 14px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}
.apm__comp-eyebrow::before {
    content: '';
    width: 24px; height: 1px;
    background: var(--india-saffron);
}
.apm__comp-title {
    font-size: clamp(28px, 3.8vw, 42px);
    font-weight: 800;
    color: #fff;
    letter-spacing: -1px;
    line-height: 1.15;
    margin: 0 0 18px;
}
.apm__comp-title em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.apm__comp-lede {
    font-size: 15.5px;
    color: rgba(255, 255, 255, 0.78);
    line-height: 1.7;
    margin: 0 0 32px;
}
.apm__comp-sub {
    font-size: 18px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.4px;
    margin: 0 0 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.10);
}
.apm__comp-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.apm__comp-item {
    display: grid;
    grid-template-columns: 28px 1fr;
    gap: 14px;
    align-items: start;
    padding: 14px 0;
    border-bottom: 1px dashed rgba(255, 255, 255, 0.10);
    font-size: 14px;
    color: rgba(255, 255, 255, 0.85);
    line-height: 1.6;
    transition: padding-left 0.3s var(--esds-ease);
}
.apm__comp-item:last-child { border-bottom: 0; }
.apm__comp-item:hover { padding-left: 8px; }
.apm__comp-item::before {
    content: '✓';
    width: 22px; height: 22px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--india-saffron), #ffb84d);
    color: #fff;
    display: inline-grid;
    place-items: center;
    font-size: 12px;
    font-weight: 800;
    flex-shrink: 0;
    margin-top: 2px;
}
.apm__comp-item strong { color: #fff; font-weight: 700; }

/* Image placeholder zone */
.apm__comp-visual {
    position: relative;
    aspect-ratio: 1 / 1.05;
    border-radius: 18px;
    overflow: hidden;
    background: linear-gradient(135deg, #1e3a8a 0%, #0a1628 100%);
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.40);
}
.apm__comp-visual::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 30% 25%, rgba(0, 97, 255, 0.30), transparent 50%),
        radial-gradient(circle at 70% 75%, rgba(255, 153, 51, 0.18), transparent 55%);
}
.apm__comp-visual img {
    position: absolute;
    inset: 0;
    width: 100%; height: 100%;
    object-fit: cover;
}
.apm__comp-ph {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    text-align: center;
    padding: 32px;
}
.apm__comp-ph-icon {
    width: 88px; height: 88px;
    border-radius: 22px;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    display: grid;
    place-items: center;
    box-shadow: 0 16px 40px rgba(0, 97, 255, 0.40);
    margin: 0 auto 20px;
}
.apm__comp-ph-icon svg { width: 44px; height: 44px; }
.apm__comp-ph-tag {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin: 0 0 6px;
}
.apm__comp-ph-text {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.65);
    line-height: 1.5;
    margin: 0;
}
.apm__comp-ph-text strong { color: #fff; font-weight: 700; }

/* Tricolor frame stripe top right of placeholder */
.apm__comp-visual::after {
    content: '';
    position: absolute;
    top: 14px; right: 14px;
    width: 56px; height: 4px;
    background: linear-gradient(90deg,
        var(--india-saffron) 33%, #fff 33% 66%, var(--india-green) 66%);
    border-radius: 2px;
    z-index: 2;
}

@media (max-width: 880px) {
    .apm__comp-grid { grid-template-columns: 1fr; gap: 40px; }
    .apm__comp-visual { aspect-ratio: 4 / 3; max-width: 480px; margin: 0 auto; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §E · NINE DOMAINS — numbered open rows, no boxes
   ─────────────────────────────────────────────────────────────────────────── */
.apm__nine {
    padding: 88px 0;
    background: #fff;
}
.apm__nine-eyebrow {
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.20em;
    text-transform: uppercase;
    margin: 0 0 14px;
}
.apm__nine-head {
    text-align: center;
    font-size: clamp(28px, 4vw, 42px);
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -1px;
    line-height: 1.15;
    margin: 0 auto 56px;
    max-width: 880px;
}
.apm__nine-head em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.apm__nine-list {
    list-style: none;
    margin: 0;
    padding: 0;
    counter-reset: apm-nine;
    max-width: 1080px;
    margin-left: auto;
    margin-right: auto;
}
.apm__nine-row {
    display: grid;
    grid-template-columns: 60px 80px 1fr;
    gap: 24px;
    align-items: start;
    padding: 32px 0;
    border-bottom: 1px solid var(--esds-gray-100);
    counter-increment: apm-nine;
    transition: padding-left 0.3s var(--esds-ease);
}
.apm__nine-row:last-child { border-bottom: 0; }
.apm__nine-row:hover { padding-left: 8px; }
.apm__nine-num {
    font-family: var(--font-display);
    font-size: 32px;
    font-weight: 800;
    line-height: 1;
    background: linear-gradient(135deg, var(--india-saffron), #ffb84d);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    letter-spacing: -1px;
    padding-top: 4px;
}
.apm__nine-num::before {
    content: counter(apm-nine, decimal-leading-zero);
}
.apm__nine-row:nth-child(even) .apm__nine-num {
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.apm__nine-icon {
    width: 64px; height: 64px;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--esds-navy), var(--esds-deep));
    color: var(--highlight-blue-light);
    display: grid;
    place-items: center;
    flex-shrink: 0;
}
.apm__nine-icon svg { width: 30px; height: 30px; }
.apm__nine-row:nth-child(even) .apm__nine-icon {
    background: linear-gradient(135deg, var(--india-saffron), #ffb84d);
    color: #fff;
}
.apm__nine-text { padding-top: 4px; }
.apm__nine-tag {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--esds-gray-500);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin: 0 0 8px;
}
.apm__nine-title {
    font-size: 22px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.5px;
    line-height: 1.25;
    margin: 0 0 12px;
}
.apm__nine-title em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.apm__nine-desc {
    font-size: 14.5px;
    color: var(--esds-gray-700);
    line-height: 1.7;
    margin: 0;
}
.apm__nine-desc strong { color: var(--esds-navy); font-weight: 700; }

@media (max-width: 660px) {
    .apm__nine-row { grid-template-columns: 50px 1fr; gap: 16px; padding: 22px 0; }
    .apm__nine-icon { grid-column: 1 / 2; grid-row: 2; width: 50px; height: 50px; }
    .apm__nine-icon svg { width: 22px; height: 22px; }
    .apm__nine-text { grid-column: 1 / -1; grid-row: 3; }
    .apm__nine-title { font-size: 18px; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §F · 3 PRINCIPLES — magazine column layout with massive typography
   ─────────────────────────────────────────────────────────────────────────── */
.apm__princ {
    padding: 88px 0;
    background: var(--esds-gray-50);
}
.apm__princ-eyebrow {
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.20em;
    text-transform: uppercase;
    margin: 0 0 14px;
}
.apm__princ-head {
    text-align: center;
    font-size: clamp(28px, 4vw, 42px);
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -1px;
    line-height: 1.15;
    margin: 0 auto 64px;
    max-width: 880px;
}
.apm__princ-head em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.apm__princ-cols {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    border-top: 1px solid var(--esds-gray-200);
    border-bottom: 1px solid var(--esds-gray-200);
}
.apm__princ-col {
    padding: 36px 28px;
    border-right: 1px solid var(--esds-gray-200);
    position: relative;
}
.apm__princ-col:last-child { border-right: 0; }
.apm__princ-col-num {
    font-family: var(--font-display);
    font-size: clamp(60px, 7vw, 88px);
    font-weight: 800;
    line-height: 0.85;
    letter-spacing: -3px;
    margin: 0 0 18px;
    background: linear-gradient(135deg, var(--india-saffron), #ffb84d);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    opacity: 0.7;
}
.apm__princ-col:nth-child(2) .apm__princ-col-num {
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.apm__princ-col:nth-child(3) .apm__princ-col-num {
    background: linear-gradient(135deg, var(--india-green), #22c55e);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.apm__princ-col-title {
    font-size: 22px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.5px;
    line-height: 1.2;
    margin: 0 0 14px;
    padding-bottom: 12px;
    border-bottom: 2px solid var(--india-saffron);
    display: inline-block;
}
.apm__princ-col:nth-child(2) .apm__princ-col-title { border-bottom-color: var(--highlight-blue); }
.apm__princ-col:nth-child(3) .apm__princ-col-title { border-bottom-color: var(--india-green); }
.apm__princ-col-title em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.apm__princ-col-desc {
    font-size: 14px;
    color: var(--esds-gray-700);
    line-height: 1.7;
    margin: 0;
}
.apm__princ-col-desc strong { color: var(--esds-navy); font-weight: 700; }

@media (max-width: 880px) {
    .apm__princ-cols { grid-template-columns: 1fr; }
    .apm__princ-col { border-right: 0; border-bottom: 1px solid var(--esds-gray-200); }
    .apm__princ-col:last-child { border-bottom: 0; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §G · GARUDA QUOTE — pull-quote layout with eagle silhouette placeholder
   ─────────────────────────────────────────────────────────────────────────── */
.apm__quote {
    padding: 96px 0;
    background: linear-gradient(135deg, #0a1628 0%, #1e3a8a 50%, #0a1628 100%);
    color: #fff;
    position: relative;
    overflow: hidden;
}
.apm__quote::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 20% 30%, rgba(255, 153, 51, 0.12), transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(0, 97, 255, 0.18), transparent 50%);
}
.apm__quote-content {
    position: relative;
    z-index: 1;
    max-width: 940px;
    margin: 0 auto;
    text-align: center;
}

/* Garuda silhouette placeholder */
.apm__quote-icon {
    width: 88px; height: 88px;
    margin: 0 auto 28px;
    border-radius: 50%;
    background:
        radial-gradient(circle, rgba(255, 153, 51, 0.25), transparent 70%),
        rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 153, 51, 0.40);
    display: grid;
    place-items: center;
    color: var(--india-saffron);
    position: relative;
}
.apm__quote-icon::before {
    content: '';
    position: absolute;
    inset: -8px;
    border: 1px dashed rgba(255, 153, 51, 0.30);
    border-radius: 50%;
    animation: apm-rot 22s linear infinite;
}
@keyframes apm-rot { to { transform: rotate(360deg); } }
.apm__quote-icon svg { width: 48px; height: 48px; position: relative; z-index: 1; }

.apm__quote-text {
    font-size: clamp(22px, 3.2vw, 36px);
    font-weight: 600;
    color: #fff;
    letter-spacing: -0.6px;
    line-height: 1.35;
    margin: 0 0 20px;
}
.apm__quote-text em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.apm__quote-attr {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.16em;
    text-transform: uppercase;
}
.apm__quote-attr::before,
.apm__quote-attr::after {
    content: '';
    width: 36px; height: 1px;
    background: var(--india-saffron);
    opacity: 0.5;
}


/* ───────────────────────────────────────────────────────────────────────────
   §H · ROADMAP — quarterly horizontal timeline
   ─────────────────────────────────────────────────────────────────────────── */
.apm__road {
    padding: 88px 0;
    background: #fff;
}
.apm__road-eyebrow {
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.20em;
    text-transform: uppercase;
    margin: 0 0 14px;
}
.apm__road-head {
    text-align: center;
    font-size: clamp(28px, 4vw, 42px);
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -1px;
    line-height: 1.15;
    margin: 0 auto 14px;
    max-width: 880px;
}
.apm__road-head em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.apm__road-sub {
    text-align: center;
    font-size: 15px;
    color: var(--esds-gray-700);
    line-height: 1.65;
    margin: 0 auto 56px;
    max-width: 720px;
}
.apm__road-sub strong { color: var(--esds-navy); font-weight: 700; }

.apm__road-track {
    position: relative;
    max-width: 1080px;
    margin: 0 auto;
    padding-left: 32px;
}
.apm__road-track::before {
    content: '';
    position: absolute;
    left: 9px;
    top: 24px; bottom: 24px;
    width: 2px;
    background: linear-gradient(180deg,
        var(--india-green) 0%, var(--india-green) 16%,
        var(--india-saffron) 50%,
        var(--highlight-blue) 84%, var(--highlight-blue) 100%);
}
.apm__road-step {
    position: relative;
    padding: 24px 0 24px 36px;
    border-bottom: 1px dashed var(--esds-gray-100);
    transition: padding-left 0.3s var(--esds-ease);
}
.apm__road-step:last-child { border-bottom: 0; }
.apm__road-step:hover { padding-left: 44px; }
.apm__road-step::before {
    content: '';
    position: absolute;
    left: -29px; top: 30px;
    width: 18px; height: 18px;
    border-radius: 50%;
    background: var(--esds-gray-200);
    border: 4px solid #fff;
    box-shadow: 0 0 0 2px var(--esds-gray-200);
}
.apm__road-step:nth-child(1)::before { background: var(--india-green); box-shadow: 0 0 0 2px var(--india-green), 0 6px 16px rgba(19, 136, 8, 0.30); }
.apm__road-step:nth-child(2)::before { background: var(--india-saffron); box-shadow: 0 0 0 2px var(--india-saffron), 0 6px 16px rgba(255, 153, 51, 0.30); }
.apm__road-step:nth-child(3)::before { background: var(--india-saffron); box-shadow: 0 0 0 2px var(--india-saffron), 0 6px 16px rgba(255, 153, 51, 0.30); }
.apm__road-step:nth-child(4)::before { background: var(--highlight-blue); box-shadow: 0 0 0 2px var(--highlight-blue), 0 6px 16px rgba(0, 97, 255, 0.30); }

.apm__road-quarter {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 4px 10px;
    background: var(--esds-gray-50);
    border: 1px solid var(--esds-gray-100);
    border-radius: 4px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--esds-gray-700);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 12px;
}
.apm__road-step:nth-child(1) .apm__road-quarter {
    background: rgba(19, 136, 8, 0.08);
    border-color: rgba(19, 136, 8, 0.30);
    color: var(--india-green);
}
.apm__road-step:nth-child(1) .apm__road-quarter::after {
    content: '· LIVE';
    color: var(--india-green);
    font-weight: 800;
}
.apm__road-name {
    font-size: 19px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.4px;
    line-height: 1.3;
    margin: 0 0 8px;
}
.apm__road-name em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.apm__road-text {
    font-size: 14.5px;
    color: var(--esds-gray-700);
    line-height: 1.7;
    margin: 0;
    max-width: 760px;
}
.apm__road-text strong { color: var(--esds-navy); font-weight: 700; }


/* ───────────────────────────────────────────────────────────────────────────
   §I · COMPARISON TABLE
   ─────────────────────────────────────────────────────────────────────────── */
.apm__cmp {
    padding: 88px 0;
    background: var(--esds-gray-50);
}
.apm__cmp-eyebrow {
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.20em;
    text-transform: uppercase;
    margin: 0 0 14px;
}
.apm__cmp-head {
    text-align: center;
    font-size: clamp(26px, 3.6vw, 38px);
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.8px;
    line-height: 1.18;
    margin: 0 auto 14px;
    max-width: 760px;
}
.apm__cmp-head em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.apm__cmp-scroll-hint {
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    color: var(--esds-gray-500);
    letter-spacing: 0.10em;
    text-transform: uppercase;
    margin: 0 0 28px;
    display: none;
}
@media (max-width: 768px) { .apm__cmp-scroll-hint { display: block; } }

.apm__cmp-wrap {
    max-width: 1080px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 16px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    box-shadow: 0 12px 36px rgba(10, 22, 40, 0.06);
}
.apm__cmp-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 640px;
}
.apm__cmp-table th,
.apm__cmp-table td {
    padding: 14px 24px;
    text-align: left;
    border-bottom: 1px solid var(--esds-gray-100);
}
.apm__cmp-table th {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--esds-gray-500);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    background: var(--esds-gray-50);
}
.apm__cmp-table th.apm__cmp-th-garud {
    color: var(--india-saffron);
    background: rgba(255, 153, 51, 0.06);
    text-align: center;
}
.apm__cmp-table th.apm__cmp-th-other {
    text-align: center;
}
.apm__cmp-table tr.apm__cmp-section td {
    background: var(--esds-navy);
    color: #fff;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    padding: 10px 24px;
}
.apm__cmp-table tr.apm__cmp-section td::before {
    content: '◆ ';
    color: var(--india-saffron);
    margin-right: 6px;
}
.apm__cmp-table td.apm__cmp-feat {
    font-size: 13.5px;
    font-weight: 700;
    color: var(--esds-navy);
    letter-spacing: -0.2px;
}
.apm__cmp-table td.apm__cmp-cell {
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    font-weight: 700;
}
.apm__cmp-table td.apm__cmp-yes {
    color: var(--india-green);
}
.apm__cmp-table td.apm__cmp-yes-detail {
    color: var(--esds-navy);
}
.apm__cmp-table td.apm__cmp-no {
    color: #dc2626;
}
.apm__cmp-table td.apm__cmp-partial {
    color: #f59e0b;
}
.apm__cmp-table td.apm__cmp-cell .apm__cmp-tick,
.apm__cmp-table td.apm__cmp-cell .apm__cmp-cross,
.apm__cmp-table td.apm__cmp-cell .apm__cmp-tilde {
    display: inline-grid;
    place-items: center;
    width: 18px; height: 18px;
    border-radius: 50%;
    font-size: 11px;
    font-weight: 800;
    margin-right: 4px;
}
.apm__cmp-table td.apm__cmp-cell .apm__cmp-tick {
    background: rgba(19, 136, 8, 0.12);
    color: var(--india-green);
}
.apm__cmp-table td.apm__cmp-cell .apm__cmp-cross {
    background: rgba(220, 38, 38, 0.10);
    color: #dc2626;
}
.apm__cmp-table td.apm__cmp-cell .apm__cmp-tilde {
    background: rgba(245, 158, 11, 0.12);
    color: #d97706;
}
.apm__cmp-table tr:last-child td { border-bottom: 0; }
.apm__cmp-table tr:hover td:not([class*="apm__cmp-section"]) {
    background: rgba(0, 97, 255, 0.02);
}


/* ───────────────────────────────────────────────────────────────────────────
   §J · CLOSING CTA — connecting-the-dots motif
   ─────────────────────────────────────────────────────────────────────────── */
.apm__close {
    padding: 88px 0 96px;
    background: linear-gradient(180deg, var(--esds-navy) 0%, var(--esds-deep) 100%);
    color: #fff;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.apm__close::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 25% 30%, rgba(0, 97, 255, 0.20), transparent 50%),
        radial-gradient(circle at 75% 70%, rgba(255, 153, 51, 0.12), transparent 50%);
    pointer-events: none;
}
.apm__close-content {
    position: relative;
    z-index: 1;
    max-width: 820px;
    margin: 0 auto;
}
.apm__close-eyebrow {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.20em;
    text-transform: uppercase;
    margin: 0 0 14px;
}
.apm__close-head {
    font-size: clamp(28px, 4.4vw, 48px);
    font-weight: 800;
    color: #fff;
    letter-spacing: -1.2px;
    line-height: 1.15;
    margin: 0 auto 18px;
}
.apm__close-head em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.apm__close-sub {
    font-size: 16px;
    color: rgba(255, 255, 255, 0.78);
    line-height: 1.6;
    margin: 0 auto 32px;
}
.apm__close-meta {
    margin-top: 36px;
    padding-top: 24px;
    border-top: 1px solid rgba(255, 255, 255, 0.10);
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.50);
    letter-spacing: 0.12em;
    text-transform: uppercase;
}
.apm__close-meta span {
    color: var(--india-saffron);
    font-weight: 800;
    margin: 0 6px;
}


/* all policy Service_Level_Agreement */

  .sla-table {
            width: 100%;
            border-collapse: collapse;
            margin: 1rem 0;
            font-size: 0.9rem;
        }

        .sla-table th {
            background-color: #f3f4f6;
            color: #1f2937;
            font-weight: 600;
            text-align: left;
            padding: 12px;
            border: 1px solid #e5e7eb;
        }

        .sla-table td {
            padding: 12px;
            border: 1px solid #e5e7eb;
            color: #4b5563;
        }

        .sla-table tr:nth-child(even) {
            background-color: #fafafa;
        }

        .sidebar-sticky {
            position: sticky;
            top: 2rem;
            max-height: calc(100vh - 4rem);
            overflow-y: auto;
        }

        .highlight-box {
            border-left: 4px solid #2563eb;
            background-color: #eff6ff;
            padding: 1rem;
            margin: 1.5rem 0;
        }
		
		    .policy-table th {
            background-color: #f3f4f6;
            color: #1f2937;
            font-weight: 600;
            text-align: left;
            padding: 12px;
            border: 1px solid #e5e7eb;
        }

        .policy-table td {
            padding: 12px;
            border: 1px solid #e5e7eb;
            color: #4b5563;
        }

        .policy-table tr:nth-child(even) {
            background-color: #fafafa;
        }

        .sidebar-sticky {
            position: sticky;
            top: 2rem;
            max-height: calc(100vh - 4rem);
            overflow-y: auto;
        }

        .highlight-box {
            border-left: 4px solid #16a34a; /* Green highlight for Privacy */
            background-color: #f0fdf4;
            padding: 1rem;
            margin: 1.5rem 0;
        }
		
		.policy-table {
            width: 100%;
            border-collapse: collapse;
            margin: 1rem 0;
            font-size: 0.9rem;
        }

       

        .policy-table td {
            padding: 12px;
            border: 1px solid #e5e7eb;
            color: #4b5563;
        }

        .policy-table tr:nth-child(even) {
            background-color: #fafafa;
        }

        .sidebar-sticky {
            position: sticky;
            top: 2rem;
            max-height: calc(100vh - 4rem);
            overflow-y: auto;
        }

        .highlight-box {
            border-left: 4px solid #4f46e5; /* Indigo highlight for Billing */
            background-color: #eef2ff;
            padding: 1rem;
            margin: 1.5rem 0;
        }
				
               

        .policy-table td {
            padding: 12px;
            border: 1px solid #e5e7eb;
            color: #4b5563;
        }

        .policy-table tr:nth-child(even) {
            background-color: #fafafa;
        }

       

        .highlight-box {
            border-left: 4px solid #d97706; /* Amber highlight for Cookie Policy */
            background-color: #fffbeb;
            padding: 1rem;
            margin: 1.5rem 0;
        }
		
		

        .policy-table th {
            background-color: #f3f4f6;
            color: #1f2937;
            font-weight: 600;
            text-align: left;
            padding: 12px;
            border: 1px solid #e5e7eb;
        }

        .policy-table td {
            padding: 12px;
            border: 1px solid #e5e7eb;
            color: #4b5563;
        }

        .policy-table tr:nth-child(even) {
            background-color: #fafafa;
        }

       

        .highlight-box {
            border-left: 4px solid #0d9488; /* Teal highlight for TOS */
            background-color: #f0fdfa;
            padding: 1rem;
            margin: 1.5rem 0;
        }
		
/* all policy Service_Level_Agreement */





/* ═══════════════════════════════════════════════════════════════════════════
   PAM · PRIVILEGED ACCESS MANAGEMENT — page-specific styles (pam__ prefix)
   Insider threat mitigation · zero-trust · privileged credential governance
   ═══════════════════════════════════════════════════════════════════════════ */


/* ───────────────────────────────────────────────────────────────────────────
   §A · HERO — split with security visual + 60% breach statistic
   ─────────────────────────────────────────────────────────────────────────── */
.pam__hero-grid {
    display: grid;
    grid-template-columns: 1.15fr 1fr;
    gap: 56px;
    align-items: center;
}
.pam__hero-tag {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 6px 14px;
    background: rgba(220, 38, 38, 0.10);
    border: 1px solid rgba(220, 38, 38, 0.40);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: #fca5a5;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 22px;
}
.pam__hero-tag::before {
    content: '⚠';
    font-size: 12px;
    color: #ef4444;
}
.pam__hero-title em.pam__shield {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.pam__hero-stat-strip {
    margin-top: 32px;
    padding-top: 28px;
    border-top: 1px solid rgba(255, 255, 255, 0.10);
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 22px;
    align-items: center;
}
.pam__hero-stat-num {
    font-family: var(--font-display);
    font-size: clamp(48px, 6vw, 72px);
    font-weight: 800;
    line-height: 0.9;
    background: linear-gradient(135deg, #ef4444, #fca5a5);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    letter-spacing: -2px;
    margin: 0;
}
.pam__hero-stat-text {
    font-size: 13px;
    color: rgba(255, 255, 255, 0.78);
    line-height: 1.6;
    margin: 0;
}
.pam__hero-stat-text strong { color: #fff; font-weight: 700; }
.pam__hero-stat-divider {
    width: 1px;
    height: 56px;
    background: linear-gradient(180deg, transparent, rgba(255, 255, 255, 0.20), transparent);
}

/* RIGHT — security shield visual */
.pam__hero-visual {
    position: relative;
    aspect-ratio: 1 / 1;
    max-width: 460px;
    margin: 0 auto;
    border-radius: 22px;
    overflow: hidden;
    background:
        radial-gradient(circle at 35% 30%, rgba(220, 38, 38, 0.20), transparent 50%),
        radial-gradient(circle at 65% 70%, rgba(0, 97, 255, 0.20), transparent 55%),
        linear-gradient(135deg, #1e3a8a 0%, var(--esds-navy) 100%);
    border: 1px solid rgba(255, 255, 255, 0.10);
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.45);
}
.pam__hero-visual::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(0deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px);
    background-size: 40px 40px;
    background-position: -1px -1px;
    pointer-events: none;
}
.pam__hero-visual::after {
    /* Tricolor accent */
    content: '';
    position: absolute;
    top: 16px; right: 16px;
    width: 60px; height: 4px;
    background: linear-gradient(90deg, var(--india-saffron) 33%, #fff 33% 66%, var(--india-green) 66%);
    border-radius: 2px;
    z-index: 3;
}
.pam__hero-visual img {
    position: absolute;
    inset: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    z-index: 2;
}
.pam__hero-visual-ph {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    text-align: center;
    padding: 32px;
    z-index: 1;
}
.pam__hero-shield {
    width: 140px; height: 140px;
    margin: 0 auto 20px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    display: grid;
    place-items: center;
    box-shadow: 0 20px 50px rgba(0, 97, 255, 0.45);
    position: relative;
}
.pam__hero-shield::before {
    content: '';
    position: absolute;
    inset: -10px;
    border: 2px dashed rgba(255, 153, 51, 0.45);
    border-radius: 50%;
    animation: pam-spin 22s linear infinite;
}
.pam__hero-shield::after {
    content: '';
    position: absolute;
    inset: -22px;
    border: 1px dashed rgba(0, 97, 255, 0.30);
    border-radius: 50%;
    animation: pam-spin 30s linear infinite reverse;
}
@keyframes pam-spin { to { transform: rotate(360deg); } }
.pam__hero-shield svg { width: 64px; height: 64px; position: relative; z-index: 1; }

.pam__hero-visual-tag {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin: 0 0 6px;
}
.pam__hero-visual-text {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.80);
    font-weight: 700;
    line-height: 1.5;
    margin: 0;
}
.pam__hero-visual-text small {
    display: block;
    margin-top: 6px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.40);
    letter-spacing: 0.10em;
}

@media (max-width: 992px) {
    .pam__hero-grid { grid-template-columns: 1fr; gap: 36px; }
    .pam__hero-visual { max-width: 380px; }
}
@media (max-width: 540px) {
    .pam__hero-stat-strip { grid-template-columns: 1fr; gap: 8px; text-align: center; }
    .pam__hero-stat-divider { display: none; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §B · PAM INTRO — text + 3 governance icons in horizontal hairline row
   ─────────────────────────────────────────────────────────────────────────── */
.pam__intro-eyebrow {
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.20em;
    text-transform: uppercase;
    margin: 0 0 14px;
}
.pam__intro-head {
    text-align: center;
    font-size: clamp(28px, 4vw, 42px);
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -1px;
    line-height: 1.15;
    margin: 0 auto 16px;
    max-width: 820px;
}
.pam__intro-head em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.pam__intro-question {
    text-align: center;
    font-size: 17px;
    color: var(--esds-navy);
    font-weight: 700;
    line-height: 1.5;
    margin: 0 auto 18px;
    max-width: 780px;
    font-style: italic;
}
.pam__intro-text {
    text-align: center;
    font-size: 15.5px;
    color: var(--esds-gray-700);
    line-height: 1.75;
    margin: 0 auto 56px;
    max-width: 880px;
}
.pam__intro-text strong { color: var(--esds-navy); font-weight: 700; }
.pam__intro-text em {
    font-style: normal;
    color: #dc2626;
    font-weight: 800;
}

.pam__intro-trio {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 0;
    border-top: 1px solid var(--esds-gray-100);
    border-bottom: 1px solid var(--esds-gray-100);
    margin-bottom: 36px;
}
.pam__intro-cell {
    padding: 36px 28px;
    border-right: 1px solid var(--esds-gray-100);
    transition: background 0.3s var(--esds-ease);
    position: relative;
}
.pam__intro-cell:last-child { border-right: 0; }
.pam__intro-cell:hover { background: rgba(0, 97, 255, 0.025); }
.pam__intro-cell::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 0; height: 2px;
    background: linear-gradient(90deg, var(--india-saffron), var(--highlight-blue));
    transition: width 0.4s var(--esds-ease);
}
.pam__intro-cell:hover::before { width: 100%; }

.pam__intro-icon {
    width: 64px; height: 64px;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--esds-navy), var(--esds-deep));
    color: var(--highlight-blue-light);
    display: grid;
    place-items: center;
    margin: 0 0 18px;
    transition: transform 0.4s var(--esds-ease);
}
.pam__intro-cell:hover .pam__intro-icon { transform: rotate(-6deg) scale(1.08); }
.pam__intro-cell:nth-child(2) .pam__intro-icon {
    background: linear-gradient(135deg, var(--india-saffron), #ffb84d);
    color: #fff;
}
.pam__intro-cell:nth-child(3) .pam__intro-icon {
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
}
.pam__intro-icon svg { width: 30px; height: 30px; }

.pam__intro-cell-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin: 0 0 8px;
}
.pam__intro-cell-title {
    font-size: 19px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.4px;
    line-height: 1.25;
    margin: 0 0 12px;
}
.pam__intro-cell-text {
    font-size: 14px;
    color: var(--esds-gray-700);
    line-height: 1.7;
    margin: 0;
}
.pam__intro-cell-text strong { color: var(--esds-navy); font-weight: 700; }

@media (max-width: 880px) {
    .pam__intro-trio { grid-template-columns: 1fr; }
    .pam__intro-cell { border-right: 0; border-bottom: 1px solid var(--esds-gray-100); }
    .pam__intro-cell:last-child { border-bottom: 0; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §C · STATS STRIP — 5 SOC metrics on dark stripe
   ─────────────────────────────────────────────────────────────────────────── */
.pam__stats {
    padding: 80px 0;
    background:
        linear-gradient(180deg, var(--esds-navy) 0%, var(--esds-deep) 100%);
    color: #fff;
    position: relative;
    overflow: hidden;
}
.pam__stats::before {
    content: '';
    position: absolute;
    top: -100px; right: -100px;
    width: 400px; height: 400px;
    background: radial-gradient(circle, rgba(0, 97, 255, 0.18), transparent 70%);
    filter: blur(60px);
    pointer-events: none;
}
.pam__stats::after {
    content: '';
    position: absolute;
    bottom: -120px; left: -100px;
    width: 460px; height: 460px;
    background: radial-gradient(circle, rgba(255, 153, 51, 0.10), transparent 70%);
    filter: blur(80px);
    pointer-events: none;
}
.pam__stats-eyebrow {
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.20em;
    text-transform: uppercase;
    margin: 0 0 14px;
    position: relative;
    z-index: 1;
}
.pam__stats-head {
    text-align: center;
    font-size: clamp(26px, 3.6vw, 36px);
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.8px;
    line-height: 1.2;
    margin: 0 auto 56px;
    max-width: 760px;
    position: relative;
    z-index: 1;
}
.pam__stats-head em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.pam__stats-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    position: relative;
    z-index: 1;
    padding: 32px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.10);
    border-bottom: 1px solid rgba(255, 255, 255, 0.10);
}
.pam__stats-cell {
    padding: 0 22px;
    text-align: center;
    border-right: 1px solid rgba(255, 255, 255, 0.10);
    transition: transform 0.3s var(--esds-ease);
}
.pam__stats-cell:last-child { border-right: 0; }
.pam__stats-cell:hover { transform: translateY(-4px); }
.pam__stats-num {
    font-family: var(--font-display);
    font-size: clamp(32px, 4.4vw, 52px);
    font-weight: 800;
    line-height: 1;
    margin: 0 0 10px;
    letter-spacing: -1.5px;
    background: linear-gradient(135deg, var(--india-saffron), #ffb84d);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.pam__stats-cell:nth-child(2) .pam__stats-num,
.pam__stats-cell:nth-child(4) .pam__stats-num {
    background: linear-gradient(135deg, var(--highlight-blue-light), #fff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.pam__stats-cell:nth-child(3) .pam__stats-num,
.pam__stats-cell:nth-child(5) .pam__stats-num {
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.pam__stats-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.55);
    letter-spacing: 0.06em;
    line-height: 1.55;
    margin: 0;
    text-transform: uppercase;
}

@media (max-width: 992px) {
    .pam__stats-grid { grid-template-columns: repeat(2, 1fr); gap: 32px 0; }
    .pam__stats-cell { border-right: 0; }
    .pam__stats-cell:nth-child(odd) { border-right: 1px solid rgba(255, 255, 255, 0.10); }
    .pam__stats-cell:nth-child(5) {
        grid-column: 1 / -1;
        border-top: 1px dashed rgba(255, 255, 255, 0.10);
        padding-top: 24px;
    }
}
@media (max-width: 540px) {
    .pam__stats-grid { grid-template-columns: 1fr; }
    .pam__stats-cell, .pam__stats-cell:nth-child(odd) { border-right: 0; border-bottom: 1px dashed rgba(255, 255, 255, 0.10); padding-bottom: 22px; }
    .pam__stats-cell:last-child { border-bottom: 0; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §D · WHY VERIFYING — 3 detailed open rows with watermark numbers
   ─────────────────────────────────────────────────────────────────────────── */
.pam__why-eyebrow {
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.20em;
    text-transform: uppercase;
    margin: 0 0 14px;
}
.pam__why-head {
    text-align: center;
    font-size: clamp(28px, 4vw, 40px);
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -1px;
    line-height: 1.15;
    margin: 0 auto 14px;
    max-width: 820px;
}
.pam__why-head em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.pam__why-sub {
    text-align: center;
    font-size: 15.5px;
    color: var(--esds-gray-700);
    line-height: 1.7;
    margin: 0 auto 64px;
    max-width: 820px;
}
.pam__why-sub strong { color: var(--esds-navy); font-weight: 700; }

.pam__why-list {
    list-style: none;
    margin: 0 auto;
    padding: 0;
    max-width: 1080px;
    counter-reset: pam-why;
}
.pam__why-row {
    display: grid;
    grid-template-columns: 110px 80px 1fr;
    gap: 28px;
    align-items: start;
    padding: 36px 0;
    border-bottom: 1px solid var(--esds-gray-100);
    counter-increment: pam-why;
    transition: padding-left 0.3s var(--esds-ease);
}
.pam__why-row:last-child { border-bottom: 0; }
.pam__why-row:hover { padding-left: 12px; }
.pam__why-num {
    font-family: var(--font-display);
    font-size: clamp(60px, 7vw, 92px);
    font-weight: 800;
    line-height: 0.85;
    background: linear-gradient(135deg, rgba(255, 153, 51, 0.18), rgba(255, 153, 51, 0.05));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    letter-spacing: -3px;
    user-select: none;
}
.pam__why-num::before {
    content: counter(pam-why, decimal-leading-zero);
}
.pam__why-row:nth-child(2) .pam__why-num {
    background: linear-gradient(135deg, rgba(0, 97, 255, 0.18), rgba(0, 97, 255, 0.05));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.pam__why-row:nth-child(3) .pam__why-num {
    background: linear-gradient(135deg, rgba(19, 136, 8, 0.18), rgba(19, 136, 8, 0.05));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.pam__why-icon {
    width: 64px; height: 64px;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--india-saffron), #ffb84d);
    color: #fff;
    display: grid;
    place-items: center;
    flex-shrink: 0;
}
.pam__why-row:nth-child(2) .pam__why-icon {
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
}
.pam__why-row:nth-child(3) .pam__why-icon {
    background: linear-gradient(135deg, var(--india-green), #22c55e);
}
.pam__why-icon svg { width: 30px; height: 30px; }

.pam__why-text { padding-top: 4px; }
.pam__why-title {
    font-size: 22px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.5px;
    line-height: 1.25;
    margin: 0 0 12px;
}
.pam__why-title em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.pam__why-desc {
    font-size: 14.5px;
    color: var(--esds-gray-700);
    line-height: 1.7;
    margin: 0;
}
.pam__why-desc strong { color: var(--esds-navy); font-weight: 700; }
.pam__why-tags {
    margin-top: 14px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.pam__why-tag {
    padding: 4px 10px;
    background: var(--esds-gray-50);
    border: 1px solid var(--esds-gray-100);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: var(--esds-gray-700);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

@media (max-width: 768px) {
    .pam__why-row { grid-template-columns: 70px 60px 1fr; gap: 18px; padding: 26px 0; }
    .pam__why-num { font-size: 56px; letter-spacing: -1.5px; }
    .pam__why-icon { width: 48px; height: 48px; }
    .pam__why-icon svg { width: 22px; height: 22px; }
    .pam__why-title { font-size: 17px; }
}
@media (max-width: 540px) {
    .pam__why-row { grid-template-columns: 50px 1fr; }
    .pam__why-icon { grid-column: 1 / 2; grid-row: 2; width: 40px; height: 40px; }
    .pam__why-icon svg { width: 18px; height: 18px; }
    .pam__why-text { grid-column: 1 / -1; grid-row: 3; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §E · WHY CRITICAL — text + image placeholder split
   ─────────────────────────────────────────────────────────────────────────── */
.pam__crit {
    background: var(--esds-gray-50);
}
.pam__crit-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 56px;
    align-items: center;
}
.pam__crit-eyebrow {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.20em;
    text-transform: uppercase;
    margin: 0 0 14px;
}
.pam__crit-head {
    font-size: clamp(26px, 3.6vw, 38px);
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.9px;
    line-height: 1.18;
    margin: 0 0 22px;
}
.pam__crit-head em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.pam__crit-text {
    font-size: 15px;
    color: var(--esds-gray-700);
    line-height: 1.8;
    margin: 0 0 18px;
}
.pam__crit-text strong { color: var(--esds-navy); font-weight: 700; }
.pam__crit-text em {
    font-style: normal;
    color: var(--highlight-blue);
    font-weight: 700;
}

/* Compliance pills */
.pam__crit-compliance {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 22px 0 28px;
    padding: 14px 0;
    border-top: 1px dashed var(--esds-gray-200);
    border-bottom: 1px dashed var(--esds-gray-200);
}
.pam__crit-compliance-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--esds-gray-500);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    width: 100%;
    margin: 0 0 8px;
}
.pam__crit-comp-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    background: #fff;
    border: 1.5px solid var(--esds-gray-200);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: 0.08em;
    transition: all 0.25s var(--esds-ease);
}
.pam__crit-comp-pill:hover {
    border-color: var(--india-saffron);
    background: rgba(255, 153, 51, 0.04);
    transform: translateY(-2px);
}
.pam__crit-comp-pill::before {
    content: '✓';
    width: 16px; height: 16px;
    border-radius: 50%;
    background: var(--india-green);
    color: #fff;
    display: inline-grid;
    place-items: center;
    font-size: 9px;
    font-weight: 800;
    flex-shrink: 0;
}

/* Image placeholder */
.pam__crit-visual {
    position: relative;
    aspect-ratio: 1 / 1.05;
    border-radius: 22px;
    overflow: hidden;
    background:
        radial-gradient(circle at 30% 25%, rgba(0, 97, 255, 0.20), transparent 50%),
        radial-gradient(circle at 70% 75%, rgba(255, 153, 51, 0.15), transparent 55%),
        linear-gradient(135deg, #1e3a8a, var(--esds-navy));
    box-shadow: 0 24px 60px rgba(10, 22, 40, 0.18);
}
.pam__crit-visual::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(0deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px);
    background-size: 32px 32px;
    pointer-events: none;
}
.pam__crit-visual::after {
    content: '';
    position: absolute;
    top: 14px; right: 14px;
    width: 56px; height: 4px;
    background: linear-gradient(90deg, var(--india-saffron) 33%, #fff 33% 66%, var(--india-green) 66%);
    border-radius: 2px;
    z-index: 3;
}
.pam__crit-visual img {
    position: absolute;
    inset: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    z-index: 2;
}
.pam__crit-ph {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    text-align: center;
    padding: 32px;
    z-index: 1;
    color: #fff;
}
.pam__crit-ph-icon {
    width: 96px; height: 96px;
    border-radius: 24px;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    display: grid;
    place-items: center;
    margin: 0 auto 22px;
    box-shadow: 0 16px 40px rgba(0, 97, 255, 0.40);
}
.pam__crit-ph-icon svg { width: 48px; height: 48px; }
.pam__crit-ph-tag {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin: 0 0 8px;
}
.pam__crit-ph-text {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.78);
    line-height: 1.55;
    margin: 0;
}
.pam__crit-ph-text strong { color: #fff; font-weight: 700; display: block; margin-bottom: 4px; }
.pam__crit-ph-text small {
    display: block;
    margin-top: 6px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    color: rgba(255, 255, 255, 0.40);
    letter-spacing: 0.10em;
}

@media (max-width: 880px) {
    .pam__crit-grid { grid-template-columns: 1fr; gap: 36px; }
    .pam__crit-visual { max-width: 460px; margin: 0 auto; aspect-ratio: 4 / 3; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §F · 14 BENEFITS — open list with hairline grid
   ─────────────────────────────────────────────────────────────────────────── */
.pam__ben {
    background: #fff;
}
.pam__ben-eyebrow {
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.20em;
    text-transform: uppercase;
    margin: 0 0 14px;
}
.pam__ben-head {
    text-align: center;
    font-size: clamp(28px, 4vw, 42px);
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -1px;
    line-height: 1.15;
    margin: 0 auto 56px;
    max-width: 820px;
}
.pam__ben-head em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.pam__ben-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0 60px;
    max-width: 1080px;
    margin: 0 auto;
    border-top: 1px solid var(--esds-gray-100);
    border-bottom: 1px solid var(--esds-gray-100);
    padding: 18px 0;
}
.pam__ben-row {
    display: grid;
    grid-template-columns: 40px 1fr 22px;
    gap: 16px;
    align-items: center;
    padding: 16px 0;
    border-bottom: 1px dashed var(--esds-gray-100);
    counter-increment: pam-ben;
    transition: padding-left 0.3s var(--esds-ease);
}
.pam__ben-grid { counter-reset: pam-ben; }
.pam__ben-row:nth-last-child(-n+2) { border-bottom: 0; }
.pam__ben-row:hover { padding-left: 8px; background: linear-gradient(90deg, rgba(0, 97, 255, 0.025), transparent); }
.pam__ben-num {
    font-family: var(--font-display);
    font-size: 17px;
    font-weight: 800;
    color: var(--india-saffron);
    line-height: 1;
    letter-spacing: -0.5px;
}
.pam__ben-num::before {
    content: counter(pam-ben, decimal-leading-zero);
}
.pam__ben-name {
    font-size: 14.5px;
    font-weight: 700;
    color: var(--esds-navy);
    letter-spacing: -0.2px;
    line-height: 1.3;
    margin: 0;
}
.pam__ben-name small {
    display: block;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 700;
    color: var(--esds-gray-500);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin-top: 3px;
}
.pam__ben-tick {
    width: 22px; height: 22px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--india-green), #22c55e);
    color: #fff;
    display: grid;
    place-items: center;
    flex-shrink: 0;
    font-size: 11px;
}
.pam__ben-tick svg { width: 11px; height: 11px; }

@media (max-width: 768px) {
    .pam__ben-grid { grid-template-columns: 1fr; gap: 0; }
    .pam__ben-row { padding: 14px 0; }
    .pam__ben-row:nth-last-child(-n+2) { border-bottom: 1px dashed var(--esds-gray-100); }
    .pam__ben-row:last-child { border-bottom: 0; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §G · OTHER SERVICES TABS — VTM / MSS / SOC / SOAR
   ─────────────────────────────────────────────────────────────────────────── */
.pam__svc {
    background: var(--esds-gray-50);
}
.pam__svc-eyebrow {
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.20em;
    text-transform: uppercase;
    margin: 0 0 14px;
}
.pam__svc-head {
    text-align: center;
    font-size: clamp(26px, 3.6vw, 36px);
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.8px;
    line-height: 1.2;
    margin: 0 auto 36px;
    max-width: 820px;
}
.pam__svc-head em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.pam__svc-tabs {
    display: flex;
    gap: 6px;
    margin-bottom: 36px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 4px;
    border-bottom: 1px solid var(--esds-gray-200);
    scrollbar-width: thin;
    max-width: 980px;
    margin-left: auto;
    margin-right: auto;
}
.pam__svc-tabs::-webkit-scrollbar { height: 4px; }
.pam__svc-tabs::-webkit-scrollbar-thumb { background: var(--esds-gray-200); border-radius: 2px; }

.pam__svc-tab {
    padding: 12px 20px;
    background: transparent;
    border: 0;
    border-bottom: 2px solid transparent;
    color: var(--esds-gray-700);
    font-family: inherit;
    font-size: 13.5px;
    font-weight: 700;
    letter-spacing: -0.1px;
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.2s var(--esds-ease);
    margin-bottom: -1px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}
.pam__svc-tab:hover { color: var(--india-saffron); }
.pam__svc-tab.is-active {
    color: var(--india-saffron);
    border-bottom-color: var(--india-saffron);
}
.pam__svc-tab-num {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    padding: 3px 8px;
    background: var(--esds-gray-200);
    color: var(--esds-gray-700);
    border-radius: 4px;
    letter-spacing: 0.10em;
}
.pam__svc-tab.is-active .pam__svc-tab-num {
    background: var(--india-saffron);
    color: #fff;
}

.pam__svc-pane {
    display: none;
    max-width: 980px;
    margin: 0 auto;
}
.pam__svc-pane.is-active {
    display: grid;
    grid-template-columns: 1fr 1.5fr;
    gap: 36px;
    align-items: start;
    animation: pam-fade 0.3s var(--esds-ease);
}
@keyframes pam-fade {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: translateY(0); }
}
.pam__svc-side {
    position: relative;
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 16px;
    padding: 28px 24px;
    box-shadow: 0 8px 28px rgba(10, 22, 40, 0.04);
}
.pam__svc-side-tag {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin: 0 0 10px;
}
.pam__svc-side-name {
    font-size: 24px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.6px;
    line-height: 1.2;
    margin: 0 0 18px;
    padding-bottom: 14px;
    border-bottom: 2px solid var(--india-saffron);
    display: inline-block;
}
.pam__svc-side-name em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.pam__svc-side-icon {
    width: 56px; height: 56px;
    border-radius: 14px;
    background: linear-gradient(135deg, var(--highlight-blue), var(--highlight-blue-light));
    color: #fff;
    display: grid;
    place-items: center;
    margin-bottom: 18px;
}
.pam__svc-side-icon svg { width: 28px; height: 28px; }
.pam__svc-bullets {
    list-style: none;
    margin: 0;
    padding: 0;
}
.pam__svc-bullets li {
    display: grid;
    grid-template-columns: 16px 1fr;
    gap: 10px;
    align-items: start;
    padding: 8px 0;
    font-size: 13px;
    color: var(--esds-gray-700);
    line-height: 1.5;
    border-bottom: 1px dashed var(--esds-gray-100);
}
.pam__svc-bullets li:last-child { border-bottom: 0; }
.pam__svc-bullets li::before {
    content: '◆';
    color: var(--india-saffron);
    font-size: 9px;
    margin-top: 2px;
}

.pam__svc-body p {
    font-size: 15px;
    color: var(--esds-gray-700);
    line-height: 1.85;
    margin: 0 0 16px;
}
.pam__svc-body p strong { color: var(--esds-navy); font-weight: 700; }
.pam__svc-body p em { font-style: italic; color: var(--highlight-blue); font-weight: 600; }

@media (max-width: 880px) {
    .pam__svc-pane.is-active { grid-template-columns: 1fr; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §H · CLOSING CTA — "Don't miss your peak"
   ─────────────────────────────────────────────────────────────────────────── */
.pam__close {
    padding: 88px 0 96px;
    background: linear-gradient(180deg, var(--esds-navy) 0%, var(--esds-deep) 100%);
    color: #fff;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.pam__close::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 25% 30%, rgba(220, 38, 38, 0.15), transparent 50%),
        radial-gradient(circle at 75% 70%, rgba(0, 97, 255, 0.20), transparent 50%);
    pointer-events: none;
}
.pam__close-content {
    position: relative;
    z-index: 1;
    max-width: 820px;
    margin: 0 auto;
}
.pam__close-eyebrow {
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.20em;
    text-transform: uppercase;
    margin: 0 0 14px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}
.pam__close-eyebrow::before,
.pam__close-eyebrow::after {
    content: '';
    width: 28px; height: 1px;
    background: var(--india-saffron);
    opacity: 0.5;
}
.pam__close-head {
    font-size: clamp(28px, 4.4vw, 48px);
    font-weight: 800;
    color: #fff;
    letter-spacing: -1.2px;
    line-height: 1.15;
    margin: 0 auto 18px;
}
.pam__close-head em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.pam__close-sub {
    font-size: 16px;
    color: rgba(255, 255, 255, 0.78);
    line-height: 1.6;
    margin: 0 auto 28px;
    max-width: 680px;
}
.pam__close-sub strong { color: #fff; font-weight: 700; }
.pam__close-meta {
    margin-top: 36px;
    padding-top: 22px;
    border-top: 1px solid rgba(255, 255, 255, 0.10);
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.55);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    line-height: 1.7;
}
.pam__close-meta span {
    color: var(--india-saffron);
    font-weight: 800;
    margin: 0 6px;
}
.pam__close-meta a {
    color: var(--highlight-blue-light);
    text-decoration: none;
    font-weight: 700;
}
.pam__close-meta a:hover { text-decoration: underline; }





/* ═══════════════════════════════════════════════════════════════════════════
   SCQ · SOVEREIGN CLOUD READINESS · SELF-AUDIT (scq__ prefix)
   Interactive 10-question quiz · single-question stage · animated transitions
   ═══════════════════════════════════════════════════════════════════════════ */


/* ───────────────────────────────────────────────────────────────────────────
   §A · HERO — quiz intro + rules
   ─────────────────────────────────────────────────────────────────────────── */
.scq__hero-grid {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 56px;
    align-items: center;
}
.scq__hero-tag {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 6px 14px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 153, 51, 0.30);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 22px;
}
.scq__hero-tag::before {
    content: '';
    width: 22px; height: 7px;
    background: linear-gradient(180deg,
        var(--india-saffron) 33%, #fff 33% 66%, var(--india-green) 66%);
    border-radius: 1.5px;
}
.scq__hero-title em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.scq__hero-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin: 22px 0 28px;
    padding: 14px 0;
    border-top: 1px dashed rgba(255, 255, 255, 0.20);
    border-bottom: 1px dashed rgba(255, 255, 255, 0.20);
}
.scq__hero-meta-item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.78);
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.scq__hero-meta-item strong { color: #fff; font-weight: 800; }
.scq__hero-meta-icon {
    width: 22px; height: 22px;
    border-radius: 50%;
    background: rgba(255, 153, 51, 0.18);
    color: var(--india-saffron);
    display: grid;
    place-items: center;
    flex-shrink: 0;
}
.scq__hero-meta-icon svg { width: 11px; height: 11px; }

.scq__hero-frameworks {
    margin-top: 24px;
}
.scq__hero-frameworks-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: rgba(255, 255, 255, 0.55);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin: 0 0 10px;
}
.scq__hero-frameworks-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.scq__hero-fw-pill {
    padding: 5px 12px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: #fff;
    letter-spacing: 0.06em;
}

/* RIGHT — Rules card */
.scq__hero-rules {
    position: relative;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.10);
    border-radius: 18px;
    padding: 32px 30px;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    overflow: hidden;
}
.scq__hero-rules::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 60px; height: 4px;
    background: linear-gradient(90deg,
        var(--india-saffron) 33%, #fff 33% 66%, var(--india-green) 66%);
    border-radius: 0 0 2px 2px;
}
.scq__hero-rules-eyebrow {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin: 0 0 12px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.scq__hero-rules-eyebrow::before {
    content: '◆';
    font-size: 9px;
}
.scq__hero-rules-title {
    font-size: 20px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.4px;
    line-height: 1.25;
    margin: 0 0 18px;
}
.scq__hero-rules-text {
    font-size: 13.5px;
    color: rgba(255, 255, 255, 0.75);
    line-height: 1.65;
    margin: 0 0 18px;
}
.scq__hero-rules-text strong { color: #fff; font-weight: 700; }
.scq__hero-rules-scoring {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 6px;
    padding-top: 18px;
    border-top: 1px dashed rgba(255, 255, 255, 0.15);
}
.scq__hero-rules-letter {
    text-align: center;
    padding: 10px 4px;
    background: rgba(255, 255, 255, 0.04);
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.08);
}
.scq__hero-rules-letter-key {
    font-family: var(--font-display);
    font-size: 22px;
    font-weight: 800;
    color: var(--india-saffron);
    line-height: 1;
    margin: 0 0 2px;
}
.scq__hero-rules-letter:nth-child(2) .scq__hero-rules-letter-key { color: var(--highlight-blue-light); }
.scq__hero-rules-letter:nth-child(3) .scq__hero-rules-letter-key { color: rgba(255, 255, 255, 0.85); }
.scq__hero-rules-letter:nth-child(4) .scq__hero-rules-letter-key { color: rgba(255, 255, 255, 0.55); }
.scq__hero-rules-letter-val {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: rgba(255, 255, 255, 0.55);
    letter-spacing: 0.10em;
}
.scq__hero-rules-letter-val strong {
    color: #fff;
    display: block;
    font-size: 13px;
    margin-bottom: 1px;
}

@media (max-width: 992px) {
    .scq__hero-grid { grid-template-columns: 1fr; gap: 36px; }
}
@media (max-width: 540px) {
    .scq__hero-rules-scoring { grid-template-columns: repeat(2, 1fr); }
}


/* ───────────────────────────────────────────────────────────────────────────
   §B · QUIZ STAGE — single-question card with transitions
   ─────────────────────────────────────────────────────────────────────────── */
.scq__quiz {
    padding: 56px 0 80px;
    background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
    min-height: 720px;
}

/* Top bar — progress + counter */
.scq__quiz-top {
    max-width: 980px;
    margin: 0 auto 24px;
    padding: 0 4px;
}
.scq__quiz-top-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--esds-gray-500);
    letter-spacing: 0.10em;
    text-transform: uppercase;
}
.scq__quiz-top-counter {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.scq__quiz-top-counter strong {
    font-family: var(--font-display);
    font-size: 16px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: -0.5px;
}
.scq__quiz-top-counter-divider {
    color: var(--esds-gray-300);
    margin: 0 2px;
}
.scq__quiz-top-counter-total {
    color: var(--esds-gray-500);
    font-family: var(--font-display);
    font-size: 14px;
    font-weight: 700;
}
.scq__quiz-top-score {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 5px 12px;
    background: rgba(0, 97, 255, 0.06);
    border: 1px solid rgba(0, 97, 255, 0.20);
    border-radius: 999px;
    color: var(--highlight-blue);
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
}
.scq__quiz-top-score-num {
    font-family: var(--font-display);
    font-size: 14px;
    font-weight: 800;
    letter-spacing: -0.3px;
}

/* Progress bar */
.scq__quiz-progress {
    height: 4px;
    background: var(--esds-gray-100);
    border-radius: 999px;
    overflow: hidden;
    position: relative;
}
.scq__quiz-progress-fill {
    height: 100%;
    width: 10%;
    background: linear-gradient(90deg, var(--india-saffron), var(--highlight-blue), var(--india-green));
    border-radius: 999px;
    transition: width 0.45s var(--esds-ease);
    position: relative;
}
.scq__quiz-progress-fill::after {
    content: '';
    position: absolute;
    top: -3px; right: -5px;
    width: 10px; height: 10px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid var(--india-saffron);
    box-shadow: 0 0 0 3px rgba(255, 153, 51, 0.25);
}

/* Stage card */
.scq__stage {
    max-width: 980px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid var(--esds-gray-100);
    border-radius: 22px;
    box-shadow: 0 24px 60px rgba(10, 22, 40, 0.06);
    position: relative;
    overflow: hidden;
}
.scq__stage::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 4px;
    background: linear-gradient(90deg,
        var(--india-saffron) 0%, var(--india-saffron) 33%,
        #fff 33%, #fff 66%,
        var(--india-green) 66%, var(--india-green) 100%);
    z-index: 1;
}

/* Question pane — only one visible at a time */
.scq__q {
    display: none;
    grid-template-columns: 220px 1fr;
    gap: 0;
    min-height: 540px;
}
.scq__q.is-active {
    display: grid;
    animation: scq-slide 0.5s var(--esds-ease) both;
}
@keyframes scq-slide {
    0%   { opacity: 0; transform: translateX(28px); }
    100% { opacity: 1; transform: translateX(0); }
}
.scq__q.is-leaving {
    display: grid;
    animation: scq-slide-out 0.32s var(--esds-ease) both;
    pointer-events: none;
}
@keyframes scq-slide-out {
    0%   { opacity: 1; transform: translateX(0); }
    100% { opacity: 0; transform: translateX(-28px); }
}

/* LEFT — illustration column */
.scq__q-illus {
    background: linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
    padding: 40px 28px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    border-right: 1px solid var(--esds-gray-100);
    position: relative;
    overflow: hidden;
}
.scq__q-illus::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 30% 30%, rgba(255, 153, 51, 0.08), transparent 55%),
        radial-gradient(circle at 70% 70%, rgba(0, 97, 255, 0.08), transparent 55%);
    pointer-events: none;
}
.scq__q-num {
    position: relative;
    z-index: 1;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.20em;
    text-transform: uppercase;
    margin: 0 0 14px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.scq__q-num::before, .scq__q-num::after {
    content: '';
    width: 18px; height: 1px;
    background: var(--india-saffron);
    opacity: 0.5;
}

.scq__q-icon {
    position: relative;
    z-index: 1;
    width: 110px;
    height: 110px;
    border-radius: 24px;
    background: linear-gradient(135deg, var(--esds-navy), var(--esds-deep));
    color: var(--highlight-blue-light);
    display: grid;
    place-items: center;
    box-shadow: 0 16px 40px rgba(0, 97, 255, 0.20);
    margin-bottom: 22px;
}
.scq__q-icon svg { width: 56px; height: 56px; }
.scq__q.is-active .scq__q-icon {
    animation: scq-icon-pop 0.7s var(--esds-ease) both;
}
@keyframes scq-icon-pop {
    0%   { opacity: 0; transform: scale(0.8) rotate(-6deg); }
    60%  { opacity: 1; transform: scale(1.06) rotate(2deg); }
    100% { opacity: 1; transform: scale(1) rotate(0); }
}

/* Alternate icon colors per question parity (saffron/blue/green rotation) */
.scq__q[data-qi="2"] .scq__q-icon,
.scq__q[data-qi="5"] .scq__q-icon,
.scq__q[data-qi="8"] .scq__q-icon {
    background: linear-gradient(135deg, var(--india-saffron), #ffb84d);
    color: #fff;
}
.scq__q[data-qi="3"] .scq__q-icon,
.scq__q[data-qi="6"] .scq__q-icon,
.scq__q[data-qi="9"] .scq__q-icon {
    background: linear-gradient(135deg, var(--india-green), #22c55e);
    color: #fff;
}

.scq__q-illus-tag {
    position: relative;
    z-index: 1;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: var(--esds-gray-500);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin: 0;
    line-height: 1.5;
}
.scq__q-illus-tag strong {
    display: block;
    color: var(--esds-navy);
    font-size: 11px;
    margin-bottom: 3px;
}

/* RIGHT — question + options */
.scq__q-content {
    padding: 40px 44px 36px;
    display: flex;
    flex-direction: column;
}
.scq__q-text {
    font-size: clamp(20px, 2.4vw, 26px);
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.5px;
    line-height: 1.3;
    margin: 0 0 22px;
}
.scq__q-text em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}

/* MCQ options */
.scq__opts {
    list-style: none;
    margin: 0;
    padding: 0;
    flex: 1;
}
.scq__opt {
    display: grid;
    grid-template-columns: 36px 1fr 22px;
    gap: 14px;
    align-items: center;
    padding: 14px 18px;
    margin-bottom: 8px;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 12px;
    background: #fff;
    cursor: pointer;
    transition: all 0.25s var(--esds-ease);
    font-family: inherit;
    width: 100%;
    text-align: left;
}
.scq__opt:last-child { margin-bottom: 0; }
.scq__opt:hover {
    border-color: rgba(0, 97, 255, 0.30);
    background: rgba(0, 97, 255, 0.02);
    transform: translateX(4px);
}
.scq__opt.is-selected {
    border-color: var(--india-saffron);
    background: linear-gradient(135deg, rgba(255, 153, 51, 0.06), rgba(0, 97, 255, 0.04));
    box-shadow: 0 8px 22px rgba(255, 153, 51, 0.10);
}
.scq__opt-letter {
    width: 36px; height: 36px;
    border-radius: 50%;
    background: var(--esds-gray-50);
    border: 1.5px solid var(--esds-gray-200);
    color: var(--esds-gray-700);
    display: grid;
    place-items: center;
    font-family: var(--font-display);
    font-size: 14px;
    font-weight: 800;
    flex-shrink: 0;
    transition: all 0.25s var(--esds-ease);
}
.scq__opt:hover .scq__opt-letter {
    border-color: var(--highlight-blue);
    color: var(--highlight-blue);
    background: rgba(0, 97, 255, 0.04);
}
.scq__opt.is-selected .scq__opt-letter {
    background: linear-gradient(135deg, var(--india-saffron), #ffb84d);
    border-color: var(--india-saffron);
    color: #fff;
    box-shadow: 0 4px 12px rgba(255, 153, 51, 0.30);
}
.scq__opt-text {
    font-size: 14px;
    color: var(--esds-gray-700);
    line-height: 1.55;
    letter-spacing: -0.1px;
    margin: 0;
}
.scq__opt-text strong { color: var(--esds-navy); font-weight: 700; }
.scq__opt.is-selected .scq__opt-text { color: var(--esds-navy); font-weight: 600; }
.scq__opt-tick {
    width: 22px; height: 22px;
    border-radius: 50%;
    background: var(--esds-gray-50);
    color: var(--esds-gray-300);
    display: grid;
    place-items: center;
    flex-shrink: 0;
    transition: all 0.25s var(--esds-ease);
    opacity: 0;
}
.scq__opt:hover .scq__opt-tick { opacity: 0.5; }
.scq__opt.is-selected .scq__opt-tick {
    opacity: 1;
    background: var(--india-saffron);
    color: #fff;
}
.scq__opt-tick svg { width: 11px; height: 11px; }

/* Score badge inside option (small, right-aligned) — shown after click */
.scq__opt-pts {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.10em;
    margin-left: 6px;
    opacity: 0;
    transition: opacity 0.3s;
}
.scq__opt.is-selected .scq__opt-pts { opacity: 1; }

/* Pager */
.scq__q-pager {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 24px;
    padding-top: 18px;
    border-top: 1px dashed var(--esds-gray-100);
}
.scq__q-pager-btn {
    padding: 10px 22px;
    border-radius: 999px;
    font-family: inherit;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: -0.1px;
    cursor: pointer;
    border: 1.5px solid;
    transition: all 0.25s var(--esds-ease);
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.scq__q-pager-btn--prev {
    background: #fff;
    border-color: var(--esds-gray-200);
    color: var(--esds-gray-700);
}
.scq__q-pager-btn--prev:hover:not(:disabled) {
    border-color: var(--esds-gray-700);
    color: var(--esds-navy);
    transform: translateX(-3px);
}
.scq__q-pager-btn--next {
    background: linear-gradient(135deg, var(--india-saffron), #ffb84d);
    border-color: transparent;
    color: #fff;
    box-shadow: 0 6px 18px rgba(255, 153, 51, 0.30);
}
.scq__q-pager-btn--next:hover:not(:disabled) {
    transform: translateX(3px) translateY(-1px);
    box-shadow: 0 10px 24px rgba(255, 153, 51, 0.40);
}
.scq__q-pager-btn--next:disabled,
.scq__q-pager-btn--prev:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}
.scq__q-pager-btn svg { width: 13px; height: 13px; }
.scq__q-pager-hint {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 700;
    color: var(--esds-gray-500);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

@media (max-width: 768px) {
    .scq__q.is-active, .scq__q.is-leaving { grid-template-columns: 1fr; min-height: 0; }
    .scq__q-illus { padding: 26px 20px; border-right: 0; border-bottom: 1px solid var(--esds-gray-100); }
    .scq__q-icon { width: 80px; height: 80px; }
    .scq__q-icon svg { width: 40px; height: 40px; }
    .scq__q-content { padding: 26px 22px 24px; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §C · RESULTS — score arc + band + advice
   ─────────────────────────────────────────────────────────────────────────── */
.scq__results {
    display: none;
    max-width: 980px;
    margin: 0 auto;
    padding: 56px 44px;
    animation: scq-fade 0.6s var(--esds-ease) both;
}
.scq__results.is-shown { display: block; }
@keyframes scq-fade {
    from { opacity: 0; transform: translateY(20px); }
    to   { opacity: 1; transform: translateY(0); }
}
.scq__results-grid {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 48px;
    align-items: center;
    margin-bottom: 36px;
}

/* Animated score arc */
.scq__results-arc-wrap {
    position: relative;
    width: 240px;
    height: 240px;
    margin: 0 auto;
}
.scq__results-arc {
    width: 100%; height: 100%;
    transform: rotate(-90deg);
}
.scq__results-arc-track {
    fill: none;
    stroke: var(--esds-gray-100);
    stroke-width: 14;
}
.scq__results-arc-fill {
    fill: none;
    stroke-width: 14;
    stroke-linecap: round;
    stroke-dasharray: 753.98;
    stroke-dashoffset: 753.98;
    transition: stroke-dashoffset 1.4s var(--esds-ease), stroke 0.4s;
    stroke: var(--india-saffron);
}
.scq__results.is-shown .scq__results-arc-fill {
    stroke-dashoffset: var(--scq-arc-offset, 753.98);
}
.scq__results-arc-center {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    text-align: center;
}
.scq__results-arc-num {
    font-family: var(--font-display);
    font-size: 64px;
    font-weight: 800;
    line-height: 0.9;
    background: linear-gradient(135deg, var(--india-saffron), #ffb84d);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    letter-spacing: -2px;
    margin: 0;
}
.scq__results-arc-num small {
    font-size: 0.4em;
    color: var(--esds-gray-500);
    background: none;
    -webkit-text-fill-color: var(--esds-gray-500);
    font-weight: 600;
}
.scq__results-arc-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--esds-gray-500);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin: 6px 0 0;
}

/* Band info */
.scq__results-band-eyebrow {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin: 0 0 10px;
}
.scq__results-band-name {
    font-size: clamp(28px, 3.6vw, 40px);
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -1px;
    line-height: 1.1;
    margin: 0 0 12px;
}
.scq__results-band-name em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}
.scq__results-band-range {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 5px 12px;
    background: var(--esds-gray-50);
    border: 1px solid var(--esds-gray-100);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--esds-gray-700);
    letter-spacing: 0.06em;
    margin-bottom: 16px;
}
.scq__results-band-desc {
    font-size: 15px;
    color: var(--esds-gray-700);
    line-height: 1.7;
    margin: 0;
}
.scq__results-band-desc strong { color: var(--esds-navy); font-weight: 700; }

/* All 4 band table */
.scq__results-table {
    margin-top: 32px;
    border-top: 1px dashed var(--esds-gray-200);
    padding-top: 28px;
}
.scq__results-table-head {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 800;
    color: var(--esds-gray-500);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin: 0 0 12px;
    text-align: center;
}
.scq__results-bands {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}
.scq__results-band-card {
    padding: 18px 16px;
    border: 1.5px solid var(--esds-gray-100);
    border-radius: 12px;
    transition: all 0.3s var(--esds-ease);
    position: relative;
}
.scq__results-band-card.is-current {
    border-color: var(--india-saffron);
    background: linear-gradient(135deg, rgba(255, 153, 51, 0.04), transparent);
    box-shadow: 0 8px 22px rgba(255, 153, 51, 0.08);
}
.scq__results-band-card.is-current::before {
    content: 'YOU ARE HERE';
    position: absolute;
    top: -10px; left: 50%;
    transform: translateX(-50%);
    background: var(--india-saffron);
    color: #fff;
    font-family: 'JetBrains Mono', monospace;
    font-size: 8.5px;
    font-weight: 800;
    letter-spacing: 0.14em;
    padding: 3px 8px;
    border-radius: 4px;
    white-space: nowrap;
}
.scq__results-band-card-range {
    font-family: var(--font-display);
    font-size: 18px;
    font-weight: 800;
    line-height: 1;
    margin: 0 0 6px;
    letter-spacing: -0.5px;
}
.scq__results-band-card[data-band="ready"] .scq__results-band-card-range { color: var(--india-green); }
.scq__results-band-card[data-band="mostly"] .scq__results-band-card-range { color: var(--highlight-blue); }
.scq__results-band-card[data-band="exposed"] .scq__results-band-card-range { color: var(--india-saffron); }
.scq__results-band-card[data-band="risk"] .scq__results-band-card-range { color: #dc2626; }
.scq__results-band-card-name {
    font-size: 13px;
    font-weight: 800;
    color: var(--esds-navy);
    letter-spacing: -0.2px;
    line-height: 1.25;
    margin: 0 0 6px;
}
.scq__results-band-card-text {
    font-size: 11.5px;
    color: var(--esds-gray-700);
    line-height: 1.5;
    margin: 0;
}

/* Reset action */
.scq__results-reset {
    text-align: center;
    margin-top: 28px;
}
.scq__results-reset button {
    background: transparent;
    border: 0;
    color: var(--esds-gray-500);
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.10em;
    text-transform: uppercase;
    cursor: pointer;
    transition: color 0.2s;
    text-decoration: underline;
    text-underline-offset: 4px;
    text-decoration-thickness: 1px;
}
.scq__results-reset button:hover { color: var(--india-saffron); }

@media (max-width: 768px) {
    .scq__results-grid { grid-template-columns: 1fr; gap: 24px; }
    .scq__results { padding: 40px 22px; }
    .scq__results-bands { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 540px) {
    .scq__results-bands { grid-template-columns: 1fr; }
}


/* ───────────────────────────────────────────────────────────────────────────
   §D · CTA — "Talk to a Sovereignty Architect"
   ─────────────────────────────────────────────────────────────────────────── */
.scq__cta {
    padding: 80px 0 72px;
    background: linear-gradient(180deg, var(--esds-navy) 0%, var(--esds-deep) 100%);
    color: #fff;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.scq__cta::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 25% 30%, rgba(255, 153, 51, 0.12), transparent 50%),
        radial-gradient(circle at 75% 70%, rgba(0, 97, 255, 0.18), transparent 50%);
    pointer-events: none;
}
.scq__cta-content {
    position: relative;
    z-index: 1;
    max-width: 820px;
    margin: 0 auto;
}
.scq__cta-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 6px 14px;
    background: rgba(255, 153, 51, 0.10);
    border: 1px solid rgba(255, 153, 51, 0.40);
    border-radius: 999px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--india-saffron);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 18px;
}
.scq__cta-eyebrow::before {
    content: '◆';
    font-size: 9px;
}
.scq__cta-head {
    font-size: clamp(26px, 4vw, 40px);
    font-weight: 800;
    color: #fff;
    letter-spacing: -1px;
    line-height: 1.18;
    margin: 0 auto 18px;
}
.scq__cta-head em {
    font-style: italic;
    background: linear-gradient(135deg, var(--india-saffron), var(--highlight-blue-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.scq__cta-text {
    font-size: 15.5px;
    color: rgba(255, 255, 255, 0.78);
    line-height: 1.7;
    margin: 0 auto 28px;
    max-width: 680px;
}
.scq__cta-text strong { color: #fff; font-weight: 700; }
.scq__cta-promise {
    margin-top: 28px;
    padding-top: 24px;
    border-top: 1px dashed rgba(255, 255, 255, 0.15);
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.55);
    letter-spacing: 0.10em;
    text-transform: uppercase;
}
.scq__cta-promise span { color: var(--india-saffron); margin: 0 6px; font-weight: 800; }
.scq__cta-foot {
    margin-top: 18px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.40);
    letter-spacing: 0.10em;
}