html, body { overflow-x: hidden; max-width: 100%; }
    /* ── Hero ── */
    .rpa-hero {
      background: linear-gradient(135deg, #080f14 0%, #1c5266 55%, #226673 100%);
      padding: 220px 0 80px;
      color: #fff;
      position: relative;
      overflow: hidden;
    }
    .rpa-hero::before {
      content: '';
      position: absolute;
      inset: 0;
      background: radial-gradient(ellipse at 65% 50%, rgba(126,166,172,0.14) 0%, transparent 65%);
      pointer-events: none;
    }
    .rpa-hero::after {
      content: '';
      position: absolute;
      inset: 0;
      background-image: radial-gradient(circle, rgba(255,255,255,0.03) 1px, transparent 1px);
      background-size: 40px 40px;
      pointer-events: none;
    }
    .rpa-hero-inner {
      max-width: 1140px;
      margin: 0 auto;
      padding: 0 32px;
      position: relative;
      z-index: 1;
      display: grid;
      grid-template-columns: 1fr minmax(0, 500px);
      gap: 56px;
      align-items: center;
      width: 100%;
    }

    /* ── Agent Card Illustration ── */
    .rpa-workflow-graphic { position: relative; }

    .agent-card {
      background: #06161d;
      border-radius: 14px;
      border: 1px solid rgba(126,166,172,0.18);
      overflow: hidden;
      font-family: 'Open Sans', sans-serif;
      box-shadow: 0 28px 64px rgba(0,0,0,0.6), 0 0 0 1px rgba(126,166,172,0.06);
      width: 100%;
      height: auto;
      min-height: 480px;
      display: flex;
      flex-direction: column;
    }
    /* Title bar */
    .agent-bar {
      display: flex; align-items: center; gap: 8px;
      padding: 10px 14px;
      background: #020d13;
      border-bottom: 1px solid rgba(126,166,172,0.1);
    }
    .agent-dots { display: flex; gap: 5px; }
    .agent-dots span { width: 10px; height: 10px; border-radius: 50%; }
    .agent-dots span:nth-child(1) { background: #ff5f56; }
    .agent-dots span:nth-child(2) { background: #ffbd2e; }
    .agent-dots span:nth-child(3) { background: #27c93f; }
    .agent-bar-title {
      flex: 1; text-align: center;
      font-family: 'Oswald', sans-serif; font-size: 11px; font-weight: 500;
      color: rgba(255,255,255,0.4); letter-spacing: 1px;
    }
    .agent-live { display: flex; align-items: center; gap: 5px; font-size: 10px; color: rgba(255,255,255,0.4); }
    .agent-live-dot {
      width: 6px; height: 6px; border-radius: 50%; background: #4ade80;
      animation: livePulse 2s ease-in-out infinite;
    }
    @keyframes livePulse {
      0%, 100% { box-shadow: 0 0 5px rgba(74,222,128,0.7); opacity: 1; }
      50% { box-shadow: 0 0 0px rgba(74,222,128,0); opacity: 0.6; }
    }
    /* Agent header */
    .agent-header {
      display: flex; align-items: center; gap: 10px;
      padding: 12px 16px 11px;
      border-bottom: 1px solid rgba(126,166,172,0.07);
    }
    .agent-avatar {
      width: 34px; height: 34px; border-radius: 9px; flex-shrink: 0;
      background: linear-gradient(135deg, #226673 0%, #0e3d49 100%);
      border: 1px solid rgba(126,166,172,0.3);
      display: flex; align-items: center; justify-content: center;
    }
    .agent-meta-name { font-family: 'Oswald', sans-serif; font-size: 13px; font-weight: 600; color: #fff; line-height: 1.2; }
    .agent-meta-status { font-size: 10px; color: rgba(126,166,172,0.8); margin-top: 2px; min-height: 14px; transition: opacity 0.4s; }
    .agent-rpa-badge {
      margin-left: auto; background: rgba(34,102,115,0.35);
      border: 1px solid rgba(126,166,172,0.22); border-radius: 5px;
      padding: 3px 8px; font-family: 'Oswald', sans-serif;
      font-size: 10px; font-weight: 600; color: #7ea6ac; letter-spacing: 0.5px;
    }
    /* Steps */
    .agent-steps { padding: 4px 0 2px; flex: 1; display: flex; flex-direction: column; }
    .ag-step { padding: 0 16px; display: flex; flex-direction: column; }
    .ag-step-row { display: flex; align-items: center; gap: 9px; padding: 10px 0 6px; flex-shrink: 0; }
    .ag-icon {
      width: 18px; height: 18px; border-radius: 50%;
      border: 1.5px solid rgba(126,166,172,0.18);
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0; position: relative; transition: border-color 0.3s, background 0.3s;
    }
    .ag-icon .pi { width: 7px; height: 7px; border-radius: 50%; background: #7ea6ac; opacity: 0; transition: opacity 0.3s; }
    .ag-step.active .ag-icon { border-color: #7ea6ac; }
    .ag-step.active .ag-icon .pi { opacity: 1; animation: piPulse 1s ease-in-out infinite; }
    @keyframes piPulse { 0%,100%{transform:scale(1);opacity:1} 50%{transform:scale(0.55);opacity:0.45} }
    .ag-step.done .ag-icon { border-color: #4ade80; background: rgba(74,222,128,0.1); }
    .ag-step.done .ag-icon .pi { display: none; }
    .ag-step.done .ag-icon::after { content: '✓'; font-size: 9px; color: #4ade80; font-weight: 700; position: absolute; }
    .ag-step.flagged .ag-icon { border-color: #fbbf24; background: rgba(251,191,36,0.1); }
    .ag-step.flagged .ag-icon .pi { display: none; }
    .ag-step.flagged .ag-icon::after { content: '!'; font-size: 10px; color: #fbbf24; font-weight: 900; position: absolute; }
    .ag-step.flagged .ag-step-label { color: #fbbf24; }
    .ag-step-label { font-size: 11.5px; font-weight: 600; color: rgba(255,255,255,0.22); transition: color 0.3s; font-family: 'Open Sans', sans-serif; }
    .ag-step.active .ag-step-label, .ag-step.done .ag-step-label { color: rgba(255,255,255,0.92); }
    /* Detail rows */
    .ag-details { padding-left: 27px; padding-bottom: 10px; }
    .ag-row {
      display: flex; align-items: flex-start; gap: 8px;
      padding: 1px 0; opacity: 0; transform: translateX(-6px);
      transition: opacity 0.35s ease, transform 0.35s ease;
    }
    .ag-row.show { opacity: 1; transform: translateX(0); }
    .ag-key {
      font-size: 9px; text-transform: uppercase; letter-spacing: 0.4px;
      color: rgba(126,166,172,0.5); min-width: 68px; flex-shrink: 0;
      padding-top: 1.5px; line-height: 1.5;
    }
    .ag-val { color: rgba(255,255,255,0.65); font-size: 10.5px; line-height: 1.5; }
    .ag-val.ok { color: #4ade80; }
    .ag-val.warn { color: #fbbf24; }
    /* Divider */
    .ag-divider { height: 1px; background: rgba(126,166,172,0.06); margin: 0 16px; flex-shrink: 0; }
    /* Footer stats */
    .agent-footer { display: flex; border-top: 1px solid rgba(126,166,172,0.1); margin-top: 6px; }
    .ag-foot-stat {
      flex: 1; display: flex; flex-direction: column; align-items: center;
      padding: 10px 0; border-right: 1px solid rgba(126,166,172,0.07);
    }
    .ag-foot-stat:last-child { border-right: none; }
    .ag-foot-num { font-family: 'Oswald', sans-serif; font-size: 15px; font-weight: 700; color: #7ea6ac; line-height: 1; }
    .ag-foot-lbl { font-size: 8.5px; color: rgba(255,255,255,0.3); text-transform: uppercase; letter-spacing: 0.4px; margin-top: 3px; }

    @media (max-width: 768px) {
      .rpa-hero-inner { grid-template-columns: 1fr; }
      .rpa-workflow-graphic { display: none; }
      .rpa-cs-grid { grid-template-columns: 1fr !important; }
    }
    @media (max-width: 860px) {
      .rpa-cs-subtitle { white-space: normal !important; max-width: 100% !important; }
    }

    /* ── Case Study Cards ── */
    .cs-card {
      text-decoration: none;
      display: flex;
      flex-direction: column;
      background: #fff;
      border: 1px solid #d0e4ea;
      border-radius: 16px;
      overflow: hidden;
      box-shadow: 0 4px 24px rgba(34,102,115,0.07);
      transition: transform 0.25s ease, box-shadow 0.25s ease;
    }
    .cs-card:hover {
      transform: translateY(-5px);
      box-shadow: 0 16px 48px rgba(34,102,115,0.16);
    }
    .cs-card-header {
      background: linear-gradient(135deg, #050d10 0%, #0d2e38 50%, #1c5266 100%);
      padding: 24px 28px 20px;
    }
    .cs-card-tag {
      display: inline-flex; align-items: center; gap: 7px;
      background: rgba(126,166,172,0.18);
      border: 1px solid rgba(126,166,172,0.3);
      border-radius: 100px;
      padding: 4px 12px;
      font-family: 'Oswald', sans-serif;
      font-size: 0.65rem; font-weight: 600; letter-spacing: 2px;
      text-transform: uppercase; color: #7ea6ac;
      margin-bottom: 14px;
    }
    .cs-card-tag-dot {
      width: 5px; height: 5px; border-radius: 50%; background: #7ea6ac;
    }
    .cs-card-title {
      font-family: 'Oswald', sans-serif;
      font-size: 1.25rem; font-weight: 700;
      color: #fff; line-height: 1.35; margin: 0;
      letter-spacing: 0.02em;
    }
    .cs-card-metrics {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 0;
      border-top: 1px solid rgba(126,166,172,0.15);
      margin-top: 20px;
    }
    .cs-card-metric {
      padding: 14px 16px;
      border-right: 1px solid rgba(126,166,172,0.12);
      border-bottom: 1px solid rgba(126,166,172,0.12);
    }
    .cs-card-metric:nth-child(2n) { border-right: none; }
    .cs-card-metric:nth-last-child(-n+2) { border-bottom: none; }
    .cs-card-metric-num {
      font-family: 'Oswald', sans-serif;
      font-size: 1.6rem; font-weight: 700; color: #7ea6ac;
      line-height: 1;
    }
    .cs-card-metric-label {
      font-family: 'Open Sans', sans-serif;
      font-size: 0.7rem; color: rgba(255,255,255,0.5);
      margin-top: 4px; line-height: 1.4;
    }
    .cs-card-body {
      padding: 24px 28px;
      display: flex; flex-direction: column; gap: 14px; flex: 1;
    }
    .cs-card-desc {
      font-family: 'Open Sans', sans-serif;
      font-size: 0.88rem; color: #5a7a88; line-height: 1.7; flex: 1;
      margin: 0;
    }
    .cs-card-cta {
      font-family: 'Oswald', sans-serif;
      font-size: 0.9rem; font-weight: 600; color: #226673;
      display: flex; align-items: center; gap: 6px;
    }
    .cs-card-cta::after {
      content: '→';
      transition: transform 0.2s ease;
    }
    .cs-card:hover .cs-card-cta::after { transform: translateX(4px); }

    .rpa-breadcrumb {
      font-family: 'Open Sans', sans-serif;
      font-size: 0.8rem;
      color: rgba(255,255,255,0.5);
      margin-bottom: 20px;
      display: flex;
      align-items: center;
      gap: 8px;
    }
    .rpa-breadcrumb a { color: rgba(255,255,255,0.5); text-decoration: none; }
    .rpa-breadcrumb a:hover { color: #7ea6ac; }
    .rpa-eyebrow {
      font-family: 'Oswald', sans-serif;
      font-size: 0.75rem;
      font-weight: 600;
      letter-spacing: 3px;
      text-transform: uppercase;
      color: #7ea6ac;
      border-left: 3px solid #7ea6ac;
      padding-left: 12px;
      margin-bottom: 20px;
      display: block;
    }
    .rpa-hero h1 {
      font-family: 'Oswald', sans-serif;
      font-size: clamp(2.4rem, 5vw, 3.8rem);
      font-weight: 700;
      letter-spacing: 1px;
      line-height: 1.1;
      margin-bottom: 20px;
    }
    .rpa-hero h1 span { color: #7ea6ac; }
    .rpa-hero p {
      font-family: 'Open Sans', sans-serif;
      font-size: 1.02rem;
      color: rgba(255,255,255,0.75);
      line-height: 1.75;
      max-width: 680px;
      margin-bottom: 32px;
    }
    .rpa-hero-benefits {
      display: flex;
      flex-direction: column;
      gap: 12px;
      margin-top: 8px;
    }
    .rpa-hero-benefit {
      display: flex;
      align-items: center;
      gap: 10px;
      font-family: 'Open Sans', sans-serif;
      font-size: 0.9rem;
      color: rgba(255,255,255,0.8);
    }
    .rpa-benefit-dot {
      width: 8px; height: 8px;
      background: #7ea6ac;
      border-radius: 50%;
      flex-shrink: 0;
    }

    /* ── Intro band ── */
    .rpa-intro {
      background: #fff;
      padding: 56px 0 48px;
    }
    .rpa-intro-inner {
      max-width: 860px;
      margin: 0 auto;
      padding: 0 32px;
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      gap: 32px;
      text-align: center;
    }
    .rpa-intro-stat {}
    .rpa-intro-stat-num {
      font-family: 'Oswald', sans-serif;
      font-size: 2.2rem;
      font-weight: 700;
      color: #226673;
      line-height: 1;
    }
    .rpa-intro-stat-label {
      font-family: 'Open Sans', sans-serif;
      font-size: 0.85rem;
      color: #666;
      margin-top: 6px;
      line-height: 1.4;
    }

    /* ── RPA Cards ── */
    .rpa-section {
      background: #ffffff;
      padding: 40px 0 90px;
      position: relative;
      overflow: hidden;
    }
    /* Subtle dot grid texture */
    .rpa-section::before {
      content: '';
      position: absolute;
      inset: 0;
      background-image: radial-gradient(circle, rgba(34,102,115,0.06) 1px, transparent 1px);
      background-size: 34px 34px;
      pointer-events: none;
    }
    .rpa-container {
      max-width: 1100px;
      margin: 0 auto;
      padding: 0 32px;
    }
    .rpa-section-header {
      text-align: center;
      margin-bottom: 52px;
    }
    .rpa-section-header .eyebrow {
      font-family: 'Oswald', sans-serif;
      font-size: 0.75rem;
      font-weight: 600;
      letter-spacing: 3px;
      text-transform: uppercase;
      color: #630404;
      margin-bottom: 12px;
      display: block;
    }
    .rpa-section-header h2 {
      font-family: 'Oswald', sans-serif;
      font-size: clamp(2rem, 4vw, 3rem);
      font-weight: 700;
      color: #1c2b2e;
      letter-spacing: 1px;
      margin-bottom: 12px;
    }
    .rpa-section-header h2 span { color: #226673; }
    .rpa-section-header p {
      font-family: 'Open Sans', sans-serif;
      font-size: 0.97rem;
      color: #555;
      max-width: 600px;
      margin: 0 auto;
      line-height: 1.7;
    }

    .rpa-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 22px;
    }
    /* Cards start hidden, revealed by IntersectionObserver */
    .rpa-card {
      background: #7ea6ac;
      border: 1px solid rgba(126,166,172,0.2);
      border-radius: 18px;
      padding: 36px 30px;
      position: relative;
      overflow: hidden;
      opacity: 0;
      transform: translateY(36px);
      transition: opacity 0.55s ease, transform 0.55s ease, box-shadow 0.25s;
    }
    .rpa-card.visible {
      opacity: 1;
      transform: translateY(0);
    }
    .rpa-card:nth-child(1) { transition-delay: 0s; }
    .rpa-card:nth-child(2) { transition-delay: 0.08s; }
    .rpa-card:nth-child(3) { transition-delay: 0.16s; }
    .rpa-card:nth-child(4) { transition-delay: 0.24s; }
    .rpa-card:nth-child(5) { transition-delay: 0.32s; }
    .rpa-card:nth-child(6) { transition-delay: 0.40s; }
    .rpa-card::after {
      content: '';
      position: absolute;
      bottom: 0; left: 0; right: 0;
      height: 3px;
      background: linear-gradient(90deg, #7ea6ac, #fff);
      transform: scaleX(0);
      transform-origin: left;
      transition: transform 0.35s ease;
    }
    .rpa-card:hover {
      transform: translateY(-6px);
      box-shadow: 0 20px 44px rgba(126,166,172,0.35);
    }
    .rpa-card:hover::after { transform: scaleX(1); }
    .rpa-card-num {
      position: absolute;
      top: 18px; right: 22px;
      font-family: 'Oswald', sans-serif;
      font-size: 11px; font-weight: 700;
      color: rgba(28,43,46,0.2);
      letter-spacing: 1px;
      transition: color 0.3s;
    }
    .rpa-card:hover .rpa-card-num { color: rgba(28,43,46,0.4); }
    .rpa-card-icon {
      width: 72px; height: 72px;
      background: #630404;
      border-radius: 14px;
      display: flex; align-items: center; justify-content: center;
      margin-bottom: 20px;
      color: #fff;
      transition: background 0.3s, transform 0.3s;
    }
    .rpa-card-icon img {
      width: 44px; height: 44px;
      object-fit: contain;
      filter: brightness(0) invert(1);
    }
    .rpa-card:hover .rpa-card-icon {
      background: #7a0505;
      transform: scale(1.1) rotate(-3deg);
    }
    .rpa-card h3 {
      font-family: 'Oswald', sans-serif;
      font-size: 1.2rem;
      font-weight: 700;
      color: #1c2b2e;
      letter-spacing: 1px;
      margin-bottom: 12px;
    }
    .rpa-card p {
      font-family: 'Open Sans', sans-serif;
      font-size: 0.9rem;
      color: rgba(28,43,46,0.85);
      line-height: 1.7;
    }

    /* ── Custom RPA band ── */
    .rpa-custom {
      background: #f4f7f8;
      padding: 72px 0;
      text-align: center;
      color: #1c2b2e;
      position: relative;
      overflow: hidden;
    }
    .rpa-custom::before { display: none; }
    .rpa-custom-inner { position: relative; z-index: 1; }
    .rpa-custom h2 {
      font-family: 'Oswald', sans-serif;
      font-size: clamp(1.8rem, 3.5vw, 2.8rem);
      font-weight: 700;
      letter-spacing: 1px;
      margin-bottom: 14px;
      color: #1c2b2e;
    }
    .rpa-custom h2 span { color: #226673; }
    .rpa-custom p {
      font-family: 'Open Sans', sans-serif;
      font-size: 1rem;
      color: #555;
      max-width: 620px;
      margin: 0 auto 32px;
      line-height: 1.7;
    }

    /* ── CTA ── */
    .rpa-cta {
      background: #226673;
      padding: 64px 0;
      text-align: center;
      color: #fff;
    }
    .rpa-cta h2 {
      font-family: 'Oswald', sans-serif;
      font-size: clamp(1.6rem, 3vw, 2.4rem);
      font-weight: 700;
      letter-spacing: 1px;
      margin-bottom: 14px;
    }
    .rpa-cta p {
      font-family: 'Open Sans', sans-serif;
      font-size: 1rem;
      color: rgba(255,255,255,0.75);
      margin-bottom: 28px;
    }

    @media (max-width: 900px) {
      .rpa-grid { grid-template-columns: 1fr 1fr; }
      .rpa-intro-inner { grid-template-columns: 1fr; gap: 20px; }
    }
    @media (max-width: 560px) {
      .rpa-grid { grid-template-columns: 1fr; }
    }