:root {
  --ink: #173331;
  --muted: #5b6b69;
  --paper: #fffdf8;
  --warm: #f4f0e6;
  --line: #dce2db;
  --teal: #0b655d;
  --teal-dark: #073f3b;
  --lime: #b8d66d;
  --coral: #e97b61;
  --amber: #e3a52c;
  --white: #ffffff;
  --shadow: 0 22px 55px rgba(24, 50, 46, .13);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 5rem; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: "DM Sans", sans-serif; font-size: 16px; line-height: 1.55; }
body.menu-open { overflow: hidden; }
a { color: inherit; }
button { font: inherit; }
.shell { width: min(1120px, calc(100% - 48px)); margin: 0 auto; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip-link { position: fixed; z-index: 30; left: 1rem; top: -5rem; padding: .65rem 1rem; background: var(--teal-dark); color: #fff; border-radius: 4px; }
.skip-link:focus { top: 1rem; }

.site-header { position: sticky; z-index: 20; top: 0; background: rgba(255, 253, 248, .72); backdrop-filter: blur(18px) saturate(150%); border-bottom: 1px solid rgba(255, 255, 255, .72); box-shadow: 0 8px 30px rgba(23, 51, 49, .05); }
.nav-wrap { height: 74px; display: flex; align-items: center; justify-content: space-between; }
.wordmark { display: inline-flex; gap: .5rem; align-items: center; font-weight: 700; text-decoration: none; font-size: 1.15rem; letter-spacing: -.02em; }
.mark { display: grid; place-items: center; width: 25px; height: 25px; color: var(--white); background: var(--teal); border-radius: 6px; font-family: Georgia, serif; font-size: .95rem; }
.site-nav { display: flex; align-items: center; gap: 1.6rem; font-size: .9rem; font-weight: 600; }
.site-nav > a:not(.nav-cta) { text-decoration: none; color: #455856; }
.site-nav > a:hover { color: var(--teal); }
.nav-cta { display: inline-flex; gap: .5rem; align-items: center; text-decoration: none; color: var(--white); background: var(--teal); padding: .68rem .95rem; border-radius: 6px; }
.menu-button { display: none; border: 0; background: transparent; padding: .4rem; }
.menu-button span:not(.sr-only) { display: block; width: 23px; height: 2px; background: var(--ink); margin: 4px; }

.hero { position: relative; overflow: hidden; padding: clamp(4rem, 8vw, 7.5rem) 0 1.8rem; background: linear-gradient(110deg, var(--paper) 0%, var(--paper) 64%, #e8f0e9 64%); }
.hero::before { position: absolute; inset: 0; pointer-events: none; background-image: linear-gradient(rgba(11, 101, 93, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(11, 101, 93, .045) 1px, transparent 1px); background-size: 42px 42px; mask-image: linear-gradient(90deg, transparent 5%, black 57%, transparent 100%); content: ""; }
.hero-grid, .hero-rule { position: relative; }
.hero-grid { display: grid; grid-template-columns: .92fr 1.08fr; gap: clamp(2.5rem, 6vw, 6rem); align-items: center; }
.eyebrow { display: flex; align-items: center; gap: .55rem; margin: 0 0 1.15rem; color: var(--teal); font-weight: 700; font-size: .71rem; text-transform: uppercase; letter-spacing: .1em; }
.eyebrow span { display: inline-block; width: 25px; height: 2px; background: var(--coral); }
h1, h2, h3, p { margin-top: 0; }
h1, h2 { font-family: "Fraunces", Georgia, serif; font-weight: 600; letter-spacing: -.045em; line-height: 1.05; }
h1 { max-width: 630px; margin-bottom: 1.5rem; font-size: clamp(3rem, 5.2vw, 5rem); }
h1 em, h2 em { color: var(--teal); font-style: italic; }
.hero-intro { max-width: 525px; color: var(--muted); font-size: 1.08rem; }
.actions { display: flex; gap: 1.1rem; align-items: center; margin: 2rem 0 1.1rem; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: .55rem; min-height: 48px; padding: .76rem 1.15rem; border: 1px solid transparent; border-radius: 6px; text-decoration: none; font-weight: 700; font-size: .91rem; transition: transform .28s cubic-bezier(.2,.8,.2,1), box-shadow .28s ease, background .28s ease; }
.button:hover { transform: translateY(-3px); box-shadow: 0 13px 24px rgba(11, 101, 93, .2); }
.button-primary { color: white; background: linear-gradient(135deg, #12796f, var(--teal)); box-shadow: 0 8px 18px rgba(11, 101, 93, .18); }
.button-text { color: var(--teal); }
.quiet-note { margin: 0; color: #75817f; font-size: .8rem; }

.dashboard-wrap { position: relative; min-width: 0; background: rgba(255, 255, 255, .76); backdrop-filter: blur(20px) saturate(145%); border: 1px solid rgba(255, 255, 255, .85); border-radius: 10px; box-shadow: 0 28px 70px rgba(24, 50, 46, .17), inset 0 1px rgba(255, 255, 255, .72); overflow: hidden; transform: rotate(1deg); transition: transform .65s cubic-bezier(.2,.8,.2,1), box-shadow .65s ease; animation: float-dashboard 6s ease-in-out infinite; }
.dashboard-wrap:hover { box-shadow: 0 38px 85px rgba(24, 50, 46, .23), inset 0 1px rgba(255, 255, 255, .88); transform: rotate(0deg) translateY(-7px); }
.dashboard-top { height: 48px; display: flex; align-items: center; gap: .8rem; padding: 0 .9rem; border-bottom: 1px solid #e8ede9; color: #58706d; font-size: .65rem; }
.tiny-logo { color: var(--ink); font-weight: 700; font-size: .75rem; }.tiny-logo b { color: var(--teal); }.date { margin-left: auto; }.avatar { display: grid; place-items: center; width: 23px; height: 23px; background: #e8c3b3; color: #703f36; border-radius: 50%; font-size: .56rem; font-weight: 700; }
.dashboard-body { display: grid; grid-template-columns: 104px 1fr; min-height: 350px; }.dashboard-side { display: flex; flex-direction: column; gap: .3rem; padding: 1rem .5rem; background: #f8faf8; border-right: 1px solid #e9eeea; color: #7a8786; font-size: .63rem; }.dashboard-side span { padding: .48rem .58rem; }.dashboard-side .side-active { color: var(--teal); background: #ddede7; border-radius: 3px; font-weight: 700; }
.dashboard-main { position: relative; min-width: 0; padding: 1.25rem; }.mock-heading { display: flex; justify-content: space-between; align-items: center; }.mock-heading small, .mock-heading strong, .class-row small, .message-toast small { display: block; }.mock-heading small { color: #88928f; font-size: .59rem; }.mock-heading strong { font-size: .98rem; }.mock-heading button { display: grid; place-items: center; width: 25px; height: 25px; border: 0; color: white; background: var(--teal); border-radius: 4px; font-size: 1.1rem; }
.stat-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: .6rem; margin: 1rem 0; }.stat-row div { padding: .55rem .65rem; background: #f7f8f4; border-radius: 4px; }.stat-row small { display: block; color: #74817e; font-size: .54rem; }.stat-row b { display: inline-block; margin: .18rem .12rem 0 0; font-size: 1rem; }.stat-row i { color: #73817e; font-size: .5rem; font-style: normal; }.green-stat { background: #e8f4e9 !important; }.green-stat b { color: #278348; }
.class-list { border-top: 1px solid #e7ede8; }.class-row { display: grid; grid-template-columns: 31px 25px 1fr auto; align-items: center; gap: .45rem; padding: .67rem 0; border-bottom: 1px solid #edf1ee; }.time { color: #74817e; font-size: .55rem; }.initial { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; font-size: .52rem; font-weight: 700; }.blue { color: #2e6173; background: #cfe6ec; }.orange { color: #7e4b27; background: #f3dbb7; }.violet { color: #604b76; background: #ded5e8; }.class-row b { display: block; font-size: .61rem; }.class-row small { color: #81908c; font-size: .5rem; }.status { padding: .2rem .32rem; border-radius: 3px; font-size: .46rem; font-weight: 700; }.done { color: #287845; background: #ddf0e1; }.next { color: #9a6a18; background: #f8ebc7; }.pending { color: #7d657f; background: #ede5ee; }
.message-toast { position: absolute; right: 1.1rem; bottom: -1rem; display: flex; align-items: center; gap: .4rem; width: 205px; padding: .55rem; border: 1px solid #e4e7e3; background: white; box-shadow: 0 7px 20px rgba(33, 58, 51, .14); border-radius: 5px; }.whatsapp { display: grid; place-items: center; width: 22px; height: 22px; background: #43b562; color: white; border-radius: 50%; font-weight: 700; font-size: .55rem; }.message-toast b { display: block; font-size: .52rem; }.message-toast small { color: #7d8885; font-size: .46rem; }.check { margin-left: auto; color: #399c56; font-size: .8rem; }
.hero-rule { display: flex; align-items: center; gap: .7rem; margin-top: clamp(4rem, 8vw, 7rem); color: #73817d; font-weight: 600; font-size: .69rem; text-transform: uppercase; letter-spacing: .1em; }.hero-rule i { height: 1px; flex: 1; background: #d7ded7; }

.statement-section, .product-section, .people-section, .privacy-section { padding: clamp(5rem, 9vw, 8rem) 0; }.statement-section { background: var(--warm); }.statement-grid { display: grid; grid-template-columns: .6fr 1fr .9fr; gap: 2rem; align-items: end; }.statement-grid h2, .section-heading h2, .people-intro h2, .trust-grid h2, .privacy-grid h2, .contact-inner h2 { margin: 0; font-size: clamp(2.3rem, 4.3vw, 4rem); }.value-copy { color: var(--muted); font-size: 1.02rem; }.value-copy p { margin: 0; }.value-grid { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 4rem; border-top: 1px solid #d5d5ca; }.value-card { min-height: 225px; padding: 1.55rem 1.8rem 1rem 0; border-right: 1px solid #d5d5ca; }.value-card:not(:first-child) { padding-left: 1.8rem; }.value-card:last-child { border-right: 0; }.card-number { color: var(--coral); font-family: "Fraunces", serif; font-size: 1.1rem; }.value-card h3 { margin: 2.1rem 0 .65rem; font-size: 1.08rem; }.value-card p { max-width: 270px; color: var(--muted); font-size: .91rem; }
.section-heading { max-width: 720px; }.section-heading h2 { font-size: clamp(2.4rem, 4vw, 3.8rem); }.capabilities { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 3rem; }.capability { min-height: 280px; padding: 1.5rem; background: rgba(255, 255, 255, .62); backdrop-filter: blur(16px) saturate(130%); border: 1px solid rgba(255, 255, 255, .94); border-radius: 8px; box-shadow: 0 10px 28px rgba(27, 61, 52, .06); overflow: hidden; transition: transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease, background .35s ease; }.capability:hover { background: rgba(255, 255, 255, .88); box-shadow: 0 20px 34px rgba(27, 61, 52, .12); transform: translateY(-7px); }.large-capability { grid-column: span 2; display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }.icon-box { display: grid; place-items: center; width: 32px; height: 32px; background: rgba(231, 240, 233, .82); color: var(--teal); border: 1px solid rgba(255, 255, 255, .7); border-radius: 4px; font-size: .6rem; font-weight: 700; }.capability h3 { margin: 1.2rem 0 .5rem; font-size: 1.05rem; }.capability p { max-width: 275px; color: var(--muted); font-size: .86rem; }.student-snippet { align-self: center; padding: 1.05rem; border: 1px solid rgba(255, 255, 255, .9); background: rgba(251, 252, 250, .64); border-radius: 5px; }.snippet-label { color: #7a8882; font-size: .53rem; letter-spacing: .08em; }.profile-row { display: flex; align-items: center; gap: .5rem; padding: .7rem 0; }.profile-row b, .profile-row small { display: block; }.profile-row b { font-size: .7rem; }.profile-row small { color: #778580; font-size: .57rem; }.active-dot { margin-left: auto; color: #31804c; font-size: .53rem; }.progress-label { display: flex; justify-content: space-between; font-size: .58rem; }.progress { height: 5px; margin-top: .32rem; background: #e5ebe5; border-radius: 10px; overflow: hidden; }.progress i { display: block; width: 67%; height: 100%; background: var(--teal); }.availability { display: flex; gap: .4rem; align-items: center; margin-top: 2.2rem; color: #4d5f59; font-size: .68rem; }.pulse { width: 7px; height: 7px; background: #42ad61; border-radius: 50%; box-shadow: 0 0 0 4px #e4f3e7; }.slot-bars { display: flex; gap: .33rem; align-items: end; height: 41px; margin-top: 1.7rem; }.slot-bars i { width: 17%; background: #c8dfd3; }.slot-bars i:nth-child(1) { height: 40%; }.slot-bars i:nth-child(2) { height: 75%; background: var(--teal); }.slot-bars i:nth-child(3) { height: 55%; }.slot-bars i:nth-child(4) { height: 92%; background: #e8ba8c; }.message-bubble { position: relative; margin-top: 1.5rem; max-width: 205px; padding: .7rem; color: #365149; background: #e1f0e4; border-radius: 5px 5px 5px 0; font-size: .64rem; }.message-bubble span { display: block; margin-top: .3rem; color: #719086; text-align: right; font-size: .49rem; }.licence-line { display: flex; justify-content: space-between; align-items: center; margin-top: 2rem; padding: .55rem 0; border-top: 1px solid #e6ebe5; border-bottom: 1px solid #e6ebe5; color: #566762; font-size: .65rem; }.licence-line b { color: var(--teal); }.licence-line span { padding: .2rem .35rem; color: #8d661c; background: #faefcf; border-radius: 3px; }.bar-chart { display: flex; gap: .37rem; align-items: end; height: 53px; margin-top: 1.5rem; }.bar-chart i { width: 13px; background: #c8ded3; }.bar-chart i:nth-child(1) { height: 34%; }.bar-chart i:nth-child(2) { height: 56%; }.bar-chart i:nth-child(3) { height: 45%; }.bar-chart i:nth-child(4) { height: 83%; background: var(--teal); }.bar-chart i:nth-child(5) { height: 67%; background: #dfaa7e; }

.workflow-section { padding: clamp(5rem, 9vw, 8rem); background: var(--teal-dark); color: white; }.light-heading .eyebrow { color: var(--lime); }.light-heading .eyebrow span { background: var(--coral); }.light-heading h2 em { color: var(--lime); }.timeline { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.6rem; margin-top: 4rem; }.timeline-step { position: relative; padding-top: 2rem; border-top: 1px solid rgba(255,255,255,.35); }.timeline-step::before { position: absolute; top: -4px; left: 0; width: 7px; height: 7px; background: var(--lime); border-radius: 50%; content: ""; }.timeline-step span { color: var(--lime); font-size: .75rem; font-weight: 700; }.timeline-step h3 { margin: 1.7rem 0 .6rem; font-size: 1rem; }.timeline-step p { color: #b8cac4; font-size: .86rem; }
.people-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: #dce3dc; }.people-intro { grid-column: span 2; padding: 0 0 3rem; background: var(--paper); }.role-card { min-height: 350px; padding: 2rem; }.owner-card { background: #dcebe3; }.instructor-card { background: #f7dfcd; }.role-top { display: flex; align-items: center; gap: .6rem; color: #55655f; font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; }.role-icon { display: grid; place-items: center; width: 28px; height: 28px; color: white; background: var(--teal); border-radius: 50%; font-family: Georgia, serif; }.instructor-card .role-icon { background: #b45f4b; }.role-card h3 { max-width: 380px; margin: 2.1rem 0; font-family: "Fraunces", serif; font-size: clamp(1.6rem, 2.4vw, 2.25rem); font-weight: 600; letter-spacing: -.035em; line-height: 1.13; }.role-card ul { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; margin: 0; padding: 0; list-style: none; color: #51625c; font-size: .84rem; }.role-card li::before { margin-right: .5rem; color: var(--teal); content: "\2192"; }.instructor-card li::before { color: #b45f4b; }
.trust-section { padding: clamp(5rem, 9vw, 8rem) 0; background: #e8efe8; }.trust-grid, .privacy-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2.5rem, 10vw, 10rem); }.trust-copy, .privacy-grid > div:last-child { color: #475c56; font-size: 1rem; }.trust-points { display: grid; gap: .75rem; margin: 2rem 0; color: var(--ink); font-size: .88rem; font-weight: 600; }.trust-points b { display: inline-grid; place-items: center; width: 18px; height: 18px; margin-right: .45rem; color: white; background: var(--teal); border-radius: 50%; font-size: .62rem; }.disclaimer { margin: 2.2rem 0 0; padding-top: 1.2rem; border-top: 1px solid #cfdbd0; color: #6d7f78; font-size: .72rem; }.privacy-section { background: var(--paper); }.text-link { padding: 0; color: var(--teal); border: 0; background: transparent; font-weight: 700; cursor: pointer; }.text-link:hover { text-decoration: underline; }
.contact-section { padding: clamp(5rem, 8vw, 7rem) 0; background: var(--coral); }.contact-inner { max-width: 730px; }.contact-inner .eyebrow { color: #fff5ed; }.contact-inner .eyebrow span { background: var(--teal-dark); }.contact-inner h2 { color: #552e25; }.contact-inner h2 em { color: #fffaf1; }.contact-inner > p { max-width: 575px; margin: 1.3rem 0 2rem; color: #663a30; font-size: 1.05rem; }.button-light { color: #274842; background: #fffaf1; }.contact-inner small { display: block; margin-top: 1.15rem; color: #744339; font-size: .73rem; }
.about-section { padding: clamp(4.5rem, 8vw, 7rem) 0; background: #0d121b; }.about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2.5rem, 10vw, 10rem); }.about-grid h2 { margin: 0; font-size: clamp(2.3rem, 4.3vw, 4rem); }.about-copy { color: #a7b0bd; font-size: 1rem; }.about-copy p:last-of-type { margin-bottom: 1.4rem; }.about-copy a { color: #91cbff; }.facebook-link { display: inline-flex; gap: .5rem; align-items: center; overflow-wrap: anywhere; color: #f5f7fa !important; font-weight: 700; text-decoration: none; }.facebook-link:hover { color: #91cbff !important; text-decoration: underline; }
.site-footer { padding: 2.2rem 0 1.5rem; color: #c4d1cb; background: #173331; }.footer-top { display: flex; align-items: center; gap: 1.2rem; padding-bottom: 2rem; border-bottom: 1px solid #39504c; }.footer-mark { color: white; }.footer-mark .mark { color: var(--teal-dark); background: var(--lime); }.footer-top p { margin: 0; color: #9fb3ac; font-size: .82rem; }.footer-links { display: flex; gap: 1.3rem; margin-left: auto; }.footer-links a { color: #dce7e1; font-size: .77rem; text-decoration: none; }.footer-bottom { display: grid; grid-template-columns: auto auto 1fr; gap: 1.5rem; padding-top: 1.5rem; color: #91a69e; font-size: .66rem; }.footer-bottom span:last-child { text-align: right; }
.privacy-modal { width: min(680px, calc(100% - 32px)); max-height: min(760px, 90vh); padding: 1.8rem; color: var(--ink); border: 0; border-radius: 8px; box-shadow: 0 28px 80px rgba(0,0,0,.35); }.privacy-modal::backdrop { background: rgba(17, 39, 35, .65); backdrop-filter: blur(2px); }.modal-header { display: flex; align-items: center; justify-content: space-between; }.modal-header .eyebrow { margin: 0; }.close-button { width: 40px; height: 40px; color: var(--ink); border: 1px solid var(--line); background: white; border-radius: 5px; cursor: pointer; font-size: 1.7rem; line-height: 1; }.privacy-modal h2 { margin: 1.5rem 0 .3rem; font-size: 2.2rem; }.updated { color: #71817c; font-size: .76rem; }.policy-copy { color: #4d5f59; font-size: .9rem; }.policy-copy h3 { margin: 1.5rem 0 .35rem; color: var(--ink); font-size: 1rem; }.policy-copy p { margin-bottom: 0; }.policy-copy a { color: var(--teal); }
.reveal { opacity: 0; transform: translateY(18px) scale(.985); transition: opacity .7s cubic-bezier(.2,.8,.2,1), transform .7s cubic-bezier(.2,.8,.2,1); }.reveal.visible { opacity: 1; transform: translateY(0) scale(1); }.delay-1 { transition-delay: .1s; }.delay-2 { transition-delay: .2s; }.delay-3 { transition-delay: .3s; }
@keyframes float-dashboard { 0%, 100% { translate: 0 0; } 50% { translate: 0 -9px; } }
:focus-visible { outline: 3px solid #d98248; outline-offset: 3px; }
@media (max-width: 800px) { .site-nav { position: fixed; inset: 74px 0 auto; display: none; align-items: stretch; gap: 0; padding: .8rem 24px 1.4rem; background: var(--paper); border-bottom: 1px solid var(--line); box-shadow: 0 15px 25px rgba(20, 45, 39, .1); }.site-nav.open { display: flex; flex-direction: column; }.site-nav > a:not(.nav-cta) { padding: .85rem 0; border-bottom: 1px solid var(--line); }.nav-cta { justify-content: center; margin-top: .9rem; }.menu-button { display: block; }.hero { background: linear-gradient(160deg, var(--paper) 0%, var(--paper) 62%, #e8f0e9 62%); }.hero-grid, .statement-grid, .trust-grid, .privacy-grid { grid-template-columns: 1fr; }.hero-copy { max-width: 620px; }.dashboard-wrap { max-width: 620px; width: 100%; margin: 0 auto; transform: none; }.statement-grid { gap: 1rem; }.statement-grid .eyebrow { margin-bottom: 0; }.value-grid { grid-template-columns: 1fr; margin-top: 3rem; }.value-card, .value-card:not(:first-child) { min-height: auto; padding: 1.5rem 0; border-right: 0; border-bottom: 1px solid #d5d5ca; }.value-card:last-child { border: 0; }.value-card h3 { margin-top: 1rem; }.capabilities { grid-template-columns: 1fr 1fr; }.large-capability { grid-column: span 2; }.timeline { grid-template-columns: 1fr 1fr; }.people-intro { grid-column: span 2; }.footer-top { align-items: flex-start; flex-wrap: wrap; }.footer-links { margin-left: 0; }.footer-bottom { grid-template-columns: 1fr; gap: .45rem; }.footer-bottom span:last-child { text-align: left; } }
@media (max-width: 540px) { .shell { width: min(100% - 32px, 1120px); }.nav-wrap { height: 64px; }.site-nav { inset: 64px 0 auto; }.hero { padding-top: 3.5rem; }.hero-rule { gap: .4rem; font-size: .52rem; }.dashboard-body { grid-template-columns: 70px 1fr; }.dashboard-side { padding: .8rem .3rem; font-size: .49rem; }.dashboard-side span { padding: .4rem .3rem; }.dashboard-main { padding: .85rem; }.message-toast { display: none; }.stat-row { gap: .35rem; }.class-row { grid-template-columns: 26px 22px 1fr auto; gap: .28rem; }.status { display: none; }.capabilities { grid-template-columns: 1fr; }.large-capability { grid-column: span 1; grid-template-columns: 1fr; }.student-snippet { margin-top: .5rem; }.capability { min-height: 220px; }.timeline { grid-template-columns: 1fr; gap: .65rem; margin-top: 3rem; }.timeline-step { padding-top: 1.2rem; }.timeline-step h3 { margin-top: .8rem; }.people-grid { grid-template-columns: 1fr; }.people-intro { grid-column: span 1; }.role-card { min-height: auto; }.role-card ul { grid-template-columns: 1fr; }.actions { align-items: stretch; flex-direction: column; }.button-text { justify-content: flex-start; }.footer-top { display: grid; gap: 1rem; }.footer-links { flex-wrap: wrap; }.privacy-modal { padding: 1.25rem; }.privacy-modal h2 { font-size: 1.85rem; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; }.reveal { opacity: 1; transform: none; transition: none; }.button, .capability, .dashboard-wrap { transition: none; }.dashboard-wrap { animation: none; } }

/* Bright, editorial surface system */
:root { --ink: #1d1d1f; --muted: #6e6e73; --paper: #f5f5f7; --warm: #ffffff; --line: rgba(29, 29, 31, .11); --teal: #0071e3; --teal-dark: #001a33; --lime: #b9e5ff; --coral: #ff7a59; --white: #ffffff; --shadow: 0 22px 62px rgba(0, 29, 77, .11); }
body { background: var(--paper); color: var(--ink); }
.site-header { background: rgba(251, 251, 253, .72); border-bottom-color: rgba(255, 255, 255, .9); box-shadow: 0 1px rgba(0, 0, 0, .04); }
.mark { background: #1d1d1f; border-radius: 7px; }
.site-nav > a:not(.nav-cta) { color: #424245; }
.site-nav > a:hover, .button-text { color: #0071e3; }
.hero { padding-top: clamp(5.5rem, 10vw, 9rem); background: linear-gradient(145deg, #fbfbfd 0%, #f2f7ff 57%, #e4efff 100%); }
.hero::before { background-image: linear-gradient(rgba(0, 113, 227, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(0, 113, 227, .045) 1px, transparent 1px); background-size: 54px 54px; mask-image: linear-gradient(90deg, transparent 3%, black 43%, black 87%, transparent 100%); }
h1, h2 { color: #1d1d1f; letter-spacing: 0; }
h1 em, h2 em { color: #0071e3; }
.hero-intro, .quiet-note { color: #6e6e73; }
.button-primary { background: #0071e3; border-radius: 980px; box-shadow: 0 10px 20px rgba(0, 113, 227, .2); }
.button-primary:hover { background: #0077ed; box-shadow: 0 16px 28px rgba(0, 113, 227, .25); }
.button-text { border-radius: 980px; }
.dashboard-wrap { border-radius: 22px; background: rgba(255, 255, 255, .63); border-color: rgba(255, 255, 255, .9); box-shadow: 0 35px 80px rgba(0, 52, 112, .16), inset 0 1px rgba(255,255,255,.8); }
.dashboard-top { background: rgba(255, 255, 255, .5); border-bottom-color: rgba(29, 29, 31, .08); }
.dashboard-side { background: rgba(246, 247, 249, .7); border-right-color: rgba(29, 29, 31, .07); }
.dashboard-side .side-active { color: #0066cc; background: #e8f3ff; border-radius: 7px; }
.mock-heading button, .message-toast { background: rgba(255,255,255,.78); }
.hero-rule { color: #6e6e73; }.hero-rule i { background: rgba(29, 29, 31, .13); }
.product-section { position: relative; background: #fff; }.product-section::before { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(245,245,247,.9), transparent 180px); content: ""; }.product-section > * { position: relative; }
.eyebrow { color: #0071e3; }.eyebrow span { background: #ff7a59; }
.capabilities { gap: 16px; }.capability { min-height: 295px; background: rgba(250, 250, 252, .8); border-color: rgba(29, 29, 31, .07); border-radius: 18px; box-shadow: 0 10px 30px rgba(29,29,31,.055); }.capability:hover { background: #fff; box-shadow: 0 24px 48px rgba(29,29,31,.12); transform: translateY(-9px); }.icon-box { color: #0071e3; background: #e8f3ff; border-color: #d8ebff; border-radius: 9px; }.student-snippet { background: rgba(255,255,255,.9); border-color: #e4e4e7; border-radius: 12px; }.progress i { background: #0071e3; }
.workflow-section { background: #1d1d1f; }.light-heading h2 { color: #f5f5f7; }.light-heading h2 em { color: #72b9f7; }.light-heading .eyebrow { color: #72b9f7; }.timeline-step::before { background: #72b9f7; }.timeline-step span { color: #72b9f7; }.timeline-step p { color: #a1a1a6; }
.trust-section { background: #f5f5f7; }.trust-copy, .privacy-grid > div:last-child { color: #6e6e73; }.trust-points { color: #1d1d1f; }.trust-points b { background: #0071e3; }.disclaimer { border-top-color: #d2d2d7; color: #86868b; }
.privacy-section { background: #fff; }.text-link { color: #0071e3; }
.contact-section { background: linear-gradient(135deg, #0071e3 0%, #005bb5 100%); }.contact-inner h2 { color: #fff; }.contact-inner h2 em { color: #b9e5ff; }.contact-inner > p, .contact-inner small { color: #d8ecff; }.contact-inner .eyebrow { color: #b9e5ff; }.contact-inner .eyebrow span { background: #ffb59f; }.button-light { color: #0066cc; background: #fff; border-radius: 980px; }.button-light:hover { background: #f5f5f7; }
.site-footer { background: #1d1d1f; }.footer-mark .mark { color: #1d1d1f; background: #fff; }
@media (max-width: 800px) { .site-nav { background: rgba(251, 251, 253, .94); backdrop-filter: blur(20px); }.hero { background: linear-gradient(165deg, #fbfbfd 0%, #f2f7ff 60%, #e4efff 100%); }.dashboard-wrap { border-radius: 16px; } }

/* Dark product interface */
:root { --ink: #f5f7fa; --muted: #a7b0bd; --paper: #0b0e14; --warm: #111722; --line: rgba(206, 220, 235, .13); --teal: #63b3ff; --teal-dark: #071426; --lime: #b6e3ff; --coral: #ff9b7a; --white: #ffffff; --shadow: 0 28px 76px rgba(0, 0, 0, .38); }
body { background: #0b0e14; color: #f5f7fa; }
.site-header { background: rgba(11, 14, 20, .72); border-bottom-color: rgba(255, 255, 255, .08); box-shadow: 0 12px 32px rgba(0, 0, 0, .18); }
.wordmark { color: #fff; }.mark { color: #071426; background: #e8f2ff; }.site-nav > a:not(.nav-cta) { color: #c8d0dc; }.site-nav > a:hover, .button-text { color: #8cc8ff; }
.hero { background: radial-gradient(circle at 77% 28%, rgba(26, 92, 165, .3), transparent 29%), linear-gradient(145deg, #0b0e14 0%, #0b1019 52%, #0c1c2e 100%); }
.hero::before { background-image: linear-gradient(rgba(129, 190, 255, .06) 1px, transparent 1px), linear-gradient(90deg, rgba(129, 190, 255, .06) 1px, transparent 1px); }
h1, h2 { color: #f5f7fa; }.hero-intro, .quiet-note { color: #a7b0bd; }.eyebrow { color: #91cbff; }.eyebrow span { background: #ff9b7a; }.button-primary { color: #071426; background: #d9edff; box-shadow: 0 12px 26px rgba(86, 174, 255, .18); }.button-primary:hover { background: #fff; box-shadow: 0 18px 34px rgba(86, 174, 255, .26); }
.dashboard-wrap { background: rgba(19, 28, 41, .66); border-color: rgba(193, 220, 249, .2); box-shadow: 0 35px 86px rgba(0, 0, 0, .48), inset 0 1px rgba(255,255,255,.08); }.dashboard-top { color: #aebbc9; background: rgba(255,255,255,.025); border-bottom-color: rgba(255,255,255,.08); }.tiny-logo { color: #fff; }.tiny-logo b { color: #91cbff; }.dashboard-side { background: rgba(5, 10, 17, .34); border-right-color: rgba(255,255,255,.07); color: #8f9cab; }.dashboard-side .side-active { color: #e8f4ff; background: rgba(99, 179, 255, .18); }.dashboard-main { color: #edf5ff; }.mock-heading small, .class-row small, .stat-row small, .stat-row i, .time { color: #92a2b1; }.stat-row div { background: rgba(255,255,255,.055); }.green-stat { background: rgba(73, 174, 128, .16) !important; }.class-list, .class-row { border-color: rgba(255,255,255,.08); }.message-toast { background: rgba(19, 28, 41, .92); border-color: rgba(255,255,255,.12); }.message-toast b { color: #edf5ff; }.message-toast small { color: #a7b0bd; }.hero-rule { color: #9baaba; }.hero-rule i { background: rgba(255,255,255,.13); }
.product-section { background: #111722; }.product-section::before { background: linear-gradient(180deg, rgba(99, 179, 255, .07), transparent 220px); }.capability { background: rgba(23, 32, 45, .74); border-color: rgba(193, 220, 249, .12); box-shadow: 0 12px 30px rgba(0,0,0,.16); }.capability:hover { background: rgba(29, 41, 57, .96); box-shadow: 0 24px 45px rgba(0,0,0,.26); }.capability p, .profile-row small, .snippet-label { color: #a7b0bd; }.icon-box { color: #b6e3ff; background: rgba(99, 179, 255, .14); border-color: rgba(142, 202, 255, .2); }.student-snippet { background: rgba(6, 12, 21, .28); border-color: rgba(255,255,255,.1); }.progress { background: rgba(255,255,255,.1); }.progress i { background: #76beff; }.message-bubble { color: #d7f0de; background: rgba(56, 142, 85, .28); }
.workflow-section { background: #06080c; }.light-heading h2 { color: #f5f7fa; }.light-heading h2 em, .light-heading .eyebrow, .timeline-step span { color: #91cbff; }.timeline-step { border-top-color: rgba(255,255,255,.2); }.timeline-step::before { background: #91cbff; }.timeline-step p { color: #9baaba; }
.trust-section { background: #0d121b; }.trust-copy, .privacy-grid > div:last-child { color: #a7b0bd; }.trust-points { color: #eff6ff; }.trust-points b { color: #071426; background: #91cbff; }.disclaimer { border-top-color: rgba(255,255,255,.12); color: #8d9aaa; }.privacy-section { background: #111722; }.text-link { color: #91cbff; }
.cloud-section { padding: clamp(5rem, 9vw, 8rem) 0; background: #111722; border-top: 1px solid rgba(255,255,255,.08); border-bottom: 1px solid rgba(255,255,255,.08); }
.cloud-heading { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2.5rem, 10vw, 10rem); align-items: end; }.cloud-heading h2 { margin: 0; font-size: clamp(2.3rem, 4.3vw, 4rem); }.cloud-heading > p { max-width: 490px; margin: 0; color: #a7b0bd; font-size: 1.08rem; }
.cloud-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 3.5rem; }.cloud-card { min-height: 280px; padding: 1.65rem; background: rgba(6, 12, 21, .42); border: 1px solid rgba(193, 220, 249, .12); border-radius: 8px; }.cloud-number { color: #91cbff; font-size: .76rem; font-weight: 700; letter-spacing: .08em; }.cloud-card h3 { margin: 2.4rem 0 .7rem; color: #f5f7fa; font-size: 1.16rem; }.cloud-card p { margin: 0; color: #a7b0bd; font-size: .97rem; }
.gpu-plan { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(2rem, 7vw, 5rem); margin-top: 14px; padding: 1.7rem; background: linear-gradient(115deg, rgba(99, 179, 255, .12), rgba(10, 17, 29, .58)); border: 1px solid rgba(142, 202, 255, .18); border-radius: 8px; }.gpu-plan h3 { margin: .7rem 0; color: #f5f7fa; font-family: "Fraunces", Georgia, serif; font-size: clamp(1.5rem, 2.3vw, 2.05rem); font-weight: 600; letter-spacing: 0; line-height: 1.12; }.gpu-plan-intro > p { margin: 0; color: #b7c5d5; font-size: .96rem; }.gpu-workflow { display: grid; grid-template-columns: 1fr 1fr; gap: .85rem 1.4rem; align-content: center; margin: 0; padding: 0; list-style: none; }.gpu-workflow li { position: relative; min-height: 78px; padding-left: 2rem; }.gpu-workflow span { position: absolute; top: .05rem; left: 0; color: #91cbff; font-size: .69rem; font-weight: 700; }.gpu-workflow b, .gpu-workflow small { display: block; }.gpu-workflow b { margin-bottom: .25rem; color: #edf5ff; font-size: .88rem; }.gpu-workflow small { color: #9baaba; font-size: .79rem; line-height: 1.45; }
.cloud-commitment { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 10vw, 8rem); margin-top: 14px; padding: 1.7rem; background: rgba(99, 179, 255, .08); border: 1px solid rgba(142, 202, 255, .16); border-radius: 8px; }.cloud-label { color: #b6e3ff; font-size: .74rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }.cloud-commitment p { margin: .55rem 0 0; color: #c5d1df; font-size: .95rem; }
.contact-section { background: linear-gradient(135deg, #0b315f 0%, #071426 58%, #06080c 100%); }.contact-inner h2 { color: #fff; }.contact-inner h2 em { color: #a9d8ff; }.contact-inner > p, .contact-inner small { color: #b7cce1; }.contact-inner .eyebrow { color: #a9d8ff; }.contact-inner .eyebrow span { background: #ff9b7a; }.button-light { color: #071426; background: #f3f8ff; }.button-light:hover { background: #fff; }
.site-footer { background: #06080c; border-top: 1px solid rgba(255,255,255,.09); }.footer-mark .mark { color: #071426; background: #e8f2ff; }.footer-top p, .footer-bottom { color: #8f9cab; }.footer-links a { color: #d7e1ed; }.footer-top { border-bottom-color: rgba(255,255,255,.1); }
.privacy-modal { color: #edf5ff; background: #151c28; border: 1px solid rgba(255,255,255,.12); }.privacy-modal h2, .policy-copy h3 { color: #fff; }.policy-copy, .updated { color: #a7b0bd; }.close-button { color: #fff; background: #202938; border-color: rgba(255,255,255,.14); }.policy-copy a { color: #91cbff; }
@media (max-width: 800px) { .site-nav { background: rgba(11, 14, 20, .97); }.hero { background: radial-gradient(circle at 76% 14%, rgba(26, 92, 165, .3), transparent 26%), linear-gradient(165deg, #0b0e14 0%, #0c1726 100%); } }
@media (max-width: 800px) { .cloud-heading, .cloud-commitment, .gpu-plan { grid-template-columns: 1fr; }.cloud-grid { grid-template-columns: 1fr; }.cloud-card { min-height: auto; }.cloud-card h3 { margin-top: 1.6rem; } }
@media (max-width: 540px) { .gpu-workflow { grid-template-columns: 1fr; }.gpu-workflow li { min-height: auto; } }
@media (max-width: 800px) { .about-grid { grid-template-columns: 1fr; } }
@media (max-width: 800px) { .hero-grid { grid-template-columns: minmax(0, 1fr); }.hero-copy, .dashboard-wrap { min-width: 0; max-width: 100%; }.dashboard-body { grid-template-columns: 70px minmax(0, 1fr); } }
@media (max-width: 540px) { h1 { font-size: clamp(2.4rem, 13vw, 3rem); } }