:root {
  --bg:#101010;
  --surface:#171717;
  --text:#f4f2ec;
  --muted:#9c9a94;
  --line:#30302e;
  --lime:#d6f86a;
  --violet:#9b8cff;
  --mono:'DM Mono',monospace;
  --sans:'Manrope',sans-serif
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:28px
}
body {
  position:relative;
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:var(--sans);
  overflow-x:clip
}
.ambient {
  max-width:100%;
  position:absolute;
  pointer-events:none;
  filter:blur(90px);
  opacity:.18;
  border-radius:50%
}
.ambient-one {
  width:34rem;
  height:34rem;
  background:var(--violet);
  top:8rem;
  right:0
}
.ambient-two {
  width:28rem;
  height:28rem;
  background:var(--lime);
  top:90rem;
  left:0
}
.site-header {
  height:76px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  max-width:1240px;
  margin:auto;
  padding:0 40px;
  border-bottom:1px solid var(--line);
  position:relative;
  z-index:2
}
.brand {
  color:var(--text);
  font-weight:800;
  font-size:1.15rem;
  letter-spacing:-.04em;
  text-decoration:none
}
.brand-mark {
  color:var(--lime);
  margin-right:5px
}
.desktop-nav {
  display:flex;
  gap:32px
}
.desktop-nav a,.footer-links a {
  color:var(--muted);
  font-size:.82rem;
  text-decoration:none
}
.desktop-nav a:hover,.footer-links a:hover {
  color:var(--text)
}
.button {
  display:inline-flex;
  align-items:center;
  gap:22px;
  background:var(--lime);
  color:#121212;
  border:0;
  border-radius:2px;
  padding:15px 18px;
  font-weight:700;
  text-decoration:none;
  font-size:.82rem;
  cursor:pointer
}
.button span {
  font-size:1.1rem
}
.button-small {
  padding:10px 13px;
  gap:14px;
  font-size:.75rem
}
.menu-toggle {
  display:none;
  background:none;
  color:var(--text);
  border:0;
  font-size:1.3rem
}
.section {
  max-width:1160px;
  margin:auto;
  padding:130px 40px
}
.eyebrow {
  font:500 .68rem var(--mono);
  text-transform:uppercase;
  letter-spacing:.12em;
  color:var(--muted);
  margin-bottom:27px
}
.status-dot {
  display:inline-block;
  width:7px;
  height:7px;
  background:var(--lime);
  border-radius:50%;
  margin-right:9px;
  box-shadow:0 0 14px var(--lime)
}
h1,h2,h3,p {
  margin-top:0
}
h1 {
  font-size:clamp(3rem,6vw,6rem);
  line-height:1.04;
  letter-spacing:-.065em;
  margin-bottom:32px
}
h1 em,h2 em,blockquote em {
  font-style:normal;
  color:var(--lime)
}
.hero {
  min-height:740px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 340px;
  gap:48px;
  align-items:center;
  padding-top:120px
}
.hero-copy {
  max-width:450px;
  color:var(--muted);
  line-height:1.7;
  font-size:1rem
}
.hero-actions {
  display:flex;
  align-items:center;
  gap:28px;
  margin-top:38px
}
.text-link {
  color:var(--text);
  text-decoration:none;
  font-size:.8rem
}
.text-link span {
  color:var(--lime);
  margin-left:10px
}
.hero-orbit {
  position:relative;
  width:100%;
  aspect-ratio:1;
  align-self:center
}
.orbit-ring {
  position:absolute;
  border:1px solid #35352f;
  border-radius:50%;
  inset:0
}
.ring-two {
  inset:48px;
  border-color:#454444
}
.orbit-core {
  position:absolute;
  inset:32%;
  background:linear-gradient(145deg,#292828,#161616);
  border:1px solid #555;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  border-radius:50%;
  box-shadow:0 0 60px #9b8cff30
}
.orbit-core span {
  font-size:2rem;
  color:var(--lime)
}
.orbit-core small {
  font: .55rem var(--mono);
  color:var(--muted);
  margin-top:8px
}
.orbit-node {
  position:absolute;
  background:var(--surface);
  border:1px solid var(--line);
  padding:8px 12px;
  font: .65rem var(--mono);
  color:var(--muted)
}
.node-a {
  top:5%;
  left:44%
}
.node-b {
  bottom:10%;
  right:2%
}
.node-c {
  top:45%;
  left:0
}
.section-intro {
  display:grid;
  grid-template-columns:1fr 1fr;
  column-gap:40px;
  align-items:start
}
.section-intro h2 {
  font-size:clamp(2.8rem,5vw,5.5rem);
  letter-spacing:-.08em;
  line-height:.95
}
.section-intro>.eyebrow {
  grid-column:1 / -1
}
.section-intro p {
  color:var(--muted);
  line-height:1.7;
  max-width:310px;
  margin-top:20px
}
.feature-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin-top:70px
}
.feature-card {
  position:relative;
  background:var(--surface);
  border:1px solid var(--line);
  padding:28px;
  min-height:360px
}
.feature-wide {
  grid-column:span 2;
  min-height:290px
}
.card-top {
  display:flex;
  justify-content:space-between;
  color:var(--muted);
  font: .65rem var(--mono)
}
.card-icon {
  color:var(--lime);
  font-size:1.2rem
}
.feature-card h3 {
  font-size:1.65rem;
  letter-spacing:-.06em;
  margin:70px 0 12px
}
.feature-card p {
  color:var(--muted);
  line-height:1.6;
  max-width:360px;
  font-size:.87rem
}
.path-visual {
  display:flex;
  align-items:center;
  gap:12px;
  margin-top:45px;
  font: .62rem var(--mono);
  color:var(--muted)
}
.path-visual i {
  height:1px;
  background:var(--lime);
  width:55px
}
.chat-visual {
  margin-top:42px;
  display:grid;
  gap:8px;
  font:.65rem var(--mono)
}
.chat-visual span,.chat-visual b {
  padding:10px;
  background:#222;
  border:1px solid #343434;
  font-weight:400
}
.chat-visual b {
  color:var(--lime);
  margin-left:25px
}
.bars {
  display:flex;
  align-items:end;
  gap:7px;
  height:80px;
  margin-top:45px
}
.bars i {
  width:20px;
  background:var(--lime);
  height:30%
}
.bars i:nth-child(2) {
  height:48%
}
.bars i:nth-child(3) {
  height:42%
}
.bars i:nth-child(4) {
  height:78%
}
.bars i:nth-child(5) {
  height:100%
}
.statement {
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line)
}
blockquote {
  font-size:clamp(2.4rem,5vw,5.3rem);
  line-height:1.05;
  letter-spacing:-.08em;
  max-width:900px;
  margin:0 0 45px
}
.statement>p {
  color:var(--muted);
  max-width:430px;
  line-height:1.7;
  margin-left:50%
}
.split-section {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px
}
.split-card {
  min-height:480px;
  padding:38px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end
}
.family-card {
  background:var(--lime);
  color:#121212
}
.school-card {
  background:var(--violet);
  color:#121212
}
.split-card .eyebrow {
  color:#454b27
}
.school-card .eyebrow {
  color:#4e477d
}
.split-card h2 {
  font-size:2.7rem;
  line-height:1;
  letter-spacing:-.08em;
  max-width:340px
}
.split-card p {
  max-width:300px;
  line-height:1.6;
  font-size:.9rem;
  margin-bottom:38px
}
.split-card .text-link,.split-card .text-link span {
  color:#121212
}
.steps .section-intro {
  display:block
}
.steps {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px
}
.step-list {
  border-top:1px solid var(--line)
}
.step {
  display:grid;
  grid-template-columns:70px 1fr;
  gap:10px;
  padding:22px 0;
  border-bottom:1px solid var(--line)
}
.step>span {
  font: .65rem var(--mono);
  color:var(--lime)
}
.step h3 {
  margin:0 0 7px;
  font-size:1.1rem
}
.step p {
  margin:0;
  color:var(--muted);
  font-size:.85rem
}
.contact {
  text-align:center;
  position:relative
}
.contact h2 {
  font-size:clamp(3rem,7vw,7rem);
  letter-spacing:-.09em;
  line-height:.92
}
.contact>p {
  color:var(--muted);
  max-width:390px;
  margin:30px auto;
  line-height:1.7
}
.site-footer {
  max-width:1160px;
  margin:auto;
  padding:30px 40px 45px;
  border-top:1px solid var(--line);
  display:flex;
  justify-content:space-between;
  align-items:center
}
.footer-meta {
  display:flex;
  gap:30px;
  color:var(--muted);
  font:.65rem var(--mono)
}
.footer-links {
  display:flex;
  gap:18px
}
.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0
}

.hero-content {
  min-width:0
}

.hero-content h1 em {
  display:inline-block
}

.card-link {
  color:inherit;
  text-decoration:none
}

.card-link::after {
  content:"";
  position:absolute;
  inset:0
}

.card-link span {
  display:inline-block;
  color:var(--lime);
  font-size:1rem;
  vertical-align:middle
}

.feature-card:hover {
  border-color:#6d7d3f
}

.card-top .card-icon {
  display:none
}

.text-link:hover {
  text-decoration:underline;
  text-underline-offset:5px
}

.button:hover {
  background:#e2ff92
}

:focus-visible {
  outline:2px solid var(--lime);
  outline-offset:5px
}

.split-card :focus-visible {
  outline-color:#121212
}

.contact-actions {
  display:flex;
  justify-content:center;
  gap:12px;
  flex-wrap:wrap
}

.contact address {
  font:normal .8rem/1.8 var(--mono);
  color:var(--muted);
  margin-top:30px
}

.contact .contact-availability {
  font-size:.8rem;
  max-width:440px
}

[hidden] {
  display:none!important
}

body:has(dialog[open]) {
  overflow:hidden
}

dialog {
  color:var(--text);
  background:#181818;
  border:1px solid #45453f;
  border-radius:8px;
  max-width:680px;
  width:calc(100% - 32px);
  max-height:calc(100dvh - 48px);
  padding:48px;
  overscroll-behavior:contain
}

dialog::backdrop {
  background:#000b;
  backdrop-filter:blur(10px)
}

.dialog-close {
  position:absolute;
  right:14px;
  top:14px;
  width:36px;
  height:36px;
  border:1px solid var(--line);
  border-radius:50%;
  background:#242424;
  color:var(--text);
  cursor:pointer;
  font-size:1.4rem
}

dialog h2 {
  font-size:2.7rem;
  letter-spacing:-.055em;
  line-height:1.08;
  max-width:490px
}

dialog p,.legal-body p {
  color:var(--muted);
  line-height:1.75;
  font-size:.9rem
}

.detail-list {
  padding:0;
  list-style:none;
  counter-reset:detail;
  margin:28px 0
}

.detail-list li {
  counter-increment:detail;
  position:relative;
  padding:20px 0 12px 40px;
  border-top:1px solid var(--line)
}

.detail-list li::before {
  content:"0" counter(detail);
  position:absolute;
  left:0;
  top:23px;
  font:.65rem var(--mono);
  color:var(--lime)
}

.detail-list h3 {
  font-size:1rem;
  margin-bottom:8px
}

.preview-question {
  padding:24px;
  border:1px solid var(--line);
  background:#121212
}

.preview-question>.eyebrow {
  display:block;
  line-height:1.7
}

.preview-question h3 {
  line-height:1.5;
  font-size:1.05rem
}

#preview-form label {
  display:block;
  font-size:.8rem;
  margin-bottom:10px
}

.answer-row {
  display:flex;
  gap:10px
}

.answer-row input {
  min-width:0;
  flex:1;
  background:#202020;
  border:1px solid #53534b;
  padding:14px;
  color:var(--text);
  font: .9rem var(--mono)
}

.hint-button,.reset-preview {
  background:none;
  border:0;
  padding:0;
  font-family:inherit;
  cursor:pointer;
  margin-top:20px
}
.reset-preview {
  display:block;
}

#preview-feedback {
  color:var(--lime);
  margin-top:16px;
  overflow-wrap:anywhere
}

#preview-feedback:empty {
  display:none
}

#preview-hint {
  padding:12px;
  border-left:2px solid var(--violet)
}

.booking-info {
  margin-top:28px
}

.booking-info h3 {
  font-size:1rem
}

.legal-body {
  max-width:820px;
  padding-top:90px;
  min-height:70vh
}

.legal-body h1 {
  font-size:clamp(2.6rem,6vw,4.5rem)
}

.legal-body h2 {
  font-size:1.3rem;
  margin-top:36px
}

.legal-body a {
  color:var(--lime)
}

@media(max-width:1000px) {
  
.hero {
  grid-template-columns:minmax(0,1fr) 280px;
  gap:32px
}

.hero-content h1 {
  font-size:clamp(2.8rem,6.1vw,4.5rem)
}

.footer-meta {
  flex-direction:column;
  gap:8px
}


}

@media(max-width:900px) {
  
.hero {
  grid-template-columns:1fr;
  padding-top:90px;
  gap:60px
}

.hero-content h1 {
  font-size:clamp(2.6rem,8vw,5rem)
}

.hero-orbit {
  width:min(340px,100%);
  justify-self:center
}


}

@media(max-width:760px) {
  
.site-header {
  padding:0 20px
}

.desktop-nav,.header-cta {
  display:none
}

.menu-toggle {
  display:block;
  cursor:pointer
}

.desktop-nav.mobile-open {
  position:absolute;
  display:flex;
  flex-direction:column;
  gap:0;
  top:76px;
  left:0;
  right:0;
  margin:0;
  padding:12px 20px;
  background:var(--surface);
  border-bottom:1px solid var(--line)
}

.desktop-nav.mobile-open a {
  padding:14px 0
}

.section {
  padding:80px 20px
}

.hero {
  padding-top:80px
}

.hero-copy {
  font-size:.9rem
}

.hero-actions {
  flex-wrap:wrap;
  gap:24px
}

.section-intro,.steps {
  display:block
}

.section-intro h2 {
  margin-bottom:20px
}

.feature-grid,.split-section {
  grid-template-columns:1fr
}

.feature-wide {
  grid-column:span 1
}

.feature-card,.feature-wide {
  min-height:330px;
  padding:24px
}

.path-visual {
  gap:8px
}

.path-visual i {
  width:auto;
  flex:1
}

.statement>p {
  margin-left:0
}

.split-card {
  min-height:390px;
  padding:28px
}

.step-list {
  margin-top:55px
}

.site-footer {
  padding:28px 20px;
  display:grid;
  gap:20px
}

.footer-meta {
  display:grid;
  gap:8px
}

.footer-links {
  order:3
}

dialog {
  padding:48px 22px 26px
}

dialog h2 {
  font-size:2rem
}

.preview-question {
  padding:18px
}

.answer-row {
  flex-direction:column
}

.answer-row .button {
  justify-content:center
}


}

@media(prefers-reduced-motion:reduce) {
  html {
  scroll-behavior:auto
}

}

