@font-face{font-family:'Golos Text';src:url('./media/golos-400.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Golos Text';src:url('./media/golos-500.ttf') format('truetype');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Golos Text';src:url('./media/golos-600.ttf') format('truetype');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Golos Text';src:url('./media/golos-700.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Golos Text';src:url('./media/golos-800.ttf') format('truetype');font-weight:800;font-style:normal;font-display:swap}
@font-face{font-family:Manrope;src:url('./media/manrope-500.ttf') format('truetype');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:Manrope;src:url('./media/manrope-600.ttf') format('truetype');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:Manrope;src:url('./media/manrope-700.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:Manrope;src:url('./media/manrope-800.ttf') format('truetype');font-weight:800;font-style:normal;font-display:swap}
:root{--brand-bg:#FFFBF5;--brand-soft:#FCEFE0;--brand-ink:#2C2520;--brand-muted:#6E635A;--brand-line:#F0E3D2;--brand-primary:#B23C1C;--brand-terra:#D5512C;--brand-accent:#2C7A6B;--brand-amber:#F6B84B}
body{font-family:'Golos Text',Arial,sans-serif;background:var(--brand-bg);color:var(--brand-ink)}
button,input,select,textarea{font-family:'Golos Text',Arial,sans-serif}
.sp-shell h1,.sp-shell h2,.sp-shell h3,.sky-benefits h3,.sky-programs h2,.sky-eco-heading h2,.sky-eco-text h3,.sky-teachers h2,.sky-journey h2,.sky-questions h2,.enrollment .form-copy h2{font-family:Manrope,'Golos Text',sans-serif;font-weight:600;letter-spacing:-.035em}
.sp-shell p{color:var(--brand-muted)}
.sky-brand span{font-family:'Golos Text',sans-serif!important;font-weight:700;letter-spacing:-1px}
.sky-brand svg path:first-child{fill:var(--brand-terra)}.sky-brand svg path+path{fill:var(--brand-amber)}
.sky-promo{background:#2C2520}.sky-promo p span{color:#F6B84B}
.sp-button,.sky-journey-submit,.sky-fields>button,.enrollment .button.primary{background:#B23C1C;color:white}
.sp-button:hover,.sky-journey-submit:hover,.sky-fields>button:hover,.enrollment .button.primary:hover{background:#933015}
.sky-header .sky-login{color:var(--brand-ink)}

.sky-journey-mascot,.sky-journey-laptop{filter:sepia(.85) saturate(.75) hue-rotate(335deg)}



.sky-eco-blue{background:linear-gradient(125deg,#2C7A6B,#438F7E)}
.sky-eco-voice{background:linear-gradient(#fff,#fff) padding-box,linear-gradient(#D5512C,#F6B84B) border-box}
.sky-journey-card{background:linear-gradient(155deg,#386454,#243E36)}
.sp-detail-hero{background-image:linear-gradient(90deg,#7A351DEE,#7A351D99 55%,#7A351D11),url('/html/assets/media/sky-reference/course-beginner-background.webp');background-color:#D5512C}
.sp-detail-hero:before{background:transparent}.sp-kids{background-image:linear-gradient(120deg,#B23C1C,#F08A3C)}
.sp-catalog-visual{background:linear-gradient(145deg,#FCEFE0,#F6B84B)}
.sp-catalog-visual>span{color:#B23C1C}.sp-catalog-visual img{mix-blend-mode:normal}
.sp-price-featured{background:#FCEFE0;border:1px solid #E7B987}
.sp-price-notice,.sp-review-banner{background:linear-gradient(120deg,#FCEFE0,#F6DEC2)}
.sp-portrait{border-color:#FCEFE0}.sp-portrait>span{background:#2C7A6B}
.sp-tag,.sp-shell .sp-count{letter-spacing:.02em}
.sp-shell .sp-page-title h1{font-weight:600;font-size:62px;line-height:1.12}
.sp-shell .sp-heading h2{font-size:48px;line-height:1.15}
.sky-inner-header .sky-navigation>a,.sky-inner-header .sky-menu>summary{font-size:16px}
.sky-inner-top .sky-brand span{font-size:24px}
.sky-inner-header .sky-navigation{gap:18px}
.sky-footer nav>a:not(.sky-brand),.sky-footer nav>p{font-family:'Golos Text',sans-serif}
.enrollment{background:linear-gradient(135deg,#FFFBF5,#FCEFE0);color:#2C2520}.enrollment .form-copy p{color:#6E635A}
.enrollment input,.enrollment select{background:#fff;border-color:#F0E3D2;color:#2C2520}
::selection{background:#F6B84B;color:#2C2520}
@media(min-width:1600px){.sp-shell .sp-page-title h1{font-size:72px}}
@media(max-width:1200px){.sky-inner-header .sky-brand span{font-size:21px}.sky-inner-header .sky-login{font-size:13px}}
@media(max-width:900px){.sp-shell .sp-page-title h1{font-size:52px}.sp-shell .sp-heading h2{font-size:40px}}
@media(max-width:600px){.sp-shell .sp-page-title h1{font-size:37px;line-height:1.15}.sp-shell .sp-heading h2{font-size:31px}.sp-shell h3{line-height:1.2}.sky-inner-header .sky-brand span{font-size:18px}.sky-inner-header .sky-login{font-size:10px}.sky-top .sky-brand span{font-size:18px}.sky-top .sky-login{font-size:10px}.sp-shell .sp-detail-hero h1{font-size:37px}.sp-card-copy h3{font-size:26px}}
.sky-benefit h2,.sky-program-copy h3,.sky-teachers-heading h2,.sky-teacher-copy h3{font-family:Manrope,'Golos Text',sans-serif;font-weight:600;letter-spacing:-.035em}
.sky-benefit>img,.sky-journey-background{filter:sepia(.9) saturate(.8) hue-rotate(335deg)}
.sky-journey-panel{background:linear-gradient(155deg,#386454,#243E36)}
.sky-fields input::placeholder,.sky-journey input::placeholder,.enrollment input::placeholder{color:#766D65;opacity:1}
.sky-consents label,.sky-journey-consent{color:#F0E3D2}
.sky-consents input,.sky-journey-consent input{border-color:#D6C7B7}
/* Unselected course tabs remain clearly actionable on the warm page surface. */
.sky-program-tabs>button[aria-selected="false"]{background:#fff;color:#51473F;border:1px solid #DFD2C2;box-shadow:0 4px 12px #49332312,0 1px 3px #4933230D;opacity:1;cursor:pointer;transition:box-shadow .18s,border-color .18s,background .18s,transform .18s}
.sky-program-tabs>button[aria-selected="false"]:hover{background:#FFF8EE;border-color:#B99D7C;box-shadow:0 6px 18px #49332322;transform:translateY(-2px);color:#2C2520}
.sky-program-tabs>button:focus-visible{outline:3px solid #B23C1C;outline-offset:4px}
@media(prefers-reduced-motion:reduce){.sky-program-tabs>button[aria-selected="false"]{transition:none}.sky-program-tabs>button[aria-selected="false"]:hover{transform:none}}

/* Homepage conversation collage */
.sky-hero.esp-hero {
  width: min(1180px, calc(100% - 40px));
  height: auto;
  margin: 0 auto 32px;
  overflow: visible;
  color: #2c2520;
}
.esp-hero-scene {
  position: relative;
  isolation: isolate;
  width: min(980px, 100%);
  height: clamp(330px, 37vw, 465px);
  margin-inline: auto;
}
.esp-hero-art { position: relative; height: 100%; }
.esp-hero-arch {
  position: absolute;
  inset: 13% 22% 0;
  border-radius: 50% 50% 22px 22px / 62% 62% 22px 22px;
  background: linear-gradient(132deg, #f3ceaa 4%, #df976e 62%, #c56f51);
  border: 1px solid #b3644740;
  box-shadow: inset 0 0 0 10px #fff0d54a;
}
.esp-hero-portrait {
  position: absolute;
  inset: 0 0 auto;
  margin-inline: auto;
  width: 63%;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
}
.esp-hero-tile {
  position: absolute;
  aspect-ratio: 1;
  width: clamp(38px, 6vw, 82px);
  background: url('./media/brand/hero-tile.svg') center / cover;
  border-radius: 8px;
  box-shadow: 0 8px 18px #673f2c22;
}
.esp-hero-tile-back { right: 26%; top: 8%; rotate: 13deg; }
.esp-hero-tile-front { left: 32%; bottom: 5%; rotate: -11deg; }
.esp-hero-mascot {
  position: absolute;
  right: 0;
  bottom: -3%;
  width: clamp(215px, 31%, 320px);
  animation: sky-float 5s ease-in-out infinite;
  height: auto;
}
.esp-hero .sky-hero-panel {
  position: relative;
  border-radius: 28px;
  padding: clamp(14px, 1.6vw, 22px) clamp(22px, 3.2vw, 40px);
  background: linear-gradient(120deg, #243e36, #335e4f);
  color: #fff7e9;
  text-align: center;
}
.esp-hero h1 {
  margin: 0;
  color: inherit;
  font: 650 clamp(30px, 4.6vw, 58px)/1.12 Manrope, 'Golos Text', sans-serif;
  letter-spacing: -.045em;
  text-wrap: balance;
}
.esp-hero .sky-hero-form,
.esp-hero .sky-hero-form:has(.sky-form-result:not([hidden])) { padding: 0; }
.esp-hero .sky-hero-form > p { margin-inline: auto; }
.esp-hero .sky-fields > button { background: #b23c1c; }
.esp-hero .sky-fields > button:hover { background: #933015; }

@media (max-width: 600px) {
  .sky-hero.esp-hero { width: calc(100% - 32px); }
  .esp-hero-scene { height: clamp(232px, 70vw, 330px); }
  .esp-hero-arch { inset-inline: 11%; }
  .esp-hero-portrait { width: 83%; }
  .esp-hero-tile-back { right: 11%; }
  .esp-hero-tile-front { left: 13%; }
  .esp-hero-mascot { right: -5px; bottom: -2px; width: clamp(140px, 41%, 194px); }
  .esp-hero .sky-hero-panel { border-radius: 22px; }
}
/* Illustrated speech shapes with live text. */
.esp-hero-scene > .esp-hero-facts {
  display: contents;
  margin: 0;
  padding: 0;
  list-style: none;
  color: #2c2520;
}
.esp-hero-facts > li {
  position: absolute;
  z-index: 3;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 7px;
  min-height: 94px;
  padding: 24px 30px;
  background: var(--bubble-art) center / 100% 100% no-repeat;
  filter: drop-shadow(0 10px 13px #70452d26);
  font: 400 15px/1.3 'Golos Text', Arial, sans-serif;
}
.esp-hero-facts strong {
  font: 600 clamp(20px, 2.2vw, 27px)/1.15 Manrope, 'Golos Text', sans-serif;
  letter-spacing: -.035em;
}
.esp-hero-facts > li > span { color: #285e50; }
.esp-fact-native {
  --bubble-art: url('./media/brand/hero-bubble-native.svg');
  left: 0;
  top: 10%;
  width: clamp(190px, 23vw, 250px);
  rotate: -4deg;
}
.esp-fact-level {
  --bubble-art: url('./media/brand/hero-bubble-level.svg');
  right: 0;
  top: 15%;
  rotate: 5deg;
}
.esp-fact-audience {
  --bubble-art: url('./media/brand/hero-bubble-audience.svg');
  left: 0;
  bottom: 9%;
  rotate: 3deg;
}
.esp-hero .sky-hero-panel > h1 { margin-bottom: 10px; }

@media (max-width: 900px) {
  .esp-hero-scene { height: auto; }
  .esp-hero-art { height: clamp(235px, 66vw, 345px); }
  .esp-hero-scene > .esp-hero-facts {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) repeat(2, minmax(0, 1fr));
    gap: 5px;
    margin: 7px 0 12px;
  }
  .esp-hero-facts > li {
    position: static;
    width: auto;
    min-height: 70px;
    gap: 4px;
    rotate: none;
    padding: 9px 11px;
    font-size: 11px;
  }
  .esp-hero-facts strong { font-size: clamp(13px, 3.7vw, 19px); }
}

@media (prefers-reduced-motion: reduce) {
  .esp-hero-mascot { animation: none; }
}

.sky-top .sky-promo-globe {
  height: 72px;
  margin-bottom: 2px;
  object-position: center;
}
.sky-top .sky-promo-flags {
  filter: drop-shadow(0 4px 6px #602d2538);
}

.sky-top .sky-promo p {
  white-space: normal;
}
@media (max-width: 600px) {
  .sky-top .sky-promo {
    height: auto;
    min-height: 112px;
    padding-bottom: 12px;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .esp-hero .sky-fields > button {
    position: relative;
    overflow: hidden;
  }
  .esp-hero .sky-fields > button::after {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(108deg, transparent 17%, #fff2d212 32%, #fff2d247 49%, #fff2d21a 65%, transparent 82%);
    transform: translateX(-100%);
    animation: esp-booking-shine 1250ms cubic-bezier(.37, 0, .63, 1) 550ms both;
  }
}
@keyframes esp-booking-shine {
  to { transform: translateX(100%); }
}

.sky-program-actions > :is(a, button) {
  transition: background-color 160ms ease;
}
.sky-program-actions > a {
  color: #fff;
  text-decoration: none;
}
.sky-program-actions > a:active {
  color: #fff;
  background: #813019;
}
.sky-program-actions > button:active {
  color: var(--brand-ink);
  background: #f2dcc6;
}
@media (hover: hover) {
  .sky-program-actions > a:hover:not(:active) {
    color: #fff;
    background: #963318;
    text-decoration: none;
  }
}
.sky-program-actions > button:hover:not(:active) {
  color: var(--brand-ink);
}
@media (hover: none) {
  .sky-program-actions > a:hover:not(:active) { background: var(--brand-primary); }
  .sky-program-actions > button:hover:not(:active) { background: #fffbf5; }
}
.sky-program-actions > :is(a, button):focus-visible {
  outline: 2px solid var(--brand-accent);
  outline-offset: 3px;
}
@media (prefers-reduced-motion: reduce) {
  .sky-program-actions > :is(a, button) { transition: none; }
}