:root {
  color-scheme: dark;
  --ink: #080d1c;
  --panel: #10182a;
  --paper: #f5f8ff;
  --muted: #bac8dc;
  --cyan: #52f3ff;
  --pink: #ff65ce;
  --lime: #dbff65;
  --line: #30445f;
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--ink); color: var(--paper); line-height: 1.55; }
a { color: inherit; }
img { display: block; width: 100%; height: auto; }
button, input, select, textarea { font: inherit; }
:focus-visible { outline: 3px solid var(--lime); outline-offset: 4px; }
.wrap { width: min(1240px, calc(100% - 64px)); margin-inline: auto; }
.skip { position: absolute; top: 8px; left: 8px; z-index: 10; padding: 10px; background: var(--cyan); color: var(--ink); transform: translateY(-160%); }
.skip:focus { transform: none; }
.service-area { padding: 5px 10px; border-bottom: 1px solid #25425d; background: #0c172a; color: var(--cyan); text-align: center; font-size: .71rem; font-weight: 850; letter-spacing: .19em; text-transform: uppercase; }
.site-header { border-bottom: 1px solid var(--line); background: #090f20; }
.header-inner { display: flex; min-height: 81px; align-items: center; justify-content: space-between; gap: 24px; }
.logo { width: 142px; flex: 0 0 142px; }
.logo img { aspect-ratio: 3 / 2; object-fit: contain; }
.nav { display: flex; align-items: center; gap: clamp(13px, 3vw, 36px); }
.nav a { text-decoration: none; font-size: .89rem; font-weight: 750; white-space: nowrap; }
.nav a:not(.button):hover, .nav a[aria-current="page"]:not(.button) { color: var(--cyan); }
.nav a[aria-current="page"]:not(.button) { text-decoration: underline; text-underline-offset: 7px; }
.button {
  display: inline-flex; min-height: 46px; justify-content: center; align-items: center; gap: 9px;
  border: 1px solid transparent; border-radius: 5px; padding: 10px 17px;
  background: var(--cyan); color: #071221; font-weight: 850; text-decoration: none; text-align: center; cursor: pointer;
}
.button:hover { background: #9ff9ff; }
.button.outline { background: #0b172b; border-color: #54809a; color: var(--paper); }
.button.outline:hover { background: #192c45; border-color: var(--cyan); }
.actions { display: flex; flex-wrap: wrap; gap: 11px; align-items: center; margin-top: 22px; }
.eyebrow { margin: 0 0 9px; color: var(--cyan); font-size: .72rem; line-height: 1.35; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.display {
  margin: 0; font-size: clamp(2.65rem, 5.75vw, 5.75rem); line-height: .94; letter-spacing: -.07em;
  text-transform: uppercase; font-style: italic; font-weight: 1000;
}
.display span { display: block; color: var(--cyan); text-shadow: 3px 4px #46316e; }
h2 { margin: 0 0 10px; font-size: clamp(1.85rem, 4vw, 3.25rem); line-height: 1.05; letter-spacing: -.045em; }
h3 { margin: 0 0 6px; font-size: 1.37rem; line-height: 1.15; letter-spacing: -.025em; }
p { margin: 0; }
.lede { color: var(--muted); font-size: clamp(1rem, 1.5vw, 1.14rem); max-width: 52ch; }
.hero {
  position: relative; overflow: hidden; isolation: isolate;
  background: radial-gradient(ellipse at 17% 47%, #212147 0%, transparent 65%), #080d1c;
  border-bottom: 1px solid #30415d;
}
.hero::before, .inner-hero::before {
  position: absolute; content: ""; inset: 0; z-index: -1; pointer-events: none;
  background-image: radial-gradient(#43bbed55 1px, transparent 1px); background-size: 9px 9px;
  mask-image: linear-gradient(155deg,#000,transparent 39%,transparent 80%,#000);
}
.hero-layout { display: grid; grid-template-columns: .82fr 1.18fr; gap: clamp(18px, 3vw, 42px); align-items: center; padding-block: 34px 40px; }
.hero-copy { position: relative; z-index: 1; }
.hero-copy .display { font-size: clamp(2.05rem, 4.12vw, 3.6rem); }
.hero-mascot { width: min(77%, 306px); margin: -22px 0 2px -10px; }
.hero-copy .lede { margin-top: 16px; }
.hero-phone { margin-top: 12px; }
.hero-phone a { display: inline-flex; align-items: center; min-height: 28px; color: var(--cyan); font-weight: 800; text-underline-offset: 4px; }
.hero-phone a:hover { color: var(--paper); }
.hero-art { position: relative; margin: 0; border: 1px solid #31869e; box-shadow: 6px 6px 0 #151d43, 10px 10px 0 #223759; overflow: hidden; }
.hero-art img { aspect-ratio: 1.36; object-fit: cover; }
.hero-art figcaption { position: absolute; right: 8px; bottom: 8px; padding: 3px 7px; border-radius: 3px; background: #080d1ce8; color: #e5f3ff; font-size: .65rem; }
.hero-art::after { content: ""; position: absolute; pointer-events: none; inset: 0; box-shadow: inset 0 -16px 36px #080d1c30; }
.benefit-bar { border-bottom: 1px solid var(--line); background: #0c1628; }
.benefit-bar .wrap { display: grid; grid-template-columns: repeat(3, 1fr); text-align: center; }
.benefit-bar span { padding: 12px 8px; color: var(--muted); font-size: .85rem; font-weight: 700; }
.benefit-bar span + span { border-left: 1px solid var(--line); }
.benefit-bar b { margin-right: 6px; color: var(--cyan); }
.section { padding: clamp(35px, 6vw, 74px) 0; }
.section-head { margin-bottom: 25px; }
.section-head .lede { margin-top: 7px; }
.service-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.card { --accent: var(--cyan); border: 1px solid var(--line); border-top: 3px solid var(--accent); background: var(--panel); }
.card:nth-child(2) { --accent: var(--pink); }
.card:nth-child(3) { --accent: var(--lime); }
.card > img { aspect-ratio: 3 / 2; object-fit: cover; border-bottom: 1px solid var(--line); }
.card-body { padding: 16px 17px 18px; }
.card-body p, .panel p { color: var(--muted); }
.card .eyebrow { color: var(--accent); }
.card a, .text-link { display: inline-block; margin-top: 12px; color: var(--cyan); font-weight: 800; text-underline-offset: 4px; }
.card a:hover, .text-link:hover { color: var(--paper); }
.inner-hero {
  position: relative; z-index: 0; isolation: isolate; overflow: hidden; border-bottom: 1px solid var(--line);
  background: linear-gradient(100deg,#0c1730 30%, #1c183c 85%);
}
.inner-hero .wrap { padding-block: clamp(36px, 7vw, 82px); }
.inner-hero .display { font-size: clamp(2.5rem, 6vw, 5.5rem); }
.inner-hero .lede { margin-top: 16px; }
.service-detail { display: grid; grid-template-columns: minmax(200px, .68fr) 1.32fr; gap: clamp(18px, 3vw, 39px); align-items: center; padding: 25px 0; border-bottom: 1px solid var(--line); scroll-margin-top: 15px; }
.service-detail:first-child { padding-top: 0; }
.service-detail img { aspect-ratio: 3 / 2; object-fit: cover; border: 1px solid #375d76; }
.service-detail p { color: var(--muted); max-width: 60ch; }
.detail-list { margin: 9px 0 0; padding-left: 19px; color: var(--muted); }
.detail-list li::marker { color: var(--cyan); }
.process-heading { margin-top: 18px; }
.about-course {
  position: relative; isolation: isolate; overflow: hidden; text-align: center;
  background: radial-gradient(ellipse at 50% 38%, #2b2552, transparent 68%), #0c1427;
}
.about-course::before {
  position: absolute; content: ""; inset: 0; z-index: -1; pointer-events: none;
  background-image: radial-gradient(#43bbed55 1px, transparent 1px); background-size: 9px 9px;
  mask-image: linear-gradient(110deg, #000, transparent 37%, transparent 63%, #000);
}
.about-course .wrap { padding-block: clamp(22px, 4vw, 42px) clamp(30px, 5vw, 56px); }
.about-course img { width: clamp(150px, 24vw, 245px); margin: 0 auto 8px; }
.about-course .display { font-size: clamp(2.1rem, 6.5vw, 4.6rem); }
.quote-band { border-block: 1px solid #395a73; background: linear-gradient(108deg,#102541,#221734 73%,#151e39); }
.quote-band .wrap { display: flex; gap: 18px; justify-content: space-between; align-items: center; padding-block: 24px; }
.quote-band h2 { font-size: clamp(1.55rem, 3vw, 2.45rem); margin-bottom: 4px; }
.quote-band p { color: var(--muted); }
.quote-band .button { flex-shrink: 0; }
.gallery-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 17px; max-width: 850px; }
.gallery-card { margin: 0; position: relative; background: var(--panel); border: 1px solid var(--line); }
.gallery-card img { aspect-ratio: 1.28; object-fit: cover; object-position: center; }
.gallery-card:first-child img { object-position: center 63%; }
.gallery-card figcaption { padding: 13px 16px; }
.gallery-card strong { display: block; }
.gallery-card span, .gallery-note { color: var(--muted); }
.gallery-note { margin-bottom: 20px; }
.gallery-note strong { color: var(--paper); }
.two-column { display: grid; grid-template-columns: 1.1fr .9fr; align-items: start; gap: clamp(20px, 5vw, 64px); }
.two-column p + p { margin-top: 14px; }
.panel { background: var(--panel); border: 1px solid var(--line); border-top: 3px solid var(--cyan); padding: clamp(17px, 3vw, 29px); }
.panel + .panel { margin-top: 15px; }
.values { margin: 0; }
.values div + div { margin-top: 13px; padding-top: 13px; border-top: 1px solid var(--line); }
.values dt { font-weight: 850; }
.values dd { margin: 3px 0 0; color: var(--muted); }
.contact-line { display: block; margin-top: 7px; color: var(--cyan); overflow-wrap: anywhere; }
.contact-line:hover { color: var(--paper); }
.quote-layout { grid-template-columns: 1.38fr .62fr; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.field { display: grid; gap: 5px; min-width: 0; }
.field.wide { grid-column: 1 / -1; }
.field label { font-size: .89rem; font-weight: 800; }
.field input, .field select, .field textarea { width: 100%; min-height: 44px; border-radius: 4px; padding: 8px 10px; border: 1px solid #4a6080; background: #0a1222; color: var(--paper); }
.field textarea { resize: vertical; }
.field small, .form-note, .form-status { color: var(--muted); font-size: .87rem; }
.form-note { margin-top: 13px; }
.form-status { margin-top: 11px; }
.form-status:empty { display: none; }
.site-footer { background: #090e1b; }
.footer-main { display: grid; grid-template-columns: 1.15fr 1fr 1fr; gap: 23px; padding: 26px 0; }
.footer-main strong { display: block; margin-bottom: 4px; }
.footer-main p, .footer-main a { color: var(--muted); font-size: .87rem; overflow-wrap: anywhere; }
.footer-main a:hover { color: var(--cyan); }
.footer-bottom { border-top: 1px solid var(--line); padding-block: 12px; color: var(--muted); font-size: .75rem; }
.footer-bottom .wrap { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 5px 14px; }
@media (max-width: 880px) {
  .wrap { width: min(100% - 40px,1240px); }
  .hero-layout { grid-template-columns: .88fr 1.12fr; }
  .nav { gap: 13px; }
}
@media (max-width: 680px) {
  .wrap { width: calc(100% - 32px); }
  .header-inner { min-height: auto; flex-direction: column; align-items: stretch; gap: 0; padding-bottom: 9px; }
  .logo { width: 108px; flex: none; align-self: center; }
  .nav { justify-content: center; flex-wrap: wrap; gap: 5px 12px; }
  .nav a { font-size: .76rem; padding-block: 7px; }
  .nav a.button { min-height: 32px; padding: 5px 8px; }
  .hero-layout, .two-column, .service-detail { grid-template-columns: 1fr; }
  .hero-layout { padding-block: 18px 26px; gap: 24px; }
  .hero-copy .display { font-size: clamp(1.95rem, 9.25vw, 4.05rem); }
  .hero-mascot { width: 187px; margin: -13px 0 -1px -6px; }
  .hero-art { margin-right: 7px; }
  .hero-art img { aspect-ratio: 1.52; }
  .benefit-bar span { font-size: .72rem; padding: 9px 4px; }
  .benefit-bar b { display: none; }
  .service-grid { grid-template-columns: 1fr; }
  .service-detail img { max-width: 425px; }
  .quote-band .wrap { align-items: flex-start; flex-direction: column; }
  .footer-main { grid-template-columns: 1fr 1fr; }
  .footer-main > div:first-child { grid-column: 1 / -1; }
}
@media (max-width: 400px) {
  .nav { gap: 4px 9px; }
  .nav a { font-size: .72rem; }
  .form-grid { grid-template-columns: 1fr; }
  .footer-main { grid-template-columns: 1fr; }
}

[hidden] { display: none !important; }