:root {
    --s2m-navy: #0D1B3D;
    --s2m-red: #F73B30;
    --s2m-off: #F7F6F2;
    --s2m-ink: #13213F;
    --s2m-muted: #5D667A;
  }
  
  body {
    font-family: 'Inter', 'Roboto', Arial, sans-serif;
    color: var(--s2m-ink);
    background: #fff;
  }
  
  h1, h2, h3, h4, h5, h6,
  .h1, .menu__link, .btn {
    font-family: 'Inter', 'Roboto', Arial, sans-serif !important;
    letter-spacing: -0.025em;
  }
  
  .header { background: transparent !important; box-shadow: none !important; }
  .header.header--secondary .header-upper,
  .header.header--secondary .header-under { background: rgba(13, 27, 61, 0.96) !important; padding-left: 20px; padding-right: 20px;}
  .header-contact__link, .header-inner__tel, .menu__link { color: #fff !important; }
  .menu__link:hover, .menu__item:hover > .menu__link, .sub-menu a:hover,
  .header-contact__link:hover, .header-inner__tel:hover, .menu .active .menu__link { color: var(--s2m-red) !important; }
  .sub-menu { border-top: 3px solid var(--s2m-red) !important; }
  .social__link svg path { fill: currentColor !important; }
  .header .social__link, .footer .social__link { color: #fff !important; }
  .header .social__link:hover, .footer .social__link:hover { color: var(--s2m-red) !important; }
  .brand-logo-text { display: inline-flex; align-items: center; max-width: 190px; }
  .brand-logo-text img, .footer-logo img { display: block; max-width: 180px; height: auto; }
  
  .btn { transition: all 0.25s ease !important; }
  .btn--white { background: #fff !important; border-color: #fff !important; color: var(--s2m-navy) !important; }
  .btn--white:hover { background: var(--s2m-red) !important; border-color: var(--s2m-red) !important; color: #fff !important; transform: translateY(-2px); }
  .btn--outline-white, .btn--outline-secondary { background: transparent !important; border-color: #fff !important; color: #fff !important; }
  .btn--outline-white:hover, .btn--outline-secondary:hover { background: var(--s2m-red) !important; border-color: var(--s2m-red) !important; color: #fff !important; transform: translateY(-2px); }
  .btn--outline, .btn--outline-primary { background: transparent !important; border-color: var(--s2m-red) !important; color: var(--s2m-red) !important; }
  .btn--outline:hover, .btn--outline-primary:hover { background: var(--s2m-red) !important; border-color: var(--s2m-red) !important; color: #fff !important; transform: translateY(-2px); }
  
  .bg--gradient, .footer { background: var(--s2m-navy) !important; }
  .section.bg--light { background: var(--s2m-off) !important; }
  .headtitle, .categories span, .listing-meta__item a, .red-accent { color: var(--s2m-red) !important; }
  .section-headline h4 { color: var(--s2m-ink) !important; position: relative; font-family: 'Inter', sans-serif !important; font-weight: 800; font-size: 36px; letter-spacing: -0.5px; margin-bottom: 14px; text-transform: uppercase; }
  .section-headline h4::after { content: ""; display: block; width: 80px; height: 2px; background-color: var(--s2m-red); margin: 12px auto 0; }
  .section-headline p { max-width: 820px; margin-left: auto; margin-right: auto; line-height: 1.7; color: var(--s2m-muted); }
  
  .areas-hero { position: relative; }
  .areas-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(13, 27, 61, 0.9), rgba(13, 27, 61, 0.58)); z-index: 1; pointer-events: none; }
  .areas-hero .container { position: relative; z-index: 2; }
  .areas-hero h1, .areas-hero .subtitle { color: #fff; }
  .areas-hero .subtitle { letter-spacing: 0.08em; text-transform: uppercase; color: rgba(255,255,255,0.72); }
  
  .areas-service-list .service-card::before { background: linear-gradient(180deg, rgba(13,27,61,.10), rgba(13,27,61,.55)) !important; }
  .areas-service-content { position: relative; z-index: 3; }
  .areas-service-content p { color: rgba(255,255,255,0.8); margin-top: 8px; font-size: 14px; line-height: 1.5; }
  .areas-service-list .service-card__title { color: #fff !important; }
  
  .areas-performance { background: #fff; }
  .areas-performance-row { align-items: center; }
  .performance-card { height: 100%; padding: 34px; border: 1px solid rgba(13, 27, 61, 0.10); border-radius: 16px; background: #fff; box-shadow: 0 18px 48px rgba(13,27,61,0.08); }
  .performance-card--chart { text-align: center; }
  .chart-legend { display: flex; flex-direction: column; gap: 10px; margin-top: 18px; color: var(--s2m-ink); font-size: 14px; font-weight: 600; text-align: left; }
  .legend-dot { display: inline-block; width: 11px; height: 11px; border-radius: 50%; margin-right: 8px; }
  .legend-dot.navy { background: var(--s2m-navy); }
  .legend-dot.red { background: var(--s2m-red); }
  .areas-progress-list {
    margin: 0;
  }
  
  /* TITLE → keep dark for readability */
  .areas-progress-list .progress-tile__title {
    color: var(--s2m-ink);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 12px;
  }
  
  /* NUMBER → highlight in brand red */
  .areas-progress-list .progress-tile__num {
    color: var(--s2m-red);
    font-weight: 800;
    font-size: 18px;
  }
  
  /* BAR TRACK */
  .areas-progress-list .progress-bar {
    background: rgba(13, 27, 61, 0.12);
    border-radius: 6px;
    height: 6px;
    overflow: hidden;
  }
  
  /* BAR FILL (premium gradient instead of flat red) */
  .areas-progress-list .progress-bar__line {
    background: linear-gradient(
      90deg,
      var(--s2m-red),
      #ff7a70
    );
    border-radius: 6px;
    transition: width 1.2s cubic-bezier(0.4, 0, 0.2, 1);
  }
  
  .areas-practice-grid { display: grid !important; grid-template-columns: repeat(3, 1fr); gap: 30px; }
  .areas-practice-grid .row-list__item { width: auto !important; }
  .card--overlay { box-shadow: 0 14px 40px rgba(13,27,61,.08); transition: all 0.25s ease; }
  .card--overlay:hover { box-shadow: 0 18px 48px rgba(13,27,61,.14); transform: translateY(-4px); }
  .card--overlay .card__image img { transition: all 0.3s ease; }
  .card--overlay:hover .card__image img { filter: brightness(0) invert(1); }
  .card__title { color: var(--s2m-navy) !important; }
  .card--overlay:hover .card__title {
    color: #fff !important;
  }
  .text-wrap p { line-height: 1.7; }
  
  .areas-who-section .section-tile__item:first-child { background: #fff; }
  .areas-who-section h3 { max-width: 560px; color: var(--s2m-navy); font-weight: 800; line-height: 1.15; }
  .areas-who-section p { max-width: 620px; color: var(--s2m-muted); line-height: 1.75; }
  .areas-small-text { font-size: 14px; }
  
  .areas-cta-section .cta-wrap { background: rgba(255,255,255,0.04); border-right: 1px solid rgba(255,255,255,0.12); transition: all 0.25s ease; }
  .areas-cta-section .cta-wrap:hover { background: rgba(255,255,255,0.08); }
  .areas-cta-section .cta-wrap__subtitle { color: rgba(255,255,255,0.64); text-transform: uppercase; letter-spacing: 0.10em; }
  .areas-cta-section .cta-wrap__title { color: #fff; }
  .cta-dot { display: inline-block; width: 18px; height: 18px; border-radius: 50%; background: var(--s2m-red); }
  
  .footer:after { display: none !important; }
  .footer-list__link:hover, .info-list__link:hover { color: var(--s2m-red) !important; }
  .footer-under { border-top: 1px solid rgba(255,255,255,.15) !important; }
  
  @media (max-width: 1024px) {
    .nav-drop { background: var(--s2m-navy) !important; }
    .menu { background: transparent !important; }
    .menu__link { color: #ffffff !important; }
    .menu__link:hover { color: var(--s2m-red) !important; }
    .sub-menu { background: var(--s2m-navy) !important; }
    .areas-practice-grid { grid-template-columns: repeat(2, 1fr); }
    .performance-card { margin-bottom: 24px; }
  }
  
  @media (max-width: 640px) {
    .section-headline h4 { font-size: 28px; }
    .areas-practice-grid { grid-template-columns: 1fr; }
    .performance-card { padding: 24px; }
    .areas-service-content p { font-size: 13px; }
  }