*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    :root {
      --black:     #0a0a0a;
      --dark:      #111418;
      --coal:      #1c2026;
      --steel:     #2b3240;
      --steel-lt:  #3b4455;
      --yellow:    #f5a623;
      --yellow-lt: #fbb94a;
      --yellow-dk: #d4891c;
      --white:     #ffffff;
      --off-white: #f8f7f4;
      --gray-lt:   #e8eaed;
      --gray-mid:  #8b9199;
      --gray-dim:  #555c67;
      --font-head: 'Poppins', sans-serif;
      --font-body: 'Inter', sans-serif;
    }
    html { scroll-behavior: smooth; }
    body { font-family: var(--font-body); background: var(--off-white); color: var(--dark); -webkit-font-smoothing: antialiased; }

    .container { max-width: 1240px; margin: 0 auto; padding: 0 24px; }
    .section { padding: 88px 0; }
    .section-dark { background: var(--dark); }
    .section-coal { background: var(--coal); }
    .section-white { background: var(--white); }
    .section-stripe { background: var(--off-white); }

    .section-label {
      display: inline-flex; align-items: center; gap: 8px;
      font-family: var(--font-head); font-size: 11.5px; font-weight: 700;
      letter-spacing: .12em; text-transform: uppercase; color: var(--yellow); margin-bottom: 14px;
    }
    .section-label::before { content: ''; display: block; width: 24px; height: 2px; background: var(--yellow); border-radius: 2px; }
    .section-title { font-family: var(--font-head); font-size: clamp(28px,3.5vw,42px); font-weight: 800; line-height: 1.15; color: var(--dark); letter-spacing: -.02em; }
    .section-title.light { color: var(--white); }
    .section-title span { color: var(--yellow); }
    .section-desc { font-size: 16px; line-height: 1.75; color: var(--gray-dim); max-width: 600px; margin-top: 16px; }
    .section-desc.light { color: var(--gray-mid); }

    .btn-primary {
      display: inline-flex; align-items: center; gap: 8px;
      font-family: var(--font-head); font-size: 14px; font-weight: 700;
      color: var(--black); background: var(--yellow); text-decoration: none;
      padding: 14px 28px; border-radius: 6px;
      transition: background .2s, transform .15s, box-shadow .2s;
    }
    .btn-primary:hover { background: var(--yellow-lt); transform: translateY(-2px); box-shadow: 0 6px 20px rgba(245,166,35,.35); }
    .btn-outline-dark {
      display: inline-flex; align-items: center; gap: 8px;
      font-family: var(--font-head); font-size: 14px; font-weight: 600;
      color: var(--dark); background: transparent; border: 2px solid rgba(0,0,0,.2);
      text-decoration: none; padding: 12px 26px; border-radius: 6px; transition: border-color .2s, background .2s;
    }
    .btn-outline-dark:hover { border-color: var(--dark); background: rgba(0,0,0,.04); }

    /* ══ PAGE HERO ══ */
    .page-hero {
      background: var(--dark); padding: 80px 0 72px; position: relative; overflow: hidden;
    }
    .page-hero::before {
      content: ''; position: absolute; inset: 0;
      background-image: linear-gradient(rgba(245,166,35,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(245,166,35,.05) 1px, transparent 1px);
      background-size: 60px 60px;
    }
    .page-hero::after { content: ''; position: absolute; top: 0; left: 0; width: 4px; height: 100%; background: var(--yellow); }
    .page-hero-inner { position: relative; z-index: 2; }
    .breadcrumb { display: flex; align-items: center; gap: 8px; font-family: var(--font-body); font-size: 13px; color: var(--gray-mid); margin-bottom: 20px; }
    .breadcrumb a { color: var(--gray-mid); text-decoration: none; transition: color .2s; }
    .breadcrumb a:hover { color: var(--yellow); }
    .breadcrumb-sep { color: var(--gray-dim); }
    .breadcrumb-current { color: var(--yellow); }
    .page-hero-title { font-family: var(--font-head); font-size: clamp(36px,5vw,58px); font-weight: 900; color: var(--white); letter-spacing: -.03em; line-height: 1.08; margin-bottom: 18px; }
    .page-hero-title span { color: var(--yellow); }
    .page-hero-sub { font-family: var(--font-body); font-size: 17px; color: var(--gray-mid); line-height: 1.7; max-width: 640px; }
    .hero-service-pills { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
    .hero-pill {
      font-family: var(--font-body); font-size: 12.5px; font-weight: 600;
      color: var(--gray-mid); background: rgba(255,255,255,.07);
      border: 1px solid rgba(255,255,255,.12); padding: 6px 14px; border-radius: 20px;
      text-decoration: none; transition: color .2s, border-color .2s;
    }
    .hero-pill:hover { color: var(--yellow); border-color: rgba(245,166,35,.4); }

    /* ══ SERVICE NAV TABS ══ */
    .service-nav { background: var(--white); border-bottom: 2px solid rgba(0,0,0,.08); position: sticky; top: 74px; z-index: 100; }
    .service-nav-inner { display: flex; gap: 0; overflow-x: auto; scrollbar-width: none; }
    .service-nav-inner::-webkit-scrollbar { display: none; }
    .service-tab {
      font-family: var(--font-body); font-size: 13.5px; font-weight: 500;
      color: var(--gray-dim); text-decoration: none; padding: 16px 22px;
      border-bottom: 2px solid transparent; margin-bottom: -2px;
      transition: color .2s, border-color .2s; white-space: nowrap;
    }
    .service-tab:hover { color: var(--dark); }
    .service-tab.active { color: var(--yellow-dk); border-bottom-color: var(--yellow); font-weight: 600; }

    /* ══ SERVICE DETAIL SECTIONS ══ */
    .service-section { padding: 88px 0; }
    .service-section:nth-child(even) { background: var(--white); }
    .service-section:nth-child(odd) { background: var(--off-white); }

    .service-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: start; }
    .service-layout.reverse { direction: rtl; }
    .service-layout.reverse > * { direction: ltr; }

    .service-num {
      font-family: var(--font-head); font-size: 80px; font-weight: 900;
      color: rgba(0,0,0,.04); line-height: 1; letter-spacing: -.05em;
      margin-bottom: -20px; display: block;
    }
    .service-icon-wrap {
      width: 64px; height: 64px; background: var(--dark); border-radius: 12px;
      display: flex; align-items: center; justify-content: center; margin-bottom: 20px;
    }
    .service-h2 { font-family: var(--font-head); font-size: clamp(24px,3vw,34px); font-weight: 800; color: var(--dark); letter-spacing: -.02em; line-height: 1.2; margin-bottom: 16px; }
    .service-h2 span { color: var(--yellow); }
    .service-lead { font-size: 15px; line-height: 1.8; color: var(--gray-dim); margin-bottom: 20px; }

    .spec-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 24px 0; }
    .spec-item {
      background: var(--white); border: 1px solid rgba(0,0,0,.08);
      border-radius: 8px; padding: 14px 16px;
    }
    .service-section:nth-child(even) .spec-item { background: var(--off-white); }
    .spec-label { font-size: 11px; font-weight: 700; color: var(--gray-mid); text-transform: uppercase; letter-spacing: .08em; margin-bottom: 4px; }
    .spec-value { font-family: var(--font-head); font-size: 14px; font-weight: 700; color: var(--dark); }

    .scope-list { list-style: none; display: flex; flex-direction: column; gap: 8px; margin: 20px 0; }
    .scope-item { display: flex; align-items: flex-start; gap: 10px; font-size: 14.5px; color: var(--gray-dim); line-height: 1.5; }
    .scope-check { width: 20px; height: 20px; background: rgba(245,166,35,.15); border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 1px; }
    .scope-check svg { color: var(--yellow-dk); }

    .app-areas { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 16px; }
    .app-tag { font-size: 12px; font-weight: 600; color: var(--yellow-dk); background: rgba(245,166,35,.1); border: 1px solid rgba(245,166,35,.2); padding: 4px 10px; border-radius: 3px; }

    /* Image block */
    .service-img-block { position: relative; }
    .service-main-img {
      width: 100%; border-radius: 12px;
      object-fit: cover; display: block;
      background: var(--steel);
    }
    .service-img-badge {
      position: absolute; top: 16px; left: 16px;
      background: var(--dark); color: var(--yellow);
      font-family: var(--font-head); font-size: 11px; font-weight: 800;
      letter-spacing: .08em; text-transform: uppercase;
      padding: 6px 14px; border-radius: 3px;
      border: 1px solid rgba(245,166,35,.3);
    }
    .service-img-inset {
      position: absolute; bottom: -18px; right: -18px;
      width: 140px; height: 100px;
      border-radius: 8px; overflow: hidden;
      border: 3px solid var(--white);
      box-shadow: 0 8px 24px rgba(0,0,0,.15);
      background: var(--steel);
    }
    .service-img-inset img { width: 100%; height: 100%; object-fit: cover; display: block; }

    /* Process steps inside service */
    .process-inline { margin-top: 24px; display: flex; flex-direction: column; gap: 12px; }
    .process-inline-item { display: flex; gap: 14px; align-items: flex-start; }
    .process-inline-num {
      width: 30px; height: 30px; flex-shrink: 0;
      background: var(--yellow); border-radius: 50%;
      font-family: var(--font-head); font-size: 13px; font-weight: 800;
      color: var(--black); display: flex; align-items: center; justify-content: center;
    }
    .process-inline-text { font-size: 14px; color: var(--gray-dim); line-height: 1.6; padding-top: 4px; }
    .process-inline-text strong { color: var(--dark); }

    /* ══ COVERAGE TABLE ══ */
    .coverage-wrap {
      display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 48px;
    }
    .cov-card {
      background: var(--white); border: 1px solid rgba(0,0,0,.08);
      border-radius: 10px; padding: 24px;
    }
    .cov-card-title { font-family: var(--font-head); font-size: 13px; font-weight: 800; color: var(--dark); text-transform: uppercase; letter-spacing: .08em; margin-bottom: 14px; padding-bottom: 10px; border-bottom: 2px solid var(--yellow); }
    .cov-list { list-style: none; display: flex; flex-direction: column; gap: 5px; }
    .cov-list li { font-size: 13.5px; color: var(--gray-dim); padding-left: 12px; position: relative; }
    .cov-list li::before { content: '·'; position: absolute; left: 0; color: var(--yellow); font-weight: 700; }

    /* ══ FAQ ACCORDION ══ */
    .faq-list { max-width: 800px; margin: 48px auto 0; }
    .faq-item { border-bottom: 1px solid rgba(0,0,0,.08); }
    .faq-question {
      display: flex; align-items: center; justify-content: space-between; gap: 20px;
      padding: 20px 0; cursor: pointer; list-style: none;
      font-family: var(--font-head); font-size: 15px; font-weight: 600; color: var(--dark);
    }
    .faq-question::-webkit-details-marker { display: none; }
    .faq-question svg { flex-shrink: 0; transition: transform .3s; color: var(--yellow); }
    details[open] .faq-question svg { transform: rotate(45deg); }
    .faq-answer { font-size: 14.5px; line-height: 1.75; color: var(--gray-dim); padding: 0 0 20px; max-width: 680px; }

    /* ══ TYPES TABLE ══ */
    .types-table { width: 100%; border-collapse: collapse; margin-top: 32px; font-size: 14px; }
    .types-table th { background: var(--dark); color: var(--white); font-family: var(--font-head); font-weight: 700; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; padding: 14px 18px; text-align: left; }
    .types-table th:first-child { border-radius: 8px 0 0 0; }
    .types-table th:last-child { border-radius: 0 8px 0 0; }
    .types-table td { padding: 14px 18px; color: var(--gray-dim); border-bottom: 1px solid rgba(0,0,0,.06); vertical-align: top; line-height: 1.5; }
    .types-table tr:last-child td { border-bottom: none; }
    .types-table tr:nth-child(even) td { background: rgba(0,0,0,.02); }
    .types-table td:first-child { font-family: var(--font-head); font-weight: 700; color: var(--dark); }
    .type-badge { display: inline-block; font-size: 10.5px; font-weight: 700; padding: 2px 8px; border-radius: 3px; background: rgba(245,166,35,.12); color: var(--yellow-dk); }

    /* ══ MINI PROCESS ══ */
    .mini-process { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; margin-top: 48px; position: relative; }
    .mini-process::before { content: ''; position: absolute; top: 30px; left: 12%; right: 12%; height: 2px; background: linear-gradient(90deg, var(--yellow), rgba(245,166,35,.2)); }
    .mini-step { text-align: center; padding: 0 16px; }
    .mini-step-circle { width: 60px; height: 60px; background: var(--white); border: 2px solid var(--yellow); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 16px; font-family: var(--font-head); font-size: 18px; font-weight: 800; color: var(--yellow); position: relative; z-index: 2; }
    .mini-step-title { font-family: var(--font-head); font-size: 13.5px; font-weight: 700; color: var(--dark); margin-bottom: 6px; }
    .mini-step-desc { font-size: 12.5px; color: var(--gray-dim); line-height: 1.55; }

    /* ══ RESPONSIVE ══ */
    @media (max-width: 1024px) {
      .coverage-wrap { grid-template-columns: repeat(2, 1fr); }
      .mini-process { grid-template-columns: repeat(2, 1fr); }
      .mini-process::before { display: none; }
    }
    @media (max-width: 768px) {
      .service-layout, .service-layout.reverse { grid-template-columns: 1fr; direction: ltr; }
      .spec-grid { grid-template-columns: 1fr; }
      .service-img-inset { display: none; }
      .section { padding: 64px 0; }
      .service-section { padding: 64px 0; }
      .coverage-wrap { grid-template-columns: 1fr; }
    }
    @media (max-width: 480px) {
      .mini-process { grid-template-columns: 1fr; }
      .hero-service-pills { display: none; }
    }