@font-face {
  font-family: Ibmplexserif;
  src: url('../fonts/IBMPlexSerif-Regular.ttf') format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Ibmplexserif;
  src: url('../fonts/IBMPlexSerif-SemiBold.ttf') format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Ibmplexserif;
  src: url('../fonts/IBMPlexSerif-Medium.ttf') format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Ibmplexserif;
  src: url('../fonts/IBMPlexSerif-Bold.ttf') format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Ibmplexserif;
  src: url('../fonts/IBMPlexSerif-Italic.ttf') format("truetype");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Ibmplexserif;
  src: url('../fonts/IBMPlexSerif-LightItalic.ttf') format("truetype");
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Ibmplexserif;
  src: url('../fonts/IBMPlexSerif-MediumItalic.ttf') format("truetype");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Ibmplexsans;
  src: url('../fonts/IBMPlexSans-SemiBold.ttf') format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Ibmplexsans;
  src: url('../fonts/IBMPlexSans-Italic.ttf') format("truetype");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Ibmplexsans;
  src: url('../fonts/IBMPlexSans-Medium.ttf') format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Ibmplexsans;
  src: url('../fonts/IBMPlexSans-MediumItalic.ttf') format("truetype");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Ibmplexsans;
  src: url('../fonts/IBMPlexSans-LightItalic.ttf') format("truetype");
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Ibmplexsans;
  src: url('../fonts/IBMPlexSans-Regular.ttf') format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  --main--second-font: Ibmplexsans, Arial, sans-serif;
  --dark: #000;
  --main--main-text: 1rem;
  --main--line-height-m: 1.3em;
  --main--main-font: Ibmplexserif, Arial, sans-serif;
  --heading--heading-h1: 4.5rem;
  --main--line-height-s: 1.1em;
  --heading--heading-h2: 3.5rem;
  --heading--heading-h3: 2.75rem;
  --heading--heading-h4: 2rem;
  --heading--heading-h5: 1.5rem;
  --heading--heading-h6: 1.25rem;
  --neutral-600: #2f2f2f;
  --main--line-height-l: 1.5em;
  --color-300\<deleted\|variable-8635f960\>: #4b4477;
  --blue-300\<deleted\|variable-c86ae2a3\>: #000;
  --heading--quote\<deleted\|variable-a72928f2-c6e4-38ad-0986-2c3c1f97705d\>: 3rem;
  --heading--quote-tablet-mobile\<deleted\|variable-3b7dbd79-c886-00a8-f038-6a5e68d92966\>: 2rem;
  --main--size--size-4xl: 7rem;
  --light: #f4f1eb;
  --green: #1c3433;
  --neutral: white;
  --main--size--size-2xs: .5rem;
  --llight-darker: #efeadf;
  --container--main-size: 80rem;
  --container--padding: 1.5rem;
  --main--size--size-m: 1.5rem;
  --main--size--size-xl: 3rem;
  --main--size--size-l: 2rem;
  --blue-100: #29225f;
  --heading--heading-jumbo-xl\<deleted\|variable-4a84b770-cee3-d253-17d0-b4b28dbebdb8\>: 5rem;
  --heading--heading-jumbo-l\<deleted\|variable-12524850-8c95-cbd9-a70d-dfe678e3b047\>: 4rem;
  --yellow: #a78463;
  --neutral-100: #f9f9f9;
  --neutral-200: #ebebeb;
  --neutral-300: #cfcfcf;
  --neutral-400: #b7b7b7;
  --neutral-500: #676a71;
  --error: #f46b6b;
  --success: #4cb06c;
  --main--size--size-xs: .75rem;
  --main--size--size-s: 1rem;
  --size--size-m\<deleted\|variable-8ebdea6a-e5bb-1ea1-1a82-a2469ae54b44\>: 1.5rem;
  --size--size-m-tablet\<deleted\|variable-12f63bca-dea1-7a4d-2af2-90085f028c1b\>: 1.25rem;
  --size--size-m-mobile\<deleted\|variable-4fe38f60-5ac3-3b52-2d2a-f305fdeab43f\>: 1rem;
  --size--size-l\<deleted\|variable-c88f49e3-a83e-caa2-1cf9-c1778e316ad2\>: 2rem;
  --size--size-l-tablet\<deleted\|variable-a9b0cf0d-c55d-4a0d-3b36-1de3638c6393\>: 1.5rem;
  --size--size-l-mobile\<deleted\|variable-cb5d6169-327c-dfe2-21b4-1e46aa7ccd3e\>: 1.25rem;
  --size--size-xl\<deleted\|variable-74d64f86-2865-ead6-16a1-0df3e5c7167b\>: 4rem;
  --size--size-xl-tablet\<deleted\|variable-3472737a-a00f-333f-a4b5-887f3fcffac1\>: 3rem;
  --size--size-xl-mobile\<deleted\|variable-b2a88d7d-2729-fd28-0e1d-118fb47253d8\>: 2rem;
  --size--size-xxl\<deleted\|variable-25224336-488e-d550-ef9e-7c99f5f17854\>: 5rem;
  --size--size-xxl-tablet\<deleted\|variable-b46b6bb3-e633-d487-f262-2c2b2d399726\>: 4rem;
  --size--size-xxl-mobile\<deleted\|variable-6469b4c9-c62f-7903-9fdb-f75b788ad92d\>: 3rem;
  --main--size--size-2xl: 4rem;
  --main--size--size-3xl: 5rem;
  --blue-200: #221c52;
  --color-100\<deleted\|variable-5dd580e5\>: #6bc1ec;
  --color-200\<deleted\|variable-c5c9bbdd\>: #e2e2ea;
  --main--line-height-xs: 1.05em;
  --main--size--no-size: 0px;
  --main--size--size-3xs: .25rem;
  --main--text-m: 1.25rem;
  --main--text-s: 1.125rem;
  --main--text-l: 1.5rem;
  --main--text-xxs: .875rem;
  --main--text-xs: 1rem;
}

body {
  font-family: var(--main--second-font);
  color: var(--dark);
  font-size: var(--main--main-text);
  line-height: var(--main--line-height-m);
  font-weight: 400;
}

h1 {
  font-family: var(--main--main-font);
  font-size: var(--heading--heading-h1);
  line-height: var(--main--line-height-s);
  margin-top: 0;
  margin-bottom: 0;
  font-weight: 400;
}

h2 {
  font-family: var(--main--main-font);
  font-size: var(--heading--heading-h2);
  line-height: var(--main--line-height-s);
  margin-top: 0;
  margin-bottom: 0;
  font-weight: 400;
}

h3 {
  font-family: var(--main--main-font);
  font-size: var(--heading--heading-h3);
  line-height: var(--main--line-height-s);
  margin-top: 0;
  margin-bottom: 0;
  font-weight: 400;
}

h4 {
  font-family: var(--main--main-font);
  font-size: var(--heading--heading-h4);
  line-height: var(--main--line-height-m);
  margin-top: 0;
  margin-bottom: 0;
  font-weight: 400;
}

h5 {
  font-family: var(--main--main-font);
  font-size: var(--heading--heading-h5);
  line-height: var(--main--line-height-m);
  margin-top: 0;
  margin-bottom: 1rem;
  font-weight: 400;
}

h6 {
  font-family: var(--main--main-font);
  font-size: var(--heading--heading-h6);
  line-height: var(--main--line-height-m);
  margin-top: 0;
  margin-bottom: 1rem;
  font-weight: 400;
}

p {
  color: var(--neutral-600);
  font-size: var(--main--main-text);
  line-height: var(--main--line-height-l);
  margin-bottom: 0;
}

a {
  color: var(--color-300\<deleted\|variable-8635f960\>);
  text-decoration: underline;
  transition: opacity .2s, color .2s;
}

a:hover {
  color: var(--blue-300\<deleted\|variable-c86ae2a3\>);
}

ul, ol {
  margin-bottom: 0;
  padding-left: 2rem;
  font-size: 1rem;
  line-height: 1.1em;
}

li {
  margin-bottom: .75rem;
}

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

blockquote {
  font-size: var(--heading--quote\<deleted\|variable-a72928f2-c6e4-38ad-0986-2c3c1f97705d\>);
  border-left: 5px #e2e2e2;
  margin-bottom: 0;
  padding: .75rem 1.25rem;
  font-weight: 500;
  line-height: 1.1em;
}

figure {
  margin-bottom: 20px;
}

figcaption {
  text-align: center;
  margin-top: 8px;
  font-size: 16px;
  line-height: 1.3em;
}

.section {
  padding-top: var(--main--size--size-4xl);
  padding-bottom: var(--main--size--size-4xl);
  flex-direction: column;
  align-items: center;
  display: flex;
}

.section.asas {
  background-color: #a21919;
}

.section.hero-section {
  background-color: var(--light);
}

.section.bg-light.no-padding-top {
  padding-top: 0;
}

.section.about-us-hero-section {
  background-color: var(--green);
  color: var(--neutral);
  background-image: url('../images/janalanguagestudio-abstract-hero.svg');
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: auto;
}

.section.courses-menu-line {
  padding-top: var(--main--size--size-2xs);
  padding-bottom: var(--main--size--size-2xs);
  border-top: 1px solid var(--llight-darker);
  border-bottom: 1px solid var(--llight-darker);
}

.section.english-course-hero {
  padding-top: var(--main--size--size-4xl);
  padding-bottom: 10rem;
  position: relative;
  overflow: hidden;
}

.container {
  width: 100%;
  max-width: var(--container--main-size);
  padding-right: var(--container--padding);
  padding-left: var(--container--padding);
}

.container.grid {
  grid-column-gap: var(--main--size--size-m);
  grid-row-gap: var(--main--size--size-m);
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.container.grid.margin-xl {
  margin-bottom: 80px;
}

.container.grid.grid-gap-xl {
  grid-column-gap: var(--main--size--size-xl);
  grid-row-gap: var(--main--size--size-xl);
}

.container.grid.grid-gap-l {
  grid-column-gap: var(--main--size--size-l);
  grid-row-gap: var(--main--size--size-l);
}

.container.benefits-grid {
  grid-column-gap: var(--main--size--size-l);
  grid-row-gap: var(--main--size--size-l);
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.container.benefits-grid.margin-xl {
  margin-bottom: 80px;
}

.container.benefits-grid.grid-gap-xl {
  grid-column-gap: var(--main--size--size-xl);
  grid-row-gap: var(--main--size--size-xl);
}

.style-guide-classes-wrap {
  align-items: center;
  margin-bottom: 1.5rem;
  display: flex;
}

.style-guide-classes-wrap.margin-top-m {
  margin-top: 32px;
}

.style-guide-classes-wrap.margin-left-s {
  margin-left: 20px;
}

.style-guide-classes-wrap.margin-left-m {
  margin-left: 36px;
}

.style-guide-class-icon {
  object-fit: cover;
  border-radius: 4px;
  flex: none;
  width: 1.8rem;
  height: 1.5rem;
  overflow: hidden;
}

.style-guide-class-label {
  background-color: var(--color-300\<deleted\|variable-8635f960\>);
  color: #fff;
  border-radius: 4px;
  flex: none;
  justify-content: center;
  align-items: center;
  height: 1.5rem;
  margin-left: .5rem;
  padding-left: .5rem;
  padding-right: .5rem;
  font-size: .75rem;
  line-height: 1.6em;
  display: flex;
}

.column {
  flex-direction: column;
  align-items: flex-start;
  display: flex;
  position: relative;
}

.column.contact-footer-column {
  min-width: 25rem;
  padding: var(--main--size--size-l);
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  background-color: var(--neutral);
  border-radius: 1.5rem;
}

.column.footer-column {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
}

.main-wrapper {
  overflow: clip;
}

.label {
  color: var(--blue-100);
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.1em;
}

.jumbo-h {
  font-family: var(--main--main-font);
}

.style-guide-styles-wrap {
  grid-column-gap: 1.5rem;
  grid-row-gap: 1.5rem;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  margin-bottom: 40px;
  display: grid;
}

.bg-green {
  background-color: var(--green);
}

.style-guide-color-helper {
  color: var(--neutral);
  text-align: center;
  margin: 16px;
}
.cta-text{

  max-width:500px;
}
.margin-l {
  margin-bottom: var(--main--size--size-l);
}

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

.bg-light {
  background-color: var(--light);
}

.bg-blue-300 {
  background-color: var(--color-300\<deleted\|variable-8635f960\>);
}

.bg-neutral {
  background-color: var(--neutral);
}

.bg-neutral-100 {
  background-color: var(--neutral-100);
}

.bg-neutral-200 {
  background-color: var(--neutral-200);
}

.bg-neutral-300 {
  background-color: var(--neutral-300);
}

.bg-neutral-400 {
  background-color: var(--neutral-400);
}

.bg-neutral-600 {
  background-color: var(--neutral-600);
}

.bg-neutral-500 {
  background-color: var(--neutral-500);
}

.bg-error {
  background-color: var(--error);
}

.bg-success {
  background-color: var(--success);
}

.no-margin {
  margin-bottom: 0;
}

.text-neutral {
  color: var(--neutral);
}

.text-neutral.text-s.max-width-800 {
  max-width: 50rem;
}

.text-neutral-200 {
  color: var(--neutral-200);
}

.text-neutral-400 {
  color: var(--neutral-400);
}

.text-neutral-600 {
  color: var(--neutral-600);
}

.text-navy-300 {
  color: var(--blue-300\<deleted\|variable-c86ae2a3\>);
}

.text-left {
  text-align: left;
}

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

.text-right {
  text-align: right;
}

.padding-2xs {
  padding-top: var(--main--size--size-2xs);
  padding-bottom: var(--main--size--size-2xs);
}

.style-guide-padding-helper {
  color: var(--blue-300\<deleted\|variable-c86ae2a3\>);
}

.padding-xs {
  padding-top: var(--main--size--size-xs);
  padding-bottom: var(--main--size--size-xs);
}

.padding-s {
  padding-top: var(--main--size--size-s);
  padding-bottom: var(--main--size--size-s);
}

.padding-m {
  padding-top: var(--size--size-m\<deleted\|variable-8ebdea6a-e5bb-1ea1-1a82-a2469ae54b44\>);
  padding-bottom: var(--size--size-m\<deleted\|variable-8ebdea6a-e5bb-1ea1-1a82-a2469ae54b44\>);
}

.padding-l {
  padding-top: var(--size--size-l\<deleted\|variable-c88f49e3-a83e-caa2-1cf9-c1778e316ad2\>);
  padding-bottom: var(--size--size-l\<deleted\|variable-c88f49e3-a83e-caa2-1cf9-c1778e316ad2\>);
}

.padding-xl {
  padding-top: var(--size--size-xl\<deleted\|variable-74d64f86-2865-ead6-16a1-0df3e5c7167b\>);
  padding-bottom: var(--size--size-xl\<deleted\|variable-74d64f86-2865-ead6-16a1-0df3e5c7167b\>);
}

.padding-xxl {
  padding-top: var(--size--size-xxl\<deleted\|variable-25224336-488e-d550-ef9e-7c99f5f17854\>);
  padding-bottom: var(--size--size-xxl\<deleted\|variable-25224336-488e-d550-ef9e-7c99f5f17854\>);
}

.padding-3xl {
  padding-top: 10rem;
  padding-bottom: 10rem;
}

.no-padding {
  padding-top: 0;
  padding-bottom: 0;
}

.margin-2xs {
  margin-bottom: var(--main--size--size-2xs);
}

.margin-xs {
  margin-bottom: var(--main--size--size-xs);
}

.margin-s {
  margin-bottom: var(--main--size--size-s);
}

.margin-m {
  margin-bottom: var(--main--size--size-m);
}

.margin-xl {
  margin-bottom: var(--main--size--size-xl);
}

.margin-2xl {
  margin-bottom: var(--main--size--size-2xl);
}

.margin-3xl {
  margin-bottom: var(--main--size--size-3xl);
}

.button {
  padding: var(--main--size--size-s) var(--main--size--size-l);
  background-color: var(--green);
  color: var(--neutral);
  border-radius: 100px;
  justify-content: center;
  align-items: center;
  transition: background-color .2s, color .2s;
  display: flex;
}

.button:hover {
  background-color: var(--green);
  color: var(--neutral);
}

.button:active {
  background-color: var(--blue-300\<deleted\|variable-c86ae2a3\>);
}

.button.full-width {
  width: 100%;
}

.button-small {
  background-color: var(--blue-100);
  text-align: center;
  border-radius: 100px;
  min-width: 80px;
  padding: .75rem 1.5rem;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1em;
  transition: background-color .2s, color .2s;
  display: block;
}

.button-small:hover {
  background-color: var(--blue-200);
  color: var(--neutral);
}

.button-small:active {
  background-color: var(--blue-300\<deleted\|variable-c86ae2a3\>);
}

.button-small.w--current {
  background-color: var(--color-100\<deleted\|variable-5dd580e5\>);
  color: var(--blue-100);
}

.button-variant {
  padding: var(--main--size--size-s) var(--main--size--size-l);
  border: 1px solid var(--dark);
  background-color: var(--neutral);
  color: var(--dark);
  text-align: center;
  border-radius: 100px;
  justify-content: center;
  align-items: center;
  transition: background-color .2s, color .2s;
  display: flex;
}

.button-variant:hover {
  color: var(--dark);
}

.button-variant-small {
  border: 1px solid var(--color-300\<deleted\|variable-8635f960\>);
  background-color: var(--neutral);
  min-width: 80px;
  color: var(--color-300\<deleted\|variable-8635f960\>);
  text-align: center;
  border-radius: 100px;
  padding: .75rem 1.5rem;
  font-size: 16px;
  font-weight: 500;
  line-height: 1em;
  transition: background-color .2s, color .2s;
}

.button-variant-small:hover {
  background-color: var(--color-300\<deleted\|variable-8635f960\>);
  color: var(--neutral);
}

.slider-button-left {
  background-color: var(--blue-100);
  color: #7e3d5d;
  text-align: center;
  background-image: url('../images/Arrow-Icon_1.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 20px 20px;
  border-radius: 100px;
  width: 3.75rem;
  height: 3.75rem;
  padding: .75rem;
  font-size: 0;
  font-weight: 400;
  line-height: 1em;
  transition: background-position .15s cubic-bezier(.47, 0, .745, .715), background-color .2s, color .2s;
}

.slider-button-left:hover {
  background-color: var(--blue-200);
  color: var(--neutral);
  background-position: 40%;
}

.slider-button-left:active {
  background-color: var(--blue-300\<deleted\|variable-c86ae2a3\>);
}

.slider-button-right {
  background-color: var(--blue-100);
  color: #7e3d5d;
  text-align: center;
  background-image: url('../images/Arrow-Icon-1.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 20px 20px;
  border-radius: 100px;
  width: 3.75rem;
  height: 3.75rem;
  padding: .75rem;
  font-size: 0;
  font-weight: 400;
  line-height: 1em;
  transition: background-position .15s cubic-bezier(.47, 0, .745, .715), background-color .2s, color .2s;
}

.slider-button-right:hover {
  background-color: var(--blue-200);
  color: var(--neutral);
  background-position: 60%;
}

.slider-button-right:active {
  background-color: var(--blue-300\<deleted\|variable-c86ae2a3\>);
}

.button-link {
  color: var(--blue-100);
  background-image: url('../images/Arrow-Icon.svg');
  background-position: 100%;
  background-repeat: no-repeat;
  background-size: 16px 14px;
  padding-top: .25rem;
  padding-bottom: .25rem;
  padding-right: 1.25rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1em;
  transition: opacity .2s, padding .15s cubic-bezier(.47, 0, .745, .715), color .2s;
}

.button-link:hover {
  opacity: .8;
  color: var(--blue-100);
  padding-right: 2rem;
}

.input {
  border: 1px solid var(--neutral-300);
  background-color: var(--neutral-100);
  width: 100%;
  min-height: 50px;
  color: var(--blue-300\<deleted\|variable-c86ae2a3\>);
  background-image: linear-gradient(#fcfcfc00, #fff0);
  border-radius: 8px;
  margin-bottom: 16px;
  padding: 16px;
  font-size: 16px;
  line-height: 1em;
  transition: padding .2s, border-width .2s, border-radius .2s, color .2s, background-color .2s, border-color .2s;
}

.input:hover {
  border-color: var(--neutral-300);
  background-color: var(--neutral-200);
  color: var(--neutral-500);
}

.input:focus {
  color: var(--blue-300\<deleted\|variable-c86ae2a3\>);
  border-width: 1px;
  border-color: #657cff;
}

.input::placeholder {
  color: var(--neutral-400);
}

.input.select-input {
  cursor: pointer;
  background-image: url('../images/Input-Dropdown.svg'), linear-gradient(#fcfcfc00, #fff0);
  background-position: 95%, 0 0;
  background-repeat: no-repeat, repeat;
  background-size: 16px, auto;
  align-items: center;
  padding-top: 8px;
  padding-bottom: 8px;
  display: flex;
}

.input.select-input:focus {
  line-height: 1em;
}

.input.text-area {
  min-height: 150px;
}

.input-label {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.2em;
}

.checkbox-field {
  color: var(--neutral-500);
  cursor: pointer;
  align-items: center;
  padding-left: 24px;
  font-size: 16px;
  line-height: 1em;
  display: flex;
}

.checkbox-field:hover {
  color: var(--blue-300\<deleted\|variable-c86ae2a3\>);
}

.checkbox {
  border-width: 2px;
  border-color: var(--color-300\<deleted\|variable-8635f960\>);
  border-radius: 4px;
  width: 18px;
  height: 18px;
  margin-top: 0;
  margin-left: -24px;
}

.checkbox:hover {
  box-shadow: 1px 1px #fff0;
}

.checkbox.w--redirected-checked {
  background-color: #dee3ff;
  background-image: url('../images/Check.svg');
  background-size: 10px;
  border-color: #657cff;
}

.checkbox.w--redirected-focus {
  box-shadow: none;
}

.checkbox-label {
  margin-left: 8px;
}

.radio-field {
  color: var(--neutral-500);
  cursor: pointer;
  align-items: center;
  padding-left: 24px;
  font-size: 16px;
  line-height: 1em;
  display: flex;
}

.radio-field:hover {
  color: var(--blue-300\<deleted\|variable-c86ae2a3\>);
}

.radio-button {
  border-width: 2px;
  border-color: var(--color-300\<deleted\|variable-8635f960\>);
  background-color: var(--neutral);
  background-image: linear-gradient(to bottom, var(--neutral), var(--neutral));
  width: 18px;
  height: 18px;
  margin-top: 0;
  margin-left: -24px;
  box-shadow: 1px 1px #fff0;
}

.radio-button.w--redirected-checked {
  background-color: var(--neutral);
  border: 4px solid #657cff;
}

.radio-button.w--redirected-focus {
  background-color: #dee3ff;
  border-color: #657cff;
  box-shadow: 1px 1px 3px #fff0;
}

.radio-button-label {
  margin-left: 8px;
}

.kickoff-block {
  border: 1px solid var(--neutral-300);
  background-color: var(--neutral-100);
  text-align: center;
  border-radius: 8px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  min-width: 80px;
  height: 80px;
  display: flex;
}

.flex-center {
  flex-direction: column;
  align-items: center;
  display: flex;
}

.flex-left {
  flex-direction: column;
  align-items: flex-start;
  display: flex;
}

.flex-right {
  flex-direction: column;
  align-items: flex-end;
  display: flex;
}

.button-wrapper {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: auto auto;
  grid-auto-columns: 1fr;
  display: grid;
}

.component-swiper {
  z-index: 1;
  justify-content: flex-start;
  display: flex;
  overflow: hidden;
}

.swiper-wrapper {
  flex: none;
  display: flex;
}

.component-wrapper {
  z-index: 1;
}

.footer-heart {
  object-fit: contain;
  width: 1rem;
  height: 1rem;
  margin-left: 4px;
  margin-right: 4px;
  display: block;
}

.margin-top-m {
  margin-top: 32px;
}

.margin-left-s {
  margin-left: 20px;
}

.margin-left-m {
  margin-left: 32px;
}

.footer-section {
  padding-top: var(--main--size--size-3xl);
  padding-bottom: var(--main--size--size-l);
  background-color: var(--llight-darker);
  border-top: 1px solid #1c34331c;
  flex-direction: column;
  align-items: center;
  display: flex;
}

.nav-container {
  width: 100%;
  max-width: var(--container--main-size);
  padding-right: var(--container--padding);
  padding-left: var(--container--padding);
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.navigation {
  z-index: 999;
  border-bottom: 1px solid var(--llight-darker);
  background-color: var(--light);
  flex-direction: column;
  align-items: center;
  padding-top: .5rem;
  padding-bottom: .5rem;
  display: flex;
  position: sticky;
  top: 0;
}

.nav-logo {
  object-fit: contain;
  width: 5rem;
  height: 3.5rem;
  display: block;
}

.nav-brand {
  padding-left: 0;
  transition: opacity .2s, color .2s;
}

.nav-brand:hover {
  opacity: .8;
}

.utility-page-wrap {
  justify-content: center;
  align-items: center;
  width: 100vw;
  max-width: 100%;
  min-height: 100vh;
  padding-top: 128px;
  padding-bottom: 128px;
  display: flex;
}

.utility-page-content {
  text-align: center;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: 560px;
  display: flex;
}

.utility-page-form {
  flex-direction: column;
  align-items: stretch;
  width: 100%;
  display: flex;
}

.flex-stretch {
  flex-direction: column;
  align-items: stretch;
  display: flex;
}

.flex-space-between {
  justify-content: space-between;
  display: flex;
}

.flex-space-around {
  justify-content: space-around;
  display: flex;
}

.footer-brand {
  padding-left: 0;
}

.footer-logo {
  object-fit: contain;
  width: 10rem;
  height: 6.25rem;
  display: block;
}

.collection-empty {
  background-color: var(--color-100\<deleted\|variable-5dd580e5\>);
  text-align: center;
  border-radius: 8px;
}

.nav-link {
  border-bottom: 1px solid #0000;
  padding: .75rem 0;
  font-size: 1rem;
}

.nav-link:hover {
  color: var(--blue-100);
}

.nav-link.w--current {
  border-bottom: 1px solid var(--green);
  color: var(--green);
}

.nav-menu {
  align-items: center;
}

.nav-menu-mask {
  grid-column-gap: 1.5rem;
  grid-row-gap: 1.5rem;
  align-items: center;
  display: flex;
}

.footer-link {
  color: var(--dark);
  margin-bottom: 8px;
  text-decoration: none;
  transition: opacity .2s;
}

.footer-copyright {
  color: var(--neutral-500);
}

.overflow-hidden {
  overflow: hidden;
}

.footer-made-with {
  margin-top: var(--main--size--size-l);
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  align-items: center;
  display: flex;
}

.relative {
  position: relative;
}

.z-99 {
  z-index: 99;
  position: relative;
}

.body-rich-text h1 {
  margin-bottom: 1.5rem;
}

.body-rich-text h2, .body-rich-text h3 {
  margin-bottom: 1.25rem;
}

.body-rich-text h4 {
  margin-bottom: 1rem;
}

.body-rich-text p, .body-rich-text blockquote, .body-rich-text figure {
  margin-bottom: 1.5rem;
}

.body-rich-text figcaption {
  margin-top: .5rem;
}

.body-rich-text ul, .body-rich-text ol {
  margin-bottom: 1.5rem;
}

.style-guide-color-cards {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  border-radius: 7px;
  grid-template-rows: auto;
  grid-template-columns: 1fr;
  grid-auto-columns: 1fr;
  width: 100%;
  height: 166px;
  margin-bottom: .75rem;
  display: grid;
  overflow: hidden;
}

.style-guide-intro {
  background-image: radial-gradient(circle at 10% 20%, #642b73, #040004);
  border-radius: .75rem;
  justify-content: space-between;
  align-items: center;
  padding: 2rem 2.5rem;
  display: flex;
}

.style-guide-line {
  background-color: var(--neutral-200);
  width: 100%;
  height: 1px;
  margin-bottom: 4rem;
}

.h1-style {
  font-family: var(--main--main-font);
  font-size: var(--heading--heading-h1);
  line-height: var(--main--line-height-s);
}

.h2-style {
  font-family: var(--main--main-font);
  font-size: var(--heading--heading-h2);
  line-height: var(--main--line-height-s);
}

.h3-style {
  font-family: var(--main--main-font);
  font-size: var(--heading--heading-h3);
  line-height: var(--main--line-height-s);
}

.h4-style {
  font-family: var(--main--main-font);
  font-size: var(--heading--heading-h4);
  line-height: var(--main--line-height-m);
}

.h5-style {
  font-family: var(--main--main-font);
  font-size: var(--heading--heading-h5);
  line-height: var(--main--line-height-m);
}

.footer-heading {
  margin-bottom: 1rem;
  font-weight: 400;
}

.h6-style {
  font-family: var(--main--main-font);
  font-size: var(--heading--heading-h6);
  line-height: var(--heading--heading-h5);
}

.text-yellow {
  color: var(--yellow);
}

.text-green {
  color: var(--green);
}

.bg-blue-200 {
  background-color: var(--color-200\<deleted\|variable-c5c9bbdd\>);
}

.bg-blue-100 {
  background-color: var(--color-100\<deleted\|variable-5dd580e5\>);
}

.flow-palls-logo {
  width: 12rem;
  height: 4rem;
}

.bono-test {
  display: flex;
}

.space-3rem {
  height: 3rem;
}

.hero-image-wrap {
  color: #000;
  overflow: hidden;
}

.hero-image {
  object-fit: cover;
  object-position: 50% 50%;
  width: 25vw;
  min-width: 25rem;
  max-width: 31rem;
  height: 31vw;
  min-height: 32rem;
  max-height: 40rem;
}

.hero-image.mobile-only {
  display: none;
}

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

.bg-light-darker {
  background-color: var(--llight-darker);
}

.bg-dark {
  background-color: var(--dark);
}

.preheading {
  font-size: var(--heading--heading-h6);
  line-height: var(--main--line-height-xs);
  font-style: italic;
  font-weight: 300;
}

.hero-column {
  grid-column-gap: var(--main--size--size-m);
  grid-row-gap: var(--main--size--size-m);
  flex-flow: column;
  justify-content: center;
  display: flex;
}

.hero-paragraph {
  margin-bottom: var(--main--size--size-l);
  font-size: var(--heading--heading-h6);
}

.hero-button-wrap {
  grid-column-gap: var(--main--size--size-m);
  grid-row-gap: var(--main--size--size-m);
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.world-map-wrapper {
  aspect-ratio: 2;
}

.stats-wrapper {
  grid-column-gap: var(--main--size--size-m);
  grid-row-gap: var(--main--size--size-m);
  flex-flow: column;
  display: flex;
}

.stats-text-big {
  font-size: var(--heading--heading-h3);
  line-height: var(--main--line-height-s);
  font-weight: 500;
}

.stats-wrap {
  margin-bottom: var(--main--size--size-m);
  grid-column-gap: var(--main--size--size-xl);
  grid-row-gap: var(--main--size--size-xl);
  display: flex;
}

.margin-3xs {
  margin-bottom: var(--main--size--size-3xs);
}

.margin-4xl {
  margin-bottom: var(--main--size--size-4xl);
}

.padding-3xs {
  padding-top: var(--main--size--size-3xs);
  padding-bottom: var(--main--size--size-3xs);
}

.splide__list.testimonial-splide {
  display: flex;
}

.splide__slide.testimonial-splide {
  width: 30rem;
  padding: var(--main--size--size-l);
  grid-column-gap: var(--main--size--size-m);
  grid-row-gap: var(--main--size--size-m);
  border-radius: var(--main--size--size-m);
  background-color: var(--neutral);
  flex-flow: column;
  flex: none;
  display: flex;
}

.text-m {
  font-size: var(--main--text-m);
  line-height: var(--main--line-height-m);
}

.text-s {
  font-size: var(--main--text-s);
}

.text-s.margin-top-auto {
  margin-top: auto;
}

.benefits-card {
  height: 17.5rem;
  padding: var(--main--size--size-m);
  grid-column-gap: var(--main--size--size-m);
  grid-row-gap: var(--main--size--size-m);
  background-color: var(--neutral);
  border-radius: 1rem;
  flex-flow: column;
  display: flex;
  box-shadow: 0 8px 20px #0000000d;
}

.benefits-card.main-card {
  background-color: var(--green);
  color: var(--neutral);
  transform: rotate(-4deg);
  box-shadow: 0 4px 20px #1c34331a;
}

.benefits-card-heading-wrap {
  grid-column-gap: var(--main--size--size-s);
  grid-row-gap: var(--main--size--size-s);
  font-size: var(--main--text-l);
  justify-content: flex-start;
  align-items: center;
  font-weight: 500;
  display: flex;
}

.benefits-card-image {
  width: var(--main--size--size-l);
  height: var(--main--size--size-l);
  padding: var(--main--size--size-2xs);
  background-color: var(--green);
  border-radius: .525rem;
}

.font-weight-500 {
  font-weight: 500;
}

.font-weight-500.margin-top-auto {
  margin-top: auto;
}

.about-image-wrapper {
  border-radius: 1.5rem;
  height: 30rem;
  position: relative;
  overflow: hidden;
}

.list-wrapper {
  margin-bottom: var(--main--size--size-xl);
  grid-column-gap: var(--main--size--size-m);
  grid-row-gap: var(--main--size--size-m);
  flex-flow: column;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.list-wrap {
  padding: var(--main--size--size-s);
  grid-column-gap: var(--main--size--size-xs);
  grid-row-gap: var(--main--size--size-xs);
  background-color: var(--neutral);
  font-size: var(--main--text-s);
  text-align: left;
  border-radius: 1.5rem;
  flex-flow: row;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.about-me-art-image {
  width: 15rem;
  position: absolute;
  inset: 1% auto auto -1%;
  transform: rotate(90deg);
}

.text-l {
  font-size: var(--main--text-l);
}

.language-cards {
  height: 40rem;
  padding: var(--main--size--size-l);
  grid-column-gap: var(--main--size--size-m);
  grid-row-gap: var(--main--size--size-m);
  border-radius: var(--main--size--size-m);
  background-color: var(--light);
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.language-cards.english {
  background-image: url('../images/England-1.svg');
  background-position: 50% 100%;
  background-repeat: no-repeat;
  background-size: 120%;
}

.language-cards.spanish {
  background-image: url('../images/Spain-new.svg');
  background-position: 50% 100%;
  background-repeat: no-repeat;
  background-size: 100%;
}

.cta-wrapper {
  padding: var(--main--size--size-2xl);
  grid-column-gap: var(--main--size--size-l);
  grid-row-gap: var(--main--size--size-l);
  border-radius: var(--main--size--size-m);
  background-color: var(--green);
  color: var(--neutral);
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
  position: relative;
}

.cta-wrapper.contact {
  justify-content: center;
  align-items: flex-start;
  min-height: 24rem;
}

.cta-image {
  width: 31vw;
  max-width: 28rem;
  position: absolute;
  bottom: 0;
  left: auto;
  right: 5%;
}

.certificate-image-wrap {
  height: 6rem;
}

.certificate-image-wrap.teyl {
  width: 11rem;
}

.display-none {
  display: none;
}

.certificate-section-image-wrap {
  aspect-ratio: 1;
  border-radius: var(--main--size--size-m);
  overflow: hidden;
}

.certificate-image-wrapper {
  margin-bottom: var(--main--size--size-xl);
  display: flex;
}

.footer-line {
  background-color: #1c34331c;
  width: 100%;
  height: 1px;
}

.footer-contact-link {
  grid-column-gap: var(--main--size--size-s);
  grid-row-gap: var(--main--size--size-s);
  color: var(--dark);
  justify-content: flex-start;
  align-items: center;
  text-decoration: none;
  display: flex;
}

.footer-logo-icons-wrap {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  margin-top: auto;
  display: flex;
}

.footer-logo-icon {
  color: #4b4477;
  width: 1.25rem;
  height: 1.25rem;
}

.footer-logo-icon-wrap {
  background-color: var(--green);
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 2rem;
  height: 2rem;
  display: flex;
}

.about-us-hero-image-big {
  border-radius: 1.5rem;
  overflow: hidden;
}

.contain-image {
  object-fit: contain;
}

.about-us-hero-stats-wrapper {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  flex-flow: column;
  display: flex;
}

.about-us-hero-image-small {
  aspect-ratio: 2;
  background-color: var(--green);
  border-radius: 1.5rem;
  height: 50%;
  overflow: hidden;
}

.about-us-hero-stats-wrap {
  height: 50%;
  padding: var(--main--size--size-l);
  grid-column-gap: 2rem;
  grid-row-gap: 2rem;
  background-color: var(--neutral);
  color: var(--dark);
  border-radius: 1.5rem;
  justify-content: center;
  align-items: center;
  display: flex;
  box-shadow: 0 8px 20px #0000000d;
}

.about-us-hero-stats-column {
  grid-column-gap: var(--main--size--size-2xs);
  grid-row-gap: var(--main--size--size-2xs);
  text-align: center;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.about-us-stats-bar {
  height: 16rem;
  padding: var(--main--size--size-xl);
  grid-column-gap: var(--main--size--size-xl);
  grid-row-gap: var(--main--size--size-xl);
  background-color: var(--green);
  color: var(--neutral);
  background-image: url('../images/janalanguagestudio-abstract-hero.svg');
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: auto;
  border-radius: 1.5rem;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.section-stats-wrap {
  grid-column-gap: var(--main--size--size-s);
  grid-row-gap: var(--main--size--size-s);
  text-align: center;
  flex-flow: column;
  display: flex;
}

.max-width-600 {
  max-width: 37.5rem;
}

.text-xxs {
  font-size: var(--main--text-xxs);
}

.text-xs {
  font-size: var(--main--text-xs);
}

.about-world-map-wrapper {
  aspect-ratio: 2;
  justify-content: center;
  align-items: center;
  width: 85%;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  position: relative;
}

.about-world-map {
  opacity: .6;
  object-fit: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0%;
}

.about-us-world-map-text-wrap {
  z-index: 2;
  color: var(--neutral);
  text-align: center;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
  position: relative;
}

.faq-wrap {
  width: 100%;
  padding-right: var(--main--size--size-m);
  padding-left: var(--main--size--size-m);
  background-color: var(--neutral);
  color: #08111f;
  border-radius: 1.5rem;
}

.faq-question {
  padding-top: var(--main--size--size-m);
  padding-bottom: var(--main--size--size-m);
  grid-column-gap: var(--main--size--size-s);
  grid-row-gap: var(--main--size--size-s);
  cursor: pointer;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.faq-q-text {
  font-size: var(--main--text-m);
  font-weight: 500;
  line-height: 1.4em;
}

.faq-plus-wrap {
  border: 2px solid #000;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 24px;
  min-width: 24px;
  height: 24px;
  min-height: 24px;
  padding: 0;
  display: flex;
  position: relative;
}

.faq-plus-l {
  background-color: #08111f;
  border-radius: 3px;
  width: 2.5px;
  height: 80%;
  position: absolute;
}

.faq-plus {
  background-color: #08111f;
  border-radius: 3px;
  width: 80%;
  height: 2.5px;
}

.faq-answer {
  overflow: hidden;
}

.faq-answer-text {
  margin-bottom: var(--main--size--size-m);
  color: #08111f;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5em;
}

.faq-wrapper {
  grid-column-gap: var(--main--size--size-m);
  grid-row-gap: var(--main--size--size-m);
  flex-flow: column;
  display: flex;
}

.faq-arrow {
  width: 1.5rem;
  height: 1.5rem;
}

.contants-tabs-wrapper {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  display: flex;
}

.contants-tabs-menu {
  min-width: 43.75rem;
  margin-bottom: var(--main--size--size-3xl);
  border: 2px solid var(--green);
  border-radius: 1.75rem;
  flex-flow: row;
  justify-content: center;
  display: flex;
  overflow: hidden;
}

.contants-tabs-content {
  width: 100%;
}

.contants-tabs-link {
  width: 100%;
  padding: var(--main--size--size-s) var(--main--size--size-m);
  grid-column-gap: var(--main--size--size-s);
  grid-row-gap: var(--main--size--size-s);
  color: var(--dark);
  background-color: #0000;
  border-radius: 1.5rem;
  justify-content: center;
  align-items: center;
  transition-duration: .2s, .3s;
  display: flex;
  position: static;
}

.contants-tabs-link.w--current {
  box-sizing: border-box;
  color: var(--neutral);
  background-color: #0000;
}

.contants-tabs-link-bg {
  background-color: var(--green);
  border-radius: 1.5rem;
  width: 33.333%;
  position: absolute;
  inset: 0%;
}

.contants-tabs-link-icon, .contants-tabs-link-text {
  z-index: 1;
  position: relative;
}

.contact-form-wrapper {
  width: 100%;
  padding: var(--main--size--size-m);
  background-color: var(--llight-darker);
  border: 1px solid #a784634d;
  border-radius: 1.5rem;
  flex-flow: column;
  justify-content: center;
  align-items: flex-start;
  margin-bottom: 0;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  box-shadow: 0 2px 5px #0003;
}

.contact-column {
  padding: var(--main--size--size-m);
  grid-column-gap: var(--main--size--size-m);
  grid-row-gap: var(--main--size--size-m);
  background-color: var(--llight-darker);
  border: 1px solid #a784634d;
  border-radius: 1.5rem;
  flex-flow: column;
  display: flex;
  box-shadow: 0 2px 5px #0000001a;
}

.contact-wrap {
  grid-column-gap: var(--main--size--size-s);
  grid-row-gap: var(--main--size--size-s);
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.contact-icon {
  background-color: var(--yellow);
  width: 2rem;
  height: 2rem;
  color: var(--neutral);
  border-radius: .625rem;
  flex: none;
  justify-content: center;
  align-items: center;
  display: flex;
  overflow: hidden;
}

.contact-link {
  color: var(--green);
  font-size: var(--main--text-s);
  text-decoration: none;
}

.contact-form {
  grid-column-gap: var(--main--size--size-s);
  grid-row-gap: var(--main--size--size-s);
  flex-flow: column;
  width: 100%;
  display: flex;
}

/* Keep images responsive now that width/height attributes are set for CLS;
   class-based CSS sizes still win over this element-level rule. */
img {
  height: auto;
}

.form-privacy-note {
  color: #00000080;
  font-size: var(--main--text-xxs);
  text-align: center;
}

.form-privacy-note a {
  color: inherit;
  text-decoration: underline;
}

.contact-form-field-wrap {
  grid-column-gap: var(--main--size--size-2xs);
  grid-row-gap: var(--main--size--size-2xs);
  flex-flow: column;
  width: 100%;
  display: flex;
}

.contact-form-field {
  height: 3rem;
  padding: var(--main--size--size-xs) var(--main--size--size-s);
  border: 1px solid var(--neutral-300);
  background-color: var(--neutral);
  color: var(--dark);
  border-radius: .75rem;
  margin-bottom: 0;
}

.contact-form-field:focus-visible, .contact-form-field[data-wf-focus-visible] {
  border-color: var(--yellow);
}

.contact-form-field::placeholder {
  color: var(--dark);
}

.contact-form-field.message {
  height: 10rem;
  min-height: 10rem;
  max-height: 18rem;
  resize: vertical;
  line-height: 1.4;
}

.contact-form-field-wrapper {
  grid-column-gap: var(--main--size--size-m);
  grid-row-gap: var(--main--size--size-m);
  justify-content: space-between;
  align-items: stretch;
  display: flex;
}

.contact-social-icons {
  background-color: var(--yellow);
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 2rem;
  height: 2rem;
  display: flex;
}

.success-message {
  padding: var(--main--size--size-m);
  background-color: var(--neutral);
  border-radius: 1.5rem;
  margin-top: auto;
  margin-bottom: auto;
}

.success-message-wrap {
  grid-column-gap: var(--main--size--size-m);
  grid-row-gap: var(--main--size--size-m);
  flex-flow: row;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.success-image-wrap {
  border-radius: 50%;
  flex: none;
  width: 10rem;
  height: 10rem;
  overflow: hidden;
}

.nav-social-link-wrap {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  margin-top: auto;
  display: flex;
}

.nav-menu-link-wrap {
  grid-column-gap: var(--main--size--size-l);
  grid-row-gap: var(--main--size--size-l);
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.nav-menu-contact-info-wrap {
  display: none;
}

.list-icon-wrap {
  background-color: var(--green);
  width: 2.5rem;
  height: 2.5rem;
  color: var(--light);
  border-radius: .75rem;
  flex: none;
  justify-content: center;
  align-items: center;
  display: flex;
}

.list-icon {
  width: 1.5rem;
  height: 1.5rem;
}

.benefits-card-image-copy {
  width: var(--main--size--size-l);
  height: var(--main--size--size-l);
  padding: var(--main--size--size-2xs);
  background-color: var(--light);
  border-radius: .5rem;
}

.courses-bar-line-wrapper {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: space-between;
  place-items: center;
  display: flex;
}

.english-course-hero-image {
  width: 100%;
  position: absolute;
  inset: auto 0% -15%;
}

.english-course-hero-image-clock {
  height: 10rem;
  position: absolute;
  inset: auto auto 0% 0%;
}

.english-course-hero-image-bus {
  width: 10rem;
  position: absolute;
  inset: -10% auto auto 0%;
}

@media screen and (min-width: 1440px) {
  .faq-question {
    grid-column-gap: 1rem;
    grid-row-gap: 1rem;
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
}

@media screen and (min-width: 1920px) {
  .faq-q-text {
    font-size: 25px;
  }

  .faq-answer-text {
    font-size: 20px;
  }
}

@media screen and (max-width: 991px) {
  body {
    --main--second-font: Ibmplexsans, Arial, sans-serif;
    --dark: #000;
    --main--main-text: 1rem;
    --main--line-height-m: 1.3em;
    --main--main-font: Ibmplexserif, Arial, sans-serif;
    --heading--heading-h1: 3.5rem;
    --main--line-height-s: 1.1em;
    --heading--heading-h2: 2.75rem;
    --heading--heading-h3: 2.25rem;
    --heading--heading-h4: 1.75rem;
    --heading--heading-h5: 1.25rem;
    --heading--heading-h6: 1.125rem;
    --neutral-600: #2f2f2f;
    --main--line-height-l: 1.5em;
    --color-300\<deleted\|variable-8635f960\>: #4b4477;
    --blue-300\<deleted\|variable-c86ae2a3\>: #000;
    --heading--quote\<deleted\|variable-a72928f2-c6e4-38ad-0986-2c3c1f97705d\>: 3rem;
    --heading--quote-tablet-mobile\<deleted\|variable-3b7dbd79-c886-00a8-f038-6a5e68d92966\>: 2rem;
    --main--size--size-4xl: 5rem;
    --light: #f4f1eb;
    --green: #1c3433;
    --main--size--size-2xs: .5rem;
    --llight-darker: #efeadf;
    --container--main-size: 80rem;
    --container--padding: 1.5rem;
    --main--size--size-m: 1.25rem;
    --main--size--size-xl: 2rem;
    --main--size--size-l: 1.75rem;
    --blue-100: #29225f;
    --heading--heading-jumbo-xl\<deleted\|variable-4a84b770-cee3-d253-17d0-b4b28dbebdb8\>: 5rem;
    --heading--heading-jumbo-l\<deleted\|variable-12524850-8c95-cbd9-a70d-dfe678e3b047\>: 4rem;
    --yellow: #a78463;
    --main--size--size-xs: .75rem;
    --main--size--size-s: 1rem;
    --main--size--size-2xl: 3rem;
    --main--size--size-3xl: 4rem;
    --blue-200: #221c52;
    --color-100\<deleted\|variable-5dd580e5\>: #6bc1ec;
    --color-200\<deleted\|variable-c5c9bbdd\>: #e2e2ea;
    --main--line-height-xs: 1.05em;
    --main--size--no-size: 0px;
    --main--size--size-3xs: .25rem;
    --main--text-m: 1.25rem;
    --main--text-s: 1.125rem;
    --main--text-l: 1.5rem;
    --main--text-xxs: .875rem;
    --main--text-xs: 1rem;
  }

  blockquote {
    font-size: var(--heading--quote-tablet-mobile\<deleted\|variable-3b7dbd79-c886-00a8-f038-6a5e68d92966\>);
  }

  .container.grid, .container.benefits-grid {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  }

  .style-guide-classes-wrap {
    width: 100%;
  }

  .column.contact-footer-column {
    min-width: auto;
    padding: var(--main--size--size-m);
  }

  .jumbo-h {
    font-size: var(--heading--heading-jumbo-xl\<deleted\|variable-4a84b770-cee3-d253-17d0-b4b28dbebdb8\>);
  }

  .style-guide-styles-wrap {
    grid-template-columns: 1fr 1fr;
  }

  .padding-m {
    padding-top: var(--size--size-m-tablet\<deleted\|variable-12f63bca-dea1-7a4d-2af2-90085f028c1b\>);
    padding-bottom: var(--size--size-m-tablet\<deleted\|variable-12f63bca-dea1-7a4d-2af2-90085f028c1b\>);
  }

  .padding-l {
    padding-top: var(--size--size-l-tablet\<deleted\|variable-a9b0cf0d-c55d-4a0d-3b36-1de3638c6393\>);
    padding-bottom: var(--size--size-l-tablet\<deleted\|variable-a9b0cf0d-c55d-4a0d-3b36-1de3638c6393\>);
  }

  .padding-xl {
    padding-top: var(--size--size-xl-tablet\<deleted\|variable-3472737a-a00f-333f-a4b5-887f3fcffac1\>);
    padding-bottom: var(--size--size-xl-tablet\<deleted\|variable-3472737a-a00f-333f-a4b5-887f3fcffac1\>);
  }

  .padding-xxl {
    padding-top: var(--size--size-xxl-tablet\<deleted\|variable-b46b6bb3-e633-d487-f262-2c2b2d399726\>);
    padding-bottom: var(--size--size-xxl-tablet\<deleted\|variable-b46b6bb3-e633-d487-f262-2c2b2d399726\>);
  }

  .padding-3xl {
    padding-top: 96px;
    padding-bottom: 96px;
  }

  .margin-top-m {
    margin-top: 28px;
  }

  .margin-left-s {
    margin-left: 16px;
  }

  .margin-left-m {
    margin-left: 28px;
  }

  .nav-brand {
    z-index: 99;
    position: relative;
  }

  .nav-link {
    color: var(--dark);
    font-size: var(--heading--heading-h6);
    text-align: center;
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
  }

  .nav-menu {
    height: 100vh;
    padding-top: 6rem;
    padding-right: var(--container--padding);
    padding-left: var(--container--padding);
    background-color: var(--llight-darker);
    flex-direction: column;
    align-items: stretch;
    display: flex;
    position: fixed;
    top: 0;
    overflow: auto;
  }

  .nav-menu-button {
    z-index: 99;
    background-color: var(--green);
    border-radius: 8px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    padding: 0;
    position: relative;
  }

  .nav-menu-button.w--open {
    background-color: var(--green);
  }

  .nav-lines {
    background-color: var(--neutral);
    border-radius: 4px;
    width: 16px;
    height: 2px;
    margin-top: 2px;
    margin-bottom: 2px;
    padding-bottom: 0;
    padding-right: 0;
  }

  .nav-menu-button-wrap {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    display: flex;
  }

  .nav-menu-mask {
    flex-direction: column;
    flex: none;
    justify-content: space-between;
    align-items: flex-start;
    height: 100%;
    padding-bottom: 8rem;
    position: relative;
  }

  .hero-image {
    width: 46vw;
    height: 60vw;
  }

  .hero-button-wrap {
    flex-flow: column;
    align-items: stretch;
  }

  .benefits-card-heading-wrap {
    font-size: var(--main--text-m);
  }

  .about-image-wrapper {
    height: 30rem;
  }

  .list-wrapper {
    grid-column-gap: var(--main--size--size-s);
    grid-row-gap: var(--main--size--size-s);
  }

  .list-wrap {
    padding: var(--main--size--size-xs);
  }

  .max-width-600 {
    max-width: none;
  }

  .nav-social-link-wrap {
    justify-content: space-between;
    align-items: stretch;
  }

  .nav-menu-link-wrap {
    grid-column-gap: var(--main--size--size-m);
    grid-row-gap: var(--main--size--size-m);
    flex-flow: column;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    display: flex;
  }

  .nav-menu-contact-info-wrap {
    padding: var(--main--size--size-l);
    grid-column-gap: var(--main--size--size-m);
    grid-row-gap: var(--main--size--size-m);
    background-color: var(--neutral);
    border-radius: 1.5rem;
    flex-flow: column;
    display: flex;
  }

  .divider {
    background-color: var(--llight-darker);
    width: 100%;
    height: 1px;
  }
}

@media screen and (max-width: 767px) {
  body {
    --main--second-font: Ibmplexsans, Arial, sans-serif;
    --dark: #000;
    --main--main-text: 1rem;
    --main--line-height-m: 1.3em;
    --main--main-font: Ibmplexserif, Arial, sans-serif;
    --heading--heading-h1: 3rem;
    --main--line-height-s: 1.1em;
    --heading--heading-h2: 2.5rem;
    --heading--heading-h3: 2rem;
    --heading--heading-h4: 1.5rem;
    --heading--heading-h5: 1.25rem;
    --heading--heading-h6: 1.125rem;
    --neutral-600: #2f2f2f;
    --main--line-height-l: 1.5em;
    --color-300\<deleted\|variable-8635f960\>: #4b4477;
    --blue-300\<deleted\|variable-c86ae2a3\>: #000;
    --heading--quote\<deleted\|variable-a72928f2-c6e4-38ad-0986-2c3c1f97705d\>: 3rem;
    --heading--quote-tablet-mobile\<deleted\|variable-3b7dbd79-c886-00a8-f038-6a5e68d92966\>: 2rem;
    --main--size--size-4xl: 4rem;
    --light: #f4f1eb;
    --green: #1c3433;
    --main--size--size-2xs: .5rem;
    --llight-darker: #efeadf;
    --container--main-size: 80rem;
    --container--padding: 1rem;
    --main--size--size-m: 1.25rem;
    --main--size--size-xl: 1.75rem;
    --main--size--size-l: 1.5rem;
    --blue-100: #29225f;
    --heading--heading-jumbo-xl\<deleted\|variable-4a84b770-cee3-d253-17d0-b4b28dbebdb8\>: 5rem;
    --heading--heading-jumbo-l\<deleted\|variable-12524850-8c95-cbd9-a70d-dfe678e3b047\>: 4rem;
    --yellow: #a78463;
    --main--size--size-xs: .75rem;
    --main--size--size-s: 1rem;
    --main--size--size-2xl: 2rem;
    --main--size--size-3xl: 3rem;
    --blue-200: #221c52;
    --color-100\<deleted\|variable-5dd580e5\>: #6bc1ec;
    --color-200\<deleted\|variable-c5c9bbdd\>: #e2e2ea;
    --main--line-height-xs: 1.05em;
    --main--size--no-size: 0px;
    --main--size--size-3xs: .25rem;
    --main--text-m: 1.25rem;
    --main--text-s: 1.125rem;
    --main--text-l: 1.5rem;
    --main--text-xxs: .875rem;
    --main--text-xs: 1rem;
  }

  .container.grid {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  }

  .container.benefits-grid {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  }

  .jumbo-h {
    font-size: var(--heading--heading-jumbo-l\<deleted\|variable-12524850-8c95-cbd9-a70d-dfe678e3b047\>);
  }

  .style-guide-styles-wrap {
    grid-column-gap: .75rem;
    grid-row-gap: .75rem;
    grid-template-columns: 1fr;
  }

  .style-guide-color-helper {
    margin-top: 12px;
    margin-bottom: 12px;
  }

  .padding-m {
    padding-top: var(--size--size-m-mobile\<deleted\|variable-4fe38f60-5ac3-3b52-2d2a-f305fdeab43f\>);
    padding-bottom: var(--size--size-m-mobile\<deleted\|variable-4fe38f60-5ac3-3b52-2d2a-f305fdeab43f\>);
  }

  .padding-l {
    padding-top: var(--size--size-l-mobile\<deleted\|variable-cb5d6169-327c-dfe2-21b4-1e46aa7ccd3e\>);
    padding-bottom: var(--size--size-l-mobile\<deleted\|variable-cb5d6169-327c-dfe2-21b4-1e46aa7ccd3e\>);
  }

  .padding-xl {
    padding-top: var(--size--size-xl-mobile\<deleted\|variable-b2a88d7d-2729-fd28-0e1d-118fb47253d8\>);
    padding-bottom: var(--size--size-xl-mobile\<deleted\|variable-b2a88d7d-2729-fd28-0e1d-118fb47253d8\>);
  }

  .padding-xxl {
    padding-top: var(--size--size-xxl-mobile\<deleted\|variable-6469b4c9-c62f-7903-9fdb-f75b788ad92d\>);
    padding-bottom: var(--size--size-xxl-mobile\<deleted\|variable-6469b4c9-c62f-7903-9fdb-f75b788ad92d\>);
  }

  .padding-3xl {
    padding-top: 96px;
    padding-bottom: 96px;
  }

  .button {
    min-width: 140px;
  }

  .button.mobile-full-width {
    width: 100%;
  }

  .button-small {
    padding: 10px 20px;
  }

  .button-variant {
    min-width: 140px;
    padding: 16px 28px;
  }

  .button-variant.mobile-full-width {
    width: 100%;
  }

  .button-variant-small {
    padding: 10px 20px;
  }

  .slider-button-left, .slider-button-right {
    background-size: 16px;
    width: 48px;
    height: 48px;
  }

  .button-wrapper {
    grid-column-gap: 12px;
    grid-row-gap: 12px;
  }

  .margin-top-m {
    margin-top: 20px;
  }

  .margin-left-s {
    margin-left: 12px;
  }

  .margin-left-m {
    margin-left: 20px;
  }

  .footer-section {
    padding-top: 24px;
    padding-bottom: 24px;
  }

  .nav-menu {
    background-color: var(--llight-darker);
  }

  .hero-image {
    display: none;
  }

  .hero-image.mobile-only {
    margin-left: auto;
    margin-right: auto;
    display: block;
  }

  .hero-paragraph {
    margin-bottom: var(--main--size--no-size);
  }

  .hero-button-wrap {
    flex-flow: column;
    justify-content: center;
    align-items: center;
  }

  .benefits-card {
    height: 14rem;
  }

  .benefits-card.main-card {
    background-color: var(--neutral);
    color: var(--dark);
    transform: none;
  }

  .benefits-card-heading-wrap {
    color: var(--dark);
  }

  .cta-image {
    display: none;
  }

  .about-us-stats-bar {
    grid-column-gap: var(--main--size--size-xl);
    grid-row-gap: var(--main--size--size-xl);
    background-image: none;
    background-repeat: repeat;
    background-size: auto;
    grid-template-rows: auto auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    height: auto;
    display: grid;
  }

  .section-stats-wrap {
    font-size: var(--main--text-xxs);
  }

  .faq-q-text {
    font-size: 18px;
  }

  .faq-answer-text {
    font-size: 14px;
  }
}

@media screen and (max-width: 479px) {
  .style-guide-color-helper {
    margin: 4px;
  }

  .button.mobile-full-width, .button-variant.mobile-full-width {
    width: 100%;
  }

  .button-wrapper {
    grid-template-columns: auto;
  }

  .mobile-brake {
    display: inline-block;
  }

  .style-guide-intro {
    flex-direction: column;
  }

  .hero-image.mobile-only {
    width: 100%;
    height: 100%;
    min-width:0px;
    max-width:auto;
    min-height: 0px;
    max-height: auto;
  }

  .hero-button-wrap {
    flex-flow: column;
  }

  .list-wrapper {
    grid-template-rows: auto;
    grid-template-columns: 1fr;
  }

  .about-us-stats-bar {
    height: auto;
    padding-right: var(--main--size--size-s);
    padding-left: var(--main--size--size-s);
    grid-column-gap: var(--main--size--size-s);
    grid-row-gap: var(--main--size--size-s);
    grid-template-rows: auto;
    grid-template-columns: 1fr;
  }

  .section-stats-wrap {
    padding-bottom: var(--main--size--size-s);
    border-bottom: 1px solid #a7846380;
  }

  .section-stats-wrap.last {
    padding-bottom: var(--main--size--no-size);
    border-bottom-style: none;
  }

  .about-world-map-wrapper {
    width: auto;
  }

  .about-world-map {
    display: none;
  }

  .faq-question {
    justify-content: space-between;
    height: 100px;
  }

  .faq-q-text {
    font-size: 18px;
  }

  .faq-plus-wrap {
    justify-content: center;
    align-items: center;
    width: 15px;
    min-width: 15px;
    height: 15px;
    min-height: 15px;
  }

  .faq-plus-l {
    width: 2px;
  }

  .faq-plus {
    height: 2px;
    position: absolute;
  }

  .faq-answer-text {
    font-size: 14px;
  }

  .contact-form {
    grid-column-gap: var(--main--size--size-s);
    grid-row-gap: var(--main--size--size-s);
  }

  .contact-form-field-wrapper {
    grid-column-gap: var(--main--size--size-s);
    grid-row-gap: var(--main--size--size-s);
    flex-flow: column;
  }

  .success-message-wrap {
    flex-flow: column;
  }
}

#w-node-ddddaa08-e8b9-1803-19f7-9f0eac40289f-e9e9a9e2 {
  grid-area: span 1 / span 6 / span 1 / span 6;
}

#w-node-_8ced1578-78c1-6f52-b8d8-cdd3757adf74-e9e9a9e2 {
  grid-area: span 1 / span 6 / span 1 / span 6;
  place-self: center;
}

#w-node-_5a089ca6-6d97-ac8b-5e39-defe0c6f0715-e9e9a9e2, #w-node-e0f067bb-1de6-d03c-3f4c-3ca0d4559a5c-e9e9a9e2, #w-node-_717f7a5b-8ffa-613a-0fd6-a0d0c5910d99-e9e9a9e2, #w-node-cde43485-7500-a7f3-66c7-888eddefcd1d-e9e9a9e2, #w-node-_2eaa17f6-d3ec-f8ef-a375-ee4072990f37-e9e9a9e2, #w-node-ab892bf0-a3f7-838a-1b11-9512526ac65b-e9e9a9e2 {
  grid-area: span 1 / span 4 / span 1 / span 4;
}

#w-node-_07a85bef-ced6-e623-ee3b-8ee0bb5594da-e9e9a9e2 {
  grid-area: span 1 / span 6 / span 1 / span 6;
  place-self: center;
}

#w-node-e1db0ef9-0767-6bb2-8fe7-8efb1a0e8443-e9e9a9e2 {
  grid-area: 1 / 7 / 2 / 13;
  align-self: center;
}

#w-node-_96cb6800-d03a-8c7c-0a37-c236c3261645-e9e9a9e2, #w-node-ba01d183-120a-832e-a3c2-44605553b095-e9e9a9e2 {
  grid-area: span 1 / span 6 / span 1 / span 6;
}

#w-node-_3b23c57e-d633-7e9c-7552-43e825cd4f40-e9e9a9e2 {
  grid-area: span 1 / span 7 / span 1 / span 7;
  align-self: center;
}

#w-node-_1b68b7bd-d865-d7ca-d2b4-de8c63fe544f-e9e9a9e2 {
  grid-area: span 1 / span 5 / span 1 / span 5;
}

#w-node-aad34ede-7fe8-492f-f21e-1255aed37fec-e9e9a9e2 {
  grid-area: span 1 / span 6 / span 1 / span 6;
  align-self: center;
}

#w-node-b68560ab-8b76-b657-e090-100fbcb4ca5a-e9e9a9e2 {
  grid-area: span 1 / span 6 / span 1 / span 6;
}

#w-node-c3562846-8c24-b548-d004-24383a9095fd-e9e9a9e2, #w-node-_9a1aa6b6-59ee-188a-7c9a-df54dceb2626-e9e9a9e2 {
  grid-area: span 1 / span 1 / span 1 / span 1;
  align-self: end;
}

#w-node-_16e83ca1-946c-bc19-ecb6-0f17b2087c78-e9e9a9e2 {
  grid-area: 1 / 8 / 2 / 13;
  place-self: center end;
}

#w-node-_73c87ccf-69c8-d53d-9241-241543a429d2-654d2164 {
  grid-area: span 1 / span 4 / span 1 / span 4;
  justify-self: start;
}

#w-node-_707f7336-7e9e-047e-efb2-5d64ff6f70ce-654d2164 {
  grid-area: span 1 / span 4 / span 1 / span 4;
}

#w-node-_0e91c29f-e400-038a-62c0-dad3ddd29ae2-654d2164 {
  grid-area: span 1 / span 4 / span 1 / span 4;
  justify-self: center;
}

#w-node-d778e02e-c4cb-2a84-d461-0628a0f8616b-654d2164 {
  grid-area: span 1 / span 12 / span 1 / span 12;
}

#w-node-_2a616156-a789-3c89-957b-096767c03146-654d2164 {
  grid-area: span 1 / span 6 / span 1 / span 6;
}

#w-node-_0f2189c3-cd67-8bae-1b70-bf24a1e4cd11-654d2164 {
  grid-area: span 1 / span 6 / span 1 / span 6;
  place-self: end;
}

#Project-Set-Up.w-node-_1dbed699-b8f8-5e1e-f904-09957ee85dd6-e9e9a9e6, #w-node-_3dfcecf2-741f-29cd-9791-15348327ad8d-e9e9a9e6, #w-node-_43c0beed-6386-7877-56a2-ee7835884e37-e9e9a9e6 {
  grid-area: span 1 / span 12 / span 1 / span 12;
}

#w-node-d72d6950-d93d-4637-35d5-37c05e7c0d38-e9e9a9e6 {
  grid-area: span 1 / span 2 / span 1 / span 2;
  place-self: start;
}

#w-node-_73874b90-ab75-7e50-29c3-3908917f44ec-e9e9a9e6 {
  grid-area: span 1 / span 10 / span 1 / span 10;
}

#w-node-_1c78e62c-1aca-69f2-474b-936dc374d006-e9e9a9e6 {
  grid-area: span 1 / span 12 / span 1 / span 12;
}

#w-node-ef07ea39-cfb9-5449-7b94-05b347257299-e9e9a9e6 {
  grid-area: span 1 / span 2 / span 1 / span 2;
  align-self: start;
}

#w-node-ef07ea39-cfb9-5449-7b94-05b34725729e-e9e9a9e6, #w-node-e0c0f0f9-86e5-b291-16fa-67027c7d91ac-e9e9a9e6 {
  grid-area: span 1 / span 5 / span 1 / span 5;
}

#w-node-_0231eb0a-3d9f-3574-6b60-a387f73bb22d-e9e9a9e6 {
  grid-area: span 1 / span 2 / span 1 / span 2;
  align-self: start;
}

#w-node-_38c376bb-e920-9eda-e812-210d78457c7d-e9e9a9e6, #w-node-_8c60c5a5-f71b-34a4-f8b3-c84fb08a531e-e9e9a9e6 {
  grid-area: span 1 / span 5 / span 1 / span 5;
}

#w-node-_2a3facfc-4fe8-4dd9-3321-d5351248ddcf-e9e9a9e6 {
  grid-area: span 1 / span 2 / span 1 / span 2;
  align-self: start;
}

#w-node-_16208a4a-7610-d558-cad8-21613c02ff3c-e9e9a9e6, #w-node-_035ff3d5-375d-5878-a683-f306d512ef1c-e9e9a9e6 {
  grid-area: span 1 / span 5 / span 1 / span 5;
}

#w-node-_18b58d78-c5ef-76cf-c938-e6865c3a0957-e9e9a9e6 {
  grid-area: span 1 / span 2 / span 1 / span 2;
  align-self: start;
}

#w-node-c4bd1cd3-8332-0e51-10e1-21867c45c99b-e9e9a9e6, #w-node-_9106cb4b-3191-1113-9a39-28b1e23c6c51-e9e9a9e6 {
  grid-area: span 1 / span 5 / span 1 / span 5;
}

#w-node-dd45c394-e668-3321-1198-f52069133a57-e9e9a9e6 {
  grid-area: span 1 / span 2 / span 1 / span 2;
  align-self: start;
}

#w-node-_6c16b473-943e-1b4c-dbda-780c4c057a36-e9e9a9e6, #w-node-_53ec84b3-60f1-9f16-1b2f-44f2c3696f1e-e9e9a9e6 {
  grid-area: span 1 / span 5 / span 1 / span 5;
}

#w-node-a2f542df-f4a7-f916-a2bf-d690aba6410a-e9e9a9e6 {
  grid-area: span 1 / span 2 / span 1 / span 2;
  align-self: start;
}

#w-node-_8d37f161-a4ff-4c02-09cc-d7338e140dd3-e9e9a9e6, #w-node-a0ed19ac-34b4-91c5-7b83-68335faae140-e9e9a9e6 {
  grid-area: span 1 / span 5 / span 1 / span 5;
}

#w-node-e92dc493-afce-b66a-bb38-0fdfa5de0a0a-e9e9a9e6 {
  grid-area: span 1 / span 2 / span 1 / span 2;
  align-self: start;
}

#w-node-_20670753-4d0a-155f-6c6d-e28a3d1db02c-e9e9a9e6, #w-node-_496fa53a-5d34-28de-2d08-c3c0930cbca2-e9e9a9e6 {
  grid-area: span 1 / span 5 / span 1 / span 5;
}

#w-node-_7a23a602-d1b7-d52f-263a-cf3e3606d3b3-e9e9a9e6 {
  grid-area: span 1 / span 2 / span 1 / span 2;
  align-self: start;
}

#w-node-a7a6a72c-9e0a-0737-6f04-f14d357bf427-e9e9a9e6 {
  grid-area: span 1 / span 10 / span 1 / span 10;
}

#w-node-d76e0423-00bb-fc33-ce55-a4e359b90c01-e9e9a9e6 {
  grid-area: span 1 / span 2 / span 1 / span 2;
  align-self: start;
}

#w-node-e177acb4-7c91-448d-d549-50d77e5c9e16-e9e9a9e6 {
  grid-area: span 1 / span 10 / span 1 / span 10;
}

#w-node-e2446457-6a23-c0d1-070c-f0f3b7586106-e9e9a9e6 {
  grid-area: span 1 / span 2 / span 1 / span 2;
  align-self: start;
}

#w-node-_214bbd82-eb09-3e6b-dc9e-802f78dffeb1-e9e9a9e6 {
  grid-area: span 1 / span 10 / span 1 / span 10;
}

#w-node-f5550334-3d38-900d-34b5-b7cd860b5ba6-e9e9a9e6 {
  grid-area: span 1 / span 2 / span 1 / span 2;
  align-self: start;
}

#w-node-be415236-5406-14ad-4edf-c6236719d74e-e9e9a9e6 {
  grid-area: span 1 / span 10 / span 1 / span 10;
}

#w-node-_470204c1-cde7-6989-bcd0-20d473edc5bd-e9e9a9e6 {
  grid-area: span 1 / span 2 / span 1 / span 2;
  align-self: start;
}

#w-node-_3c0e7e4f-af59-2b37-0cfc-668b8e7bc791-e9e9a9e6 {
  grid-area: span 1 / span 10 / span 1 / span 10;
}

#w-node-daa40b7a-c21d-63e6-cd46-295bc549f1a7-e9e9a9e6 {
  grid-area: span 1 / span 2 / span 1 / span 2;
  align-self: start;
}

#w-node-_5404eb7c-0e01-8e9c-0e49-0f9d7fd91b09-e9e9a9e6 {
  grid-area: span 1 / span 6 / span 1 / span 6;
}

#w-node-adc6fca3-12d5-6840-185b-67de2c2bf0cb-e9e9a9e6, #w-node-e3fb3f13-88c0-9012-a386-a1b9aaee0541-e9e9a9e6, #w-node-_28bd63f0-6680-e90a-cef5-eccbcf452fc4-e9e9a9e6, #w-node-_276c0a2e-4d7b-a216-8ecd-16232e90d213-e9e9a9e6, #w-node-_6c41f44b-b701-4842-381d-04daef273904-e9e9a9e6, #w-node-f6a3e425-776f-57d7-1506-b61a84919725-e9e9a9e6, #w-node-c30759ab-c69a-8ffc-d89b-71ee25d44b6b-e9e9a9e6, #w-node-_370a7f08-7cbf-0169-f682-18752d2c9b60-e9e9a9e6, #w-node-_1c61385d-7922-3d7c-c7bb-7e780ddc2d40-e9e9a9e6, #w-node-_5f840a1d-3776-67dc-2024-a54c83aefb2b-e9e9a9e6, #w-node-bc064cb3-8640-6fbc-9700-004cc0fc1a16-e9e9a9e6, #w-node-_9194516d-0c4d-8542-90e6-72ccdbc3e307-e9e9a9e6, #w-node-_9c034f22-1a1b-08ea-dde1-2cd419d2b722-e9e9a9e6, #w-node-_3f6ba279-894d-b6e5-7f91-ffdfdb4b7ece-e9e9a9e6 {
  grid-area: span 1 / span 1 / span 1 / span 1;
  justify-self: stretch;
}

#w-node-_6dd5d120-8041-9f83-e03e-5375c961c494-447a262c {
  grid-area: span 1 / span 12 / span 1 / span 12;
}

#w-node-_6c005e22-9b30-30bc-4e2a-c74df97f9278-447a262c, #w-node-_1e81932a-8257-b9d7-19b0-50b1e51d6903-447a262c, #w-node-_2e62c642-4859-07b1-17d4-f5e1894c4f29-447a262c {
  grid-area: span 1 / span 4 / span 1 / span 4;
}

#w-node-a1d19013-a80d-7e49-d555-c1d2acf6507f-447a262c {
  grid-area: span 1 / span 5 / span 1 / span 5;
}

#w-node-_9b4607ac-8865-2a3e-3de3-2c1fec46117a-447a262c {
  grid-area: 1 / 7 / 2 / 13;
  justify-self: end;
}

#w-node-d22b43d1-d23f-6e2a-72c2-40d0b5a1c03a-447a262c {
  grid-area: span 1 / span 6 / span 1 / span 6;
  align-self: center;
}

#w-node-d22b43d1-d23f-6e2a-72c2-40d0b5a1c03f-447a262c {
  grid-area: span 1 / span 6 / span 1 / span 6;
}

#w-node-d22b43d1-d23f-6e2a-72c2-40d0b5a1c042-447a262c, #w-node-d22b43d1-d23f-6e2a-72c2-40d0b5a1c044-447a262c {
  grid-area: span 1 / span 1 / span 1 / span 1;
  align-self: end;
}

#w-node-d22b43d1-d23f-6e2a-72c2-40d0b5a1c048-447a262c {
  grid-area: 1 / 8 / 2 / 13;
  place-self: center end;
}

#w-node-_060ef972-4648-5da1-26a7-9a5043b1b778-447a262c {
  grid-area: span 1 / span 4 / span 1 / span 4;
}

#w-node-b6f6f122-29d6-654b-3289-38bf7e85538d-447a262c {
  grid-area: span 1 / span 8 / span 1 / span 8;
}

#w-node-_3494c81a-2fbc-8a12-7880-a74198716777-52148ee6 {
  grid-area: 1 / 1 / 2 / 5;
}

#w-node-e81c491c-82c7-601a-1e6e-d636d59489e9-52148ee6 {
  grid-area: 2 / 1 / 3 / 5;
}

#w-node-dcc58c87-9957-e8b0-2817-f4259f84c291-52148ee6 {
  grid-area: 3 / 1 / 4 / 5;
}

#w-node-ace0521f-3901-3cb2-127b-c33206dd80c8-52148ee6 {
  grid-area: span 3 / span 8 / span 3 / span 8;
}

#w-node-_5a496b4f-e19c-da8c-9685-c16f8471301b-52148ee6 {
  grid-area: span 1 / span 4 / span 1 / span 4;
}

#w-node-_5a496b4f-e19c-da8c-9685-c16f84713022-52148ee6 {
  grid-area: span 1 / span 8 / span 1 / span 8;
}

#w-node-_6bbd3adc-3abf-98cf-000c-1ba9369c3aa0-ec4c83f4 {
  grid-area: span 1 / span 5 / span 1 / span 5;
  align-self: center;
}

#w-node-_14c761bc-8623-d2bf-d567-f0166efcfef8-ec4c83f4 {
  grid-area: span 1 / span 7 / span 1 / span 7;
}

@media screen and (max-width: 991px) {
  #w-node-e0f067bb-1de6-d03c-3f4c-3ca0d4559a5c-e9e9a9e2, #w-node-_717f7a5b-8ffa-613a-0fd6-a0d0c5910d99-e9e9a9e2 {
    align-self: end;
  }

  #w-node-_07a85bef-ced6-e623-ee3b-8ee0bb5594da-e9e9a9e2 {
    align-self: center;
  }

  #w-node-_73c87ccf-69c8-d53d-9241-241543a429d2-654d2164 {
    grid-column: span 4 / span 4;
  }

  #w-node-_707f7336-7e9e-047e-efb2-5d64ff6f70ce-654d2164 {
    grid-column: span 3 / span 3;
    justify-self: auto;
  }

  #w-node-_0e91c29f-e400-038a-62c0-dad3ddd29ae2-654d2164 {
    grid-column: span 5 / span 5;
    justify-self: auto;
  }

  #w-node-_43c0beed-6386-7877-56a2-ee7835884e37-e9e9a9e6 {
    grid-column: span 12 / span 12;
  }

  #w-node-d72d6950-d93d-4637-35d5-37c05e7c0d38-e9e9a9e6 {
    grid-column: span 3 / span 3;
  }

  #w-node-_73874b90-ab75-7e50-29c3-3908917f44ec-e9e9a9e6 {
    grid-column: span 8 / span 8;
  }

  #w-node-_1c78e62c-1aca-69f2-474b-936dc374d006-e9e9a9e6, #w-node-ef07ea39-cfb9-5449-7b94-05b347257299-e9e9a9e6, #w-node-ef07ea39-cfb9-5449-7b94-05b34725729e-e9e9a9e6, #w-node-e0c0f0f9-86e5-b291-16fa-67027c7d91ac-e9e9a9e6, #w-node-_0231eb0a-3d9f-3574-6b60-a387f73bb22d-e9e9a9e6, #w-node-_38c376bb-e920-9eda-e812-210d78457c7d-e9e9a9e6, #w-node-_8c60c5a5-f71b-34a4-f8b3-c84fb08a531e-e9e9a9e6, #w-node-_2a3facfc-4fe8-4dd9-3321-d5351248ddcf-e9e9a9e6, #w-node-_16208a4a-7610-d558-cad8-21613c02ff3c-e9e9a9e6, #w-node-_035ff3d5-375d-5878-a683-f306d512ef1c-e9e9a9e6, #w-node-_18b58d78-c5ef-76cf-c938-e6865c3a0957-e9e9a9e6, #w-node-c4bd1cd3-8332-0e51-10e1-21867c45c99b-e9e9a9e6, #w-node-_9106cb4b-3191-1113-9a39-28b1e23c6c51-e9e9a9e6, #w-node-dd45c394-e668-3321-1198-f52069133a57-e9e9a9e6, #w-node-_6c16b473-943e-1b4c-dbda-780c4c057a36-e9e9a9e6, #w-node-_53ec84b3-60f1-9f16-1b2f-44f2c3696f1e-e9e9a9e6, #w-node-a2f542df-f4a7-f916-a2bf-d690aba6410a-e9e9a9e6, #w-node-_8d37f161-a4ff-4c02-09cc-d7338e140dd3-e9e9a9e6, #w-node-a0ed19ac-34b4-91c5-7b83-68335faae140-e9e9a9e6, #w-node-e92dc493-afce-b66a-bb38-0fdfa5de0a0a-e9e9a9e6, #w-node-_20670753-4d0a-155f-6c6d-e28a3d1db02c-e9e9a9e6, #w-node-_496fa53a-5d34-28de-2d08-c3c0930cbca2-e9e9a9e6, #w-node-_7a23a602-d1b7-d52f-263a-cf3e3606d3b3-e9e9a9e6, #w-node-a7a6a72c-9e0a-0737-6f04-f14d357bf427-e9e9a9e6, #w-node-d76e0423-00bb-fc33-ce55-a4e359b90c01-e9e9a9e6, #w-node-e177acb4-7c91-448d-d549-50d77e5c9e16-e9e9a9e6, #w-node-e2446457-6a23-c0d1-070c-f0f3b7586106-e9e9a9e6, #w-node-_214bbd82-eb09-3e6b-dc9e-802f78dffeb1-e9e9a9e6, #w-node-f5550334-3d38-900d-34b5-b7cd860b5ba6-e9e9a9e6, #w-node-be415236-5406-14ad-4edf-c6236719d74e-e9e9a9e6, #w-node-_470204c1-cde7-6989-bcd0-20d473edc5bd-e9e9a9e6, #w-node-_3c0e7e4f-af59-2b37-0cfc-668b8e7bc791-e9e9a9e6, #w-node-daa40b7a-c21d-63e6-cd46-295bc549f1a7-e9e9a9e6, #w-node-_5404eb7c-0e01-8e9c-0e49-0f9d7fd91b09-e9e9a9e6, #w-node-a1d19013-a80d-7e49-d555-c1d2acf6507f-447a262c {
    grid-column: span 12 / span 12;
  }

  #w-node-_9b4607ac-8865-2a3e-3de3-2c1fec46117a-447a262c {
    grid-area: span 1 / span 12 / span 1 / span 12;
  }

  #w-node-_060ef972-4648-5da1-26a7-9a5043b1b778-447a262c, #w-node-b6f6f122-29d6-654b-3289-38bf7e85538d-447a262c, #w-node-_5a496b4f-e19c-da8c-9685-c16f8471301b-52148ee6, #w-node-_5a496b4f-e19c-da8c-9685-c16f84713022-52148ee6 {
    grid-column: span 12 / span 12;
  }
}

@media screen and (max-width: 767px) {
  #w-node-_5a089ca6-6d97-ac8b-5e39-defe0c6f0715-e9e9a9e2 {
    grid-area: span 1 / span 6 / span 1 / span 6;
  }

  #w-node-e0f067bb-1de6-d03c-3f4c-3ca0d4559a5c-e9e9a9e2, #w-node-_717f7a5b-8ffa-613a-0fd6-a0d0c5910d99-e9e9a9e2 {
    grid-area: span 1 / span 6 / span 1 / span 6;
    align-self: end;
  }

  #w-node-cde43485-7500-a7f3-66c7-888eddefcd1d-e9e9a9e2, #w-node-_2eaa17f6-d3ec-f8ef-a375-ee4072990f37-e9e9a9e2, #w-node-ab892bf0-a3f7-838a-1b11-9512526ac65b-e9e9a9e2 {
    grid-area: span 1 / span 6 / span 1 / span 6;
  }

  #w-node-_07a85bef-ced6-e623-ee3b-8ee0bb5594da-e9e9a9e2 {
    order: 9999;
  }

  #w-node-e1db0ef9-0767-6bb2-8fe7-8efb1a0e8443-e9e9a9e2 {
    grid-area: span 1 / span 6 / span 1 / span 6;
  }

  #w-node-_3b23c57e-d633-7e9c-7552-43e825cd4f40-e9e9a9e2 {
    grid-area: span 1 / span 6 / span 1 / span 6;
    align-self: center;
  }

  #w-node-_1b68b7bd-d865-d7ca-d2b4-de8c63fe544f-e9e9a9e2 {
    grid-area: span 1 / span 6 / span 1 / span 6;
  }

  #w-node-_16e83ca1-946c-bc19-ecb6-0f17b2087c78-e9e9a9e2 {
    grid-area: span 1 / span 6 / span 1 / span 6;
    place-self: center end;
  }

  #w-node-_73c87ccf-69c8-d53d-9241-241543a429d2-654d2164 {
    grid-column: span 6 / span 6;
    justify-self: center;
  }

  #w-node-_707f7336-7e9e-047e-efb2-5d64ff6f70ce-654d2164 {
    grid-column: span 2 / span 2;
  }

  #w-node-_0e91c29f-e400-038a-62c0-dad3ddd29ae2-654d2164 {
    grid-column: span 4 / span 4;
  }

  #w-node-d778e02e-c4cb-2a84-d461-0628a0f8616b-654d2164 {
    grid-column: span 6 / span 6;
  }

  #w-node-_2a616156-a789-3c89-957b-096767c03146-654d2164 {
    justify-self: center;
  }

  #w-node-_0f2189c3-cd67-8bae-1b70-bf24a1e4cd11-654d2164 {
    grid-column: span 6 / span 6;
    justify-self: center;
  }

  #w-node-_43c0beed-6386-7877-56a2-ee7835884e37-e9e9a9e6, #w-node-_73874b90-ab75-7e50-29c3-3908917f44ec-e9e9a9e6, #w-node-_1c78e62c-1aca-69f2-474b-936dc374d006-e9e9a9e6, #w-node-ef07ea39-cfb9-5449-7b94-05b347257299-e9e9a9e6, #w-node-ef07ea39-cfb9-5449-7b94-05b34725729e-e9e9a9e6, #w-node-e0c0f0f9-86e5-b291-16fa-67027c7d91ac-e9e9a9e6, #w-node-_0231eb0a-3d9f-3574-6b60-a387f73bb22d-e9e9a9e6, #w-node-_38c376bb-e920-9eda-e812-210d78457c7d-e9e9a9e6, #w-node-_8c60c5a5-f71b-34a4-f8b3-c84fb08a531e-e9e9a9e6, #w-node-_2a3facfc-4fe8-4dd9-3321-d5351248ddcf-e9e9a9e6, #w-node-_16208a4a-7610-d558-cad8-21613c02ff3c-e9e9a9e6, #w-node-_035ff3d5-375d-5878-a683-f306d512ef1c-e9e9a9e6, #w-node-_18b58d78-c5ef-76cf-c938-e6865c3a0957-e9e9a9e6, #w-node-c4bd1cd3-8332-0e51-10e1-21867c45c99b-e9e9a9e6, #w-node-_9106cb4b-3191-1113-9a39-28b1e23c6c51-e9e9a9e6, #w-node-dd45c394-e668-3321-1198-f52069133a57-e9e9a9e6, #w-node-_6c16b473-943e-1b4c-dbda-780c4c057a36-e9e9a9e6, #w-node-_53ec84b3-60f1-9f16-1b2f-44f2c3696f1e-e9e9a9e6, #w-node-a2f542df-f4a7-f916-a2bf-d690aba6410a-e9e9a9e6, #w-node-_8d37f161-a4ff-4c02-09cc-d7338e140dd3-e9e9a9e6, #w-node-a0ed19ac-34b4-91c5-7b83-68335faae140-e9e9a9e6, #w-node-e92dc493-afce-b66a-bb38-0fdfa5de0a0a-e9e9a9e6, #w-node-_20670753-4d0a-155f-6c6d-e28a3d1db02c-e9e9a9e6, #w-node-_496fa53a-5d34-28de-2d08-c3c0930cbca2-e9e9a9e6, #w-node-_7a23a602-d1b7-d52f-263a-cf3e3606d3b3-e9e9a9e6, #w-node-a7a6a72c-9e0a-0737-6f04-f14d357bf427-e9e9a9e6, #w-node-d76e0423-00bb-fc33-ce55-a4e359b90c01-e9e9a9e6, #w-node-e177acb4-7c91-448d-d549-50d77e5c9e16-e9e9a9e6, #w-node-e2446457-6a23-c0d1-070c-f0f3b7586106-e9e9a9e6, #w-node-_214bbd82-eb09-3e6b-dc9e-802f78dffeb1-e9e9a9e6, #w-node-f5550334-3d38-900d-34b5-b7cd860b5ba6-e9e9a9e6, #w-node-be415236-5406-14ad-4edf-c6236719d74e-e9e9a9e6, #w-node-_470204c1-cde7-6989-bcd0-20d473edc5bd-e9e9a9e6, #w-node-_3c0e7e4f-af59-2b37-0cfc-668b8e7bc791-e9e9a9e6, #w-node-daa40b7a-c21d-63e6-cd46-295bc549f1a7-e9e9a9e6, #w-node-_5404eb7c-0e01-8e9c-0e49-0f9d7fd91b09-e9e9a9e6, #w-node-_6dd5d120-8041-9f83-e03e-5375c961c494-447a262c {
    grid-column: span 6 / span 6;
  }

  #w-node-_6c005e22-9b30-30bc-4e2a-c74df97f9278-447a262c, #w-node-_1e81932a-8257-b9d7-19b0-50b1e51d6903-447a262c {
    grid-column: span 3 / span 3;
  }

  #w-node-_2e62c642-4859-07b1-17d4-f5e1894c4f29-447a262c, #w-node-a1d19013-a80d-7e49-d555-c1d2acf6507f-447a262c, #w-node-_9b4607ac-8865-2a3e-3de3-2c1fec46117a-447a262c {
    grid-column: span 6 / span 6;
  }

  #w-node-d22b43d1-d23f-6e2a-72c2-40d0b5a1c048-447a262c {
    grid-area: span 1 / span 6 / span 1 / span 6;
    place-self: center end;
  }

  #w-node-_060ef972-4648-5da1-26a7-9a5043b1b778-447a262c, #w-node-b6f6f122-29d6-654b-3289-38bf7e85538d-447a262c {
    grid-column: span 6 / span 6;
  }

  #w-node-_3494c81a-2fbc-8a12-7880-a74198716777-52148ee6, #w-node-e81c491c-82c7-601a-1e6e-d636d59489e9-52148ee6, #w-node-dcc58c87-9957-e8b0-2817-f4259f84c291-52148ee6 {
    grid-area: span 1 / span 6 / span 1 / span 6;
  }

  #w-node-ace0521f-3901-3cb2-127b-c33206dd80c8-52148ee6 {
    order: -9999;
    grid-area: span 1 / span 6 / span 1 / span 6;
  }

  #w-node-_5a496b4f-e19c-da8c-9685-c16f8471301b-52148ee6, #w-node-_5a496b4f-e19c-da8c-9685-c16f84713022-52148ee6 {
    grid-column: span 6 / span 6;
  }
}

@media screen and (max-width: 479px) {
  #w-node-_73c87ccf-69c8-d53d-9241-241543a429d2-654d2164 {
    justify-self: auto;
  }

  #w-node-_707f7336-7e9e-047e-efb2-5d64ff6f70ce-654d2164, #w-node-_0e91c29f-e400-038a-62c0-dad3ddd29ae2-654d2164 {
    grid-column: span 6 / span 6;
  }

  #w-node-_2a616156-a789-3c89-957b-096767c03146-654d2164 {
    justify-self: start;
  }

  #w-node-_1a3fe882-bd4a-dfcc-a0bf-3f5f25d7397a-e9e9a9e6, #w-node-_0f6647f2-3a81-6928-afb4-0205c39bf8a2-e9e9a9e6, #w-node-_7f5485f3-df8e-9e35-88d4-46ae6d2f2bab-e9e9a9e6, #w-node-_158150a2-2805-7beb-56ba-f87361a4787a-e9e9a9e6, #w-node-_73fc2a2c-09bf-7345-70d1-5ead0f1eb6ff-e9e9a9e6, #w-node-_945633db-5ded-cc98-5fda-facb2c96fb6d-e9e9a9e6, #w-node-f6f64556-b4e6-a5eb-d633-15e3c7bae629-e9e9a9e6 {
    grid-area: span 1 / span 2 / span 1 / span 2;
  }
}


@font-face {
  font-family: 'Ibmplexserif';
  src: url('../fonts/IBMPlexSerif-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Ibmplexserif';
  src: url('../fonts/IBMPlexSerif-SemiBold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Ibmplexserif';
  src: url('../fonts/IBMPlexSerif-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Ibmplexserif';
  src: url('../fonts/IBMPlexSerif-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Ibmplexserif';
  src: url('../fonts/IBMPlexSerif-Italic.ttf') format('truetype');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Ibmplexserif';
  src: url('../fonts/IBMPlexSerif-LightItalic.ttf') format('truetype');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Ibmplexserif';
  src: url('../fonts/IBMPlexSerif-MediumItalic.ttf') format('truetype');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Ibmplexsans';
  src: url('../fonts/IBMPlexSans-SemiBold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Ibmplexsans';
  src: url('../fonts/IBMPlexSans-Italic.ttf') format('truetype');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Ibmplexsans';
  src: url('../fonts/IBMPlexSans-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Ibmplexsans';
  src: url('../fonts/IBMPlexSans-MediumItalic.ttf') format('truetype');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Ibmplexsans';
  src: url('../fonts/IBMPlexSans-LightItalic.ttf') format('truetype');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Ibmplexsans';
  src: url('../fonts/IBMPlexSans-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
/* ===================================================== */
/* ===== Kurs stranice (custom dodatak) ================ */
/* ===================================================== */

html {
  scroll-behavior: smooth;
}

.section.english-course-hero {
  padding-bottom: 15rem;
}

.course-hero-skyline {
  pointer-events: none;
  background-image: url('../images/England-1.svg');
  background-position: 0 100%;
  background-repeat: repeat-x;
  background-size: auto 100%;
  height: 12rem;
  position: absolute;
  inset: auto 0% 0%;
}

.course-hero-skyline.spanish {
  background-image: url('../images/Spain-new.svg');
}

.course-hero-z {
  z-index: 2;
}

.course-hero-image-wrap {
  z-index: 1;
  justify-content: center;
  align-items: flex-end;
  display: flex;
  position: relative;
}

.course-hero-booth {
  aspect-ratio: 3 / 4;
  object-fit: cover;
  border-radius: 999px 999px 1.5rem 1.5rem;
  width: 100%;
  max-width: 21rem;
  transform: translateY(5rem);
  box-shadow: 0 24px 60px #1c34332e;
}

.course-hero-trust {
  color: var(--neutral-600);
  font-size: var(--main--text-xxs);
  flex-wrap: wrap;
  gap: .75rem 1.75rem;
  margin-top: 2rem;
  display: flex;
}

.check-item {
  grid-column-gap: .6rem;
  align-items: center;
  display: flex;
}

.check-item:before {
  content: "";
  background-color: var(--yellow);
  -webkit-mask: url('../images/Check.svg') 50% / contain no-repeat;
  mask: url('../images/Check.svg') 50% / contain no-repeat;
  flex-shrink: 0;
  width: .85rem;
  height: .65rem;
}

.check-list {
  flex-direction: column;
  gap: .9rem;
  display: flex;
}

.check-list .check-item {
  align-items: flex-start;
  line-height: 1.45;
}

.check-list .check-item:before {
  margin-top: .45rem;
}

.section.courses-menu-line.course-sticky {
  z-index: 90;
  background-color: var(--neutral);
  position: sticky;
  top: 72px;
}

.course-anchor {
  color: var(--green);
  font-family: var(--main--main-font);
  text-decoration: none;
  padding: .25rem 0;
  transition: color .2s;
}

.course-anchor:hover {
  color: var(--yellow);
}

.program-section {
  scroll-margin-top: 9.5rem;
}

.program-grid {
  grid-column-gap: var(--main--size--size-2xl);
  grid-row-gap: var(--main--size--size-l);
  grid-template-columns: 1fr 1fr;
  align-items: center;
  width: 100%;
  display: grid;
}

.program-grid.flip .program-visual {
  order: -1;
}

.program-copy {
  max-width: 34rem;
}

.program-promise {
  font-family: var(--main--main-font);
  color: var(--green);
  font-size: var(--main--text-m);
  font-style: italic;
  margin-top: var(--main--size--size-m);
}

.text-link {
  color: var(--green);
  border-bottom: 1px solid var(--yellow);
  padding-bottom: .15rem;
  font-weight: 500;
  text-decoration: none;
  transition: color .2s, border-color .2s;
  display: inline-block;
  margin-top: var(--main--size--size-l);
}

.text-link:hover {
  color: var(--yellow);
}

.program-visual {
  background-color: var(--llight-darker);
  border-radius: 1.5rem;
  justify-content: center;
  align-items: center;
  min-height: 26rem;
  padding: 2.5rem;
  display: flex;
  position: relative;
  overflow: hidden;
}

.motif-card {
  background-color: var(--neutral);
  border-radius: 1rem;
  width: 100%;
  max-width: 22rem;
  padding: 1.5rem;
  transform: rotate(-2.5deg);
  box-shadow: 0 14px 34px #1c34331f;
}

.motif-card.rot-r {
  transform: rotate(2deg);
}

.motif-chrome {
  gap: .4rem;
  margin-bottom: 1rem;
  display: flex;
}

.motif-chrome span {
  background-color: var(--llight-darker);
  border-radius: 50%;
  width: .6rem;
  height: .6rem;
}

.motif-chrome span:first-child {
  background-color: var(--yellow);
}

.motif-chrome span:nth-child(2) {
  background-color: var(--green);
}

.motif-email-subject {
  color: var(--neutral-600);
  font-size: var(--main--text-xxs);
  font-weight: 500;
  margin-bottom: .75rem;
}

.motif-line {
  background-color: var(--llight-darker);
  border-radius: 3px;
  height: .5rem;
  margin-bottom: .5rem;
}

.motif-line.w80 { width: 80%; }
.motif-line.w95 { width: 95%; }
.motif-line.w60 { width: 60%; }

.motif-phrase {
  font-family: var(--main--main-font);
  color: var(--green);
  font-size: var(--main--text-m);
  font-style: italic;
  line-height: 1.35;
  margin: 1rem 0;
}

.motif-tag {
  background-color: var(--green);
  color: var(--light);
  font-size: var(--main--text-xxs);
  font-weight: 500;
  border-radius: 100px;
  padding: .35rem .9rem;
  display: inline-block;
}

.motif-chat {
  flex-direction: column;
  gap: .9rem;
  width: 100%;
  max-width: 22rem;
  display: flex;
}

.chat-row {
  gap: .6rem;
  align-items: flex-end;
  display: flex;
}

.chat-row.me {
  justify-content: flex-end;
}

.chat-avatar {
  background-color: var(--green);
  color: var(--light);
  font-family: var(--main--main-font);
  font-style: italic;
  border-radius: 50%;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 2.2rem;
  height: 2.2rem;
  display: flex;
}

.chat-bubble {
  background-color: var(--neutral);
  color: var(--neutral-600);
  font-size: var(--main--text-xxs);
  border-radius: 1.1rem 1.1rem 1.1rem .25rem;
  max-width: 16rem;
  padding: .8rem 1.1rem;
  box-shadow: 0 8px 20px #1c343314;
}

.chat-bubble.me {
  background-color: var(--green);
  color: var(--light);
  border-radius: 1.1rem 1.1rem .25rem 1.1rem;
}

.chat-bubble.dots {
  gap: .3rem;
  align-items: center;
  padding: 1rem 1.1rem;
  display: flex;
}

.chat-bubble.dots span {
  background-color: var(--neutral-400);
  border-radius: 50%;
  width: .45rem;
  height: .45rem;
  animation: chatdots 1.2s infinite;
}

.chat-bubble.dots span:nth-child(2) { animation-delay: .2s; }
.chat-bubble.dots span:nth-child(3) { animation-delay: .4s; }

@keyframes chatdots {
  0%, 60%, 100% { opacity: .35; transform: translateY(0); }
  30% { opacity: 1; transform: translateY(-3px); }
}

.score-head {
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1.1rem;
  display: flex;
}

.score-title {
  font-weight: 500;
}

.score-sub {
  color: var(--neutral-500);
  font-size: var(--main--text-xxs);
}

.score-big {
  font-family: var(--main--main-font);
  color: var(--green);
  font-size: 2.6rem;
  line-height: 1;
}

.score-row {
  color: var(--neutral-600);
  font-size: var(--main--text-xxs);
  grid-template-columns: 5.2rem 1fr 2.2rem;
  align-items: center;
  gap: .7rem;
  margin-bottom: .55rem;
  display: grid;
}

.score-row span:last-child {
  text-align: right;
  font-weight: 500;
}

.score-bar {
  background-color: var(--llight-darker);
  border-radius: 100px;
  height: .45rem;
  overflow: hidden;
}

.score-bar div {
  background-color: var(--yellow);
  border-radius: 100px;
  height: 100%;
}

.score-tag {
  margin-top: .9rem;
}

.motif-kids {
  flex-direction: column;
  align-items: center;
  gap: 1.4rem;
  display: flex;
}

.kids-tiles {
  gap: .9rem;
  display: flex;
}

.tile {
  font-family: var(--main--main-font);
  border-radius: .9rem;
  justify-content: center;
  align-items: center;
  width: 3.4rem;
  height: 3.4rem;
  font-size: 1.5rem;
  display: flex;
  box-shadow: 0 10px 22px #1c34331a;
}

.tile.t1 {
  background-color: var(--green);
  color: var(--light);
  transform: rotate(-7deg);
}

.tile.t2 {
  background-color: var(--neutral);
  color: var(--green);
  transform: rotate(3deg);
}

.tile.t3 {
  background-color: var(--yellow);
  color: var(--neutral);
  transform: rotate(8deg);
}

.kids-card {
  text-align: center;
  width: auto;
  max-width: none;
  padding: 1.2rem 2.2rem;
  transform: rotate(1.5deg);
}

.kids-word {
  font-family: var(--main--main-font);
  color: var(--green);
  font-size: var(--heading--heading-h4);
  line-height: 1.1;
}

.kids-translation {
  color: var(--neutral-500);
  margin-bottom: .6rem;
}

.kids-stars {
  color: var(--yellow);
  font-size: var(--main--text-xxs);
  font-weight: 500;
}

.steps-grid {
  grid-column-gap: var(--main--size--size-m);
  grid-row-gap: var(--main--size--size-m);
  grid-template-columns: 1fr 1fr 1fr;
  width: 100%;
  margin-bottom: var(--main--size--size-xl);
  display: grid;
}

.step-card {
  background-color: var(--neutral);
  border-radius: 1rem;
  flex-direction: column;
  gap: .9rem;
  padding: 2rem;
  display: flex;
  box-shadow: 0 8px 20px #0000000d;
}

.step-num {
  font-family: var(--main--main-font);
  color: var(--yellow);
  font-size: var(--heading--heading-h3);
  font-style: italic;
  line-height: 1;
}

.step-title {
  font-size: var(--main--text-l);
  font-weight: 500;
}

.step-card p {
  font-size: var(--main--text-xs);
}

.steps-cta {
  justify-content: center;
  display: flex;
}

.pricing-grid {
  grid-column-gap: var(--main--size--size-m);
  grid-row-gap: var(--main--size--size-m);
  grid-template-columns: 1fr 1fr 1fr;
  align-items: stretch;
  width: 100%;
  margin-bottom: var(--main--size--size-l);
  display: grid;
}

.pricing-card {
  background-color: var(--neutral);
  border: 1px solid var(--llight-darker);
  border-radius: 1.5rem;
  flex-direction: column;
  gap: 1.1rem;
  padding: 2.2rem;
  display: flex;
  position: relative;
}

.pricing-card.featured {
  background-color: var(--green);
  color: var(--light);
  border-style: none;
  box-shadow: 0 18px 44px #1c343338;
}

.pricing-badge {
  background-color: var(--yellow);
  color: var(--neutral);
  font-size: var(--main--text-xxs);
  letter-spacing: .02em;
  font-weight: 500;
  border-radius: 100px;
  padding: .4rem 1rem;
  position: absolute;
  top: -.9rem;
  right: 1.6rem;
  transform: rotate(2deg);
}

.pricing-name {
  font-family: var(--main--main-font);
  font-size: var(--heading--heading-h5);
}

.pricing-price {
  align-items: baseline;
  gap: .5rem;
  display: flex;
}

.pricing-amount {
  font-family: var(--main--main-font);
  font-size: var(--heading--heading-h3);
  line-height: 1;
}

.pricing-per {
  color: var(--neutral-500);
  font-size: var(--main--text-xxs);
}

.pricing-card.featured .pricing-per {
  color: #f4f1ebc7;
}

.pricing-desc {
  font-size: var(--main--text-xs);
  color: var(--neutral-600);
}

.pricing-card.featured .pricing-desc {
  color: #f4f1ebc7;
}

.pricing-card .check-list {
  font-size: var(--main--text-xs);
  color: var(--neutral-600);
  gap: .75rem;
  margin-top: .2rem;
  margin-bottom: .5rem;
}

.pricing-card.featured .check-list {
  color: #f4f1ebe6;
}

.pricing-card .button,
.pricing-card .button-variant {
  margin-top: auto;
}

.pricing-foot {
  color: var(--neutral-600);
  text-align: center;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  width: 100%;
  display: flex;
}

.pricing-included {
  flex-wrap: wrap;
  justify-content: center;
  gap: .6rem 1.8rem;
  display: flex;
}

.cefr-row {
  flex-wrap: wrap;
  gap: .5rem;
  display: flex;
}

.cefr-pill {
  border: 1px solid #f4f1eb59;
  color: var(--light);
  font-size: var(--main--text-xxs);
  letter-spacing: .03em;
  font-weight: 500;
  border-radius: 100px;
  padding: .35rem .85rem;
}

.testimonial-heading {
  text-align: center;
  margin-bottom: var(--main--size--size-xl);
}

.cross-sell-card {
  background-color: var(--light);
  background-image: url('../images/Spain-new.svg');
  background-position: 103% 103%;
  background-repeat: no-repeat;
  background-size: 34rem auto;
  border-radius: 1.5rem;
  justify-content: space-between;
  align-items: center;
  gap: 2rem;
  width: 100%;
  padding: 3rem 3rem 7rem;
  color: var(--dark);
  text-decoration: none;
  transition: box-shadow .25s, transform .25s;
  display: flex;
}

.cross-sell-card:hover {
  color: var(--dark);
  transform: translateY(-3px);
  box-shadow: 0 16px 40px #1c34331f;
}

.cross-sell-card.to-english {
  background-image: url('../images/England-1.svg');
}

@media screen and (max-width: 991px) {
  #w-node-_6bbd3adc-3abf-98cf-000c-1ba9369c3aa0-ec4c83f4,
  #w-node-_14c761bc-8623-d2bf-d567-f0166efcfef8-ec4c83f4 {
    grid-column: 1 / -1;
  }

  .course-hero-booth {
    max-width: 17rem;
    transform: translateY(4rem);
  }

  .course-hero-skyline {
    height: 9rem;
  }

  .section.english-course-hero {
    padding-bottom: 12rem;
  }

  .program-grid {
    grid-template-columns: 1fr;
  }

  .program-grid.flip .program-visual {
    order: 0;
  }

  .program-visual {
    min-height: 22rem;
  }

  .pricing-grid {
    grid-template-columns: 1fr;
    max-width: 30rem;
    margin-left: auto;
    margin-right: auto;
  }
}

@media screen and (max-width: 767px) {
  .courses-bar-line-wrapper {
    justify-content: flex-start;
    gap: 1.5rem;
    padding: .25rem 0;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .courses-bar-line-wrapper::-webkit-scrollbar {
    display: none;
  }

  .course-anchor {
    white-space: nowrap;
    font-size: var(--main--text-m);
  }

  .steps-grid {
    grid-template-columns: 1fr;
  }

  .program-visual {
    min-height: auto;
    padding: 2rem 1.5rem;
  }

  .cross-sell-card {
    background-size: 26rem auto;
    flex-direction: column;
    align-items: flex-start;
    padding: 2rem 1.5rem 9rem;
  }

  .course-hero-booth {
    max-width: 14rem;
    transform: translateY(3rem);
  }

  .section.english-course-hero {
    padding-bottom: 10rem;
  }

  .course-hero-skyline {
    height: 7rem;
  }
}

@media screen and (max-width: 479px) {
  .motif-card {
    max-width: 100%;
  }

  .score-row {
    grid-template-columns: 4.4rem 1fr 2rem;
  }

  .pricing-card {
    padding: 1.6rem;
  }
}

#w-node-_6bbd3adc-3abf-98cf-000c-1ba9369c3aa0-ec4c83f4 {
  grid-area: span 1 / span 6 / span 1 / span 6;
}

#w-node-_14c761bc-8623-d2bf-d567-f0166efcfef8-ec4c83f4 {
  grid-area: span 1 / span 6 / span 1 / span 6;
}

.course-hero-z .hero-button-wrap {
  flex-wrap: wrap;
}

@media screen and (max-width: 991px) {
  #w-node-_6bbd3adc-3abf-98cf-000c-1ba9369c3aa0-ec4c83f4,
  #w-node-_14c761bc-8623-d2bf-d567-f0166efcfef8-ec4c83f4 {
    grid-column: 1 / -1;
  }
}

.cross-sell-card {
  background-position: 100% 130%;
  background-size: 30rem auto;
  padding-bottom: 5.5rem;
}

@media screen and (max-width: 767px) {
  .cross-sell-card {
    background-position: 50% 108%;
    background-size: 24rem auto;
    flex-direction: column;
    align-items: flex-start;
    padding: 2rem 1.5rem 9rem;
  }
}

/* ===== Spanska kurs stranica — motivi ===== */

.course-hero-hola {
  aspect-ratio: 3 / 4;
  background-color: var(--yellow);
  color: var(--light);
  border-radius: 999px 999px 1.5rem 1.5rem;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: .9rem;
  width: 100%;
  max-width: 21rem;
  display: flex;
  transform: translateY(5rem);
  box-shadow: 0 24px 60px #1c34332e;
}

.hola-big {
  font-family: var(--main--main-font);
  font-style: italic;
  font-size: 4.2rem;
  line-height: 1;
}

.hola-sub {
  font-size: var(--main--text-s);
  opacity: .92;
}

.lesson-row {
  grid-column-gap: .6rem;
  color: var(--neutral-600);
  font-size: var(--main--text-xxs);
  align-items: center;
  margin-bottom: .65rem;
  line-height: 1.4;
  display: flex;
}

.lesson-row:before {
  content: "";
  background-color: var(--yellow);
  -webkit-mask: url('../images/Check.svg') 50% / contain no-repeat;
  mask: url('../images/Check.svg') 50% / contain no-repeat;
  flex-shrink: 0;
  width: .8rem;
  height: .6rem;
}

.lesson-row.todo:before {
  background-color: #0000;
  border: 2px solid var(--neutral-300);
  -webkit-mask: none;
  mask: none;
  border-radius: 50%;
  width: .65rem;
  height: .65rem;
}

.lesson-bar {
  background-color: var(--llight-darker);
  border-radius: 100px;
  height: .45rem;
  margin-top: 1rem;
  overflow: hidden;
}

.lesson-bar div {
  background-color: var(--yellow);
  border-radius: 100px;
  height: 100%;
}

.lesson-pct {
  color: var(--neutral-500);
  font-size: var(--main--text-xxs);
  margin-top: .5rem;
  font-weight: 500;
}

.pass-route {
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1.1rem;
  display: flex;
}

.pass-code {
  font-family: var(--main--main-font);
  color: var(--green);
  font-size: 2rem;
  line-height: 1.1;
}

.pass-city.right {
  text-align: right;
}

.pass-name {
  color: var(--neutral-500);
  font-size: var(--main--text-xxs);
}

.pass-arrow {
  color: var(--yellow);
  font-size: 1.4rem;
  font-weight: 500;
}

.pass-divider {
  border-top: 2px dashed var(--llight-darker);
  margin-bottom: 1.1rem;
}

.pass-meta {
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.1rem;
  display: flex;
}

.pass-meta span {
  color: var(--neutral-500);
  font-size: .8rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  display: block;
}

.pass-meta strong {
  font-size: var(--main--text-xxs);
  font-weight: 500;
}

@media screen and (max-width: 991px) {
  .course-hero-hola {
    max-width: 17rem;
    transform: translateY(4rem);
  }

  .hola-big {
    font-size: 3.4rem;
  }
}

@media screen and (max-width: 767px) {
  .course-hero-hola {
    max-width: 14rem;
    transform: translateY(3rem);
  }

  .hola-big {
    font-size: 2.8rem;
  }
}

/* ===== Navigacija: Kursevi dropdown ===== */

.nav-dropdown {
  position: relative;
}

.nav-dropdown-toggle {
  cursor: default;
  align-items: center;
  gap: .4rem;
  display: flex;
}

.nav-caret {
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  width: .5rem;
  height: .5rem;
  margin-top: -.2rem;
  transition: transform .2s;
  transform: rotate(45deg);
}

.nav-dropdown:hover .nav-caret,
.nav-dropdown:focus-within .nav-caret {
  transform: rotate(225deg)translateY(-.15rem);
}

.nav-dropdown-list {
  z-index: 1000;
  background-color: var(--neutral);
  border-radius: 1rem;
  min-width: 13rem;
  padding: .6rem;
  position: absolute;
  top: 100%;
  left: 50%;
  opacity: 0;
  visibility: hidden;
  transition: opacity .2s, transform .2s, visibility .2s;
  transform: translate(-50%, .5rem);
  box-shadow: 0 14px 34px #1c343321;
}

.nav-dropdown:hover .nav-dropdown-list,
.nav-dropdown:focus-within .nav-dropdown-list {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0);
}

.nav-dropdown-link {
  color: var(--green);
  border-radius: .6rem;
  padding: .65rem 1rem;
  font-size: 1rem;
  text-decoration: none;
  transition: background-color .15s;
  display: block;
}

.nav-dropdown-link:hover {
  background-color: var(--light);
  color: var(--green);
}

@media screen and (max-width: 991px) {
  .nav-dropdown {
    width: 100%;
  }

  .nav-dropdown-toggle {
    display: none;
  }

  .nav-dropdown-list {
    opacity: 1;
    visibility: visible;
    box-shadow: none;
    background-color: #0000;
    border-radius: 0;
    min-width: 0;
    padding: 0;
    position: static;
    transform: none;
    grid-row-gap: var(--main--size--size-m);
    flex-direction: column;
    display: flex;
  }

  .nav-dropdown-link {
    font-size: var(--heading--heading-h6);
    border-radius: 0;
    padding: 0;
  }

  /* The desktop :hover/:focus-within rule (transform: translate(-50%, 0)) has higher
     specificity than the static mobile list above, so hovering/tapping an item shifted
     the whole list half its width to the left. Neutralize it here; the .lang-switch
     dropdown keeps its own floating behavior via later, more specific rules. */
  .nav-dropdown:hover .nav-dropdown-list,
  .nav-dropdown:focus-within .nav-dropdown-list {
    transform: none;
  }

  /* The expanded mobile list has no padding, so the desktop hover highlight
     reads as a stray white bar — drop it here (lang-switch keeps its own). */
  .nav-dropdown:not(.lang-switch) .nav-dropdown-link:hover {
    background-color: transparent;
  }
}

@media screen and (max-width: 991px) {
  .nav-dropdown-list {
    align-items: flex-start;
  }

  .nav-dropdown-link {
    color: var(--dark);
    text-align: left;
  }
}

/* ===== Hero v2: arch asset + plutajuce kartice ===== */

.section.english-course-hero {
  padding-bottom: var(--main--size--size-4xl);
}

.hero-arch-box {
  width: 100%;
  max-width: 26rem;
  position: relative;
}

.hero-arch {
  aspect-ratio: 4 / 5;
  background-color: var(--green);
  border-radius: 999px 999px 1.5rem 1.5rem;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: .6rem;
  width: 100%;
  display: flex;
  position: relative;
  overflow: hidden;
  box-shadow: 0 24px 60px #1c34332e;
}

.hero-arch.gold {
  background-color: var(--yellow);
}

.arch-skyline {
  pointer-events: none;
  background-color: #f4f1eb40;
  -webkit-mask: url('../images/England-1.svg') 50% 100% / auto 100% repeat-x;
  mask: url('../images/England-1.svg') 50% 100% / auto 100% repeat-x;
  height: 7.5rem;
  position: absolute;
  inset: auto 0% 0%;
}

.arch-skyline.spain {
  -webkit-mask-image: url('../images/Spain-new.svg');
  mask-image: url('../images/Spain-new.svg');
}

.arch-word {
  font-family: var(--main--main-font);
  color: var(--light);
  font-size: 4.5rem;
  font-style: italic;
  line-height: 1;
  position: relative;
  z-index: 1;
}

.arch-sub {
  color: var(--light);
  opacity: .85;
  font-size: var(--main--text-s);
  position: relative;
  z-index: 1;
}

.hero-float {
  z-index: 2;
  position: absolute;
}

.hero-float.bubble {
  top: 7%;
  left: -7%;
  transform: rotate(-3deg);
}

.hero-float.level {
  bottom: 8%;
  right: -7%;
  transform: rotate(2.5deg);
}

.level-card {
  background-color: var(--neutral);
  border-radius: 1rem;
  min-width: 11.5rem;
  padding: 1rem 1.2rem;
  box-shadow: 0 14px 34px #1c343326;
}

.level-label {
  color: var(--neutral-500);
  letter-spacing: .04em;
  text-transform: uppercase;
  font-size: .8rem;
  font-weight: 500;
  margin-bottom: .35rem;
}

.level-path {
  font-family: var(--main--main-font);
  color: var(--green);
  font-size: var(--heading--heading-h5);
  line-height: 1.1;
  margin-bottom: .6rem;
}

.level-path span {
  color: var(--yellow);
}

.level-bar {
  background-color: var(--llight-darker);
  border-radius: 100px;
  height: .45rem;
  overflow: hidden;
}

.level-bar div {
  background-color: var(--yellow);
  border-radius: 100px;
  width: 70%;
  height: 100%;
}

/* ===== Cross-sell v2: mini arch ===== */

.cross-sell-card {
  background-image: none;
  align-items: center;
  padding: 2.75rem 3rem;
}

.cross-sell-copy {
  flex-direction: column;
  align-items: flex-start;
  display: flex;
}

.cross-sell-copy .button {
  margin-top: 1.5rem;
}

.mini-arch {
  aspect-ratio: 4 / 5;
  background-color: var(--yellow);
  border-radius: 999px 999px .9rem .9rem;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 11rem;
  display: flex;
  position: relative;
  overflow: hidden;
  transform: rotate(2deg);
  box-shadow: 0 14px 30px #1c343321;
}

.mini-arch.green {
  background-color: var(--green);
}

.mini-word {
  font-family: var(--main--main-font);
  color: var(--light);
  font-size: 2rem;
  font-style: italic;
  line-height: 1;
  position: relative;
  z-index: 1;
}

.mini-arch .arch-skyline {
  height: 3.4rem;
}

/* ===== CTA slika: uz desnu ivicu, cutout sme da prelazi okvir (bez overflow:hidden, da se ne sece) ===== */

.cta-image {
  right: 0;
}

@media screen and (max-width: 991px) {
  .section.english-course-hero {
    padding-bottom: 5rem;
  }

  .hero-arch-box {
    max-width: 22rem;
    margin-top: 1.5rem;
  }

  .hero-float.bubble {
    left: -3%;
  }

  .hero-float.level {
    right: -3%;
  }
}

@media screen and (max-width: 767px) {
  .section.english-course-hero {
    padding-bottom: 4rem;
  }

  .hero-arch-box {
    max-width: 19rem;
  }

  .arch-word {
    font-size: 3.4rem;
  }

  .arch-skyline {
    height: 6rem;
  }

  .level-card {
    min-width: 10rem;
    padding: .8rem 1rem;
  }

  .level-path {
    font-size: var(--heading--heading-h6);
  }

  .cross-sell-card {
    background-image: none;
    flex-direction: column;
    align-items: flex-start;
    gap: 1.5rem;
    padding: 2rem 1.5rem;
  }

  .mini-arch {
    align-self: center;
    width: 10rem;
  }
}

.mini-arch {
  box-shadow: 0 8px 18px #1c343319;
}

/* ===== Hero v3: chat-balon umesto luka + skyline bez maske (radi i preko file://) ===== */

.hero-arch {
  aspect-ratio: 1 / 1.05;
  border-radius: 2.5rem 2.5rem 2.5rem .6rem;
  max-width: 27rem;
}

.hero-arch-box {
  max-width: 27rem;
}

.arch-skyline {
  -webkit-mask: none;
  mask: none;
  background-color: #0000;
  background-image: url('../images/England-cream.svg');
  background-position: 0 100%;
  background-repeat: repeat-x;
  background-size: auto 100%;
  opacity: .32;
  height: 7rem;
}

.arch-skyline.spain {
  -webkit-mask: none;
  mask: none;
  background-image: url('../images/Spain-cream.svg');
}

.hero-float.bubble {
  top: -4%;
  left: -6%;
}

.hero-float.reply {
  top: 10%;
  right: -6%;
  transform: rotate(2deg);
}

.hero-float.level {
  bottom: -4%;
  right: -5%;
}

.mini-arch {
  aspect-ratio: 1 / 1;
  border-radius: 1.3rem 1.3rem 1.3rem .35rem;
}

@media screen and (max-width: 991px) {
  .hero-float.bubble {
    top: -4%;
    left: -2%;
  }

  .hero-float.reply {
    top: 9%;
    right: -2%;
  }

  .hero-float.level {
    bottom: -4%;
    right: -2%;
  }
}

@media screen and (max-width: 767px) {
  .arch-skyline {
    height: 5.5rem;
  }
}

.chat-bubble.gold {
  background-color: var(--yellow);
  color: var(--light);
}

/* ===== Hover efekti za dugmad (samo desktop / mis) ===== */

.button,
.button-variant {
  transition: background-color .25s, color .25s, border-color .25s, transform .25s, box-shadow .25s;
}

@media (hover: hover) and (pointer: fine) {
  .button:hover {
    background-color: #2c4a47;
    color: var(--neutral);
    transform: translateY(-2px);
    box-shadow: 0 10px 24px #1c343340;
  }

  .button:active {
    background-color: var(--green);
    transform: translateY(0);
    box-shadow: 0 4px 10px #1c343333;
  }

  .button-variant:hover {
    background-color: var(--yellow);
    border-color: var(--yellow);
    color: var(--neutral);
    transform: translateY(-2px);
    box-shadow: 0 10px 24px #a7846352;
  }

  .button-variant:active {
    transform: translateY(0);
    box-shadow: 0 4px 10px #a7846340;
  }
}

/* ===== Mobile: full-width dugmad i cross-sell mini ===== */

@media screen and (max-width: 767px) {
  .hero-button-wrap {
    flex-direction: column;
    width: 100%;
  }

  .steps-cta,
  .steps-cta .button,
  .cross-sell-copy,
  .cross-sell-copy .button,
  .cta-wrapper .button-variant {
    width: 100%;
  }

  .cross-sell-card {
    gap: 1.75rem;
  }

  .mini-arch {
    aspect-ratio: auto;
    align-self: stretch;
    width: 100%;
    height: 11rem;
    margin-top: .5rem;
    transform: none;
  }
}

/* ===== CEFR tooltip oblacici ===== */

.cefr-pill {
  cursor: default;
  position: relative;
}

.cefr-pill[data-tip]:after {
  content: attr(data-tip);
  pointer-events: none;
  visibility: hidden;
  opacity: 0;
  z-index: 30;
  background-color: var(--neutral);
  color: var(--dark);
  letter-spacing: 0;
  font-size: var(--main--text-xxs);
  font-weight: 400;
  line-height: 1.45;
  white-space: normal;
  border-radius: .8rem .8rem .8rem .2rem;
  width: 13.5rem;
  padding: .7rem .9rem;
  transition: opacity .2s, transform .2s, visibility .2s;
  position: absolute;
  bottom: calc(100% + .6rem);
  left: 0;
  transform: translateY(6px);
  box-shadow: 0 12px 28px #1c343342;
}

@media (hover: hover) and (pointer: fine) {
  .cefr-pill[data-tip]:hover {
    border-color: var(--neutral);
    background-color: #f4f1eb1f;
  }

  .cefr-pill[data-tip]:hover:after {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
  }
}

/* ===== Anchor offset: vise prostora ispod sticky barova ===== */

.program-section {
  scroll-margin-top: 12rem;
}

/* ===== Mobilni navbar: ritam, dugme, kontakt kartica ===== */

@media screen and (max-width: 991px) {
  .nav-dropdown-link {
    padding: .75rem 0;
  }

  .nav-menu-link-wrap > .button {
    width: 100%;
    margin-top: .75rem;
  }

  .nav-menu-contact-info-wrap {
    width: 100%;
    margin-top: 2.5rem;
  }
}

@media screen and (max-width: 767px) {
  .cross-sell-copy .button-variant {
    width: 100%;
  }
}

/* GSAP ScrollToPlugin preuzima smooth scroll — CSS smooth se bije sa njim */
html {
  scroll-behavior: auto;
}

.cross-sell-copy .button-variant {
  margin-top: 1.5rem;
}

/* ===================================================== */
/* ===== Blog stranica ================================= */
/* ===================================================== */

.blog-hero {
  padding-bottom: var(--main--size--size-xl);
}

.blog-hero .preheading {
  justify-content: center;
  display: flex;
}

.blog-hero h1 {
  max-width: 60rem;
}

/* ----- Izdvojeni clanak ----- */

.featured-post {
  grid-column-gap: var(--main--size--size-2xl);
  grid-row-gap: var(--main--size--size-l);
  background-color: var(--neutral);
  border-radius: 1.5rem;
  grid-template-rows: auto;
  grid-template-columns: 1.15fr 1fr;
  align-items: stretch;
  width: 100%;
  max-width: none;
  text-decoration: none;
  display: grid;
  overflow: hidden;
  box-shadow: 0 14px 40px #1c34330f;
}

.featured-media {
  position: relative;
  overflow: hidden;
  min-height: 24rem;
}

.featured-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  inset: 0;
  transition: transform .5s ease;
}

.featured-post:hover .featured-media img {
  transform: scale(1.04);
}

.featured-flag {
  z-index: 2;
  background-color: var(--green);
  color: var(--light);
  font-size: var(--main--text-xxs);
  letter-spacing: .03em;
  border-radius: 100px;
  padding: .4rem 1rem;
  position: absolute;
  top: 1.25rem;
  left: 1.25rem;
}

.featured-body {
  flex-direction: column;
  align-items: flex-start;
  padding: var(--main--size--size-2xl) var(--main--size--size-2xl) var(--main--size--size-2xl) 0;
  display: flex;
}

.post-meta-row {
  grid-column-gap: .5rem;
  grid-row-gap: .4rem;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: var(--main--size--size-s);
  display: flex;
}

.post-cat {
  background-color: var(--llight-darker);
  color: var(--green);
  font-family: var(--main--second-font);
  font-size: var(--main--text-xxs);
  font-weight: 500;
  border-radius: 100px;
  padding: .35rem .85rem;
}

.post-meta {
  color: var(--neutral-500);
  font-size: var(--main--text-xxs);
}

.featured-body h2 {
  margin-bottom: var(--main--size--size-s);
}

.featured-body p {
  color: var(--neutral-600);
  margin-bottom: var(--main--size--size-l);
}

/* ----- Toolbar: filteri + pretraga ----- */

.blog-toolbar {
  grid-column-gap: var(--main--size--size-m);
  grid-row-gap: var(--main--size--size-m);
  border-bottom: 1px solid var(--llight-darker);
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin-bottom: var(--main--size--size-xl);
  padding-bottom: var(--main--size--size-m);
  display: flex;
}

.filter-pills {
  grid-column-gap: .5rem;
  grid-row-gap: .5rem;
  flex-wrap: wrap;
  display: flex;
}

.filter-pill {
  cursor: pointer;
  color: var(--green);
  background-color: #0000;
  border: 1px solid var(--llight-darker);
  border-radius: 100px;
  padding: .5rem 1.1rem;
  font-family: var(--main--second-font);
  font-size: var(--main--text-xs);
  transition: background-color .2s, color .2s, border-color .2s;
}

.filter-pill.is-active {
  background-color: var(--green);
  border-color: var(--green);
  color: var(--light);
}

.blog-search {
  position: relative;
  flex-shrink: 0;
  width: 16rem;
}

.blog-search input {
  width: 100%;
  height: 2.85rem;
  margin-bottom: 0;
  padding: 0 1rem 0 2.6rem;
  border: 1px solid var(--llight-darker);
  border-radius: 100px;
  background-color: var(--neutral);
  font-family: var(--main--second-font);
  font-size: var(--main--text-xs);
  color: var(--dark);
  transition: border-color .2s;
}

.blog-search input:focus {
  border-color: var(--yellow);
  outline: none;
}

.blog-search .search-icon {
  pointer-events: none;
  color: var(--neutral-500);
  position: absolute;
  top: 50%;
  left: 1rem;
  transform: translateY(-50%);
}

/* ----- Custom dropdown (mobilni filter) ----- */

.blog-dropdown {
  position: relative;
  display: none;
}

.blog-dropdown-toggle {
  cursor: pointer;
  color: var(--green);
  background-color: var(--neutral);
  border: 1px solid var(--llight-darker);
  border-radius: 100px;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 2.85rem;
  padding: 0 1.25rem;
  font-family: var(--main--second-font);
  font-size: var(--main--text-s);
  display: flex;
}

.blog-dropdown-caret {
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  width: .5rem;
  height: .5rem;
  margin-top: -.2rem;
  transition: transform .2s;
  transform: rotate(45deg);
}

.blog-dropdown.is-open .blog-dropdown-caret {
  transform: rotate(225deg)translateY(-.15rem);
}

.blog-dropdown-menu {
  z-index: 50;
  background-color: var(--neutral);
  border-radius: 1rem;
  flex-direction: column;
  width: 100%;
  padding: .5rem;
  display: flex;
  position: absolute;
  top: calc(100% + .5rem);
  left: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity .2s, transform .2s, visibility .2s;
  transform: translateY(.4rem);
  box-shadow: 0 14px 34px #1c343321;
}

.blog-dropdown.is-open .blog-dropdown-menu {
  opacity: 1;
  visibility: visible;
  transform: none;
}

.blog-dropdown-option {
  cursor: pointer;
  color: var(--green);
  text-align: left;
  background-color: #0000;
  border: none;
  border-radius: .6rem;
  padding: .7rem 1rem;
  font-family: var(--main--second-font);
  font-size: var(--main--text-s);
  transition: background-color .15s;
}

.blog-dropdown-option:hover {
  background-color: var(--light);
}

.blog-dropdown-option.is-active {
  background-color: var(--llight-darker);
  font-weight: 500;
}

/* ----- Grid clanaka ----- */

.blog-grid {
  grid-column-gap: var(--main--size--size-l);
  grid-row-gap: var(--main--size--size-2xl);
  grid-template-columns: repeat(3, 1fr);
  width: 100%;
  display: grid;
}

.blog-card {
  flex-direction: column;
  align-items: flex-start;
  text-decoration: none;
  display: flex;
}

.blog-card.is-hidden,
.blog-card.is-filtered {
  display: none;
}

.blog-card-media {
  aspect-ratio: 3 / 2;
  background-color: var(--llight-darker);
  border-radius: 1rem;
  width: 100%;
  margin-bottom: var(--main--size--size-s);
  overflow: hidden;
}

.blog-card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s ease;
}

.blog-card:hover .blog-card-media img {
  transform: scale(1.05);
}

.blog-card h3 {
  color: var(--dark);
  margin-top: .4rem;
  margin-bottom: .5rem;
  font-size: var(--heading--heading-h6);
  line-height: 1.3;
  transition: color .2s;
}

.blog-card:hover h3 {
  color: var(--yellow);
}

.blog-card p {
  color: var(--neutral-600);
  font-size: var(--main--text-xs);
  margin-bottom: var(--main--size--size-s);
}

.blog-empty {
  color: var(--neutral-500);
  text-align: center;
  width: 100%;
  padding: var(--main--size--size-2xl) 0;
  display: none;
}

.blog-empty.is-visible {
  display: block;
}

.blog-loadmore {
  justify-content: center;
  margin-top: var(--main--size--size-2xl);
  display: flex;
}

/* ----- Newsletter CTA ----- */

.newsletter {
  text-align: center;
  background-color: var(--green);
  color: var(--neutral);
  border-radius: 1.5rem;
  flex-direction: column;
  align-items: center;
  padding: var(--main--size--size-3xl) var(--main--size--size-2xl);
  display: flex;
}

.newsletter h2 {
  max-width: 36rem;
  margin-bottom: var(--main--size--size-s);
}

.newsletter p {
  color: #f4f1ebc7;
  max-width: 34rem;
  margin-bottom: var(--main--size--size-l);
}

.newsletter-form {
  grid-column-gap: .6rem;
  background-color: var(--neutral);
  border-radius: 100px;
  width: 100%;
  max-width: 30rem;
  padding: .4rem .4rem .4rem 1.25rem;
  display: flex;
}

.newsletter-form input[type="email"] {
  color: var(--dark);
  background-color: #0000;
  border: none;
  flex: 1;
  min-width: 0;
  height: 3rem;
  margin-bottom: 0;
  font-family: var(--main--second-font);
  font-size: var(--main--text-s);
}

.newsletter-form input[type="email"]:focus {
  outline: none;
}

.newsletter-form .button {
  white-space: nowrap;
  flex-shrink: 0;
  text-align: center;
}

.newsletter-note {
  color: #f4f1eb87;
  font-size: var(--main--text-xxs);
  margin-top: var(--main--size--size-s);
}

/* Success/error messages inside the dark newsletter section: the section sets
   color: var(--neutral) (white) while .success-message bg is also white, so the
   text needs an explicit dark color to be visible. */
.newsletter .success-message {
  color: var(--green);
  max-width: 30rem;
}

.newsletter .success-message-wrap {
  justify-content: center;
}

.newsletter .w-form-fail {
  color: var(--dark);
}

/* ----- Netlify forms (honeypot spam field) ----- */

.hp-field {
  position: absolute;
  left: -9999px;
  top: -9999px;
}

/* ----- Responsive ----- */

@media screen and (max-width: 991px) {
  .featured-post {
    grid-template-columns: 1fr;
  }

  .featured-media {
    min-height: 18rem;
  }

  .featured-body {
    padding: 0 var(--main--size--size-xl) var(--main--size--size-xl);
  }

  .blog-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media screen and (max-width: 767px) {
  .blog-toolbar {
    flex-direction: column;
    align-items: stretch;
  }

  .filter-pills {
    display: none;
  }

  .blog-dropdown {
    display: block;
  }

  .blog-search {
    width: 100%;
  }

  .blog-grid {
    grid-template-columns: 1fr;
    grid-row-gap: var(--main--size--size-xl);
  }

  .newsletter {
    padding: var(--main--size--size-2xl) var(--main--size--size-m);
  }

  .newsletter-form {
    background-color: #0000;
    border-radius: 0;
    flex-direction: column;
    grid-row-gap: .75rem;
    padding: 0;
  }

  .newsletter-form input[type="email"] {
    width: 100%;
    height: 3.6rem;
    background-color: var(--neutral);
    border-radius: 100px;
    padding: 1rem 1.5rem;
    font-size: var(--main--text-m);
  }

  .newsletter-form .button {
    width: 100%;
    height: 3.6rem;
    background-color: var(--light);
    color: var(--green);
  }
}

/* ===================================================== */
/* ===== Blog clanak (single post) ===================== */
/* ===================================================== */

.read-progress {
  z-index: 1000;
  background-color: var(--yellow);
  width: 0%;
  height: 3px;
  position: fixed;
  top: 0;
  left: 0;
}

.post-header {
  text-align: center;
  flex-direction: column;
  align-items: center;
  max-width: 52rem;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.post-breadcrumb {
  color: var(--neutral-500);
  font-family: var(--main--second-font);
  font-size: var(--main--text-xs);
  margin-bottom: var(--main--size--size-m);
}

.post-breadcrumb a {
  color: var(--neutral-500);
  text-decoration: none;
  transition: color .2s;
}

.post-breadcrumb a:hover {
  color: var(--green);
}

.post-head-cats {
  grid-column-gap: .5rem;
  grid-row-gap: .5rem;
  flex-wrap: wrap;
  justify-content: center;
  margin-bottom: var(--main--size--size-s);
  display: flex;
}

.post-header h1 {
  margin-bottom: var(--main--size--size-m);
}

.post-headmeta {
  grid-column-gap: .75rem;
  color: var(--neutral-600);
  font-family: var(--main--second-font);
  font-size: var(--main--text-s);
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  display: flex;
}

.post-headmeta .dot {
  color: var(--neutral-400);
}

.post-share {
  grid-column-gap: .6rem;
  align-items: center;
  margin-top: var(--main--size--size-l);
  display: flex;
}

.post-share-label {
  color: var(--neutral-500);
  font-family: var(--main--second-font);
  font-size: var(--main--text-xxs);
  margin-right: .25rem;
}

.share-btn {
  color: var(--green);
  cursor: pointer;
  background-color: var(--neutral);
  border: 1px solid var(--llight-darker);
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 2.6rem;
  height: 2.6rem;
  padding: 0;
  transition: background-color .2s, color .2s, border-color .2s, transform .2s;
  display: flex;
}

.share-btn svg {
  width: 1.05rem;
  height: 1.05rem;
}

.share-btn.copied {
  background-color: var(--green);
  border-color: var(--green);
  color: var(--light);
}

@media (hover: hover) and (pointer: fine) {
  .share-btn:hover {
    background-color: var(--green);
    border-color: var(--green);
    color: var(--light);
    transform: translateY(-2px);
  }
}

.post-thumb {
  aspect-ratio: 16 / 9;
  border-radius: 1.5rem;
  width: 100%;
  margin-top: var(--main--size--size-xl);
  overflow: hidden;
}

.post-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ----- Dvokolonski layout: TOC + sadrzaj ----- */

.post-layout {
  grid-column-gap: var(--main--size--size-3xl);
  grid-row-gap: var(--main--size--size-l);
  grid-template-columns: 15rem minmax(0, 1fr);
  align-items: start;
  width: 100%;
  display: grid;
}

.post-toc {
  position: sticky;
  top: 6.5rem;
}

.post-toc-title {
  color: var(--neutral-500);
  letter-spacing: .04em;
  text-transform: uppercase;
  font-family: var(--main--second-font);
  font-size: var(--main--text-xxs);
  font-weight: 500;
  margin-bottom: var(--main--size--size-s);
}

.post-toc-list {
  border-left: 1px solid var(--llight-darker);
  flex-direction: column;
  display: flex;
}

.toc-link {
  color: var(--neutral-600);
  border-left: 2px solid #0000;
  margin-left: -1px;
  padding: .45rem 0 .45rem 1rem;
  font-family: var(--main--second-font);
  font-size: var(--main--text-xs);
  line-height: 1.4;
  text-decoration: none;
  transition: color .2s, border-color .2s;
}

.toc-link:hover {
  color: var(--green);
}

.toc-link.is-active {
  color: var(--green);
  border-left-color: var(--yellow);
  font-weight: 500;
}

/* ----- Mobilni TOC dropdown ----- */

.post-toc-mobile {
  display: none;
}

.post-toc-toggle {
  cursor: pointer;
  color: var(--green);
  background-color: var(--neutral);
  border: 1px solid var(--llight-darker);
  border-radius: 100px;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 3rem;
  padding: 0 1.25rem;
  font-family: var(--main--second-font);
  font-size: var(--main--text-s);
  display: flex;
}

.post-toc-toggle .nav-caret {
  border-color: currentColor;
}

.post-toc-mobile.is-open .nav-caret {
  transform: rotate(225deg)translateY(-.15rem);
}

.post-toc-mobile-list {
  background-color: var(--neutral);
  border: 1px solid var(--llight-darker);
  border-radius: 1rem;
  flex-direction: column;
  margin-top: .5rem;
  padding: .5rem;
  display: none;
}

.post-toc-mobile.is-open .post-toc-mobile-list {
  display: flex;
}

.post-toc-mobile-list .toc-link {
  border-left: none;
  border-radius: .6rem;
  margin-left: 0;
  padding: .7rem 1rem;
}

.post-toc-mobile-list .toc-link.is-active {
  background-color: var(--llight-darker);
}

/* ----- Sadrzaj (prose) ----- */

.post-content {
  max-width: 46rem;
}

.key-takeaways {
  background-color: var(--llight-darker);
  border-radius: 1.25rem;
  margin-bottom: var(--main--size--size-xl);
  padding: var(--main--size--size-l) var(--main--size--size-xl);
}

.key-takeaways-title {
  grid-column-gap: .6rem;
  color: var(--green);
  align-items: center;
  margin-bottom: var(--main--size--size-s);
  font-family: var(--main--main-font);
  font-size: var(--heading--heading-h6);
  display: flex;
}

.key-takeaways .check-list {
  gap: .75rem;
}

.post-body {
  color: var(--neutral-600);
  font-family: var(--main--second-font);
  font-size: var(--main--text-m);
  line-height: 1.75;
}

.post-body > h2 {
  color: var(--dark);
  scroll-margin-top: 6.5rem;
  margin-top: 2.5rem;
  margin-bottom: var(--main--size--size-s);
  font-size: var(--heading--heading-h4);
  line-height: 1.2;
}

.post-body > h2:first-child {
  margin-top: 0;
}

.post-body h3 {
  color: var(--dark);
  margin-top: var(--main--size--size-l);
  margin-bottom: var(--main--size--size-2xs);
  font-size: var(--heading--heading-h6);
}

.post-body p {
  margin-top: 0;
  margin-bottom: var(--main--size--size-m);
}

.post-body a:not(.button):not(.button-variant) {
  color: var(--green);
  border-bottom: 1px solid var(--yellow);
  text-decoration: none;
}

.post-body strong {
  color: var(--dark);
  font-weight: 600;
}

.post-body ul {
  margin: 0 0 var(--main--size--size-m);
  padding-left: 1.2rem;
}

.post-body li {
  margin-bottom: .5rem;
}

.post-body blockquote {
  border-left: 3px solid var(--yellow);
  color: var(--green);
  margin: var(--main--size--size-l) 0;
  padding: .25rem 0 .25rem 1.25rem;
  font-family: var(--main--main-font);
  font-size: var(--main--text-l);
  font-style: italic;
}

/* fraze lista (npr. spanski clanak) */
.phrase-list {
  border-top: 1px solid var(--llight-darker);
  margin: var(--main--size--size-m) 0 var(--main--size--size-l);
}

.phrase-row {
  border-bottom: 1px solid var(--llight-darker);
  justify-content: space-between;
  grid-column-gap: 1rem;
  align-items: baseline;
  padding: .8rem 0;
  display: flex;
}

.phrase-orig {
  color: var(--green);
  font-family: var(--main--main-font);
  font-size: var(--main--text-l);
}

.phrase-tr {
  color: var(--neutral-500);
  font-size: var(--main--text-s);
  text-align: right;
  flex-shrink: 0;
}

/* ----- Inline CTA (na pola teksta) ----- */

.inline-cta {
  background-color: var(--green);
  color: var(--neutral);
  border-radius: 1.25rem;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--main--size--size-s);
  margin: var(--main--size--size-2xl) 0;
  padding: var(--main--size--size-xl);
  display: flex;
  position: relative;
  overflow: hidden;
}

.inline-cta-flag {
  color: var(--yellow);
  font-family: var(--main--second-font);
  font-size: var(--main--text-xxs);
  letter-spacing: .04em;
  text-transform: uppercase;
  font-weight: 500;
}

.inline-cta h3 {
  color: var(--light);
  max-width: 28rem;
  font-size: var(--heading--heading-h5);
}

.inline-cta p {
  color: #f4f1ebc7;
  max-width: 30rem;
  margin: 0;
  font-family: var(--main--second-font);
  font-size: var(--main--text-s);
  line-height: 1.5;
}

.inline-cta .button {
  margin-top: var(--main--size--size-2xs);
}

/* ----- Final thoughts ----- */

.post-final {
  border-top: 1px solid var(--llight-darker);
  margin-top: var(--main--size--size-2xl);
  padding-top: var(--main--size--size-xl);
}

/* ----- About the author ----- */

.author-card {
  grid-column-gap: var(--main--size--size-l);
  background-color: var(--llight-darker);
  border-radius: 1.5rem;
  align-items: center;
  width: 100%;
  padding: var(--main--size--size-xl);
  display: flex;
}

.author-photo {
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: 50%;
  flex-shrink: 0;
  width: 7rem;
  height: 7rem;
}

.author-body {
  flex-direction: column;
  align-items: flex-start;
  display: flex;
}

.author-label {
  color: var(--neutral-500);
  letter-spacing: .04em;
  text-transform: uppercase;
  font-family: var(--main--second-font);
  font-size: var(--main--text-xxs);
  font-weight: 500;
  margin-bottom: .35rem;
}

.author-name {
  color: var(--green);
  margin-bottom: .5rem;
  font-family: var(--main--main-font);
  font-size: var(--heading--heading-h5);
}

.author-bio {
  color: var(--neutral-600);
  font-size: var(--main--text-s);
  line-height: 1.6;
  margin-bottom: var(--main--size--size-m);
}

.author-links {
  grid-column-gap: .75rem;
  flex-wrap: wrap;
  align-items: center;
  display: flex;
}

/* ----- Ukratko (summary) ----- */

.post-summary {
  text-align: center;
  flex-direction: column;
  align-items: center;
  max-width: 46rem;
  margin: 0 auto;
  display: flex;
}

.post-summary h2 {
  margin-bottom: var(--main--size--size-s);
}

.post-summary p {
  color: var(--neutral-600);
  max-width: 38rem;
}

/* ----- Responsive ----- */

@media screen and (max-width: 991px) {
  .post-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .post-toc {
    display: none;
  }

  .post-toc-mobile {
    margin-bottom: var(--main--size--size-l);
    display: block;
  }

  .post-content {
    max-width: none;
  }
}

@media screen and (max-width: 767px) {
  .post-thumb {
    aspect-ratio: 3 / 2;
    border-radius: 1rem;
  }

  .author-card {
    text-align: center;
    flex-direction: column;
    align-items: center;
    grid-row-gap: var(--main--size--size-m);
    padding: var(--main--size--size-2xl) var(--main--size--size-l);
  }

  .author-body {
    align-items: center;
  }

  .author-name {
    margin-bottom: var(--main--size--size-2xs);
  }

  .author-bio {
    margin-bottom: var(--main--size--size-l);
    line-height: 1.7;
  }

  .author-links {
    flex-direction: column;
    grid-row-gap: var(--main--size--size-s);
    justify-content: center;
    align-items: stretch;
    width: auto;
  }

  .author-links .button,
  .author-links .button-variant {
    width: 100%;
    text-align: center;
  }

  .post-body {
    font-size: var(--main--text-s);
  }

  .inline-cta {
    padding: var(--main--size--size-l);
  }

  .phrase-row {
    flex-direction: column;
    gap: .15rem;
  }

  .phrase-tr {
    text-align: left;
  }
}

/* ===== Pravne stranice (politika privatnosti i sl.) ===== */

.legal-content {
  max-width: 46rem;
  margin-left: auto;
  margin-right: auto;
}

.legal-content .post-body h2 {
  scroll-margin-top: 6.5rem;
  margin-top: 2.5rem;
  margin-bottom: var(--main--size--size-s);
  color: var(--dark);
  font-size: var(--heading--heading-h5);
  line-height: 1.2;
}

.legal-content .post-body h2:first-child {
  margin-top: 0;
}

.footer-copyright a {
  color: var(--neutral-500);
  text-decoration: underline;
  transition: color .2s;
}

.footer-copyright a:hover {
  color: var(--light);
}

/* ===== Prebacivac jezika (lokalizacija) ===== */

.lang-switch .nav-dropdown-toggle {
  letter-spacing: .04em;
  text-transform: uppercase;
  font-family: var(--main--second-font);
  font-size: var(--main--text-xs);
}

.lang-switch .nav-dropdown-list {
  min-width: 9rem;
  left: auto;
  right: 0;
  transform: translateY(.5rem);
}

.lang-switch:hover .nav-dropdown-list,
.lang-switch:focus-within .nav-dropdown-list {
  transform: translateY(0);
}

@media screen and (max-width: 991px) {
  .lang-switch .nav-dropdown-list {
    right: auto;
  }
}

@media screen and (max-width: 991px) {
  .lang-switch {
    border-top: 1px solid var(--llight-darker);
    width: 100%;
    margin-top: var(--main--size--size-2xs);
    padding-top: var(--main--size--size-m);
  }
}

/* ===== Zastave + mobilni dropdown za prebacivac jezika ===== */

.lang-flag {
  width: 1.2rem;
  height: auto;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  border-radius: 2px;
  flex-shrink: 0;
  box-shadow: 0 0 0 1px #1c343318;
}

.lang-switch .nav-dropdown-toggle {
  grid-column-gap: .4rem;
  align-items: center;
  display: flex;
}

.lang-switch .nav-dropdown-link {
  grid-column-gap: .55rem;
  align-items: center;
  display: flex;
}

/* na mobilnom: ostaje kompaktan dropdown (ne siri se u listu) */
@media screen and (max-width: 991px) {
  .lang-switch {
    border-top: none;
    width: auto;
    margin-top: 0;
    padding-top: 0;
  }

  .lang-switch .nav-dropdown-toggle {
    display: flex;
  }

  .lang-switch .nav-dropdown-list {
    z-index: 1000;
    background-color: var(--neutral);
    border-radius: 1rem;
    min-width: 11rem;
    padding: .5rem;
    grid-row-gap: 0;
    display: flex;
    position: absolute;
    top: 100%;
    left: 0;
    right: auto;
    opacity: 0;
    visibility: hidden;
    transform: translateY(.4rem);
    box-shadow: 0 14px 34px #1c343321;
  }

  .lang-switch:hover .nav-dropdown-list,
  .lang-switch:focus-within .nav-dropdown-list {
    opacity: 1;
    visibility: visible;
    transform: none;
  }

  .lang-switch .nav-dropdown-link {
    border-radius: .6rem;
    padding: .65rem .8rem;
    font-size: var(--main--text-m);
  }
}

/* Fix: na mobilnom main-card postaje svetla, pa .text-neutral pasus mora tamno */
@media screen and (max-width: 767px) {
  .benefits-card.main-card .text-neutral {
    color: var(--dark);
  }
}

/* ===== Popup: izbor jezika za besplatan test ===== */

.test-modal {
  z-index: 2000;
  justify-content: center;
  align-items: center;
  padding: 1.5rem;
  display: flex;
  position: fixed;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity .25s, visibility .25s;
}

.test-modal.is-open {
  opacity: 1;
  visibility: visible;
}

.test-modal-backdrop {
  background-color: #1c3433cc;
  position: absolute;
  inset: 0;
}

.test-modal-panel {
  text-align: center;
  background-color: var(--neutral);
  border-radius: 1.5rem;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: 34rem;
  max-height: calc(100vh - 3rem);
  padding: 2.75rem 2.5rem 2.5rem;
  display: flex;
  position: relative;
  overflow-y: auto;
  transition: transform .3s;
  transform: translateY(.9rem)scale(.97);
  box-shadow: 0 30px 80px #1c343352;
}

.test-modal.is-open .test-modal-panel {
  transform: none;
}

.test-modal-close {
  color: var(--green);
  cursor: pointer;
  background-color: var(--neutral);
  border: 1px solid var(--llight-darker);
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 2.4rem;
  height: 2.4rem;
  padding: 0;
  transition: background-color .2s, color .2s, border-color .2s;
  display: flex;
  position: absolute;
  top: 1rem;
  right: 1rem;
}

.test-modal-close:hover {
  background-color: var(--green);
  border-color: var(--green);
  color: var(--light);
}

.test-modal-panel h3 {
  margin-bottom: .5rem;
}

.test-modal-sub {
  color: var(--neutral-600);
  font-size: var(--main--text-s);
  margin-bottom: var(--main--size--size-l);
}

.test-modal-options {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  grid-template-columns: 1fr 1fr;
  width: 100%;
  display: grid;
}

.test-modal-option {
  background-color: var(--light);
  color: var(--dark);
  border-radius: 1.25rem;
  flex-direction: column;
  align-items: center;
  gap: .9rem;
  padding: 1.5rem 1.25rem;
  text-decoration: none;
  transition: transform .25s, box-shadow .25s;
  display: flex;
}

.test-modal-option:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 34px #1c343324;
}

.test-modal-option .mini-arch {
  width: 7.5rem;
}

.test-modal-option:first-child .mini-arch {
  transform: rotate(-2deg);
}

.test-modal-option .mini-word {
  font-size: 1.4rem;
}

.test-modal-option .arch-skyline {
  height: 2.4rem;
}

.test-modal-option-copy {
  flex-direction: column;
  align-items: center;
  gap: .35rem;
  display: flex;
}

.test-modal-option-name {
  grid-column-gap: .5rem;
  color: var(--green);
  font-family: var(--main--main-font);
  font-size: var(--heading--heading-h6);
  align-items: center;
  display: flex;
}

.test-modal-option .text-link {
  font-size: var(--main--text-xs);
  margin-top: .1rem;
}

@media screen and (max-width: 767px) {
  .test-modal {
    padding: 1rem;
  }

  .test-modal-panel {
    padding: 2.5rem 1.25rem 1.5rem;
  }

  .test-modal-options {
    grid-template-columns: 1fr;
  }

  .test-modal-option {
    flex-direction: row;
    text-align: left;
    justify-content: flex-start;
    gap: 1.1rem;
    padding: 1rem 1.25rem;
  }

  .test-modal-option .mini-arch {
    flex-shrink: 0;
    width: 4.6rem;
  }

  .test-modal-option .mini-word {
    font-size: .95rem;
  }

  .test-modal-option .arch-skyline {
    height: 1.5rem;
  }

  .test-modal-option-copy {
    align-items: flex-start;
  }
}

/* Fix: mini-arch u modalu na mobilnom ne sme da nasledi cross-sell stretch */
@media screen and (max-width: 767px) {
  .test-modal-option .mini-arch {
    aspect-ratio: 1 / 1;
    align-self: auto;
    width: 4.6rem;
    height: auto;
    margin-top: 0;
    transform: rotate(2deg);
  }

  .test-modal-option:first-child .mini-arch {
    transform: rotate(-2deg);
  }
}

/* ===== Hajlajt paketa i popusta u cenovniku ===== */

.pricing-deal {
  background-color: var(--yellow);
  color: var(--green);
  border-radius: .75rem;
  align-items: center;
  gap: .6rem;
  padding: .7rem .9rem;
  font-size: var(--main--text-xs);
  line-height: 1.35;
  display: flex;
}

.pricing-deal strong {
  font-weight: 600;
}

.pricing-deal-badge {
  background-color: var(--green);
  color: var(--light);
  flex-shrink: 0;
  border-radius: 100px;
  padding: .2rem .55rem;
  font-size: var(--main--text-xxs);
  font-weight: 600;
}

/* ===== Kombinovana ilustracija (boarding pass + chat) ===== */

.motif-combo {
  flex-direction: column;
  align-items: center;
  gap: .9rem;
  width: 100%;
  max-width: 22rem;
  display: flex;
}

.motif-combo .motif-card {
  max-width: none;
  width: 100%;
}

.motif-combo-chat {
  flex-direction: column;
  gap: .6rem;
  width: 100%;
  margin-top: -.35rem;
  display: flex;
  position: relative;
  z-index: 2;
}

/* ===== Custom select (kontakt forma) ===== */
.custom-select {
  position: relative;
  width: 100%;
}

/* Native <select> ostaje u DOM-u zbog Netlify detekcije polja i slanja vrednosti,
   ali je vizuelno sakriven. Ne koristimo display:none da bi ostao "focusable"
   za nativnu required validaciju (bubble se pojavi na pravom mestu). */
.custom-select__native {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  opacity: 0;
  pointer-events: none;
}

.custom-select__trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  width: 100%;
  cursor: pointer;
  text-align: left;
  font: inherit;
  line-height: 1.2;
  color: var(--dark);
  -webkit-appearance: none;
  appearance: none;
}

.custom-select__value {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.custom-select__trigger.is-placeholder .custom-select__value {
  color: var(--neutral-500);
}

.custom-select__caret {
  flex: none;
  width: .5rem;
  height: .5rem;
  margin-top: -.2rem;
  border-right: 1.5px solid var(--green);
  border-bottom: 1.5px solid var(--green);
  transform: rotate(45deg);
  transition: transform .2s;
}

.custom-select.is-open .custom-select__caret {
  transform: rotate(225deg) translateY(-.15rem);
}

.custom-select.is-open .custom-select__trigger,
.custom-select__trigger:focus-visible {
  outline: none;
  border-color: var(--yellow);
}

.custom-select__panel {
  z-index: 1000;
  list-style: none;
  background-color: var(--neutral);
  border: 1px solid #a784634d;
  border-radius: 1rem;
  min-width: 100%;
  max-height: 15rem;
  margin: 0;
  padding: .5rem;
  position: absolute;
  top: calc(100% + .4rem);
  left: 0;
  right: 0;
  opacity: 0;
  visibility: hidden;
  overflow-y: auto;
  transition: opacity .2s, transform .2s, visibility .2s;
  transform: translateY(.4rem);
  box-shadow: 0 14px 34px #1c343321;
}

.custom-select.is-open .custom-select__panel {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.custom-select__option {
  color: var(--green);
  border-radius: .6rem;
  padding: .65rem 1rem;
  font-size: 1rem;
  cursor: pointer;
  transition: background-color .15s;
}

.custom-select__option.is-active,
.custom-select__option:hover {
  background-color: var(--llight-darker);
}

.custom-select__option.is-selected {
  font-weight: 600;
}