@font-face {
  font-family: Jakarta;
  src: url("../fonts/plus-jakarta-sans-400.ttf") format("truetype");
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: Jakarta;
  src: url("../fonts/plus-jakarta-sans-500.ttf") format("truetype");
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: Jakarta;
  src: url("../fonts/plus-jakarta-sans-600.ttf") format("truetype");
  font-weight: 600;
  font-display: swap;
}

@font-face {
  font-family: Jakarta;
  src: url("../fonts/plus-jakarta-sans-700.ttf") format("truetype");
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: Jakarta;
  src: url("../fonts/plus-jakarta-sans-800.ttf") format("truetype");
  font-weight: 800;
  font-display: swap;
}

:root {
  --navy: #072863;
  --blue: #0049b8;
  --deep-blue: #07388d;
  --yellow: #ffcf00;
  --green: #56aa2a;
  --muted: #344d73;
  --shadow: 0 6px 22px #092d6310;
  --radius: 24px;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 35px;
}

body {
  color: var(--navy);
  -webkit-font-smoothing: antialiased;
  background: radial-gradient(at 0 27%, #e6f2ff58, #0000 23%), radial-gradient(at 100% 60%, #eaf3ff75, #0000 28%), #fff;
  margin: 0;
  font-family: Jakarta, Arial, sans-serif;
  font-size: 17px;
  line-height: 1.55;
}

body.dialog-open {
  overflow: hidden;
}

button, input {
  font: inherit;
}

button, a {
  -webkit-tap-highlight-color: transparent;
}

button {
  color: inherit;
  cursor: pointer;
}

button:disabled {
  cursor: default;
}

a {
  color: inherit;
  text-decoration: none;
}

button {
  border: 0;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

h1, h2, h3, p, figure {
  margin: 0;
}

h1, h2, h3 {
  letter-spacing: -1.15px;
  font-weight: 800;
  line-height: 1.16;
}

h2 {
  font-size: 36px;
}

h3 {
  letter-spacing: -.55px;
  font-size: 21px;
}

p {
  color: var(--muted);
}

mark {
  color: inherit;
  background: var(--yellow);
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  border-radius: 15px;
  padding: 0 9px 3px;
}

:focus-visible {
  outline-offset: 5px;
  outline: 3px solid #0075ff;
}

[hidden] {
  display: none !important;
}

.container {
  width: calc(100% - 192px);
  max-width: 1240px;
  margin-inline: auto;
}

.nk-icon {
  vertical-align: middle;
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  display: inline-block;
}

.icon-definitions {
  pointer-events: none;
  width: 0;
  height: 0;
  position: absolute;
  overflow: hidden;
}

.section {
  padding-block: 45px;
}

.section-label {
  letter-spacing: -.6px;
  border-radius: 10px;
  margin-bottom: 9px;
  padding: 0 7px;
  font-size: 19px;
  font-weight: 800;
  line-height: 1.5;
  display: inline-block;
}

.label-green {
  color: #367d22;
  background: #f0f8e9;
}

.label-yellow {
  color: #0a2f6f;
  background: #ffe277;
}

.label-orange {
  color: #a34408;
  background: #ffe27c;
}

.section-description {
  margin-top: 12px;
}

.section-center {
  text-align: center;
}

.section-center p {
  margin-top: 17px;
  font-size: 16px;
}

.section-heading-row {
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  margin-bottom: 26px;
  display: flex;
}

.skip-link {
  z-index: 30;
  background: var(--navy);
  color: #fff;
  border-radius: 10px;
  padding: 12px 20px;
  position: fixed;
  top: 10px;
  left: 10px;
  transform: translateY(-200%);
}

.skip-link:focus {
  transform: translateY(0);
}

.button {
  text-align: center;
  white-space: nowrap;
  border-radius: 23px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  min-height: 59px;
  padding: 14px 25px;
  font-size: 16px;
  font-weight: 800;
  line-height: 1.3;
  transition: transform .18s, box-shadow .18s, background .18s;
  display: inline-flex;
}

.button:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 18px #063a9120;
}

.button .nk-icon {
  width: 22px;
  height: 22px;
}

.button-blue {
  color: #fff;
  background: linear-gradient(120deg, #0058d0, #0046b3);
  box-shadow: 0 7px 12px #0051b523;
}

.button-blue > .nk-icon {
  color: var(--yellow);
}

.button-yellow {
  background: var(--yellow);
  color: var(--navy);
}

.button-white {
  color: var(--navy);
  background: #fff;
  box-shadow: 0 6px 16px #092d6310;
}

.button-outline {
  color: var(--navy);
  background: #fff;
  border: 1.5px solid #528ff4;
}

.button-outline > .nk-icon {
  color: var(--yellow);
}

.button-outline-yellow {
  border: 1.5px solid var(--yellow);
  background: #fff;
}

.button-outline-yellow .nk-icon {
  color: var(--yellow);
}

.button-small {
  border-radius: 22px;
  min-height: 43px;
  padding: 10px 25px;
  font-size: 15px;
}

.icon-button {
  color: #0d3c86;
  background: #fff;
  border: 1.5px solid #e4ecf8;
  border-radius: 50%;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 48px;
  height: 48px;
  transition: background .15s, transform .15s;
  display: inline-flex;
  box-shadow: 0 3px 8px #123c7510;
}

.icon-button:hover {
  background: #edf4ff;
  transform: translateY(-1px);
}

.icon-button .nk-icon {
  width: 23px;
  height: 23px;
}

.site-header {
  z-index: 5;
  background: #fff;
  border-radius: 0 0 34px 34px;
  position: relative;
}

.header-inner {
  justify-content: space-between;
  align-items: center;
  gap: 35px;
  width: calc(100% - 120px);
  max-width: 1380px;
  height: 84px;
  margin: auto;
  display: flex;
}

.brand {
  letter-spacing: -1.2px;
  white-space: nowrap;
  align-items: center;
  gap: 9px;
  font-size: 25px;
  font-weight: 800;
  display: inline-flex;
}

.brand img {
  display: block;
  width: 140px;
  height: auto;
}

.site-header .brand {
  transform: translateX(30%);
}

.main-nav {
  align-items: center;
  gap: 36px;
  height: 100%;
  display: flex;
}

.main-nav a {
  align-items: center;
  height: 100%;
  font-size: 15px;
  font-weight: 600;
  display: flex;
  position: relative;
}

.main-nav a:after {
  content: "";
  background: var(--yellow);
  border-radius: 4px;
  height: 4px;
  transition: transform .2s;
  position: absolute;
  bottom: 19px;
  left: 0;
  right: 0;
  transform: scaleX(0);
}

.main-nav a:hover, .main-nav a.is-active {
  color: #003ea9;
  font-weight: 800;
}

.main-nav a:hover:after, .main-nav a.is-active:after {
  transform: scaleX(1);
}

.header-actions {
  align-items: center;
  gap: 14px;
  display: flex;
}

.header-actions > .icon-button {
  width: 43px;
  height: 43px;
}

.menu-toggle {
  display: none;
}

.search-panel {
  background: #fff;
  border: 1px solid #e3ecfa;
  border-radius: 22px;
  width: min(560px, 100% - 40px);
  padding: 25px;
  position: absolute;
  top: calc(100% + 10px);
  right: max(30px, 50% - 620px);
  box-shadow: 0 12px 50px #07286325;
}

.search-panel label {
  font-size: 16px;
  font-weight: 700;
}

.search-panel > div {
  gap: 10px;
  margin-top: 12px;
  display: flex;
}

.search-panel input {
  min-width: 0;
  color: var(--navy);
  border: 1px solid #ccd8ec;
  border-radius: 13px;
  flex: 1;
  padding: 12px;
  font-size: 14px;
}

.search-panel .button {
  border-radius: 13px;
  min-height: 46px;
  padding: 12px;
  font-size: 13px;
}

.hero {
  background: linear-gradient(105deg, #f5faff 5%, #eff7ff 45%, #e2f0ff 100%);
  border-radius: 0 0 70px;
  margin-top: -1px;
  position: relative;
  overflow: hidden;
}

.hero-grid {
  grid-template-columns: 1.02fr 1fr;
  align-items: center;
  gap: 0;
  min-height: 640px;
  display: grid;
  position: relative;
}

.hero-copy {
  z-index: 2;
  min-width: 0;
  padding: 42px 0 50px;
  position: relative;
}

.hero-eyebrow {
  background: #fff;
  border-radius: 20px;
  align-items: center;
  gap: 5px;
  margin-bottom: 16px;
  padding: 2px 12px 3px 5px;
  font-size: 14px;
  font-weight: 800;
  display: inline-flex;
  box-shadow: 0 3px 10px #00337213;
}

.hero-eyebrow .nk-icon {
  color: var(--yellow);
  width: 25px;
  height: 25px;
}

.hero :is(h1, .hero-slide-title) {
  letter-spacing: -2.2px;
  font-size: 55px;
  line-height: 1.005;
}

.hero :is(h1, .hero-slide-title) mark {
  white-space: nowrap;
  border-radius: 17px;
  margin-left: -3px;
  padding: 0 9px 4px;
}

.hero-copy > p {
  letter-spacing: -.45px;
  margin-top: 24px;
  font-size: 19px;
  line-height: 1.55;
}

.hero-buttons {
  align-items: center;
  gap: 20px;
  margin-top: 30px;
  display: flex;
}

.hero-buttons .button {
  padding-inline: 27px;
}

.play-small {
  background: var(--yellow);
  color: #fff;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 27px;
  height: 27px;
  display: flex;
}

.play-small .nk-icon {
  width: 19px;
  height: 19px;
  margin-left: -1px;
}

.hero-stats {
  gap: 44px;
  margin-top: 36px;
  display: flex;
}

.hero-stats > div {
  align-items: center;
  gap: 11px;
  display: flex;
}

.hero-stats > .nk-icon, .hero-stats > div > .nk-icon {
  width: 33px;
  height: 33px;
  color: var(--navy);
}

.hero-stats p {
  color: var(--navy);
  flex-direction: column;
  line-height: 1.3;
  display: flex;
}

.hero-stats strong {
  letter-spacing: -.5px;
  font-size: 20px;
  font-weight: 800;
}

.hero-stats span {
  font-size: 13px;
  font-weight: 600;
}

.hero .hero-visual {
  align-self: center;
  width: 100%;
  max-width: 600px;
  height: auto;
  aspect-ratio: 1;
  margin: 20px auto;
  position: relative;
}

.hero-blob {
  isolation: isolate;
  background: #c6e1ff;
  border-radius: 50%;
  position: absolute;
  inset: 6%;
  overflow: hidden;
}

.hero-blob img {
  object-fit: cover;
  object-position: center 59%;
  width: 100%;
  height: 100%;
}

.hero-benefits {
  z-index: 3;
  background: #fff;
  border-radius: 21px;
  flex-direction: column;
  gap: 6px;
  padding: 20px 20px 20px 16px;
  font-size: 15px;
  font-weight: 700;
  display: flex;
  position: absolute;
  top: 40px;
  right: 36px;
  transform: rotate(6deg);
  box-shadow: 0 8px 18px #09427213;
}

.hero-benefits span {
  align-items: center;
  gap: 7px;
  display: flex;
}

.hero-benefits .nk-icon {
  color: #63bd35;
  width: 21px;
  height: 21px;
}

.hero-ring {
  z-index: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.hero-blob {
  z-index: 1;
}

.spark {
  width: 66px;
  height: 66px;
  display: block;
  position: absolute;
}

.spark i {
  transform-origin: 100%;
  background: currentColor;
  border-radius: 5px;
  width: 26px;
  height: 5px;
  display: block;
  position: absolute;
}

.spark i:first-child {
  top: 8px;
  left: 10px;
  transform: rotate(65deg);
}

.spark i:nth-child(2) {
  top: 29px;
  left: 0;
  transform: rotate(33deg);
}

.spark i:nth-child(3) {
  top: 47px;
  left: 3px;
  transform: rotate(3deg);
}

.spark-green {
  color: #53b632;
  z-index: 3;
  top: 55px;
  left: -12px;
}

.categories-section {
  padding-top: 40px;
  padding-bottom: 42px;
}

.category-grid {
  grid-template-columns: repeat(5, 1fr);
  gap: 24px;
  margin-top: 24px;
  display: grid;
}

.category-card {
  outline-offset: 4px;
  border-radius: 27px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 19px;
  min-height: 174px;
  padding: 22px 10px;
  transition: transform .2s, box-shadow .2s;
  display: flex;
}

.category-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 9px 22px #092d6314;
}

.category-card[aria-pressed="true"] {
  transform: translateY(-3px);
  box-shadow: inset 0 0 0 2px #3d7cce, 0 6px 14px #092d6310;
}

.category-card > .nk-icon {
  width: 44px;
  height: 44px;
}

.category-card span {
  letter-spacing: -.5px;
  font-size: 19px;
  font-weight: 800;
  line-height: 1.25;
}

.category-blue {
  background: #e6f1ff;
}

.category-yellow {
  background: #fff6df;
}

.category-sky {
  background: #eaf4ff;
}

.category-purple {
  background: #efedff;
}

.category-green {
  background: #eff8e9;
}

.featured-section {
  padding-top: 34px;
  padding-bottom: 42px;
}

.featured-grid {
  grid-template-columns: .73fr 1.27fr;
  align-items: center;
  gap: 56px;
  display: grid;
}

.featured-actions {
  display: flex;
  justify-content: center;
  margin-top: 24px;
}

.featured-copy h2 {
  font-size: 41px;
  line-height: 1.05;
}

.featured-copy p {
  letter-spacing: -.2px;
  margin-top: 18px;
  font-size: 18px;
  line-height: 1.5;
}

.featured-copy .button {
  min-height: 56px;
  margin-top: 21px;
  padding: 12px 30px;
}

.featured-video {
  isolation: isolate;
  aspect-ratio: 2.16;
  text-align: left;
  color: #fff;
  background: #313b35;
  border-radius: 27px;
  width: 100%;
  padding: 0;
  transition: transform .2s;
  position: relative;
  overflow: hidden;
  box-shadow: 0 10px 20px #0c2d6b15;
}

.featured-video:hover {
  transform: translateY(-4px);
}

.featured-video:after {
  content: "";
  z-index: 1;
  background: linear-gradient(#0000, #050e0acc);
  position: absolute;
  inset: 30% 0 0;
}

.featured-video > img {
  object-fit: cover;
  object-position: center 43%;
  width: 100%;
  height: 100%;
}

.featured-badge {
  background: var(--yellow);
  color: var(--navy);
  z-index: 2;
  border-radius: 30px;
  padding: 7px 18px;
  font-size: 16px;
  font-weight: 800;
  position: absolute;
  top: 20px;
  left: 18px;
}

.featured-title {
  letter-spacing: -.6px;
  z-index: 2;
  font-size: 27px;
  font-weight: 800;
  line-height: 1.18;
  position: absolute;
  bottom: 34px;
  left: 34px;
}

.video-play {
  width: 65px;
  height: 65px;
  color: var(--yellow);
  z-index: 2;
  background: #fff;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  bottom: 30px;
  right: 30px;
  box-shadow: 0 3px 8px #0002;
}

.video-play .nk-icon {
  width: 35px;
  height: 35px;
}

.benefits-section {
  padding-top: 29px;
  padding-bottom: 48px;
}

.benefit-grid {
  grid-template-columns: repeat(4, 1fr);
  gap: 50px;
  margin-top: 38px;
  display: grid;
}

.benefit {
  padding-left: 35px;
  position: relative;
}

.benefit:not(:first-child):before {
  content: "";
  background: linear-gradient(#0000, #eaf0f8, #0000);
  width: 1px;
  position: absolute;
  top: 15px;
  bottom: 5px;
  left: -18px;
}

.benefit > .nk-icon {
  width: 47px;
  height: 47px;
  margin-bottom: 14px;
}

.benefit h3 {
  overflow-wrap: anywhere;
  font-size: 22px;
  line-height: 1.15;
}

.benefit p {
  overflow-wrap: anywhere;
  letter-spacing: -.3px;
  margin-top: 12px;
  font-size: 16px;
  line-height: 1.5;
}

.community-band {
  color: #fff;
  isolation: isolate;
  clip-path: polygon(0 0, 12% 0, 40% 7%, 72% 7%, 100% 0, 100% 100%, 74% 95%, 47% 92%, 13% 94%, 0 100%);
  background: linear-gradient(115deg, #005ed2 0%, #073d9a 40%, #002572 100%);
  border-radius: 66px 80px 60px 0 / 42px 60px 42px 0;
  margin-block: 12px 0;
  padding: 48px 0 53px;
  position: relative;
}

.community-grid {
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  align-items: center;
  gap: 32px;
  display: grid;
}

.community-grid h2 {
  letter-spacing: -1.1px;
  padding-right: 30px;
  font-size: 33px;
  line-height: 1.23;
  position: relative;
}

.community-grid h2:after {
  content: "";
  background: #ffffff63;
  width: 2px;
  position: absolute;
  top: 4px;
  bottom: 4px;
  right: 0;
}

.community-grid h2 span {
  position: relative;
}

.community-grid h2 span:after {
  content: "";
  background: var(--yellow);
  border-radius: 80%;
  height: 6px;
  position: absolute;
  bottom: -9px;
  left: 0;
  right: 0;
  transform: rotate(-4deg);
}

.community-number {
  text-align: center;
  background: #ffffff02;
  border-radius: 30px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 14px 8px;
  display: flex;
}

.community-number > .nk-icon {
  width: 43px;
  height: 43px;
  color: var(--yellow);
  margin-bottom: 13px;
}

.community-number strong {
  letter-spacing: -1px;
  font-size: 35px;
  font-weight: 800;
  line-height: 1.1;
}

.community-number > span {
  letter-spacing: -.6px;
  font-size: 18px;
}

.classes-section {
  padding-top: 27px;
  padding-bottom: 35px;
}

.carousel-controls {
  gap: 12px;
  display: flex;
}

.carousel-controls .icon-button {
  width: 55px;
  height: 55px;
}

.arrow-previous .nk-icon {
  transform: rotate(180deg);
}

.class-track {
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  gap: 30px;
  margin-inline: -3px;
  padding: 2px 3px 15px;
  display: flex;
  overflow-x: auto;
}

.class-track::-webkit-scrollbar, .testimonial-track::-webkit-scrollbar {
  display: none;
}

.class-card {
  scroll-snap-align: start;
  background: #fff;
  border: 1px solid #e9ecf0;
  border-radius: 24px;
  flex: 0 0 calc(33.3333% - 20px);
  min-width: 0;
  transition: box-shadow .2s, transform .2s;
  overflow: hidden;
  box-shadow: 0 4px 8px #11254e0d;
}

.class-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px #11254e14;
}

.class-open {
  text-align: left;
  background: none;
  width: 100%;
  height: 100%;
  padding: 0;
  display: block;
}

.class-image {
  height: 153px;
  position: relative;
}

.class-image > img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.class-tag {
  background: var(--yellow);
  border-radius: 12px;
  padding: 5px 12px;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.3;
  position: absolute;
  bottom: -13px;
  left: 20px;
}

.class-body {
  padding: 34px 20px 19px;
  position: relative;
}

.class-body h3 {
  letter-spacing: -.5px;
  max-width: 80%;
  min-height: 53px;
  font-size: 22px;
  line-height: 1.2;
}

.class-rating {
  color: #f3b600;
  background: #fff8dc;
  border-radius: 15px;
  align-items: center;
  gap: 1px;
  padding: 2px 6px;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.3;
  display: flex;
  position: absolute;
  top: 26px;
  right: 18px;
}

.class-rating .nk-icon {
  stroke: none;
  color: #0000;
  width: 17px;
  height: 17px;
}

.class-meta {
  white-space: nowrap;
  gap: 17px;
  margin-top: 15px;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.3;
  display: flex;
}

.class-meta > span {
  align-items: center;
  gap: 5px;
  display: flex;
}

.class-meta .nk-icon {
  width: 16px;
  height: 16px;
}

.filter-status {
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  margin: -9px 0 20px;
  font-size: 14px;
  display: flex;
}

.filter-status button {
  color: var(--blue);
  background: none;
  padding: 6px 0;
  font-size: 13px;
  font-weight: 700;
}

.empty-classes {
  text-align: center;
  background: #f1f7ff;
  border-radius: 20px;
  padding: 35px;
}

.schedule-section {
  padding-top: 30px;
  padding-bottom: 35px;
}

.schedule-grid {
  grid-template-columns: .7fr 1.3fr;
  align-items: center;
  gap: 50px;
  display: grid;
}

.schedule-grid h2 {
  font-size: 35px;
}

.schedule-grid > div > p {
  letter-spacing: -.5px;
  margin-top: 16px;
  font-size: 18px;
}

.schedule-grid .button {
  min-height: 56px;
  margin-top: 25px;
  padding: 12px 27px;
}

.schedule-list {
  background: #fff;
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 7px 26px #123b7311;
}

.schedule-row {
  text-align: left;
  background: #fff;
  align-items: center;
  gap: 17px;
  width: 100%;
  min-height: 91px;
  padding: 21px 27px;
  transition: background .2s;
  display: flex;
}

.schedule-row:hover {
  background: #f1f6ff;
}

.schedule-row > .nk-icon {
  color: var(--yellow);
  width: 32px;
  height: 32px;
}

.schedule-date {
  white-space: nowrap;
  letter-spacing: -.3px;
  min-width: 111px;
  font-size: 17px;
  font-weight: 800;
}

.schedule-colon {
  margin: 0 11px 0 2px;
  font-size: 22px;
  font-weight: 800;
}

.schedule-title {
  flex-direction: column;
  flex: 1;
  line-height: 1.3;
  display: flex;
}

.schedule-title strong {
  letter-spacing: -.4px;
  font-size: 17px;
  font-weight: 800;
}

.schedule-title small {
  margin-top: 4px;
  font-size: 12px;
}

.schedule-row.is-featured {
  color: #fff;
  background: linear-gradient(110deg, #004dbb, #003a9f);
}

.soon-tag {
  background: var(--yellow);
  color: var(--navy);
  border-radius: 18px;
  padding: 6px 14px;
  font-size: 14px;
  font-weight: 800;
}

.testimonials-section {
  padding-top: 20px;
  padding-bottom: 32px;
}

.testimonial-track {
  scrollbar-width: none;
  scroll-snap-type: x mandatory;
  gap: 30px;
  margin-inline: -3px;
  padding: 3px 3px 13px;
  display: flex;
  overflow-x: auto;
}

.testimonial-card {
  scroll-snap-align: start;
  background: #fff;
  border: 1px solid #eef0f2;
  border-radius: 26px;
  flex: 0 0 61%;
  align-items: flex-start;
  gap: 18px;
  min-height: 230px;
  padding: 29px 26px;
  display: flex;
  box-shadow: 0 5px 14px #10295612;
}

.testimonial-avatar {
  object-fit: cover;
  background: #eae6e2;
  border-radius: 50%;
  flex-shrink: 0;
  width: 128px;
  height: 128px;
}

.testimonial-avatar-initials {
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, #e1efff, #e9f5df);
  color: var(--navy);
  font-size: clamp(20px, 3vw, 36px);
  font-weight: 800;
}

.quote-mark {
  color: #51b52a;
  margin-top: -7px;
  font-family: Georgia, serif;
  font-size: 69px;
  font-weight: 700;
  line-height: 1;
}

.testimonial-card > div {
  flex: 1;
  min-width: 0;
}

.testimonial-card blockquote {
  overflow-wrap: anywhere;
  white-space: pre-line;
  letter-spacing: -.3px;
  color: #12315f;
  margin: 0;
  font-size: 18px;
  line-height: 1.65;
}

.testimonial-card figcaption {
  overflow-wrap: anywhere;
  flex-direction: column;
  margin-top: 28px;
  line-height: 1.4;
  display: flex;
}

.testimonial-card figcaption strong {
  letter-spacing: -.4px;
  font-size: 18px;
  font-weight: 800;
}

.testimonial-card figcaption span {
  font-size: 12px;
}

.package-section {
  max-width: 1440px;
  margin: 3px auto 12px;
  padding: 0 50px;
}

.package-banner {
  isolation: isolate;
  background: linear-gradient(110deg, #005dd2, #073f9e 45%, #00318a);
  border-radius: 36px;
  grid-template-columns: 1.12fr 1fr;
  min-height: 247px;
  display: grid;
  position: relative;
  overflow: hidden;
}

.package-copy {
  color: #fff;
  z-index: 2;
  padding: 35px 45px 36px 70px;
  position: relative;
}

.package-copy h2 {
  letter-spacing: -1.2px;
  font-size: 37px;
  line-height: 1.15;
}

.package-copy p {
  color: #fff;
  letter-spacing: -.3px;
  margin-top: 22px;
  font-size: 17px;
  line-height: 1.55;
}

.spark-yellow {
  color: var(--yellow);
  top: 37px;
  right: 25px;
  transform: rotate(85deg);
}

.package-card {
  background: var(--yellow);
  border-radius: 32px 32px 32px 0;
  margin-left: 20px;
  padding: 14px 35px 17px 17px;
  position: relative;
  transform: skewX(-7deg);
}

.package-card-inner {
  background: #fff;
  border-radius: 24px;
  flex-direction: column;
  justify-content: center;
  height: 100%;
  padding: 20px 55px 15px 50px;
  display: flex;
  transform: skewX(3deg);
}

.package-card h3 {
  align-items: center;
  gap: 8px;
  font-size: 26px;
  display: flex;
}

.package-card h3 .nk-icon {
  color: var(--yellow);
  width: 31px;
  height: 31px;
}

.package-card p {
  color: var(--navy);
  margin: 7px 0 17px 39px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.3;
}

.package-card p strong {
  letter-spacing: -.7px;
  font-size: 26px;
  font-weight: 800;
  display: block;
}

.package-card .button {
  border-radius: 20px;
  align-self: stretch;
  min-height: 49px;
  margin-left: 39px;
  padding: 9px 20px;
  font-size: 17px;
}

.faq-section {
  padding-top: 17px;
  padding-bottom: 34px;
}

.faq-section h2 {
  letter-spacing: -1px;
  font-size: 29px;
}

.faq-list {
  gap: 11px;
  margin-top: 20px;
  display: grid;
}

.faq-list details {
  background: #fff;
  border: 1px solid #f0f1f4;
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 4px 11px #19345d0c;
}

.faq-list summary {
  cursor: pointer;
  letter-spacing: -.4px;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  min-height: 48px;
  padding: 11px 31px;
  font-size: 17px;
  font-weight: 700;
  list-style: none;
  display: flex;
}

.faq-list summary::-webkit-details-marker {
  display: none;
}

.faq-list summary > span {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
}

.faq-list summary > span:before, .faq-list summary > span:after {
  content: "";
  background: #0a418f;
  border-radius: 2px;
  width: 14px;
  height: 2px;
  position: absolute;
  top: 7px;
  left: 0;
}

.faq-list summary > span:after {
  transition: transform .2s;
  transform: rotate(90deg);
}

.faq-list details[open] summary > span:after {
  transform: rotate(0);
}

.faq-list details[open] summary {
  color: var(--blue);
}

.faq-list details p {
  max-width: 1000px;
  padding: 0 31px 19px;
  font-size: 15px;
  line-height: 1.7;
}

.site-footer {
  color: #fff;
  background: linear-gradient(110deg, #073486, #00246c);
  border-radius: 46px 46px 0 0;
  padding: 31px 0 17px;
}

.footer-grid {
  grid-template-columns: 1.5fr 1fr;
  gap: 45px;
  display: grid;
}

.site-footer .brand {
  letter-spacing: -1px;
  font-size: 26px;
}

.footer-brand p {
  color: #fff;
  letter-spacing: -.2px;
  margin-top: 11px;
  font-size: 15px;
  line-height: 1.5;
}

.social-links {
  gap: 12px;
  margin-top: 20px;
  display: flex;
}

.social-links > a {
  background: #ffffff27;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 29px;
  height: 29px;
  transition: background .2s;
  display: flex;
}

.social-links > a:hover {
  background: #ffffff50;
}

.social-links .nk-icon {
  width: 19px;
  height: 19px;
}

.social-links span {
  font-size: 22px;
  font-weight: 800;
  line-height: 1;
}

.footer-grid nav {
  flex-direction: column;
  align-items: flex-start;
  gap: 5px;
  padding-top: 3px;
  display: flex;
}

.footer-grid nav h3 {
  letter-spacing: 0;
  margin-bottom: 8px;
  font-size: 16px;
}

.footer-grid nav a, .footer-grid nav button {
  color: #fff;
  text-align: left;
  background: none;
  padding: 0;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.55;
}

.footer-grid nav a:hover, .footer-grid nav button:hover {
  text-underline-offset: 4px;
  text-decoration: underline;
}

.footer-bottom {
  color: #c7d6f3;
  border-top: 1px solid #ffffff16;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  margin-top: 27px;
  padding-top: 16px;
  font-size: 11px;
  display: flex;
}

.footer-bottom small {
  font-size: inherit;
}

.nk-dialog {
  color: var(--navy);
  background: #fff;
  border: 0;
  border-radius: 28px;
  width: min(620px, 100% - 32px);
  max-height: 90dvh;
  padding: 0;
  box-shadow: 0 25px 120px #02164055;
}

.nk-dialog::backdrop {
  backdrop-filter: blur(5px);
  background: #00193fb3;
}

.dialog-close {
  z-index: 2;
  background: #fff;
  width: 39px;
  height: 39px;
  position: absolute;
  top: 16px;
  right: 16px;
}

.dialog-cover {
  object-fit: cover;
  width: 100%;
  height: 240px;
}

.dialog-content {
  padding: 32px;
}

.dialog-content h2 {
  margin: 4px 0 16px;
  font-size: 30px;
  line-height: 1.2;
}

.dialog-content > p {
  margin-bottom: 20px;
  font-size: 16px;
}

.dialog-meta {
  border-block: 1px solid #e7edf6;
  gap: 20px;
  margin-bottom: 22px;
  padding: 16px 0;
  font-size: 14px;
  font-weight: 700;
  display: flex;
}

.dialog-inclusions {
  gap: 10px;
  margin-bottom: 24px;
  font-size: 14px;
  display: grid;
}

.dialog-inclusions span {
  align-items: center;
  gap: 9px;
  display: flex;
}

.dialog-inclusions .nk-icon {
  color: var(--green);
  width: 19px;
  height: 19px;
}

.dialog-content > .button {
  width: 100%;
}

.video-dialog {
  width: min(920px, 100% - 32px);
  padding: 30px;
}

.video-dialog h2 {
  margin: 0 40px 7px 0;
  font-size: 28px;
}

.video-dialog > p {
  margin-bottom: 20px;
  font-size: 13px;
}

.video-frame {
  aspect-ratio: 16 / 9;
  background: #071c3b;
  border-radius: 14px;
  overflow: hidden;
}

.video-frame iframe {
  border: 0;
  width: 100%;
  height: 100%;
}

.video-dialog > a {
  color: var(--blue);
  margin-top: 15px;
  font-size: 14px;
  font-weight: 700;
  display: inline-flex;
}

.package-detail {
  text-align: center;
  background: #f1f7ff;
  border: 1px solid #e2ecfb;
  border-radius: 20px;
  margin-bottom: 25px;
  padding: 24px;
}

.package-detail > .nk-icon {
  color: #ffc500;
  width: 40px;
  height: 40px;
  margin-bottom: 12px;
}

.package-detail h3 {
  margin-bottom: 18px;
}

.package-detail > span {
  font-size: 13px;
  display: block;
}

.package-detail > strong {
  letter-spacing: -1px;
  font-size: 36px;
  font-weight: 800;
  display: block;
}

.package-detail ul {
  text-align: left;
  max-width: 300px;
  margin: 18px auto 0;
  padding-left: 22px;
  font-size: 14px;
  line-height: 1.9;
  list-style: "✓  ";
}

.info-dialog-body p, #info-dialog-body p {
  margin-bottom: 15px;
  font-size: 16px;
  line-height: 1.7;
}

.dialog-schedule {
  border-bottom: 1px solid #e5ebf4;
  padding: 15px 0;
}

.dialog-schedule strong {
  font-size: 17px;
  display: block;
}

.dialog-schedule span {
  color: var(--muted);
  margin-top: 5px;
  font-size: 14px;
  display: block;
}

@media (width >= 1550px) {
  .hero-visual {
    margin-right: -60px;
  }

  .hero-grid {
    min-height: 670px;
  }

  .hero :is(h1, .hero-slide-title) {
    font-size: 60px;
  }

  .hero-visual {
    height: 600px;
  }

  .hero-copy {
    padding-block: 50px;
  }
}

@media (width <= 1199px) {
  .container {
    width: calc(100% - 112px);
  }

  .header-inner {
    gap: 20px;
    width: calc(100% - 70px);
  }

  .main-nav {
    gap: 24px;
  }

  .brand {
    font-size: 22px;
  }

  .header-actions {
    gap: 9px;
  }

  .button-small {
    padding-inline: 19px;
  }

  .hero-grid {
    min-height: 570px;
  }

  .hero :is(h1, .hero-slide-title) {
    font-size: 46px;
  }

  .hero-copy > p {
    font-size: 17px;
  }

  .hero-visual {
    height: 510px;
    margin-right: -55px;
  }

  .hero-benefits {
    padding: 16px;
    font-size: 12px;
    top: 31px;
    right: 25px;
  }

  .hero-eyebrow {
    font-size: 12px;
  }

  .hero-buttons {
    gap: 13px;
  }

  .hero-buttons .button {
    border-radius: 19px;
    min-height: 53px;
    padding-inline: 19px;
    font-size: 13px;
  }

  .hero-stats {
    gap: 26px;
  }

  .hero-stats strong {
    font-size: 17px;
  }

  .hero-stats span {
    font-size: 11px;
  }

  .hero-stats > div {
    gap: 8px;
  }

  .hero-stats > div > .nk-icon {
    width: 27px;
    height: 27px;
  }

  .category-grid {
    gap: 20px;
  }

  .category-card {
    min-height: 160px;
  }

  .category-card span {
    font-size: 17px;
  }

  h2 {
    font-size: 32px;
  }

  .featured-grid {
    gap: 40px;
  }

  .featured-copy h2 {
    font-size: 37px;
  }

  .featured-title {
    font-size: 23px;
    bottom: 25px;
    left: 25px;
  }

  .featured-badge {
    padding: 6px 13px;
    font-size: 13px;
    top: 15px;
    left: 15px;
  }

  .video-play {
    width: 53px;
    height: 53px;
    bottom: 24px;
    right: 24px;
  }

  .benefit-grid {
    gap: 35px;
  }

  .benefit {
    padding-left: 20px;
  }

  .benefit p {
    font-size: 14px;
  }

  .benefit h3 {
    font-size: 20px;
  }

  .community-grid {
    gap: 22px;
  }

  .community-grid h2 {
    font-size: 28px;
  }

  .community-number strong {
    font-size: 30px;
  }

  .community-number > span {
    font-size: 15px;
  }

  .class-track {
    gap: 22px;
  }

  .class-card {
    flex-basis: calc(33.3333% - 14.6667px);
  }

  .class-body {
    padding: 30px 16px 17px;
  }

  .class-body h3 {
    font-size: 18px;
  }

  .class-meta {
    gap: 12px;
    font-size: 11px;
  }

  .class-rating {
    font-size: 12px;
    top: 23px;
    right: 12px;
  }

  .class-image {
    height: 140px;
  }

  .schedule-grid {
    grid-template-columns: .7fr 1.3fr;
    gap: 35px;
  }

  .schedule-grid h2 {
    font-size: 29px;
  }

  .schedule-grid > div > p {
    font-size: 16px;
  }

  .schedule-row {
    gap: 12px;
    padding: 18px;
  }

  .schedule-date {
    min-width: 90px;
    font-size: 14px;
  }

  .schedule-title strong {
    font-size: 15px;
  }

  .schedule-colon {
    margin: 0 5px;
  }

  .schedule-title small {
    font-size: 10px;
  }

  .soon-tag {
    padding: 5px 12px;
    font-size: 12px;
  }

  .testimonial-avatar {
    width: 105px;
    height: 105px;
  }

  .testimonial-card {
    gap: 12px;
    padding: 25px 22px;
  }

  .testimonial-card blockquote {
    font-size: 14px;
  }

  .testimonial-card figcaption {
    margin-top: 20px;
  }

  .package-section {
    padding-inline: 30px;
  }

  .package-copy {
    padding-left: 50px;
  }

  .package-copy h2 {
    font-size: 32px;
  }

  .package-copy p {
    font-size: 15px;
  }

  .package-card-inner {
    padding-inline: 30px;
  }

  .package-card h3 {
    font-size: 23px;
  }

  .spark-yellow {
    right: 8px;
  }

  .footer-grid {
    gap: 30px;
  }
}

@media (width <= 960px) {
  .container {
    width: calc(100% - 80px);
  }

  .header-inner {
    gap: 12px;
    width: calc(100% - 48px);
    height: 75px;
  }

  .brand {
    font-size: 20px;
  }

  .brand img {
    width: 120px;
    height: auto;
  }

  .main-nav {
    gap: 20px;
  }

  .main-nav a {
    font-size: 12px;
  }

  .main-nav a:after {
    bottom: 17px;
  }

  .header-actions {
    gap: 8px;
  }

  .button-small {
    min-height: 36px;
    padding-inline: 16px;
    font-size: 12px;
  }

  .header-actions > .icon-button {
    width: 36px;
    height: 36px;
  }

  .hero-grid {
    min-height: 500px;
  }

  .hero-copy {
    padding-block: 35px;
  }

  .hero :is(h1, .hero-slide-title) {
    letter-spacing: -1.5px;
    font-size: 39px;
  }

  .hero :is(h1, .hero-slide-title) mark {
    border-radius: 12px;
    padding-inline: 5px;
  }

  .hero-copy > p {
    margin-top: 20px;
    font-size: 14px;
  }

  .hero-buttons {
    gap: 13px;
    margin-top: 23px;
  }

  .hero-buttons .button {
    border-radius: 16px;
    gap: 6px;
    min-height: 45px;
    padding-inline: 16px;
    font-size: 11px;
  }

  .hero-buttons .button > .nk-icon {
    width: 17px;
    height: 17px;
  }

  .play-small {
    width: 22px;
    height: 22px;
  }

  .hero-stats {
    gap: 23px;
    margin-top: 28px;
  }

  .hero-stats strong {
    font-size: 14px;
  }

  .hero-stats span {
    font-size: 9px;
  }

  .hero-stats > div > .nk-icon {
    width: 23px;
    height: 23px;
  }

  .hero-eyebrow {
    gap: 3px;
    margin-bottom: 13px;
    padding-right: 9px;
    font-size: 10px;
  }

  .hero-eyebrow .nk-icon {
    width: 20px;
    height: 20px;
  }

  .hero-visual {
    height: 460px;
    margin-right: -38px;
  }

  .hero-benefits {
    border-radius: 15px;
    gap: 3px;
    padding: 13px;
    font-size: 10px;
    top: 37px;
    right: 10px;
  }

  .hero-benefits .nk-icon {
    width: 15px;
    height: 15px;
  }

  .spark-green {
    top: 45px;
    left: -16px;
    transform: scale(.7);
  }

  .section {
    padding-block: 32px;
  }

  .section-label {
    margin-bottom: 7px;
    font-size: 15px;
  }

  h2 {
    letter-spacing: -.9px;
    font-size: 27px;
  }

  .section-description {
    margin-top: 8px;
    font-size: 14px;
  }

  .category-grid {
    gap: 17px;
    margin-top: 20px;
  }

  .category-card {
    border-radius: 23px;
    gap: 15px;
    min-height: 143px;
    padding: 20px 8px;
  }

  .category-card > .nk-icon {
    width: 36px;
    height: 36px;
  }

  .category-card span {
    font-size: 14px;
  }

  .featured-grid {
    gap: 37px;
  }

  .featured-copy h2 {
    font-size: 31px;
  }

  .featured-copy p {
    margin-top: 15px;
    font-size: 14px;
  }

  .featured-copy .button {
    border-radius: 17px;
    min-height: 44px;
    margin-top: 17px;
    padding: 10px 21px;
    font-size: 12px;
  }

  .featured-video {
    aspect-ratio: 2.05;
    border-radius: 22px;
  }

  .featured-title {
    font-size: 20px;
    bottom: 24px;
    left: 22px;
  }

  .featured-badge {
    padding: 5px 12px;
    font-size: 11px;
  }

  .video-play {
    width: 45px;
    height: 45px;
    bottom: 24px;
    right: 22px;
  }

  .video-play .nk-icon {
    width: 25px;
    height: 25px;
  }

  .section-center p {
    margin-top: 13px;
    font-size: 12px;
  }

  .benefit-grid {
    gap: 25px;
    margin-top: 30px;
  }

  .benefit {
    padding-left: 20px;
  }

  .benefit > .nk-icon {
    width: 38px;
    height: 38px;
    margin-bottom: 12px;
  }

  .benefit h3 {
    font-size: 17px;
  }

  .benefit p {
    margin-top: 10px;
    font-size: 12px;
  }

  .community-band {
    margin-top: 8px;
    padding-block: 35px 40px;
  }

  .community-grid {
    gap: 18px;
  }

  .community-grid h2 {
    letter-spacing: -.8px;
    padding-right: 20px;
    font-size: 25px;
  }

  .community-number {
    padding: 10px 5px;
  }

  .community-number > .nk-icon {
    width: 35px;
    height: 35px;
    margin-bottom: 10px;
  }

  .community-number strong {
    font-size: 26px;
  }

  .community-number > span {
    font-size: 13px;
  }

  .carousel-controls .icon-button {
    width: 43px;
    height: 43px;
  }

  .section-heading-row {
    margin-bottom: 20px;
  }

  .class-track {
    gap: 23px;
  }

  .class-card {
    border-radius: 20px;
    flex-basis: calc(33.3333% - 15.3333px);
  }

  .class-image {
    height: 116px;
  }

  .class-tag {
    border-radius: 9px;
    padding: 5px 9px;
    font-size: 11px;
    bottom: -12px;
    left: 14px;
  }

  .class-body {
    padding: 29px 14px 15px;
  }

  .class-body h3 {
    min-height: 37px;
    padding-right: 28px;
    font-size: 15px;
  }

  .class-rating {
    gap: 0;
    padding: 2px 3px;
    font-size: 10px;
    top: 23px;
    right: 10px;
  }

  .class-rating .nk-icon {
    width: 13px;
    height: 13px;
  }

  .class-meta {
    gap: 10px;
    margin-top: 12px;
    font-size: 9px;
  }

  .class-meta .nk-icon {
    width: 13px;
    height: 13px;
  }

  .schedule-grid {
    grid-template-columns: .7fr 1.3fr;
    gap: 30px;
  }

  .schedule-grid h2 {
    font-size: 26px;
  }

  .schedule-grid > div > p {
    margin-top: 12px;
    font-size: 14px;
  }

  .schedule-grid .button {
    border-radius: 17px;
    min-height: 43px;
    margin-top: 20px;
    padding: 10px 18px;
    font-size: 12px;
  }

  .schedule-row {
    gap: 12px;
    min-height: 77px;
    padding: 17px;
  }

  .schedule-row > .nk-icon {
    width: 25px;
    height: 25px;
  }

  .schedule-date {
    min-width: 78px;
    font-size: 12px;
  }

  .schedule-title strong {
    font-size: 12px;
  }

  .schedule-title small {
    font-size: 9px;
  }

  .schedule-colon {
    margin: 0 4px 0 0;
    font-size: 17px;
  }

  .soon-tag {
    padding: 4px 10px;
    font-size: 10px;
  }

  .testimonial-track {
    gap: 24px;
  }

  .testimonial-card {
    border-radius: 23px;
    gap: 12px;
    padding: 24px 20px;
  }

  .testimonial-avatar {
    width: 90px;
    height: 90px;
  }

  .quote-mark {
    font-size: 52px;
  }

  .testimonial-card blockquote {
    font-size: 12px;
  }

  .testimonial-card figcaption strong {
    font-size: 15px;
  }

  .testimonial-card figcaption span {
    font-size: 10px;
  }

  .package-section {
    padding-inline: 30px;
  }

  .package-banner {
    border-radius: 30px;
    min-height: 215px;
  }

  .package-copy {
    padding: 29px 35px 30px 45px;
  }

  .package-copy h2 {
    font-size: 28px;
  }

  .package-copy p {
    margin-top: 20px;
    font-size: 13px;
  }

  .package-card {
    border-radius: 27px 27px 27px 0;
    margin-left: 15px;
    padding: 12px 25px 14px 14px;
  }

  .package-card-inner {
    border-radius: 20px;
    padding: 16px 29px 14px 25px;
  }

  .package-card h3 {
    font-size: 21px;
  }

  .package-card h3 .nk-icon {
    width: 25px;
    height: 25px;
  }

  .package-card p {
    margin-bottom: 13px;
    margin-left: 32px;
    font-size: 12px;
  }

  .package-card p strong {
    font-size: 22px;
  }

  .package-card .button {
    border-radius: 15px;
    min-height: 40px;
    margin-left: 32px;
    font-size: 14px;
  }

  .spark-yellow {
    top: 20px;
    right: 0;
    transform: scale(.7) rotate(85deg);
  }

  .faq-section h2 {
    font-size: 25px;
  }

  .faq-list {
    gap: 10px;
    margin-top: 18px;
  }

  .faq-list summary {
    min-height: 43px;
    padding: 10px 23px;
    font-size: 13px;
  }

  .faq-list details p {
    padding: 0 23px 15px;
    font-size: 12px;
  }

  .site-footer {
    border-radius: 35px 35px 0 0;
    padding-top: 30px;
  }

  .footer-grid {
    grid-template-columns: 1.5fr 1fr;
    gap: 25px;
  }

  .site-footer .brand {
    font-size: 22px;
  }

  .footer-brand p {
    margin-top: 10px;
    font-size: 12px;
  }

  .footer-grid nav h3 {
    font-size: 13px;
  }

  .footer-grid nav a, .footer-grid nav button {
    font-size: 11px;
  }

  .social-links {
    gap: 8px;
    margin-top: 17px;
  }

  .social-links > a {
    width: 25px;
    height: 25px;
  }

  .social-links .nk-icon {
    width: 16px;
    height: 16px;
  }

  .footer-bottom {
    font-size: 10px;
  }
}

@media (width <= 760px) {
  .hero .hero-visual {
    display: none;
  }

  .site-header .brand {
    transform: translateX(0);
  }

  .container {
    width: calc(100% - 44px);
  }

  .header-inner {
    width: calc(100% - 36px);
    height: 72px;
  }

  .brand {
    font-size: 21px;
  }

  .brand img {
    width: 120px;
    height: auto;
  }

  .header-actions .button-small {
    padding: 9px 16px;
  }

  .header-actions > .search-toggle {
    width: 34px;
    height: 34px;
  }

  .header-actions .menu-toggle {
    width: 35px;
    height: 35px;
    box-shadow: none;
    border: 0;
    display: inline-flex;
  }

  .header-actions {
    gap: 8px;
  }

  .main-nav {
    background: #fff;
    border-radius: 0 0 25px 25px;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    height: auto;
    padding: 12px 22px 20px;
    display: none;
    position: absolute;
    top: calc(100% - 1px);
    left: 0;
    right: 0;
    box-shadow: 0 14px 20px #11396c0d;
  }

  .main-nav.is-open {
    display: flex;
  }

  .main-nav a {
    border-radius: 10px;
    height: auto;
    padding: 12px;
    font-size: 15px;
  }

  .main-nav a:after {
    display: none;
  }

  .main-nav a.is-active {
    background: #f0f6ff;
  }

  .hero {
    border-radius: 0 0 45px;
  }

  .hero-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    min-height: 0;
  }

  .hero-copy {
    width: 100%;
    max-width: 560px;
    margin-inline: auto;
    padding: 35px 0 15px;
  }

  .hero-eyebrow {
    margin-bottom: 18px;
    font-size: 12px;
  }

  .hero-eyebrow .nk-icon {
    width: 23px;
    height: 23px;
  }

  .hero :is(h1, .hero-slide-title) {
    letter-spacing: -1.7px;
    font-size: clamp(35px, 7.6vw, 55px);
    line-height: 1.04;
  }

  .hero-copy > p {
    margin-top: 21px;
    font-size: 16px;
  }

  .hero-buttons {
    gap: 14px;
    margin-top: 25px;
  }

  .hero-buttons .button {
    border-radius: 17px;
    min-height: 49px;
    padding-inline: 19px;
    font-size: 13px;
  }

  .hero-stats {
    gap: 35px;
    margin-top: 29px;
  }

  .hero-stats strong {
    font-size: 17px;
  }

  .hero-stats span {
    font-size: 11px;
  }

  .hero-stats > div > .nk-icon {
    width: 29px;
    height: 29px;
  }

  .hero-visual {
    width: 100%;
    max-width: 560px;
    height: 420px;
    margin: 18px auto 0;
  }

  .hero-blob {
    inset: 6%;
  }

  .hero-benefits {
    border-radius: 17px;
    padding: 15px;
    font-size: 12px;
    top: 23px;
    right: 16px;
  }

  .hero-benefits .nk-icon {
    width: 18px;
    height: 18px;
  }

  .spark-green {
    top: 30px;
    left: 8px;
    transform: scale(.75);
  }

  .section {
    padding-block: 30px;
  }

  h2 {
    font-size: 28px;
  }

  .section-label {
    font-size: 15px;
  }

  .section-description {
    font-size: 14px;
    line-height: 1.6;
  }

  .category-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 13px;
  }

  .category-card {
    border-radius: 22px;
    min-height: 140px;
    padding: 20px 9px;
  }

  .category-card span {
    font-size: 14px;
  }

  .category-grid .category-card:nth-last-child(-n+2) {
    grid-column: auto;
  }

  .featured-grid {
    grid-template-columns: 1fr;
    gap: 23px;
  }

  .featured-copy h2 {
    font-size: 33px;
    line-height: 1.08;
  }

  .featured-copy h2 br {
    display: none;
  }

  .featured-copy p {
    margin-top: 14px;
    font-size: 15px;
  }

  .featured-copy p br {
    display: none;
  }

  .featured-copy .button {
    min-height: 46px;
    padding-inline: 20px;
    font-size: 13px;
  }

  .featured-video {
    aspect-ratio: 1.85;
    border-radius: 23px;
  }

  .featured-title {
    font-size: 24px;
    bottom: 26px;
    left: 23px;
  }

  .featured-badge {
    font-size: 12px;
  }

  .video-play {
    width: 49px;
    height: 49px;
    bottom: 24px;
    right: 22px;
  }

  .benefits-section {
    padding-top: 25px;
  }

  .section-center h2 {
    font-size: 28px;
  }

  .section-center p {
    max-width: 400px;
    margin: 13px auto 0;
    font-size: 13px;
  }

  .benefit-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 32px 20px;
    margin-top: 30px;
  }

  .benefit {
    padding-left: 15px;
  }

  .benefit h3 {
    font-size: 20px;
  }

  .benefit p {
    font-size: 14px;
  }

  .benefit > .nk-icon {
    width: 44px;
    height: 44px;
  }

  .benefit:not(:first-child):before {
    display: none;
  }

  .community-band {
    clip-path: polygon(0 0, 50% 3%, 100% 0, 100% 100%, 50% 97%, 0 100%);
    border-radius: 38px 38px 35px 0;
    padding-block: 35px 40px;
  }

  .community-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 20px 6px;
  }

  .community-grid h2 {
    text-align: center;
    grid-column: 1 / -1;
    padding: 0 0 5px;
    font-size: 28px;
    line-height: 1.24;
  }

  .community-grid h2 br, .community-grid h2:after {
    display: none;
  }

  .community-grid h2 span:after {
    height: 4px;
    bottom: -7px;
  }

  .community-number {
    padding: 10px 0;
  }

  .community-number strong {
    font-size: 26px;
  }

  .community-number > span {
    margin-top: 4px;
    font-size: 11px;
  }

  .community-number > .nk-icon {
    width: 35px;
    height: 35px;
  }

  .section-heading-row {
    align-items: flex-end;
    gap: 15px;
  }

  .section-heading-row h2 {
    font-size: 26px;
  }

  .carousel-controls {
    flex-shrink: 0;
    gap: 7px;
    margin-bottom: 3px;
  }

  .carousel-controls .icon-button {
    width: 37px;
    height: 37px;
  }

  .carousel-controls .nk-icon {
    width: 20px;
    height: 20px;
  }

  .class-track {
    gap: 17px;
    padding-bottom: 16px;
  }

  .class-card {
    border-radius: 21px;
    flex-basis: 76%;
  }

  .class-image {
    height: 170px;
  }

  .class-tag {
    padding: 5px 10px;
    font-size: 13px;
    left: 17px;
  }

  .class-body {
    padding: 30px 17px 18px;
  }

  .class-body h3 {
    min-height: 48px;
    padding-right: 45px;
    font-size: 20px;
  }

  .class-rating {
    font-size: 12px;
    top: 26px;
    right: 14px;
  }

  .class-rating .nk-icon {
    width: 16px;
    height: 16px;
  }

  .class-meta {
    gap: 15px;
    margin-top: 15px;
    font-size: 11px;
  }

  .class-meta .nk-icon {
    width: 15px;
    height: 15px;
  }

  .schedule-grid {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .schedule-grid h2 {
    font-size: 28px;
  }

  .schedule-grid > div > p {
    font-size: 15px;
  }

  .schedule-grid > div > p br {
    display: none;
  }

  .schedule-grid .button {
    min-height: 45px;
    margin-top: 18px;
    font-size: 13px;
  }

  .schedule-row {
    gap: 12px;
    min-height: 83px;
    padding: 17px 16px;
  }

  .schedule-date {
    min-width: 75px;
    font-size: 12px;
  }

  .schedule-title strong {
    font-size: 13px;
  }

  .schedule-title small {
    font-size: 10px;
  }

  .schedule-colon {
    margin-right: 2px;
    font-size: 17px;
  }

  .schedule-list {
    border-radius: 21px;
  }

  .soon-tag {
    padding-inline: 9px;
    font-size: 10px;
  }

  .schedule-row > .nk-icon {
    width: 25px;
    height: 25px;
  }

  .testimonial-track {
    gap: 18px;
  }

  .testimonial-card {
    border-radius: 23px;
    flex-basis: 92%;
    gap: 12px;
    padding: 24px 20px;
  }

  .testimonial-avatar {
    width: 78px;
    height: 78px;
  }

  .quote-mark {
    font-size: 47px;
  }

  .testimonial-card blockquote {
    font-size: 13px;
  }

  .testimonial-card figcaption {
    margin-top: 20px;
  }

  .testimonial-card figcaption strong {
    font-size: 16px;
  }

  .testimonial-card figcaption span {
    font-size: 11px;
  }

  .package-section {
    margin-top: 5px;
    padding: 0 15px;
  }

  .package-banner {
    border-radius: 29px;
    grid-template-columns: 1fr;
    overflow: hidden;
  }

  .package-copy {
    padding: 29px 28px 32px;
  }

  .package-copy h2 {
    font-size: 33px;
  }

  .package-copy p {
    margin-top: 20px;
    font-size: 15px;
  }

  .spark-yellow {
    top: 29px;
    right: 27px;
  }

  .package-card {
    border-radius: 30px 30px 0 0;
    margin: 0;
    padding: 15px 20px 20px;
    transform: none;
  }

  .package-card-inner {
    border-radius: 24px;
    padding: 23px 28px;
    transform: none;
  }

  .package-card h3 {
    font-size: 26px;
  }

  .package-card p {
    margin: 10px 0 18px 33px;
    font-size: 14px;
  }

  .package-card p strong {
    font-size: 29px;
  }

  .package-card .button {
    min-height: 48px;
    margin-left: 33px;
    font-size: 16px;
  }

  .faq-section {
    padding-top: 25px;
    padding-bottom: 30px;
  }

  .faq-section h2 {
    font-size: 25px;
    line-height: 1.25;
  }

  .faq-list summary {
    gap: 15px;
    min-height: 49px;
    padding: 13px 18px;
    font-size: 13px;
  }

  .faq-list details p {
    padding: 0 18px 17px;
    font-size: 13px;
  }

  .site-footer {
    border-radius: 32px 32px 0 0;
    padding-block: 30px 17px;
  }

  .footer-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 30px 23px;
  }

  .footer-brand {
    grid-column: 1 / -1;
  }

  .site-footer .brand {
    font-size: 25px;
  }

  .footer-brand p {
    font-size: 14px;
  }

  .footer-grid nav h3 {
    margin-bottom: 7px;
    font-size: 15px;
  }

  .footer-grid nav a, .footer-grid nav button {
    font-size: 13px;
  }

  .footer-grid nav {
    gap: 7px;
  }

  .social-links > a {
    width: 30px;
    height: 30px;
  }

  .social-links .nk-icon {
    width: 19px;
    height: 19px;
  }

  .footer-bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
    margin-top: 25px;
    font-size: 10px;
  }

  .filter-status {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }

  .search-panel {
    width: calc(100% - 30px);
    padding: 21px;
    right: 15px;
  }

  .search-panel > div {
    flex-direction: column;
  }

  .search-panel input {
    min-height: 46px;
  }

  .search-panel label {
    font-size: 14px;
  }

  .search-panel .button {
    align-self: flex-start;
  }

  .dialog-content {
    padding: 25px;
  }

  .dialog-cover {
    height: 200px;
  }

  .dialog-content h2 {
    font-size: 27px;
  }

  .dialog-content > .button {
    font-size: 13px;
  }

  .dialog-meta {
    gap: 12px;
    font-size: 12px;
  }

  .dialog-inclusions {
    font-size: 13px;
  }

  .video-dialog {
    padding: 23px;
  }

  .video-dialog h2 {
    font-size: 24px;
  }

  .video-dialog > p {
    max-width: 85%;
    font-size: 11px;
  }

  .desktop-break {
    display: none;
  }
}

@media (width <= 390px) {
  .container {
    width: calc(100% - 36px);
  }

  .header-inner {
    gap: 8px;
    width: calc(100% - 28px);
  }

  .header-actions {
    gap: 5px;
  }

  .brand {
    gap: 6px;
    font-size: 19px;
  }

  .brand img {
    width: 110px;
    height: auto;
  }

  .header-actions .button-small {
    min-height: 34px;
    padding-inline: 12px;
    font-size: 11px;
  }

  .header-actions > .search-toggle, .header-actions .menu-toggle {
    width: 31px;
    height: 31px;
  }

  .hero :is(h1, .hero-slide-title) {
    letter-spacing: -1.5px;
    font-size: 34px;
  }

  .hero-copy > p {
    font-size: 14px;
  }

  .hero-buttons {
    gap: 9px;
  }

  .hero-buttons .button {
    gap: 6px;
    min-height: 46px;
    padding-inline: 15px;
    font-size: 11px;
  }

  .hero-stats {
    gap: 25px;
  }

  .hero-stats strong {
    font-size: 15px;
  }

  .hero-stats span {
    font-size: 10px;
  }

  .hero-stats > div {
    gap: 6px;
  }

  .hero-stats > div > .nk-icon {
    width: 25px;
    height: 25px;
  }

  .hero-visual {
    height: 340px;
  }

  .hero-benefits {
    padding: 12px;
    font-size: 10px;
  }

  .category-card {
    min-height: 130px;
    padding-inline: 6px;
  }

  .category-card span {
    font-size: 12px;
  }

  .category-card > .nk-icon {
    width: 33px;
    height: 33px;
  }

  .category-grid {
    gap: 10px;
  }

  .featured-title {
    font-size: 20px;
    bottom: 21px;
    left: 18px;
  }

  .featured-badge {
    font-size: 11px;
    top: 13px;
    left: 13px;
  }

  .video-play {
    width: 42px;
    height: 42px;
    bottom: 20px;
    right: 17px;
  }

  .class-card {
    flex-basis: 87%;
  }

  .schedule-row {
    gap: 8px;
    padding-inline: 12px;
  }

  .schedule-row > .nk-icon {
    width: 23px;
    height: 23px;
  }

  .schedule-date {
    min-width: 68px;
    font-size: 11px;
  }

  .schedule-title strong {
    font-size: 11px;
  }

  .schedule-title small {
    font-size: 9px;
  }

  .soon-tag {
    padding-inline: 7px;
    font-size: 9px;
  }

  .testimonial-card {
    flex-basis: 100%;
    gap: 9px;
    padding: 22px 17px;
  }

  .testimonial-avatar {
    width: 64px;
    height: 64px;
  }

  .testimonial-card blockquote {
    font-size: 12px;
  }

  .quote-mark {
    font-size: 38px;
  }

  .section-heading-row h2 {
    font-size: 24px;
  }

  .carousel-controls .icon-button {
    width: 32px;
    height: 32px;
  }

  .package-copy h2 {
    font-size: 30px;
  }

  .package-copy p {
    font-size: 13px;
  }

  .spark-yellow {
    right: 8px;
  }
}

.class-body h3 {
  padding-right: 0;
}

@media (width >= 761px) and (width <= 960px) {
  .hero :is(h1, .hero-slide-title) {
    font-size: 34px;
  }
}

.learning-subheading {
  margin: 30px 0 18px;
  font-size: 23px;
  position: relative;
  padding-left: 18px;
}

.learning-subheading::before {
  content: '';
  position: absolute;
  left: 0;
  top: 5px;
  bottom: 5px;
  width: 6px;
  border-radius: 4px;
  background: var(--yellow);
}

.subject-grid,
.learning-program-grid {
  display: grid;
  gap: 20px;
}

.subject-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.subject-card {
  padding: 22px 20px;
  border-radius: 24px;
  text-align: center;
}

.subject-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 68px;
  height: 68px;
  margin-bottom: 14px;
  border-radius: 19px;
  background: #ffffffc9;
  box-shadow: 0 5px 14px #092d6309;
}

.subject-icon .nk-icon,
.learning-program-top > .nk-icon {
  width: 42px;
  height: 42px;
}

.subject-card h4,
.learning-program-card h4 {
  margin: 0;
  font-size: 20px;
  line-height: 1.35;
}

.subject-card p {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 15px;
}

.learning-program-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.learning-program-card {
  display: flex;
  flex-direction: column;
  padding: 26px;
  background: linear-gradient(135deg, #fff, #f6f9ff);
  border: 1px solid #deE9f7;
  border-radius: 24px;
  box-shadow: var(--shadow);
}

.learning-program-card.is-highlighted {
  border-color: var(--yellow);
  background: linear-gradient(135deg, #fffefa, #fffaf0);
  box-shadow: 0 8px 24px #d8af1814;
}

.learning-program-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 16px;
}

.learning-program-badge {
  padding: 5px 14px;
  border-radius: 20px;
  background: #c9e1ff;
  font-size: 13px;
  font-weight: 700;
}

.is-highlighted .learning-program-badge {
  background: #ffe16a;
}

.learning-program-features {
  display: grid;
  gap: 10px;
  padding: 0;
  margin: 18px 0 22px;
  list-style: none;
}

.learning-program-features li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 14px;
  color: var(--muted);
}

.learning-program-features .nk-icon {
  width: 19px;
  height: 19px;
  flex-shrink: 0;
  color: var(--green);
  margin-top: 2px;
}

.learning-program-card .button {
  width: 100%;
  min-height: 42px;
  margin-top: auto;
  padding: 9px 12px;
  font-size: 14px;
  white-space: normal;
}

.learning-program-card .button-outline {
  background: #eaf3ff;
}

.trial-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-top: 28px;
  padding: 22px 34px;
  background: linear-gradient(110deg, #e4f0ff, #edf5ff 55%, #e4f0ff);
  border-radius: 24px;
}

.trial-banner h3 {
  margin: 6px 0 0;
  font-size: 26px;
}

.trial-banner p {
  margin: 5px 0 0;
  color: var(--muted);
  font-size: 15px;
}

.trial-banner .trial-note {
  font-size: 13px;
}

.trial-banner .button {
  flex-shrink: 0;
}

@media (width <= 960px) {
  .subject-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .learning-program-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .trial-banner {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (width <= 390px) {
  .subject-grid {
    gap: 12px;
  }

  .subject-card {
    padding: 22px 12px;
  }

  .subject-card h4 {
    font-size: 17px;
  }

  .subject-card p {
    font-size: 13px;
  }

  .trial-banner {
    padding: 22px;
  }

  .trial-banner .button {
    width: 100%;
    white-space: normal;
  }
}

:is(.subject-dots, .program-dots, .pricing-dots) {
  display: none;
}

@media (width <= 760px) {
  :is(.subject-dots, .program-dots, .pricing-dots) {
    display: flex;
    justify-content: center;
    gap: 4px;
    margin-top: 8px;
  }

  :is(.subject-dots, .program-dots, .pricing-dots) button {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 50%;
  }

  :is(.subject-dots, .program-dots, .pricing-dots) button::before {
    content: '';
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #b9cbe2;
  }

  :is(.subject-dots, .program-dots, .pricing-dots) button[aria-current="true"]::before {
    background: var(--blue);
  }

  :is(.subject-dots, .program-dots, .pricing-dots) button:focus-visible {
    outline: 2px solid var(--blue);
  }

  :is(.subject-grid, .learning-program-grid) {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    overscroll-behavior-x: contain;
    padding-bottom: 12px;
    scrollbar-width: none;
  }

  :is(.subject-grid, .learning-program-grid)::-webkit-scrollbar {
    display: none;
  }

  :is(.subject-grid .subject-card, .learning-program-grid .learning-program-card) {
    flex: 0 0 100%;
    min-width: 0;
    scroll-snap-align: start;
    scroll-snap-stop: always;
  }

  :is(.subject-grid, .learning-program-grid):focus-visible {
    outline: 2px solid var(--blue);
    outline-offset: 4px;
  }
}

.hero-buttons .button:disabled {
  color: #6b7280;
  background: #e5e7eb;
  border-color: #d1d5db;
  box-shadow: none;
  cursor: not-allowed;
  transform: none;
}

.hero-buttons .button:disabled .play-small {
  color: #fff;
  background: #9ca3af;
}

.pricing-section {
  max-width: 1488px;
  margin: 12px auto 32px;
  padding: 0 24px;
}

.pricing-panel {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 36px 30px 44px;
  background: url('../images/pricing-background.svg') center / 100% 100% no-repeat;
  color: #fff;
}

.pricing-intro {
  display: grid;
  grid-template-columns: 1fr 300px;
  align-items: center;
  gap: 24px;
  padding: 0 34px;
  margin-bottom: 28px;
}

.pricing-label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 20px;
  background: #ffe13a;
  color: var(--navy);
  border-radius: 30px;
  font-size: 20px;
  font-weight: 800;
}

.pricing-label .nk-icon {
  width: 28px;
  height: 28px;
}

.pricing-intro h2 {
  margin-top: 16px;
  font-size: clamp(30px, 3.6vw, 52px);
  line-height: 1.12;
  color: #fff;
}

.pricing-intro h2 span {
  color: var(--yellow);
}

.pricing-intro p {
  margin-top: 18px;
  color: #fff;
  font-size: 20px;
  line-height: 1.5;
}

.pricing-illustration {
  width: 100%;
  height: auto;
  filter: drop-shadow(0 12px 7px #00286d33);
}

.pricing-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.pricing-grid:focus-visible {
  outline: 3px solid var(--yellow);
  outline-offset: 4px;
}

.pricing-card {
  --package-tint: #d1ecff;
  --package-background: #f0faff;
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 26px 20px;
  border: 1px solid #ffffffb3;
  border-radius: 30px;
  background: linear-gradient(140deg, #fff, var(--package-background));
  color: var(--navy);
  box-shadow: 0 8px 20px #002e751a;
}

.pricing-yellow { --package-tint: #fff0bf; --package-background: #fffae9; }
.pricing-purple { --package-tint: #ebddff; --package-background: #f7f1ff; }
.pricing-green { --package-tint: #d0f4d3; --package-background: #edfff0; }

.pricing-card-heading {
  display: flex;
  align-items: center;
  gap: 12px;
}

.pricing-card-heading > .nk-icon {
  width: 52px;
  height: 52px;
  flex-shrink: 0;
}

.pricing-card h3 {
  margin: 0;
  font-size: 21px;
  line-height: 1.25;
  letter-spacing: -.6px;
}

.pricing-card-heading p {
  margin-top: 10px;
  font-size: 15px;
  line-height: 1.4;
}

.pricing-capacity,
.pricing-level {
  padding: 8px 10px;
  border-radius: 28px;
  background: var(--package-tint);
  text-align: center;
  font-size: 15px;
  font-weight: 800;
}

.pricing-capacity {
  margin-top: 20px;
}

.pricing-amount {
  margin-top: 18px;
  padding: 18px 0;
  border-top: 1px solid #bac8d6;
}

.pricing-amount p,
.pricing-amount span {
  color: #50566a;
  font-size: 17px;
  font-weight: 700;
}

.pricing-amount strong {
  display: block;
  font-size: clamp(29px, 2.8vw, 43px);
  line-height: 1.3;
  letter-spacing: -1px;
}

.pricing-amount span {
  display: block;
  min-height: 26px;
}

.pricing-level {
  margin-top: auto;
}

.pricing-actions {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 32px;
  margin-top: 38px;
}

.pricing-actions .button {
  min-height: 58px;
  padding: 14px 28px;
  border: 2px solid #fff;
  font-size: 19px;
  white-space: normal;
  text-align: center;
}

.pricing-consult {
  color: #fff;
  background: transparent;
}

@media (width <= 1100px) {
  .pricing-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pricing-intro { grid-template-columns: 1fr 220px; padding-inline: 0; }
  .pricing-intro p { font-size: 17px; }
  .pricing-actions { gap: 16px; }
  .pricing-actions .button { font-size: 16px; }
}

@media (width <= 760px) {
  .pricing-section { padding: 0 18px; }
  .pricing-panel { padding: 28px 18px; border-radius: 32px; background: linear-gradient(125deg, #086ccd, #0047a6 65%, #006ac9); }
  .pricing-intro { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .pricing-label { font-size: 15px; padding: 7px 14px; }
  .pricing-intro h2 { font-size: 32px; }
  .pricing-illustration { display: none; }
  .pricing-grid {
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: 90%;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    padding-bottom: 14px;
    scrollbar-width: thin;
    scrollbar-color: #ffffff99 transparent;
  }
  .pricing-dots button[aria-current="true"]::before { background: var(--yellow); }
  .pricing-dots button:focus-visible { outline-color: var(--yellow); }
  .pricing-card {
    padding: 24px 18px;
    scroll-snap-align: start;
  }
  .pricing-amount strong { font-size: 38px; }
  .pricing-actions { flex-direction: column; margin-top: 26px; }
  .pricing-actions .button { width: 100%; }
}

.floating-whatsapp {
  position: fixed;
  right: calc(20px + env(safe-area-inset-right, 0px));
  bottom: calc(20px + env(safe-area-inset-bottom, 0px));
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 58px;
  color: #fff;
  background: #158442;
  border: 2px solid #fff;
  border-radius: 50%;
  box-shadow: 0 5px 18px #073b2940;
  transition: background .2s, transform .2s;
}

.floating-whatsapp .nk-icon {
  width: 35px;
  height: 35px;
}

.floating-whatsapp:hover {
  background: #106b35;
  transform: translateY(-3px);
}

.floating-whatsapp:focus-visible {
  outline: 3px solid var(--navy);
  outline-offset: 4px;
}

/* Public class catalog */
.catalog-page { color: #09265d; background: #fff; }
.catalog-header { min-height: 64px; display:flex; align-items:center; gap:24px; padding:6px max(4.5%,calc((100% - 1320px)/2)); border-bottom:1px solid #e8edf5; }
.catalog-header img,.catalog-footer img { width:105px; height:auto; }
.catalog-header nav { display:flex; align-items:center; justify-content:center; gap:clamp(20px,4vw,54px); flex:1; }
.catalog-header nav a { position:relative; padding:16px 0; color:#09265d; font-weight:700; text-decoration:none; }
.catalog-header nav a.active::after { content:''; position:absolute; bottom:4px; left:0; right:0; height:4px; border-radius:4px; background:#ffcb00; }
.catalog-login,.catalog-signup { padding:9px 23px; border:1px solid #1761bd; border-radius:24px; font-weight:800; text-decoration:none; }
.catalog-signup { background:#ffcb00; border-color:#ffcb00; }
.catalog-hero { min-height:280px; position:relative; display:flex; align-items:center; justify-content:space-between; overflow:hidden; padding:34px max(4.5%,calc((100% - 1320px)/2)); background:linear-gradient(110deg,#f5f9ff,#eaf5ff); }
.catalog-hero h1 { margin:20px 0 8px; font-size:clamp(40px,5vw,60px); letter-spacing:-2.5px; }
.catalog-hero h1 mark { padding:0 10px; color:#09265d; background:#ffcd00; border-radius:18px; }
.catalog-hero p { font-size:19px; line-height:1.5; }
.catalog-hero img { width:min(44%,500px); max-height:260px; object-fit:contain; object-position:center bottom; align-self:flex-end; }
.catalog-badge { display:inline-flex; align-items:center; gap:9px; padding:9px 16px; background:white; border:1px solid #e4ecf8; border-radius:30px; box-shadow:0 5px 18px #0a397411; font-weight:800; }
.catalog-badge img { width:26px; height:28px; object-fit:contain; }
.catalog-content { max-width:1360px; margin:0 auto; padding:30px 24px 24px; }
.catalog-filters { display:flex; align-items:center; gap:12px; margin-bottom:30px; }
.catalog-filters label { min-width:160px; }
.catalog-filters select,.catalog-search { width:100%; height:46px; padding:0 16px; border:1px solid #d8e0ed; border-radius:26px; background:#fff; color:#10295c; box-shadow:0 2px 7px #09265d0d; }
.catalog-filters select { cursor:pointer; }
.catalog-search { display:flex; align-items:center; gap:10px; flex:1; }
.catalog-search .nk-icon { width:20px; height:20px; flex:none; }
.catalog-search input { width:100%; min-width:0; border:0; outline:0; background:transparent; color:inherit; }
.catalog-filter-submit { height:46px; padding:0 18px; border:0; border-radius:24px; background:#ffcb00; color:#09265d; font-weight:800; cursor:pointer; white-space:nowrap; }
.catalog-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.catalog-card { min-height:208px; display:grid; grid-template-columns:120px minmax(0,1fr) auto; grid-template-rows:auto 1fr auto; gap:10px 14px; align-items:center; padding:18px; border:1px solid #e5eaf3; border-radius:22px; box-shadow:0 2px 6px #09265d12; }
.tone-yellow { background:linear-gradient(120deg,#fffaf0,#fff); }.tone-blue { background:linear-gradient(120deg,#eff8ff,#fff); }.tone-purple { background:linear-gradient(120deg,#f8f2ff,#fff); }.tone-green { background:linear-gradient(120deg,#f1fff1,#fff); }
.catalog-card-icon { grid-column:1; grid-row:1/3; display:grid; place-items:center; width:110px; height:110px; }
.catalog-card-icon img { display:block; width:100%; height:100%; object-fit:contain; }
.catalog-card-copy { grid-column:2; grid-row:1/3; align-self:center; }.catalog-card h2 { margin:0 0 6px; font-size:clamp(19px,2vw,25px); line-height:1.2; }.catalog-card-copy p { font-size:15px; line-height:1.4; }
.catalog-level { grid-column:3; grid-row:1; justify-self:end; align-self:start; display:flex; align-items:center; gap:7px; padding:6px 13px; border-radius:18px; background:#e6f1ff; font-size:13px; font-weight:800; white-space:nowrap; }
.catalog-level img { width:19px; height:17px; object-fit:contain; }
.catalog-card-meta { grid-column:1/3; grid-row:3; display:flex; flex-wrap:wrap; gap:14px; font-size:12px; font-weight:700; }
.catalog-card-meta span { display:inline-flex; align-items:center; gap:4px; }
.catalog-card-meta img { width:17px; height:17px; object-fit:contain; }
.catalog-class-cta { grid-column:3; grid-row:2/4; align-self:end; display:flex; align-items:center; gap:7px; padding:10px 15px; border-radius:24px; background:#ffcb00; color:#09265d; font-weight:800; text-decoration:none; white-space:nowrap; }
.catalog-class-cta .nk-icon { width:19px; height:19px; }
.catalog-pagination { display:flex; justify-content:center; gap:10px; margin:32px 0; }
.catalog-pagination a { display:grid; place-items:center; width:40px; height:40px; border:1px solid #d8e0ed; border-radius:50%; color:#09265d; font-weight:800; text-decoration:none; }
.catalog-pagination a.current { color:white; background:#0d367e; border-color:#0d367e; }
.catalog-empty { padding:40px; text-align:center; }
.catalog-benefits { max-width:1320px; display:grid; grid-template-columns:1.5fr repeat(4,1fr); align-items:center; gap:16px; margin:0 auto 24px; padding:20px 34px; border-radius:22px; background:#eff7ff; text-align:center; }
.catalog-benefits>div:first-child { text-align:left; }.catalog-benefits>div:first-child span { padding:5px 12px; border-radius:16px; background:#ffce00; font-size:13px; font-weight:800; }.catalog-benefits h2 { margin-top:8px; font-size:25px; line-height:1.15; }
.catalog-benefit { display:grid; justify-items:center; gap:6px; padding:6px; border-left:1px solid #d9e8f7; }.catalog-benefit img { width:50px; height:42px; object-fit:contain; }.catalog-benefit b { font-size:14px; }
.catalog-footer { display:flex; align-items:center; gap:30px; padding:18px max(6%,calc((100% - 1260px)/2)); color:#fff; background:#082c68; }.catalog-footer p { flex:1; font-size:13px; }.catalog-footer small { font-weight:700; }
.catalog-content { padding-top:30px; }
.catalog-filters { display:grid; grid-template-columns:minmax(190px,1.5fr) repeat(4,minmax(135px,1fr)); align-items:center; gap:12px; }
.catalog-filters label { min-width:0; }
.catalog-filters select { appearance:none; padding-right:32px; background-image:linear-gradient(45deg,transparent 50%,#173668 50%),linear-gradient(135deg,#173668 50%,transparent 50%); background-position:calc(100% - 16px) 19px,calc(100% - 12px) 19px; background-size:4px 4px,4px 4px; background-repeat:no-repeat; }
.catalog-filter-submit { height:42px; padding:0 15px; }
.catalog-card-icon { border:2px solid #fff; box-shadow:0 1px 5px #0c34701a; background:#ffffff70; }
.catalog-level { background:color-mix(in srgb,var(--catalog-tone,#cfe8ff) 55%,white); }
.tone-yellow { --catalog-tone:#ffd95e; }.tone-blue { --catalog-tone:#82c4ff; }.tone-purple { --catalog-tone:#c8a5ff; }.tone-green { --catalog-tone:#9be88e; }
.catalog-pagination a[aria-current="page"] { color:white; background:#0d367e; border-color:#0d367e; }
@media (width <= 760px) {
  .catalog-header { gap:12px; padding:8px 16px; }.catalog-header nav { display:none; }.catalog-login { margin-left:auto; }.catalog-login,.catalog-signup { padding:8px 13px; font-size:13px; }
  .catalog-hero { min-height:250px; padding:26px 20px; }.catalog-hero h1 { font-size:38px; letter-spacing:-1.5px; }.catalog-hero p { max-width:60%; font-size:15px; }.catalog-hero img { position:absolute; right:-8px; bottom:0; width:46%; max-height:165px; }
  .catalog-content { padding:22px 16px; }.catalog-filters { display:grid; grid-template-columns:1fr 1fr; }.catalog-search { grid-column:1/-1; }.catalog-filters label { min-width:0; }.catalog-filter-submit { grid-column:1/-1; }
  .catalog-grid { grid-template-columns:1fr; gap:12px; }.catalog-card { min-height:188px; grid-template-columns:65px minmax(0,1fr) auto; gap:8px; padding:14px 12px; border-radius:18px; }.catalog-card-icon { width:58px; height:70px; font-size:39px; }.catalog-card h2 { font-size:17px; }.catalog-card-copy p { font-size:12px; }.catalog-level { font-size:11px; }.catalog-card-meta { gap:8px; font-size:10px; }.catalog-class-cta { gap:3px; padding:8px 10px; font-size:12px; }
  .catalog-pagination { gap:6px; }.catalog-pagination a { width:34px; height:34px; }.catalog-benefits { grid-template-columns:repeat(2,1fr); margin:0 16px 20px; padding:18px; }.catalog-benefits>div:first-child { grid-column:1/-1; }.catalog-benefit { border:0; }.catalog-footer { flex-wrap:wrap; gap:12px; padding:18px; }.catalog-footer p { font-size:11px; }.catalog-footer small { width:100%; }
}

/* FAQ landing page */
.faq-item .faq-chevron { transition:transform .15s ease; }
.faq-item[open] .faq-chevron { transform:rotate(180deg); }
.faq-item p { white-space:pre-line; }
.faq-page { color:#09265d; background:#fff; }
.faq-hero { min-height:300px; position:relative; display:flex; align-items:center; overflow:hidden; padding:30px max(5%,calc((100% - 1320px)/2)); background:linear-gradient(110deg,#f4f9ff,#e7f2ff); }
.faq-hero-copy { position:relative; z-index:2; }.faq-badge { display:inline-flex; align-items:center; gap:8px; padding:8px 16px; border:1px solid #d6e4f6; border-radius:24px; background:#ffffffdf; box-shadow:0 3px 12px #12397012; font-weight:800; }.faq-badge .nk-icon { width:25px; height:25px; color:#ffc400; }
.faq-hero h1 { margin:12px 0; color:#09265d; font-size:clamp(38px,4.5vw,54px); line-height:1.1; }.faq-hero h1 mark { color:#09265d; background:#ffcd00; border-radius:30px; padding:0 13px; }.faq-hero p { font-size:17px; line-height:1.5; }
.faq-hero-art { position:absolute; right:3%; bottom:0; width:54%; height:100%; object-fit:contain; object-position:right bottom; }
.faq-workspace { max-width:1320px; margin:-6px auto 0; padding:30px 16px 45px; display:grid; grid-template-columns:310px minmax(0,1fr); gap:30px; position:relative; z-index:3; border-radius:34px 34px 0 0; background:#fff; }
.faq-sidebar { display:grid; align-content:start; gap:24px; }.faq-categories { overflow:hidden; border:1px solid #dbe6f6; border-radius:18px; }.faq-categories h2 { display:flex; align-items:center; gap:12px; margin:0; padding:15px 20px; color:#fff; background:#10468f; font-size:19px; }.faq-categories h2 .nk-icon { width:25px; height:25px; color:white; }.faq-categories nav { padding:8px; }.faq-categories button { width:100%; display:flex; align-items:center; gap:13px; padding:10px 13px; border:0; border-bottom:1px solid #e7edf6; background:white; color:#10295c; text-align:left; font:inherit; font-weight:700; cursor:pointer; }.faq-categories button:last-child { border-bottom:0; }.faq-categories button.selected { border-radius:13px; background:#ffe27a; }.faq-categories button img,.faq-categories button .nk-icon { width:27px; height:27px; object-fit:contain; flex:none; color:#0c3476; }
.faq-support { display:grid; grid-template-columns:72px 1fr; align-items:center; gap:12px; padding:18px; border:1px solid #e1eafa; border-radius:20px; background:#fbfdff; }.faq-support-icon { width:70px; height:70px; display:grid; place-items:center; border-radius:50%; color:#063a91; background:#ffdf56; }.faq-support-icon { font-size:40px; }.faq-support-icon svg { width:46px; height:46px; }.faq-support h2 { margin:0; font-size:21px; line-height:1.1; }.faq-support p { margin-top:6px; font-size:14px; line-height:1.4; }.faq-support>a,.faq-contact>a { grid-column:1/-1; display:flex; align-items:center; justify-content:center; gap:9px; padding:10px 15px; border-radius:24px; background:#13a947; color:white; font-weight:800; text-decoration:none; }.faq-support>a img,.faq-contact>a img,.faq-support>a .nk-icon,.faq-contact>a .nk-icon { width:24px; height:24px; object-fit:contain; flex:none; }
.faq-results { min-width:0; }.faq-search { height:48px; display:flex; align-items:center; gap:14px; padding:0 17px; border:1px solid #d7e2f2; border-radius:26px; box-shadow:0 2px 8px #0a326110; }.faq-search img,.faq-search .nk-icon { width:23px; height:25px; object-fit:contain; flex:none; }.faq-search input { flex:1; min-width:0; border:0; outline:0; background:transparent; color:#10295c; font:inherit; }
.faq-questions { display:grid; gap:9px; margin-top:22px; }.faq-item { overflow:hidden; border:1px solid #cfdaea; border-radius:17px; background:white; }.faq-item[open] { background:#f3f8ff; box-shadow:0 1px 5px #12397012; }.faq-item summary { display:grid; grid-template-columns:34px 1fr 22px; align-items:center; gap:12px; padding:12px 18px; list-style:none; cursor:pointer; font-size:17px; font-weight:800; }.faq-item summary::-webkit-details-marker { display:none; }.faq-item summary>.nk-icon:first-child { width:28px; height:28px; color:#1550ac; }.faq-item summary .faq-chevron { width:20px; height:20px; color:#09265d; }.faq-item p { padding:0 20px 16px 60px; font-size:15px; line-height:1.5; }.faq-no-results { padding:26px; text-align:center; color:#637897; }
.faq-contact { max-width:1320px; min-height:128px; display:grid; grid-template-columns:165px 1fr 1fr auto; gap:20px; align-items:center; margin:0 auto 28px; padding:18px 32px; border-radius:26px; background:#eef7ff; }.faq-contact>img { width:155px; height:100px; object-fit:contain; }.faq-contact h2 { font-size:27px; line-height:1.1; }.faq-contact p { border-left:1px solid #b8cbe2; padding-left:22px; line-height:1.5; }.faq-contact>a { grid-column:auto; padding:12px 20px; }
@media (width <= 760px) {
  .faq-hero { min-height:290px; padding:24px 20px; align-items:flex-start; }.faq-hero h1 { font-size:36px; }.faq-hero p { max-width:65%; font-size:14px; }.faq-hero-art { right:0; width:57%; height:69%; object-fit:contain; object-position:right bottom; }
  .faq-workspace { grid-template-columns:1fr; gap:16px; padding:22px 16px 30px; }.faq-categories nav { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }.faq-categories button { min-width:0; font-size:13px; gap:8px; padding:9px 7px; }.faq-categories button span { min-width:0; overflow-wrap:anywhere; line-height:1.2; }.faq-support { display:none; }.faq-search { height:auto; min-height:48px; }.faq-search input { font-size:13px; }.faq-item summary { grid-template-columns:29px 1fr 18px; gap:8px; padding:12px; font-size:14px; }.faq-item p { padding:0 14px 14px 48px; font-size:13px; }.faq-contact { grid-template-columns:72px 1fr; gap:10px; margin:0 16px 22px; padding:16px; }.faq-contact>img { width:70px; height:75px; }.faq-contact h2 { font-size:20px; }.faq-contact p { grid-column:1/-1; border:0; padding:0; }.faq-contact>a { grid-column:1/-1; }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *, :before, :after {
    transition: none !important;
    animation: none !important;
  }
}

/* Contact page */
.contact-page { overflow-x:hidden; color:#0a2c67; background:#f8fbff; }
.contact-hero { overflow:hidden; background:linear-gradient(110deg,#f7fbff 0%,#e7f3ff 100%); }
.contact-hero-inner { max-width:1190px; min-height:430px; display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:24px; margin:auto; padding:34px 0 0; }
.contact-hero-copy { position:relative; z-index:1; padding-bottom:40px; }
.contact-eyebrow { display:inline-flex; align-items:center; gap:9px; padding:9px 16px; border:1px solid #dce8f8; border-radius:26px; background:#fff; box-shadow:0 4px 14px #12397010; font-size:14px; font-weight:800; }
.contact-online-dot,.contact-free-pill i { width:10px; height:10px; display:inline-block; border-radius:50%; background:#12bb58; box-shadow:0 0 0 4px #e9fff0; }
.contact-hero h1 { margin:18px 0 14px; color:#09265d; font-size:clamp(48px,5vw,60px); line-height:1.05; letter-spacing:-2.5px; }
.contact-hero h1 mark { display:inline-block; padding:2px 11px 5px; border-radius:13px; color:#09265d; background:#ffca00; }
.contact-hero-copy>p { max-width:570px; margin:0; color:#345781; font-size:17px; line-height:1.55; }
.contact-hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:22px; }
.contact-button { min-height:45px; display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:0 21px; border:1px solid #1751ae; border-radius:26px; color:#09265d; background:white; text-decoration:none; font-weight:800; }
.contact-button .nk-icon { width:18px; height:18px; }
.contact-button-primary { border-color:#ffca00; background:#ffca00; }
.contact-hero-visual { min-width:0; height:430px; position:relative; align-self:end; display:flex; align-items:flex-end; justify-content:center; }
.contact-hero-blob { position:absolute; right:0; bottom:0; width:91%; height:78%; border-radius:46% 35% 15% 13% / 35% 46% 12% 13%; background:linear-gradient(145deg,#c9e5ff,#71aff0); transform:rotate(-4deg); }
.contact-hero-visual>img { width:min(100%,510px); height:100%; position:relative; z-index:1; object-fit:contain; object-position:center bottom; }
.contact-rays { position:absolute; z-index:2; top:50px; left:12%; color:#ffc400; font-size:70px; font-weight:900; transform:rotate(-35deg); }
.contact-free-pill { position:absolute; z-index:3; top:125px; right:-8px; display:flex; align-items:center; gap:9px; padding:11px 15px; border-radius:30px; background:#fff; box-shadow:0 7px 18px #143c7214; font-size:12px; font-weight:800; transform:rotate(7deg); }
.contact-free-pill i { width:9px; height:9px; }
.contact-main { padding-top:46px; padding-bottom:44px; }
.contact-intro>span { color:#1764c5; font-size:12px; font-weight:900; letter-spacing:1px; }
.contact-intro h2 { margin:8px 0 4px; font-size:29px; letter-spacing:-.7px; }
.contact-intro p { margin:0; color:#7187a9; font-size:15px; }
.contact-layout { display:grid; grid-template-columns:.86fr 1.14fr; align-items:start; gap:28px; margin-top:20px; }
.contact-methods { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.contact-method { min-height:194px; display:flex; flex-direction:column; align-items:flex-start; padding:19px 20px; border:1px solid #e0eafa; border-radius:22px; color:#09265d; text-decoration:none; box-shadow:0 12px 30px #13396a0b; transition:transform .18s ease,box-shadow .18s ease; }
.contact-method:hover { transform:translateY(-2px); box-shadow:0 16px 30px #13396a14; }
.contact-method-whatsapp { background:linear-gradient(135deg,#f0fff5,#e8faf0); }.contact-method-phone { background:linear-gradient(135deg,#fffdf2,#fff7df); }.contact-method-location { background:linear-gradient(135deg,#fff,#fff3f6); }.contact-method-help { background:linear-gradient(135deg,#f4f9ff,#eaf4ff); }
.contact-method-icon { width:44px; height:44px; display:grid; place-items:center; margin-bottom:8px; border-radius:50%; background:#ffffffaa; }.contact-method-icon .nk-icon { width:32px; height:32px; color:#0a347c; }.contact-method-whatsapp .contact-method-icon { background:#12b958; }.contact-method-whatsapp .contact-method-icon .nk-icon { color:#fff; }
.contact-method strong { margin-top:2px; font-size:16px; }.contact-method small { min-height:39px; margin-top:6px; color:#61799d; font-size:12px; line-height:1.4; }.contact-method b { margin-top:7px; color:#0871d8; font-size:12px; }
.contact-recommend { grid-column:1/-1; min-height:96px; display:flex; align-items:center; gap:14px; padding:15px 18px; border:1px solid #d8e9ff; border-radius:20px; background:#edf5ff; }.contact-recommend>span { width:44px; height:44px; display:grid; place-items:center; flex:none; border-radius:50%; color:#0b367c; background:#ffdb41; }.contact-recommend svg { width:34px; height:34px; }.contact-recommend strong { font-size:14px; }.contact-recommend p { margin:5px 0 0; color:#637da3; font-size:12px; line-height:1.45; }
.contact-map-card { min-width:0; overflow:hidden; padding:21px; border:1px solid #d9e6f7; border-radius:27px; background:#fff; box-shadow:0 18px 55px #153e7810; scroll-margin-top:24px; }
.contact-map-heading { display:flex; align-items:center; gap:13px; margin-bottom:16px; }.contact-map-heading>span { width:49px; height:49px; display:grid; place-items:center; flex:none; border-radius:15px; background:#fff1f3; }.contact-map-heading .nk-icon { width:30px; height:30px; }.contact-map-heading h2 { margin:0; font-size:21px; letter-spacing:-.4px; }.contact-map-heading p { margin:4px 0 0; color:#7287a5; font-size:13px; }
.contact-map-card iframe { width:100%; height:350px; display:block; border:0; border-radius:17px; background:#e8f2fd; }.contact-map-link { display:flex; align-items:center; justify-content:center; gap:8px; margin-top:14px; padding:12px 16px; border-radius:24px; color:#0c56b0; background:#eef6ff; font-size:13px; font-weight:800; }.contact-map-link .nk-icon { width:18px; height:18px; }
.contact-fast { min-height:112px; display:flex; align-items:center; gap:18px; margin-top:30px; padding:18px 28px; border:1px solid #dceafa; border-radius:25px; background:linear-gradient(105deg,#e7f3ff,#effbf1); }.contact-fast>.nk-icon { width:57px; height:57px; flex:none; padding:7px; border-radius:50%; color:#fff; background:#12b958; }.contact-fast>div { flex:1; }.contact-fast h2 { margin:0; font-size:21px; }.contact-fast p { margin:6px 0 0; color:#5e789d; font-size:14px; }.contact-fast>a { display:inline-flex; align-items:center; justify-content:center; gap:9px; padding:13px 23px; border-radius:28px; color:#fff; background:#12ac4e; text-decoration:none; font-size:14px; font-weight:800; }.contact-fast>a .nk-icon { width:18px; height:18px; }
.contact-last { display:flex; justify-content:space-between; align-items:center; padding:35px 0 22px; }.contact-last h2 { margin:0; font-size:22px; }.contact-last p { margin:8px 0 0; color:#7187a9; font-size:14px; }.contact-last>a { display:flex; align-items:center; gap:6px; color:#0969ca; font-size:13px; font-weight:800; }.contact-last>a .nk-icon { width:18px; height:18px; }
@media (max-width:760px) {
  .contact-hero-inner { width:auto; min-height:0; display:block; position:relative; padding:26px 20px 0; }.contact-hero-copy { width:auto; max-width:100%; min-width:0; padding-bottom:0; }.contact-hero h1 { width:auto; max-width:100%; font-size:clamp(36px,9vw,42px); letter-spacing:-1.8px; overflow-wrap:anywhere; }.contact-hero h1 mark { display:table; max-width:100%; margin-top:2px; padding:0 5px 3px; border-radius:9px; }.contact-hero-copy>p { display:block; width:auto; max-width:100%; font-size:14px; overflow-wrap:anywhere; white-space:normal; }.contact-hero-actions { gap:8px; margin-top:16px; }.contact-button { min-height:42px; padding:0 14px; font-size:13px; }.contact-hero-visual { width:min(88%,340px); height:240px; position:relative; right:auto; bottom:auto; margin:15px auto 0; }.contact-hero-visual>img { width:100%; }.contact-hero-blob { width:100%; height:65%; }.contact-rays { top:20px; left:0; font-size:50px; }.contact-free-pill { top:50px; right:-8px; padding:8px 10px; font-size:10px; }
  .contact-main { width:auto; margin-inline:18px; padding:30px 0 28px; }.contact-intro { max-width:100%; }.contact-intro h2 { max-width:100%; font-size:22px; overflow-wrap:anywhere; white-space:normal; }.contact-intro p { max-width:100%; font-size:13px; overflow-wrap:anywhere; white-space:normal; }.contact-layout,.contact-methods,.contact-map-card { min-width:0; max-width:100%; }.contact-layout { grid-template-columns:1fr; gap:18px; margin-top:16px; }.contact-methods { gap:10px; }.contact-method { min-width:0; min-height:178px; padding:14px; border-radius:18px; }.contact-method small { min-height:35px; font-size:11px; }.contact-recommend { min-height:88px; gap:10px; padding:12px; }.contact-recommend strong { font-size:12px; }.contact-recommend p { font-size:11px; }.contact-map-card { padding:16px; border-radius:22px; }.contact-map-heading h2 { font-size:18px; }.contact-map-heading p { font-size:11px; }.contact-map-card iframe { height:280px; border-radius:15px; }.contact-fast { min-width:0; gap:12px; margin-top:22px; padding:16px; border-radius:20px; }.contact-fast>.nk-icon { width:46px; height:46px; }.contact-fast h2 { font-size:16px; }.contact-fast p { font-size:12px; line-height:1.4; }.contact-fast>a { padding:11px 14px; font-size:12px; }.contact-last { gap:15px; padding:28px 0 8px; }.contact-last h2 { font-size:18px; }.contact-last p { font-size:12px; }.contact-last>a { flex:none; font-size:12px; }
}

/* Article index */
.articles-page { color:#0a2c67; background:#fff; }
.articles-heading { padding-top:26px; padding-bottom:18px; }
.articles-badge { display:inline-flex; align-items:center; gap:8px; padding:5px 13px; border-radius:22px; color:#102d65; background:#fff2bf; font-size:14px; font-weight:800; }.articles-badge .nk-icon { width:24px; height:24px; padding:3px; border-radius:50%; color:#fff; background:#ffc800; }
.articles-heading h1 { margin:10px 0 5px; color:#09265d; font-size:38px; letter-spacing:-1.7px; }.articles-heading h1 mark { padding:0 10px 3px; border-radius:24px; color:#09265d; background:#ffce00; }.articles-heading p { color:#18315b; font-size:15px; line-height:1.5; }
.articles-content { padding-top:0; padding-bottom:22px; }
.articles-filters { display:grid; grid-template-columns:1.5fr .9fr; gap:18px; margin-bottom:25px; }
.articles-category .sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.articles-search,.articles-category { height:44px; display:flex; align-items:center; gap:12px; padding:0 15px; border:1px solid #d5e0ef; border-radius:25px; background:#fff; box-shadow:0 3px 10px #1239700b; }.articles-search .nk-icon { width:24px; height:24px; flex:none; }.articles-search input { width:100%; min-width:0; border:0; outline:0; color:#10295c; background:transparent; font:inherit; font-size:14px; }.articles-search input::placeholder { color:#7a8eac; }
.articles-category { position:relative; }.articles-category select { width:100%; height:100%; appearance:none; border:0; outline:0; color:#10295c; background:transparent; font:inherit; font-size:14px; font-weight:700; }.articles-category>span:not(.sr-only) { position:absolute; right:16px; top:6px; pointer-events:none; font-size:23px; line-height:1; }
.articles-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px 22px; }.article-card { overflow:hidden; border:1px solid #e0e8f2; border-radius:17px; background:#fff; box-shadow:0 5px 14px #1239700c; }.article-card[hidden] { display:none; }.article-card-image { height:108px; display:flex; align-items:center; justify-content:center; overflow:hidden; background:#edf5ff; }.article-card-image img { width:100%; height:100%; object-fit:cover; }.article-card-image-icon img { width:85px; height:85px; object-fit:contain; }.article-image-tka { background:linear-gradient(125deg,#eaf6ff,#dceeff); }.article-image-calistung { background:linear-gradient(125deg,#fff8e5,#fff0c7); }.article-image-english { background:linear-gradient(125deg,#eaf6ff,#d5eaff); }.article-image-science { background:linear-gradient(125deg,#effaff,#d9f4ff); }
.article-card-body { min-height:150px; display:flex; flex-direction:column; align-items:flex-start; padding:10px 15px 12px; }.article-tag { display:inline-flex; align-items:center; padding:3px 10px; border-radius:16px; color:#0d2b64; background:#d9ebff; font-size:11px; font-weight:700; line-height:1.25; }.tag-tka { background:#ffec91; }.tag-calistung { background:#eadcff; }.tag-programming { background:#baf2d6; }.tag-english { background:#d4edff; }.tag-science { background:#e9d8ff; }
.article-card h2 { margin:6px 0 3px; color:#0a285f; font-size:16px; letter-spacing:-.3px; line-height:1.2; }.article-card-body>p { margin:0; color:#20365b; font-size:13px; line-height:1.35; }.article-meta { width:100%; display:flex; align-items:center; gap:11px; margin-top:auto; padding-top:8px; color:#1b3158; font-size:11px; }.article-meta>span { display:inline-flex; align-items:center; gap:5px; white-space:nowrap; }.article-meta .nk-icon { width:16px; height:16px; }.article-meta>i { width:1px; height:15px; background:#cdd8e8; }
.article-card h2 a { color:inherit; text-decoration:none; }.article-card h2 a:hover { color:#0b64bd; }
.articles-empty { grid-column:1/-1; padding:32px; border:1px dashed #cad8ea; border-radius:18px; color:#6c809e; text-align:center; }.articles-pagination { display:flex; align-items:center; justify-content:center; gap:10px; margin:22px 0 4px; }.articles-pagination[hidden] { display:none; }.articles-pagination button,.articles-pagination>a { width:37px; height:37px; display:grid; place-items:center; border:1px solid #d6e0ef; border-radius:50%; color:#10295c; background:#fff; box-shadow:0 2px 6px #0a32610c; font-size:14px; font-weight:800; }.articles-pagination button[aria-current="page"],.articles-pagination>a[aria-current="page"] { border-color:#0d3c8e; color:#fff; background:#0d3c8e; }.articles-pagination button:disabled { color:#9aaac1; cursor:default; }
.articles-newsletter { min-height:80px; display:grid; grid-template-columns:52px 1fr minmax(380px,.9fr); align-items:center; gap:16px; margin-top:4px; margin-bottom:18px; padding:14px 24px; border-radius:22px; background:linear-gradient(105deg,#fff8dc,#fff2c4); }.articles-newsletter-icon { width:48px; height:48px; display:grid; place-items:center; border-radius:50%; color:#fff; background:#ffc600; box-shadow:0 3px 8px #cc9d0030; }.articles-newsletter-icon .nk-icon { width:27px; height:27px; }.articles-newsletter h2 { color:#102d65; font-size:20px; letter-spacing:-.5px; }.articles-newsletter p { margin-top:2px; color:#283c5e; font-size:13px; }.articles-newsletter form { display:grid; grid-template-columns:1fr auto; gap:10px; }.articles-newsletter form label { min-width:0; height:39px; display:flex; align-items:center; gap:8px; padding:0 12px; border:1px solid #d4dfed; border-radius:23px; background:#fff; }.articles-newsletter form label .nk-icon { width:19px; height:19px; flex:none; }.articles-newsletter input { width:100%; min-width:0; border:0; outline:0; color:#10295c; background:transparent; font:inherit; font-size:12px; }.articles-newsletter form button { display:flex; align-items:center; gap:7px; padding:0 17px; border:0; border-radius:24px; color:#09265d; background:#ffca00; font:inherit; font-size:12px; font-weight:800; cursor:pointer; white-space:nowrap; }.articles-newsletter form button .nk-icon { width:17px; height:17px; }
@media (max-width:760px) {
  .articles-heading { padding-top:24px; padding-bottom:16px; }.articles-heading h1 { font-size:30px; letter-spacing:-1.2px; }.articles-heading h1 mark { padding:0 7px 2px; }.articles-heading p { font-size:13px; }.articles-desktop-break { display:none; }.articles-filters { grid-template-columns:1fr; gap:10px; margin-bottom:16px; }.articles-search,.articles-category { height:44px; }.articles-search input { font-size:12px; }.articles-grid { grid-template-columns:1fr; gap:14px; }.article-card { display:grid; grid-template-columns:112px minmax(0,1fr); min-height:160px; border-radius:16px; }.article-card-image { height:100%; min-height:160px; }.article-card-image img { object-fit:cover; }.article-card-image-icon img { width:75px; height:75px; object-fit:contain; }.article-card-body { min-height:160px; padding:10px 11px; }.article-card h2 { font-size:14px; }.article-card-body>p { font-size:11px; }.article-meta { gap:6px; font-size:9px; }.article-meta>span { gap:3px; }.article-meta .nk-icon { width:14px; height:14px; }.articles-pagination { gap:7px; margin:17px 0; }.articles-pagination button,.articles-pagination>a { width:33px; height:33px; }.articles-newsletter { grid-template-columns:44px 1fr; gap:10px; margin:0 0 16px; padding:16px; border-radius:18px; }.articles-newsletter-icon { width:42px; height:42px; }.articles-newsletter h2 { font-size:17px; }.articles-newsletter p { font-size:11px; line-height:1.4; }.articles-newsletter form { grid-column:1/-1; grid-template-columns:1fr; }.articles-newsletter form label { height:42px; }.articles-newsletter form button { min-height:42px; justify-content:center; }.articles-content,.articles-newsletter { width:auto; margin-inline:18px; }
}

/* Article detail */
.article-share-links .share-copy { position:relative; overflow:hidden; border-radius:10px; background:transparent; }
.article-share-links .share-copy img { position:absolute; top:50%; left:50%; width:90px; max-width:none; height:60px; transform:translate(-50%,-50%); object-fit:contain; }
.article-detail-page { color:#0a2c67; background:#fff; }
.article-detail { padding-top:20px; padding-bottom:52px; }
.article-breadcrumb { display:flex; align-items:center; gap:11px; margin-bottom:35px; color:#31476a; font-size:13px; }.article-breadcrumb a { display:inline-flex; align-items:center; gap:6px; }.article-breadcrumb a:first-child .nk-icon { width:19px; height:19px; color:#09265d; }.article-breadcrumb>span:nth-child(even) { color:#9aabc2; font-size:21px; }
.article-detail-hero { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:45px; padding-bottom:30px; border-bottom:1px solid #dce4ef; }.article-detail-copy h1 { margin:12px 0 11px; color:#09265d; font-size:clamp(38px,4vw,46px); line-height:1.1; letter-spacing:-1.5px; }.article-detail-copy>p { max-width:560px; color:#365780; font-size:17px; line-height:1.5; }.article-detail-meta { display:flex; flex-wrap:wrap; align-items:center; gap:22px; margin-top:19px; color:#263d65; font-size:13px; }.article-detail-meta span { display:inline-flex; align-items:center; gap:7px; }.article-detail-meta .nk-icon { width:20px; height:20px; }.article-detail-visual { height:300px; display:flex; align-items:center; justify-content:center; overflow:hidden; border-radius:23px; background:#edf5ff; }.article-detail-visual img { width:100%; height:100%; object-fit:cover; }.article-detail-visual-icon img { width:160px; height:160px; object-fit:contain; }
.article-body { padding-top:24px; }.article-body-intro { margin-bottom:22px; color:#1b3159; font-size:18px; line-height:1.55; }.article-tips { display:grid; gap:17px; margin:0; padding:0; list-style:none; }.article-tips li { display:grid; grid-template-columns:55px 1fr; align-items:center; gap:17px; }.article-tips li>span { width:46px; height:46px; display:grid; place-items:center; border-radius:50%; color:#0a2c67; background:#fff0b5; font-size:23px; font-weight:800; }.article-tips h2 { margin:0 0 3px; color:#0a2c67; font-size:22px; letter-spacing:-.4px; }.article-tips p { color:#20385f; font-size:16px; line-height:1.5; }
.article-extra-tip { display:grid; grid-template-columns:90px 1fr; align-items:center; gap:20px; margin-top:27px; padding:18px 24px; border-radius:20px; background:#fff7dc; }.article-extra-tip>.nk-icon { width:54px; height:54px; justify-self:center; color:#f0b900; }.article-extra-tip>div { border-left:1px solid #e6c74e; padding-left:23px; }.article-extra-tip h2 { margin:0 0 3px; color:#0a2c67; font-size:22px; }.article-extra-tip p { color:#20385f; font-size:16px; line-height:1.5; }
.article-share-row { display:flex; align-items:center; gap:24px; padding:23px 0 22px; border-bottom:1px solid #dce4ef; }.article-share-row>strong { color:#102d65; font-size:15px; }.article-share-links { display:flex; align-items:center; gap:12px; }.article-share-links>a,.article-share-links>button { width:42px; height:42px; display:grid; place-items:center; border:0; border-radius:50%; color:#fff; cursor:pointer; }.article-share-links .nk-icon { width:22px; height:22px; }.share-whatsapp { background:#11b95a; }.share-telegram { background:#22a8e8; }.share-facebook { background:#2165dc; }.share-copy { color:#0c367e!important; background:#deebff; }.share-copy.copied { background:#bbf4d2; }.article-prev-next { display:flex; align-items:center; gap:22px; margin-left:auto; color:#075bbd; font-size:14px; font-weight:800; }.article-prev-next a { display:flex; align-items:center; gap:8px; }.article-prev-next i { width:1px; height:24px; background:#cfd9e8; }
.article-related { padding-top:23px; }.article-related>h2 { margin-bottom:15px; color:#0a2c67; font-size:28px; }.article-related-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }.article-related-card { overflow:hidden; border:1px solid #e0e8f2; border-radius:17px; background:#fff; box-shadow:0 5px 14px #1239700c; text-decoration:none; }.article-related-image { height:100px; display:flex; align-items:center; justify-content:center; overflow:hidden; }.article-related-image img { width:100%; height:100%; object-fit:cover; }.article-related-image.article-card-image-icon img { width:75px; height:75px; object-fit:contain; }.article-related-copy { padding:10px 14px 13px; }.article-related-copy h3 { margin:7px 0 10px; color:#0a285f; font-size:16px; line-height:1.25; }.article-related-copy>.article-meta { display:inline-flex; width:auto; margin:0; padding:0; }
@media (max-width:760px) {
  .article-detail { width:auto; margin-inline:18px; padding-top:16px; padding-bottom:32px; }.article-breadcrumb { gap:8px; margin-bottom:20px; font-size:11px; }.article-detail-hero { grid-template-columns:1fr; gap:18px; padding-bottom:20px; }.article-detail-copy h1 { margin:10px 0 8px; font-size:34px; line-height:1.08; letter-spacing:-1.1px; }.article-detail-copy>p { font-size:14px; }.article-detail-meta { gap:12px; margin-top:13px; font-size:11px; }.article-detail-meta .nk-icon { width:17px; height:17px; }.article-detail-visual { height:220px; border-radius:18px; }.article-detail-visual-icon img { width:120px; height:120px; }.article-body { padding-top:18px; }.article-body-intro { margin-bottom:18px; font-size:15px; }.article-tips { gap:15px; }.article-tips li { grid-template-columns:41px 1fr; gap:11px; align-items:start; }.article-tips li>span { width:38px; height:38px; font-size:18px; }.article-tips h2 { font-size:17px; }.article-tips p { font-size:13px; }.article-extra-tip { grid-template-columns:54px 1fr; gap:11px; margin-top:20px; padding:14px; border-radius:16px; }.article-extra-tip>.nk-icon { width:39px; height:39px; }.article-extra-tip>div { padding-left:12px; }.article-extra-tip h2 { font-size:17px; }.article-extra-tip p { font-size:13px; }.article-share-row { flex-wrap:wrap; gap:12px; padding:18px 0; }.article-share-row>strong { width:100%; font-size:14px; }.article-share-links { gap:8px; }.article-share-links>a,.article-share-links>button { width:36px; height:36px; }.article-prev-next { width:100%; justify-content:space-between; gap:9px; margin:5px 0 0; font-size:11px; }.article-prev-next i { height:20px; }.article-related { padding-top:20px; }.article-related>h2 { font-size:23px; }.article-related-grid { grid-template-columns:1fr; gap:12px; }.article-related-card { display:grid; grid-template-columns:110px 1fr; }.article-related-image { height:100%; min-height:132px; }.article-related-copy { padding:10px; }.article-related-copy h3 { font-size:13px; }.article-related-copy .article-tag { font-size:10px; }
}


/* Class detail */
.class-detail-page { background:linear-gradient(135deg,#fff 60%,#f6faff); color:#09265d; }
.class-detail { width:calc(100% - 96px); max-width:1200px; margin:auto; padding:24px 0 48px; }
.class-breadcrumb { display:flex; align-items:center; flex-wrap:wrap; gap:12px; font-size:14px; margin-bottom:26px; }
.class-breadcrumb a { display:inline-flex; align-items:center; gap:9px; }.class-breadcrumb .nk-icon { width:20px; height:20px; }.class-breadcrumb>span:not([aria-current]) { color:#9aabc4; }.class-breadcrumb [aria-current] { font-weight:800; }
.class-detail-hero { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:30px; align-items:center; }
.class-detail-badge { display:inline-block; padding:5px 16px; border-radius:24px; background:#d9eaff; font-size:14px; font-weight:800; }
.class-detail-intro h1 { margin:12px 0 6px; font-size:clamp(38px,5vw,55px); letter-spacing:-1.7px; line-height:1.1; }.class-detail-intro h2 { font-size:25px; line-height:1.3; letter-spacing:-.5px; }.class-detail-intro>p { margin-top:14px; font-size:17px; line-height:1.5; }.class-detail-hero-image { width:100%; height:365px; object-fit:contain; }
.class-detail-facts { display:flex; margin:26px 0 0; padding-bottom:28px; border-bottom:1px solid #e0e8f3; }.class-detail-facts>div { display:flex; align-items:center; gap:12px; flex:1; min-width:0; font-size:14px; }.class-detail-facts>div+div { border-left:1px solid #ccd9ec; padding-left:28px; }.class-detail-facts .nk-icon { width:32px; height:32px; }.class-detail-facts strong { display:block; font-size:14px; }
.class-detail-layout { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(0,1fr); gap:28px; margin-top:26px; align-items:start; }.class-detail-content { min-width:0; }.class-detail-content h2 { font-size:25px; letter-spacing:-.7px; }.class-about>p { margin-top:10px; font-size:17px; line-height:1.55; }
.class-benefits { display:grid; grid-template-columns:48px minmax(0,1fr); align-items:start; gap:14px; margin-top:25px; padding:22px; border-radius:22px; background:linear-gradient(110deg,#fff9e6,#fffdf1); box-shadow:0 5px 20px #18396307; }.class-benefits>.nk-icon { width:43px; height:43px; color:#edb600; }.class-benefits ul { list-style:none; margin:12px 0 0; padding:0; display:grid; gap:8px; }.class-benefits li { display:flex; gap:9px; align-items:flex-start; font-size:15px; }.class-benefits li>span { display:grid; place-items:center; flex:none; width:22px; height:22px; border-radius:50%; background:#ffce00; }.class-benefits li .nk-icon { width:14px; height:14px; }
.class-materials,.class-study-methods { margin-top:25px; }.class-materials>h2,.class-study-methods>h2 { display:flex; gap:10px; align-items:center; margin-bottom:13px; }.class-materials>h2 .nk-icon,.class-study-methods>h2 .nk-icon { width:30px; height:30px; }.class-material-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }.class-material-grid>article { min-width:0; padding:18px; border-radius:18px; background:#eaf4ff; }.class-material-grid>article:nth-child(2) { background:#fff9e6; }.class-material-grid>article:nth-child(3) { background:#edfbea; }.class-material-grid .nk-icon { width:34px; height:34px; color:#176bd2; }.class-material-grid h3 { margin:8px 0 5px; font-size:19px; }.class-material-grid p { font-size:13px; line-height:1.45; }
.class-study-methods>div { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); padding:15px 10px; border:1px solid #e6edf7; border-radius:18px; background:white; box-shadow:0 4px 15px #0b316309; }.class-study-methods>div>span { display:flex; align-items:center; gap:9px; padding:0 10px; font-size:12px; line-height:1.4; }.class-study-methods>div>span+span { border-left:1px solid #e0e7f3; }.class-study-methods .nk-icon { width:28px; height:28px; }
.class-information-card { overflow:hidden; border:1px solid #dfe7f3; border-radius:20px; background:linear-gradient(#fff,#f7faff); box-shadow:0 6px 20px #15336b08; }.class-information-card>h2 { display:flex; align-items:center; gap:10px; padding:16px 22px; background:linear-gradient(100deg,#0b337e,#06458e); color:white; font-size:23px; }.class-information-card dl { margin:0; padding:0 22px; }.class-information-card dl>div { display:grid; grid-template-columns:1fr 1.12fr; align-items:center; gap:12px; padding:17px 0; }.class-information-card dl>div+div { border-top:1px solid #e0e8f3; }.class-information-card dt { display:flex; gap:10px; align-items:center; font-size:15px; font-weight:800; }.class-information-card dt .nk-icon { width:25px; height:25px; }.class-information-card dd { margin:0; font-size:15px; line-height:1.45; }.class-information-card dd>span { display:block; font-weight:700; }.class-information-card dd strong,.class-information-card dd a { color:#0753bc; font-weight:800; }
.class-registration { padding:18px; border:1px solid #e1e9f5; border-radius:20px; background:#fff; box-shadow:0 5px 20px #15336b08; }.class-registration>a { display:flex; align-items:center; justify-content:center; gap:10px; min-height:52px; padding:10px; border-radius:26px; font-weight:800; font-size:16px; text-align:center; }.class-register-button { background:#ffcf00; }.class-register-button .nk-icon { width:20px; height:20px; }.class-question-button { margin-top:12px; border:1px solid #afc6ed; }.class-question-button .nk-icon { color:#0bb449; }
.class-other { margin-top:32px; padding-top:24px; border-top:1px solid #e1e9f4; }.class-other-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:18px; }.class-other-heading h2 { font-size:25px; letter-spacing:-.6px; }.class-other-heading>a { display:flex; align-items:center; gap:7px; font-size:13px; font-weight:800; color:#0758ba; }.class-other-heading>a .nk-icon { width:18px; height:18px; }.class-other-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }.class-other-card { overflow:hidden; border:1px solid #dfe7f2; border-radius:18px; background:white; box-shadow:0 5px 16px #102f680a; }.class-other-image { height:110px; display:grid; place-items:center; background:color-mix(in srgb,var(--catalog-tone) 22%,white); }.class-other-image img { width:80px; height:80px; object-fit:contain; }.class-other-card>div:last-child { padding:14px 16px; }.class-other-card h3 { display:flex; justify-content:space-between; align-items:center; gap:8px; font-size:19px; }.class-other-card h3>span { display:grid; place-items:center; flex:none; width:25px; height:25px; border:1px solid #0b65c6; border-radius:50%; }.class-other-card h3 .nk-icon { width:17px; height:17px; }.class-other-card p { margin-top:7px; font-size:13px; line-height:1.4; }
@media (max-width:760px) {
 .class-detail { width:auto; margin:0 18px; padding-top:18px; padding-bottom:30px; }.class-breadcrumb { font-size:12px; gap:9px; margin-bottom:20px; }.class-detail-hero { grid-template-columns:minmax(0,1fr); gap:12px; }.class-detail-intro h1 { font-size:40px; }.class-detail-intro h2 { font-size:22px; }.class-detail-intro>p { font-size:15px; }.class-detail-facts { margin-top:20px; padding-bottom:20px; }.class-detail-facts>div+div { padding-left:14px; }.class-detail-facts>div { font-size:12px; gap:9px; }.class-detail-facts strong { font-size:12px; }.class-detail-hero-image { height:250px; }.class-detail-layout { grid-template-columns:minmax(0,1fr); gap:22px; margin-top:18px; }.class-detail-content h2 { font-size:22px; }.class-about>p { font-size:15px; }.class-benefits { grid-template-columns:32px minmax(0,1fr); gap:10px; padding:16px; }.class-benefits>.nk-icon { width:30px; height:30px; }.class-benefits li { font-size:13px; }.class-material-grid { gap:9px; }.class-material-grid>article { padding:12px; }.class-material-grid h3 { font-size:15px; }.class-material-grid p { font-size:12px; }.class-study-methods>div { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 0; }.class-study-methods>div>span:nth-child(3) { border-left:0; }.class-information-card>h2 { font-size:21px; }.class-other-heading { flex-wrap:wrap; gap:8px; }.class-other-heading h2 { font-size:22px; }.class-other-grid { grid-template-columns:minmax(0,1fr); gap:16px; }.class-other-card { display:grid; grid-template-columns:100px minmax(0,1fr); }.class-other-image { height:100%; min-height:125px; }.class-other-image img { width:65px; height:65px; }.class-other-card h3 { font-size:17px; }
}
@media (max-width:400px) { .class-material-grid { grid-template-columns:minmax(0,1fr); }.class-material-grid>article { display:grid; grid-template-columns:36px minmax(0,1fr); gap:4px 10px; }.class-material-grid h3 { margin:0; align-self:center; }.class-material-grid p { grid-column:2; } }

/* Upcoming classes: shared schedule panel and registration actions. */
.upcoming-section {
  padding-block: 50px;
  background: radial-gradient(ellipse at 95% 90%, #e4f2ff 0, transparent 58%), #fbfdff;
}
.upcoming-grid {
  display: grid;
  grid-template-columns: minmax(235px, .29fr) minmax(0, 1fr);
  align-items: center;
  gap: 32px;
}
.upcoming-label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 7px 16px;
  color: var(--navy);
  background: #ffedaf;
  border-radius: 30px;
}
.upcoming-label .nk-icon { color: var(--blue); }
.upcoming-intro h2 { margin: 16px 0; font-size: clamp(27px, 2.5vw, 42px); letter-spacing: -1.3px; line-height: 1.22; }
.upcoming-intro p { margin: 0; color: #586784; font-size: clamp(16px, 1.35vw, 23px); line-height: 1.6; letter-spacing: -.5px; }
.upcoming-intro .button { margin-top: 28px; padding: 14px 24px; gap: 16px; min-height: 54px; font-size: clamp(14px, 1.2vw, 20px); }
.upcoming-intro .button .nk-icon { color: #ffc400; }
.upcoming-panel { min-width: 0; overflow: hidden; border-radius: 24px; background: #fff; box-shadow: 0 12px 32px #438bd410; }
.upcoming-panel > h3 { display: flex; align-items: center; gap: 16px; margin: 0; padding: 20px 26px; color: #fff; background: linear-gradient(110deg, #064bb4, #003fa7); font-size: clamp(21px, 1.7vw, 28px); line-height: 1.4; }
.upcoming-panel > h3 .nk-icon { width: 32px; height: 32px; }
.upcoming-list { padding: 4px 22px 10px; }
.upcoming-row { display: grid; grid-template-columns: 1.16fr 1.3fr 1.38fr .7fr .7fr; align-items: center; gap: 14px; min-height: 90px; padding: 15px 0; font-size: clamp(11px, .98vw, 17px); }
.upcoming-row + .upcoming-row { border-top: 1px solid #e9eef6; }
.upcoming-course { display: flex; align-items: center; gap: 12px; min-width: 0; }
.upcoming-course h4 { margin: 0 0 4px; font-size: clamp(15px, 1.22vw, 22px); font-weight: 800; line-height: 1.3; letter-spacing: -.6px; }
.upcoming-icon { display: grid; place-items: center; width: 52px; height: 52px; flex-shrink: 0; border-radius: 14px; background: var(--upcoming-soft); color: var(--upcoming-accent); }
.upcoming-icon .nk-icon { width: 34px; height: 34px; }
.upcoming-theme-blue { --upcoming-soft: #dceeff; --upcoming-accent: #087ef0; }
.upcoming-theme-gold { --upcoming-soft: #fff0c6; --upcoming-accent: #e29b00; }
.upcoming-theme-purple { --upcoming-soft: #eee5ff; --upcoming-accent: #6b21c4; }
.upcoming-level { display: inline-block; padding: 3px 12px; border-radius: 20px; background: var(--upcoming-soft); color: var(--upcoming-accent); font-weight: 700; font-size: .9em; line-height: 1.25; }
.upcoming-date, .upcoming-time { display: flex; align-items: center; gap: 8px; min-height: 34px; padding-left: 14px; border-left: 1px solid #e0e6f1; font-weight: 700; line-height: 1.5; }
.upcoming-date .nk-icon, .upcoming-time .nk-icon { width: 21px; height: 21px; }
.upcoming-time { color: #344d73; }
.upcoming-quota { display: flex; justify-content: center; align-items: baseline; gap: 4px; border-radius: 30px; padding: 3px 8px; color: #087017; background: #e9f8eb; font-weight: 800; white-space: nowrap; }
.upcoming-quota strong { font-size: 1.7em; line-height: 1.35; }
.upcoming-quota.is-limited { color: #c51b29; background: #ffebee; }
.upcoming-row .upcoming-register { display: flex; justify-content: center; gap: 12px; min-height: 42px; padding: 8px 14px; border-radius: 30px; background: #ffcf00; font-size: inherit; font-weight: 800; }
.upcoming-register .nk-icon { width: 22px; height: 22px; }
.upcoming-register:hover { background: #ffdf3e; }
@media (min-width: 1600px) {
  .upcoming-grid { gap: 48px; }
  .upcoming-row { min-height: 98px; }
  .upcoming-icon { width: 60px; height: 60px; }
}
@media (max-width: 1279px) {
  .upcoming-grid { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .upcoming-intro { max-width: 600px; }
  .upcoming-intro h2 { font-size: 34px; }
  .upcoming-intro p { font-size: 18px; }
  .upcoming-row { font-size: 13px; }
  .upcoming-course h4 { font-size: 17px; }
}
@media (max-width: 760px) {
  .upcoming-section { padding-block: 32px; }
  .upcoming-grid { gap: 24px; }
  .upcoming-intro h2 { font-size: 30px; }
  .upcoming-intro p { font-size: 16px; }
  .upcoming-intro .button { margin-top: 20px; }
  .upcoming-panel { border-radius: 20px; }
  .upcoming-panel > h3 { padding: 18px; gap: 10px; font-size: 19px; }
  .upcoming-panel > h3 .nk-icon { width: 26px; height: 26px; }
  .upcoming-list { padding: 0 18px; }
  .upcoming-row { grid-template-columns: minmax(0, 1fr) auto; gap: 14px 12px; padding: 20px 0; font-size: 12px; }
  .upcoming-course { grid-column: 1 / -1; }
  .upcoming-course h4 { font-size: 19px; }
  .upcoming-level { font-size: 12px; }
  .upcoming-date, .upcoming-time { grid-column: 1 / -1; min-height: 0; border: 0; padding: 0; font-size: 12px; }
  .upcoming-quota { justify-self: start; padding-inline: 16px; }
  .upcoming-row .upcoming-register { min-width: 115px; }
}

/* Promotional package prices. Keep the section aligned with the page container. */
.pricing-section.pricing-promo { max-width: 1240px; padding: 0; margin: 12px auto 32px; }
.pricing-promo .pricing-panel { padding: 32px 24px 24px; border-radius: 44px; }
.pricing-promo .pricing-intro { grid-template-columns: minmax(0, 1fr) 210px; padding: 0 12px; gap: 14px; margin-bottom: 24px; }
.pricing-promo .pricing-label { font-size: 17px; }
.pricing-promo .pricing-intro h2 { margin-bottom: 14px; font-size: clamp(28px, 2.7vw, 40px); line-height: 1.2; }
.pricing-promo .pricing-intro p { margin: 0; font-size: 17px; }
.pricing-promo .pricing-card { padding: 22px 18px; border-radius: 28px; }
.pricing-promo .pricing-card-heading { min-height: 88px; gap: 10px; }
.pricing-promo .pricing-card-heading > .nk-icon { width: 44px; height: 44px; }
.pricing-promo .pricing-card h3 { font-size: 18px; }
.pricing-promo .pricing-card-heading p { margin: 8px 0 0; font-size: 14px; }
.pricing-promo .pricing-capacity { margin: 16px 0 0; padding: 7px 6px; font-size: 13px; }
.pricing-promo .pricing-amount { margin-top: 15px; padding: 10px 0 0; }
.pricing-promo .pricing-amount .pricing-promo-badge { display: inline-flex; align-items: center; gap: 8px; min-height: 32px; padding: 3px 14px; border-radius: 24px; background: #ffcf00; color: var(--navy); font-size: 16px; font-weight: 800; }
.pricing-promo-badge .nk-icon { width: 24px; height: 24px; }
.pricing-promo .pricing-promo-badge.is-discount { color: #fff; background: linear-gradient(#ff7865, #ff4138); }
.pricing-promo .pricing-promo-badge > span { display: inline; min-height: 0; color: inherit; font-size: 22px; line-height: 1; }
.pricing-original { display: block; margin-top: 12px; color: #59606c; font-weight: 800; font-size: 19px; text-decoration-color: #e54b42; text-decoration-thickness: 2px; }
.pricing-promo .pricing-amount strong { font-size: clamp(28px, 2.8vw, 41px); white-space: nowrap; }
.pricing-promo .pricing-amount > span:last-child { font-size: 15px; }
.pricing-saving { display: flex; align-items: center; justify-content: center; gap: 7px; margin: 12px 0 16px; padding: 8px 6px; border-radius: 28px; background: #fff0ae; font-size: 12px; font-weight: 800; letter-spacing: -.35px; }
.pricing-saving .nk-icon { width: 21px; height: 21px; padding: 3px; border-radius: 50%; background: #ffcf00; }
.pricing-promo .pricing-level { margin-bottom: 0; font-size: 13px; padding: 8px 6px; }
.pricing-promo .pricing-actions { gap: 16px; margin-top: 28px; justify-content: space-between; flex-wrap: wrap; }
.pricing-deadline { display: flex; align-items: center; justify-content: center; gap: 10px; flex: 1 1 380px; margin: 0; padding: 12px 18px; border-radius: 40px; background: linear-gradient(#ffe875, #ffdb35); color: var(--navy); font-size: 15px; font-weight: 800; }
.pricing-deadline > .nk-icon { width: 40px; height: 40px; }
.pricing-promo .pricing-actions .button { min-height: 52px; padding: 12px 18px; gap: 8px; font-size: 14px; }
.pricing-promo .pricing-actions .pricing-claim { border-color: #ffe564; box-shadow: inset 0 -4px #edbb00; }
.pricing-terms { margin: 8px 8px 0; color: #fff; font-size: 13px; font-style: italic; text-align: right; }
.pricing-promo .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; }
@media (max-width: 1100px) {
  .pricing-promo .pricing-card-heading { min-height: 72px; }
  .pricing-promo .pricing-amount strong { font-size: 36px; }
  .pricing-promo .pricing-saving { font-size: 14px; }
  .pricing-promo .pricing-actions { justify-content: center; }
  .pricing-promo .pricing-deadline { flex-basis: 100%; }
}
@media (max-width: 760px) {
  .pricing-promo .pricing-panel { padding: 26px 18px 20px; border-radius: 28px; }
  .pricing-promo .pricing-intro { grid-template-columns: minmax(0, 1fr); padding: 0; }
  .pricing-promo .pricing-label { font-size: 13px; padding: 7px 12px; gap: 7px; }
  .pricing-promo .pricing-label .nk-icon { width: 22px; height: 22px; }
  .pricing-promo .pricing-intro h2 { font-size: 29px; }
  .pricing-promo .pricing-intro p { font-size: 15px; }
  .pricing-promo .pricing-card { padding: 22px 16px; }
  .pricing-promo .pricing-card-heading { min-height: 88px; }
  .pricing-promo .pricing-card h3 { font-size: 19px; }
  .pricing-promo .pricing-saving { font-size: 12px; }
  .pricing-promo .pricing-deadline { flex: auto; width: 100%; padding: 12px; font-size: 13px; }
  .pricing-promo .pricing-deadline > .nk-icon { width: 30px; height: 30px; }
  .pricing-promo .pricing-actions { gap: 12px; margin-top: 22px; }
}

.upcoming-row .upcoming-register:disabled {
  background: #e7ecf3;
  color: #67758b;
  cursor: not-allowed;
}

/* Database-driven homepage hero slider */
.hero-slide[hidden], .hero-slider-controls[hidden] { display: none; }
.hero-copy > :is(h1, .hero-slide-title), .hero-copy > p { white-space: pre-line; overflow-wrap: anywhere; }
.hero-copy > :is(h1, .hero-slide-title) mark { white-space: normal; box-decoration-break: clone; -webkit-box-decoration-break: clone; }
.hero-blob picture { display: block; width: 100%; height: 100%; }
.hero-slider-controls { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 14px; padding-bottom: 22px; }
.hero-slider-dots { display: flex; align-items: center; gap: 9px; }
.hero-slider-dots button { width: 11px; height: 11px; border: 0; border-radius: 50%; background: #a8bfdf; cursor: pointer; padding: 0; }
.hero-slider-dots button[aria-current="true"] { background: var(--blue, #063a91); }
.hero-slider-pause { background: white; border: 1px solid #b9d0ee; border-radius: 20px; padding: 7px 12px; color: #063a91; font: inherit; font-size: 12px; cursor: pointer; }
.hero-slider-controls .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; }
@media (max-width: 760px) {
    .hero-copy > :is(h1, .hero-slide-title), .hero-copy > p { white-space: normal; }
    .hero .hero-visual { display: block; max-width: 360px; margin: 8px auto 18px; }
    .hero-slider-controls { gap: 10px; padding-bottom: 16px; }
}

.learning-program-card h4,
.learning-program-features li span,
.learning-program-badge {
  overflow-wrap: anywhere;
}

/* Editable course detail content */
.class-about > p { white-space: pre-line; }
.class-material-grid > article.course-material-blue { background: #edf5ff; }
.class-material-grid > article.course-material-yellow { background: #fff9e8; }
.class-material-grid > article.course-material-purple { background: #f5efff; }
.class-material-grid > article.course-material-green { background: #edfaee; }

/* Database-backed article filters and WYSIWYG content. */
.articles-filters { grid-template-columns: minmax(0, 1.5fr) minmax(0, .9fr) auto; }
.articles-search-submit { min-height: 44px; padding: 8px 24px; font-size: 14px; }
.article-tone-blue { background-color: #d9ebff; }
.article-tone-yellow { background-color: #ffec91; }
.article-tone-purple { background-color: #eadcff; }
.article-tone-green { background-color: #baf2d6; }
.article-rich-content { color: #20385f; font-size: 17px; line-height: 1.8; overflow-wrap: anywhere; }
.article-rich-content > :first-child { margin-top: 0; }
.article-rich-content p { margin: 0 0 18px; }
.article-rich-content h2 { margin: 28px 0 12px; color: var(--navy); font-size: 27px; line-height: 1.3; }
.article-rich-content h3 { margin: 22px 0 10px; color: var(--navy); font-size: 22px; line-height: 1.35; }
.article-rich-content ul, .article-rich-content ol { margin: 16px 0 20px; padding-left: 28px; }
.article-rich-content ul { list-style: disc; }
.article-rich-content ol { list-style: decimal; }
.article-rich-content li + li { margin-top: 8px; }
.article-rich-content li > p { margin-bottom: 6px; }
.article-rich-content blockquote { margin: 24px 0; padding: 20px 24px; border-left: 4px solid var(--yellow); border-radius: 0 16px 16px 0; background: #fff7dc; }
.article-rich-content blockquote h2 { margin-top: 0; font-size: 22px; }
.article-rich-content blockquote > :last-child { margin-bottom: 0; }
.article-rich-content a { color: #075eb9; text-decoration: underline; }
.article-rich-content img { max-width: 100%; height: auto; border-radius: 14px; }
.article-rich-content pre { max-width: 100%; overflow-x: auto; padding: 16px; border-radius: 12px; background: #f0f5fa; }
.article-rich-content table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; }
.article-rich-content td, .article-rich-content th { border: 1px solid #dce4ef; padding: 8px 12px; }
.article-card h2, .article-detail-copy h1, .article-related-card h3 { overflow-wrap: anywhere; }
@media (max-width: 760px) {
  .articles-filters { grid-template-columns: minmax(0, 1fr); }
  .articles-search-submit { width: 100%; }
  .article-rich-content { font-size: 15px; }
  .article-rich-content h2 { font-size: 22px; }
  .article-rich-content h3 { font-size: 19px; }
  .article-rich-content blockquote { padding: 16px; }
}

/* Recommended course cards use real catalog summaries. */
.recommended-courses .class-open { display: flex; flex-direction: column; }
.recommended-courses .class-open:focus-visible { outline: 3px solid var(--blue); outline-offset: -3px; border-radius: 22px; }
.recommended-course-image { flex-shrink: 0; background: linear-gradient(135deg, #eaf4ff, #f6fbff); }
.recommended-course-image > img { object-fit: contain; padding: 18px; }
.recommended-courses .class-body { flex: 1; padding: 30px 20px 20px; }
.recommended-courses .class-body h3 { max-width: 100%; min-height: 0; overflow-wrap: anywhere; }
.article-share-row { flex-wrap: wrap; }
.article-copy-status { color: #0c367e; font-size: 14px; }
.article-copy-url { flex-basis: 100%; width: 100%; padding: 10px 12px; border: 1px solid #cfd9e8; border-radius: 8px; color: #102d65; font: inherit; }
.article-copy-url[hidden] { display: none; }
.class-summary { margin-top: 12px; color: var(--muted); font-size: 15px; line-height: 1.6; overflow-wrap: anywhere; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
@media (max-width: 760px) {
  .recommended-courses .class-body { padding: 25px 16px 18px; }
  .class-summary { font-size: 13px; }
}