:root {
  --bg: #0d1114;
  --surface: #171d22;
  --surface-raised: #20282e;
  --text: #f4f7f8;
  --muted: #9eabb0;
  --dim: #66767d;
  --line: rgba(120, 222, 218, 0.17);
  --line-strong: rgba(120, 222, 218, 0.34);
  --accent: #78deda;
  --accent-soft: #a5f3ef;
  --max: 1160px;
  --font: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body { margin: 0; min-width: 320px; color: var(--muted); background: var(--bg); font-family: var(--font); line-height: 1.7; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
img { display: block; max-width: 100%; }
::selection { color: #0d1114; background: var(--accent-soft); }
.container { width: min(var(--max), calc(100% - 48px)); margin-inline: auto; }
.skip-link { position: fixed; z-index: 100; top: -80px; left: 20px; padding: 10px 15px; color: #0d1114; background: var(--accent); border-radius: 6px; font-weight: 700; }
.skip-link:focus { top: 18px; }

.service-page { background-image: radial-gradient(circle at 12% 8%, rgba(120,222,218,.1), transparent 29%), radial-gradient(circle at 88% 25%, rgba(165,243,239,.055), transparent 25%), linear-gradient(rgba(120,222,218,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(120,222,218,.025) 1px, transparent 1px); background-size: auto, auto, 72px 72px, 72px 72px; }
.service-header { position: sticky; z-index: 50; top: 0; border-bottom: 1px solid rgba(120,222,218,.12); background: rgba(13,17,20,.88); backdrop-filter: blur(16px); }
.service-nav { min-height: 72px; display: flex; align-items: center; gap: 26px; }
.service-brand { display: inline-flex; align-items: center; gap: 11px; color: var(--text); font-weight: 500; letter-spacing: -.02em; }
.service-brand img { width: 36px; height: 36px; border-radius: 10px; }
.service-brand strong { font-weight: 750; }
.service-nav-links { display: flex; align-items: center; gap: 22px; margin-left: auto; color: var(--muted); font-size: .82rem; font-weight: 650; }
.service-nav-links a:hover, .service-nav-links a:focus-visible { color: var(--text); }
.service-language { display: flex; align-items: center; gap: 4px; padding: 2px; border: 1px solid var(--line); border-radius: 6px; font-size: .7rem; font-weight: 700; }
.service-language a { min-width: 32px; min-height: 30px; display: grid; place-items: center; border-radius: 3px; }
.service-language a[aria-current="page"] { color: var(--accent-soft); background: rgba(120,222,218,.14); }
.theme-toggle { width: 38px; height: 38px; position: relative; border: 1px solid var(--line); border-radius: 8px; color: var(--text); background: var(--surface); cursor: pointer; }
.theme-toggle::before { content: "☼"; position: absolute; inset: 0; display: grid; place-items: center; font-size: 1.05rem; }
html[data-theme="light"] .theme-toggle::before { content: "☾"; }
.nav-cta, .primary-link { min-height: 43px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 0 17px; border: 1px solid transparent; border-radius: 7px; color: #0d1114; background: var(--accent); font-size: .8rem; font-weight: 750; }
.nav-cta:hover, .primary-link:hover { background: var(--accent-soft); transform: translateY(-1px); }

.service-main { overflow: hidden; }
.breadcrumbs { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; padding-top: 38px; color: var(--dim); font-size: .72rem; }
.breadcrumbs a:hover { color: var(--accent); }
.service-hero { position: relative; display: grid; grid-template-columns: minmax(0,1.25fr) minmax(300px,.75fr); gap: 80px; align-items: end; padding: 86px 0 104px; }
.service-hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: linear-gradient(90deg, var(--accent), rgba(165,243,239,.18), transparent 78%); }
.eyebrow { margin: 0 0 20px; color: var(--accent); font-size: .69rem; font-weight: 750; letter-spacing: .13em; text-transform: uppercase; }
h1, h2, h3 { margin: 0; color: var(--text); line-height: 1.08; letter-spacing: -.045em; }
h1 { max-width: 830px; font-size: clamp(3rem,6.8vw,6.25rem); }
h2 { max-width: 800px; font-size: clamp(2rem,4.1vw,3.8rem); }
h3 { font-size: 1.2rem; letter-spacing: -.025em; }
.hero-lede { max-width: 760px; margin: 28px 0 0; color: var(--muted); font-size: clamp(1rem,1.5vw,1.18rem); }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.secondary-link { min-height: 43px; display: inline-flex; align-items: center; justify-content: center; padding: 0 17px; border: 1px solid var(--line-strong); border-radius: 7px; color: var(--text); font-size: .8rem; font-weight: 700; }
.secondary-link:hover { border-color: var(--accent); }
.hero-panel { position: relative; padding: 28px; border: 1px solid var(--line); background: linear-gradient(145deg, rgba(120,222,218,.08), transparent 48%), rgba(23,29,34,.88); box-shadow: 0 30px 80px rgba(0,0,0,.25); }
.hero-panel::before { content: ""; position: absolute; left: 0; top: 0; width: 44%; height: 1px; background: var(--accent); }
.hero-panel > span { display: block; margin-bottom: 18px; color: var(--dim); font-size: .65rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.hero-panel ul { display: grid; gap: 13px; margin: 0; padding: 0; list-style: none; }
.hero-panel li { display: flex; gap: 11px; color: var(--text); font-size: .85rem; }
.hero-panel li::before { content: "✓"; color: var(--accent); }

.service-section { position: relative; padding: 104px 0; border-bottom: 1px solid rgba(120,222,218,.1); }
.section-heading { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(300px,.7fr); gap: 70px; align-items: end; margin-bottom: 48px; }
.section-heading > p { margin: 0; font-size: .98rem; }
.service-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.service-card { min-height: 250px; position: relative; padding: 28px; border: 1px solid var(--line); background: rgba(23,29,34,.84); }
.service-card::before { content: attr(data-index); display: block; margin-bottom: 56px; color: var(--accent); font-size: .67rem; font-weight: 750; letter-spacing: .12em; }
.service-card p { margin: 13px 0 0; font-size: .86rem; }
.case-study-section { --case-warm: #ffc96e; background: radial-gradient(circle at 86% 16%, rgba(255,201,110,.085), transparent 27rem), linear-gradient(180deg, rgba(10,14,16,.88), rgba(8,12,14,.96)); }
.case-study-section .section-heading h2 { color: #f4f7f8; }
.case-study-section .section-heading > p { color: #9eabb0; }
.case-study-section .eyebrow { color: var(--case-warm); }
.case-study-card { overflow: hidden; border: 1px solid rgba(255,201,110,.25); color: #f4f7f8; background: linear-gradient(145deg, rgba(33,32,27,.97), rgba(15,19,21,.99) 45%, rgba(8,12,15,.99)); box-shadow: 0 38px 100px rgba(0,0,0,.34); }
.case-study-main { display: grid; grid-template-columns: minmax(300px,.78fr) minmax(0,1.22fr); gap: 34px; align-items: center; padding: 34px; }
.case-study-copy { padding: 16px 0 16px 8px; }
.case-study-kicker { display: flex; align-items: center; justify-content: space-between; gap: 18px; color: rgba(255,255,255,.43); font-size: .59rem; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }
.case-study-kicker span:first-child { display: inline-flex; align-items: center; gap: 8px; }
.case-study-kicker span:first-child::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--case-warm); box-shadow: 0 0 12px rgba(255,201,110,.68); }
.case-study-copy h3 { margin-top: 34px; color: #fff; font-size: clamp(2.3rem,4.5vw,4.4rem); letter-spacing: -.06em; }
.case-study-copy > p { margin: 20px 0 0; color: #aeb8bc; font-size: .91rem; line-height: 1.75; }
.case-study-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 25px; }
.case-study-tags span { padding: 6px 9px; border: 1px solid rgba(255,201,110,.2); border-radius: 4px; color: #d2c2a5; background: rgba(255,201,110,.045); font-size: .61rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.case-study-copy .primary-link { margin-top: 30px; color: #11100e; background: var(--case-warm); }
.case-study-copy .primary-link:hover { background: #ffe1a8; }
.case-study-media { min-width: 0; margin: 0; overflow: hidden; border: 1px solid rgba(255,201,110,.22); background: #07090a; box-shadow: 0 28px 70px rgba(0,0,0,.36); }
.case-study-highlights { display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid rgba(255,201,110,.14); background: rgba(5,8,9,.34); }
.case-study-highlights span { position: relative; min-height: 74px; display: flex; align-items: center; padding: 17px 16px 17px 36px; border-right: 1px solid rgba(255,201,110,.12); color: #aeb8bc; font-size: .68rem; }
.case-study-highlights span:last-child { border-right: 0; }
.case-study-highlights span::before { content: ""; position: absolute; left: 18px; width: 6px; height: 6px; border-radius: 50%; background: var(--case-warm); box-shadow: 0 0 10px rgba(255,201,110,.58); }
.service-split { display: grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); gap: 86px; align-items: start; }
.service-split-copy > p:not(.eyebrow) { margin: 26px 0 0; }
.check-list { display: grid; gap: 0; border-top: 1px solid var(--line); }
.check-item { display: grid; grid-template-columns: 32px 1fr; gap: 15px; padding: 22px 0; border-bottom: 1px solid var(--line); }
.check-item > span { width: 27px; height: 27px; display: grid; place-items: center; border: 1px solid var(--line-strong); border-radius: 50%; color: var(--accent); font-size: .72rem; }
.check-item p { margin: 6px 0 0; font-size: .85rem; }
.process-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; border: 1px solid var(--line); background: var(--line); }
.process-step { min-height: 245px; padding: 26px; background: var(--bg); }
.process-step > span { color: var(--accent); font-size: .68rem; font-weight: 750; letter-spacing: .1em; }
.process-step h3 { margin-top: 46px; }
.process-step p { margin: 12px 0 0; font-size: .82rem; }
.faq-list { max-width: 900px; margin-top: 44px; border-top: 1px solid var(--line); }
.faq-list details { border-bottom: 1px solid var(--line); }
.faq-list summary { position: relative; padding: 24px 42px 24px 0; color: var(--text); font-weight: 700; cursor: pointer; list-style: none; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { content: "+"; position: absolute; right: 8px; color: var(--accent); font-size: 1.2rem; font-weight: 400; }
.faq-list details[open] summary::after { content: "−"; }
.faq-list details p { max-width: 760px; margin: -6px 0 24px; font-size: .9rem; }
.service-cta { display: grid; grid-template-columns: 1fr auto; gap: 40px; align-items: center; padding: 48px; border: 1px solid var(--line-strong); background: linear-gradient(120deg, rgba(120,222,218,.13), rgba(23,29,34,.78) 55%); }
.service-cta p { max-width: 670px; margin: 14px 0 0; }
.service-cta h2 { font-size: clamp(2rem,3.7vw,3.35rem); }

.service-footer { padding: 52px 0 26px; border-top: 1px solid var(--line); background: rgba(6,10,12,.84); }
.footer-main { display: grid; grid-template-columns: 1fr auto; gap: 45px; align-items: start; }
.footer-copy { max-width: 470px; margin: 17px 0 0; font-size: .8rem; }
.footer-links { display: grid; grid-template-columns: repeat(2,minmax(150px,1fr)); gap: 42px; }
.footer-links > div { display: flex; flex-direction: column; gap: 8px; }
.footer-links span { margin-bottom: 5px; color: var(--dim); font-size: .65rem; font-weight: 750; letter-spacing: .1em; text-transform: uppercase; }
.footer-links a, .footer-links address { color: var(--muted); font-size: .76rem; font-style: normal; }
.footer-links a:hover { color: var(--accent); }
.footer-bottom { display: flex; justify-content: space-between; gap: 25px; margin-top: 44px; padding-top: 18px; border-top: 1px solid var(--line); color: var(--dim); font-size: .65rem; text-transform: uppercase; }

html[data-theme="light"] { --bg: #f3f6f7; --surface: #ffffff; --surface-raised: #e5edef; --text: #172226; --muted: #53676e; --dim: #71858b; --line: rgba(42,166,164,.18); --line-strong: rgba(42,166,164,.4); --accent: #168b89; --accent-soft: #0f7373; }
html[data-theme="light"] .service-page { background-image: radial-gradient(circle at 12% 8%, rgba(42,166,164,.11), transparent 29%), radial-gradient(circle at 88% 25%, rgba(120,222,218,.11), transparent 25%), linear-gradient(rgba(42,166,164,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(42,166,164,.035) 1px, transparent 1px); }
html[data-theme="light"] .service-header { background: rgba(243,246,247,.9); }
html[data-theme="light"] .hero-panel, html[data-theme="light"] .service-card { background: rgba(255,255,255,.9); box-shadow: 0 24px 70px rgba(35,52,60,.08); }
html[data-theme="light"] .process-step { background: #f7f9fa; }
html[data-theme="light"] .service-cta { background: linear-gradient(120deg, rgba(120,222,218,.22), rgba(255,255,255,.9) 60%); }
html[data-theme="light"] .service-footer { background: rgba(227,234,236,.9); }

@media (max-width: 930px) {
  .service-nav-links { display: none; }
  .service-language { margin-left: auto; }
  .service-hero, .section-heading, .service-split { grid-template-columns: 1fr; gap: 42px; }
  .hero-panel { max-width: 680px; }
  .service-grid { grid-template-columns: repeat(2,1fr); }
  .case-study-main { grid-template-columns: 1fr; padding: 30px; }
  .case-study-copy { max-width: 760px; padding-left: 0; }
  .case-study-highlights { grid-template-columns: repeat(2,1fr); }
  .case-study-highlights span:nth-child(2) { border-right: 0; }
  .case-study-highlights span:nth-child(-n+2) { border-bottom: 1px solid rgba(255,201,110,.12); }
  .process-grid { grid-template-columns: repeat(2,1fr); }
}

@media (max-width: 640px) {
  .container { width: min(100% - 30px, var(--max)); }
  .service-nav { min-height: 62px; gap: 10px; }
  .service-brand span { display: none; }
  .nav-cta { display: none; }
  .breadcrumbs { padding-top: 26px; }
  .service-hero { padding: 60px 0 78px; }
  h1 { font-size: clamp(2.8rem,14vw,4.4rem); }
  .service-section { padding: 76px 0; }
  .service-grid, .process-grid { grid-template-columns: 1fr; }
  .service-card { min-height: 220px; }
  .case-study-main { gap: 24px; padding: 20px; }
  .case-study-copy { padding: 12px 3px 2px; }
  .case-study-kicker { align-items: flex-start; flex-direction: column; gap: 7px; }
  .case-study-copy .primary-link { width: 100%; }
  .case-study-highlights { grid-template-columns: 1fr; }
  .case-study-highlights span { min-height: 66px; border-right: 0; border-bottom: 1px solid rgba(255,201,110,.12); }
  .case-study-highlights span:last-child { border-bottom: 0; }
  .service-cta { grid-template-columns: 1fr; padding: 30px 24px; }
  .service-cta .primary-link { width: 100%; }
  .footer-main { grid-template-columns: 1fr; }
  .footer-links { grid-template-columns: 1fr 1fr; gap: 24px; }
  .footer-bottom { flex-direction: column; gap: 5px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; }
}
