@font-face {
  font-family: "Inter Tight";
  src: url("assets/fonts/inter-tight-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
}
:root {
  --purple: #7138bc;
  --purple-dark: #4f2086;
  --ink: #201b28;
  --muted: #665c73;
  --soft: #f5f2f8;
  --dark: #121016;
  --container: 1100px;
  --ease-premium: cubic-bezier(.16, 1, .3, 1);
}
body { font-family: "Inter Tight", sans-serif; font-size: 18px; }
::selection { background: #ded0f1; color: #35214b; }
html { scrollbar-color: #9382a8 #f4f1f7; }
input, textarea { caret-color: var(--purple); }
a { text-underline-offset: .18em; }
h1, h2 { text-wrap: balance; letter-spacing: -.03em; font-weight: 650; }
h1 { font-size: clamp(34px, 4.2vw, 52px); }
h2 { font-size: clamp(32px, 3.85vw, 48px); }
h3, h4 { letter-spacing: -.02em; font-weight: 650; }
.section { padding: 96px 0; }
.section-heading { margin-bottom: 48px; max-width: 900px; }
.section-heading p { max-width: 64ch; font-size: 18px; line-height: 1.6; }
.dark-section, .hero { background-image: none; }
.dark-section .section-heading p { color: #c9c1d4; }
.top-strip { padding: 13px 16px; background: #5a2d92; letter-spacing: .015em; }
.hero { padding: 55px 0 52px; }
.hero h1 { max-width: 900px; margin-bottom: 22px; }
.hero-intro { font-size: 18px; margin-bottom: 34px; }
.video-wrap { border: 0; border-radius: 12px; box-shadow: 0 28px 64px #0005; }
.first-purchase { margin-top: 30px; }
.button { box-shadow: none; min-height: 64px; padding: 19px 28px; transition: background 160ms, color 160ms; }
.button:hover { transform: none; background: #53f49a; }
.button:active { transform: none; background: #18d96a; }
.button svg { width: 20px; height: 20px; flex: 0 0 20px; transition: transform 220ms var(--ease-premium); }
.button:hover svg { transform: translate(3px,-3px); }
.price-line { margin-top: 19px; font-size: 20px; font-variant-numeric: tabular-nums; }
.price-line span+span { font-size: 16px; margin-top: 3px; }
.purchase-details { font-size: 14px; color: #c3b9ce; }
.problem-section { padding-block: 83px; }
.problem-section p { max-width: 66ch; margin-inline: auto; font-size: 20px; }
.closing-line { margin-top: 32px; font-size: 23px; }
.pillar-grid { max-width: none; gap: 0; border-top: 1px solid #43374f; }
.pillar { border: 0; border-radius: 0; background: none; padding: 31px 30px; border-bottom: 1px solid #43374f; }
.pillar:nth-child(odd) { padding-left: 0; }
.pillar-symbol { background: none; color: #c49cef; width: 32px; height: 32px; border-radius: 0; }
.pillar-symbol svg { width: 30px; height: 30px; }
.pillar h3 { font-size: 27px; }
.pillar p { max-width: 40ch; font-size: 18px; }
.split-layout { gap: 64px; }
.copy-column>p { font-size: 19px; line-height: 1.6; }
.feature-list { gap: 0; margin: 24px 0 28px; }
.feature-list li { padding: 17px 0; background: none; border: 0; border-radius: 0; border-bottom: 1px solid #dfd6e8; }
.feature-list strong { font-size: 18px; }
.feature-list span { font-size: 16px; margin-top: 5px; }
.access-inline { background: #e6d9f3; color: #513279; border-radius: 8px; font-size: 15px; }
.inside-section .container { display: block; }
.inside-copy { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; margin-bottom: 44px; align-items: start; }
.inside-copy h2 { margin-bottom: 25px; }
.inside-copy .feature-list { margin: 0; }
.platform-tour { background: #141118; border-radius: 16px; overflow: hidden; box-shadow: 0 28px 70px #20112824; color: #fff; }
.platform-topbar { display: flex; align-items: center; gap: 18px; padding: 18px 23px; background: #211a29; }
.platform-topbar .platform-logo { width: 110px; max-height: 32px; object-fit: contain; filter: brightness(0) invert(1); }
.platform-address { font-size: 14px; color: #c9bed5; margin-left: auto; }
.platform-stage { position: relative; overflow: hidden; aspect-ratio: 16 / 9.7; background: #0b0a0d; }
.platform-shot { width: 100%; height: 100%; object-fit: cover; object-position: center top; display: block; }
.platform-stage.is-switching .platform-shot { animation: platform-arrive 420ms var(--ease-premium); }
@keyframes platform-arrive { from { opacity: .35; transform: scale(1.015); clip-path: inset(0 0 6% 0); } to { opacity: 1; transform: scale(1); clip-path: inset(0); } }
.platform-controlbar { display: flex; align-items: center; gap: 18px; padding: 20px 23px; border-top: 1px solid #382c42; }
.platform-tabs { display: flex; gap: 8px; flex-wrap: wrap; }
.platform-tab { border: 1px solid #574662; border-radius: 8px; background: transparent; padding: 11px 15px; font-size: 15px; color: #dcd2e5; cursor: pointer; transition: background 180ms, color 180ms; min-height: 44px; }
.platform-tab[aria-selected="true"] { color: #fff; background: #7138bc; border-color: #7138bc; }
.platform-tab:hover { background: #3c2c4a; }
.platform-tab[aria-selected="true"]:hover { background: #7138bc; }
.platform-play { margin-left: auto; border: 0; border-radius: 8px; background: #35283f; color: #fff; display: flex; align-items: center; gap: 8px; padding: 12px; cursor: pointer; min-height: 44px; font-size: 14px; }
.platform-play svg { width: 18px; height: 18px; }
.platform-caption { text-align: center; margin: 18px auto 0; color: #655873; font-size: 15px; }
.platform-zoom { border: 0; border-radius: 8px; color: #ddd0e9; background: transparent; min-height: 44px; padding: 10px; display: flex; gap: 8px; align-items: center; font-size: 14px; cursor: pointer; margin-left: auto; }
.platform-zoom svg, .platform-dialog-header svg { width: 20px; height: 20px; }
.platform-zoom:hover { background: #35283f; }
.platform-zoom:focus-visible { outline: 3px solid #e3c6ff; outline-offset: 3px; }
.platform-play { margin-left: 0; }
.platform-dialog { width: min(1200px,calc(100% - 30px)); max-height: calc(100% - 40px); border: 1px solid #51415f; border-radius: 14px; background: #151118; padding: 0; color: #fff; overflow: auto; }
.platform-dialog::backdrop { background: #08050cbf; }
.platform-dialog-header { display: flex; justify-content: space-between; align-items: center; padding: 16px 20px; gap: 20px; position: sticky; top: 0; background: #211a29; z-index: 2; }
.platform-dialog-header h3 { margin: 0; font-size: 22px; }
.platform-dialog-header button { border: 0; border-radius: 8px; background: #3a2c46; width: 44px; height: 44px; color: #fff; cursor: pointer; }
.platform-dialog-image { overflow: auto; }
.platform-dialog-image img { display: block; width: 100%; }
.platform-pan-hint { display: none; }
.inside-copy p { font-size: 19px; color: #665c73; line-height: 1.6; }
.recap-section .image-area { width: min(100%,330px); margin: auto; }
.recap-section .image-area img { border-radius: 12px; box-shadow: 0 24px 60px #0005; }
.demo-section .demo-resource-open { border: 0; background: none; color: #7138bc; font-size: 16px; font-weight: 650; padding: 12px 0; margin-top: 12px; min-height: 44px; cursor: pointer; text-align: left; }
.demo-section .demo-resource-open:hover { text-decoration: underline; text-underline-offset: 5px; }
.demo-section { --demo-purple: #7138bc; --demo-purple-deep: #4f2086; }
.demo-section .curriculum h3, .demo-section .curriculum h4 { color: #201b28; }
.demo-section .curriculum-grid article { border-color: #dfd6e8; }
.demo-section .curriculum-grid p { color: #665c73; }
.recap-list li:before, .offer-list li:before, .audience-list li:before { content: ""; top: 5px; width: 18px; height: 18px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m5 12 4 4 10-10' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m5 12 4 4 10-10' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; }
.faq-list summary:after { content: ""; width: 20px; height: 20px; background: #c9a2f5; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14M12 5v14' fill='none' stroke='black' stroke-width='1.8'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14M12 5v14' fill='none' stroke='black' stroke-width='1.8'/%3E%3C/svg%3E") center / contain no-repeat; }
.faq-list details[open] summary:after { content: ""; -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14' fill='none' stroke='black' stroke-width='1.8'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14' fill='none' stroke='black' stroke-width='1.8'/%3E%3C/svg%3E"); }
.platform-tab:focus-visible, .platform-play:focus-visible { outline: 3px solid #e3c6ff; outline-offset: 3px; }
.curriculum { margin-top: 44px; padding-top: 36px; }
.curriculum-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 0 30px; }
.curriculum-grid article { padding: 22px 0; background: none; border-radius: 0; border-bottom: 1px solid #43374f; }
.curriculum-grid h4 { font-size: 23px; }
.curriculum-grid p { font-size: 16px; }
.author-section { background: #fbfafc; }
.author-layout { max-width: 1050px; }
.portrait-image img { aspect-ratio: 4/5; border-radius: 16px; object-position: 50% 25%; }
.author-signature { font-size: 27px!important; }
.classroom-section { background: #fff; }
.classroom-section .image-area img { border-radius: 16px; }
.recap-section .image-area img { filter: none; }
.recap-section .copy-column>p { color: #f2e8fd; }
.recap-list { gap: 21px; }
.recap-list li { font-size: 20px; }
.offer-card { padding: 48px; width: min(100%,570px); border-radius: 16px; box-shadow: 0 26px 60px #0004; }
.offer-card .main-price { font-size: 48px; letter-spacing: -.03em; }
.offer-list li { font-size: 18px; }
.offer-intro { font-size: 17px; }
.offer-card .button, .recap-section .button { font-size: 16px; }
.wordmark { margin-bottom: 28px; font-size: 38px; }
.wordmark strong { font-size: 42px; }
.wordmark>span { font-size: 14px; letter-spacing: .1em; }
.condition-grid { gap: 28px; }
.condition-grid article { padding: 20px 0; background: none; border-radius: 0; }
.condition-grid p { font-size: 17px; }
.audience-layout { grid-template-columns: 1fr; max-width: 900px; }
.audience-image { display: none; }
.audience-list { grid-template-columns: 1fr 1fr; gap: 24px 38px; }
.faq-list { gap: 0; }
.faq-list details { border: 0; border-bottom: 1px solid #44384e; border-radius: 0; background: none; }
.faq-list summary { padding: 22px 0; font-size: 19px; }
.faq-list details>div { padding: 0 0 26px; font-size: 17px; max-width: 70ch; }
.faq-list summary:after { font-size: 28px; }
.testimonials-section { padding-top: 66px; }
.testimonial-grid { display: flex; overflow-x: auto; gap: 22px; scroll-snap-type: x mandatory; padding-bottom: 12px; }
.testimonial-grid figure { flex: 0 0 310px; scroll-snap-align: start; color: var(--ink); border-radius: 16px; }
.testimonial-grid video { width: 100%; aspect-ratio: 9/16; object-fit: cover; }
.testimonial-grid img { width: 100%; height: auto; }
.testimonial-grid figcaption { font-size: 16px; }
@media (max-width: 800px) {
  .section { padding-block: 72px; }
  .inside-copy { gap: 34px; }
  .split-layout { gap: 34px; }
  .platform-controlbar { flex-wrap: wrap; }
  .platform-play { margin-left: 0; }
}
@media (max-width: 640px) {
  .container { width: calc(100% - 36px); }
  .section { padding-block: 60px; }
  .section-heading { margin-bottom: 33px; }
  .section-heading p { font-size: 17px; }
  .hero { padding: 32px 0 40px; }
  .hero h1 { font-size: 34px; max-width: none; margin-bottom: 22px; }
  .hero-intro { font-size: 16px; max-width: 340px; margin-bottom: 26px; }
  .top-strip { font-size: 14px; padding-block: 11px; }
  .button { font-size: 16px; min-height: 64px; padding-inline: 18px; }
  .price-line { font-size: 20px; }
  .first-purchase { margin-top: 25px; }
  .problem-section p { font-size: 18px; }
  .pillar { padding: 25px 0; }
  .pillar h3 { font-size: 25px; }
  .pillar p { font-size: 17px; }
  .inside-copy { grid-template-columns: 1fr; gap: 24px; margin-bottom: 32px; }
  .inside-copy .feature-list { margin-top: 0; }
  .platform-tour { border-radius: 12px; }
  .platform-topbar { padding: 14px 16px; }
  .platform-topbar .platform-logo { width: 93px; }
  .platform-address { font-size: 14px; max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .platform-stage { aspect-ratio: 4/3; }
  .platform-shot { object-fit: cover; object-position: left top; }
  .platform-controlbar { padding: 14px; gap: 13px; }
  .platform-tabs { gap: 7px; width: 100%; }
  .platform-tab { padding: 11px 10px; font-size: 14px; flex: 1; }
  .platform-play { margin-left: auto; padding: 9px 11px; }
  .platform-zoom { margin-left: 0; }
  .platform-dialog-image img { width: 1000px; max-width: none; }
  .platform-pan-hint { display: block; font-size: 14px; margin: 0; padding: 12px 20px; color: #d0c2dc; }
  .platform-caption { font-size: 14px; }
  .curriculum-grid { grid-template-columns: 1fr; }
  .copy-column>p { font-size: 18px; }
  .portrait-image img { max-height: none; }
  .offer-card { padding: 38px 25px 30px; }
  .offer-list li { font-size: 17px; }
  .offer-card .main-price { font-size: 40px; }
  .recap-list li { font-size: 18px; }
  .audience-list { grid-template-columns: 1fr; gap: 23px; }
  .faq-list summary { font-size: 18px; }
  .faq-list details>div { font-size: 17px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .platform-stage.is-switching .platform-shot { animation: none; }
  .button svg { transition: none; }
  .button:hover svg { transform: none; }
  .platform-tab { transition: none; }
}
