/*
Theme Name: BCN House School
Description: BCN House School site is a minimal CSS might make me look like theme tartare but that means less stuff to get in your way when you\’re designing your awesome theme. Here are some of the other more interesting things you\’ll find here …
Version: 1.8
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready
Author: efestudio
*/
body {
  margin: 0;
  padding: 0;
  background: #ffffff;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.page-container {
  overflow: hidden;
}

/* Prevents unwanted scroll space when scroll FX used. */
a,
button {
  transition: background 0.3s ease-in-out;
  outline: none !important;
}

/* Prevent blue selection glow on Chrome and Safari */
a:hover {
  text-decoration: none;
  cursor: pointer;
}

.wp-block-buttons,
.wp-block-button__link {
  background-color: transparent !important;
  transition: background 0.3s ease-in-out;
  outline: none !important;
  border-radius: 5px;
  display: flex;
}

.scroll-fx-lock-init {
  position: fixed !important;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 99999;
}

/* ScrollFX Lock */
.blocs-grid-container {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto auto;
  column-gap: 1.5rem;
  row-gap: 1.5rem;
}

/* CSS Grid */

/* Preloader */

.page-preloader {
  position: fixed;
  top: 0;
  bottom: 0;
  width: 100%;
  z-index: 100000;
  background: #ffffff url('img/pageload-spinner.gif') no-repeat center center;
  animation-name: preloader-fade;
  animation-delay: 2s;
  animation-duration: 0.5s;
  animation-fill-mode: both;
}

.preloader-complete {
  animation-delay: 0.1s;
}

@keyframes preloader-fade {
  0% {
    opacity: 1;
    visibility: visible;
  }

  100% {
    opacity: 0;
    visibility: hidden;
  }
}

/* = Web Fonts
-------------------------------------------------------------- */

@font-face {
  font-family: 'BrandonGrotesque-Medium';
  src: url('./fonts/BrandonGrotesque-Medium/BrandonGrotesque-Medium.woff2');
  src: url('./fonts/BrandonGrotesque-Medium/BrandonGrotesque-Medium.woff2')
    format('woff2');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'BrandonGrotesque-Regular';
  src: url('./fonts/BrandonGrotesque-Regular/BrandonGrotesque-Regular.woff2');
  src: url('./fonts/BrandonGrotesque-Regular/BrandonGrotesque-Regular.woff2')
    format('woff2');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'BrandonGrotesque-Bold';
  src: url('./fonts/BrandonGrotesque-Bold/BrandonGrotesque-Bold.woff2');
  src: url('./fonts/BrandonGrotesque-Bold/BrandonGrotesque-Bold.woff2')
    format('woff2');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'BrandonGrotesque-Black';
  src: url('./fonts/BrandonGrotesque-Black/BrandonGrotesque-Black.woff2');
  src: url('./fonts/BrandonGrotesque-Black/BrandonGrotesque-Black.woff2')
    format('woff2');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'BrandonGrotesque-Light';
  src: url('./fonts/BrandonGrotesque-Light/BrandonGrotesque-Light.woff2');
  src: url('./fonts/BrandonGrotesque-Light/BrandonGrotesque-Light.woff2')
    format('woff2');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

/* = Blocs
-------------------------------------------------------------- */

.bloc {
  width: 100%;
  clear: both;
  background: 50% 50% no-repeat;
  padding: 0 20px;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  position: relative;
  display: flex;
}

.bloc .container {
  padding-left: 0;
  padding-right: 0;
  position: relative;
}

/* Sizes */

.bloc-lg {
  padding: 100px 20px;
}

.bloc-md {
  padding: 50px 20px;
}

.bloc-sm {
  padding: 20px;
}

/* = Full Width Blocs
-------------------------------------------------------------- */

.full-width-bloc {
  padding-left: 0;
  padding-right: 0;
}

.full-width-bloc .row {
  margin-left: 0;
  margin-right: 0;
}

.full-width-bloc .container {
  width: 100%;
  max-width: 100% !important;
}

.full-width-bloc .carousel img {
  width: 100%;
  height: auto;
}

/* Background Textures */

.bloc-bg-texture::before {
  content: '';
  background-size: 2px 2px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.texture-diagonal-lines::before {
  background: url('img/texture-diag-lines.png');
  background-size: 10px 10px;
}

/* Background Effects */

.parallax__container {
  clip: rect(0, auto, auto, 0);
  height: 100%;
  left: 0;
  overflow: hidden;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -1;
}

.parallax {
  position: fixed;
  top: 0;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  width: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

/* Dark theme */

.d-bloc {
  color: rgba(255, 255, 255, 0.7);
}

.d-bloc button:hover {
  color: rgba(255, 255, 255, 0.9);
}

.d-bloc .icon-round,
.d-bloc .icon-square,
.d-bloc .icon-rounded,
.d-bloc .icon-semi-rounded-a,
.d-bloc .icon-semi-rounded-b {
  border-color: rgba(255, 255, 255, 0.9);
}

.d-bloc .divider-h span {
  border-color: rgba(255, 255, 255, 0.2);
}

.d-bloc .a-btn,
.d-bloc .navbar a,
.d-bloc a .icon-sm,
.d-bloc a .icon-md,
.d-bloc a .icon-lg,
.d-bloc a .icon-xl,
.d-bloc h1 a,
.d-bloc h2 a,
.d-bloc h3 a,
.d-bloc h4 a,
.d-bloc h5 a,
.d-bloc h6 a,
.d-bloc p a {
  color: rgba(255, 255, 255, 0.6);
}

.d-bloc .a-btn:hover,
.d-bloc .navbar a:hover,
.d-bloc a:hover .icon-sm,
.d-bloc a:hover .icon-md,
.d-bloc a:hover .icon-lg,
.d-bloc a:hover .icon-xl,
.d-bloc h1 a:hover,
.d-bloc h2 a:hover,
.d-bloc h3 a:hover,
.d-bloc h4 a:hover,
.d-bloc h5 a:hover,
.d-bloc h6 a:hover,
.d-bloc p a:hover {
  color: rgba(255, 255, 255, 1);
}

.d-bloc .navbar-toggle .icon-bar {
  background: rgba(255, 255, 255, 1);
}

.d-bloc .btn-wire,
.d-bloc .btn-wire:hover {
  color: rgba(255, 255, 255, 1);
  border-color: rgba(255, 255, 255, 1);
}

.d-bloc .card {
  color: rgba(0, 0, 0, 0.5);
}

.d-bloc .card button:hover {
  color: rgba(0, 0, 0, 0.7);
}

.d-bloc .card icon {
  border-color: rgba(0, 0, 0, 0.7);
}

.d-bloc .card .divider-h span {
  border-color: rgba(0, 0, 0, 0.1);
}

.d-bloc .card .a-btn {
  color: rgba(0, 0, 0, 0.6);
}

.d-bloc .card .a-btn:hover {
  color: rgba(0, 0, 0, 1);
}

.d-bloc .card .btn-wire,
.d-bloc .card .btn-wire:hover {
  color: rgba(0, 0, 0, 0.7);
  border-color: rgba(0, 0, 0, 0.3);
}

/* Light theme */

.d-bloc .card,
.l-bloc {
  color: rgba(0, 0, 0, 0.5);
}

.d-bloc .card button:hover,
.l-bloc button:hover {
  color: rgba(0, 0, 0, 0.7);
}

.l-bloc .icon-round,
.l-bloc .icon-square,
.l-bloc .icon-rounded,
.l-bloc .icon-semi-rounded-a,
.l-bloc .icon-semi-rounded-b {
  border-color: rgba(0, 0, 0, 0.7);
}

.d-bloc .card .divider-h span,
.l-bloc .divider-h span {
  border-color: rgba(0, 0, 0, 0.1);
}

.d-bloc .card .a-btn,
.l-bloc .a-btn,
.l-bloc .navbar a,
.l-bloc a .icon-sm,
.l-bloc a .icon-md,
.l-bloc a .icon-lg,
.l-bloc a .icon-xl,
.l-bloc h1 a,
.l-bloc h2 a,
.l-bloc h3 a,
.l-bloc h4 a,
.l-bloc h5 a,
.l-bloc h6 a,
.l-bloc p a {
  color: rgba(0, 0, 0, 0.6);
}

.d-bloc .card .a-btn:hover,
.l-bloc .a-btn:hover,
.l-bloc .navbar a:hover,
.l-bloc a:hover .icon-sm,
.l-bloc a:hover .icon-md,
.l-bloc a:hover .icon-lg,
.l-bloc a:hover .icon-xl,
.l-bloc h1 a:hover,
.l-bloc h2 a:hover,
.l-bloc h3 a:hover,
.l-bloc h4 a:hover,
.l-bloc h5 a:hover,
.l-bloc h6 a:hover,
.l-bloc p a:hover {
  color: rgba(0, 0, 0, 1);
}

.l-bloc .navbar-toggle .icon-bar {
  color: rgba(0, 0, 0, 0.6);
}

.d-bloc .card .btn-wire,
.d-bloc .card .btn-wire:hover,
.l-bloc .btn-wire,
.l-bloc .btn-wire:hover {
  color: rgba(0, 0, 0, 0.7);
  border-color: rgba(0, 0, 0, 0.3);
}

/* Row Margin Offsets */

.voffset {
  margin-top: 30px;
}

/* = NavBar
-------------------------------------------------------------- */

/* Navbar Icon */
.svg-menu-icon {
  fill: none;
  stroke: rgba(0, 0, 0, 0.5);
  stroke-width: 2px;
  fill-rule: evenodd;
}

.navbar-dark .svg-menu-icon {
  stroke: rgba(255, 255, 255, 0.5);
}

.menu-icon-thin-bars {
  stroke-width: 1px;
}

.menu-icon-thick-bars {
  stroke-width: 5px;
}

.menu-icon-rounded-bars {
  stroke-width: 3px;
  stroke-linecap: round;
}

.menu-icon-filled {
  fill: rgba(0, 0, 0, 0.5);
  stroke-width: 0px;
}

.navbar-dark .menu-icon-filled {
  fill: rgba(255, 255, 255, 0.5);
}

.navbar-toggler-icon {
  background: none !important;
  pointer-events: none;
  width: 33px;
  height: 33px;
}

/* Handle Multi Level Navigation */
.dropdown-menu .dropdown-menu {
  border: none;
}

@media (min-width: 576px) {
  .navbar-expand-sm .dropdown-menu .dropdown-menu {
    border: 1px solid rgba(0, 0, 0, 0.15);
    position: absolute;
    left: 100%;
    top: -7px;
  }

  .navbar-expand-sm .dropdown-menu .submenu-left {
    right: 100%;
    left: auto;
  }
}

@media (min-width: 768px) {
  .navbar-expand-md .dropdown-menu .dropdown-menu {
    border: 1px solid rgba(0, 0, 0, 0.15);
    border: 1px solid rgba(0, 0, 0, 0.15);
    position: absolute;
    left: 100%;
    top: -7px;
  }

  .navbar-expand-md .dropdown-menu .submenu-left {
    right: 100%;
    left: auto;
  }
}

@media (min-width: 992px) {
  .navbar-expand-lg .dropdown-menu .dropdown-menu {
    border: 1px solid rgba(0, 0, 0, 0.15);
    position: absolute;
    left: 100%;
    top: -7px;
  }

  .navbar-expand-lg .dropdown-menu .submenu-left {
    right: 100%;
    left: auto;
  }
}

/* = Bric adjustment margins
-------------------------------------------------------------- */

.mg-sm {
  margin-top: 10px;
  margin-bottom: 5px;
}

.mg-md {
  margin-top: 10px;
  margin-bottom: 20px;
}

/* = Buttons
-------------------------------------------------------------- */

.btn-d,
.btn-d:hover,
.btn-d:focus {
  color: #fff;
  background: rgba(0, 0, 0, 0.3);
}

/* Prevent ugly blue glow on chrome and safari */
button {
  outline: none !important;
}

.btn-sq {
  border-radius: 0px;
}

.btn-xl {
  padding: 16px 40px;
  font-size: 28px;
}

.a-block {
  width: 100%;
  text-align: left;
  display: inline-block;
}

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

.dropdown a .caret {
  margin: 0 0 0 5px;
}

.btn-dropdown .dropdown-menu .dropdown {
  padding: 3px 0;
}

/*  Image Scale */
.img-fluid-up {
  min-width: 100%;
  height: auto;
}

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

/* = Lists
-------------------------------------------------------------- */
.list-sp-md li {
  padding-bottom: 10px;
}

.list-sp-md li:last-child,
.list-sp-lg li:last-child,
.list-sp-xl li:last-child {
  padding-bottom: 0;
}

/* = Cards
-------------------------------------------------------------- */
.card-sq,
.card-sq .card-header,
.card-sq .card-footer {
  border-radius: 0;
}

.card-rd {
  border-radius: 30px;
}

.card-rd .card-header {
  border-radius: 29px 29px 0 0;
}

.card-rd .card-footer {
  border-radius: 0 0 29px 29px;
}

/* = Masonary
-------------------------------------------------------------- */
.card-columns .card {
  margin-bottom: 0.75rem;
}

@media (min-width: 576px) {
  .card-columns {
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
    -webkit-column-gap: 1.25rem;
    -moz-column-gap: 1.25rem;
    column-gap: 1.25rem;
    orphans: 1;
    widows: 1;
  }

  .card-columns .card {
    display: inline-block;
    width: 100%;
  }
}

/* = Classic Dividers
-------------------------------------------------------------- */
.divider-h {
  min-height: 1px;
  background-color: rgba(0, 0, 0, 0.2);
  margin: 20px 0;
}

.divider-half {
  width: 50%;
}

.dropdown-menu .divider-h {
  margin: 0;
}

/* = Forms
-------------------------------------------------------------- */

.form-control {
  border-color: rgba(0, 0, 0, 0.1);
  box-shadow: none;
}

/* ScrollToTop button */

.scrollToTop {
  width: 36px;
  height: 36px;
  padding: 5px;
  position: fixed;
  bottom: 20px;
  right: 20px;
  opacity: 0;
  z-index: 999;
  transition: all 0.3s ease-in-out;
  pointer-events: none;
}

.showScrollTop {
  opacity: 1;
  pointer-events: all;
}

.scroll-to-top-btn-icon {
  fill: none;
  stroke: #fff;
  stroke-width: 2px;
  fill-rule: evenodd;
  stroke-linecap: round;
}

/* = Lightbox
-------------------------------------------------------------- */

a[data-lightbox] {
  position: relative;
  display: block;
  text-align: center;
}

a[data-lightbox]:hover::before {
  content: '+';
  font-family: 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue',
    Helvetica, Arial;
  font-size: 32px;
  line-height: 42px;
  width: 50px;
  height: 50px;
  margin-left: -25px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.5);
  color: #fff;
  font-weight: 100;
  z-index: 1;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
}

a[data-lightbox]:hover img {
  opacity: 0.6;
  -webkit-animation-fill-mode: none;
  animation-fill-mode: none;
}

.lightbox-caption {
  padding: 20px;
  color: #fff;
  background: rgba(0, 0, 0, 0.5);
  position: absolute;
  left: 15px;
  right: 15px;
  bottom: 5px;
}

.close-lightbox:hover,
.next-lightbox:hover,
.prev-lightbox:hover {
  background: rgba(0, 0, 0, 0.5);
}

.next-lightbox,
.prev-lightbox,
.close-lightbox {
  position: absolute;
  padding: 6px;
  background: rgba(0, 0, 0, 0.3);
  line-height: 0;
  transition: background 0.2s ease-in-out;
  border-radius: 0.25rem;
  border: none;
  z-index: 20;
}

.next-lightbox,
.prev-lightbox {
  top: 45%;
}

.close-lightbox {
  top: 20px;
  right: 20px;
}

.next-lightbox {
  right: 25px;
}

.prev-lightbox {
  left: 25px;
}

.lightbox-prev-icon,
.lightbox-next-icon,
.lightbox-close-icon {
  fill: none;
  stroke: #fff;
  stroke-width: 3px;
  fill-rule: evenodd;
  stroke-linecap: round;
}

.lightbox-close-svg {
  pointer-events: none;
}

/* Full Screen */
.fullscreen-lb {
  background: #000;
  border-radius: 0;
}

.fullscreen-lb .modal-body {
  padding: 0;
}

.fullscreen-lb .lightbox-caption {
  left: 0;
  right: 0;
  bottom: -10px;
  text-align: center;
}

.fullscreen-modal {
  background: #000;
}

.fullscreen-modal .modal-dialog {
  width: 100% !important;
  max-width: 95% !important;
}

/* Modal Full Screen Close Button */
.close-full-screen-modal {
  position: fixed;
  display: block;
  width: 25px;
  height: 25px;
  top: 16px;
  right: 10px;
  z-index: 10000;
}

.close-full-screen-modal .close-icon {
  display: block;
  width: 100%;
  height: 1px;
  background: #fff;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  margin-top: 12px;
}

.close-full-screen-modal .close-icon {
  height: 2px;
}

.close-full-screen-modal .close-icon:after {
  content: '';
  display: inherit;
  width: inherit;
  height: inherit;
  background: inherit;
  -ms-transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}

.close-full-screen-modal {
  right: 20px;
}

/* = Custom Styling
-------------------------------------------------------------- */

/* Global font family setting */
* {
  font-family: inherit;
}

body,
html {
  font-family: 'BrandonGrotesque-Regular', -apple-system, BlinkMacSystemFont,
    'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  font-weight: normal;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'BrandonGrotesque-Regular';
  font-weight: normal;
  color: #05637a;
}

p,
label,
div,
li,
ul,
ol,
input,
textarea,
select,
table,
th,
td {
  font-family: 'BrandonGrotesque-Regular';
  font-weight: normal;
  font-size: 1.2rem;
  color: #101010;
}

.btn,
a,
button {
  font-family: 'BrandonGrotesque-Medium';
  font-weight: normal;
}

/* Bootstrap overrides */
.navbar,
.navbar-nav,
.nav-link,
.dropdown-menu,
.dropdown-item,
.modal,
.modal-header,
.modal-body,
.modal-footer,
.card,
.card-header,
.card-body,
.card-footer {
  font-family: inherit;
}

.container {
  max-width: 1140px;
}

.hero-img {
  box-shadow: -6px -36px 32px rgba(0, 0, 0, 0.09);
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
}

.hero-heading {
  font-size: 60px;
  font-weight: bold;
}

.hero-sub-heading {
  font-size: 30px;
  font-family: 'BrandonGrotesque-Medium';
}

.navbar-brand img {
  width: 400px;
  height: auto;
}

.app-offset-bottom {
  position: relative;
  bottom: -20px;
}

.custom-shadow {
  box-shadow: 0px 31px 35px rgba(0, 0, 0, 0.16), 0px 0px 2px rgba(0, 0, 0, 0.09);
  border-radius: 5px 5px 5px 5px;
}

.feature-heading {
  font-weight: 500;
  color: var(--swatch-var-215) !important;
  font-family: 'BrandonGrotesque-Medium';
}

.feature-icon {
  width: 100px;
  border-radius: 10px 10px 10px 10px;
}

.rounded-right {
  border-top-right-radius: 20px;
  border-bottom-right-radius: 20px;
}

.rounded-left {
  border-radius: 20px 0px 0px 20px;
}

.feature-card {
  padding: 10px 30px 10px 30px;
  border-radius: 20px 20px 20px 20px;
  background-color: var(--swatch-var-1056);
  font-family: 'BrandonGrotesque-Medium';
  color: var(--swatch-var-4279) !important;
  min-height: 315px;
}

.sub-heading {
  font-size: 20px;
  color: var(--swatch-var-1056) !important;
  font-family: 'BrandonGrotesque-Regular';
  font-weight: 100;
}

.thick-line {
  background-position: center bottom;
  background-size: length;
  background-color: var(--swatch-var-1056);
  border-radius: 2px 2px 2px 2px;
}

.invita-card {
  padding: 60px 60px 0px 30px;
  border-radius: 30px 30px 30px 30px;
  background-image: url('img/horizontal-shot-glad-caucasian-woman-points-aside-with-both-fore-fingers-advertises-something-aside.jpg');
  background-size: cover;
  background-repeat: no-repeat;
  background-position: left center;
  min-height: 600px;
}

.card-img {
  position: relative;
  width: 613px;
}

.page-title {
  font-family: 'BrandonGrotesque-Medium';
  color: var(--swatch-var-215) !important;
  font-size: 2rem;
}

.pricing-info {
  min-height: 65px;
  font-size: 17px;
  color: var(--swatch-var-215) !important;
  font-weight: 400;
}

.price-card {
  background-color: var(--swatch-var-4207);
  text-align: left;
  padding: 25px 25px 25px 25px;
  border-radius: 30px 30px 30px 30px;
  min-height: 815px;
  width: 100%;
}

.btn {
  font-size: 16px;
  font-weight: bold;
  font-family: 'BrandonGrotesque-Medium';
  text-transform: uppercase;
}

.price-list-icon {
  height: 20px;
  width: 20px;
  float: left;
  margin-right: 10px;
  background-color: var(--swatch-var-1056);
  border-radius: 10px 10px 10px 10px;
}

.price-list-item {
  display: inline;
  color: var(--swatch-var-1056) !important;
  font-family: 'BrandonGrotesque-Regular';
  font-size: 18px;
  font-weight: 300;
}

.dark-icon {
  opacity: 0.8;
}

.menu-icon-stroke {
  stroke: transparent !important;
  fill: transparent !important;
}

.translucid {
  background-color: var(--swatch-var-5708);
  min-height: 450px;
}

.link-style {
  width: 100%;
}

.navbar .nav {
  font-family: 'BrandonGrotesque-Bold';
  font-size: 18px;
}

.h4-style {
  font-family: 'BrandonGrotesque-Medium';
  color: var(--swatch-var-4279) !important;
  text-transform: uppercase;
  font-weight: 400;
  font-size: 24px;
}

.p-style {
  font-family: 'BrandonGrotesque-Medium';
  font-size: 20px;
}

.h3-style {
  font-family: 'BrandonGrotesque-Bold';
  font-size: 40px;
  line-height: 48px;
  font-weight: 300;
}

.p-bloc-6-style {
  font-size: 20px;
  font-weight: 500;
}

.btn-style {
  width: 36.49%;
  background-color: var(--swatch-var-215);
  color: var(--swatch-var-4279) !important;
  font-weight: 400;
}

.img-asset-3-style {
  width: 150px;
}

.bloc-slider {
  background-image: url('img/young-smiling-blonde-woman-freelancer-with-yellow-headphones-working-laptop-cafe.jpg');
  background-size: length;
}

.conectate {
  margin: 0px 0px 0px 0px;
  width: auto;
  height: auto;
}

.links {
  font-family: 'BrandonGrotesque-Medium';
  color: var(--swatch-var-1056) !important;
}

.mini-subtitle {
  text-transform: uppercase;
  color: var(--swatch-var-1056) !important;
}

.bold {
  font-family: 'BrandonGrotesque-Regular';
  color: var(--swatch-var-1056) !important;
  font-weight: 400;
}

.mini-large-p {
  font-size: 20px;
  color: var(--swatch-var-1056) !important;
  font-family: 'BrandonGrotesque-Medium';
  font-weight: 500;
}

.faq-full {
  padding-bottom: 14px;
  border-width: 0px 0px 1px 0px;
  border-style: solid;
  border-color: #919191 !important;
  margin-left: auto;
  margin-right: auto;
}

.faq-question-column {
  padding: 0px 0px 0px 0px;
}

.faq-question {
  display: inline-flex;
  width: 100%;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  border-width: 1px 0px 0px 0px;
  border-style: solid;
  border-color: var(--swatch-var-215) !important;
  margin-top: 14px;
  padding-bottom: 7px;
  padding-top: 23px;
  font-family: 'BrandonGrotesque-Medium';
}

.faq-question-title {
  font-size: 1.5rem;
  font-family: 'BrandonGrotesque-Regular';
  text-decoration: none;
  color: var(--swatch-var-215) !important;
  font-weight: 400;
}

.transition-fast {
  color: var(--swatch-var-215) !important;
}

.white-button {
  border-width: 1px 1px 1px 1px;
  border-style: solid;
  background-color: var(--swatch-var-4279);
  color: var(--swatch-var-4497) !important;
  border-color: rgba(0, 0, 0, 0.28) !important;
}

.white-button:hover {
  background-color: var(--swatch-var-3131);
  color: var(--swatch-var-5803) !important;
  border-color: #000000 !important;
}

.h2-style {
  font-family: 'BrandonGrotesque-Regular';
  color: var(--swatch-var-215) !important;
  width: 100%;
}

.text-left {
  font-family: 'BrandonGrotesque-Regular';
  font-size: 14px;
  color: var(--swatch-var-215) !important;
  font-weight: 300;
}

.faq-10-full {
  margin-left: auto;
  margin-right: auto;
}

.faq-10-box {
  border-width: 1px 1px 1px 1px;
  border-style: solid;
  border-color: #919191 !important;
  margin-bottom: 14px;
  padding: 28px 28px 20px 28px;
  position: relative;
}

.global-radius {
  border-radius: 5px 5px 5px 5px;
  background-image: url('img/header.jpg');
}

.faq-10-question {
  display: inline-flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  flex-direction: row;
  padding-bottom: 8px;
}

.faq-18-column {
  display: flex;
  width: 100%;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
}

.faq-18-box {
  border-width: 1px 1px 1px 1px;
  border-style: solid;
  border-color: #919191 !important;
  margin-bottom: 14px;
  padding: 28px 28px 20px 28px;
  position: relative;
  width: 49.4%;
}

.arrow-icon {
  width: 25px;
  text-align: center;
}

.mini-faq-1-div {
  overflow: hidden;
  box-shadow: 1.41px 1.41px 14px rgba(0, 0, 0, 0.08);
}

.mini-faq-2-header {
  border-width: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  border-radius: 0px 0px 0px 0px !important;
}

.mini-faq-1-question {
  font-size: 1.3em;
  padding: 20px 20px 20px 20px;
  border-radius: 0px 0px 0px 0px;
  border-width: 0px 0px 2px 0px;
  border-style: solid;
  border-color: rgba(192, 192, 192, 0.14) !important;
  font-family: 'BrandonGrotesque-Medium';
  font-weight: 400;
  color: var(--swatch-var-215) !important;
  text-decoration: none;
  background-color: var(--swatch-var-4279);
}

.mini-faq-1-body {
  padding: 20px 15px 20px 15px;
}

.mini-faq-last-header {
  border-width: 0px 0px 0px 0px !important;
}

.h3-team-style {
  font-family: 'BrandonGrotesque-Medium';
  color: var(--swatch-var-5803) !important;
  font-weight: 500;
  font-size: 18px;
}

.half-screen-content {
  margin: 100px auto 100px auto;
  max-width: 800px;
}

.image-full-width {
  width: 100%;
  height: 100%;
}

.review-logo {
  max-width: 150px;
}

.faq-p {
  font-size: 1.3em;
  font-family: 'BrandonGrotesque-Medium';
  color: var(--swatch-var-1056) !important;
  font-weight: 400;
  margin-top: 20px;
}

.mini-testimonial-card-img {
  max-width: 120px;
  border-radius: 100px 100px 100px 100px;
}

.img-11-style {
  height: 60px;
}

.h2-6-style {
  width: 100%;
  font-size: 28px;
}

.mini-video-thumb {
  background-size: cover;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.mini-video-thumb:hover {
  background-blend-mode: darken;
  background-color: rgba(0, 0, 0, 0.72);
}

.header-play-icon-div {
  position: absolute;
}

.mini-play-icon {
  font-size: 60px;
  width: 100px;
  height: 100px;
  background-color: var(--swatch-var-2408);
  border-radius: 100px 100px 100px 100px;
  padding-top: 20%;
  padding-left: 8%;
  color: #feffff !important;
}

.mini-feature-modal {
  border-radius: 0px 0px 0px 0px;
  border-width: 0px 0px 0px 0px;
  background-color: transparent;
}

.full-width {
  width: 100%;
}

.team-member-name {
  font-size: 1.5em;
}

.team-text-left {
  max-width: 400px;
  color: var(--swatch-var-5803) !important;
  font-family: 'BrandonGrotesque-Regular';
  font-size: 18px;
  font-weight: normal;
}

.mini-team-social-icon {
  width: 30px;
  text-align: center;
  font-size: 22px;
  color: var(--swatch-var-1056) !important;
}

.mini-team-social-icon:hover {
  opacity: 0.8;
}

.header-tags {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  align-content: center;
}

.header-tag-name {
  background-color: rgba(145, 145, 145, 0.28);
  margin-right: 5px;
  margin-bottom: 5px;
  padding: 4px 10px 4px 10px;
}

.header-narrow {
  max-height: 500px;
  background-size: cover;
}

.black {
  font-size: 8rem;
  font-family: 'BrandonGrotesque-Black';
  text-decoration: none;
}

.header-tags-left {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  align-content: center;
}

.bloc-slider-about {
  background-size: length;
  height: 600px;
  background-image: url('img/Laura%26Maria.jpg');
  background-position: center top;
}

.height100 {
  height: 100%;
}

.h1-5-style {
  font-family: 'BrandonGrotesque-Medium';
  color: var(--swatch-var-215) !important;
  font-weight: 500;
  text-shadow: 0px -0px 2px #ffffff;
}

.img-laura-rou-style {
  width: 250px;
  height: 250px;
}

.img-maria-rou-style {
  width: 250px;
  height: 250px;
}

.img-dicen-style {
  height: 122px;
}

.p-profesores-style {
  width: 92.84%;
}

.img-logo-ast-style {
  width: 220px;
}

.form-btn {
  background-color: var(--swatch-var-215);
  font-family: 'BrandonGrotesque-Medium';
  font-weight: 400;
}

.red {
  color: #aa2600 !important;
}

.mini-feature-colors {
  position: relative;
  height: 328px;
}

.mini-feature-color-1 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  min-width: 150px;
  min-height: 150px;
  max-width: 150px;
  max-height: 150px;
  position: absolute;
  left: 7%;
  top: 14%;
}

.mini-feature-color-2 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  min-width: 150px;
  max-width: 150px;
  min-height: 150px;
  max-height: 150px;
  position: absolute;
  right: 7%;
  top: 28%;
}

.mini-feature-color-3 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  min-width: 150px;
  max-width: 150px;
  min-height: 150px;
  max-height: 150px;
  position: absolute;
  left: 24%;
  top: 55%;
}

.mini-cta-mail-field {
  height: 50px;
  border-radius: 0px 0px 0px 0px;
  padding-left: 20px;
}

.mini-cta-white-button {
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.button-primary {
  background-color: var(--swatch-var-1056);
  color: #ffffff !important;
}

.button-primary:hover {
  background-color: var(--swatch-var-4580);
}

.mini-small-p {
  font-size: 0.9em;
}

.black-link {
  text-decoration: underline !important;
  color: #000000 !important;
}

.cursos {
  margin: 5rem 5rem 5rem 5rem;
}

.btn-style:hover {
  background-color: var(--swatch-var-1056) !important;
}

.cta-image-background {
  padding: 150px 100px 150px 100px;
  background-size: cover;
  background-position: center center;
  border-radius: 5px 5px 5px 5px;
  background-image: url('img/sofa.jpg');
}

.form-max-width {
  max-width: 500px;
  margin-left: auto;
  margin-right: auto;
}

.h1-7-style {
  font-family: 'BrandonGrotesque-Regular';
  background-color: var(--swatch-var-5708);
}

.p-92-style {
  font-size: 18px;
  line-height: 24px;
}

.cta-row-borders {
  background-size: cover;
  border-width: 0px 0px 1px 0px;
  border-style: solid;
  border-color: var(--swatch-var-1056) !important;
}

.cta-img-bg-short {
  padding: 50px 50px 50px 50px;
  background-size: cover;
  background-position: center center;
  border-radius: 5px 5px 5px 5px;
}

.mini-large-p-white {
  font-size: 1.2em;
  color: var(--swatch-var-3131) !important;
  font-family: 'BrandonGrotesque-Medium';
  font-weight: 400;
  text-decoration: none;
}

.mini-feature-icon {
  font-size: 50px;
}

.bcn-button {
  color: var(--swatch-var-7747) !important;
  background-color: var(--swatch-var-1056);
  font-family: 'BrandonGrotesque-Medium';
  font-weight: 400;
}

.bcn-button:hover {
  color: var(--swatch-var-7747) !important;
  background-color: var(--swatch-var-215) !important;
}

.p-96-style {
  font-size: 18px;
}

.p-97-style {
  font-size: 18px;
}

.p-103-style {
  font-size: 18px;
}

.h4-12-style {
  font-size: 18px;
}

.h2-19-style {
  font-family: 'BrandonGrotesque-Light';
}

.grupo {
  padding: 20px 20px 20px 20px;
  background-color: var(--swatch-var-6441);
  border-radius: 5px 5px 5px 5px;
}

.price-list-item-thin {
  display: inline;
  color: var(--swatch-var-215) !important;
  font-family: 'BrandonGrotesque-Medium';
  font-weight: 400;
  font-size: 1.2rem;
}

.price-list-item-dark {
  display: inline;
  color: var(--swatch-var-4497) !important;
  font-family: 'BrandonGrotesque-Light';
  font-size: 18px;
}

.price-card-short {
  background-color: var(--swatch-var-4207);
  text-align: left;
  padding: 25px 25px 25px 25px;
  border-radius: 30px 30px 30px 30px;
  min-height: 500px;
}

.price-card-shortest {
  background-color: var(--swatch-var-4207);
  text-align: left;
  padding: 25px 25px 25px 25px;
  border-radius: 30px 30px 30px 30px;
  min-height: 400px;
}

.img-anoush-style {
  width: 300px;
}

.img-bloc-39-style {
  width: 280px;
}

.img-48-style {
  width: 300px;
}

.img-aleks-style {
  width: 275px;
}

.img-sabi-style {
  width: 290px;
}

.h1-bloc-slider-style {
  font-family: 'BrandonGrotesque-Medium';
  font-size: 48px;
}

.h3-bloc-style {
  font-family: 'BrandonGrotesque-Medium';
  font-size: 32px;
  color: var(--swatch-var-1056) !important;
}

.p-bloc-slider-style {
  font-family: 'BrandonGrotesque-Medium';
  font-size: 20px;
  font-weight: 400;
}

.p-conectate-style {
  font-family: 'BrandonGrotesque-Medium';
  font-size: 20px;
  font-weight: 300;
}

.h2-conectate-style {
  font-family: 'BrandonGrotesque-Medium';
  font-weight: 400;
  font-size: 36px;
}

.bcn-button-white {
  font-family: 'BrandonGrotesque-Medium';
  font-weight: 400;
  color: var(--swatch-var-1056) !important;
  background-color: var(--swatch-var-7747);
  margin-top: 1.5rem;
}

.bcn-button-white:hover {
  background-color: var(--swatch-var-215) !important;
}

.mini-text-logo {
  font-size: 1.8em;
  text-transform: uppercase;
}

.menu-icon-29711-stroke {
  stroke: var(--swatch-var-2868) !important;
  fill: var(--swatch-var-2868) !important;
}

.navlink-margin {
  margin-left: 7px;
  margin-right: 7px;
}

.top-menu {
  font-family: 'BrandonGrotesque-Medium';
  color: var(--swatch-var-1056) !important;
  text-transform: uppercase;
  font-weight: 500;
}

.top-menu:hover {
  color: var(--swatch-var-215) !important;
}

.label-style {
  font-family: 'BrandonGrotesque-Regular';
  font-size: 20px;
  color: var(--swatch-var-215) !important;
}

.mini-large-p-white:hover {
  font-weight: 500;
}

.container-div-min-height {
  max-height: 543px;
}

.custom-header {
  padding: 10px 0px 10px 0px;
}

.nav-4-row {
  position: relative;
}

.nav-4-visible {
  position: relative;
  z-index: 3;
}

.menu-button {
  position: relative;
  height: 40px;
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  flex-direction: row-reverse;
  justify-content: flex-start;
}

.nav-4-menu {
  z-index: 1;
  min-width: 100%;
  position: absolute;
  background-color: var(--swatch-var-4521);
  padding: 10px 28px 0px 28px;
}

.mega-menu-close-icon {
  padding-top: 1px;
}

.h1-bloc-style {
  font-family: 'BrandonGrotesque-Bold';
  font-size: 5rem;
  text-transform: none;
  color: var(--swatch-var-1056) !important;
}

.h3-bloc-slider-style {
  font-family: 'BrandonGrotesque-Medium';
  font-size: 36px;
}

.testimonial-carousel-img {
  opacity: 0;
}

.carousel-review {
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

.img-georg-style {
  width: 400px;
}

.menu-icon-0-stroke {
  stroke: var(--swatch-var-7747) !important;
  fill: var(--swatch-var-7747) !important;
}

.dark-backgraound {
  background-color: var(--swatch-var-2868);
}

.top-menu:active {
  color: var(--swatch-var-4521) !important;
}

.p-bloc-32-style {
  font-size: 24px;
}

.curso-card {
  border-radius: 5px;
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/* = Colour
-------------------------------------------------------------- */

/* Unified Color System Variables */
:root {
  /* ===== MAIN BRAND COLORS (SWAPPED) ===== */
  /* Primary Color: Purple (was secondary, now main) */
  --swatch-var-1056: rgba(68, 38, 90, 1); /* PRIMARY: Purple #44265A */
  --swatch-var-1056-rgb: 68, 38, 90;
  --swatch-var-1056-hex: #44265a;

  /* Secondary Color: Blue (was primary, now secondary) */
  --swatch-var-215: rgba(7, 141, 177, 1); /* SECONDARY: Blue #078DB1 */
  --swatch-var-215-rgb: 7, 141, 177;
  --swatch-var-215-hex: #078db1;

  /* ===== COLOR VARIATIONS ===== */
  /* Hover and interaction states */
  --swatch-var-1056-hover: #2e1a3c; /* Darker purple for hover */
  --swatch-var-215-hover: #05637a; /* Darker blue for hover */
  --swatch-var-1056-light: rgba(68, 38, 90, 0.1); /* Light purple tint */
  --swatch-var-215-light: rgba(7, 141, 177, 0.1); /* Light blue tint */

  /* ===== BOOTSTRAP INTEGRATION ===== */
  /* Override Bootstrap primary/secondary with our brand colors */
  --bs-primary: var(--swatch-var-1056-hex);
  --bs-primary-rgb: var(--swatch-var-1056-rgb);
  --bs-secondary: var(--swatch-var-215-hex);
  --bs-secondary-rgb: var(--swatch-var-215-rgb);

  /* Bootstrap button colors */
  --bs-btn-primary-bg: var(--swatch-var-1056-hex);
  --bs-btn-primary-border: var(--swatch-var-1056-hex);
  --bs-btn-primary-hover-bg: var(--swatch-var-1056-hover);
  --bs-btn-primary-hover-border: var(--swatch-var-1056-hover);
  --bs-btn-secondary-bg: var(--swatch-var-215-hex);
  --bs-btn-secondary-border: var(--swatch-var-215-hex);
  --bs-btn-secondary-hover-bg: var(--swatch-var-215-hover);
  --bs-btn-secondary-hover-border: var(--swatch-var-215-hover);

  /* Bootstrap link colors */
  --bs-link-color: var(--swatch-var-1056-hex);
  --bs-link-hover-color: var(--swatch-var-215-hex);

  /* ===== SUPPORTING COLORS ===== */
  --swatch-var-4279: rgba(255, 255, 255, 1); /* White */
  --swatch-var-426: rgba(255, 255, 255, 0.6); /* White 60% */
  --swatch-var-458: rgba(0, 0, 0, 1); /* Black */
  --swatch-var-3202: rgba(5, 0, 0, 0.04); /* Near black 4% */
  --swatch-var-502: rgba(0, 0, 0, 0.5); /* Black 50% */
  --swatch-var-4580: rgba(182, 9, 255, 1); /* Accent purple */
  --swatch-var-5708: rgba(7, 141, 177, 0.6); /* Secondary blue 60% */
  --swatch-var-5490: rgba(63, 64, 64, 1); /* Dark gray text */
  --swatch-var-3131: rgba(249, 249, 249, 1); /* Light gray bg */
  --swatch-var-5803: rgba(16, 16, 16, 1); /* Very dark gray */
  --swatch-var-4497: rgba(32, 32, 32, 1); /* Dark gray */
  --swatch-var-779: rgba(0, 102, 204, 1); /* Info blue */
  --swatch-var-2408: rgba(16, 16, 16, 1); /* Text dark */
  --swatch-var-3939: rgba(32, 32, 32, 1); /* Text darker */
  --swatch-var-2350: rgba(238, 238, 238, 1); /* Light border */
  --swatch-var-7311: rgba(16, 16, 16, 1); /* Text black */
  --swatch-var-2: rgba(255, 255, 255, 1); /* Pure white */
  --swatch-var-5491: rgba(238, 238, 238, 1); /* Light gray */
  --swatch-var-2868: #101010; /* Very dark text */
  --swatch-var-7365: #202020; /* Dark text */
  --swatch-var-7747: rgba(255, 255, 255, 1); /* White text */
  --swatch-var-6441: rgba(238, 238, 238, 1); /* Light text */
  --swatch-var-4521: rgba(255, 255, 255, 1); /* White variant */
  --swatch-var-3006: rgba(188, 105, 170, 1); /* Pink accent */
  --swatch-var-2896: rgba(255, 252, 49, 1); /* Yellow accent */
  --swatch-var-4207: rgba(64, 87, 109, 0.07); /* Blue tint */
  --swatch-var-2405: #ffffff; /* White hex */
  --swatch-var-5468: #eeeeee; /* Light gray hex */
  --swatch-var-1809: #0066cc; /* Info blue hex */
  --swatch-var-4372: #44265a; /* Primary purple hex (legacy) */
  --swatch-var-293: #078db1; /* Secondary blue hex (legacy) */
}

/* Background colour styles */

.bgc-3202 {
  background-color: var(--swatch-var-3202);
}

.bgc-4279 {
  background-color: var(--swatch-var-4279);
}

.bgc-1056 {
  background-color: var(--swatch-var-1056);
}

.bgc-2 {
  background-color: var(--swatch-var-2);
}

.bgc-4207 {
  background-color: var(--swatch-var-4207);
}

.bgc-7747 {
  background-color: var(--swatch-var-7747);
}

.bgc-215 {
  background-color: var(--swatch-var-215);
}

.bgc-3131 {
  background-color: var(--swatch-var-3131);
}

/* Text colour styles */

.tc-4279 {
  color: var(--swatch-var-4279) !important;
}

.tc-502 {
  color: var(--swatch-var-502) !important;
}

.tc-215 {
  color: var(--swatch-var-215) !important;
}

.tc-426 {
  color: var(--swatch-var-426) !important;
}

.tc-1056 {
  color: var(--swatch-var-1056) !important;
}

.tc-5490 {
  color: var(--swatch-var-5490) !important;
}

.tc-2408 {
  color: var(--swatch-var-2408) !important;
}

.tc-779 {
  color: var(--swatch-var-779) !important;
}

.tc-3939 {
  color: var(--swatch-var-3939) !important;
}

.tc-2868 {
  color: var(--swatch-var-2868) !important;
}

.tc-7365 {
  color: var(--swatch-var-7365) !important;
}

.tc-7747 {
  color: var(--swatch-var-7747) !important;
}

.tc-6441 {
  color: var(--swatch-var-6441) !important;
}

.tc-458 {
  color: var(--swatch-var-458) !important;
}

/* Button colour styles */

.btn-c-1056 {
  background: var(--swatch-var-1056);
  color: #ffffff !important;
}

.btn-c-1056:hover {
  background: var(--swatch-var-1056-hover) !important;
  color: #ffffff !important;
}

.btn-c-215 {
  background: var(--swatch-var-215);
  color: #ffffff !important;
}

.btn-c-215:hover {
  background: var(--swatch-var-215-hover) !important;
  color: #ffffff !important;
}

/* Link colour styles */

.ltc-1056 {
  color: var(--swatch-var-1056) !important;
  font-weight: bold;
}

.ltc-1056:hover {
  color: var(--swatch-var-215) !important; /* Blue on hover for primary links */
}

/* Icon colour styles */

.icon-215 {
  color: var(--swatch-var-215) !important;
  border-color: var(--swatch-var-215) !important;
}

/* Bloc image backgrounds */

.bg-header-alt {
  background-image: url('img/header_alt.jpg');
}

.bg-landamarks-bcn {
  background-image: url('img/landamarks_bcn.jpg');
}

.bg-trent-erwin-UgA3Xvi3SkA-unsplash {
  background-image: url('img/trent-erwin-UgA3Xvi3SkA-unsplash.jpg');
}

.bg-woman-make-notes-sit-work-desk-while-study-online {
  background-image: url('img/woman-make-notes-sit-work-desk-while-study-online.jpg');
}

/* = Custom Bric Data
-------------------------------------------------------------- */

/* = Bloc Padding Multi Breakpoint
-------------------------------------------------------------- */

@media (min-width: 576px) {
  .bloc-xxl-sm {
    padding: 200px 20px;
  }

  .bloc-xl-sm {
    padding: 150px 20px;
  }

  .bloc-lg-sm {
    padding: 100px 20px;
  }

  .bloc-md-sm {
    padding: 50px 20px;
  }

  .bloc-sm-sm {
    padding: 20px;
  }

  .bloc-no-padding-sm {
    padding: 0 20px;
  }
}

@media (min-width: 768px) {
  .bloc-xxl-md {
    padding: 200px 20px;
  }

  .bloc-xl-md {
    padding: 150px 20px;
  }

  .bloc-lg-md {
    padding: 100px 20px;
  }

  .bloc-md-md {
    padding: 50px 20px;
  }

  .bloc-sm-md {
    padding: 20px 20px;
  }

  .bloc-no-padding-md {
    padding: 0 20px;
  }
}

@media (min-width: 992px) {
  .bloc-xxl-lg {
    padding: 200px 20px;
  }

  .bloc-xl-lg {
    padding: 150px 20px;
  }

  .bloc-lg-lg {
    padding: 100px 20px;
  }

  .bloc-md-lg {
    padding: 50px 20px;
  }

  .bloc-sm-lg {
    padding: 20px;
  }

  .bloc-no-padding-lg {
    padding: 0 20px;
  }
}

/* ===== BOOTSTRAP COMPONENT OVERRIDES ===== */
/* Ensure all Bootstrap components use our unified colors */

/* Primary button overrides */
.btn-primary {
  background-color: var(--swatch-var-1056) !important;
  border-color: var(--swatch-var-1056) !important;
  color: #ffffff !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  background-color: var(--swatch-var-1056-hover) !important;
  border-color: var(--swatch-var-1056-hover) !important;
  color: #ffffff !important;
}

/* Secondary button overrides */
.btn-secondary {
  background-color: var(--swatch-var-215) !important;
  border-color: var(--swatch-var-215) !important;
  color: #ffffff !important;
}

.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active {
  background-color: var(--swatch-var-215-hover) !important;
  border-color: var(--swatch-var-215-hover) !important;
  color: #ffffff !important;
}

/* Link colors */
a {
  color: var(--swatch-var-1056) !important;
}

a:hover,
a:focus {
  color: var(--swatch-var-215) !important;
}

/* Form controls focus */
.form-control:focus,
.form-select:focus {
  border-color: var(--swatch-var-1056) !important;
  box-shadow: 0 0 0 0.25rem var(--swatch-var-1056-light) !important;
}

/* Navigation active states */
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  background-color: var(--swatch-var-1056) !important;
  color: #ffffff !important;
}

/* Pagination */
.page-link {
  color: var(--swatch-var-1056) !important;
}

.page-item.active .page-link {
  background-color: var(--swatch-var-1056) !important;
  border-color: var(--swatch-var-1056) !important;
  color: #ffffff !important;
}

.page-link:hover,
.page-link:focus {
  color: var(--swatch-var-215) !important;
  background-color: var(--swatch-var-215-light) !important;
}

/* Badges */
.badge.bg-primary {
  background-color: var(--swatch-var-1056) !important;
}

.badge.bg-secondary {
  background-color: var(--swatch-var-215) !important;
}

/* Progress bars */
.progress-bar {
  background-color: var(--swatch-var-1056) !important;
}

/* Alerts */
.alert-primary {
  background-color: var(--swatch-var-1056-light) !important;
  border-color: var(--swatch-var-1056) !important;
  color: var(--swatch-var-1056-hex) !important;
}

.alert-secondary {
  background-color: var(--swatch-var-215-light) !important;
  border-color: var(--swatch-var-215) !important;
  color: var(--swatch-var-215-hex) !important;
}

/* = Mobile adjustments
-------------------------------------------------------------- */
@media (max-width: 1024px) {
  .bloc.full-width-bloc,
  .bloc-tile-2.full-width-bloc .container,
  .bloc-tile-3.full-width-bloc .container,
  .bloc-tile-4.full-width-bloc .container {
    padding-left: 0;
    padding-right: 0;
  }
}

@media (max-width: 991px) {
  .container {
    width: 100%;
  }

  .bloc {
    padding-left: constant(safe-area-inset-left);
    padding-right: constant(safe-area-inset-right);
  }

  /* iPhone X Notch Support*/
  .bloc-group,
  .bloc-group .bloc {
    display: block;
    width: 100%;
  }
}

@media (max-width: 767px) {
  .bloc-tile-2 .container,
  .bloc-tile-3 .container,
  .bloc-tile-4 .container {
    padding-left: 0;
    padding-right: 0;
  }

  .btn-dwn {
    display: none;
  }

  .voffset {
    margin-top: 5px;
  }

  .voffset-md {
    margin-top: 20px;
  }

  .voffset-lg {
    margin-top: 30px;
  }

  form {
    padding: 5px;
  }

  .close-lightbox {
    display: inline-block;
  }

  .blocsapp-device-iphone5 {
    background-size: 216px 425px;
    padding-top: 60px;
    width: 216px;
    height: 425px;
  }

  .blocsapp-device-iphone5 img {
    width: 180px;
    height: 320px;
  }
}

@media (max-width: 991px) {
  .hero-heading {
    font-size: 50px;
  }

  .hero-sub-heading {
    font-family: 'BrandonGrotesque-Medium';
    font-size: 24px;
    color: var(--swatch-var-4279) !important;
    text-shadow: -0px -0px 2px #078db1;
  }

  .rounded-right {
    border-bottom-left-radius: 0px;
    border-top-left-radius: 0px;
  }

  .feature-col {
    margin-bottom: 40px;
  }

  .card-img {
    border-top-left-radius: 10px;
  }

  .page-title {
    font-size: 50px;
  }

  .sub-heading {
    font-size: 20px;
    margin-bottom: 30px;
  }

  .price-card {
    margin-bottom: 20px;
  }

  .mini-large-p {
    font-size: 1.2em;
  }

  .faq-18-box {
    width: 100%;
  }

  .mini-faq-1-question {
    font-size: 1.3em;
  }

  .half-screen-content {
    margin-top: 50px;
    margin-bottom: 50px;
  }

  .image-full-width {
    height: auto;
  }

  .review-logo {
    max-width: 128px;
  }

  .h1-¡hola--style {
    width: 100%;
  }

  .h1-5-style {
    width: 100%;
    color: var(--swatch-var-215) !important;
  }

  .img-laura-rou-style {
    width: 250px;
    height: 250px;
  }

  .img-maria-rou-style {
    width: 250px;
    height: 250px;
  }

  .bloc-slider-about {
    background-position: left center;
  }

  .img-isabel-style {
    width: 122px;
    height: 122px;
  }

  .img-7-style {
    width: 122px;
    height: 122px;
  }

  .img-kathari-style {
    width: 122px;
    height: 122px;
  }

  .img-style {
    width: 635px;
  }

  .btn-style {
    width: 58.02%;
  }

  .mini-feature-color-1 {
    min-width: 128px;
    max-width: 128px;
    min-height: 128px;
    max-height: 128px;
  }

  .mini-feature-color-2 {
    min-width: 128px;
    min-height: 128px;
    max-width: 128px;
    max-height: 128px;
    top: 24%;
  }

  .mini-feature-color-3 {
    min-width: 128px;
    max-width: 128px;
    min-height: 128px;
    max-height: 128px;
    top: 45%;
    left: 20%;
  }

  .cta-image-background {
    padding: 80px 40px 80px 40px;
    margin-left: 30px;
    margin-right: 30px;
  }

  .mini-large-p-white {
    font-size: 1.2em;
  }

  .mini-feature-icon {
    font-size: 45px;
  }

  .price-card-short {
    margin-bottom: 20px;
  }

  .price-card-shortest {
    margin-bottom: 20px;
  }

  .navlink-margin {
    margin-left: 5px;
    margin-right: 5px;
  }

  .custom-header {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .review-carousel-height {
    height: 500px;
    display: flex;
  }

  .dark-backgraound {
    background-color: var(--swatch-var-2868);
  }
}

@media (max-width: 767px) {
  .hero-heading {
    font-size: 40px;
  }

  .hero-sub-heading {
    font-size: 20px;
  }

  .rounded-right {
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
  }

  .rounded-left {
    border-top-left-radius: 15px;
    border-bottom-left-radius: 15px;
  }

  .feature-card {
    margin-bottom: 60px;
  }

  .invita-card {
    padding: 30px 30px 0px 30px;
    background-position: center center;
  }

  .card-img {
    left: 30px;
    width: 480px;
  }

  .page-title {
    font-size: 40px;
  }

  .sub-heading {
    margin-bottom: 30px;
    font-size: 18px;
  }

  .form-btn {
    width: 100%;
  }

  .faq-question-title {
    font-size: 1.1em;
  }

  .mini-faq-1-question {
    font-size: 1.2em;
  }

  .half-screen-content {
    margin-top: 80px;
    margin-bottom: 80px;
  }

  .review-logo {
    max-width: 120px;
  }

  .team-member-name {
    font-size: 1.4em;
  }

  .mini-team-social-icon {
    font-size: 25px;
  }

  .img-maria-rou-style {
    width: 200px;
    height: 200px;
  }

  .img-laura-rou-style {
    width: 200px;
    height: 200px;
  }

  .h2-style {
    width: 100%;
  }

  .btn-style {
    width: 40.04%;
  }

  .mini-feature-color-1 {
    left: 10%;
  }

  .mini-feature-color-2 {
    right: 10%;
  }

  .mini-feature-color-3 {
    left: 28%;
    top: 47%;
  }

  .cta-image-background {
    padding: 60px 20px 60px 20px;
    margin-left: 20px;
    margin-right: 20px;
  }

  .mini-feature-icon {
    font-size: 40px;
  }

  .nav-4-menu {
    padding-left: 15px;
    padding-right: 15px;
  }

  .review-carousel-height {
    display: flex;
    align-items: center;
    height: 500px;
  }
}

@media (max-width: 575px) {
  .hero-heading {
    font-size: 20px;
  }

  .rounded-right {
    border-bottom-right-radius: 10px;
    border-top-right-radius: 10px;
  }

  .rounded-left {
    border-bottom-left-radius: 10px;
    border-top-left-radius: 10px;
  }

  .invita-card {
    padding: 20px 20px 0px 20px;
  }

  .card-img {
    left: 20px;
    width: 240px;
  }

  .page-title {
    font-size: 30px;
  }

  .navbar-brand img {
    width: 220px;
  }

  .bloc-slider {
    background-size: 800px auto;
    background-position: center center;
  }

  .translucid {
    height: 100%;
  }

  .logo {
    height: auto;
  }

  .img-avatar-style {
    background-size: 50% auto;
  }

  .mini-large-p {
    font-size: 1.1em;
  }

  .faq-10-box {
    padding: 18px 14px 10px 14px;
  }

  .faq-18-box {
    padding: 18px 14px 10px 14px;
  }

  .mini-faq-1-question {
    font-size: 1.1em;
  }

  .half-screen-content {
    margin-top: 60px;
    margin-bottom: 60px;
  }

  .review-logo {
    max-width: 110px;
  }

  .faq-p {
    font-size: 1.4em;
  }

  .mini-play-icon {
    width: 80px;
    height: 80px;
    font-size: 49px;
  }

  .header-tags {
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    align-items: center;
  }

  .header-tags-left {
    flex-direction: row;
    justify-content: flex-start;
    flex-wrap: wrap;
    align-items: center;
  }

  .bloc-slider-about {
    background-size: length;
    background-position: center center;
  }

  .h1-¡hola--style {
    font-size: 75px;
  }

  .img-style {
    width: 233px;
  }

  .btn-style {
    width: 100%;
  }

  .mini-feature-colors {
    height: 280px;
  }

  .mini-feature-color-1 {
    top: 0%;
    left: 0%;
  }

  .mini-feature-color-2 {
    top: 14%;
    right: 0%;
  }

  .mini-feature-color-3 {
    left: 20%;
    top: 34%;
  }

  .mini-cta-mail-field {
    margin-bottom: 14px;
  }

  .cta-image-background {
    padding: 30px 10px 30px 10px;
    margin-right: 0px;
    margin-left: 0px;
  }

  .cta-img-bg-short {
    padding: 28px 15px 28px 15px;
  }

  .mini-large-p-white {
    font-size: 1.1em;
  }

  .mini-feature-icon {
    font-size: 35px;
  }

  .review-carousel-height {
    height: 600px;
  }

  .h1-bloc-style {
    font-size: 3.5rem;
  }
}

/* = Gutenberg Custom List Styles with Check Icons
-------------------------------------------------------------- */

/* Target only ul lists in Gutenberg content blocks */
.gutenberg-content .wp-block-list,
.gutenberg-content .wp-block-list ul,
.gutenberg-content ul,
.entry-content .wp-block-list,
.entry-content .wp-block-list ul,
.entry-content ul,
.wp-block-group ul,
.wp-block-column ul {
  list-style: none;
  padding-left: 0;
}

.gutenberg-content .wp-block-list li,
.gutenberg-content .wp-block-list ul li,
.gutenberg-content ul li,
.entry-content .wp-block-list li,
.entry-content .wp-block-list ul li,
.entry-content ul li,
.wp-block-group ul li,
.wp-block-column ul li {
  position: relative;
  padding-left: 40px;
  margin-bottom: 12px;
  line-height: 1.6;
}

/* Create custom check icon using CSS - only in Gutenberg content */
.gutenberg-content .wp-block-list li:before,
.gutenberg-content .wp-block-list ul li:before,
.gutenberg-content ul li:before,
.entry-content .wp-block-list li:before,
.entry-content .wp-block-list ul li:before,
.entry-content ul li:before,
.wp-block-group ul li:before,
.wp-block-column ul li:before {
  content: "";
  position: absolute;
  left: 0;
  top: 2px;
  width: 24px;
  height: 24px;
  background-color: var(--swatch-var-215);
  border-radius: 50%;
  background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTEiIHZpZXdCb3g9IjAgMCAxNCAxMSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEgNS41TDUgOS41TDEzIDEuNSIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 11px;
  box-shadow: 0 2px 8px rgba(68, 38, 90, 0.3);
  transition: all 0.3s ease;
}

/* Hover effect for list items - only in Gutenberg content */
.gutenberg-content .wp-block-list li:hover:before,
.gutenberg-content .wp-block-list ul li:hover:before,
.gutenberg-content ul li:hover:before,
.entry-content .wp-block-list li:hover:before,
.entry-content .wp-block-list ul li:hover:before,
.entry-content ul li:hover:before,
.wp-block-group ul li:hover:before,
.wp-block-column ul li:hover:before {
  transform: scale(1.1);
  box-shadow: 0 4px 12px rgba(68, 38, 90, 0.4);
}

.gutenberg-content .wp-block-list li:hover,
.gutenberg-content .wp-block-list ul li:hover,
.gutenberg-content ul li:hover,
.entry-content .wp-block-list li:hover,
.entry-content .wp-block-list ul li:hover,
.entry-content ul li:hover,
.wp-block-group ul li:hover,
.wp-block-column ul li:hover {
  transform: translateX(5px);
}

/* Nested lists - only in Gutenberg content */
.gutenberg-content .wp-block-list li ul,
.gutenberg-content .wp-block-list ul li ul,
.gutenberg-content ul li ul,
.entry-content .wp-block-list li ul,
.entry-content .wp-block-list ul li ul,
.entry-content ul li ul,
.wp-block-group ul li ul,
.wp-block-column ul li ul {
  margin-top: 8px;
  margin-bottom: 0;
}

/* Exclude navigation and menu areas */
nav ul,
nav ul li,
.navbar ul,
.navbar ul li,
.menu ul,
.menu ul li,
.footer ul,
.footer ul li,
header ul,
header ul li,
.header ul,
.header ul li {
  list-style: none !important;
  padding-left: 0 !important;
}

nav ul li:before,
.navbar ul li:before,
.menu ul li:before,
.footer ul li:before,
header ul li:before,
.header ul li:before {
  display: none !important;
}

/* Exclude specific classes if needed */
.no-custom-bullets,
.no-custom-bullets ul,
.no-custom-bullets li {
  list-style: disc !important;
  padding-left: 20px !important;
}

.no-custom-bullets li:before {
  display: none !important;
}

/* = Basic Multi-Level Dropdown Menu Support
-------------------------------------------------------------- */

/* Ensure nested dropdowns work properly */
@media (min-width: 992px) {
  .navbar-nav .dropdown-menu .dropdown-menu {
    position: absolute;
    top: 0;
    left: 100%;
    margin-top: 0;
  }
}
