.service-page {
  --svc-bg: #071a29;
  --svc-bg-soft: #0b2940;
  --svc-paper: #f0eee7;
  --svc-accent: #70cfff;
  --svc-accent-2: #c8ff32;
  --svc-text: #f4f3ed;
  --svc-muted: #b7c4cb;
  --svc-line: rgba(255,255,255,.2);
  overflow: hidden;
  background: var(--svc-bg);
  color: var(--svc-text);
}

.service-theme-technical { --svc-bg:#11130f; --svc-bg-soft:#1a1e16; --svc-accent:#c8ff32; --svc-accent-2:#70cfff; --svc-muted:#b9bbb2; }
.service-theme-future { --svc-bg:#05070c; --svc-bg-soft:#0b1018; --svc-accent:#baff1f; --svc-accent-2:#ff4fd8; --svc-muted:#aebbc5; }
.service-theme-eja { --svc-bg:#2a160c; --svc-bg-soft:#442416; --svc-paper:#f5eadb; --svc-accent:#ffc85c; --svc-accent-2:#ff7448; --svc-muted:#dcc6b4; }

body:has(.service-page) .site-header { border-color: var(--line); }
body:has(.service-page) .site-footer { padding-top: 64px; }
body:has(.service-page) .footer-grid { margin-top: 0; }

.service-hero { min-height: 100svh; position: relative; display: grid; grid-template-columns: minmax(0,1.18fr) minmax(400px,.82fr); isolation: isolate; background: var(--svc-bg); }
.service-hero::before { content:""; position:absolute; inset:0; z-index:-2; background:radial-gradient(circle at 75% 35%, color-mix(in srgb,var(--svc-accent) 18%,transparent),transparent 30%),linear-gradient(115deg,transparent 55%,rgba(255,255,255,.035)); }
.service-hero-grid { position:absolute; inset:0; z-index:-1; opacity:.22; background-image:linear-gradient(var(--svc-line) 1px,transparent 1px),linear-gradient(90deg,var(--svc-line) 1px,transparent 1px); background-size:8vw 8vw; -webkit-mask-image:linear-gradient(90deg,transparent,#000 40%,#000); mask-image:linear-gradient(90deg,transparent,#000 40%,#000); }
.service-hero-copy { min-width:0; padding:clamp(145px,13vw,220px) 4vw 80px; display:flex; flex-direction:column; justify-content:center; }
.service-hero-meta { display:flex; justify-content:space-between; gap:20px; margin-bottom:clamp(34px,4vw,66px); color:var(--svc-accent); font-size:9px; letter-spacing:.17em; }
.service-hero h1 { margin:0; font:clamp(3.6rem,6.7vw,8rem)/.86 var(--display); letter-spacing:-.078em; text-transform:uppercase; }
.service-hero h1 em { color:var(--svc-accent); font-style:normal; }
.service-hero-bottom { margin-top:clamp(35px,4vw,65px); display:grid; grid-template-columns:minmax(230px,1fr) auto; gap:clamp(28px,4vw,70px); align-items:end; }
.service-hero-bottom p { max-width:520px; margin:0; color:var(--svc-muted); font-size:clamp(14px,1.1vw,18px); line-height:1.7; }
.service-button { width:min(100%,350px); min-height:62px; padding:18px 21px; display:flex; align-items:center; justify-content:space-between; gap:22px; background:var(--svc-accent); color:#10130d; font:10px var(--display); letter-spacing:.04em; text-transform:uppercase; transition:transform .2s,background .2s; }
.service-button:hover { background:var(--svc-accent-2); }
.service-button span,.service-button b { font-size:20px; font-weight:400; }
.service-hero-visual { position:relative; min-width:0; margin:0; overflow:hidden; border-left:1px solid var(--svc-line); }
.service-hero-visual::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,var(--svc-bg),transparent 28%),linear-gradient(0deg,var(--svc-bg),transparent 38%),linear-gradient(180deg,rgba(0,0,0,.28),transparent 30%); }
.service-hero-visual img { width:100%; height:100%; object-fit:cover; filter:saturate(.72) contrast(1.12); }
.service-hero-visual figcaption { position:absolute; right:3vw; bottom:34px; left:3vw; z-index:2; padding-top:13px; border-top:1px solid var(--svc-line); color:var(--svc-muted); font-size:8px; letter-spacing:.13em; text-transform:uppercase; }
.service-hero-visual.is-typographic { display:grid; place-items:center; background:linear-gradient(145deg,var(--svc-bg-soft),var(--svc-accent)); }
.service-lettering { color:transparent; font:clamp(10rem,24vw,28rem)/1 var(--display); letter-spacing:-.13em; -webkit-text-stroke:2px rgba(255,255,255,.55); transform:rotate(-90deg); }
.service-scroll { position:absolute; left:4vw; bottom:28px; z-index:3; font-size:8px; letter-spacing:.15em; }
.service-scroll span { margin-left:15px; color:var(--svc-accent); font-size:17px; }

.service-theme-future .service-hero::after { content:"SYSTEM / LEARN / BUILD / 2030"; position:absolute; right:-120px; bottom:180px; z-index:3; color:var(--svc-accent-2); font:10px var(--display); letter-spacing:.4em; transform:rotate(90deg); }
.service-theme-future .service-hero-visual img { filter:saturate(1.1) contrast(1.15) hue-rotate(-8deg); }
.service-theme-future .service-hero-visual::before { content:""; position:absolute; inset:8% 10%; z-index:2; border:1px solid color-mix(in srgb,var(--svc-accent) 65%,transparent); box-shadow:28px -24px 0 -27px var(--svc-accent-2),-30px 30px 0 -29px var(--svc-accent); }
.service-theme-future .service-hero h1 em { color:transparent; -webkit-text-stroke:2px var(--svc-accent); text-shadow:5px 5px 0 color-mix(in srgb,var(--svc-accent-2) 75%,transparent); }

.service-jumpbar { min-height:58px; padding:0 4vw; display:flex; align-items:center; justify-content:space-between; gap:24px; overflow:hidden; background:var(--svc-accent); color:#11130f; font:9px var(--display); letter-spacing:.07em; white-space:nowrap; }
.service-jumpbar i { font-style:normal; font-size:16px; }

.service-reality,.service-featured,.service-catalog,.service-benefits,.service-journey,.service-faq { padding:clamp(95px,9vw,165px) max(24px,4vw); }
.service-reality { background:var(--svc-paper); color:#11130f; }
.service-section-head { max-width:1520px; margin:0 auto clamp(60px,7vw,110px); display:grid; grid-template-columns:minmax(150px,.28fr) minmax(440px,1.1fr) minmax(260px,.48fr); gap:clamp(28px,5vw,90px); align-items:end; }
.service-section-head>span { align-self:start; padding-top:8px; font-size:9px; letter-spacing:.16em; }
.service-section-head h2 { margin:0; font:clamp(3.1rem,5.8vw,6.8rem)/.88 var(--display); letter-spacing:-.07em; text-transform:uppercase; }
.service-section-head>p { margin:0 0 8px; color:#55594f; font-size:14px; line-height:1.7; }
.service-featured .service-section-head>p,.service-journey .service-section-head>p { color:var(--svc-muted); }

.reality-grid { max-width:1520px; margin:auto; display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid rgba(17,19,15,.28); border-left:1px solid rgba(17,19,15,.28); }
.reality-card { min-height:320px; padding:30px; display:flex; flex-direction:column; border-right:1px solid rgba(17,19,15,.28); border-bottom:1px solid rgba(17,19,15,.28); }
.reality-card>span { font-size:8px; letter-spacing:.15em; }
.reality-card h3 { margin:auto 0 20px; max-width:390px; font:clamp(1.7rem,2.5vw,3rem)/.95 var(--display); letter-spacing:-.05em; text-transform:uppercase; }
.reality-card p { max-width:430px; margin:0; color:#5c6056; font-size:13px; line-height:1.65; }
.reality-statement { max-width:1150px; margin:clamp(75px,8vw,130px) auto 0; padding-left:clamp(28px,6vw,90px); border-left:5px solid var(--svc-accent); font:clamp(2.3rem,4.5vw,5.4rem)/.95 var(--display); letter-spacing:-.055em; text-transform:uppercase; }

.service-featured { position:relative; background:var(--svc-bg); }
.service-featured::before { content:""; position:absolute; inset:0; opacity:.15; pointer-events:none; background:radial-gradient(circle at 10% 10%,var(--svc-accent),transparent 27%); }
.featured-courses { position:relative; max-width:1520px; margin:auto; display:grid; grid-template-columns:repeat(auto-fit,minmax(290px,1fr)); border-top:1px solid var(--svc-line); border-left:1px solid var(--svc-line); }
.featured-course { min-height:520px; padding:clamp(25px,2.5vw,42px); display:flex; flex-direction:column; border-right:1px solid var(--svc-line); border-bottom:1px solid var(--svc-line); transition:background .3s,transform .3s; }
.featured-course:hover { background:var(--svc-bg-soft); transform:translateY(-8px); }
.featured-course-top { display:flex; justify-content:space-between; gap:20px; color:var(--svc-accent); font-size:8px; letter-spacing:.13em; text-transform:uppercase; }
.featured-course h3 { margin:auto 0 28px; font:clamp(2.1rem,3vw,3.8rem)/.92 var(--display); letter-spacing:-.06em; text-transform:uppercase; }
.featured-course p { min-height:90px; margin:0; color:var(--svc-muted); font-size:13px; line-height:1.65; }
.featured-course-bottom { margin-top:38px; padding-top:20px; display:flex; justify-content:space-between; gap:20px; align-items:center; border-top:1px solid var(--svc-line); }
.featured-course-bottom strong { font-size:10px; }
.featured-course-bottom a { color:var(--svc-accent); font:9px var(--display); }
.featured-course-bottom b { margin-left:12px; font-size:16px; }
.service-featured.is-spotlight .featured-course { min-height:610px; overflow:hidden; position:relative; }
.service-featured.is-spotlight .featured-course::after { position:absolute; right:-10px; top:50px; color:transparent; font:9rem/1 var(--display); -webkit-text-stroke:1px color-mix(in srgb,var(--svc-accent) 35%,transparent); opacity:.7; }
.service-featured.is-spotlight .featured-course:nth-child(1)::after { content:"BOT"; }
.service-featured.is-spotlight .featured-course:nth-child(2)::after { content:"AI"; color:color-mix(in srgb,var(--svc-accent-2) 15%,transparent); }
.service-featured.is-spotlight .featured-course:nth-child(3)::after { content:"EN"; }
.service-featured.is-spotlight .featured-course:nth-child(2) { background:linear-gradient(155deg,color-mix(in srgb,var(--svc-accent-2) 17%,transparent),transparent 55%); }

.service-catalog { background:var(--svc-paper); color:#11130f; }
.service-catalog-list { max-width:1520px; margin:auto; border-top:1px solid rgba(17,19,15,.3); }
.catalog-line { min-height:170px; padding:28px 18px; display:grid; grid-template-columns:70px minmax(0,1fr) 170px; gap:28px; align-items:center; border-bottom:1px solid rgba(17,19,15,.3); }
.catalog-line>span { font:1rem var(--display); }
.catalog-line small { font-size:8px; letter-spacing:.13em; text-transform:uppercase; }
.catalog-line h3 { margin:9px 0; font:clamp(1.7rem,2.7vw,3.2rem)/1 var(--display); letter-spacing:-.055em; text-transform:uppercase; }
.catalog-line p { max-width:720px; margin:0; color:#5c6056; font-size:13px; line-height:1.55; }
.catalog-line>a { padding:16px; display:flex; justify-content:space-between; border:1px solid #11130f; font:9px var(--display); }
.catalog-line>a:hover { background:#11130f; color:var(--svc-accent); }

.service-benefits { background:var(--svc-accent); color:#11130f; }
.service-benefits .service-section-head>p { color:#303624; }
.benefit-grid { max-width:1520px; margin:auto; display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid rgba(17,19,15,.35); border-left:1px solid rgba(17,19,15,.35); }
.benefit-card { min-height:370px; padding:30px; display:flex; flex-direction:column; border-right:1px solid rgba(17,19,15,.35); border-bottom:1px solid rgba(17,19,15,.35); }
.benefit-card strong { font:clamp(2.2rem,3.8vw,4.5rem)/1 var(--display); letter-spacing:-.07em; }
.benefit-card h3 { margin:auto 0 20px; font:1.35rem/1 var(--display); letter-spacing:-.04em; text-transform:uppercase; }
.benefit-card p { margin:0; color:#353a29; font-size:12px; line-height:1.65; }
.service-theme-future .service-benefits { background:linear-gradient(115deg,var(--svc-accent) 0 60%,#ecffb9); }
.service-theme-future .benefit-card:nth-child(even) { background:rgba(255,79,216,.12); }

.service-journey { background:var(--svc-bg-soft); }
.service-journey .service-section-head { grid-template-columns:minmax(150px,.28fr) 1.58fr; }
.journey-steps { max-width:1160px; margin:0 0 0 auto; padding:0; list-style:none; border-top:1px solid var(--svc-line); }
.journey-steps li { min-height:190px; padding:35px 12px; display:grid; grid-template-columns:90px 1fr; gap:28px; align-items:center; border-bottom:1px solid var(--svc-line); }
.journey-steps li>span { color:var(--svc-accent); font:1rem var(--display); }
.journey-steps h3 { margin:0 0 14px; font:clamp(2rem,3.7vw,4.4rem)/.95 var(--display); letter-spacing:-.06em; text-transform:uppercase; }
.journey-steps p { max-width:620px; margin:0; color:var(--svc-muted); font-size:13px; line-height:1.65; }

.service-faq { background:var(--svc-paper); color:#11130f; }
.service-faq .service-section-head { grid-template-columns:minmax(150px,.28fr) 1.58fr; }
.faq-list { max-width:1160px; margin:0 0 0 auto; border-top:1px solid rgba(17,19,15,.3); }
.faq-list details { border-bottom:1px solid rgba(17,19,15,.3); }
.faq-list summary { min-height:105px; display:grid; grid-template-columns:65px 1fr auto; gap:20px; align-items:center; list-style:none; cursor:pointer; font:clamp(1.2rem,2vw,2rem)/1.1 var(--display); letter-spacing:-.035em; text-transform:uppercase; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary span { font:9px var(--body); }
.faq-list summary b { width:42px; height:42px; display:grid; place-items:center; border:1px solid rgba(17,19,15,.35); border-radius:50%; font:20px var(--body); transition:transform .25s,background .25s; }
.faq-list details[open] summary b { transform:rotate(45deg); background:var(--svc-accent); }
.faq-list details>p { max-width:720px; margin:-12px 55px 34px 85px; color:#565a50; line-height:1.7; }

.service-closing { padding:clamp(80px,8vw,135px) max(24px,4vw); background:var(--svc-accent); color:#11130f; }
.service-closing>span { font-size:9px; letter-spacing:.16em; }
.service-closing h2 { max-width:1400px; margin:28px 0 50px; font:clamp(3.7rem,8vw,9.5rem)/.84 var(--display); letter-spacing:-.078em; text-transform:uppercase; }
.service-closing>div { padding-top:28px; display:flex; justify-content:space-between; gap:45px; align-items:center; border-top:3px solid #11130f; }
.service-closing p { max-width:580px; margin:0; font-size:14px; line-height:1.65; }
.service-button-dark { background:#11130f; color:var(--svc-accent); }
.service-button-dark:hover { background:var(--svc-bg-soft); color:var(--svc-accent); }

@media (max-width: 1100px) {
  .service-hero { grid-template-columns:minmax(0,1.1fr) minmax(340px,.9fr); }
  .service-hero-bottom { grid-template-columns:1fr; }
  .service-section-head { grid-template-columns:130px 1fr; }
  .service-section-head>p { grid-column:2; max-width:650px; }
  .benefit-grid { grid-template-columns:repeat(2,1fr); }
}

@media (max-width: 1050px) {
  body:has(.service-page) .site-header { grid-template-columns:1fr auto; }
  body:has(.service-page) .desktop-nav,body:has(.service-page) .header-cta { display:none; }
  body:has(.service-page) .menu-toggle { display:block; padding:10px 0; border:0; background:none; color:inherit; font-size:10px; letter-spacing:.12em; text-transform:uppercase; }
  body:has(.service-page) .mobile-menu { position:absolute; top:78px; right:0; left:0; padding:28px 4vw; flex-direction:column; gap:22px; border-top:1px solid var(--svc-line); border-bottom:1px solid var(--svc-line); background:var(--svc-bg); font-size:11px; letter-spacing:.08em; text-transform:uppercase; }
  body:has(.service-page) .mobile-menu.open { display:flex; }
}

@media (max-width: 800px) {
  .service-hero { min-height:auto; display:block; padding-top:76px; }
  .service-hero-copy { min-height:720px; padding:100px 24px 75px; }
  .service-hero-visual { height:560px; border-top:1px solid var(--svc-line); border-left:0; }
  .service-scroll { display:none; }
  .service-jumpbar { justify-content:flex-start; overflow-x:auto; }
  .service-section-head { display:block; }
  .service-section-head>span { display:block; margin-bottom:28px; }
  .service-section-head>p { max-width:600px; margin-top:28px; }
  .reality-grid { grid-template-columns:1fr; }
  .reality-card { min-height:270px; }
  .featured-courses { grid-template-columns:1fr; }
  .featured-course,.service-featured.is-spotlight .featured-course { min-height:450px; }
  .catalog-line { grid-template-columns:45px 1fr; }
  .catalog-line>a { grid-column:2; width:min(100%,220px); }
  .service-journey .service-section-head,.service-faq .service-section-head { display:block; }
  .journey-steps,.faq-list { margin-left:0; }
}

@media (max-width: 600px) {
  .service-hero-copy { min-height:650px; padding:85px 20px 65px; }
  .service-hero-meta { margin-bottom:45px; }
  .service-hero h1 { font-size:13vw; }
  .service-hero-bottom { margin-top:35px; }
  .service-hero-bottom p { font-size:13px; }
  .service-hero-visual { height:430px; }
  .service-lettering { font-size:50vw; }
  .service-jumpbar { min-height:50px; padding:0 20px; gap:18px; font-size:8px; }
  .service-reality,.service-featured,.service-catalog,.service-benefits,.service-journey,.service-faq { padding:85px 20px; }
  .service-section-head { margin-bottom:55px; }
  .service-section-head h2 { font-size:12.5vw; }
  .reality-card { min-height:245px; padding:25px 20px; }
  .reality-statement { margin-top:70px; padding-left:22px; font-size:9.5vw; }
  .featured-course,.service-featured.is-spotlight .featured-course { min-height:430px; padding:25px 20px; }
  .featured-course h3 { font-size:9vw; }
  .featured-course p { min-height:0; }
  .catalog-line { min-height:190px; padding:25px 0; grid-template-columns:32px 1fr; gap:12px; }
  .catalog-line h3 { font-size:7vw; }
  .benefit-grid { grid-template-columns:1fr; }
  .benefit-card { min-height:285px; padding:25px 20px; }
  .journey-steps li { min-height:170px; grid-template-columns:45px 1fr; padding:28px 0; gap:14px; }
  .journey-steps h3 { font-size:8vw; }
  .faq-list summary { min-height:95px; grid-template-columns:30px 1fr 38px; gap:12px; font-size:1.05rem; }
  .faq-list summary b { width:36px; height:36px; }
  .faq-list details>p { margin:0 10px 28px 42px; font-size:13px; }
  .service-closing { padding:75px 20px 85px; }
  .service-closing h2 { margin:24px 0 38px; font-size:13vw; }
  .service-closing>div { display:block; }
  .service-closing p { margin-bottom:28px; font-size:13px; }
  .service-button { width:100%; }
  body:has(.service-page) .site-footer { padding-top:55px; }
}

@media (prefers-reduced-motion: reduce) {
  .featured-course,.service-button { transition:none; }
}