/* Start custom CSS for html, class: .elementor-element-25d0e3b *//* ==========================================
   MIGR8 - SCHOOL OF LANGUAGES
   ABOUT US PAGE CSS
   ========================================== */

:root {
  --gl-orange: #FF9E20;
  --gl-teal: #215E61;
  --gl-black: #1D2128;
  --gl-light: #F4F2F2;
  --gl-white: #ffffff;
  --gl-border: #dedede;
  --gl-muted: #62666c;
}


/* RESET */

.gl-about-page,
.gl-about-page * {
  box-sizing: border-box;
}

.gl-about-page {
  font-family: Arial, Helvetica, sans-serif;
  color: var(--gl-black);
  background: var(--gl-white);
  line-height: 1.7;
  overflow: hidden;
}

.gl-about-page h1,
.gl-about-page h2,
.gl-about-page h3,
.gl-about-page p {
  margin-top: 0;
}

.gl-about-page a {
  text-decoration: none;
}

.gl-container {
  width: min(1180px, 92%);
  margin: auto;
}


/* COMMON */

.gl-eyebrow {
  display: inline-block;
  color: var(--gl-orange);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 2px;
  text-transform: uppercase;
  margin-bottom: 16px;
}

.gl-section-heading {
  max-width: 800px;
  margin-bottom: 55px;
}

.gl-section-heading.gl-center {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.gl-section-heading h2 {
  font-size: clamp(34px, 4vw, 52px);
  line-height: 1.12;
  margin-bottom: 20px;
  font-weight: 800;
}

.gl-section-heading h2 span,
.gl-about-hero-content h1 span,
.gl-why-content h2 span,
.gl-exams h2 span,
.gl-local-content h2 span,
.gl-final-cta h2 span {
  color: var(--gl-teal);
}

.gl-section-heading p {
  color: var(--gl-muted);
  font-size: 17px;
  line-height: 1.8;
}


/* BUTTONS */

.gl-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 12px 27px;
  border-radius: 6px;
  font-weight: 800;
  transition: all .25s ease;
}

.gl-btn-primary {
  background: var(--gl-orange);
  color: var(--gl-black);
}

.gl-btn-primary:hover {
  background: var(--gl-black);
  color: var(--gl-white);
  transform: translateY(-3px);
}

.gl-btn-outline {
  border: 2px solid var(--gl-teal);
  color: var(--gl-teal);
}

.gl-btn-outline:hover {
  background: var(--gl-teal);
  color: var(--gl-white);
}

.gl-btn-light {
  background: var(--gl-white);
  color: var(--gl-teal);
}

.gl-btn-light:hover {
  background: var(--gl-orange);
  color: var(--gl-black);
}


/* ==========================================
   HERO
   ========================================== */

.gl-about-hero {
  position: relative;
  padding: 100px 0 90px;
  background:
    radial-gradient(circle at 90% 20%, rgba(255,158,32,.14), transparent 25%),
    var(--gl-light);
}

.gl-about-hero-grid {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  align-items: center;
  gap: 70px;
}

.gl-about-hero-content h1 {
  font-size: clamp(43px, 5vw, 68px);
  line-height: 1.05;
  font-weight: 900;
  margin-bottom: 25px;
  letter-spacing: -1.5px;
}

.gl-about-hero-content h1 span {
  display: block;
  color: var(--gl-teal);
}

.gl-about-hero-content > p {
  color: var(--gl-muted);
  font-size: 18px;
  line-height: 1.85;
  max-width: 680px;
  margin-bottom: 30px;
}

.gl-hero-buttons {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
}

.gl-hero-highlights {
  display: flex;
  gap: 0;
  margin-top: 45px;
  border-top: 1px solid var(--gl-border);
  padding-top: 25px;
}

.gl-hero-highlights div {
  min-width: 145px;
  padding-right: 25px;
  margin-right: 25px;
  border-right: 1px solid var(--gl-border);
}

.gl-hero-highlights div:last-child {
  border: 0;
}

.gl-hero-highlights strong {
  display: block;
  color: var(--gl-teal);
  font-size: 22px;
  line-height: 1.2;
}

.gl-hero-highlights span {
  display: block;
  color: var(--gl-muted);
  font-size: 13px;
  margin-top: 5px;
}


/* HERO VISUAL */

.gl-about-hero-visual {
  min-height: 500px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.gl-circle {
  position: absolute;
  border-radius: 50%;
}

.gl-circle-one {
  width: 390px;
  height: 390px;
  border: 35px solid rgba(255,158,32,.20);
}

.gl-circle-two {
  width: 285px;
  height: 285px;
  border: 25px solid rgba(33,94,97,.13);
}

.gl-visual-main {
  position: relative;
  z-index: 3;
  width: 275px;
  height: 275px;
  border-radius: 50%;
  background: var(--gl-teal);
  color: white;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 35px;
  box-shadow: 0 25px 60px rgba(29,33,40,.18);
}

.gl-visual-icon {
  width: 58px;
  height: 58px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--gl-orange);
  color: var(--gl-black);
  font-size: 30px;
  font-weight: 900;
  margin-bottom: 15px;
}

.gl-visual-main h2 {
  margin-bottom: 4px;
  font-size: 28px;
}

.gl-visual-main p {
  margin: 0;
  color: rgba(255,255,255,.8);
  font-size: 14px;
}

.gl-language-card {
  position: absolute;
  z-index: 5;
  background: var(--gl-white);
  padding: 14px 20px;
  border-radius: 12px;
  box-shadow: 0 15px 40px rgba(29,33,40,.13);
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 800;
}

.gl-language-card span {
  font-size: 26px;
}

.gl-language-card-german {
  top: 50px;
  left: 20px;
}

.gl-language-card-french {
  top: 160px;
  right: 0;
}

.gl-language-card-english {
  bottom: 55px;
  left: 55px;
}


/* ==========================================
   INTRO
   ========================================== */

.gl-about-intro {
  padding: 110px 0;
  background: var(--gl-white);
}

.gl-intro-grid {
  display: grid;
  grid-template-columns: 1.3fr .7fr;
  gap: 70px;
  align-items: start;
}

.gl-intro-text p {
  color: var(--gl-muted);
  font-size: 17px;
  line-height: 1.9;
  margin-bottom: 22px;
}

.gl-intro-box {
  background: var(--gl-black);
  color: white;
  padding: 42px;
  border-radius: 18px;
  position: relative;
  overflow: hidden;
}

.gl-intro-box:after {
  content: "";
  position: absolute;
  width: 180px;
  height: 180px;
  border-radius: 50%;
  border: 25px solid rgba(255,158,32,.16);
  right: -60px;
  bottom: -60px;
}

.gl-box-number {
  color: var(--gl-orange);
  font-size: 14px;
  font-weight: 800;
}

.gl-intro-box h3 {
  font-size: 28px;
  margin: 12px 0;
}

.gl-intro-box > p {
  color: #ddd;
  margin-bottom: 25px;
}

.gl-intro-box ul {
  padding: 0;
  margin: 0;
  list-style: none;
}

.gl-intro-box li {
  position: relative;
  padding: 8px 0 8px 24px;
  border-bottom: 1px solid rgba(255,255,255,.1);
  color: #eee;
}

.gl-intro-box li:before {
  content: "✓";
  position: absolute;
  left: 0;
  color: var(--gl-orange);
  font-weight: 900;
}

.gl-text-link {
  display: inline-block;
  color: var(--gl-teal);
  font-weight: 800;
  margin-top: 10px;
}


/* ==========================================
   LANGUAGES
   ========================================== */

.gl-languages {
  padding: 110px 0;
  background: var(--gl-light);
}

.gl-language-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 25px;
}

.gl-language-box {
  background: white;
  padding: 38px;
  border-radius: 16px;
  border: 1px solid #e5e5e5;
  transition: all .3s ease;
}

.gl-language-box:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 50px rgba(29,33,40,.10);
}

.gl-language-box-dark {
  background: var(--gl-teal);
  color: white;
}

.gl-language-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 22px;
}

.gl-language-symbol {
  width: 62px;
  height: 62px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--gl-light);
  border-radius: 50%;
  font-size: 31px;
}

.gl-course-number {
  color: var(--gl-orange);
  font-weight: 900;
  font-size: 14px;
}

.gl-language-box h3 {
  font-size: 27px;
  margin-bottom: 14px;
}

.gl-language-box p {
  color: var(--gl-muted);
  font-size: 15px;
  line-height: 1.75;
}

.gl-language-box-dark p {
  color: rgba(255,255,255,.78);
}

.gl-language-box ul {
  padding: 0;
  margin: 20px 0;
  list-style: none;
}

.gl-language-box li {
  padding: 7px 0 7px 20px;
  position: relative;
  font-size: 14px;
}

.gl-language-box li:before {
  content: "•";
  position: absolute;
  left: 0;
  color: var(--gl-orange);
  font-size: 20px;
}

.gl-course-link {
  color: var(--gl-teal);
  font-weight: 800;
}

.gl-language-box-dark .gl-course-link {
  color: var(--gl-orange);
}


/* ==========================================
   WHY US
   ========================================== */

.gl-why-us {
  padding: 115px 0;
  background: white;
}

.gl-why-grid {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: 80px;
}

.gl-why-content h2 {
  font-size: clamp(36px, 4vw, 53px);
  line-height: 1.12;
  margin-bottom: 24px;
}

.gl-why-content p {
  color: var(--gl-muted);
  line-height: 1.85;
  font-size: 16px;
}

.gl-why-content .gl-btn {
  margin-top: 18px;
}

.gl-benefit-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 25px;
}

.gl-benefit {
  display: flex;
  gap: 17px;
  padding: 25px;
  border: 1px solid #e7e7e7;
  border-radius: 12px;
  transition: .25s ease;
}

.gl-benefit:hover {
  border-color: var(--gl-orange);
  transform: translateY(-4px);
}

.gl-benefit-icon {
  min-width: 45px;
  height: 45px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: var(--gl-orange);
  color: var(--gl-black);
  font-size: 13px;
  font-weight: 900;
}

.gl-benefit h3 {
  font-size: 17px;
  margin-bottom: 6px;
}

.gl-benefit p {
  margin: 0;
  color: var(--gl-muted);
  font-size: 13px;
  line-height: 1.65;
}


/* ==========================================
   PROCESS
   ========================================== */

.gl-process {
  padding: 110px 0;
  background: var(--gl-black);
  color: white;
}

.gl-process .gl-section-heading p {
  color: #aaa;
}

.gl-process .gl-section-heading h2 span {
  color: var(--gl-orange);
}

.gl-process-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.gl-process-card {
  padding: 35px 28px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 14px;
  background: rgba(255,255,255,.025);
}

.gl-process-card > span {
  display: block;
  color: var(--gl-orange);
  font-size: 14px;
  font-weight: 900;
  margin-bottom: 30px;
}

.gl-process-card h3 {
  font-size: 22px;
  margin-bottom: 12px;
}

.gl-process-card p {
  margin: 0;
  color: #aaa;
  font-size: 14px;
  line-height: 1.75;
}


/* ==========================================
   EXAMS
   ========================================== */

.gl-exams {
  padding: 110px 0;
  background: var(--gl-light);
}

.gl-exams-header {
  display: grid;
  grid-template-columns: 1fr .7fr;
  gap: 70px;
  align-items: end;
  margin-bottom: 50px;
}

.gl-exams-header h2 {
  font-size: clamp(35px, 4vw, 52px);
  line-height: 1.12;
  margin: 0;
}

.gl-exams-header p {
  color: var(--gl-muted);
  line-height: 1.8;
}

.gl-exam-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 18px;
}

.gl-exam-card {
  background: white;
  padding: 30px 20px;
  border-radius: 12px;
  text-align: center;
  border-bottom: 4px solid var(--gl-orange);
}

.gl-exam-card strong {
  display: block;
  color: var(--gl-teal);
  font-size: 23px;
}

.gl-exam-card span {
  display: block;
  font-size: 12px;
  color: var(--gl-orange);
  font-weight: 800;
  text-transform: uppercase;
  margin: 5px 0 12px;
}

.gl-exam-card p {
  color: var(--gl-muted);
  font-size: 13px;
  margin: 0;
}


/* ==========================================
   LOCAL SEO
   ========================================== */

.gl-local {
  padding: 110px 0;
  background: white;
}

.gl-local-grid {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: 75px;
  align-items: center;
}

.gl-local-map {
  min-height: 460px;
  border-radius: 25px;
  background:
    linear-gradient(rgba(33,94,97,.92), rgba(33,94,97,.92)),
    repeating-linear-gradient(
      45deg,
      transparent,
      transparent 30px,
      rgba(255,255,255,.05) 30px,
      rgba(255,255,255,.05) 31px
    );
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.gl-local-map:before {
  content: "";
  position: absolute;
  width: 340px;
  height: 340px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.2);
}

.gl-local-map:after {
  content: "";
  position: absolute;
  width: 230px;
  height: 230px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.18);
}

.gl-map-inner {
  position: relative;
  z-index: 2;
  width: 180px;
  height: 180px;
  background: var(--gl-orange);
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  color: var(--gl-black);
}

.gl-map-inner span {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 2px;
}

.gl-map-inner strong {
  font-size: 25px;
  line-height: 1.1;
}

.gl-map-inner small {
  font-size: 10px;
  margin-top: 8px;
}

.gl-local-content h2 {
  font-size: clamp(35px, 4vw, 52px);
  line-height: 1.12;
  margin-bottom: 23px;
}

.gl-local-content p {
  color: var(--gl-muted);
  line-height: 1.85;
  font-size: 16px;
}

.gl-local-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 25px;
}

.gl-local-tags span {
  padding: 8px 12px;
  background: var(--gl-light);
  border-radius: 30px;
  color: var(--gl-teal);
  font-size: 12px;
  font-weight: 800;
}


/* ==========================================
   FAQ
   ========================================== */

.gl-faq {
  padding: 110px 0;
  background: var(--gl-light);
}

.gl-faq-list {
  max-width: 900px;
  margin: auto;
}

.gl-faq-list details {
  background: white;
  border-radius: 10px;
  margin-bottom: 12px;
  border: 1px solid #e3e3e3;
  overflow: hidden;
}

.gl-faq-list summary {
  cursor: pointer;
  padding: 22px 25px;
  font-weight: 800;
  font-size: 16px;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

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

.gl-faq-list summary span {
  color: var(--gl-orange);
  font-size: 25px;
}

.gl-faq-list details[open] summary span {
  transform: rotate(45deg);
}

.gl-faq-list details p {
  padding: 0 25px 23px;
  margin: 0;
  color: var(--gl-muted);
  font-size: 15px;
  line-height: 1.8;
}

.gl-faq-list details a {
  color: var(--gl-teal);
  font-weight: 800;
}


/* ==========================================
   FINAL CTA
   ========================================== */

.gl-final-cta {
  padding: 80px 0;
  background: var(--gl-teal);
}

.gl-final-cta-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 50px;
}

.gl-final-cta .gl-eyebrow {
  color: var(--gl-orange);
}

.gl-final-cta h2 {
  color: white;
  font-size: clamp(35px, 4vw, 52px);
  line-height: 1.1;
  margin-bottom: 15px;
}

.gl-final-cta h2 span {
  color: var(--gl-orange);
}

.gl-final-cta p {
  color: rgba(255,255,255,.75);
  max-width: 680px;
  margin: 0;
}

.gl-final-actions {
  min-width: 250px;
  display: flex;
  flex-direction: column;
  gap: 15px;
  align-items: flex-start;
}

.gl-phone {
  color: white;
  font-weight: 800;
  font-size: 15px;
}


/* ==========================================
   RESPONSIVE
   ========================================== */

@media (max-width: 1000px) {

  .gl-about-hero-grid,
  .gl-intro-grid,
  .gl-why-grid,
  .gl-local-grid {
    grid-template-columns: 1fr;
  }

  .gl-about-hero-content {
    text-align: center;
  }

  .gl-about-hero-content > p {
    margin-left: auto;
    margin-right: auto;
  }

  .gl-hero-buttons {
    justify-content: center;
  }

  .gl-hero-highlights {
    justify-content: center;
  }

  .gl-about-hero-visual {
    min-height: 420px;
  }

  .gl-language-grid {
    grid-template-columns: 1fr 1fr;
  }

  .gl-process-grid {
    grid-template-columns: 1fr 1fr;
  }

  .gl-exams-header {
    grid-template-columns: 1fr;
    gap: 15px;
  }

  .gl-exam-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .gl-local-map {
    min-height: 350px;
  }

  .gl-final-cta-inner {
    flex-direction: column;
    align-items: flex-start;
  }

}


@media (max-width: 650px) {

  .gl-container {
    width: 90%;
  }

  .gl-about-hero {
    padding: 65px 0;
  }

  .gl-about-hero-content h1 {
    font-size: 42px;
  }

  .gl-about-hero-content > p {
    font-size: 16px;
  }

  .gl-hero-highlights {
    flex-wrap: wrap;
    gap: 20px;
  }

  .gl-hero-highlights div {
    min-width: 100px;
    margin-right: 0;
    padding-right: 15px;
  }

  .gl-about-hero-visual {
    min-height: 350px;
  }

  .gl-circle-one {
    width: 270px;
    height: 270px;
    border-width: 25px;
  }

  .gl-circle-two {
    width: 210px;
    height: 210px;
    border-width: 18px;
  }

  .gl-visual-main {
    width: 205px;
    height: 205px;
  }

  .gl-language-card {
    padding: 9px 12px;
    font-size: 12px;
  }

  .gl-language-card span {
    font-size: 20px;
  }

  .gl-language-card-german {
    left: 0;
    top: 20px;
  }

  .gl-language-card-french {
    right: 0;
    top: 100px;
  }

  .gl-language-card-english {
    bottom: 20px;
    left: 20px;
  }

  .gl-about-intro,
  .gl-languages,
  .gl-why-us,
  .gl-process,
  .gl-exams,
  .gl-local,
  .gl-faq {
    padding: 75px 0;
  }

  .gl-section-heading {
    margin-bottom: 35px;
  }

  .gl-section-heading h2,
  .gl-why-content h2,
  .gl-local-content h2 {
    font-size: 35px;
  }

  .gl-intro-box {
    padding: 30px;
  }

  .gl-language-grid,
  .gl-benefit-list,
  .gl-process-grid {
    grid-template-columns: 1fr;
  }

  .gl-language-box {
    padding: 30px;
  }

  .gl-exam-grid {
    grid-template-columns: 1fr 1fr;
  }

  .gl-exam-card {
    padding: 22px 12px;
  }

  .gl-local-map {
    min-height: 300px;
  }

  .gl-final-cta {
    padding: 65px 0;
  }

  .gl-final-actions {
    width: 100%;
  }

  .gl-final-actions .gl-btn {
    width: 100%;
  }

}


@media (max-width: 400px) {

  .gl-exam-grid {
    grid-template-columns: 1fr;
  }

  .gl-hero-highlights {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

}/* End custom CSS */