.elementor-240 .elementor-element.elementor-element-5670d38{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-240 .elementor-element.elementor-element-c698cff{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-240 .elementor-element.elementor-element-79d11a5{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-240 .elementor-element.elementor-element-6dcfbbc{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-240 .elementor-element.elementor-element-2fd80b7{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-240 .elementor-element.elementor-element-9422e41{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-240 .elementor-element.elementor-element-3599e99{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-240 .elementor-element.elementor-element-e904c55{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-240 .elementor-element.elementor-element-1b76052{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-240 .elementor-element.elementor-element-e3d30f4{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-240 .elementor-element.elementor-element-9b3e5ec{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-240 .elementor-element.elementor-element-6f94cf0{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-240 .elementor-element.elementor-element-f7de77f{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-240 .elementor-element.elementor-element-850295f{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-240 .elementor-element.elementor-element-170f82a{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}/* Start custom CSS for html, class: .elementor-element-42c5a26 *//* ==========================================
   ROOT
========================================== */

:root {

  --header-bg: #F7F2E8;

  --header-text: #211F1B;

  --header-gold: #C9A227;

  --header-border: #D8C39A;

  --header-black: #0B0A08;

}


/* ==========================================
   HEADER
========================================== */

.lela-header {

  position: relative;

  width: 100%;

  z-index: 9999;

  background:
    var(--header-bg);

  border-bottom:
    1px solid
    rgba(
      216,
      195,
      154,
      0.7
    );

  color:
    var(--header-text);

}


.lela-header *,
.lela-header *::before,
.lela-header *::after {

  box-sizing:
    border-box;

}


/* ==========================================
   CONTAINER
========================================== */

.header-container {

  width:
    min(
      1380px,
      92%
    );

  min-height:
    88px;

  margin:
    0 auto;

  display:
    flex;

  align-items:
    center;

  gap:
    30px;

}


/* ==========================================
   LOGO
========================================== */

.header-logo {

  display:
    inline-flex;

  align-items:
    center;

  flex-shrink:
    0;

  text-decoration:
    none !important;

}


.header-logo-image {

  display:
    block;

  width:
    220px !important;

  height:
    auto;

  max-width:
    100%;

  object-fit:
    contain;

}


/* ==========================================
   NAVIGATION
========================================== */

.header-nav {

  flex:
    1;

  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  gap:
    clamp(
      14px,
      1.5vw,
      27px
    );

}


.nav-link {

  position:
    relative;

  padding:
    8px 0;

  color:
    var(--header-text);

  font-family:
    "DM Sans",
    Arial,
    sans-serif;

  font-size:
    12px !important;

  font-weight:
    600 !important;

  letter-spacing:
    1.2px;

  text-decoration:
    none !important;

  white-space:
    nowrap;

  transition:
    color 0.3s ease;

}


/* ==========================================
   NAV UNDERLINE
========================================== */

.nav-link::after {

  content:
    "";

  position:
    absolute;

  left:
    0;

  bottom:
    0;

  width:
    0;

  height:
    1px;

  background:
    var(--header-gold);

  transition:
    width 0.3s ease;

}


.nav-link:hover,
.nav-link.active {

  color:
    var(--header-gold);

}


.nav-link:hover::after,
.nav-link.active::after {

  width:
    100%;

}


/* ==========================================
   HEADER CTA
========================================== */

.header-cta {

  min-height:
    43px;

  padding:
    0 17px;

  display:
    inline-flex;

  align-items:
    center;

  justify-content:
    center;

  gap:
    10px;

  flex-shrink:
    0;

  color:
    var(--header-black);

  background:
    var(--header-gold);

  border:
    1px solid
    var(--header-gold);

  border-radius:
    7px;

  font-family:
    "DM Sans",
    Arial,
    sans-serif;

  font-size:
    8px;

  font-weight:
    700;

  letter-spacing:
    1.1px;

  text-decoration:
    none !important;

  white-space:
    nowrap;

  transition:
    background 0.3s ease,
    transform 0.3s ease,
    gap 0.3s ease;

}


.header-cta strong {

  font-size:
    15px;

  font-weight:
    400;

  transition:
    transform 0.3s ease;

}


.header-cta:hover {

  color:
    var(--header-black);

  background:
    #E0C15A;

  border-color:
    #E0C15A;

  transform:
    translateY(-2px);

  gap:
    14px;

}


.header-cta:hover strong {

  transform:
    translateX(3px);

}


/* ==========================================
   MOBILE MENU BUTTON
========================================== */

.mobile-menu-button {

  display:
    none;

  width:
    42px;

  height:
    42px;

  padding:
    9px;

  margin-left:
    auto;

  align-items:
    center;

  justify-content:
    center;

  flex-direction:
    column;

  gap:
    5px;

  background:
    transparent;

  border:
    1px solid
    rgba(
      33,
      31,
      27,
      0.25
    );

  cursor:
    pointer;

}


.mobile-menu-button span {

  width:
    20px;

  height:
    1px;

  background:
    var(--header-text);

  transition:
    transform 0.3s ease,
    opacity 0.3s ease;

}


/* ==========================================
   MOBILE MENU OPEN ICON
========================================== */

.mobile-menu-button.menu-open
span:nth-child(1) {

  transform:
    translateY(6px)
    rotate(45deg);

}


.mobile-menu-button.menu-open
span:nth-child(2) {

  opacity:
    0;

}


.mobile-menu-button.menu-open
span:nth-child(3) {

  transform:
    translateY(-6px)
    rotate(-45deg);

}


/* ==========================================
   MOBILE MENU
========================================== */

.mobile-menu {

  display:
    none;

  max-height:
    0;

  overflow:
    hidden;

  background:
    var(--header-bg);

  border-top:
    1px solid
    transparent;

  transition:
    max-height 0.45s ease,
    border-color 0.3s ease;

}


.mobile-menu.menu-visible {

  max-height:
    700px;

  border-top-color:
    rgba(
      216,
      195,
      154,
      0.6
    );

}


.mobile-menu nav {

  width:
    88%;

  margin:
    0 auto;

  padding:
    15px 0 25px;

  display:
    flex;

  flex-direction:
    column;

}


/* ==========================================
   MOBILE LINKS
========================================== */

.mobile-nav-link {

  padding:
    16px 4px;

  color:
    var(--header-text);

  border-bottom:
    1px solid
    rgba(
      216,
      195,
      154,
      0.5
    );

  font-family:
    "DM Sans",
    Arial,
    sans-serif;

  font-size:
    11px;

  font-weight:
    600;

  letter-spacing:
    1.5px;

  text-decoration:
    none;

  transition:
    color 0.3s ease,
    padding-left 0.3s ease;

}


.mobile-nav-link:hover {

  color:
    var(--header-gold);

  padding-left:
    10px;

}


/* ==========================================
   MOBILE COMMUNITY BUTTON
========================================== */

.mobile-community-button {

  margin-top:
    22px;

  padding:
    15px 20px;

  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  color:
    var(--header-black);

  background:
    var(--header-gold);

  border-radius:
    7px;

  font-family:
    "DM Sans",
    Arial,
    sans-serif;

  font-size:
    9px;

  font-weight:
    700;

  letter-spacing:
    1.4px;

  text-decoration:
    none;

}


/* ==========================================
   TABLET
========================================== */

@media (max-width: 1150px) {

  .header-container {

    gap:
      20px;

  }


  .header-logo-image {

    width:
      145px;

  }


  .header-nav {

    gap:
      13px;

  }


  .nav-link {

    font-size:
      8px;

    letter-spacing:
      0.8px;

  }


  .header-cta {

    padding:
      0 13px;

    font-size:
      7px;

  }

}


/* ==========================================
   MOBILE / SMALL TABLET
========================================== */

@media (max-width: 900px) {

  .header-container {

    min-height:
      76px;

  }


  .header-logo-image {

    width:
      150px;

  }


  .header-nav,
  .header-cta {

    display:
      none;

  }


  .mobile-menu-button {

    display:
      flex;

  }


  .mobile-menu {

    display:
      block;

  }

}


/* ==========================================
   SMALL MOBILE
========================================== */

@media (max-width: 480px) {

  .header-container {

    width:
      90%;

    min-height:
      70px;

  }


  .header-logo-image {

    width:
      135px;

  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-1eedb94 *//* ==========================================
   ROOT
========================================== */

:root {

  --about-hero-black: #0B0A08;

  --about-hero-ivory: #F7F2E8;

  --about-hero-gold: #C9A227;

  --about-hero-text: #D8C39A;

}


/* ==========================================
   SECTION
========================================== */

.lela-about-hero {

  position: relative;

  overflow: hidden;

  padding: 140px 0;

  background: #0B0A08;

  color: #F7F2E8;

}


/* ==========================================
   CONTAINER
========================================== */

.about-hero-container {

  width: min(1180px, 90%);

  margin: auto;

  display: grid;

  grid-template-columns:
    1.08fr
    0.92fr;

  align-items: center;

  gap: 100px;

  position: relative;

  z-index: 3;

}


/* ==========================================
   CONTENT
========================================== */

.about-hero-content {

  position: relative;

  max-width: 620px;

  opacity: 0;

  transform: translateY(40px);

  transition:
    opacity 0.9s ease,
    transform 0.9s ease;

}


.about-hero-content.reveal {

  opacity: 1;

  transform: translateY(0);

}


/* ==========================================
   EYEBROW
========================================== */

.about-hero-eyebrow {

  display: flex;

  align-items: center;

  gap: 14px;

  margin-bottom: 24px;

  color: #C9A227;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 12px;

  font-weight: 600;

  letter-spacing: 3px;

  text-transform: uppercase;

}


.about-hero-eyebrow span {

  width: 42px;

  height: 1px;

  background: #C9A227;

}


/* ==========================================
   HEADING
========================================== */

.about-hero-heading {

  margin: 0 0 28px;

  color: #F7F2E8;

  font-family:
    "Playfair Display",
    serif;

  font-size:
    clamp(48px, 5vw, 72px);

  font-weight: 600;

  line-height: 1.05;

  letter-spacing: -1.5px;

}


.about-hero-heading span {

  display: block;

  color: #C9A227;

  font-style: italic;

  font-weight: 500;

}


/* ==========================================
   DIVIDER
========================================== */

.about-hero-divider {

  width: 75px;

  height: 1px;

  margin: 0 0 30px;

  background: #C9A227;

}


/* ==========================================
   TEXT
========================================== */

.about-hero-text {

  max-width: 560px;

  margin: 0 0 32px;

  color: #D8C39A;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 15px;

  line-height: 1.9;

}


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

.about-hero-button {

  display: inline-flex;

  align-items: center;

  justify-content: center;

  gap: 20px;

  min-height: 55px;

  padding: 0 25px;

  border: 1px solid #C9A227;

  color: #F7F2E8;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 12px;

  font-weight: 600;

  letter-spacing: 1.5px;

  text-transform: uppercase;

  text-decoration: none !important;

  transition:
    background 0.3s ease,
    color 0.3s ease,
    transform 0.3s ease,
    gap 0.3s ease;

}


.about-hero-button strong {

  color: #C9A227;

  font-size: 20px;

  font-weight: 400;

  transition:
    transform 0.3s ease,
    color 0.3s ease;

}


.about-hero-button:hover {

  background: #C9A227;

  color: #0B0A08;

  transform: translateY(-3px);

  gap: 26px;

}


.about-hero-button:hover strong {

  color: #0B0A08;

  transform: translateX(5px);

}


/* ==========================================
   IMAGE COLUMN
========================================== */

.about-hero-image-column {

  position: relative;

  width: 100%;

  max-width: 470px;

  margin-left: auto;

  padding: 15px;

  opacity: 0;

  transform: translateY(40px);

  transition:
    opacity 0.9s ease 0.15s,
    transform 0.9s ease 0.15s;

}


.about-hero-image-column.reveal {

  opacity: 1;

  transform: translateY(0);

}


/* ==========================================
   IMAGE FRAME
========================================== */

.about-hero-frame {

  position: absolute;

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  border:
    1px solid
    rgba(
      201,
      162,
      39,
      0.65
    );

  transform:
    translate(
      15px,
      15px
    );

  pointer-events: none;

  z-index: 1;

}


/* ==========================================
   IMAGE
========================================== */

.about-hero-image-wrap {

  position: relative;

  z-index: 2;

  width: 100%;

  aspect-ratio: 4 / 5;

  overflow: hidden;

  background: #15130F;

  box-shadow:
    0 30px 80px
    rgba(
      0,
      0,
      0,
      0.35
    );

}


.about-hero-image {

  width: 100%;

  height: 100%;

  display: block;

  object-fit: cover;

  filter:
    grayscale(8%)
    saturate(0.85)
    contrast(1.08);

  transition:
    transform 0.9s ease,
    filter 0.9s ease;

}


.about-hero-image-column:hover
.about-hero-image {

  transform: scale(1.05);

  filter:
    grayscale(0%)
    saturate(1)
    contrast(1.05);

}


/* ==========================================
   IMAGE OVERLAY
========================================== */

.about-hero-image-wrap::after {

  content: "";

  position: absolute;

  inset: 0;

  background:
    linear-gradient(
      180deg,
      rgba(11, 10, 8, 0.02) 35%,
      rgba(11, 10, 8, 0.55) 100%
    );

  pointer-events: none;

}


/* ==========================================
   IMAGE CAPTION
========================================== */

.about-hero-caption {

  display: flex;

  align-items: center;

  gap: 12px;

  margin-top: 22px;

  color: #D8CFC0;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 10px;

  font-weight: 500;

  letter-spacing: 3px;

  text-transform: uppercase;

}


.about-hero-caption span {

  width: 35px;

  height: 1px;

  background: #C9A227;

}


/* ==========================================
   NUMBER
========================================== */

.about-hero-number {

  position: absolute;

  left: -10px;

  top: 35px;

  z-index: 5;

  color: #C9A227;

  font-family:
    "Playfair Display",
    serif;

  font-size: 58px;

  font-weight: 500;

  font-style: italic;

  line-height: 1;

}


/* ==========================================
   BACKGROUND GLOW
========================================== */

.about-hero-glow {

  position: absolute;

  width: 620px;

  height: 620px;

  right: -240px;

  top: 50%;

  transform: translateY(-50%);

  border-radius: 50%;

  background:
    radial-gradient(
      circle,
      rgba(201, 162, 39, 0.10),
      rgba(201, 162, 39, 0.025) 40%,
      transparent 72%
    );

  pointer-events: none;

}


/* ==========================================
   ORBITS
========================================== */

.about-hero-orbit {

  position: absolute;

  border:
    1px solid
    rgba(
      201,
      162,
      39,
      0.10
    );

  border-radius: 50%;

  pointer-events: none;

}


.about-orbit-one {

  width: 520px;

  height: 520px;

  right: -300px;

  top: -150px;

}


.about-orbit-two {

  width: 280px;

  height: 280px;

  left: -190px;

  bottom: -150px;

}


/* ==========================================
   GOLD DOT
========================================== */

.lela-about-hero::after {

  content: "";

  position: absolute;

  width: 7px;

  height: 7px;

  border-radius: 50%;

  background: #C9A227;

  right: 12%;

  top: 30%;

  box-shadow:
    0 0 25px
    rgba(
      201,
      162,
      39,
      0.55
    );

  animation:
    aboutHeroPulse
    3s
    ease-in-out
    infinite;

}


@keyframes aboutHeroPulse {

  0%,
  100% {

    opacity: 0.4;

    transform: scale(1);

  }

  50% {

    opacity: 1;

    transform: scale(1.5);

  }

}


/* ==========================================
   ELEMENTOR EDITOR FIX
========================================== */

body.elementor-editor-active
.about-hero-content,
body.elementor-editor-active
.about-hero-image-column {

  opacity: 1 !important;

  transform: none !important;

}


body.elementor-editor-active
.about-hero-image {

  opacity: 1 !important;

  visibility: visible !important;

}


/* ==========================================
   TABLET
========================================== */

@media (max-width: 950px) {

  .lela-about-hero {

    padding: 105px 0;

  }


  .about-hero-container {

    width: min(700px, 88%);

    grid-template-columns: 1fr;

    gap: 70px;

  }


  .about-hero-content {

    max-width: 100%;

  }


  .about-hero-image-column {

    width: 100%;

    max-width: 480px;

    margin: auto;

  }

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 600px) {

  .lela-about-hero {

    padding: 80px 0;

  }


  .about-hero-container {

    width: 88%;

    gap: 55px;

  }


  .about-hero-heading {

    font-size: 46px;

    letter-spacing: -1px;

  }


  .about-hero-text {

    font-size: 14px;

    line-height: 1.85;

  }


  .about-hero-button {

    width: 100%;

  }


  .about-hero-image-column {

    padding: 10px;

  }


  .about-hero-number {

    left: -2px;

    top: 25px;

    font-size: 45px;

  }


  .about-hero-caption {

    font-size: 8px;

    letter-spacing: 2px;

  }


  .about-orbit-one {

    width: 300px;

    height: 300px;

    right: -220px;

  }


  .about-orbit-two {

    width: 200px;

    height: 200px;

    left: -150px;

  }

}


/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

  .about-hero-image,
  .about-hero-button,
  .about-hero-content,
  .about-hero-image-column {

    transition: none !important;

  }


  .lela-about-hero::after {

    animation: none !important;

  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-6ad774f *//* ==========================================
   ROOT
========================================== */

:root {

  --meet-bg: #F7F2E8;

  --meet-black: #211F1B;

  --meet-gold: #C9A227;

  --meet-text: #4A443B;

  --meet-champagne: #D8C39A;

}


/* ==========================================
   SECTION
========================================== */

.lela-meet {

  position: relative;

  overflow: hidden;

  padding: 130px 0;

  background: #F7F2E8;

  color: #211F1B;

}


/* ==========================================
   CONTAINER
========================================== */

.meet-container {

  width: min(1180px, 90%);

  margin: auto;

  display: grid;

  grid-template-columns:
    0.9fr
    1.1fr;

  align-items: center;

  gap: 100px;

  position: relative;

  z-index: 3;

}


/* ==========================================
   IMAGE COLUMN
========================================== */

.meet-image-column {

  position: relative;

  width: 100%;

  max-width: 460px;

  padding: 15px;

  opacity: 0;

  transform: translateY(40px);

  transition:
    opacity 0.9s ease,
    transform 0.9s ease;

}


.meet-image-column.reveal {

  opacity: 1;

  transform: translateY(0);

}


/* ==========================================
   IMAGE FRAME
========================================== */

.meet-image-frame {

  position: absolute;

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  border:
    1px solid
    rgba(
      201,
      162,
      39,
      0.45
    );

  transform:
    translate(
      14px,
      14px
    );

  pointer-events: none;

  z-index: 1;

}


/* ==========================================
   IMAGE
========================================== */

.meet-image-wrap {

  position: relative;

  z-index: 2;

  width: 100%;

  aspect-ratio: 4 / 5;

  overflow: hidden;

  background: #E9DFCC;

  box-shadow:
    0 25px 70px
    rgba(
      11,
      10,
      8,
      0.10
    );

}


.meet-image {

  width: 100%;

  height: 100%;

  display: block;

  object-fit: cover;

  filter:
    saturate(0.85)
    contrast(1.03);

  transition:
    transform 0.8s ease,
    filter 0.8s ease;

}


.meet-image-column:hover
.meet-image {

  transform: scale(1.04);

  filter:
    saturate(1)
    contrast(1.05);

}


/* ==========================================
   GOLD CORNERS
========================================== */

.meet-corner {

  position: absolute;

  width: 75px;

  height: 75px;

  z-index: 4;

  pointer-events: none;

}


.meet-corner-top {

  top: -14px;

  right: -14px;

  border-top:
    1px solid #C9A227;

  border-right:
    1px solid #C9A227;

}


.meet-corner-bottom {

  bottom: -14px;

  left: -14px;

  border-bottom:
    1px solid #C9A227;

  border-left:
    1px solid #C9A227;

}


/* ==========================================
   IMAGE CAPTION
========================================== */

.meet-caption {

  position: absolute;

  bottom: -5px;

  right: 0;

  display: flex;

  align-items: center;

  gap: 10px;

  color: #211F1B;

  font-family:
    "Playfair Display",
    serif;

  font-size: 15px;

  letter-spacing: 1px;

}


.meet-caption span {

  width: 28px;

  height: 1px;

  background: #C9A227;

}


/* ==========================================
   NUMBER
========================================== */

.meet-number {

  position: absolute;

  left: -10px;

  top: 32px;

  z-index: 5;

  color: #C9A227;

  font-family:
    "Playfair Display",
    serif;

  font-size: 58px;

  font-weight: 500;

  font-style: italic;

  line-height: 1;

}


/* ==========================================
   CONTENT
========================================== */

.meet-content {

  position: relative;

  max-width: 620px;

  opacity: 0;

  transform: translateY(40px);

  transition:
    opacity 0.9s ease 0.15s,
    transform 0.9s ease 0.15s;

}


.meet-content.reveal {

  opacity: 1;

  transform: translateY(0);

}


/* ==========================================
   EYEBROW
========================================== */

.meet-eyebrow {

  display: flex;

  align-items: center;

  gap: 14px;

  margin-bottom: 25px;

  color: #C9A227;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 12px;

  font-weight: 600;

  letter-spacing: 3px;

  text-transform: uppercase;

}


.meet-eyebrow span {

  width: 42px;

  height: 1px;

  background: #C9A227;

}


/* ==========================================
   HEADING
========================================== */

.meet-heading {

  margin: 0 0 30px;

  color: #211F1B;

  font-family:
    "Playfair Display",
    serif;

  font-size:
    clamp(48px, 5vw, 70px);

  font-weight: 600;

  line-height: 1.08;

  letter-spacing: -1.5px;

}


.meet-heading span {

  display: block;

  color: #C9A227;

  font-style: italic;

  font-weight: 500;

}


/* ==========================================
   DIVIDER
========================================== */

.meet-divider {

  width: 75px;

  height: 1px;

  margin: 0 0 30px;

  background: #C9A227;

}


/* ==========================================
   BIOGRAPHY
========================================== */

.meet-biography {

  max-width: 600px;

}


.meet-biography p {

  margin: 0 0 17px;

  color: #4A443B;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 15px;

  line-height: 1.85;

}


.meet-biography p:last-child {

  margin-bottom: 0;

}


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

.meet-biography .meet-intro {

  margin-bottom: 25px;

  color: #4A443B;

  font-size: 18px;

  line-height: 1.85;

}


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

.meet-button {

  display: inline-flex;

  align-items: center;

  justify-content: center;

  gap: 20px;

  min-height: 55px;

  margin-top: 30px;

  padding: 0 24px;

  border: 1px solid #C9A227;

  color: #211F1B;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 12px;

  font-weight: 600;

  letter-spacing: 1.5px;

  text-transform: uppercase;

  text-decoration: none !important;

  transition:
    background 0.3s ease,
    color 0.3s ease,
    transform 0.3s ease,
    gap 0.3s ease;

}


.meet-button strong {

  color: #C9A227;

  font-size: 19px;

  font-weight: 400;

  transition:
    transform 0.3s ease,
    color 0.3s ease;

}


.meet-button:hover {

  background: #C9A227;

  color: #211F1B;

  transform: translateY(-3px);

  gap: 25px;

}


.meet-button:hover strong {

  color: #211F1B;

  transform: translateX(4px);

}


/* ==========================================
   BACKGROUND CIRCLES
========================================== */

.meet-circle {

  position: absolute;

  border:
    1px solid
    rgba(
      216,
      195,
      154,
      0.35
    );

  border-radius: 50%;

  pointer-events: none;

}


.meet-circle-one {

  width: 420px;

  height: 420px;

  left: -280px;

  top: 8%;

}


.meet-circle-two {

  width: 240px;

  height: 240px;

  right: -110px;

  bottom: 5%;

}


/* ==========================================
   ELEMENTOR EDITOR FIX
========================================== */

body.elementor-editor-active
.meet-image-column,
body.elementor-editor-active
.meet-content {

  opacity: 1 !important;

  transform: none !important;

}


body.elementor-editor-active
.meet-image {

  opacity: 1 !important;

  visibility: visible !important;

}


/* ==========================================
   TABLET
========================================== */

@media (max-width: 950px) {

  .lela-meet {

    padding: 100px 0;

  }


  .meet-container {

    grid-template-columns: 1fr;

    gap: 70px;

    width:
      min(700px, 88%);

  }


  .meet-image-column {

    width: 100%;

    max-width: 480px;

    margin: auto;

  }


  .meet-content {

    max-width: 100%;

  }

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 600px) {

  .lela-meet {

    padding: 80px 0;

  }


  .meet-container {

    width: 88%;

    gap: 55px;

  }


  .meet-image-column {

    padding: 10px;

  }


  .meet-heading {

    font-size: 46px;

    letter-spacing: -1px;

  }


  .meet-biography .meet-intro {

    font-size: 16px;

    line-height: 1.8;

  }


  .meet-biography p {

    font-size: 14px;

  }


  .meet-button {

    width: 100%;

  }


  .meet-number {

    left: -2px;

    top: 25px;

    font-size: 45px;

  }


  .meet-caption {

    font-size: 12px;

  }


  .meet-circle-one {

    width: 250px;

    height: 250px;

    left: -180px;

  }

}


/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

  .meet-image,
  .meet-button,
  .meet-image-column,
  .meet-content {

    transition: none !important;

  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-d921a93 *//* ==========================================
   ROOT
========================================== */

:root {

  --journey-black: #0B0A08;

  --journey-ivory: #F7F2E8;

  --journey-gold: #C9A227;

  --journey-text: #D8CFC0;

}


/* ==========================================
   SECTION
========================================== */

.lela-her-journey {

  position: relative;

  overflow: hidden;

  padding: 130px 0;

  background: #0B0A08;

  color: #F7F2E8;

}


/* ==========================================
   CONTAINER
========================================== */

.journey-container {

  width: min(1180px, 90%);

  margin: auto;

  display: grid;

  grid-template-columns:
    0.9fr
    1.1fr;

  align-items: center;

  gap: 100px;

  position: relative;

  z-index: 3;

}


/* ==========================================
   IMAGE COLUMN
========================================== */

.journey-image-column {

  position: relative;

  width: 100%;

  max-width: 460px;

  padding: 15px;

  opacity: 0;

  transform: translateY(40px);

  transition:
    opacity 0.9s ease,
    transform 0.9s ease;

}


.journey-image-column.reveal {

  opacity: 1;

  transform: translateY(0);

}


/* ==========================================
   IMAGE FRAME
========================================== */

.journey-image-frame {

  position: absolute;

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

  border:
    1px solid
    rgba(
      201,
      162,
      39,
      0.5
    );

  transform:
    translate(
      14px,
      14px
    );

  pointer-events: none;

  z-index: 1;

}


/* ==========================================
   IMAGE
========================================== */

.journey-image-wrap {

  position: relative;

  z-index: 2;

  width: 100%;

  aspect-ratio: 4 / 5;

  overflow: hidden;

  background: #17140F;

}


.journey-image {

  width: 100%;

  height: 100%;

  display: block;

  object-fit: cover;

  filter:
    saturate(0.85)
    contrast(1.05);

  transition:
    transform 0.8s ease,
    filter 0.8s ease;

}


.journey-image-column:hover
.journey-image {

  transform: scale(1.04);

  filter:
    saturate(1)
    contrast(1.05);

}


/* ==========================================
   GOLD VERTICAL LINE
========================================== */

.journey-vertical-line {

  position: absolute;

  z-index: 5;

  width: 1px;

  height: 125px;

  right: -22px;

  top: 50%;

  transform: translateY(-50%);

  background:
    linear-gradient(
      to bottom,
      transparent,
      #C9A227 30%,
      #C9A227 70%,
      transparent
    );

}


/* ==========================================
   NUMBER
========================================== */

.journey-number {

  position: absolute;

  left: -10px;

  top: 32px;

  z-index: 6;

  color: #C9A227;

  font-family:
    "Playfair Display",
    serif;

  font-size: 58px;

  font-weight: 500;

  font-style: italic;

  line-height: 1;

}


/* ==========================================
   CAPTION
========================================== */

.journey-caption {

  position: absolute;

  right: -5px;

  bottom: 48px;

  z-index: 6;

  display: flex;

  align-items: center;

  gap: 10px;

  color: #F7F2E8;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 8px;

  font-weight: 600;

  letter-spacing: 2.5px;

  writing-mode: vertical-rl;

  transform: rotate(180deg);

}


.journey-caption span {

  width: 25px;

  height: 1px;

  background: #C9A227;

}


/* ==========================================
   CONTENT
========================================== */

.journey-content {

  position: relative;

  max-width: 620px;

  opacity: 0;

  transform: translateY(40px);

  transition:
    opacity 0.9s ease 0.15s,
    transform 0.9s ease 0.15s;

}


.journey-content.reveal {

  opacity: 1;

  transform: translateY(0);

}


/* ==========================================
   EYEBROW
========================================== */

.journey-eyebrow {

  display: flex;

  align-items: center;

  gap: 14px;

  margin-bottom: 25px;

  color: #C9A227;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 12px;

  font-weight: 600;

  letter-spacing: 3px;

  text-transform: uppercase;

}


.journey-eyebrow span {

  width: 42px;

  height: 1px;

  background: #C9A227;

}


/* ==========================================
   HEADING
========================================== */

.journey-heading {

  margin: 0 0 30px;

  color: #F7F2E8;

  font-family:
    "Playfair Display",
    serif;

  font-size:
    clamp(48px, 5vw, 70px);

  font-weight: 600;

  line-height: 1.08;

  letter-spacing: -1.5px;

}


.journey-heading span {

  display: block;

  color: #C9A227;

  font-style: italic;

  font-weight: 500;

}


/* ==========================================
   DIVIDER
========================================== */

.journey-divider {

  width: 75px;

  height: 1px;

  margin: 0 0 30px;

  background: #C9A227;

}


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

.journey-intro {

  max-width: 580px;

  margin: 0 0 32px;

  color: #D8CFC0;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 18px;

  line-height: 1.85;

}


/* ==========================================
   OVERVIEW
========================================== */

.journey-overview {

  display: grid;

  grid-template-columns:
    1fr
    1fr;

  gap: 24px 35px;

}


/* ==========================================
   JOURNEY ITEM
========================================== */

.journey-item {

  display: grid;

  grid-template-columns:
    35px
    1fr;

  gap: 13px;

  padding-top: 18px;

  border-top:
    1px solid
    rgba(
      216,
      195,
      154,
      0.25
    );

}


.journey-item-number {

  color: #C9A227;

  font-family:
    "Playfair Display",
    serif;

  font-size: 14px;

  font-style: italic;

}


/* ==========================================
   ITEM HEADING
========================================== */

.journey-item h3 {

  margin: 0 0 7px;

  color: #F7F2E8;

  font-family:
    "Playfair Display",
    serif;

  font-size: 20px;

  font-weight: 500;

  line-height: 1.3;

}


/* ==========================================
   ITEM TEXT
========================================== */

.journey-item p {

  margin: 0;

  color: #D8CFC0;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 13px;

  line-height: 1.75;

}


/* ==========================================
   BACKGROUND GLOW
========================================== */

.journey-glow {

  position: absolute;

  width: 600px;

  height: 600px;

  left: -300px;

  top: 50%;

  transform: translateY(-50%);

  border-radius: 50%;

  background:
    radial-gradient(
      circle,
      rgba(
        201,
        162,
        39,
        0.08
      ),
      transparent 70%
    );

  pointer-events: none;

}


/* ==========================================
   ORBITS
========================================== */

.journey-orbit {

  position: absolute;

  border:
    1px solid
    rgba(
      201,
      162,
      39,
      0.08
    );

  border-radius: 50%;

  pointer-events: none;

}


.journey-orbit-one {

  width: 600px;

  height: 600px;

  left: -390px;

  top: 50%;

  transform: translateY(-50%);

}


.journey-orbit-two {

  width: 850px;

  height: 850px;

  left: -515px;

  top: 50%;

  transform: translateY(-50%);

  opacity: 0.4;

}


/* ==========================================
   ELEMENTOR EDITOR FIX
========================================== */

body.elementor-editor-active
.journey-image-column,
body.elementor-editor-active
.journey-content {

  opacity: 1 !important;

  transform: none !important;

}


body.elementor-editor-active
.journey-image {

  opacity: 1 !important;

  visibility: visible !important;

}


/* ==========================================
   TABLET
========================================== */

@media (max-width: 950px) {

  .lela-her-journey {

    padding: 100px 0;

  }


  .journey-container {

    width: min(700px, 88%);

    grid-template-columns: 1fr;

    gap: 70px;

  }


  .journey-image-column {

    max-width: 480px;

    margin: auto;

  }


  .journey-content {

    max-width: 100%;

  }

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 600px) {

  .lela-her-journey {

    padding: 80px 0;

  }


  .journey-container {

    width: 88%;

    gap: 55px;

  }


  .journey-image-column {

    padding: 10px;

  }


  .journey-heading {

    font-size: 46px;

    letter-spacing: -1px;

  }


  .journey-intro {

    font-size: 16px;

    line-height: 1.8;

  }


  .journey-overview {

    grid-template-columns: 1fr;

    gap: 20px;

  }


  .journey-item p {

    font-size: 14px;

  }


  .journey-number {

    left: -2px;

    top: 25px;

    font-size: 45px;

  }


  .journey-caption {

    right: 0;

    bottom: 35px;

  }


  .journey-vertical-line {

    right: -7px;

    height: 90px;

  }


  .journey-orbit-one {

    width: 400px;

    height: 400px;

    left: -300px;

  }


  .journey-orbit-two {

    width: 600px;

    height: 600px;

    left: -400px;

  }

}


/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

  .journey-image,
  .journey-image-column,
  .journey-content {

    transition: none !important;

  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-dfb2a32 *//* ==========================================
   ROOT
========================================== */

:root {

  --identity-bg: #EFE6D5;

  --identity-black: #211F1B;

  --identity-gold: #C9A227;

  --identity-text: #4A443B;

  --identity-champagne: #D8C39A;

}


/* ==========================================
   SECTION
========================================== */

.lela-identities {

  position: relative;

  overflow: hidden;

  padding: 130px 0;

  background: #EFE6D5;

  color: #211F1B;

}


/* ==========================================
   CONTAINER
========================================== */

.identities-container {

  width: min(1180px, 90%);

  margin: auto;

  position: relative;

  z-index: 2;

}


/* ==========================================
   HEADER
========================================== */

.identities-header {

  max-width: 760px;

  margin: 0 auto 65px;

  text-align: center;

}


/* ==========================================
   EYEBROW
========================================== */

.identities-eyebrow {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 14px;

  margin-bottom: 25px;

  color: #C9A227;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 12px;

  font-weight: 600;

  letter-spacing: 3px;

  text-transform: uppercase;

}


.identities-eyebrow span {

  width: 42px;

  height: 1px;

  background: #C9A227;

}


/* ==========================================
   HEADING
========================================== */

.identities-heading {

  margin: 0 0 25px;

  color: #211F1B;

  font-family:
    "Playfair Display",
    serif;

  font-size:
    clamp(48px, 5vw, 70px);

  font-weight: 600;

  line-height: 1.08;

  letter-spacing: -1.5px;

}


.identities-heading span {

  display: block;

  color: #C9A227;

  font-style: italic;

  font-weight: 500;

}


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

.identities-intro {

  max-width: 620px;

  margin: auto;

  color: #4A443B;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 18px;

  line-height: 1.85;

}


/* ==========================================
   GRID
========================================== */

.identities-grid {

  display: grid;

  grid-template-columns:
    repeat(5, 1fr);

  gap: 14px;

  align-items: stretch;

}


/* ==========================================
   CARD
========================================== */

.identity-card {

  position: relative;

  min-height: 310px;

  padding: 38px 25px 30px;

  display: flex;

  flex-direction: column;

  justify-content: flex-start;

  background:
    rgba(
      247,
      242,
      232,
      0.52
    );

  border:
    1px solid
    rgba(
      201,
      162,
      39,
      0.25
    );

  transition:
    transform 0.35s ease,
    background 0.35s ease,
    border-color 0.35s ease,
    box-shadow 0.35s ease;

}


.identity-card:hover {

  transform:
    translateY(-6px);

  background:
    #F7F2E8;

  border-color:
    rgba(
      201,
      162,
      39,
      0.65
    );

  box-shadow:
    0 20px 45px
    rgba(
      11,
      10,
      8,
      0.08
    );

}


/* ==========================================
   FEATURED CARD
========================================== */

.identity-card-featured {

  background:
    rgba(
      201,
      162,
      39,
      0.09
    );

  border-color:
    rgba(
      201,
      162,
      39,
      0.5
    );

}


/* ==========================================
   NUMBER
========================================== */

.identity-number {

  position: absolute;

  top: 16px;

  right: 18px;

  color:
    rgba(
      201,
      162,
      39,
      0.55
    );

  font-family:
    "Playfair Display",
    serif;

  font-size: 14px;

  font-style: italic;

}


/* ==========================================
   ICON
========================================== */

.identity-icon {

  width: 42px;

  height: 42px;

  display: flex;

  align-items: center;

  justify-content: center;

  margin-bottom: 25px;

  color: #C9A227;

  border:
    1px solid
    rgba(
      201,
      162,
      39,
      0.5
    );

  border-radius: 50%;

  font-family:
    "Playfair Display",
    serif;

  font-size: 18px;

}


/* ==========================================
   GOLD LINE
========================================== */

.identity-line {

  width: 42px;

  height: 1px;

  margin-bottom: 22px;

  background: #C9A227;

  transition:
    width 0.35s ease;

}


.identity-card:hover
.identity-line {

  width: 65px;

}


/* ==========================================
   TITLE
========================================== */

.identity-card h3 {

  margin: 0 0 14px;

  color: #211F1B;

  font-family:
    "Playfair Display",
    serif;

  font-size: 20px;

  font-weight: 600;

  line-height: 1.25;

}


/* ==========================================
   TEXT
========================================== */

.identity-card p {

  margin: 0;

  color: #4A443B;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 14px;

  line-height: 1.8;

}


/* ==========================================
   ELEMENTOR EDITOR FIX
========================================== */

body.elementor-editor-active
.identity-card {

  opacity: 1 !important;

  transform: none !important;

}


/* ==========================================
   TABLET
========================================== */

@media (max-width: 1050px) {

  .lela-identities {

    padding: 105px 0;

  }


  .identities-grid {

    grid-template-columns:
      repeat(3, 1fr);

    gap: 18px;

  }


  .identity-card {

    min-height: 280px;

  }


  .identity-card-featured {

    grid-column:
      span 3;

    min-height: auto;

  }

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 600px) {

  .lela-identities {

    padding: 80px 0;

  }


  .identities-container {

    width: 88%;

  }


  .identities-header {

    margin-bottom: 45px;

  }


  .identities-heading {

    font-size: 46px;

    letter-spacing: -1px;

  }


  .identities-intro {

    font-size: 16px;

    line-height: 1.8;

  }


  .identities-grid {

    grid-template-columns: 1fr;

    gap: 15px;

  }


  .identity-card {

    min-height: auto;

    padding: 32px 25px;

  }


  .identity-card-featured {

    grid-column: auto;

  }


  .identity-card p {

    font-size: 14px;

  }

}


/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

  .identity-card,
  .identity-line {

    transition: none !important;

  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-d8f6ce2 *//* ==========================================
   ROOT
========================================== */

:root {

  --philosophy-bg: #F7F2E8;

  --philosophy-black: #0B0A08;

  --philosophy-gold: #C9A227;

  --philosophy-text: #4A443B;

  --philosophy-champagne: #D8C39A;

}


/* ==========================================
   SECTION
========================================== */

.lela-philosophy {

  position: relative;

  overflow: hidden;

  padding: 130px 0;

  background: white;

  color: #0B0A08;

}


/* ==========================================
   CONTAINER
========================================== */

.philosophy-container {

  width: min(1180px, 90%);

  margin: auto;

  position: relative;

  z-index: 3;

  text-align: center;

}


/* ==========================================
   EYEBROW
========================================== */

.philosophy-eyebrow {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 14px;

  margin-bottom: 25px;

  color: #C9A227;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 12px;

  font-weight: 600;

  letter-spacing: 3px;

  text-transform: uppercase;

}


.philosophy-eyebrow span {

  width: 42px;

  height: 1px;

  background: #C9A227;

}


/* ==========================================
   HEADING
========================================== */

.philosophy-heading {

  max-width: 900px;

  margin: 0 auto 30px;

  color: #0B0A08;

  font-family:
    "Playfair Display",
    serif;

  font-size:
    clamp(48px, 5vw, 70px);

  font-weight: 600;

  line-height: 1.08;

  letter-spacing: -1.5px;

}


.philosophy-heading span {

  display: block;

  color: #C9A227;

  font-style: italic;

  font-weight: 500;

}


/* ==========================================
   DIVIDER
========================================== */

.philosophy-divider {

  width: 75px;

  height: 1px;

  margin: 0 auto 30px;

  background: #C9A227;

}


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

.philosophy-intro {

  max-width: 700px;

  margin: 0 auto 65px;

  color: #4A443B;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 18px;

  line-height: 1.85;

}


/* ==========================================
   GRID
========================================== */

.philosophy-grid {

  display: grid;

  grid-template-columns:
    repeat(4, 1fr);

  gap: 18px;

  text-align: left;

}


/* ==========================================
   ITEM
========================================== */

.philosophy-item {

  position: relative;

  min-height: 245px;

  padding: 30px 25px;

  background:
    rgba(
      239,
      230,
      213,
      0.65
    );

  border:
    1px solid
    rgba(
      201,
      162,
      39,
      0.22
    );

  transition:
    transform 0.35s ease,
    background 0.35s ease,
    border-color 0.35s ease,
    box-shadow 0.35s ease;

}


.philosophy-item:hover {

  transform:
    translateY(-5px);

  background: #EFE6D5;

  border-color:
    rgba(
      201,
      162,
      39,
      0.6
    );

  box-shadow:
    0 18px 45px
    rgba(
      11,
      10,
      8,
      0.07
    );

}


/* ==========================================
   WIDE ITEM
========================================== */

.philosophy-item-wide {

  grid-column:
    span 4;

  min-height:
    auto;

  display:
    grid;

  grid-template-columns:
    45px
    90px
    1fr
    1.5fr;

  align-items:
    center;

  gap:
    20px;

}


/* ==========================================
   NUMBER
========================================== */

.philosophy-number {

  color:
    rgba(
      201,
      162,
      39,
      0.75
    );

  font-family:
    "Playfair Display",
    serif;

  font-size:
    15px;

  font-style:
    italic;

}


/* ==========================================
   GOLD LINE
========================================== */

.philosophy-item-line {

  width: 42px;

  height: 1px;

  background: #C9A227;

  margin-bottom: 22px;

  transition:
    width 0.35s ease;

}


.philosophy-item:hover
.philosophy-item-line {

  width: 65px;

}


/* Wide item line */

.philosophy-item-wide
.philosophy-item-line {

  margin:
    0;

}


/* ==========================================
   ITEM HEADING
========================================== */

.philosophy-item h3 {

  margin: 0 0 12px;

  color: #0B0A08;

  font-family:
    "Playfair Display",
    serif;

  font-size: 21px;

  font-weight: 600;

  line-height: 1.25;

}


/* ==========================================
   ITEM TEXT
========================================== */

.philosophy-item p {

  margin: 0;

  color: #4A443B;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 14px;

  line-height: 1.8;

}


/* ==========================================
   CENTER STATEMENT
========================================== */

.philosophy-statement {

  position: relative;

  max-width: 820px;

  margin: 75px auto 0;

  padding: 50px 70px;

  text-align: center;

  border-top:
    1px solid
    rgba(
      201,
      162,
      39,
      0.35
    );

  border-bottom:
    1px solid
    rgba(
      201,
      162,
      39,
      0.35
    );

}


.philosophy-quote-mark {

  position: absolute;

  left: 15px;

  top: 20px;

  color:
    rgba(
      201,
      162,
      39,
      0.18
    );

  font-family:
    "Playfair Display",
    serif;

  font-size: 100px;

  line-height: 1;

}


.philosophy-statement p {

  margin: 0;

  color: #0B0A08;

  font-family:
    "Playfair Display",
    serif;

  font-size:
    clamp(28px, 3vw, 42px);

  font-weight: 500;

  font-style: italic;

  line-height: 1.35;

  letter-spacing: -0.5px;

}


.philosophy-statement-line {

  width: 45px;

  height: 1px;

  margin: 25px auto 0;

  background: #C9A227;

}


/* ==========================================
   BACKGROUND CIRCLES
========================================== */

.philosophy-circle {

  position: absolute;

  border:
    1px solid
    rgba(
      216,
      195,
      154,
      0.35
    );

  border-radius: 50%;

  pointer-events: none;

}


.philosophy-circle-one {

  width: 420px;

  height: 420px;

  left: -280px;

  top: 5%;

}


.philosophy-circle-two {

  width: 260px;

  height: 260px;

  right: -130px;

  bottom: 5%;

}


/* ==========================================
   ELEMENTOR EDITOR FIX
========================================== */

body.elementor-editor-active
.philosophy-item,
body.elementor-editor-active
.philosophy-statement {

  opacity: 1 !important;

  transform: none !important;

}


/* ==========================================
   TABLET
========================================== */

@media (max-width: 950px) {

  .lela-philosophy {

    padding: 100px 0;

  }


  .philosophy-grid {

    grid-template-columns:
      repeat(2, 1fr);

  }


  .philosophy-item-wide {

    grid-column:
      span 2;

    display: block;

  }


  .philosophy-item-wide
  .philosophy-item-line {

    margin-bottom: 22px;

  }

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 600px) {

  .lela-philosophy {

    padding: 80px 0;

  }


  .philosophy-container {

    width: 88%;

  }


  .philosophy-heading {

    font-size: 46px;

    letter-spacing: -1px;

  }


  .philosophy-intro {

    font-size: 16px;

    line-height: 1.8;

    margin-bottom: 45px;

  }


  .philosophy-grid {

    grid-template-columns:
      1fr;

    gap: 15px;

  }


  .philosophy-item {

    min-height:
      auto;

    padding:
      30px 25px;

  }


  .philosophy-item-wide {

    grid-column:
      auto;

  }


  .philosophy-item p {

    font-size: 14px;

  }


  .philosophy-statement {

    margin-top: 55px;

    padding:
      40px 25px;

  }


  .philosophy-statement p {

    font-size: 28px;

  }


  .philosophy-quote-mark {

    left: 5px;

    top: 12px;

    font-size: 70px;

  }


  .philosophy-circle-one {

    width: 250px;

    height: 250px;

    left: -180px;

  }

}


/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

  .philosophy-item,
  .philosophy-item-line {

    transition: none !important;

  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-1b73ba5 *//* ==========================================
   ROOT
========================================== */

:root {

  --message-black: #0B0A08;

  --message-ivory: #F7F2E8;

  --message-gold: #C9A227;

  --message-text: #D8CFC0;

}


/* ==========================================
   SECTION
========================================== */

.lela-message-power {

  position: relative;

  overflow: hidden;

  padding: 130px 0;

  background: #0B0A08;

  color: #F7F2E8;

}


/* ==========================================
   CONTAINER
========================================== */

.message-power-container {

  width: min(1180px, 90%);

  margin: auto;

  display: grid;

  grid-template-columns:
    1.1fr
    0.9fr;

  align-items: center;

  gap: 100px;

  position: relative;

  z-index: 3;

}


/* ==========================================
   CONTENT
========================================== */

.message-power-content {

  max-width: 650px;

  opacity: 0;

  transform: translateY(40px);

  transition:
    opacity 0.9s ease,
    transform 0.9s ease;

}


.message-power-content.reveal {

  opacity: 1;

  transform: translateY(0);

}


/* ==========================================
   EYEBROW
========================================== */

.message-power-eyebrow {

  display: flex;

  align-items: center;

  gap: 14px;

  margin-bottom: 25px;

  color: #C9A227;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 12px;

  font-weight: 600;

  letter-spacing: 3px;

  text-transform: uppercase;

}


.message-power-eyebrow span {

  width: 42px;

  height: 1px;

  background: #C9A227;

}


/* ==========================================
   HEADING
========================================== */

.message-power-heading {

  margin: 0 0 30px;

  color: #F7F2E8;

  font-family:
    "Playfair Display",
    serif;

  font-size:
    clamp(48px, 5vw, 70px);

  font-weight: 600;

  line-height: 1.05;

  letter-spacing: -1.5px;

}


.message-power-heading span {

  display: block;

  color: #C9A227;

  font-style: italic;

  font-weight: 500;

}


/* ==========================================
   DIVIDER
========================================== */

.message-power-divider {

  width: 75px;

  height: 1px;

  margin-bottom: 30px;

  background: #C9A227;

}


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

.message-power-intro {

  max-width: 600px;

  margin: 0 0 40px;

  color: #D8CFC0;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 18px;

  line-height: 1.85;

}


/* ==========================================
   POINTS
========================================== */

.message-power-points {

  display: flex;

  flex-direction: column;

  gap: 0;

}


/* ==========================================
   POINT
========================================== */

.message-power-point {

  display: grid;

  grid-template-columns:
    45px
    1fr;

  gap: 18px;

  padding: 22px 0;

  border-top:
    1px solid
    rgba(
      201,
      162,
      39,
      0.22
    );

}


.message-power-point:last-child {

  border-bottom:
    1px solid
    rgba(
      201,
      162,
      39,
      0.22
    );

}


/* ==========================================
   POINT NUMBER
========================================== */

.message-point-number {

  color: #C9A227;

  font-family:
    "Playfair Display",
    serif;

  font-size: 15px;

  font-style: italic;

}


/* ==========================================
   POINT HEADING
========================================== */

.message-power-point h3 {

  margin: 0 0 8px;

  color: #F7F2E8;

  font-family:
    "Playfair Display",
    serif;

  font-size: 22px;

  font-weight: 500;

  line-height: 1.3;

}


/* ==========================================
   POINT TEXT
========================================== */

.message-power-point p {

  max-width: 520px;

  margin: 0;

  color: #D8CFC0;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 14px;

  line-height: 1.8;

}


/* ==========================================
   IMAGE COLUMN
========================================== */

.message-power-image-column {

  position: relative;

  width: 100%;

  max-width: 460px;

  margin-left: auto;

  padding: 15px;

  opacity: 0;

  transform: translateY(40px);

  transition:
    opacity 0.9s ease 0.15s,
    transform 0.9s ease 0.15s;

}


.message-power-image-column.reveal {

  opacity: 1;

  transform: translateY(0);

}


/* ==========================================
   IMAGE FRAME
========================================== */

.message-power-image-frame {

  position: absolute;

  inset: 0;

  border:
    1px solid
    rgba(
      201,
      162,
      39,
      0.55
    );

  transform:
    translate(
      14px,
      14px
    );

  pointer-events: none;

  z-index: 1;

}


/* ==========================================
   IMAGE
========================================== */

.message-power-image-wrap {

  position: relative;

  z-index: 2;

  width: 100%;

  aspect-ratio: 4 / 5;

  overflow: hidden;

  background: #17140F;

  box-shadow:
    0 30px 75px
    rgba(
      0,
      0,
      0,
      0.35
    );

}


.message-power-image {

  width: 100%;

  height: 100%;

  display: block;

  object-fit: cover;

  filter:
    saturate(0.85)
    contrast(1.05);

  transition:
    transform 0.8s ease,
    filter 0.8s ease;

}


.message-power-image-column:hover
.message-power-image {

  transform: scale(1.04);

  filter:
    saturate(1)
    contrast(1.05);

}


/* ==========================================
   IMAGE OVERLAY
========================================== */

.message-power-image-wrap::after {

  content: "";

  position: absolute;

  inset: 0;

  background:
    linear-gradient(
      180deg,
      transparent 45%,
      rgba(
        11,
        10,
        8,
        0.45
      )
    );

  pointer-events: none;

}


/* ==========================================
   VERTICAL GOLD LINE
========================================== */

.message-power-vertical-line {

  position: absolute;

  width: 1px;

  height: 140px;

  right: -22px;

  top: 50%;

  transform:
    translateY(-50%);

  background:
    linear-gradient(
      to bottom,
      transparent,
      #C9A227 25%,
      #C9A227 75%,
      transparent
    );

  z-index: 5;

}


/* ==========================================
   CAPTION
========================================== */

.message-power-caption {

  position: absolute;

  right: -8px;

  bottom: 45px;

  z-index: 5;

  display: flex;

  align-items: center;

  gap: 10px;

  color: #D8CFC0;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 8px;

  font-weight: 600;

  letter-spacing: 2.5px;

  writing-mode: vertical-rl;

  transform:
    rotate(180deg);

}


.message-power-caption span {

  width: 25px;

  height: 1px;

  background: #C9A227;

}


/* ==========================================
   NUMBER
========================================== */

.message-power-number {

  position: absolute;

  left: -10px;

  top: 32px;

  z-index: 6;

  color: #C9A227;

  font-family:
    "Playfair Display",
    serif;

  font-size: 58px;

  font-weight: 500;

  font-style: italic;

  line-height: 1;

}


/* ==========================================
   BOTTOM STATEMENT
========================================== */

.message-power-statement {

  width: min(900px, 90%);

  margin: 80px auto 0;

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 22px;

  position: relative;

  z-index: 3;

  text-align: center;

}


.message-power-statement span {

  width: 55px;

  height: 1px;

  background:
    rgba(
      201,
      162,
      39,
      0.45
    );

}


.message-power-statement p {

  margin: 0;

  color:
    rgba(
      216,
      207,
      192,
      0.75
    );

  font-family:
    "Playfair Display",
    serif;

  font-size: 17px;

  font-style: italic;

  line-height: 1.6;

}


/* ==========================================
   BACKGROUND GLOW
========================================== */

.message-power-glow {

  position: absolute;

  width: 600px;

  height: 600px;

  right: -280px;

  top: 50%;

  transform:
    translateY(-50%);

  border-radius: 50%;

  background:
    radial-gradient(
      circle,
      rgba(
        201,
        162,
        39,
        0.09
      ),
      transparent 70%
    );

  pointer-events: none;

}


/* ==========================================
   CIRCLES
========================================== */

.message-power-circle {

  position: absolute;

  border:
    1px solid
    rgba(
      201,
      162,
      39,
      0.09
    );

  border-radius: 50%;

  pointer-events: none;

}


.message-circle-one {

  width: 430px;

  height: 430px;

  right: -280px;

  top: -120px;

}


.message-circle-two {

  width: 260px;

  height: 260px;

  left: -160px;

  bottom: -100px;

}


/* ==========================================
   ELEMENTOR EDITOR FIX
========================================== */

body.elementor-editor-active
.message-power-content,
body.elementor-editor-active
.message-power-image-column {

  opacity: 1 !important;

  transform: none !important;

}


body.elementor-editor-active
.message-power-image {

  opacity: 1 !important;

  visibility: visible !important;

}


/* ==========================================
   TABLET
========================================== */

@media (max-width: 950px) {

  .lela-message-power {

    padding: 100px 0;

  }


  .message-power-container {

    width: min(700px, 88%);

    grid-template-columns: 1fr;

    gap: 70px;

  }


  .message-power-content {

    max-width: 100%;

  }


  .message-power-image-column {

    max-width: 480px;

    margin: auto;

  }

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 600px) {

  .lela-message-power {

    padding: 80px 0;

  }


  .message-power-container {

    width: 88%;

    gap: 55px;

  }


  .message-power-heading {

    font-size: 46px;

    letter-spacing: -1px;

  }


  .message-power-intro {

    font-size: 16px;

    line-height: 1.8;

  }


  .message-power-point {

    grid-template-columns:
      32px
      1fr;

    gap: 12px;

  }


  .message-power-point h3 {

    font-size: 20px;

  }


  .message-power-point p {

    font-size: 14px;

  }


  .message-power-image-column {

    padding: 10px;

  }


  .message-power-number {

    left: -2px;

    top: 25px;

    font-size: 45px;

  }


  .message-power-caption {

    right: 0;

    bottom: 35px;

  }


  .message-power-vertical-line {

    right: -7px;

    height: 90px;

  }


  .message-power-statement {

    margin-top: 55px;

    gap: 10px;

  }


  .message-power-statement p {

    font-size: 15px;

  }


  .message-power-statement span {

    width: 25px;

  }

}


/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

  .message-power-image,
  .message-power-content,
  .message-power-image-column {

    transition: none !important;

  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-30061f7 *//* ==========================================
   ROOT
========================================== */

:root {

  --smile-bg: #EFE6D5;

  --smile-black: #0B0A08;

  --smile-gold: #C9A227;

  --smile-text: #4A443B;

  --smile-champagne: #D8C39A;

}


/* ==========================================
   SECTION
========================================== */

.lela-universal-smile {

  position: relative;

  overflow: hidden;

  padding: 130px 0;

  background: #EFE6D5;

  color: #0B0A08;

}


/* ==========================================
   CONTAINER
========================================== */

.smile-container {

  width: min(1180px, 90%);

  margin: auto;

  display: grid;

  grid-template-columns:
    0.9fr
    1.1fr;

  align-items: center;

  gap: 100px;

  position: relative;

  z-index: 3;

}


/* ==========================================
   VISUAL
========================================== */

.smile-visual {

  position: relative;

  width: 100%;

  max-width: 460px;

  min-height: 500px;

  display: flex;

  align-items: center;

  justify-content: center;

  opacity: 0;

  transform: translateY(40px);

  transition:
    opacity 0.9s ease,
    transform 0.9s ease;

}


.smile-visual.reveal {

  opacity: 1;

  transform: translateY(0);

}


/* ==========================================
   VISUAL FRAME
========================================== */

.smile-visual-frame {

  position: absolute;

  inset: 15px;

  border:
    1px solid
    rgba(
      201,
      162,
      39,
      0.5
    );

  transform:
    translate(
      14px,
      14px
    );

  pointer-events: none;

}


/* ==========================================
   BRAND MARK
========================================== */

.smile-mark {

  position: relative;

  z-index: 2;

  width: 85%;

  min-height: 430px;

  padding: 45px 35px;

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  text-align: center;

  background:
    rgba(
      247,
      242,
      232,
      0.48
    );

  border:
    1px solid
    rgba(
      201,
      162,
      39,
      0.25
    );

  box-shadow:
    0 25px 60px
    rgba(
      11,
      10,
      8,
      0.06
    );

}


/* ==========================================
   SMALL BRAND LABEL
========================================== */

.smile-mark-small {

  margin-bottom: 30px;

  color: #C9A227;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 9px;

  font-weight: 600;

  letter-spacing: 2.5px;

}


/* ==========================================
   SYMBOL
========================================== */

.smile-mark-symbol {

  width: 48px;

  height: 48px;

  margin-bottom: 22px;

  display: flex;

  align-items: center;

  justify-content: center;

  border:
    1px solid
    rgba(
      201,
      162,
      39,
      0.55
    );

  border-radius: 50%;

  color: #C9A227;

  font-family:
    "Playfair Display",
    serif;

  font-size: 18px;

}


/* ==========================================
   BRAND TITLE
========================================== */

.smile-mark-title {

  display: block;

  color: #0B0A08;

  font-family:
    "Playfair Display",
    serif;

  font-size: 37px;

  font-weight: 500;

  line-height: 1.05;

}


.smile-mark-italic {

  color: #C9A227;

  font-style: italic;

}


/* ==========================================
   NUMBER
========================================== */

.smile-number {

  position: absolute;

  left: -5px;

  top: 30px;

  z-index: 5;

  color: #C9A227;

  font-family:
    "Playfair Display",
    serif;

  font-size: 58px;

  font-weight: 500;

  font-style: italic;

  line-height: 1;

}


/* ==========================================
   CONTENT
========================================== */

.smile-content {

  max-width: 620px;

  opacity: 0;

  transform: translateY(40px);

  transition:
    opacity 0.9s ease 0.15s,
    transform 0.9s ease 0.15s;

}


.smile-content.reveal {

  opacity: 1;

  transform: translateY(0);

}


/* ==========================================
   EYEBROW
========================================== */

.smile-eyebrow {

  display: flex;

  align-items: center;

  gap: 14px;

  margin-bottom: 25px;

  color: #C9A227;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 12px;

  font-weight: 600;

  letter-spacing: 3px;

  text-transform: uppercase;

}


.smile-eyebrow span {

  width: 42px;

  height: 1px;

  background: #C9A227;

}


/* ==========================================
   HEADING
========================================== */

.smile-heading {

  margin: 0 0 30px;

  color: #0B0A08;

  font-family:
    "Playfair Display",
    serif;

  font-size:
    clamp(48px, 5vw, 70px);

  font-weight: 600;

  line-height: 1.08;

  letter-spacing: -1.5px;

}


.smile-heading span {

  display: block;

  color: #C9A227;

  font-style: italic;

  font-weight: 500;

}


/* ==========================================
   DIVIDER
========================================== */

.smile-divider {

  width: 75px;

  height: 1px;

  margin-bottom: 30px;

  background: #C9A227;

}


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

.smile-intro {

  max-width: 600px;

  margin: 0 0 22px;

  color: #4A443B;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 18px;

  line-height: 1.85;

}


/* ==========================================
   BODY TEXT
========================================== */

.smile-text {

  max-width: 580px;

  margin: 0 0 30px;

  color: #4A443B;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 15px;

  line-height: 1.85;

}


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

.smile-button {

  display: inline-flex;

  align-items: center;

  justify-content: center;

  gap: 20px;

  min-height: 55px;

  padding: 0 24px;

  border:
    1px solid
    #C9A227;

  color: #0B0A08;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 12px;

  font-weight: 600;

  letter-spacing: 1.5px;

  text-transform: uppercase;

  text-decoration: none !important;

  transition:
    background 0.3s ease,
    color 0.3s ease,
    transform 0.3s ease,
    gap 0.3s ease;

}


.smile-button strong {

  color: #C9A227;

  font-size: 19px;

  font-weight: 400;

  transition:
    transform 0.3s ease,
    color 0.3s ease;

}


.smile-button:hover {

  background: #C9A227;

  color: #0B0A08;

  transform: translateY(-3px);

  gap: 25px;

}


.smile-button:hover strong {

  color: #0B0A08;

  transform: translateX(4px);

}


/* ==========================================
   BACKGROUND CIRCLES
========================================== */

.smile-circle {

  position: absolute;

  border:
    1px solid
    rgba(
      216,
      195,
      154,
      0.4
    );

  border-radius: 50%;

  pointer-events: none;

}


.smile-circle-one {

  width: 450px;

  height: 450px;

  left: -300px;

  top: 5%;

}


.smile-circle-two {

  width: 260px;

  height: 260px;

  right: -130px;

  bottom: 5%;

}


/* ==========================================
   ELEMENTOR EDITOR FIX
========================================== */

body.elementor-editor-active
.smile-visual,
body.elementor-editor-active
.smile-content {

  opacity: 1 !important;

  transform: none !important;

}


/* ==========================================
   TABLET
========================================== */

@media (max-width: 950px) {

  .lela-universal-smile {

    padding: 100px 0;

  }


  .smile-container {

    width: min(700px, 88%);

    grid-template-columns: 1fr;

    gap: 70px;

  }


  .smile-visual {

    max-width: 480px;

    margin: auto;

  }


  .smile-content {

    max-width: 100%;

  }

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 600px) {

  .lela-universal-smile {

    padding: 80px 0;

  }


  .smile-container {

    width: 88%;

    gap: 55px;

  }


  .smile-visual {

    min-height: 390px;

    padding: 10px;

  }


  .smile-mark {

    min-height: 350px;

    padding: 35px 20px;

  }


  .smile-mark-title {

    font-size: 29px;

  }


  .smile-heading {

    font-size: 46px;

    letter-spacing: -1px;

  }


  .smile-intro {

    font-size: 16px;

    line-height: 1.8;

  }


  .smile-text {

    font-size: 14px;

  }


  .smile-button {

    width: 100%;

  }


  .smile-number {

    left: -2px;

    top: 25px;

    font-size: 45px;

  }


  .smile-circle-one {

    width: 250px;

    height: 250px;

    left: -180px;

  }

}


/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

  .smile-visual,
  .smile-content,
  .smile-button {

    transition: none !important;

  }

}

</style>/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-0ec11b5 *//* ==========================================
   ROOT
========================================== */

:root {

  --mission-black: #0B0A08;

  --mission-ivory: #F7F2E8;

  --mission-gold: #C9A227;

  --mission-text: #D8CFC0;

}


/* ==========================================
   SECTION
========================================== */

.lela-mission {

  position: relative;

  overflow: hidden;

  min-height: 650px;

  padding: 145px 0;

  display: flex;

  align-items: center;

  justify-content: center;

  background: #0B0A08;

  color: #F7F2E8;

}


/* ==========================================
   CONTAINER
========================================== */

.mission-container {

  width: min(1000px, 90%);

  margin: auto;

  position: relative;

  z-index: 5;

  text-align: center;

  opacity: 0;

  transform: translateY(40px);

  transition:
    opacity 0.9s ease,
    transform 0.9s ease;

}


.mission-container.reveal {

  opacity: 1;

  transform: translateY(0);

}


/* ==========================================
   EYEBROW
========================================== */

.mission-eyebrow {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 16px;

  margin-bottom: 28px;

  color: #C9A227;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 12px;

  font-weight: 600;

  letter-spacing: 3.5px;

  text-transform: uppercase;

}


.mission-eyebrow span {

  width: 45px;

  height: 1px;

  background: #C9A227;

}


/* ==========================================
   HEADING
========================================== */

.mission-heading {

  margin: 0 auto;

  color: #F7F2E8;

  font-family:
    "Playfair Display",
    serif;

  font-size:
    clamp(48px, 6vw, 82px);

  font-weight: 500;

  line-height: 1.02;

  letter-spacing: -2.5px;

}


.mission-heading span {

  display: block;

}


.mission-heading span:nth-child(2) {

  color: #C9A227;

  font-style: italic;

}


.mission-heading span:nth-child(3) {

  color: #F7F2E8;

}


/* ==========================================
   DIVIDER
========================================== */

.mission-divider {

  width: 75px;

  height: 1px;

  margin: 38px auto 30px;

  background: #C9A227;

}


/* ==========================================
   SUPPORTING TEXT
========================================== */

.mission-text {

  max-width: 650px;

  margin: 0 auto;

  color: #D8CFC0;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 15px;

  line-height: 1.9;

}


/* ==========================================
   BOTTOM STATEMENT
========================================== */

.mission-bottom {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 18px;

  margin-top: 65px;

}


.mission-bottom span {

  color:
    rgba(
      216,
      207,
      192,
      0.55
    );

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 8px;

  font-weight: 600;

  letter-spacing: 2.5px;

}


.mission-line {

  width: 45px;

  height: 1px;

  background:
    rgba(
      201,
      162,
      39,
      0.35
    );

}


/* ==========================================
   CINEMATIC GLOW
========================================== */

.mission-glow {

  position: absolute;

  width: 650px;

  height: 650px;

  left: 50%;

  top: 50%;

  transform:
    translate(
      -50%,
      -50%
    );

  border-radius: 50%;

  background:
    radial-gradient(
      circle,
      rgba(
        201,
        162,
        39,
        0.08
      ) 0%,
      rgba(
        201,
        162,
        39,
        0.025
      ) 38%,
      transparent 72%
    );

  pointer-events: none;

}


/* ==========================================
   RINGS
========================================== */

.mission-ring {

  position: absolute;

  left: 50%;

  top: 50%;

  border:
    1px solid
    rgba(
      201,
      162,
      39,
      0.10
    );

  border-radius: 50%;

  transform:
    translate(
      -50%,
      -50%
    );

  pointer-events: none;

}


.mission-ring-one {

  width: 560px;

  height: 560px;

}


.mission-ring-two {

  width: 820px;

  height: 820px;

  opacity: 0.45;

}


/* ==========================================
   GOLD PARTICLE
========================================== */

.lela-mission::after {

  content: "";

  position: absolute;

  width: 5px;

  height: 5px;

  top: 27%;

  left: 17%;

  border-radius: 50%;

  background: #C9A227;

  box-shadow:

    370px 300px 0
    rgba(
      201,
      162,
      39,
      0.45
    ),

    720px -20px 0
    rgba(
      201,
      162,
      39,
      0.30
    );

  animation:
    missionFloat
    5s
    ease-in-out
    infinite;

}


@keyframes missionFloat {

  0%,
  100% {

    opacity: 0.35;

    transform:
      translateY(0);

  }

  50% {

    opacity: 1;

    transform:
      translateY(-12px);

  }

}


/* ==========================================
   ELEMENTOR EDITOR FIX
========================================== */

body.elementor-editor-active
.mission-container {

  opacity: 1 !important;

  transform: none !important;

}


/* ==========================================
   TABLET
========================================== */

@media (max-width: 800px) {

  .lela-mission {

    min-height: auto;

    padding: 110px 0;

  }


  .mission-heading {

    font-size:
      clamp(
        48px,
        9vw,
        70px
      );

  }

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 600px) {

  .lela-mission {

    padding: 85px 0;

  }


  .mission-container {

    width: 88%;

  }


  .mission-eyebrow {

    font-size: 9px;

    letter-spacing: 2.5px;

  }


  .mission-eyebrow span {

    width: 25px;

  }


  .mission-heading {

    font-size: 46px;

    letter-spacing: -1px;

    line-height: 1.02;

  }


  .mission-divider {

    margin-top: 32px;

  }


  .mission-text {

    font-size: 14px;

    line-height: 1.8;

  }


  .mission-bottom {

    margin-top: 50px;

    gap: 10px;

  }


  .mission-bottom span {

    font-size: 6.5px;

    letter-spacing: 1.5px;

  }


  .mission-line {

    width: 20px;

  }


  .mission-ring-one {

    width: 400px;

    height: 400px;

  }


  .mission-ring-two {

    width: 600px;

    height: 600px;

  }

}


/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

  .mission-container {

    transition: none !important;

  }


  .lela-mission::after {

    animation: none !important;

  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-0844145 *//* ==========================================
   ROOT
========================================== */

:root {

  --beliefs-bg: #F7F2E8;

  --beliefs-black: #0B0A08;

  --beliefs-gold: #C9A227;

  --beliefs-text: #4A443B;

  --beliefs-champagne: #D8C39A;

}


/* ==========================================
   SECTION
========================================== */

.lela-beliefs {

  position: relative;

  overflow: hidden;

  padding: 130px 0;

  background: #F7F2E8;

  color: #0B0A08;

}


/* ==========================================
   CONTAINER
========================================== */

.beliefs-container {

  width: min(1050px, 90%);

  margin: auto;

  position: relative;

  z-index: 3;

}


/* ==========================================
   HEADER
========================================== */

.beliefs-header {

  max-width: 760px;

  margin: 0 auto 65px;

  text-align: center;

}


/* ==========================================
   EYEBROW
========================================== */

.beliefs-eyebrow {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 14px;

  margin-bottom: 25px;

  color: #C9A227;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 12px;

  font-weight: 600;

  letter-spacing: 3px;

  text-transform: uppercase;

}


.beliefs-eyebrow span {

  width: 42px;

  height: 1px;

  background: #C9A227;

}


/* ==========================================
   HEADING
========================================== */

.beliefs-heading {

  margin: 0 0 25px;

  color: #0B0A08;

  font-family:
    "Playfair Display",
    serif;

  font-size:
    clamp(48px, 5vw, 70px);

  font-weight: 600;

  line-height: 1.08;

  letter-spacing: -1.5px;

}


.beliefs-heading span {

  display: block;

  color: #C9A227;

  font-style: italic;

  font-weight: 500;

}


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

.beliefs-intro {

  max-width: 650px;

  margin: auto;

  color: #4A443B;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 18px;

  line-height: 1.85;

}


/* ==========================================
   LIST
========================================== */

.beliefs-list {

  width: 100%;

  border-top:
    1px solid
    rgba(
      201,
      162,
      39,
      0.35
    );

}


/* ==========================================
   BELIEF ITEM
========================================== */

.belief-item {

  position: relative;

  min-height: 125px;

  display: grid;

  grid-template-columns:
    55px
    65px
    1fr
    40px;

  align-items: center;

  gap: 20px;

  padding: 0 10px;

  border-bottom:
    1px solid
    rgba(
      201,
      162,
      39,
      0.25
    );

  transition:
    background 0.35s ease,
    padding 0.35s ease;

}


.belief-item:hover {

  padding-left: 25px;

  background:
    rgba(
      239,
      230,
      213,
      0.55
    );

}


/* ==========================================
   NUMBER
========================================== */

.belief-number {

  color:
    rgba(
      201,
      162,
      39,
      0.75
    );

  font-family:
    "Playfair Display",
    serif;

  font-size: 15px;

  font-style: italic;

}


/* ==========================================
   GOLD LINE
========================================== */

.belief-line {

  width: 42px;

  height: 1px;

  background: #C9A227;

  transition:
    width 0.35s ease;

}


.belief-item:hover
.belief-line {

  width: 60px;

}


/* ==========================================
   BELIEF TITLE
========================================== */

.belief-item h3 {

  margin: 0;

  color: #0B0A08;

  font-family:
    "Playfair Display",
    serif;

  font-size:
    clamp(
      25px,
      3vw,
      38px
    );

  font-weight: 500;

  line-height: 1.25;

  letter-spacing: -0.5px;

}


/* ==========================================
   ARROW
========================================== */

.belief-arrow {

  color: #C9A227;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 22px;

  font-weight: 300;

  transition:
    transform 0.35s ease,
    color 0.35s ease;

}


.belief-item:hover
.belief-arrow {

  color: #0B0A08;

  transform:
    translateX(6px);

}


/* ==========================================
   BOTTOM
========================================== */

.beliefs-bottom {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 18px;

  margin-top: 60px;

}


.beliefs-bottom span {

  color:
    rgba(
      74,
      68,
      59,
      0.65
    );

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 8px;

  font-weight: 600;

  letter-spacing: 2.5px;

}


.beliefs-bottom-line {

  width: 45px;

  height: 1px;

  background:
    rgba(
      201,
      162,
      39,
      0.4
    );

}


/* ==========================================
   BACKGROUND CIRCLES
========================================== */

.beliefs-circle {

  position: absolute;

  border:
    1px solid
    rgba(
      216,
      195,
      154,
      0.35
    );

  border-radius: 50%;

  pointer-events: none;

}


.beliefs-circle-one {

  width: 420px;

  height: 420px;

  left: -280px;

  top: 5%;

}


.beliefs-circle-two {

  width: 260px;

  height: 260px;

  right: -130px;

  bottom: 5%;

}


/* ==========================================
   ELEMENTOR EDITOR FIX
========================================== */

body.elementor-editor-active
.belief-item {

  opacity: 1 !important;

  transform: none !important;

}


/* ==========================================
   TABLET
========================================== */

@media (max-width: 800px) {

  .lela-beliefs {

    padding: 105px 0;

  }


  .belief-item {

    min-height: 110px;

    grid-template-columns:
      45px
      50px
      1fr
      30px;

    gap: 12px;

  }


  .belief-item h3 {

    font-size: 28px;

  }

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 600px) {

  .lela-beliefs {

    padding: 80px 0;

  }


  .beliefs-container {

    width: 88%;

  }


  .beliefs-header {

    margin-bottom: 45px;

  }


  .beliefs-heading {

    font-size: 46px;

    letter-spacing: -1px;

  }


  .beliefs-intro {

    font-size: 16px;

    line-height: 1.8;

  }


  .belief-item {

    min-height: 105px;

    grid-template-columns:
      30px
      30px
      1fr
      20px;

    gap: 8px;

    padding: 0 4px;

  }


  .belief-item:hover {

    padding-left: 10px;

  }


  .belief-number {

    font-size: 12px;

  }


  .belief-line {

    width: 25px;

  }


  .belief-item:hover
  .belief-line {

    width: 35px;

  }


  .belief-item h3 {

    font-size: 22px;

    line-height: 1.25;

  }


  .belief-arrow {

    font-size: 17px;

  }


  .beliefs-bottom {

    margin-top: 50px;

    gap: 10px;

  }


  .beliefs-bottom span {

    font-size: 6.5px;

    letter-spacing: 1.5px;

  }


  .beliefs-bottom-line {

    width: 20px;

  }


  .beliefs-circle-one {

    width: 250px;

    height: 250px;

    left: -180px;

  }

}


/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

  .belief-item,
  .belief-line,
  .belief-arrow {

    transition: none !important;

  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-7fc433e *//* ==========================================
   ROOT
========================================== */

:root {

  --beyond-black: #0B0A08;

  --beyond-ivory: #F7F2E8;

  --beyond-gold: #C9A227;

  --beyond-text: #D8CFC0;

  --beyond-card: #17140F;

}


/* ==========================================
   SECTION
========================================== */

.lela-beyond-books {

  position: relative;

  overflow: hidden;

  padding: 130px 0;

  background: #0B0A08;

  color: #F7F2E8;

}


/* ==========================================
   CONTAINER
========================================== */

.beyond-container {

  width: min(1180px, 90%);

  margin: auto;

  position: relative;

  z-index: 5;

}


/* ==========================================
   HEADER
========================================== */

.beyond-header {

  max-width: 760px;

  margin: 0 auto 65px;

  text-align: center;

}


/* ==========================================
   EYEBROW
========================================== */

.beyond-eyebrow {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 14px;

  margin-bottom: 25px;

  color: #C9A227;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 12px;

  font-weight: 600;

  letter-spacing: 3px;

  text-transform: uppercase;

}


.beyond-eyebrow span {

  width: 42px;

  height: 1px;

  background: #C9A227;

}


/* ==========================================
   HEADING
========================================== */

.beyond-heading {

  margin: 0 0 25px;

  color: #F7F2E8;

  font-family:
    "Playfair Display",
    serif;

  font-size:
    clamp(48px, 5vw, 70px);

  font-weight: 600;

  line-height: 1.08;

  letter-spacing: -1.5px;

}


.beyond-heading span {

  display: block;

  color: #C9A227;

  font-style: italic;

  font-weight: 500;

}


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

.beyond-intro {

  max-width: 650px;

  margin: auto;

  color: #D8CFC0;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 18px;

  line-height: 1.85;

}


/* ==========================================
   GRID
========================================== */

.beyond-grid {

  display: grid;

  grid-template-columns:
    repeat(3, 1fr);

  gap: 18px;

}


/* ==========================================
   CARD
========================================== */

.beyond-card {

  position: relative;

  min-height: 350px;

  padding: 35px 30px 30px;

  display: flex;

  flex-direction: column;

  background: #17140F;

  border:
    1px solid
    rgba(
      201,
      162,
      39,
      0.20
    );

  transition:
    transform 0.35s ease,
    border-color 0.35s ease,
    background 0.35s ease,
    box-shadow 0.35s ease;

}


.beyond-card:hover {

  transform:
    translateY(-7px);

  background: #1D1913;

  border-color:
    rgba(
      201,
      162,
      39,
      0.65
    );

  box-shadow:
    0 25px 55px
    rgba(
      0,
      0,
      0,
      0.28
    );

}


/* ==========================================
   CARD TOP
========================================== */

.beyond-card-top {

  display: flex;

  align-items: center;

  justify-content: space-between;

  margin-bottom: 28px;

}


/* ==========================================
   NUMBER
========================================== */

.beyond-number {

  color:
    rgba(
      201,
      162,
      39,
      0.75
    );

  font-family:
    "Playfair Display",
    serif;

  font-size: 15px;

  font-style: italic;

}


/* ==========================================
   SYMBOL
========================================== */

.beyond-symbol {

  width: 42px;

  height: 42px;

  display: flex;

  align-items: center;

  justify-content: center;

  border:
    1px solid
    rgba(
      201,
      162,
      39,
      0.45
    );

  border-radius: 50%;

  color: #C9A227;

  font-family:
    "Playfair Display",
    serif;

  font-size: 17px;

}


/* ==========================================
   CARD LINE
========================================== */

.beyond-card-line {

  width: 42px;

  height: 1px;

  margin-bottom: 22px;

  background: #C9A227;

  transition:
    width 0.35s ease;

}


.beyond-card:hover
.beyond-card-line {

  width: 65px;

}


/* ==========================================
   CARD HEADING
========================================== */

.beyond-card h3 {

  margin: 0 0 15px;

  color: #F7F2E8;

  font-family:
    "Playfair Display",
    serif;

  font-size: 27px;

  font-weight: 500;

  line-height: 1.2;

}


/* ==========================================
   CARD TEXT
========================================== */

.beyond-card p {

  margin: 0;

  color: #D8CFC0;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 14px;

  line-height: 1.85;

}


/* ==========================================
   CARD ARROW
========================================== */

.beyond-card-bottom {

  margin-top: auto;

  padding-top: 30px;

  color: #C9A227;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 22px;

  transition:
    transform 0.35s ease,
    color 0.35s ease;

}


.beyond-card:hover
.beyond-card-bottom {

  color: #E0C15A;

  transform:
    translateX(6px);

}


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

.beyond-cta-wrap {

  display: flex;

  align-items: center;

  justify-content: center;

  margin-top: 50px;

}


.beyond-button {

  display: inline-flex;

  align-items: center;

  justify-content: center;

  gap: 20px;

  min-height: 55px;

  padding: 0 24px;

  border:
    1px solid
    #C9A227;

  color: #0B0A08;

  background: #C9A227;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 12px;

  font-weight: 600;

  letter-spacing: 1.5px;

  text-transform: uppercase;

  text-decoration: none !important;

  transition:
    background 0.3s ease,
    color 0.3s ease,
    border-color 0.3s ease,
    transform 0.3s ease,
    gap 0.3s ease;

}


.beyond-button strong {

  font-size: 19px;

  font-weight: 400;

  transition:
    transform 0.3s ease;

}


.beyond-button:hover {

  background: #E0C15A;

  border-color: #E0C15A;

  color: #0B0A08;

  transform:
    translateY(-3px);

  gap: 25px;

}


.beyond-button:hover strong {

  transform:
    translateX(4px);

}


/* ==========================================
   BOTTOM
========================================== */

.beyond-bottom {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 18px;

  margin-top: 70px;

}


.beyond-bottom div {

  width: 45px;

  height: 1px;

  background:
    rgba(
      201,
      162,
      39,
      0.35
    );

}


.beyond-bottom span {

  color:
    rgba(
      216,
      207,
      192,
      0.55
    );

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 8px;

  font-weight: 600;

  letter-spacing: 2.5px;

}


/* ==========================================
   CINEMATIC GLOW
========================================== */

.beyond-glow {

  position: absolute;

  border-radius: 50%;

  pointer-events: none;

}


.beyond-glow-one {

  width: 550px;

  height: 550px;

  left: 50%;

  top: 45%;

  transform:
    translate(
      -50%,
      -50%
    );

  background:
    radial-gradient(
      circle,
      rgba(
        201,
        162,
        39,
        0.07
      ),
      transparent 70%
    );

}


.beyond-glow-two {

  width: 350px;

  height: 350px;

  right: -180px;

  bottom: -160px;

  background:
    radial-gradient(
      circle,
      rgba(
        201,
        162,
        39,
        0.06
      ),
      transparent 70%
    );

}


/* ==========================================
   RINGS
========================================== */

.beyond-ring {

  position: absolute;

  border:
    1px solid
    rgba(
      201,
      162,
      39,
      0.09
    );

  border-radius: 50%;

  pointer-events: none;

}


.beyond-ring-one {

  width: 600px;

  height: 600px;

  left: -400px;

  top: 15%;

}


.beyond-ring-two {

  width: 800px;

  height: 800px;

  right: -550px;

  bottom: -350px;

  opacity: 0.45;

}


/* ==========================================
   ELEMENTOR EDITOR FIX
========================================== */

body.elementor-editor-active
.beyond-card,
body.elementor-editor-active
.beyond-header {

  opacity: 1 !important;

  transform: none !important;

}


/* ==========================================
   TABLET
========================================== */

@media (max-width: 950px) {

  .lela-beyond-books {

    padding: 100px 0;

  }


  .beyond-grid {

    grid-template-columns:
      repeat(2, 1fr);

  }


  .beyond-card:last-child {

    grid-column:
      span 2;

  }

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 600px) {

  .lela-beyond-books {

    padding: 80px 0;

  }


  .beyond-container {

    width: 88%;

  }


  .beyond-header {

    margin-bottom: 45px;

  }


  .beyond-heading {

    font-size: 46px;

    letter-spacing: -1px;

  }


  .beyond-intro {

    font-size: 16px;

    line-height: 1.8;

  }


  .beyond-grid {

    grid-template-columns: 1fr;

    gap: 15px;

  }


  .beyond-card {

    min-height: auto;

    padding: 32px 25px;

  }


  .beyond-card:last-child {

    grid-column: auto;

  }


  .beyond-card h3 {

    font-size: 25px;

  }


  .beyond-card p {

    font-size: 14px;

  }


  .beyond-button {

    width: 100%;

  }


  .beyond-bottom {

    margin-top: 50px;

    gap: 10px;

  }


  .beyond-bottom span {

    font-size: 6.5px;

    letter-spacing: 1.5px;

  }


  .beyond-bottom div {

    width: 20px;

  }

}


/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

  .beyond-card,
  .beyond-card-line,
  .beyond-button,
  .beyond-card-bottom {

    transition: none !important;

  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-4cd4365 *//* ==========================================
   ROOT
========================================== */

:root {

  --personal-bg: #EFE6D5;

  --personal-black: #0B0A08;

  --personal-gold: #C9A227;

  --personal-text: #4A443B;

  --personal-champagne: #D8C39A;

  --personal-ivory: #F7F2E8;

}


/* ==========================================
   SECTION
========================================== */

.lela-personal-message {

  position: relative;

  overflow: hidden;

  padding: 130px 0;

  background: #EFE6D5;

  color: #0B0A08;

}


/* ==========================================
   CONTAINER
========================================== */

.personal-message-container {

  width: min(1180px, 90%);

  margin: auto;

  display: grid;

  grid-template-columns:
    0.9fr
    1.1fr;

  align-items: center;

  gap: 100px;

  position: relative;

  z-index: 3;

}


/* ==========================================
   IMAGE COLUMN
========================================== */

.personal-message-image-column {

  position: relative;

  width: 100%;

  max-width: 460px;

  padding: 15px;

  opacity: 0;

  transform: translateY(40px);

  transition:
    opacity 0.9s ease,
    transform 0.9s ease;

}


.personal-message-image-column.reveal {

  opacity: 1;

  transform: translateY(0);

}


/* ==========================================
   IMAGE FRAME
========================================== */

.personal-message-frame {

  position: absolute;

  inset: 15px;

  border:
    1px solid
    rgba(
      201,
      162,
      39,
      0.55
    );

  transform:
    translate(
      14px,
      14px
    );

  pointer-events: none;

  z-index: 1;

}


/* ==========================================
   IMAGE WRAP
========================================== */

.personal-message-image-wrap {

  position: relative;

  z-index: 2;

  width: 100%;

  aspect-ratio: 4 / 5;

  overflow: hidden;

  background: #E9DFCC;

  box-shadow:
    0 25px 70px
    rgba(
      11,
      10,
      8,
      0.10
    );

}


/* ==========================================
   IMAGE
========================================== */

.personal-message-image {

  width: 100%;

  height: 100%;

  display: block;

  object-fit: cover;

  filter:
    saturate(0.88)
    contrast(1.03);

  transition:
    transform 0.8s ease,
    filter 0.8s ease;

}


.personal-message-image-wrap:hover
.personal-message-image {

  transform:
    scale(1.04);

  filter:
    saturate(1)
    contrast(1.05);

}


/* ==========================================
   NUMBER
========================================== */

.personal-message-number {

  position: absolute;

  left: -4px;

  top: 30px;

  z-index: 5;

  color: #C9A227;

  font-family:
    "Playfair Display",
    serif;

  font-size: 58px;

  font-weight: 500;

  font-style: italic;

  line-height: 1;

}


/* ==========================================
   IMAGE CAPTION
========================================== */

.personal-message-caption {

  position: absolute;

  right: -5px;

  bottom: 38px;

  z-index: 5;

  display: flex;

  align-items: center;

  gap: 10px;

  color: #4A443B;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 8px;

  font-weight: 600;

  letter-spacing: 2.5px;

  writing-mode: vertical-rl;

  transform:
    rotate(180deg);

}


.personal-message-caption span {

  width: 25px;

  height: 1px;

  background: #C9A227;

}


/* ==========================================
   CONTENT
========================================== */

.personal-message-content {

  max-width: 650px;

  opacity: 0;

  transform: translateY(40px);

  transition:
    opacity 0.9s ease 0.15s,
    transform 0.9s ease 0.15s;

}


.personal-message-content.reveal {

  opacity: 1;

  transform: translateY(0);

}


/* ==========================================
   EYEBROW
========================================== */

.personal-message-eyebrow {

  display: flex;

  align-items: center;

  gap: 14px;

  margin-bottom: 25px;

  color: #C9A227;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 12px;

  font-weight: 600;

  letter-spacing: 3px;

  text-transform: uppercase;

}


.personal-message-eyebrow span {

  width: 42px;

  height: 1px;

  background: #C9A227;

}


/* ==========================================
   HEADING
========================================== */

.personal-message-heading {

  margin: 0 0 30px;

  color: #0B0A08;

  font-family:
    "Playfair Display",
    serif;

  font-size:
    clamp(48px, 5vw, 70px);

  font-weight: 600;

  line-height: 1.08;

  letter-spacing: -1.5px;

}


.personal-message-heading span {

  display: block;

  color: #C9A227;

  font-style: italic;

  font-weight: 500;

}


/* ==========================================
   DIVIDER
========================================== */

.personal-message-divider {

  width: 75px;

  height: 1px;

  margin-bottom: 30px;

  background: #C9A227;

}


/* ==========================================
   COPY
========================================== */

.personal-message-copy {

  position: relative;

  padding-left: 25px;

  border-left:
    1px solid
    #D8C39A;

}


/* ==========================================
   MESSAGE TEXT
========================================== */

.personal-message-copy p {

  margin: 0 0 20px;

  color: #4A443B;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 16px;

  line-height: 1.9;

}


.personal-message-copy p:last-child {

  margin-bottom: 0;

}


/* ==========================================
   PLACEHOLDER
========================================== */

.personal-message-placeholder {

  color:
    rgba(
      74,
      68,
      59,
      0.72
    );

}


/* ==========================================
   SIGNATURE
========================================== */

.personal-message-signature {

  display: flex;

  align-items: center;

  gap: 15px;

  margin-top: 35px;

}


.signature-line {

  width: 45px;

  height: 1px;

  background: #C9A227;

}


.signature-name {

  color: #0B0A08;

  font-family:
    "Playfair Display",
    serif;

  font-size: 20px;

  font-style: italic;

}


/* ==========================================
   BACKGROUND CIRCLES
========================================== */

.personal-message-circle {

  position: absolute;

  border:
    1px solid
    rgba(
      216,
      195,
      154,
      0.38
    );

  border-radius: 50%;

  pointer-events: none;

}


.personal-circle-one {

  width: 430px;

  height: 430px;

  left: -290px;

  top: 5%;

}


.personal-circle-two {

  width: 260px;

  height: 260px;

  right: -130px;

  bottom: 5%;

}


/* ==========================================
   ELEMENTOR EDITOR FIX
========================================== */

body.elementor-editor-active
.personal-message-image-column,
body.elementor-editor-active
.personal-message-content {

  opacity: 1 !important;

  transform: none !important;

}


body.elementor-editor-active
.personal-message-image {

  opacity: 1 !important;

  visibility: visible !important;

}


/* ==========================================
   TABLET
========================================== */

@media (max-width: 950px) {

  .lela-personal-message {

    padding: 100px 0;

  }


  .personal-message-container {

    width: min(700px, 88%);

    grid-template-columns: 1fr;

    gap: 70px;

  }


  .personal-message-image-column {

    max-width: 480px;

    margin: auto;

  }


  .personal-message-content {

    max-width: 100%;

  }

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 600px) {

  .lela-personal-message {

    padding: 80px 0;

  }


  .personal-message-container {

    width: 88%;

    gap: 55px;

  }


  .personal-message-image-column {

    padding: 10px;

  }


  .personal-message-heading {

    font-size: 46px;

    letter-spacing: -1px;

  }


  .personal-message-copy {

    padding-left: 18px;

  }


  .personal-message-copy p {

    font-size: 14px;

    line-height: 1.8;

  }


  .personal-message-number {

    left: -2px;

    top: 25px;

    font-size: 45px;

  }


  .personal-message-caption {

    right: 0;

    bottom: 30px;

  }


  .personal-message-circle {

    opacity: 0.7;

  }

}


/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

  .personal-message-image,
  .personal-message-image-column,
  .personal-message-content {

    transition: none !important;

  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-0604e2d *//* ==========================================
   ROOT
========================================== */

:root {

  --continue-bg: #F7F2E8;

  --continue-black: #0B0A08;

  --continue-gold: #C9A227;

  --continue-text: #4A443B;

  --continue-champagne: #D8C39A;

  --continue-card: #EFE6D5;

}


/* ==========================================
   SECTION
========================================== */

.lela-continue-journey {

  position: relative;

  overflow: hidden;

  padding: 130px 0;

  background: white;

  color: #0B0A08;

}


/* ==========================================
   CONTAINER
========================================== */

.continue-container {

  width: min(1180px, 90%);

  margin: auto;

  position: relative;

  z-index: 3;

}


/* ==========================================
   HEADER
========================================== */

.continue-header {

  max-width: 760px;

  margin: 0 auto 65px;

  text-align: center;

}


/* ==========================================
   EYEBROW
========================================== */

.continue-eyebrow {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 14px;

  margin-bottom: 25px;

  color: #C9A227;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 12px;

  font-weight: 600;

  letter-spacing: 3px;

  text-transform: uppercase;

}


.continue-eyebrow span {

  width: 42px;

  height: 1px;

  background: #C9A227;

}


/* ==========================================
   HEADING
========================================== */

.continue-heading {

  margin: 0 0 25px;

  color: #0B0A08;

  font-family:
    "Playfair Display",
    serif;

  font-size:
    clamp(48px, 5vw, 70px);

  font-weight: 600;

  line-height: 1.08;

  letter-spacing: -1.5px;

}


.continue-heading span {

  display: block;

  color: #C9A227;

  font-style: italic;

  font-weight: 500;

}


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

.continue-intro {

  max-width: 650px;

  margin: auto;

  color: #4A443B;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 18px;

  line-height: 1.85;

}


/* ==========================================
   GRID
========================================== */

.continue-grid {

  display: grid;

  grid-template-columns:
    repeat(3, 1fr);

  gap: 18px;

}


/* ==========================================
   CARD
========================================== */

.continue-card {

  position: relative;

  min-height: 360px;

  padding: 38px 30px 30px;

  display: flex;

  flex-direction: column;

  background: #EFE6D5;

  border:
    1px solid
    rgba(
      201,
      162,
      39,
      0.25
    );

  transition:
    transform 0.35s ease,
    background 0.35s ease,
    border-color 0.35s ease,
    box-shadow 0.35s ease;

}


.continue-card:hover {

  transform:
    translateY(-7px);

  background: #F7F2E8;

  border-color:
    rgba(
      201,
      162,
      39,
      0.65
    );

  box-shadow:
    0 25px 55px
    rgba(
      11,
      10,
      8,
      0.08
    );

}


/* ==========================================
   NUMBER
========================================== */

.continue-card-number {

  position: absolute;

  top: 18px;

  right: 20px;

  color:
    rgba(
      201,
      162,
      39,
      0.65
    );

  font-family:
    "Playfair Display",
    serif;

  font-size: 15px;

  font-style: italic;

}


/* ==========================================
   ICON
========================================== */

.continue-card-icon {

  width: 45px;

  height: 45px;

  display: flex;

  align-items: center;

  justify-content: center;

  margin-bottom: 25px;

  border:
    1px solid
    rgba(
      201,
      162,
      39,
      0.5
    );

  border-radius: 50%;

  color: #C9A227;

  font-family:
    "Playfair Display",
    serif;

  font-size: 18px;

}


/* ==========================================
   GOLD LINE
========================================== */

.continue-card-line {

  width: 42px;

  height: 1px;

  margin-bottom: 22px;

  background: #C9A227;

  transition:
    width 0.35s ease;

}


.continue-card:hover
.continue-card-line {

  width: 65px;

}


/* ==========================================
   CARD HEADING
========================================== */

.continue-card h3 {

  margin: 0 0 15px;

  color: #0B0A08;

  font-family:
    "Playfair Display",
    serif;

  font-size: 27px;

  font-weight: 500;

  line-height: 1.2;

}


/* ==========================================
   CARD TEXT
========================================== */

.continue-card p {

  margin: 0;

  color: #4A443B;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 14px;

  line-height: 1.85;

}


/* ==========================================
   BUTTON
========================================== */

.continue-button {

  display: inline-flex;

  align-items: center;

  justify-content: center;

  align-self: flex-start;

  gap: 20px;

  min-height: 55px;

  margin-top: auto;

  padding: 0 24px;

  border:
    1px solid
    #C9A227;

  color: #0B0A08;

  background: transparent;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 12px;

  font-weight: 600;

  letter-spacing: 1.5px;

  text-transform: uppercase;

  text-decoration: none !important;

  transition:
    background 0.3s ease,
    color 0.3s ease,
    transform 0.3s ease,
    gap 0.3s ease;

}


.continue-button strong {

  color: #C9A227;

  font-size: 19px;

  font-weight: 400;

  transition:
    transform 0.3s ease,
    color 0.3s ease;

}


.continue-button:hover {

  background: #C9A227;

  color: #0B0A08;

  transform:
    translateY(-3px);

  gap: 25px;

}


.continue-button:hover strong {

  color: #0B0A08;

  transform:
    translateX(4px);

}


/* ==========================================
   BOTTOM
========================================== */

.continue-bottom {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 18px;

  margin-top: 70px;

}


.continue-bottom span {

  color:
    rgba(
      74,
      68,
      59,
      0.60
    );

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 8px;

  font-weight: 600;

  letter-spacing: 2.5px;

}


.continue-bottom-line {

  width: 45px;

  height: 1px;

  background:
    rgba(
      201,
      162,
      39,
      0.4
    );

}


/* ==========================================
   BACKGROUND CIRCLES
========================================== */

.continue-circle {

  position: absolute;

  border:
    1px solid
    rgba(
      216,
      195,
      154,
      0.35
    );

  border-radius: 50%;

  pointer-events: none;

}


.continue-circle-one {

  width: 420px;

  height: 420px;

  left: -280px;

  top: 5%;

}


.continue-circle-two {

  width: 260px;

  height: 260px;

  right: -130px;

  bottom: 5%;

}


/* ==========================================
   ELEMENTOR EDITOR FIX
========================================== */

body.elementor-editor-active
.continue-card {

  opacity: 1 !important;

  transform: none !important;

}


/* ==========================================
   TABLET
========================================== */

@media (max-width: 950px) {

  .lela-continue-journey {

    padding: 100px 0;

  }


  .continue-grid {

    grid-template-columns:
      repeat(2, 1fr);

  }


  .continue-card:last-child {

    grid-column:
      span 2;

  }

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 600px) {

  .lela-continue-journey {

    padding: 80px 0;

  }


  .continue-container {

    width: 88%;

  }


  .continue-header {

    margin-bottom: 45px;

  }


  .continue-heading {

    font-size: 46px;

    letter-spacing: -1px;

  }


  .continue-intro {

    font-size: 16px;

    line-height: 1.8;

  }


  .continue-grid {

    grid-template-columns: 1fr;

    gap: 15px;

  }


  .continue-card {

    min-height: 330px;

    padding: 32px 25px 25px;

  }


  .continue-card:last-child {

    grid-column: auto;

  }


  .continue-card h3 {

    font-size: 25px;

  }


  .continue-card p {

    font-size: 14px;

  }


  .continue-button {

    width: 100%;

  }


  .continue-bottom {

    margin-top: 50px;

    gap: 10px;

  }


  .continue-bottom span {

    font-size: 6.5px;

    letter-spacing: 1.5px;

  }


  .continue-bottom-line {

    width: 20px;

  }


  .continue-circle-one {

    width: 250px;

    height: 250px;

    left: -180px;

  }

}


/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

  .continue-card,
  .continue-card-line,
  .continue-button {

    transition: none !important;

  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-6f146ab *//* ==========================================
   ROOT
========================================== */

:root {

  --about-final-black: #0B0A08;

  --about-final-ivory: #F7F2E8;

  --about-final-gold: #C9A227;

  --about-final-gold-hover: #E0C15A;

  --about-final-text: #D8CFC0;

}


/* ==========================================
   SECTION
========================================== */

.lela-about-final-cta {

  position: relative;

  overflow: hidden;

  min-height: 650px;

  padding: 145px 0;

  display: flex;

  align-items: center;

  justify-content: center;

  background: #0B0A08;

  color: #F7F2E8;

}


/* ==========================================
   CONTAINER
========================================== */

.about-final-container {

  width: min(950px, 90%);

  margin: auto;

  position: relative;

  z-index: 5;

  text-align: center;

  opacity: 0;

  transform: translateY(40px);

  transition:
    opacity 0.9s ease,
    transform 0.9s ease;

}


.about-final-container.reveal {

  opacity: 1;

  transform: translateY(0);

}


/* ==========================================
   EYEBROW
========================================== */

.about-final-eyebrow {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 16px;

  margin-bottom: 28px;

  color: #C9A227;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 11px;

  font-weight: 600;

  letter-spacing: 3.5px;

  text-transform: uppercase;

}


.about-final-eyebrow span {

  width: 45px;

  height: 1px;

  background: #C9A227;

}


/* ==========================================
   HEADING
========================================== */

.about-final-heading {

  max-width: 900px;

  margin: 0 auto;

  color: #F7F2E8;

  font-family:
    "Playfair Display",
    serif;

  font-size:
    clamp(
      48px,
      6vw,
      82px
    );

  font-weight: 500;

  line-height: 1.02;

  letter-spacing: -2.5px;

}


.about-final-heading span {

  display: block;

  color: #C9A227;

  font-style: italic;

  font-weight: 500;

}


/* ==========================================
   DIVIDER
========================================== */

.about-final-divider {

  width: 75px;

  height: 1px;

  margin: 38px auto 30px;

  background: #C9A227;

}


/* ==========================================
   TEXT
========================================== */

.about-final-text {

  max-width: 650px;

  margin: 0 auto;

  color: #D8CFC0;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 15px;

  line-height: 1.9;

}


/* ==========================================
   BUTTONS
========================================== */

.about-final-buttons {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 14px;

  flex-wrap: wrap;

  margin-top: 40px;

}


/* ==========================================
   BUTTON BASE
========================================== */

.about-final-button {

  min-height: 55px;

  padding: 0 24px;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  gap: 20px;

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 12px;

  font-weight: 600;

  letter-spacing: 1.5px;

  text-transform: uppercase;

  text-decoration: none !important;

  transition:
    background 0.3s ease,
    color 0.3s ease,
    border-color 0.3s ease,
    transform 0.3s ease,
    gap 0.3s ease;

}


.about-final-button strong {

  font-size: 19px;

  font-weight: 400;

  transition:
    transform 0.3s ease;

}


/* ==========================================
   PRIMARY
========================================== */

.about-final-button-primary {

  color: #0B0A08;

  background: #C9A227;

  border:
    1px solid
    #C9A227;

}


.about-final-button-primary:hover {

  color: #0B0A08;

  background: #E0C15A;

  border-color: #E0C15A;

  transform:
    translateY(-3px);

  gap: 25px;

}


.about-final-button-primary:hover strong {

  transform:
    translateX(4px);

}


/* ==========================================
   SECONDARY
========================================== */

.about-final-button-secondary {

  color: #F7F2E8;

  background: transparent;

  border:
    1px solid
    rgba(
      201,
      162,
      39,
      0.65
    );

}


.about-final-button-secondary strong {

  color: #C9A227;

}


.about-final-button-secondary:hover {

  color: #0B0A08;

  background: #C9A227;

  border-color: #C9A227;

  transform:
    translateY(-3px);

  gap: 25px;

}


.about-final-button-secondary:hover strong {

  color: #0B0A08;

  transform:
    translateX(4px);

}


/* ==========================================
   BOTTOM MESSAGE
========================================== */

.about-final-message {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 18px;

  margin-top: 70px;

}


.about-final-message span {

  color:
    rgba(
      216,
      207,
      192,
      0.55
    );

  font-family:
    "DM Sans",
    sans-serif;

  font-size: 8px;

  font-weight: 600;

  letter-spacing: 2.5px;

}


.about-final-message div {

  width: 45px;

  height: 1px;

  background:
    rgba(
      201,
      162,
      39,
      0.35
    );

}


/* ==========================================
   CINEMATIC GLOW
========================================== */

.about-final-glow {

  position: absolute;

  border-radius: 50%;

  pointer-events: none;

}


.about-final-glow-one {

  width: 600px;

  height: 600px;

  left: 50%;

  top: 50%;

  transform:
    translate(
      -50%,
      -50%
    );

  background:
    radial-gradient(
      circle,
      rgba(
        201,
        162,
        39,
        0.09
      ) 0%,
      rgba(
        201,
        162,
        39,
        0.025
      ) 40%,
      transparent 72%
    );

}


.about-final-glow-two {

  width: 350px;

  height: 350px;

  right: -180px;

  top: -150px;

  background:
    radial-gradient(
      circle,
      rgba(
        201,
        162,
        39,
        0.07
      ),
      transparent 70%
    );

}


/* ==========================================
   RINGS
========================================== */

.about-final-ring {

  position: absolute;

  left: 50%;

  top: 50%;

  border:
    1px solid
    rgba(
      201,
      162,
      39,
      0.10
    );

  border-radius: 50%;

  transform:
    translate(
      -50%,
      -50%
    );

  pointer-events: none;

}


.about-final-ring-one {

  width: 600px;

  height: 600px;

}


.about-final-ring-two {

  width: 850px;

  height: 850px;

  opacity: 0.45;

}


/* ==========================================
   ELEMENTOR EDITOR FIX
========================================== */

body.elementor-editor-active
.about-final-container {

  opacity: 1 !important;

  transform: none !important;

}


/* ==========================================
   MOBILE / TABLET
========================================== */

@media (max-width: 800px) {

  .lela-about-final-cta {

    min-height: auto;

    padding: 110px 0;

  }


  .about-final-heading {

    font-size:
      clamp(
        48px,
        9vw,
        70px
      );

  }

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 600px) {

  .lela-about-final-cta {

    padding: 85px 0;

  }


  .about-final-container {

    width: 88%;

  }


  .about-final-eyebrow {

    font-size: 9px;

    letter-spacing: 2.5px;

  }


  .about-final-eyebrow span {

    width: 25px;

  }


  .about-final-heading {

    font-size: 46px;

    letter-spacing: -1px;

    line-height: 1.03;

  }


  .about-final-text {

    font-size: 14px;

    line-height: 1.8;

  }


  .about-final-buttons {

    flex-direction: column;

    width: 100%;

  }


  .about-final-button {

    width: 100%;

  }


  .about-final-message {

    margin-top: 50px;

    gap: 10px;

  }


  .about-final-message span {

    font-size: 6.5px;

    letter-spacing: 1.5px;

  }


  .about-final-message div {

    width: 20px;

  }


  .about-final-ring-one {

    width: 400px;

    height: 400px;

  }


  .about-final-ring-two {

    width: 600px;

    height: 600px;

  }

}


/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

  .about-final-container,
  .about-final-button {

    transition: none !important;

  }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-e99c0b2 *//* ==========================================
   ROOT
========================================== */
/* ==========================================
   FOOTER LOGO IMAGE
========================================== */

.footer-logo {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}


.footer-logo-image {
  display: block;
  width: 190px;
  height: auto;
  max-width: 100%;
  object-fit: contain;
}


/* Mobile */

@media (max-width: 650px) {

  .footer-logo-image {
    width: 165px;
  }

}
:root {

  --footer-black: #0B0A08;

  --footer-ivory: #F7F2E8;

  --footer-gold: #C9A227;

  --footer-text: #D8CFC0;

  --footer-muted: rgba(
    216,
    207,
    192,
    0.58
  );

}


/* ==========================================
   FOOTER
========================================== */

.lela-footer {

  position: relative;

  overflow: hidden;

  background:
    var(--footer-black);

  color:
    var(--footer-ivory);

  padding:
    90px 0 28px;

}


.lela-footer *,
.lela-footer *::before,
.lela-footer *::after {

  box-sizing:
    border-box;

}


/* ==========================================
   CONTAINER
========================================== */

.footer-container {

  width:
    min(
      1180px,
      90%
    );

  margin:
    0 auto;

  position:
    relative;

  z-index:
    3;

}


/* ==========================================
   MAIN GRID
========================================== */

.footer-main {

  display:
    grid;

  grid-template-columns:
    1.45fr
    0.8fr
    0.8fr
    1.15fr;

  gap:
    55px;

}


/* ==========================================
   BRAND
========================================== */

.footer-brand {

  padding-right:
    25px;

}


.footer-logo {

  display:
    inline-block;

  color:
    var(--footer-ivory);

  text-decoration:
    none !important;

}


.footer-logo-text {

  display:
    flex;

  flex-direction:
    column;

  font-family:
    "Playfair Display",
    serif;

  font-size:
    31px;

  line-height:
    0.95;

  font-weight:
    500;

  letter-spacing:
    -0.5px;

}


.footer-logo-text strong {

  color:
    var(--footer-gold);

  font-size:
    25px;

  font-style:
    italic;

  font-weight:
    500;

  margin-top:
    5px;

}


.footer-statement {

  max-width:
    350px;

  margin:
    25px 0 22px;

  color:
    var(--footer-text);

  font-family:
    "DM Sans",
    sans-serif;

  font-size:
    13px;

  line-height:
    1.85;

}


/* ==========================================
   ROLES
========================================== */

.footer-roles {

  display:
    flex;

  align-items:
    center;

  flex-wrap:
    wrap;

  gap:
    9px;

  color:
    var(--footer-muted);

  font-family:
    "DM Sans",
    sans-serif;

  font-size:
    7px;

  font-weight:
    600;

  letter-spacing:
    1.5px;

}


.footer-roles i {

  width:
    3px;

  height:
    3px;

  border-radius:
    50%;

  background:
    var(--footer-gold);

}


/* ==========================================
   BRAND LINE
========================================== */

.footer-brand-line {

  width:
    70px;

  height:
    1px;

  margin-top:
    28px;

  background:
    var(--footer-gold);

}


/* ==========================================
   FOOTER TITLES
========================================== */

.footer-title {

  margin:
    3px 0 25px;

  color:
    var(--footer-gold);

  font-family:
    "DM Sans",
    sans-serif;

  font-size:
    9px;

  font-weight:
    600;

  letter-spacing:
    2.5px;

  text-transform:
    uppercase;

}


/* ==========================================
   LINKS
========================================== */

.footer-links {

  list-style:
    none;

  padding:
    0;

  margin:
    0;

}


.footer-links li {

  margin-bottom:
    13px;

}


.footer-links a {

  position:
    relative;

  display:
    inline-block;

  color:
    var(--footer-ivory);

  font-family:
    "DM Sans",
    sans-serif;

  font-size:
    12px;

  line-height:
    1.4;

  text-decoration:
    none !important;

  transition:
    color 0.3s ease,
    padding-left 0.3s ease;

}


.footer-links a::before {

  content:
    "";

  position:
    absolute;

  left:
    -13px;

  top:
    50%;

  width:
    0;

  height:
    1px;

  background:
    var(--footer-gold);

  transition:
    width 0.3s ease;

}


.footer-links a:hover {

  color:
    var(--footer-gold);

  padding-left:
    5px;

}


.footer-links a:hover::before {

  width:
    8px;

}


/* ==========================================
   SOCIAL ICONS
========================================== */

.footer-socials {

  display:
    flex;

  align-items:
    center;

  gap:
    9px;

  margin-top:
    28px;

}


.footer-social {

  width:
    35px;

  height:
    35px;

  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  color:
    var(--footer-gold);

  border:
    1px solid
    rgba(
      201,
      162,
      39,
      0.42
    );

  text-decoration:
    none;

  transition:
    background 0.3s ease,
    color 0.3s ease,
    border-color 0.3s ease,
    transform 0.3s ease;

}


.footer-social:hover {

  color:
    var(--footer-black);

  background:
    var(--footer-gold);

  border-color:
    var(--footer-gold);

  transform:
    translateY(-3px);

}


.footer-social svg {

  width:
    16px;

  height:
    16px;

  fill:
    none;

  stroke:
    currentColor;

  stroke-width:
    1.4;

}


.footer-social .social-dot {

  fill:
    currentColor;

  stroke:
    none;

}


.footer-social .youtube-play {

  fill:
    currentColor;

  stroke:
    none;

}


.footer-social-letter {

  font-family:
    Arial,
    sans-serif;

  font-size:
    14px;

  font-weight:
    600;

}


.footer-social.linkedin {

  font-size:
    11px;

}


/* ==========================================
   CONNECT
========================================== */

.footer-connect-text {

  max-width:
    300px;

  margin:
    0 0 20px;

  color:
    var(--footer-text);

  font-family:
    "DM Sans",
    sans-serif;

  font-size:
    12px;

  line-height:
    1.75;

}


/* ==========================================
   FORM
========================================== */

.footer-form {

  width:
    100%;

}


.footer-input-wrap {

  display:
    flex;

  width:
    100%;

  height:
    48px;

  border:
    1px solid
    rgba(
      201,
      162,
      39,
      0.4
    );

  background:
    rgba(
      255,
      255,
      255,
      0.025
    );

  transition:
    border-color 0.3s ease;

}


.footer-input-wrap:focus-within {

  border-color:
    var(--footer-gold);

}


.footer-input-wrap input {

  flex:
    1;

  min-width:
    0;

  padding:
    0 14px;

  border:
    none;

  outline:
    none;

  background:
    transparent;

  color:
    var(--footer-ivory);

  font-family:
    "DM Sans",
    sans-serif;

  font-size:
    11px;

}


.footer-input-wrap input::placeholder {

  color:
    rgba(
      216,
      207,
      192,
      0.5
    );

}


.footer-input-wrap button {

  width:
    48px;

  flex-shrink:
    0;

  border:
    none;

  border-left:
    1px solid
    rgba(
      201,
      162,
      39,
      0.35
    );

  background:
    var(--footer-gold);

  color:
    var(--footer-black);

  font-size:
    18px;

  cursor:
    pointer;

  transition:
    background 0.3s ease;

}


.footer-input-wrap button:hover {

  background:
    #E0C15A;

}


/* ==========================================
   FORM MESSAGE
========================================== */

.footer-form-message {

  min-height:
    18px;

  margin-top:
    8px;

  color:
    var(--footer-gold);

  font-family:
    "DM Sans",
    sans-serif;

  font-size:
    9px;

}


/* ==========================================
   SMALL NOTE
========================================== */

.footer-small-note {

  margin:
    3px 0 0;

  color:
    rgba(
      216,
      207,
      192,
      0.38
    );

  font-family:
    "DM Sans",
    sans-serif;

  font-size:
    8px;

  line-height:
    1.5;

}


/* ==========================================
   DIVIDER
========================================== */

.footer-divider {

  width:
    100%;

  height:
    1px;

  margin:
    65px 0 25px;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(
        201,
        162,
        39,
        0.45
      ),
      transparent
    );

}


/* ==========================================
   BOTTOM BAR
========================================== */

.footer-bottom {

  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    25px;

}


.footer-copyright {

  color:
    rgba(
      216,
      207,
      192,
      0.5
    );

  font-family:
    "DM Sans",
    sans-serif;

  font-size:
    9px;

  letter-spacing:
    0.3px;

}


.footer-legal {

  display:
    flex;

  align-items:
    center;

  gap:
    13px;

}


.footer-legal a {

  color:
    rgba(
      247,
      242,
      232,
      0.65
    );

  font-family:
    "DM Sans",
    sans-serif;

  font-size:
    9px;

  text-decoration:
    none !important;

  transition:
    color 0.3s ease;

}


.footer-legal a:hover {

  color:
    var(--footer-gold);

}


.footer-legal span {

  width:
    3px;

  height:
    3px;

  border-radius:
    50%;

  background:
    rgba(
      201,
      162,
      39,
      0.5
    );

}


/* ==========================================
   DECORATIVE GLOW
========================================== */

.footer-glow {

  position:
    absolute;

  width:
    400px;

  height:
    400px;

  border-radius:
    50%;

  pointer-events:
    none;

  background:
    radial-gradient(
      circle,
      rgba(
        201,
        162,
        39,
        0.045
      ),
      transparent 70%
    );

}


.footer-glow-left {

  left:
    -250px;

  bottom:
    -220px;

}


.footer-glow-right {

  right:
    -250px;

  top:
    -250px;

}


/* ==========================================
   TABLET
========================================== */

@media (max-width: 1000px) {

  .footer-main {

    grid-template-columns:
      1.2fr 1fr 1fr;

    gap:
      40px;

  }


  .footer-brand {

    grid-column:
      1 / -1;

    padding-right:
      0;

    max-width:
      600px;

  }

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 650px) {

  .lela-footer {

    padding:
      70px 0 25px;

  }


  .footer-container {

    width:
      88%;

  }


  .footer-main {

    grid-template-columns:
      1fr;

    gap:
      45px;

  }


  .footer-brand {

    grid-column:
      auto;

  }


  .footer-title {

    margin-bottom:
      20px;

  }


  .footer-divider {

    margin:
      50px 0 25px;

  }


  .footer-bottom {

    flex-direction:
      column;

    align-items:
      flex-start;

    gap:
      15px;

  }


  .footer-legal {

    flex-wrap:
      wrap;

    gap:
      10px;

  }


  .footer-statement {

    font-size:
      12px;

  }

}


/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

  .footer-social,
  .footer-links a,
  .footer-input-wrap,
  .footer-input-wrap button {

    transition:
      none !important;

  }

}/* End custom CSS */