/*!*************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/safepay.css ***!
  \*************************************************************************************************************************************************************************************************************************************************************************/
/* NOTE: This file is appended into src/app/globals.css for stable bundling. */
/* Keep editing here, then re-append if needed. */

/* SafePay overrides on top of Friday(web) design */

:root{
  --sp-ink: #0f172a;
  --sp-blue: #2563eb;
  --sp-blue-2: #1d4ed8;
  --sp-mint: #a7f3d0;
  --sp-card: rgba(255,255,255,0.88);
  --sp-glass: rgba(255,255,255,0.12);
  --sp-glass-2: rgba(255,255,255,0.18);
}

/* Ensure header logo fits */
.header-logo img { height: 28px; width: auto; }

/* Keep container consistent */
.header__container { max-width: 1320px; margin: 0 auto; }

/* ===============
   HERO (readdy-like)
   =============== */
/* HERO background image (replaces placeholder 11.png which showed "1920x628") */
.sp-hero-bg{
  position: relative;
  overflow: hidden;
  /* Darken strongly for readability (image stays behind everything) */
  background:
    linear-gradient(180deg, rgba(0,0,0,0.78) 0%, rgba(0,0,0,0.72) 45%, rgba(0,0,0,0.80) 100%),
    url('/img/backgrounds/safepay-hero.webp');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* Optional subtle color glow (kept from previous version) */
.sp-hero-bg:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(1200px 600px at 20% 10%, rgba(59,130,246,0.25), rgba(0,0,0,0) 60%),
    radial-gradient(900px 520px at 80% 10%, rgba(99,102,241,0.20), rgba(0,0,0,0) 60%),
    radial-gradient(700px 500px at 55% 90%, rgba(16,185,129,0.10), rgba(0,0,0,0) 60%);
  opacity: 1;
}

.sp-hero-bg:after{
  content:"";
  position:absolute;
  inset:-120px -120px auto auto;
  width: 520px;
  height: 520px;
  border-radius: 999px;
  background: radial-gradient(circle at 30% 30%, rgba(59,130,246,0.35), rgba(0,0,0,0) 60%);
  filter: blur(12px);
  pointer-events:none;
}

.sp-hero-pill{
  display:inline-flex;
  align-items:center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.18);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: rgba(255,255,255,0.88);
}

.sp-hero-kpi{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-gap: 10px;
  gap: 10px;
}

.sp-kpi-item{
  border: 1px solid rgba(255,255,255,0.18);
  background: rgba(255,255,255,0.08);
  border-radius: 14px;
  padding: 12px 12px;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.sp-kpi-item .v{ color:#fff; font-weight: 800; font-size: var(--fs-md); line-height: 1.1; }
.sp-kpi-item .k{ color: rgba(255,255,255,0.75); font-size: var(--fs-sm); margin-top: 4px; }

.sp-glass{
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255,255,255,0.15), rgba(255,255,255,0.08));
  border: 1px solid rgba(255,255,255,0.18);
  box-shadow: 0 18px 50px rgba(0,0,0,0.35);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.sp-glass-light{
  border-radius: 14px;
  background: rgba(255,255,255,0.85);
  border: 1px solid rgba(0,0,0,0.06);
}

/* ===============
   Section title (readdy-like)
   =============== */
.sp-readdy-section-title{
  text-align: center;
  max-width: 860px;
  margin: 0 auto;
}

.sp-readdy-section-title .eyebrow{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 7px 12px;
  border-radius: 999px;
  background: rgba(37,99,235,0.10);
  border: 1px solid rgba(37,99,235,0.18);
  color: var(--sp-blue);
  font-weight: 800;
  font-size: var(--fs-sm);
}

/* ===============
   Service intro marketing blocks
   =============== */
.sp-dark-hero{
  position: relative;
  overflow: hidden;
  border-radius: 22px;
  background:
    radial-gradient(900px 500px at 20% 20%, rgba(59,130,246,0.40), rgba(0,0,0,0) 60%),
    radial-gradient(700px 420px at 85% 25%, rgba(99,102,241,0.35), rgba(0,0,0,0) 60%),
    linear-gradient(180deg, #07112a, #07112a);
}

/* Remove placeholder overlay to avoid showing "1920x628" on any section */
.sp-dark-hero:before{ content:none; }

.sp-stat{
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,0.14);
  background: rgba(255,255,255,0.08);
  padding: 14px 14px;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.sp-stat .n{ color:#fff; font-weight: 900; font-size: var(--fs-lg); line-height: 1.1; }
.sp-stat .t{ color: rgba(255,255,255,0.75); font-size: var(--fs-sm); margin-top: 4px; }

/* responsive */
@media (max-width: 991px){
  .sp-hero-kpi{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 575px){
  .sp-hero-bg:before{ opacity: 1; }
}


/* === SafePay v5 precision layout & popup layering (operational polish) === */

/* 1) Popup / dropdown / modal must sit above fixed header (z-index: 1000) */
.modal, .modal-backdrop { z-index: 2500 !important; }
.offcanvas { z-index: 2450 !important; }
.dropdown-menu, .dropdown__content, .headerDropdown__content { z-index: 2400 !important; }
.currencyMenu, .currencyMenu__overlay { z-index: 2300 !important; }
.currencyMenu__content { z-index: 2350 !important; }

/* Mobile menu overlay should cover page */
.header-menu.is-menu-active,
.header-menu__content,
.mobile-overlay {
  z-index: 2200 !important;
}
.mobile-overlay{
  position: fixed !important;
  inset: 0 !important;
}

/* 2) Typography + spacing tightening (readdy-like) */
:root{
  --sp-radius: 16px;
  --sp-radius-sm: 12px;
  --sp-gap: 16px;
  --sp-gap-lg: 24px;
  --sp-shadow: 0 20px 50px rgba(2, 6, 23, 0.18);
  --sp-shadow-soft: 0 10px 30px rgba(2, 6, 23, 0.10);
}

/* Headline smoothing */
h1, .text-40, .text-44 { letter-spacing: -0.02em; }
.text-16 { line-height: 1.65; }
.text-13 { line-height: 1.45; }

/* 3) Buttons: consistent height, radius, and padding */
.button{
  border-radius: var(--sp-radius-sm) !important;
  font-weight: 600;
}
.button.h-50{ height: 52px !important; }
.button.px-30{ padding-left: 26px !important; padding-right: 26px !important; }

/* 4) Cards/boxes: unified radius & subtle shadow */
.bg-light-2.rounded-4,
.bg-white.rounded-4,
.rounded-4{
  border-radius: var(--sp-radius) !important;
}
.bg-white.rounded-4{
  box-shadow: var(--sp-shadow-soft);
  border: 1px solid rgba(2,6,23,0.06);
}

/* 5) Form controls: align with header/button rhythm */
.form-control, .form-select{
  border-radius: 14px !important;
  padding: 12px 14px !important;
  height: 48px;
  border-color: rgba(2,6,23,0.12) !important;
}
.form-control:focus, .form-select:focus{
  outline: none;
  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.16) !important;
  border-color: rgba(37, 99, 235, 0.55) !important;
}

/* 6) Hero: reduce awkward gaps on large screens */
.sp-hero-bg .row.y-gap-30{ row-gap: 28px !important; }
.sp-hero-bg h1{ margin-top: 18px !important; }
.sp-hero-bg p.text-16{ margin-top: 18px !important; color: rgba(255,255,255,0.88) !important; }
.sp-hero-kpi{ margin-top: 22px !important; }
.sp-kpi-item{ border-radius: 16px; }

/* 7) Right "Create Link" card: crisp glass + shadow so it reads as foreground */
.sp-create-card{
  border-radius: 18px;
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.22);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow: var(--sp-shadow);
}

/* 8) Ensure any absolute hero decorations never block clicks */
.sp-hero-bg:before, .sp-hero-bg:after{ pointer-events: none; }

/* Responsive tweaks */
@media (max-width: 991px){
  .header__container{ padding-left: 18px !important; padding-right: 18px !important; }
  .button.px-30{ padding-left: 22px !important; padding-right: 22px !important; }
}
@media (max-width: 575px){
  .sp-hero-kpi{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}


/* ===== SafePay Notification (toast) ===== */
.sp-notice-wrap{
  position: relative;
  display: inline-flex;
  align-items: center;
  margin-right: 14px;
}

.sp-bell{
  position: relative;
  width: 42px;
  height: 42px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.22);
  background: rgba(255,255,255,0.10);
  color: rgba(255,255,255,0.92);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform .12s ease, box-shadow .12s ease, background .12s ease, border-color .12s ease;
  -webkit-backdrop-filter: blur(8px);
          backdrop-filter: blur(8px);
}
.sp-bell:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,0.16);
  border-color: rgba(255,255,255,0.30);
  box-shadow: 0 14px 40px rgba(2,6,23,0.18);
}
.sp-bell__badge{
  position: absolute;
  top: -6px;
  right: -6px;
  min-width: 18px;
  height: 18px;
  padding: 0 6px;
  border-radius: 999px;
  background: #ef4444;
  color: #fff;
  font-size: var(--fs-sm);
  line-height: 18px;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 10px 20px rgba(239,68,68,0.28);
}

/* sample-like toast */
.sp-toast{
  position: fixed;
  top: 78px;
  right: 28px;
  width: min(520px, calc(100vw - 32px));
  background: #ffffff;
  border: 1px solid rgba(15,23,42,0.10);
  border-radius: 18px;
  box-shadow: 0 26px 70px rgba(2,6,23,0.22);
  z-index: 99999; /* always above header */
  overflow: hidden;
  animation: spToastIn .18s ease-out;
}
@keyframes spToastIn{
  from { transform: translateY(-8px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}
.sp-toast__row{
  display: flex;
  gap: 14px;
  padding: 16px 18px;
}
.sp-toast__icon{
  width: 40px;
  height: 40px;
  border-radius: 14px;
  background: rgba(249,115,22,0.10);
  color: #f97316;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}
.sp-toast__content{
  min-width: 0;
  flex: 1 1 auto;
}
.sp-toast__head{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}
.sp-toast__title{
  font-size: var(--fs-body);
  font-weight: 900;
  color: #0f172a;
  letter-spacing: -0.01em;
}
.sp-toast__close{
  width: 30px;
  height: 30px;
  border-radius: 12px;
  border: 1px solid rgba(15,23,42,0.10);
  background: #ffffff;
  font-size: var(--fs-xl);
  line-height: 28px;
  color: rgba(15,23,42,0.55);
}
.sp-toast__close:hover{
  color: rgba(15,23,42,0.95);
  border-color: rgba(15,23,42,0.18);
}
.sp-toast__message{
  margin-top: 6px;
  font-size: var(--fs-caption);
  line-height: 1.5;
  color: rgba(15,23,42,0.70);
  word-break: keep-all;
}
.sp-toast__actions{
  margin-top: 10px;
}
.sp-toast__cta{
  display: inline-flex;
  font-size: var(--fs-caption);
  font-weight: 900;
  color: #16a34a;
}
.sp-toast__cta:hover{ text-decoration: underline; }

@media (max-width: 767px){
  .sp-toast{
    top: 66px;
    right: 14px;
    width: min(520px, calc(100vw - 20px));
  }
}

/* ===== SafePay spacing polish v7 ===== */
/* ===== SafePay spacing polish v7 =====
   Goal: more breathing room + full-width feel (scoped to body.safepay only)
*/
body.safepay{
  --sp-container-max: 1440px;
  --sp-gutter-desktop: 28px;
  --sp-gutter-tablet: 20px;
  --sp-gutter-mobile: 16px;

  --sp-section-pt: 72px;
  --sp-section-pb: 72px;

  --sp-card-px: 32px;
  --sp-card-py: 32px;

  --sp-row-gap-lg: 44px;
  --sp-row-gap-md: 24px;
}

/* Containers */
body.safepay .header__container{
  max-width: var(--sp-container-max) !important;
  padding-left: var(--sp-gutter-desktop) !important;
  padding-right: var(--sp-gutter-desktop) !important;
}

body.safepay .container{
  max-width: var(--sp-container-max) !important;
  padding-left: var(--sp-gutter-desktop) !important;
  padding-right: var(--sp-gutter-desktop) !important;
}

/* Section paddings (used across pages) */
body.safepay .layout-pt-md{ padding-top: var(--sp-section-pt) !important; }
body.safepay .layout-pb-md{ padding-bottom: var(--sp-section-pb) !important; }

/* If some pages use sm/lg utilities, keep them proportional */
body.safepay .layout-pt-sm{ padding-top: 44px !important; }
body.safepay .layout-pb-sm{ padding-bottom: 44px !important; }
body.safepay .layout-pt-lg{ padding-top: 88px !important; }
body.safepay .layout-pb-lg{ padding-bottom: 88px !important; }

/* Grid gaps */
body.safepay .row.y-gap-30{ row-gap: var(--sp-row-gap-lg) !important; }
body.safepay .row.y-gap-20{ row-gap: 30px !important; }
body.safepay .row.y-gap-15{ row-gap: 18px !important; }

/* Card paddings (common utility classes) */
body.safepay .py-25{ padding-top: var(--sp-card-py) !important; padding-bottom: var(--sp-card-py) !important; }
body.safepay .px-25{ padding-left: var(--sp-card-px) !important; padding-right: var(--sp-card-px) !important; }
body.safepay .py-30{ padding-top: 32px !important; padding-bottom: 32px !important; }
body.safepay .px-30{ padding-left: 32px !important; padding-right: 32px !important; }

/* Many boxes are built with p-30 + shadow-4; give them consistent breathing room */
body.safepay .bg-white.shadow-4.p-30,
body.safepay .shadow-4.p-30{
  padding: 34px !important;
}
body.safepay .rounded-16{ border-radius: 18px !important; }

/* Comfortable spacing for tables/lists */
body.safepay table td,
body.safepay table th{
  padding-top: 14px !important;
  padding-bottom: 14px !important;
}

/* Slightly larger paragraph rhythm inside cards */
body.safepay .bg-white p,
body.safepay .bg-white .text-14{
  line-height: 1.65;
}

/* Buttons: slightly larger hit-area without looking bulky */
body.safepay .button{
  padding-top: 12px;
  padding-bottom: 12px;
}

/* ===== Page-by-page micro tuning (v10) ===== */
/* Common page wrapper */
body.safepay .sp-page{ min-height: 1px; }

/* --- Create Escrow / Provider onboarding: form rhythm --- */
body.safepay .sp-page--create .bg-light-2.rounded-4,
body.safepay .sp-page--provider .bg-light-2.rounded-4,
body.safepay .sp-page--checkout .bg-light-2.rounded-4,
body.safepay .sp-page--admin .bg-light-2.rounded-4{
  padding: 34px !important;
  border-radius: 18px !important;
}

body.safepay .sp-page--create .form-control,
body.safepay .sp-page--provider .form-control,
body.safepay .sp-page--checkout .form-control,
body.safepay .sp-page--admin .form-control,
body.safepay .sp-page--create .form-select,
body.safepay .sp-page--provider .form-select,
body.safepay .sp-page--checkout .form-select{
  height: 52px;
  padding-left: 14px;
  padding-right: 14px;
  border-radius: 14px;
}

body.safepay .sp-page--create .form-control.mt-5,
body.safepay .sp-page--provider .form-control.mt-5,
body.safepay .sp-page--checkout .form-control.mt-5,
body.safepay .sp-page--admin .form-control.mt-5,
body.safepay .sp-page--create .form-select.mt-5,
body.safepay .sp-page--provider .form-select.mt-5,
body.safepay .sp-page--checkout .form-select.mt-5{
  margin-top: 10px !important;
}

body.safepay .sp-page--create .text-15,
body.safepay .sp-page--provider .text-15,
body.safepay .sp-page--checkout .text-15,
body.safepay .sp-page--admin .text-15{
  line-height: 1.6;
}

/* --- Checkout: actions block should breathe more --- */
body.safepay .sp-page--checkout .border-top-light{
  margin-top: 24px !important;
  padding-top: 24px !important;
}
body.safepay .sp-page--checkout .button.h-50{
  min-width: 140px;
}

/* --- Admin: center card visually balanced --- */
body.safepay .sp-page--admin .col-lg-6{
  max-width: 680px;
}

/* --- Service intro: hero box spacing --- */
body.safepay .sp-page--service .sp-dark-hero.p-30{ padding: 42px !important; border-radius: 20px !important; }
body.safepay .sp-page--service .sp-glass.p-25{ padding: 30px !important; }

/* --- Providers: reduce tightness of cards / lists --- */
body.safepay .sp-page--providers .card,
body.safepay .sp-page--providers .card-body{
  border-radius: 18px;
}
body.safepay .sp-page--providers .card-body{ padding: 26px !important; }

/* --- Legal pages: comfortable reading width + card padding --- */
body.safepay .sp-page--legal{ max-width: 980px; margin-left: auto; margin-right: auto; }
body.safepay .sp-page--legal .card{ padding: 34px !important; border-radius: 18px !important; }

@media (max-width: 575px){
  body.safepay .sp-page--create .bg-light-2.rounded-4,
  body.safepay .sp-page--provider .bg-light-2.rounded-4,
  body.safepay .sp-page--checkout .bg-light-2.rounded-4,
  body.safepay .sp-page--admin .bg-light-2.rounded-4{
    padding: 20px !important;
  }
  body.safepay .sp-page--service .sp-dark-hero.p-30{ padding: 22px !important; }
}

/* Responsive gutters */
@media (max-width: 991px){
  body.safepay .header__container,
  body.safepay .container{
    padding-left: var(--sp-gutter-tablet) !important;
    padding-right: var(--sp-gutter-tablet) !important;
  }
  body.safepay{
    --sp-section-pt: 54px;
    --sp-section-pb: 54px;
    --sp-card-px: 22px;
    --sp-card-py: 22px;
    --sp-row-gap-lg: 36px;
  }
}

@media (max-width: 575px){
  body.safepay .header__container,
  body.safepay .container{
    padding-left: var(--sp-gutter-mobile) !important;
    padding-right: var(--sp-gutter-mobile) !important;
  }
  body.safepay{
    --sp-section-pt: 44px;
    --sp-section-pb: 44px;
    --sp-card-px: 18px;
    --sp-card-py: 18px;
    --sp-row-gap-lg: 28px;
  }
  body.safepay .text-40{ font-size: var(--fs-4xl) !important; line-height: 1.15 !important; }
}


/* ===== SafePay FAQ accordion (open/close) ===== */
body.safepay .sp-section-head{ max-width: 920px; }

body.safepay .sp-faq{
  display: grid;
  grid-gap: 14px;
  gap: 14px;
}

body.safepay .sp-faq-item{
  border-radius: 18px;
  border: 1px solid rgba(2,6,23,0.08);
  background: rgba(255,255,255,0.92);
  box-shadow: 0 4px 16px rgba(2,6,23,0.05);
  /* NO overflow:hidden — it breaks grid-template-rows animation */
}

body.safepay .sp-faq-btn{
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 22px 24px;
  background: transparent;
  border: 0;
  text-align: left;
  cursor: pointer;
  font-family: inherit;
}

body.safepay .sp-faq-q{
  font-size: var(--fs-body);
  font-weight: 800;
  color: rgba(15,23,42,0.96);
  letter-spacing: -0.01em;
  line-height: 1.4;
}

body.safepay .sp-faq-icon{
  width: 32px;
  height: 32px;
  border-radius: 10px;
  border: 1.5px solid rgba(2,6,23,0.10);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: rgba(15,23,42,0.60);
  font-size: var(--fs-lg);
  font-weight: 800;
  line-height: 1;
  flex: 0 0 auto;
  transition: all .18s ease;
}

/* Panel: grid animation — requires no overflow:hidden on parent */
body.safepay .sp-faq-panel{
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows .25s cubic-bezier(0.4, 0, 0.2, 1);
}

body.safepay .sp-faq-item.is-open .sp-faq-panel{
  grid-template-rows: 1fr;
}

/* Inner wrapper: overflow:hidden clips content to 0 when closed */
body.safepay .sp-faq-a{
  overflow: hidden;
  min-height: 0;  /* required for 0fr to work */
  padding: 0 24px 22px 24px;
}

/* Divider between question and answer */
body.safepay .sp-faq-item.is-open .sp-faq-btn{
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(15,23,42,0.07);
}

body.safepay .sp-faq-item.is-open .sp-faq-a{
  padding-top: 16px;
}

body.safepay .sp-faq-item.is-open .sp-faq-icon{
  background: #eff6ff;
  border-color: #bfdbfe;
  color: #2563eb;
}

@media (max-width: 575px){
  body.safepay .sp-faq-btn{ padding: 18px 16px; }
  body.safepay .sp-faq-a{ padding: 0 16px 18px; }
  body.safepay .sp-faq-item.is-open .sp-faq-a{ padding-top: 14px; }
}

/* ===== v13 merge: header brand + hover dropdowns + header actions spacing (keeps v10 page tuning + FAQ) ===== */
/* === Header brand lockup (Friday + SafePay sub project) === */
.sp-brand{
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
}
.sp-brand__logo{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border-radius:12px;
  background: rgba(15,23,42,0.04);
}
.sp-brand__logo img{
  height:24px;
  width:auto;
  object-fit:contain;
  display:block;
}
.sp-brand__text{ display:flex; flex-direction:column; line-height:1.05; }
.sp-brand__top{ font-weight:800; font-size:var(--fs-lg); color:var(--sp-ink); letter-spacing:-0.02em; }
.sp-brand__bottom{ display:flex; align-items:center; gap:8px; margin-top:2px; }
.sp-brand__sub{ font-weight:800; font-size:var(--fs-caption); color:var(--sp-blue-2); }
.sp-brand__tag{ font-weight:500; font-size:8px; color: rgba(15,23,42,0.60); margin-right: 20px;}

/* Prevent header crowding */
.header{ position: -webkit-sticky; position: sticky; top: 0; z-index: 1000; }
.header-margin{ height: 0 !important; } /* keep layout stable; header already sticky */

/* === Hover dropdowns (notification / account) === */
.sp-dd{ position:relative; }
.sp-dd__btn{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  height:44px;
  padding:0 12px;
  border-radius:12px;
  background: rgba(15,23,42,0.04);
  border:1px solid rgba(15,23,42,0.06);
  color: var(--sp-ink);
}
.sp-dd__btn:hover{ background: rgba(15,23,42,0.06); }
.sp-dd__btn--acct{ padding:0 12px 0 12px; }
.sp-dd__label{ font-size:var(--fs-caption); font-weight:700; opacity:0.9; }
.sp-badge{
  position:absolute;
  top:-6px;
  right:-6px;
  min-width:18px;
  height:18px;
  padding:0 6px;
  border-radius:999px;
  background: var(--sp-blue);
  color:#fff;
  font-size:var(--fs-xs);
  font-weight:800;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-shadow: 0 8px 18px rgba(37,99,235,0.25);
}
.sp-dd__menu{
  position:absolute;
  top: 100%;
  right:0;
  width: 320px;
  max-width: calc(100vw - 32px);
  background:#fff;
  border:1px solid rgba(15,23,42,0.10);
  border-radius:16px;
  box-shadow: 0 20px 60px rgba(2, 6, 23, 0.18);
  /* GAP-FIX: padding-top을 브릿지로 사용 — 버튼 아래에서 메뉴로 이동 시 mouseLeave 방지 */
  padding: 0 12px 12px;
  padding-top: 14px;
  opacity:0;
  transform: translateY(0);
  pointer-events:none;
  transition: opacity .15s ease;
  /* ::before 가상 요소로 버튼↔메뉴 사이 투명 브릿지 */
}
/* 투명 브릿지: 버튼 위쪽까지 hover 영역 확장 */
.sp-dd__menu::before {
  content: "";
  position: absolute;
  top: -14px;
  left: -4px;
  right: -4px;
  height: 16px;
  background: transparent;
}
.sp-dd__title{
  font-size:var(--fs-sm);
  font-weight:800;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color: rgba(15,23,42,0.55);
  padding: 6px 8px 10px;
}
.sp-dd__item{
  border-radius:12px;
  padding:10px 10px;
  background: rgba(15,23,42,0.03);
  border:1px solid rgba(15,23,42,0.06);
  margin-bottom:10px;
}
.sp-dd__itemTitle{ font-size:var(--fs-caption); font-weight:800; color: var(--sp-ink); }
.sp-dd__itemSub{ font-size:var(--fs-sm); color: rgba(15,23,42,0.70); margin-top:4px; }
.sp-dd__footer{ display:flex; justify-content:flex-end; padding-top:2px; }
.sp-dd__link{ font-size:var(--fs-caption); font-weight:800; color: var(--sp-blue-2); }
.sp-dd__nav{
  display:flex;
  width:100%;
  padding:10px 10px;
  border-radius:12px;
  font-weight:800;
  font-size:var(--fs-caption);
  color: var(--sp-ink);
}
.sp-dd__nav:hover{ background: rgba(15,23,42,0.05); }
.sp-dd__divider{ height:1px; background: rgba(15,23,42,0.08); margin: 8px 2px; }
.sp-dd__nav--danger{ color:#dc2626; }

/* Show dropdown on hover/focus or when JS toggled open */
/* GAP-FIX: CSS hover/focus triggers removed — JS .is-open only */
.sp-dd:hover .sp-dd__menu,
.sp-dd:focus-within .sp-dd__menu {
  opacity: 0;
  pointer-events: none;
  transform: translateY(6px);
}
.sp-dd.is-open .sp-dd__menu {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

/* Mobile guest block */
.sp-mobile-guest{
  border-radius:14px;
  background: rgba(15,23,42,0.04);
  border:1px solid rgba(15,23,42,0.06);
  padding:12px 12px;
}

/* v12: header actions spacing + hover dropdown */
body.safepay .sp-header-actions{display:flex;align-items:center;gap:14px;}
body.safepay .sp-header-actions .button{height:50px;display:inline-flex;align-items:center;justify-content:center;}
body.safepay .sp-header-actions .button.px-30{padding-left:26px;padding-right:26px;}
body.safepay .sp-header-icons{display:flex;align-items:center;gap:10px;margin-left:6px;}

/* dropdown: allow hover/focus open in addition to JS open */
body.safepay .sp-dd{position:relative;}
body.safepay .sp-dd__menu{transform-origin:top right;}
/* GAP-FIX: body.safepay hover removed — JS .is-open only */
body.safepay .sp-dd:hover .sp-dd__menu,
body.safepay .sp-dd:focus-within .sp-dd__menu {
  opacity: 0;
  pointer-events: none;
  transform: translateY(6px);
}
body.safepay .sp-dd.is-open .sp-dd__menu {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

/* =========================
   v20: SaaS-grade final polish
   - Hero right card spacing/clarity
   - KPI row alignment
   - Pricing cards hover/visual hierarchy
   ========================= */

/* (1) Hero: cleaner separation + breathing room (safe: CSS only) */
body.safepay .sp-hero-bg{
  position: relative;
  /* subtle premium gradient (keeps existing look but removes "flat" feel) */
  background-image:
    radial-gradient(900px 500px at 12% 22%, rgba(59,130,246,0.35), rgba(0,0,0,0) 60%),
    radial-gradient(850px 520px at 82% 18%, rgba(99,102,241,0.28), rgba(0,0,0,0) 62%),
    linear-gradient(180deg, rgba(2,6,23,0.00) 0%, rgba(2,6,23,0.08) 40%, rgba(2,6,23,0.18) 100%);
}

/* Hero right "Create Link" card: top spacing + tighter internal rhythm */
body.safepay .sp-hero-bg .col-lg-5 .sp-glass{
  margin-top: 26px;
  padding-top: 22px;
}
@media (min-width: 992px){
  body.safepay .sp-hero-bg .col-lg-5 .sp-glass{ margin-top: 44px; }
}

body.safepay .sp-hero-bg .col-lg-5 .sp-glass .text-18{ letter-spacing: -0.01em; }
body.safepay .sp-hero-bg .col-lg-5 .sp-glass .text-13.mt-5{ margin-top: 6px !important; }
body.safepay .sp-hero-bg .col-lg-5 .sp-glass .y-gap-10.mt-15{ margin-top: 16px !important; }

/* premium surface + subtle border (less "chunky" / more Stripe-like) */
body.safepay .sp-glass{
  border: 1px solid rgba(255,255,255,0.10);
  box-shadow:
    0 12px 30px rgba(2,6,23,0.35),
    inset 0 1px 0 rgba(255,255,255,0.08);
  -webkit-backdrop-filter: blur(14px);
          backdrop-filter: blur(14px);
}

body.safepay .sp-glass-light{
  border-radius: 14px;
  border: 1px solid rgba(15,23,42,0.08) !important;
  box-shadow: 0 10px 18px rgba(2,6,23,0.10);
}

/* (2) KPI row: consistent sizing + alignment */
body.safepay .sp-hero-kpi{
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
body.safepay .sp-kpi-item{
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: calc(25% - 12px);
  min-width: 140px;
  border-radius: 14px;
  padding: 12px 14px;
  background: rgba(15,23,42,0.22);
  border: 1px solid rgba(255,255,255,0.10);
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
}
body.safepay .sp-kpi-item .v{
  font-weight: 800;
  letter-spacing: -0.02em;
}
body.safepay .sp-kpi-item .k{ opacity: 0.85; }

@media (max-width: 767px){
  body.safepay .sp-kpi-item{ flex-grow: 1; flex-shrink: 1; flex-basis: calc(50% - 12px); }
}

/* (3) Pricing cards: hover lift + clearer hierarchy (no markup changes) */
body.safepay #pricing .rounded-16.bg-white{
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  border: 1px solid rgba(15,23,42,0.08);
}
body.safepay #pricing .rounded-16.bg-white:hover{
  transform: translateY(-4px);
  box-shadow: 0 18px 40px rgba(2,6,23,0.10);
  border-color: rgba(37,99,235,0.20);
}

/* Make "Most Popular" card feel premium without being loud */
body.safepay #pricing .shadow-4{
  box-shadow: 0 18px 50px rgba(2,6,23,0.12) !important;
  border: 1px solid rgba(37,99,235,0.16);
}

/* Buttons: slightly more SaaS-like (subtle radius + consistent hover) */
body.safepay #pricing .button{
  border-radius: 12px;
  transition: transform .12s ease, box-shadow .12s ease;
}
body.safepay #pricing .button:hover{
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(2,6,23,0.12);
}

/* =========================
   v20-1 HERO micro polish
   - contrast boost (bg + text)
   - Create Link card rhythm
   - Stripe-like AI Ready chip
   ========================= */
body.safepay .sp-hero-bg{
  /* lock the darker gradient to avoid wash-out */
  background:
    radial-gradient(1200px 600px at 20% 10%, rgba(59,130,246,0.42), rgba(0,0,0,0) 60%),
    radial-gradient(900px 520px at 80% 10%, rgba(99,102,241,0.36), rgba(0,0,0,0) 60%),
    radial-gradient(700px 500px at 55% 90%, rgba(16,185,129,0.18), rgba(0,0,0,0) 60%),
    linear-gradient(180deg, #07112a 0%, #081433 45%, #07112a 100%) !important;
}
body.safepay .sp-hero-bg:before{
  /* avoid screen blend that can flatten contrast on some browsers */
  opacity: 0.18 !important;
  mix-blend-mode: normal !important;
}
body.safepay .sp-hero-bg h1{
  text-shadow: 0 10px 30px rgba(2,6,23,0.35);
}
body.safepay .sp-hero-bg p,
body.safepay .sp-hero-bg .text-16{
  color: rgba(255,255,255,0.88) !important;
}

/* Right card: add breathing room on top + cleaner header rhythm */
body.safepay .sp-hero-card{
  padding: 26px 26px 24px !important;
}
@media (min-width: 992px){
  body.safepay .sp-hero-card{
    margin-top: 0 !important;    /* vertically centered by flexbox */
  }
}

/* Stripe-like chip */
body.safepay .sp-ai-chip{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: var(--fs-sm);
  font-weight: 800;
  letter-spacing: -0.01em;
  color: #a7f3d0;
  background: rgba(167,243,208,0.10);
  border: 1px solid rgba(167,243,208,0.32);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.06);
}
body.safepay .sp-ai-chip:before{
  content: "✓";
  display: inline-block;
  font-weight: 900;
}

/* Card internals: consistent spacing + premium inputs */
body.safepay .sp-hero-card .sp-field-label{
  display: inline-block;
  margin-top: 2px;
}
body.safepay .sp-hero-card .sp-field-input{
  border-color: rgba(255,255,255,0.22) !important;
  background: rgba(255,255,255,0.10) !important;
}
body.safepay .sp-hero-card .sp-field-input:focus{
  border-color: rgba(167,243,208,0.38) !important;
  box-shadow: 0 0 0 4px rgba(16,185,129,0.10);
}

body.safepay .sp-hero-card .sp-milestone-box{
  padding: 14px !important;
  border-radius: 16px !important;
}
body.safepay .sp-hero-card .sp-milestone-item{
  border-radius: 14px !important;
}

body.safepay .sp-ai-panel{
  margin-top: 18px;
  padding: 14px 16px;
  border-radius: 18px;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.14);
  -webkit-backdrop-filter: blur(12px);
          backdrop-filter: blur(12px);
}
body.safepay .sp-ai-panel__head{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
body.safepay .sp-ai-panel__title{
  font-size: var(--fs-sm);
  font-weight: 700;
  color: rgba(255,255,255,0.82);
}
body.safepay .sp-ai-panel__body{
  margin-top: 10px;
  font-size: var(--fs-base);
  line-height: 1.6;
  color: rgba(255,255,255,0.88);
}
body.safepay .sp-ai-panel__capabilities{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
body.safepay .sp-ai-panel__capability{
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  color: #f8fafc;
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.14);
}
body.safepay .sp-ai-panel--compact{
  margin-top: 0;
  padding: 12px 14px;
}
body.safepay .sp-ai-panel--compact .sp-ai-panel__body{
  display: none;
}
body.safepay .sp-hero-ai-strip{
  margin-top: 22px;
  max-width: 620px;
}

body.safepay .sp-hero-card-note{
  margin-top: 10px;
  font-size: var(--fs-sm);
  line-height: 1.5;
  color: rgba(255,255,255,0.76);
}
body.safepay .sp-hero-rail{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-gap: 10px;
  gap: 10px;
  margin-top: 12px;
}
body.safepay .sp-hero-rail__item{
  min-width: 0;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.12);
}
body.safepay .sp-hero-rail__label{
  font-size: 11px;
  font-weight: 700;
  line-height: 1.35;
  color: rgba(255,255,255,0.68);
}
body.safepay .sp-hero-rail__value{
  margin-top: 4px;
  font-size: var(--fs-sm);
  font-weight: 800;
  line-height: 1.35;
  color: #ffffff;
}

@media (max-width: 991px){
  body.safepay .sp-hero-ai-strip{
    margin-top: 14px;
    max-width: none;
  }

  body.safepay .sp-hero-rail{
    grid-template-columns: 1fr;
  }
}

/* Section head left variant */
.sp-readdy-section-title--left { text-align: left; margin-left: 0; }

/*!*************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/globals.css ***!
  \*************************************************************************************************************************************************************************************************************************************************************************/
@font-face {
  font-family: 'Paperlogy';
  src: url('/fonts/Paperlogy-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

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

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

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

:root {
  --fs-xs: 0.6875rem;
  --fs-sm: 0.75rem;
  --fs-caption: 0.8125rem;
  --fs-base: 0.875rem;
  --fs-body: 0.9375rem;
  --fs-md: 1rem;
  --fs-lg: 1.125rem;
  --fs-xl: 1.25rem;
  --fs-2xl: 1.5rem;
  --fs-3xl: 1.75rem;
  --fs-4xl: 2rem;
  --fs-5xl: 2.375rem;
  --fs-6xl: 3rem;
}

@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  html {
    @apply scroll-smooth;
  }

  body {
    font-family: 'Paperlogy',
      -apple-system,
      BlinkMacSystemFont,
      'Segoe UI',
      'Apple SD Gothic Neo',
      'Noto Sans KR',
      Arial,
      sans-serif;

    font-size: var(--fs-body);
    letter-spacing: -0.01em;
    text-rendering: geometricPrecision;

    @apply bg-slate-50 text-slate-900 antialiased min-h-screen;

    line-height: 1.55;
  }

  html {
    font-size: 16px;
  }

  h1, h2, h3, h4, h5, h6 {
    @apply tracking-tight text-slate-900;
  }

  h1 { @apply font-bold text-4xl leading-tight md:text-5xl; }      /* 700 */
  h2 { @apply font-semibold text-3xl leading-snug md:text-4xl; }   /* 600 */
  h3 { @apply font-semibold text-2xl leading-snug md:text-3xl; }   /* 600 */
  h4 { @apply font-semibold text-xl leading-snug md:text-2xl; }    /* 600 */
  h5 { @apply font-semibold text-lg leading-snug; }                /* 600 */
  h6 { @apply font-semibold text-base leading-snug; }              /* 600 */

  p {
    @apply text-slate-700 leading-relaxed;
  }

  a {
    @apply text-slate-800 transition-colors;
  }

  a:hover {
    @apply text-emerald-600;
  }

  button,
  input,
  textarea,
  select {
    font-family: inherit;
  }

  .dark body {
    @apply bg-slate-950 text-slate-100;
  }

  .dark p {
    @apply text-slate-300;
  }

  .dark a {
    @apply text-slate-200;
  }

  .dark a:hover {
    @apply text-emerald-400;
  }

  .dark h1, .dark h2, .dark h3, .dark h4, .dark h5, .dark h6 {
    @apply text-slate-100;
  }

  @media (max-width: 768px) {
    body {
      letter-spacing: -0.005em;
    }
    p {
      @apply leading-7;
    }
  }  

}

@layer components {
  .ty-caption {
    @apply text-xs text-slate-500 leading-snug;
  }

  .ty-body {
    @apply text-sm text-slate-700 leading-relaxed;
  }

  .ty-body-strong {
    @apply text-sm text-slate-800 font-medium leading-relaxed;
  }

  .ty-section-title {
    @apply text-xl md:text-2xl font-semibold tracking-tight text-slate-900;
  }

  .ty-card-title {
    @apply text-base md:text-lg font-semibold text-slate-900;
  }
}

::selection {
  background-color: #059669; /* emerald-600 */
  color: #f9fafb;            /* slate-50 */
}

:focus-visible {
  outline: 2px solid #10b981;     /* emerald-500 */
  outline-offset: 3px;
}

/* SafePay: keep overrides isolated and versionable */

/*!*************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/vendors.css ***!
  \*************************************************************************************************************************************************************************************************************************************************************************/
/*!
 * Bootstrap Reboot v5.1.3 (https://getbootstrap.com/)
 * Copyright 2011-2021 The Bootstrap Authors
 * Copyright 2011-2021 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
 * Forked from Normalize.css, licensed MIT (https://github.com/necolas/normalize.css/blob/master/LICENSE.md)
 */*,:after,:before{box-sizing:border-box}@media (prefers-reduced-motion:no-preference){:root{scroll-behavior:smooth}}body{margin:0;font-family:var(--bs-body-font-family);font-size:var(--bs-body-font-size);font-weight:var(--bs-body-font-weight);line-height:var(--bs-body-line-height);color:var(--bs-body-color);text-align:var(--bs-body-text-align);background-color:var(--bs-body-bg);-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0)}hr{margin:1rem 0;color:inherit;background-color:currentColor;border:0;opacity:.25}hr:not([size]){height:1px}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:.5rem;font-weight:500;line-height:1.2}h1{font-size:calc(1.375rem + 1.5vw)}@media (min-width:1200px){h1{font-size:2.5rem}}h2{font-size:calc(1.325rem + .9vw)}@media (min-width:1200px){h2{font-size:2rem}}h3{font-size:calc(1.3rem + .6vw)}@media (min-width:1200px){h3{font-size:1.75rem}}h4{font-size:calc(1.275rem + .3vw)}@media (min-width:1200px){h4{font-size:1.5rem}}h5{font-size:1.25rem}h6{font-size:1rem}p{margin-top:0;margin-bottom:1rem}abbr[data-bs-original-title],abbr[title]{-webkit-text-decoration:underline dotted;text-decoration:underline dotted;cursor:help;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none}address{margin-bottom:1rem;font-style:normal;line-height:inherit}ol,ul{padding-left:2rem}dl,ol,ul{margin-top:0;margin-bottom:1rem}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:.5rem;margin-left:0}blockquote{margin:0 0 1rem}b,strong{font-weight:bolder}small{font-size:.875em}mark{padding:.2em;background-color:#fcf8e3}sub,sup{position:relative;font-size:.75em;line-height:0;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}a{color:#0d6efd;text-decoration:underline}a:hover{color:#0a58ca}a:not([href]):not([class]),a:not([href]):not([class]):hover{color:inherit;text-decoration:none}code,kbd,pre,samp{font-family:var(--bs-font-monospace);font-size:1em;direction:ltr;unicode-bidi:bidi-override}pre{display:block;margin-top:0;margin-bottom:1rem;overflow:auto;font-size:.875em}pre code{font-size:inherit;color:inherit;word-break:normal}code{font-size:.875em;color:#d63384;word-wrap:break-word}a>code{color:inherit}kbd{padding:.2rem .4rem;font-size:.875em;color:#fff;background-color:#212529;border-radius:.2rem}kbd kbd{padding:0;font-size:1em;font-weight:700}figure{margin:0 0 1rem}img,svg{vertical-align:middle}table{caption-side:bottom;border-collapse:collapse}caption{padding-top:.5rem;padding-bottom:.5rem;color:#6c757d;text-align:left}th{text-align:inherit;text-align:-webkit-match-parent}tbody,td,tfoot,th,thead,tr{border:0 solid;border-color:inherit}label{display:inline-block}button{border-radius:0}button:focus:not(:focus-visible){outline:0}button,input,optgroup,select,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button,select{text-transform:none}[role=button]{cursor:pointer}select{word-wrap:normal}select:disabled{opacity:1}[list]::-webkit-calendar-picker-indicator{display:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled),button:not(:disabled){cursor:pointer}::-moz-focus-inner{padding:0;border-style:none}textarea{resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}legend{float:left;width:100%;padding:0;margin-bottom:.5rem;font-size:calc(1.275rem + .3vw);line-height:inherit}@media (min-width:1200px){legend{font-size:1.5rem}}legend+*{clear:left}::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-fields-wrapper,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-text,::-webkit-datetime-edit-year-field{padding:0}::-webkit-inner-spin-button{height:auto}[type=search]{outline-offset:-2px;-webkit-appearance:textfield}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-color-swatch-wrapper{padding:0}::-webkit-file-upload-button{font:inherit}::file-selector-button{font:inherit}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}output{display:inline-block}iframe{border:0}summary{display:list-item;cursor:pointer}progress{vertical-align:baseline}[hidden]{display:none!important}

/*!
 * Bootstrap Grid v5.1.3 (https://getbootstrap.com/)
 * Copyright 2011-2021 The Bootstrap Authors
 * Copyright 2011-2021 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
 */:root{--bs-blue:#0d6efd;--bs-indigo:#6610f2;--bs-purple:#6f42c1;--bs-pink:#d63384;--bs-red:#dc3545;--bs-orange:#fd7e14;--bs-yellow:#ffc107;--bs-green:#198754;--bs-teal:#20c997;--bs-cyan:#0dcaf0;--bs-white:#fff;--bs-gray:#6c757d;--bs-gray-dark:#343a40;--bs-gray-100:#f8f9fa;--bs-gray-200:#e9ecef;--bs-gray-300:#dee2e6;--bs-gray-400:#ced4da;--bs-gray-500:#adb5bd;--bs-gray-600:#6c757d;--bs-gray-700:#495057;--bs-gray-800:#343a40;--bs-gray-900:#212529;--bs-primary:#0d6efd;--bs-secondary:#6c757d;--bs-success:#198754;--bs-info:#0dcaf0;--bs-warning:#ffc107;--bs-danger:#dc3545;--bs-light:#f8f9fa;--bs-dark:#212529;--bs-primary-rgb:13,110,253;--bs-secondary-rgb:108,117,125;--bs-success-rgb:25,135,84;--bs-info-rgb:13,202,240;--bs-warning-rgb:255,193,7;--bs-danger-rgb:220,53,69;--bs-light-rgb:248,249,250;--bs-dark-rgb:33,37,41;--bs-white-rgb:255,255,255;--bs-black-rgb:0,0,0;--bs-body-color-rgb:33,37,41;--bs-body-bg-rgb:255,255,255;--bs-font-sans-serif:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--bs-font-monospace:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--bs-gradient:linear-gradient(180deg,hsla(0,0%,100%,0.15),hsla(0,0%,100%,0));--bs-body-font-family:var(--bs-font-sans-serif);--bs-body-font-size:1rem;--bs-body-font-weight:400;--bs-body-line-height:1.5;--bs-body-color:#212529;--bs-body-bg:#fff}.container,.container-fluid,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl{width:100%;padding-right:var(--bs-gutter-x,15px);padding-left:var(--bs-gutter-x,15px);margin-right:auto;margin-left:auto}@media (min-width:576px){.container,.container-sm{max-width:540px}}@media (min-width:768px){.container,.container-md,.container-sm{max-width:720px}}@media (min-width:992px){.container,.container-lg,.container-md,.container-sm{max-width:960px}}@media (min-width:1200px){.container,.container-lg,.container-md,.container-sm,.container-xl{max-width:1140px}}@media (min-width:1400px){.container,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl{max-width:1320px}}.row{--bs-gutter-x:30px;--bs-gutter-y:0;display:flex;flex-wrap:wrap;margin-top:calc(var(--bs-gutter-y)*-1);margin-right:calc(var(--bs-gutter-x)*-0.5);margin-left:calc(var(--bs-gutter-x)*-0.5)}.row>*{box-sizing:border-box;flex-shrink:0;width:100%;max-width:100%;padding-right:calc(var(--bs-gutter-x)*0.5);padding-left:calc(var(--bs-gutter-x)*0.5);margin-top:var(--bs-gutter-y)}.col{flex:1 0}.row-cols-auto>*{flex:0 0 auto;width:auto}.row-cols-1>*{flex:0 0 auto;width:100%}.row-cols-2>*{flex:0 0 auto;width:50%}.row-cols-3>*{flex:0 0 auto;width:33.33333%}.row-cols-4>*{flex:0 0 auto;width:25%}.row-cols-5>*{flex:0 0 auto;width:20%}.row-cols-6>*{flex:0 0 auto;width:16.66667%}.col-auto{flex:0 0 auto;width:auto}.col-1{flex:0 0 auto;width:8.33333%}.col-2{flex:0 0 auto;width:16.66667%}.col-3{flex:0 0 auto;width:25%}.col-4{flex:0 0 auto;width:33.33333%}.col-5{flex:0 0 auto;width:41.66667%}.col-6{flex:0 0 auto;width:50%}.col-7{flex:0 0 auto;width:58.33333%}.col-8{flex:0 0 auto;width:66.66667%}.col-9{flex:0 0 auto;width:75%}.col-10{flex:0 0 auto;width:83.33333%}.col-11{flex:0 0 auto;width:91.66667%}.col-12{flex:0 0 auto;width:100%}.offset-1{margin-left:8.33333%}.offset-2{margin-left:16.66667%}.offset-3{margin-left:25%}.offset-4{margin-left:33.33333%}.offset-5{margin-left:41.66667%}.offset-6{margin-left:50%}.offset-7{margin-left:58.33333%}.offset-8{margin-left:66.66667%}.offset-9{margin-left:75%}.offset-10{margin-left:83.33333%}.offset-11{margin-left:91.66667%}.g-0,.gx-0{--bs-gutter-x:0}.g-0,.gy-0{--bs-gutter-y:0}.g-1,.gx-1{--bs-gutter-x:0.25rem}.g-1,.gy-1{--bs-gutter-y:0.25rem}.g-2,.gx-2{--bs-gutter-x:0.5rem}.g-2,.gy-2{--bs-gutter-y:0.5rem}.g-3,.gx-3{--bs-gutter-x:1rem}.g-3,.gy-3{--bs-gutter-y:1rem}.g-4,.gx-4{--bs-gutter-x:1.5rem}.g-4,.gy-4{--bs-gutter-y:1.5rem}.g-5,.gx-5{--bs-gutter-x:3rem}.g-5,.gy-5{--bs-gutter-y:3rem}@media (min-width:576px){.col-sm{flex:1 0}.row-cols-sm-auto>*{flex:0 0 auto;width:auto}.row-cols-sm-1>*{flex:0 0 auto;width:100%}.row-cols-sm-2>*{flex:0 0 auto;width:50%}.row-cols-sm-3>*{flex:0 0 auto;width:33.33333%}.row-cols-sm-4>*{flex:0 0 auto;width:25%}.row-cols-sm-5>*{flex:0 0 auto;width:20%}.row-cols-sm-6>*{flex:0 0 auto;width:16.66667%}.col-sm-auto{flex:0 0 auto;width:auto}.col-sm-1{flex:0 0 auto;width:8.33333%}.col-sm-2{flex:0 0 auto;width:16.66667%}.col-sm-3{flex:0 0 auto;width:25%}.col-sm-4{flex:0 0 auto;width:33.33333%}.col-sm-5{flex:0 0 auto;width:41.66667%}.col-sm-6{flex:0 0 auto;width:50%}.col-sm-7{flex:0 0 auto;width:58.33333%}.col-sm-8{flex:0 0 auto;width:66.66667%}.col-sm-9{flex:0 0 auto;width:75%}.col-sm-10{flex:0 0 auto;width:83.33333%}.col-sm-11{flex:0 0 auto;width:91.66667%}.col-sm-12{flex:0 0 auto;width:100%}.offset-sm-0{margin-left:0}.offset-sm-1{margin-left:8.33333%}.offset-sm-2{margin-left:16.66667%}.offset-sm-3{margin-left:25%}.offset-sm-4{margin-left:33.33333%}.offset-sm-5{margin-left:41.66667%}.offset-sm-6{margin-left:50%}.offset-sm-7{margin-left:58.33333%}.offset-sm-8{margin-left:66.66667%}.offset-sm-9{margin-left:75%}.offset-sm-10{margin-left:83.33333%}.offset-sm-11{margin-left:91.66667%}.g-sm-0,.gx-sm-0{--bs-gutter-x:0}.g-sm-0,.gy-sm-0{--bs-gutter-y:0}.g-sm-1,.gx-sm-1{--bs-gutter-x:0.25rem}.g-sm-1,.gy-sm-1{--bs-gutter-y:0.25rem}.g-sm-2,.gx-sm-2{--bs-gutter-x:0.5rem}.g-sm-2,.gy-sm-2{--bs-gutter-y:0.5rem}.g-sm-3,.gx-sm-3{--bs-gutter-x:1rem}.g-sm-3,.gy-sm-3{--bs-gutter-y:1rem}.g-sm-4,.gx-sm-4{--bs-gutter-x:1.5rem}.g-sm-4,.gy-sm-4{--bs-gutter-y:1.5rem}.g-sm-5,.gx-sm-5{--bs-gutter-x:3rem}.g-sm-5,.gy-sm-5{--bs-gutter-y:3rem}}@media (min-width:768px){.col-md{flex:1 0}.row-cols-md-auto>*{flex:0 0 auto;width:auto}.row-cols-md-1>*{flex:0 0 auto;width:100%}.row-cols-md-2>*{flex:0 0 auto;width:50%}.row-cols-md-3>*{flex:0 0 auto;width:33.33333%}.row-cols-md-4>*{flex:0 0 auto;width:25%}.row-cols-md-5>*{flex:0 0 auto;width:20%}.row-cols-md-6>*{flex:0 0 auto;width:16.66667%}.col-md-auto{flex:0 0 auto;width:auto}.col-md-1{flex:0 0 auto;width:8.33333%}.col-md-2{flex:0 0 auto;width:16.66667%}.col-md-3{flex:0 0 auto;width:25%}.col-md-4{flex:0 0 auto;width:33.33333%}.col-md-5{flex:0 0 auto;width:41.66667%}.col-md-6{flex:0 0 auto;width:50%}.col-md-7{flex:0 0 auto;width:58.33333%}.col-md-8{flex:0 0 auto;width:66.66667%}.col-md-9{flex:0 0 auto;width:75%}.col-md-10{flex:0 0 auto;width:83.33333%}.col-md-11{flex:0 0 auto;width:91.66667%}.col-md-12{flex:0 0 auto;width:100%}.offset-md-0{margin-left:0}.offset-md-1{margin-left:8.33333%}.offset-md-2{margin-left:16.66667%}.offset-md-3{margin-left:25%}.offset-md-4{margin-left:33.33333%}.offset-md-5{margin-left:41.66667%}.offset-md-6{margin-left:50%}.offset-md-7{margin-left:58.33333%}.offset-md-8{margin-left:66.66667%}.offset-md-9{margin-left:75%}.offset-md-10{margin-left:83.33333%}.offset-md-11{margin-left:91.66667%}.g-md-0,.gx-md-0{--bs-gutter-x:0}.g-md-0,.gy-md-0{--bs-gutter-y:0}.g-md-1,.gx-md-1{--bs-gutter-x:0.25rem}.g-md-1,.gy-md-1{--bs-gutter-y:0.25rem}.g-md-2,.gx-md-2{--bs-gutter-x:0.5rem}.g-md-2,.gy-md-2{--bs-gutter-y:0.5rem}.g-md-3,.gx-md-3{--bs-gutter-x:1rem}.g-md-3,.gy-md-3{--bs-gutter-y:1rem}.g-md-4,.gx-md-4{--bs-gutter-x:1.5rem}.g-md-4,.gy-md-4{--bs-gutter-y:1.5rem}.g-md-5,.gx-md-5{--bs-gutter-x:3rem}.g-md-5,.gy-md-5{--bs-gutter-y:3rem}}@media (min-width:992px){.col-lg{flex:1 0}.row-cols-lg-auto>*{flex:0 0 auto;width:auto}.row-cols-lg-1>*{flex:0 0 auto;width:100%}.row-cols-lg-2>*{flex:0 0 auto;width:50%}.row-cols-lg-3>*{flex:0 0 auto;width:33.33333%}.row-cols-lg-4>*{flex:0 0 auto;width:25%}.row-cols-lg-5>*{flex:0 0 auto;width:20%}.row-cols-lg-6>*{flex:0 0 auto;width:16.66667%}.col-lg-auto{flex:0 0 auto;width:auto}.col-lg-1{flex:0 0 auto;width:8.33333%}.col-lg-2{flex:0 0 auto;width:16.66667%}.col-lg-3{flex:0 0 auto;width:25%}.col-lg-4{flex:0 0 auto;width:33.33333%}.col-lg-5{flex:0 0 auto;width:41.66667%}.col-lg-6{flex:0 0 auto;width:50%}.col-lg-7{flex:0 0 auto;width:58.33333%}.col-lg-8{flex:0 0 auto;width:66.66667%}.col-lg-9{flex:0 0 auto;width:75%}.col-lg-10{flex:0 0 auto;width:83.33333%}.col-lg-11{flex:0 0 auto;width:91.66667%}.col-lg-12{flex:0 0 auto;width:100%}.offset-lg-0{margin-left:0}.offset-lg-1{margin-left:8.33333%}.offset-lg-2{margin-left:16.66667%}.offset-lg-3{margin-left:25%}.offset-lg-4{margin-left:33.33333%}.offset-lg-5{margin-left:41.66667%}.offset-lg-6{margin-left:50%}.offset-lg-7{margin-left:58.33333%}.offset-lg-8{margin-left:66.66667%}.offset-lg-9{margin-left:75%}.offset-lg-10{margin-left:83.33333%}.offset-lg-11{margin-left:91.66667%}.g-lg-0,.gx-lg-0{--bs-gutter-x:0}.g-lg-0,.gy-lg-0{--bs-gutter-y:0}.g-lg-1,.gx-lg-1{--bs-gutter-x:0.25rem}.g-lg-1,.gy-lg-1{--bs-gutter-y:0.25rem}.g-lg-2,.gx-lg-2{--bs-gutter-x:0.5rem}.g-lg-2,.gy-lg-2{--bs-gutter-y:0.5rem}.g-lg-3,.gx-lg-3{--bs-gutter-x:1rem}.g-lg-3,.gy-lg-3{--bs-gutter-y:1rem}.g-lg-4,.gx-lg-4{--bs-gutter-x:1.5rem}.g-lg-4,.gy-lg-4{--bs-gutter-y:1.5rem}.g-lg-5,.gx-lg-5{--bs-gutter-x:3rem}.g-lg-5,.gy-lg-5{--bs-gutter-y:3rem}}@media (min-width:1200px){.col-xl{flex:1 0}.row-cols-xl-auto>*{flex:0 0 auto;width:auto}.row-cols-xl-1>*{flex:0 0 auto;width:100%}.row-cols-xl-2>*{flex:0 0 auto;width:50%}.row-cols-xl-3>*{flex:0 0 auto;width:33.33333%}.row-cols-xl-4>*{flex:0 0 auto;width:25%}.row-cols-xl-5>*{flex:0 0 auto;width:20%}.row-cols-xl-6>*{flex:0 0 auto;width:16.66667%}.col-xl-auto{flex:0 0 auto;width:auto}.col-xl-1{flex:0 0 auto;width:8.33333%}.col-xl-2{flex:0 0 auto;width:16.66667%}.col-xl-3{flex:0 0 auto;width:25%}.col-xl-4{flex:0 0 auto;width:33.33333%}.col-xl-5{flex:0 0 auto;width:41.66667%}.col-xl-6{flex:0 0 auto;width:50%}.col-xl-7{flex:0 0 auto;width:58.33333%}.col-xl-8{flex:0 0 auto;width:66.66667%}.col-xl-9{flex:0 0 auto;width:75%}.col-xl-10{flex:0 0 auto;width:83.33333%}.col-xl-11{flex:0 0 auto;width:91.66667%}.col-xl-12{flex:0 0 auto;width:100%}.offset-xl-0{margin-left:0}.offset-xl-1{margin-left:8.33333%}.offset-xl-2{margin-left:16.66667%}.offset-xl-3{margin-left:25%}.offset-xl-4{margin-left:33.33333%}.offset-xl-5{margin-left:41.66667%}.offset-xl-6{margin-left:50%}.offset-xl-7{margin-left:58.33333%}.offset-xl-8{margin-left:66.66667%}.offset-xl-9{margin-left:75%}.offset-xl-10{margin-left:83.33333%}.offset-xl-11{margin-left:91.66667%}.g-xl-0,.gx-xl-0{--bs-gutter-x:0}.g-xl-0,.gy-xl-0{--bs-gutter-y:0}.g-xl-1,.gx-xl-1{--bs-gutter-x:0.25rem}.g-xl-1,.gy-xl-1{--bs-gutter-y:0.25rem}.g-xl-2,.gx-xl-2{--bs-gutter-x:0.5rem}.g-xl-2,.gy-xl-2{--bs-gutter-y:0.5rem}.g-xl-3,.gx-xl-3{--bs-gutter-x:1rem}.g-xl-3,.gy-xl-3{--bs-gutter-y:1rem}.g-xl-4,.gx-xl-4{--bs-gutter-x:1.5rem}.g-xl-4,.gy-xl-4{--bs-gutter-y:1.5rem}.g-xl-5,.gx-xl-5{--bs-gutter-x:3rem}.g-xl-5,.gy-xl-5{--bs-gutter-y:3rem}}@media (min-width:1400px){.col-xxl{flex:1 0}.row-cols-xxl-auto>*{flex:0 0 auto;width:auto}.row-cols-xxl-1>*{flex:0 0 auto;width:100%}.row-cols-xxl-2>*{flex:0 0 auto;width:50%}.row-cols-xxl-3>*{flex:0 0 auto;width:33.33333%}.row-cols-xxl-4>*{flex:0 0 auto;width:25%}.row-cols-xxl-5>*{flex:0 0 auto;width:20%}.row-cols-xxl-6>*{flex:0 0 auto;width:16.66667%}.col-xxl-auto{flex:0 0 auto;width:auto}.col-xxl-1{flex:0 0 auto;width:8.33333%}.col-xxl-2{flex:0 0 auto;width:16.66667%}.col-xxl-3{flex:0 0 auto;width:25%}.col-xxl-4{flex:0 0 auto;width:33.33333%}.col-xxl-5{flex:0 0 auto;width:41.66667%}.col-xxl-6{flex:0 0 auto;width:50%}.col-xxl-7{flex:0 0 auto;width:58.33333%}.col-xxl-8{flex:0 0 auto;width:66.66667%}.col-xxl-9{flex:0 0 auto;width:75%}.col-xxl-10{flex:0 0 auto;width:83.33333%}.col-xxl-11{flex:0 0 auto;width:91.66667%}.col-xxl-12{flex:0 0 auto;width:100%}.offset-xxl-0{margin-left:0}.offset-xxl-1{margin-left:8.33333%}.offset-xxl-2{margin-left:16.66667%}.offset-xxl-3{margin-left:25%}.offset-xxl-4{margin-left:33.33333%}.offset-xxl-5{margin-left:41.66667%}.offset-xxl-6{margin-left:50%}.offset-xxl-7{margin-left:58.33333%}.offset-xxl-8{margin-left:66.66667%}.offset-xxl-9{margin-left:75%}.offset-xxl-10{margin-left:83.33333%}.offset-xxl-11{margin-left:91.66667%}.g-xxl-0,.gx-xxl-0{--bs-gutter-x:0}.g-xxl-0,.gy-xxl-0{--bs-gutter-y:0}.g-xxl-1,.gx-xxl-1{--bs-gutter-x:0.25rem}.g-xxl-1,.gy-xxl-1{--bs-gutter-y:0.25rem}.g-xxl-2,.gx-xxl-2{--bs-gutter-x:0.5rem}.g-xxl-2,.gy-xxl-2{--bs-gutter-y:0.5rem}.g-xxl-3,.gx-xxl-3{--bs-gutter-x:1rem}.g-xxl-3,.gy-xxl-3{--bs-gutter-y:1rem}.g-xxl-4,.gx-xxl-4{--bs-gutter-x:1.5rem}.g-xxl-4,.gy-xxl-4{--bs-gutter-y:1.5rem}.g-xxl-5,.gx-xxl-5{--bs-gutter-x:3rem}.g-xxl-5,.gy-xxl-5{--bs-gutter-y:3rem}}.d-inline{display:inline!important}.d-inline-block{display:inline-block!important}.d-block{display:block!important}.d-grid{display:grid!important}.d-table{display:table!important}.d-table-row{display:table-row!important}.d-table-cell{display:table-cell!important}.d-flex{display:flex!important}.d-inline-flex{display:inline-flex!important}.d-none{display:none!important}.flex-fill{flex:1 1 auto!important}.flex-row{flex-direction:row!important}.flex-column{flex-direction:column!important}.flex-row-reverse{flex-direction:row-reverse!important}.flex-column-reverse{flex-direction:column-reverse!important}.flex-grow-0{flex-grow:0!important}.flex-grow-1{flex-grow:1!important}.flex-shrink-0{flex-shrink:0!important}.flex-shrink-1{flex-shrink:1!important}.flex-wrap{flex-wrap:wrap!important}.flex-nowrap{flex-wrap:nowrap!important}.flex-wrap-reverse{flex-wrap:wrap-reverse!important}.justify-content-start{justify-content:flex-start!important}.justify-content-end{justify-content:flex-end!important}.justify-content-center{justify-content:center!important}.justify-content-between{justify-content:space-between!important}.justify-content-around{justify-content:space-around!important}.justify-content-evenly{justify-content:space-evenly!important}.align-items-start{align-items:flex-start!important}.align-items-end{align-items:flex-end!important}.align-items-center{align-items:center!important}.align-items-baseline{align-items:baseline!important}.align-items-stretch{align-items:stretch!important}.align-content-start{align-content:flex-start!important}.align-content-end{align-content:flex-end!important}.align-content-center{align-content:center!important}.align-content-between{align-content:space-between!important}.align-content-around{align-content:space-around!important}.align-content-stretch{align-content:stretch!important}.align-self-auto{align-self:auto!important}.align-self-start{align-self:flex-start!important}.align-self-end{align-self:flex-end!important}.align-self-center{align-self:center!important}.align-self-baseline{align-self:baseline!important}.align-self-stretch{align-self:stretch!important}.order-first{order:-1!important}.order-0{order:0!important}.order-1{order:1!important}.order-2{order:2!important}.order-3{order:3!important}.order-4{order:4!important}.order-5{order:5!important}.order-last{order:6!important}.m-0{margin:0!important}.m-1{margin:.25rem!important}.m-2{margin:.5rem!important}.m-3{margin:1rem!important}.m-4{margin:1.5rem!important}.m-5{margin:3rem!important}.m-auto{margin:auto!important}.mx-0{margin-right:0!important;margin-left:0!important}.mx-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-3{margin-right:1rem!important;margin-left:1rem!important}.mx-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-5{margin-right:3rem!important;margin-left:3rem!important}.mx-auto{margin-right:auto!important;margin-left:auto!important}.my-0{margin-top:0!important;margin-bottom:0!important}.my-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-0{margin-top:0!important}.mt-1{margin-top:.25rem!important}.mt-2{margin-top:.5rem!important}.mt-3{margin-top:1rem!important}.mt-4{margin-top:1.5rem!important}.mt-5{margin-top:3rem!important}.mt-auto{margin-top:auto!important}.me-0{margin-right:0!important}.me-1{margin-right:.25rem!important}.me-2{margin-right:.5rem!important}.me-3{margin-right:1rem!important}.me-4{margin-right:1.5rem!important}.me-5{margin-right:3rem!important}.me-auto{margin-right:auto!important}.mb-0{margin-bottom:0!important}.mb-1{margin-bottom:.25rem!important}.mb-2{margin-bottom:.5rem!important}.mb-3{margin-bottom:1rem!important}.mb-4{margin-bottom:1.5rem!important}.mb-5{margin-bottom:3rem!important}.mb-auto{margin-bottom:auto!important}.ms-0{margin-left:0!important}.ms-1{margin-left:.25rem!important}.ms-2{margin-left:.5rem!important}.ms-3{margin-left:1rem!important}.ms-4{margin-left:1.5rem!important}.ms-5{margin-left:3rem!important}.ms-auto{margin-left:auto!important}.p-0{padding:0!important}.p-1{padding:.25rem!important}.p-2{padding:.5rem!important}.p-3{padding:1rem!important}.p-4{padding:1.5rem!important}.p-5{padding:3rem!important}.px-0{padding-right:0!important;padding-left:0!important}.px-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-3{padding-right:1rem!important;padding-left:1rem!important}.px-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-5{padding-right:3rem!important;padding-left:3rem!important}.py-0{padding-top:0!important;padding-bottom:0!important}.py-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-0{padding-top:0!important}.pt-1{padding-top:.25rem!important}.pt-2{padding-top:.5rem!important}.pt-3{padding-top:1rem!important}.pt-4{padding-top:1.5rem!important}.pt-5{padding-top:3rem!important}.pe-0{padding-right:0!important}.pe-1{padding-right:.25rem!important}.pe-2{padding-right:.5rem!important}.pe-3{padding-right:1rem!important}.pe-4{padding-right:1.5rem!important}.pe-5{padding-right:3rem!important}.pb-0{padding-bottom:0!important}.pb-1{padding-bottom:.25rem!important}.pb-2{padding-bottom:.5rem!important}.pb-3{padding-bottom:1rem!important}.pb-4{padding-bottom:1.5rem!important}.pb-5{padding-bottom:3rem!important}.ps-0{padding-left:0!important}.ps-1{padding-left:.25rem!important}.ps-2{padding-left:.5rem!important}.ps-3{padding-left:1rem!important}.ps-4{padding-left:1.5rem!important}.ps-5{padding-left:3rem!important}@media (min-width:576px){.d-sm-inline{display:inline!important}.d-sm-inline-block{display:inline-block!important}.d-sm-block{display:block!important}.d-sm-grid{display:grid!important}.d-sm-table{display:table!important}.d-sm-table-row{display:table-row!important}.d-sm-table-cell{display:table-cell!important}.d-sm-flex{display:flex!important}.d-sm-inline-flex{display:inline-flex!important}.d-sm-none{display:none!important}.flex-sm-fill{flex:1 1 auto!important}.flex-sm-row{flex-direction:row!important}.flex-sm-column{flex-direction:column!important}.flex-sm-row-reverse{flex-direction:row-reverse!important}.flex-sm-column-reverse{flex-direction:column-reverse!important}.flex-sm-grow-0{flex-grow:0!important}.flex-sm-grow-1{flex-grow:1!important}.flex-sm-shrink-0{flex-shrink:0!important}.flex-sm-shrink-1{flex-shrink:1!important}.flex-sm-wrap{flex-wrap:wrap!important}.flex-sm-nowrap{flex-wrap:nowrap!important}.flex-sm-wrap-reverse{flex-wrap:wrap-reverse!important}.justify-content-sm-start{justify-content:flex-start!important}.justify-content-sm-end{justify-content:flex-end!important}.justify-content-sm-center{justify-content:center!important}.justify-content-sm-between{justify-content:space-between!important}.justify-content-sm-around{justify-content:space-around!important}.justify-content-sm-evenly{justify-content:space-evenly!important}.align-items-sm-start{align-items:flex-start!important}.align-items-sm-end{align-items:flex-end!important}.align-items-sm-center{align-items:center!important}.align-items-sm-baseline{align-items:baseline!important}.align-items-sm-stretch{align-items:stretch!important}.align-content-sm-start{align-content:flex-start!important}.align-content-sm-end{align-content:flex-end!important}.align-content-sm-center{align-content:center!important}.align-content-sm-between{align-content:space-between!important}.align-content-sm-around{align-content:space-around!important}.align-content-sm-stretch{align-content:stretch!important}.align-self-sm-auto{align-self:auto!important}.align-self-sm-start{align-self:flex-start!important}.align-self-sm-end{align-self:flex-end!important}.align-self-sm-center{align-self:center!important}.align-self-sm-baseline{align-self:baseline!important}.align-self-sm-stretch{align-self:stretch!important}.order-sm-first{order:-1!important}.order-sm-0{order:0!important}.order-sm-1{order:1!important}.order-sm-2{order:2!important}.order-sm-3{order:3!important}.order-sm-4{order:4!important}.order-sm-5{order:5!important}.order-sm-last{order:6!important}.m-sm-0{margin:0!important}.m-sm-1{margin:.25rem!important}.m-sm-2{margin:.5rem!important}.m-sm-3{margin:1rem!important}.m-sm-4{margin:1.5rem!important}.m-sm-5{margin:3rem!important}.m-sm-auto{margin:auto!important}.mx-sm-0{margin-right:0!important;margin-left:0!important}.mx-sm-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-sm-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-sm-3{margin-right:1rem!important;margin-left:1rem!important}.mx-sm-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-sm-5{margin-right:3rem!important;margin-left:3rem!important}.mx-sm-auto{margin-right:auto!important;margin-left:auto!important}.my-sm-0{margin-top:0!important;margin-bottom:0!important}.my-sm-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-sm-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-sm-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-sm-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-sm-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-sm-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-sm-0{margin-top:0!important}.mt-sm-1{margin-top:.25rem!important}.mt-sm-2{margin-top:.5rem!important}.mt-sm-3{margin-top:1rem!important}.mt-sm-4{margin-top:1.5rem!important}.mt-sm-5{margin-top:3rem!important}.mt-sm-auto{margin-top:auto!important}.me-sm-0{margin-right:0!important}.me-sm-1{margin-right:.25rem!important}.me-sm-2{margin-right:.5rem!important}.me-sm-3{margin-right:1rem!important}.me-sm-4{margin-right:1.5rem!important}.me-sm-5{margin-right:3rem!important}.me-sm-auto{margin-right:auto!important}.mb-sm-0{margin-bottom:0!important}.mb-sm-1{margin-bottom:.25rem!important}.mb-sm-2{margin-bottom:.5rem!important}.mb-sm-3{margin-bottom:1rem!important}.mb-sm-4{margin-bottom:1.5rem!important}.mb-sm-5{margin-bottom:3rem!important}.mb-sm-auto{margin-bottom:auto!important}.ms-sm-0{margin-left:0!important}.ms-sm-1{margin-left:.25rem!important}.ms-sm-2{margin-left:.5rem!important}.ms-sm-3{margin-left:1rem!important}.ms-sm-4{margin-left:1.5rem!important}.ms-sm-5{margin-left:3rem!important}.ms-sm-auto{margin-left:auto!important}.p-sm-0{padding:0!important}.p-sm-1{padding:.25rem!important}.p-sm-2{padding:.5rem!important}.p-sm-3{padding:1rem!important}.p-sm-4{padding:1.5rem!important}.p-sm-5{padding:3rem!important}.px-sm-0{padding-right:0!important;padding-left:0!important}.px-sm-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-sm-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-sm-3{padding-right:1rem!important;padding-left:1rem!important}.px-sm-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-sm-5{padding-right:3rem!important;padding-left:3rem!important}.py-sm-0{padding-top:0!important;padding-bottom:0!important}.py-sm-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-sm-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-sm-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-sm-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-sm-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-sm-0{padding-top:0!important}.pt-sm-1{padding-top:.25rem!important}.pt-sm-2{padding-top:.5rem!important}.pt-sm-3{padding-top:1rem!important}.pt-sm-4{padding-top:1.5rem!important}.pt-sm-5{padding-top:3rem!important}.pe-sm-0{padding-right:0!important}.pe-sm-1{padding-right:.25rem!important}.pe-sm-2{padding-right:.5rem!important}.pe-sm-3{padding-right:1rem!important}.pe-sm-4{padding-right:1.5rem!important}.pe-sm-5{padding-right:3rem!important}.pb-sm-0{padding-bottom:0!important}.pb-sm-1{padding-bottom:.25rem!important}.pb-sm-2{padding-bottom:.5rem!important}.pb-sm-3{padding-bottom:1rem!important}.pb-sm-4{padding-bottom:1.5rem!important}.pb-sm-5{padding-bottom:3rem!important}.ps-sm-0{padding-left:0!important}.ps-sm-1{padding-left:.25rem!important}.ps-sm-2{padding-left:.5rem!important}.ps-sm-3{padding-left:1rem!important}.ps-sm-4{padding-left:1.5rem!important}.ps-sm-5{padding-left:3rem!important}}@media (min-width:768px){.d-md-inline{display:inline!important}.d-md-inline-block{display:inline-block!important}.d-md-block{display:block!important}.d-md-grid{display:grid!important}.d-md-table{display:table!important}.d-md-table-row{display:table-row!important}.d-md-table-cell{display:table-cell!important}.d-md-flex{display:flex!important}.d-md-inline-flex{display:inline-flex!important}.d-md-none{display:none!important}.flex-md-fill{flex:1 1 auto!important}.flex-md-row{flex-direction:row!important}.flex-md-column{flex-direction:column!important}.flex-md-row-reverse{flex-direction:row-reverse!important}.flex-md-column-reverse{flex-direction:column-reverse!important}.flex-md-grow-0{flex-grow:0!important}.flex-md-grow-1{flex-grow:1!important}.flex-md-shrink-0{flex-shrink:0!important}.flex-md-shrink-1{flex-shrink:1!important}.flex-md-wrap{flex-wrap:wrap!important}.flex-md-nowrap{flex-wrap:nowrap!important}.flex-md-wrap-reverse{flex-wrap:wrap-reverse!important}.justify-content-md-start{justify-content:flex-start!important}.justify-content-md-end{justify-content:flex-end!important}.justify-content-md-center{justify-content:center!important}.justify-content-md-between{justify-content:space-between!important}.justify-content-md-around{justify-content:space-around!important}.justify-content-md-evenly{justify-content:space-evenly!important}.align-items-md-start{align-items:flex-start!important}.align-items-md-end{align-items:flex-end!important}.align-items-md-center{align-items:center!important}.align-items-md-baseline{align-items:baseline!important}.align-items-md-stretch{align-items:stretch!important}.align-content-md-start{align-content:flex-start!important}.align-content-md-end{align-content:flex-end!important}.align-content-md-center{align-content:center!important}.align-content-md-between{align-content:space-between!important}.align-content-md-around{align-content:space-around!important}.align-content-md-stretch{align-content:stretch!important}.align-self-md-auto{align-self:auto!important}.align-self-md-start{align-self:flex-start!important}.align-self-md-end{align-self:flex-end!important}.align-self-md-center{align-self:center!important}.align-self-md-baseline{align-self:baseline!important}.align-self-md-stretch{align-self:stretch!important}.order-md-first{order:-1!important}.order-md-0{order:0!important}.order-md-1{order:1!important}.order-md-2{order:2!important}.order-md-3{order:3!important}.order-md-4{order:4!important}.order-md-5{order:5!important}.order-md-last{order:6!important}.m-md-0{margin:0!important}.m-md-1{margin:.25rem!important}.m-md-2{margin:.5rem!important}.m-md-3{margin:1rem!important}.m-md-4{margin:1.5rem!important}.m-md-5{margin:3rem!important}.m-md-auto{margin:auto!important}.mx-md-0{margin-right:0!important;margin-left:0!important}.mx-md-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-md-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-md-3{margin-right:1rem!important;margin-left:1rem!important}.mx-md-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-md-5{margin-right:3rem!important;margin-left:3rem!important}.mx-md-auto{margin-right:auto!important;margin-left:auto!important}.my-md-0{margin-top:0!important;margin-bottom:0!important}.my-md-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-md-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-md-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-md-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-md-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-md-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-md-0{margin-top:0!important}.mt-md-1{margin-top:.25rem!important}.mt-md-2{margin-top:.5rem!important}.mt-md-3{margin-top:1rem!important}.mt-md-4{margin-top:1.5rem!important}.mt-md-5{margin-top:3rem!important}.mt-md-auto{margin-top:auto!important}.me-md-0{margin-right:0!important}.me-md-1{margin-right:.25rem!important}.me-md-2{margin-right:.5rem!important}.me-md-3{margin-right:1rem!important}.me-md-4{margin-right:1.5rem!important}.me-md-5{margin-right:3rem!important}.me-md-auto{margin-right:auto!important}.mb-md-0{margin-bottom:0!important}.mb-md-1{margin-bottom:.25rem!important}.mb-md-2{margin-bottom:.5rem!important}.mb-md-3{margin-bottom:1rem!important}.mb-md-4{margin-bottom:1.5rem!important}.mb-md-5{margin-bottom:3rem!important}.mb-md-auto{margin-bottom:auto!important}.ms-md-0{margin-left:0!important}.ms-md-1{margin-left:.25rem!important}.ms-md-2{margin-left:.5rem!important}.ms-md-3{margin-left:1rem!important}.ms-md-4{margin-left:1.5rem!important}.ms-md-5{margin-left:3rem!important}.ms-md-auto{margin-left:auto!important}.p-md-0{padding:0!important}.p-md-1{padding:.25rem!important}.p-md-2{padding:.5rem!important}.p-md-3{padding:1rem!important}.p-md-4{padding:1.5rem!important}.p-md-5{padding:3rem!important}.px-md-0{padding-right:0!important;padding-left:0!important}.px-md-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-md-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-md-3{padding-right:1rem!important;padding-left:1rem!important}.px-md-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-md-5{padding-right:3rem!important;padding-left:3rem!important}.py-md-0{padding-top:0!important;padding-bottom:0!important}.py-md-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-md-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-md-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-md-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-md-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-md-0{padding-top:0!important}.pt-md-1{padding-top:.25rem!important}.pt-md-2{padding-top:.5rem!important}.pt-md-3{padding-top:1rem!important}.pt-md-4{padding-top:1.5rem!important}.pt-md-5{padding-top:3rem!important}.pe-md-0{padding-right:0!important}.pe-md-1{padding-right:.25rem!important}.pe-md-2{padding-right:.5rem!important}.pe-md-3{padding-right:1rem!important}.pe-md-4{padding-right:1.5rem!important}.pe-md-5{padding-right:3rem!important}.pb-md-0{padding-bottom:0!important}.pb-md-1{padding-bottom:.25rem!important}.pb-md-2{padding-bottom:.5rem!important}.pb-md-3{padding-bottom:1rem!important}.pb-md-4{padding-bottom:1.5rem!important}.pb-md-5{padding-bottom:3rem!important}.ps-md-0{padding-left:0!important}.ps-md-1{padding-left:.25rem!important}.ps-md-2{padding-left:.5rem!important}.ps-md-3{padding-left:1rem!important}.ps-md-4{padding-left:1.5rem!important}.ps-md-5{padding-left:3rem!important}}@media (min-width:992px){.d-lg-inline{display:inline!important}.d-lg-inline-block{display:inline-block!important}.d-lg-block{display:block!important}.d-lg-grid{display:grid!important}.d-lg-table{display:table!important}.d-lg-table-row{display:table-row!important}.d-lg-table-cell{display:table-cell!important}.d-lg-flex{display:flex!important}.d-lg-inline-flex{display:inline-flex!important}.d-lg-none{display:none!important}.flex-lg-fill{flex:1 1 auto!important}.flex-lg-row{flex-direction:row!important}.flex-lg-column{flex-direction:column!important}.flex-lg-row-reverse{flex-direction:row-reverse!important}.flex-lg-column-reverse{flex-direction:column-reverse!important}.flex-lg-grow-0{flex-grow:0!important}.flex-lg-grow-1{flex-grow:1!important}.flex-lg-shrink-0{flex-shrink:0!important}.flex-lg-shrink-1{flex-shrink:1!important}.flex-lg-wrap{flex-wrap:wrap!important}.flex-lg-nowrap{flex-wrap:nowrap!important}.flex-lg-wrap-reverse{flex-wrap:wrap-reverse!important}.justify-content-lg-start{justify-content:flex-start!important}.justify-content-lg-end{justify-content:flex-end!important}.justify-content-lg-center{justify-content:center!important}.justify-content-lg-between{justify-content:space-between!important}.justify-content-lg-around{justify-content:space-around!important}.justify-content-lg-evenly{justify-content:space-evenly!important}.align-items-lg-start{align-items:flex-start!important}.align-items-lg-end{align-items:flex-end!important}.align-items-lg-center{align-items:center!important}.align-items-lg-baseline{align-items:baseline!important}.align-items-lg-stretch{align-items:stretch!important}.align-content-lg-start{align-content:flex-start!important}.align-content-lg-end{align-content:flex-end!important}.align-content-lg-center{align-content:center!important}.align-content-lg-between{align-content:space-between!important}.align-content-lg-around{align-content:space-around!important}.align-content-lg-stretch{align-content:stretch!important}.align-self-lg-auto{align-self:auto!important}.align-self-lg-start{align-self:flex-start!important}.align-self-lg-end{align-self:flex-end!important}.align-self-lg-center{align-self:center!important}.align-self-lg-baseline{align-self:baseline!important}.align-self-lg-stretch{align-self:stretch!important}.order-lg-first{order:-1!important}.order-lg-0{order:0!important}.order-lg-1{order:1!important}.order-lg-2{order:2!important}.order-lg-3{order:3!important}.order-lg-4{order:4!important}.order-lg-5{order:5!important}.order-lg-last{order:6!important}.m-lg-0{margin:0!important}.m-lg-1{margin:.25rem!important}.m-lg-2{margin:.5rem!important}.m-lg-3{margin:1rem!important}.m-lg-4{margin:1.5rem!important}.m-lg-5{margin:3rem!important}.m-lg-auto{margin:auto!important}.mx-lg-0{margin-right:0!important;margin-left:0!important}.mx-lg-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-lg-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-lg-3{margin-right:1rem!important;margin-left:1rem!important}.mx-lg-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-lg-5{margin-right:3rem!important;margin-left:3rem!important}.mx-lg-auto{margin-right:auto!important;margin-left:auto!important}.my-lg-0{margin-top:0!important;margin-bottom:0!important}.my-lg-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-lg-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-lg-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-lg-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-lg-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-lg-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-lg-0{margin-top:0!important}.mt-lg-1{margin-top:.25rem!important}.mt-lg-2{margin-top:.5rem!important}.mt-lg-3{margin-top:1rem!important}.mt-lg-4{margin-top:1.5rem!important}.mt-lg-5{margin-top:3rem!important}.mt-lg-auto{margin-top:auto!important}.me-lg-0{margin-right:0!important}.me-lg-1{margin-right:.25rem!important}.me-lg-2{margin-right:.5rem!important}.me-lg-3{margin-right:1rem!important}.me-lg-4{margin-right:1.5rem!important}.me-lg-5{margin-right:3rem!important}.me-lg-auto{margin-right:auto!important}.mb-lg-0{margin-bottom:0!important}.mb-lg-1{margin-bottom:.25rem!important}.mb-lg-2{margin-bottom:.5rem!important}.mb-lg-3{margin-bottom:1rem!important}.mb-lg-4{margin-bottom:1.5rem!important}.mb-lg-5{margin-bottom:3rem!important}.mb-lg-auto{margin-bottom:auto!important}.ms-lg-0{margin-left:0!important}.ms-lg-1{margin-left:.25rem!important}.ms-lg-2{margin-left:.5rem!important}.ms-lg-3{margin-left:1rem!important}.ms-lg-4{margin-left:1.5rem!important}.ms-lg-5{margin-left:3rem!important}.ms-lg-auto{margin-left:auto!important}.p-lg-0{padding:0!important}.p-lg-1{padding:.25rem!important}.p-lg-2{padding:.5rem!important}.p-lg-3{padding:1rem!important}.p-lg-4{padding:1.5rem!important}.p-lg-5{padding:3rem!important}.px-lg-0{padding-right:0!important;padding-left:0!important}.px-lg-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-lg-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-lg-3{padding-right:1rem!important;padding-left:1rem!important}.px-lg-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-lg-5{padding-right:3rem!important;padding-left:3rem!important}.py-lg-0{padding-top:0!important;padding-bottom:0!important}.py-lg-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-lg-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-lg-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-lg-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-lg-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-lg-0{padding-top:0!important}.pt-lg-1{padding-top:.25rem!important}.pt-lg-2{padding-top:.5rem!important}.pt-lg-3{padding-top:1rem!important}.pt-lg-4{padding-top:1.5rem!important}.pt-lg-5{padding-top:3rem!important}.pe-lg-0{padding-right:0!important}.pe-lg-1{padding-right:.25rem!important}.pe-lg-2{padding-right:.5rem!important}.pe-lg-3{padding-right:1rem!important}.pe-lg-4{padding-right:1.5rem!important}.pe-lg-5{padding-right:3rem!important}.pb-lg-0{padding-bottom:0!important}.pb-lg-1{padding-bottom:.25rem!important}.pb-lg-2{padding-bottom:.5rem!important}.pb-lg-3{padding-bottom:1rem!important}.pb-lg-4{padding-bottom:1.5rem!important}.pb-lg-5{padding-bottom:3rem!important}.ps-lg-0{padding-left:0!important}.ps-lg-1{padding-left:.25rem!important}.ps-lg-2{padding-left:.5rem!important}.ps-lg-3{padding-left:1rem!important}.ps-lg-4{padding-left:1.5rem!important}.ps-lg-5{padding-left:3rem!important}}@media (min-width:1200px){.d-xl-inline{display:inline!important}.d-xl-inline-block{display:inline-block!important}.d-xl-block{display:block!important}.d-xl-grid{display:grid!important}.d-xl-table{display:table!important}.d-xl-table-row{display:table-row!important}.d-xl-table-cell{display:table-cell!important}.d-xl-flex{display:flex!important}.d-xl-inline-flex{display:inline-flex!important}.d-xl-none{display:none!important}.flex-xl-fill{flex:1 1 auto!important}.flex-xl-row{flex-direction:row!important}.flex-xl-column{flex-direction:column!important}.flex-xl-row-reverse{flex-direction:row-reverse!important}.flex-xl-column-reverse{flex-direction:column-reverse!important}.flex-xl-grow-0{flex-grow:0!important}.flex-xl-grow-1{flex-grow:1!important}.flex-xl-shrink-0{flex-shrink:0!important}.flex-xl-shrink-1{flex-shrink:1!important}.flex-xl-wrap{flex-wrap:wrap!important}.flex-xl-nowrap{flex-wrap:nowrap!important}.flex-xl-wrap-reverse{flex-wrap:wrap-reverse!important}.justify-content-xl-start{justify-content:flex-start!important}.justify-content-xl-end{justify-content:flex-end!important}.justify-content-xl-center{justify-content:center!important}.justify-content-xl-between{justify-content:space-between!important}.justify-content-xl-around{justify-content:space-around!important}.justify-content-xl-evenly{justify-content:space-evenly!important}.align-items-xl-start{align-items:flex-start!important}.align-items-xl-end{align-items:flex-end!important}.align-items-xl-center{align-items:center!important}.align-items-xl-baseline{align-items:baseline!important}.align-items-xl-stretch{align-items:stretch!important}.align-content-xl-start{align-content:flex-start!important}.align-content-xl-end{align-content:flex-end!important}.align-content-xl-center{align-content:center!important}.align-content-xl-between{align-content:space-between!important}.align-content-xl-around{align-content:space-around!important}.align-content-xl-stretch{align-content:stretch!important}.align-self-xl-auto{align-self:auto!important}.align-self-xl-start{align-self:flex-start!important}.align-self-xl-end{align-self:flex-end!important}.align-self-xl-center{align-self:center!important}.align-self-xl-baseline{align-self:baseline!important}.align-self-xl-stretch{align-self:stretch!important}.order-xl-first{order:-1!important}.order-xl-0{order:0!important}.order-xl-1{order:1!important}.order-xl-2{order:2!important}.order-xl-3{order:3!important}.order-xl-4{order:4!important}.order-xl-5{order:5!important}.order-xl-last{order:6!important}.m-xl-0{margin:0!important}.m-xl-1{margin:.25rem!important}.m-xl-2{margin:.5rem!important}.m-xl-3{margin:1rem!important}.m-xl-4{margin:1.5rem!important}.m-xl-5{margin:3rem!important}.m-xl-auto{margin:auto!important}.mx-xl-0{margin-right:0!important;margin-left:0!important}.mx-xl-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-xl-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-xl-3{margin-right:1rem!important;margin-left:1rem!important}.mx-xl-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-xl-5{margin-right:3rem!important;margin-left:3rem!important}.mx-xl-auto{margin-right:auto!important;margin-left:auto!important}.my-xl-0{margin-top:0!important;margin-bottom:0!important}.my-xl-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-xl-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-xl-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-xl-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-xl-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-xl-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-xl-0{margin-top:0!important}.mt-xl-1{margin-top:.25rem!important}.mt-xl-2{margin-top:.5rem!important}.mt-xl-3{margin-top:1rem!important}.mt-xl-4{margin-top:1.5rem!important}.mt-xl-5{margin-top:3rem!important}.mt-xl-auto{margin-top:auto!important}.me-xl-0{margin-right:0!important}.me-xl-1{margin-right:.25rem!important}.me-xl-2{margin-right:.5rem!important}.me-xl-3{margin-right:1rem!important}.me-xl-4{margin-right:1.5rem!important}.me-xl-5{margin-right:3rem!important}.me-xl-auto{margin-right:auto!important}.mb-xl-0{margin-bottom:0!important}.mb-xl-1{margin-bottom:.25rem!important}.mb-xl-2{margin-bottom:.5rem!important}.mb-xl-3{margin-bottom:1rem!important}.mb-xl-4{margin-bottom:1.5rem!important}.mb-xl-5{margin-bottom:3rem!important}.mb-xl-auto{margin-bottom:auto!important}.ms-xl-0{margin-left:0!important}.ms-xl-1{margin-left:.25rem!important}.ms-xl-2{margin-left:.5rem!important}.ms-xl-3{margin-left:1rem!important}.ms-xl-4{margin-left:1.5rem!important}.ms-xl-5{margin-left:3rem!important}.ms-xl-auto{margin-left:auto!important}.p-xl-0{padding:0!important}.p-xl-1{padding:.25rem!important}.p-xl-2{padding:.5rem!important}.p-xl-3{padding:1rem!important}.p-xl-4{padding:1.5rem!important}.p-xl-5{padding:3rem!important}.px-xl-0{padding-right:0!important;padding-left:0!important}.px-xl-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-xl-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-xl-3{padding-right:1rem!important;padding-left:1rem!important}.px-xl-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-xl-5{padding-right:3rem!important;padding-left:3rem!important}.py-xl-0{padding-top:0!important;padding-bottom:0!important}.py-xl-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-xl-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-xl-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-xl-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-xl-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-xl-0{padding-top:0!important}.pt-xl-1{padding-top:.25rem!important}.pt-xl-2{padding-top:.5rem!important}.pt-xl-3{padding-top:1rem!important}.pt-xl-4{padding-top:1.5rem!important}.pt-xl-5{padding-top:3rem!important}.pe-xl-0{padding-right:0!important}.pe-xl-1{padding-right:.25rem!important}.pe-xl-2{padding-right:.5rem!important}.pe-xl-3{padding-right:1rem!important}.pe-xl-4{padding-right:1.5rem!important}.pe-xl-5{padding-right:3rem!important}.pb-xl-0{padding-bottom:0!important}.pb-xl-1{padding-bottom:.25rem!important}.pb-xl-2{padding-bottom:.5rem!important}.pb-xl-3{padding-bottom:1rem!important}.pb-xl-4{padding-bottom:1.5rem!important}.pb-xl-5{padding-bottom:3rem!important}.ps-xl-0{padding-left:0!important}.ps-xl-1{padding-left:.25rem!important}.ps-xl-2{padding-left:.5rem!important}.ps-xl-3{padding-left:1rem!important}.ps-xl-4{padding-left:1.5rem!important}.ps-xl-5{padding-left:3rem!important}}@media (min-width:1400px){.d-xxl-inline{display:inline!important}.d-xxl-inline-block{display:inline-block!important}.d-xxl-block{display:block!important}.d-xxl-grid{display:grid!important}.d-xxl-table{display:table!important}.d-xxl-table-row{display:table-row!important}.d-xxl-table-cell{display:table-cell!important}.d-xxl-flex{display:flex!important}.d-xxl-inline-flex{display:inline-flex!important}.d-xxl-none{display:none!important}.flex-xxl-fill{flex:1 1 auto!important}.flex-xxl-row{flex-direction:row!important}.flex-xxl-column{flex-direction:column!important}.flex-xxl-row-reverse{flex-direction:row-reverse!important}.flex-xxl-column-reverse{flex-direction:column-reverse!important}.flex-xxl-grow-0{flex-grow:0!important}.flex-xxl-grow-1{flex-grow:1!important}.flex-xxl-shrink-0{flex-shrink:0!important}.flex-xxl-shrink-1{flex-shrink:1!important}.flex-xxl-wrap{flex-wrap:wrap!important}.flex-xxl-nowrap{flex-wrap:nowrap!important}.flex-xxl-wrap-reverse{flex-wrap:wrap-reverse!important}.justify-content-xxl-start{justify-content:flex-start!important}.justify-content-xxl-end{justify-content:flex-end!important}.justify-content-xxl-center{justify-content:center!important}.justify-content-xxl-between{justify-content:space-between!important}.justify-content-xxl-around{justify-content:space-around!important}.justify-content-xxl-evenly{justify-content:space-evenly!important}.align-items-xxl-start{align-items:flex-start!important}.align-items-xxl-end{align-items:flex-end!important}.align-items-xxl-center{align-items:center!important}.align-items-xxl-baseline{align-items:baseline!important}.align-items-xxl-stretch{align-items:stretch!important}.align-content-xxl-start{align-content:flex-start!important}.align-content-xxl-end{align-content:flex-end!important}.align-content-xxl-center{align-content:center!important}.align-content-xxl-between{align-content:space-between!important}.align-content-xxl-around{align-content:space-around!important}.align-content-xxl-stretch{align-content:stretch!important}.align-self-xxl-auto{align-self:auto!important}.align-self-xxl-start{align-self:flex-start!important}.align-self-xxl-end{align-self:flex-end!important}.align-self-xxl-center{align-self:center!important}.align-self-xxl-baseline{align-self:baseline!important}.align-self-xxl-stretch{align-self:stretch!important}.order-xxl-first{order:-1!important}.order-xxl-0{order:0!important}.order-xxl-1{order:1!important}.order-xxl-2{order:2!important}.order-xxl-3{order:3!important}.order-xxl-4{order:4!important}.order-xxl-5{order:5!important}.order-xxl-last{order:6!important}.m-xxl-0{margin:0!important}.m-xxl-1{margin:.25rem!important}.m-xxl-2{margin:.5rem!important}.m-xxl-3{margin:1rem!important}.m-xxl-4{margin:1.5rem!important}.m-xxl-5{margin:3rem!important}.m-xxl-auto{margin:auto!important}.mx-xxl-0{margin-right:0!important;margin-left:0!important}.mx-xxl-1{margin-right:.25rem!important;margin-left:.25rem!important}.mx-xxl-2{margin-right:.5rem!important;margin-left:.5rem!important}.mx-xxl-3{margin-right:1rem!important;margin-left:1rem!important}.mx-xxl-4{margin-right:1.5rem!important;margin-left:1.5rem!important}.mx-xxl-5{margin-right:3rem!important;margin-left:3rem!important}.mx-xxl-auto{margin-right:auto!important;margin-left:auto!important}.my-xxl-0{margin-top:0!important;margin-bottom:0!important}.my-xxl-1{margin-top:.25rem!important;margin-bottom:.25rem!important}.my-xxl-2{margin-top:.5rem!important;margin-bottom:.5rem!important}.my-xxl-3{margin-top:1rem!important;margin-bottom:1rem!important}.my-xxl-4{margin-top:1.5rem!important;margin-bottom:1.5rem!important}.my-xxl-5{margin-top:3rem!important;margin-bottom:3rem!important}.my-xxl-auto{margin-top:auto!important;margin-bottom:auto!important}.mt-xxl-0{margin-top:0!important}.mt-xxl-1{margin-top:.25rem!important}.mt-xxl-2{margin-top:.5rem!important}.mt-xxl-3{margin-top:1rem!important}.mt-xxl-4{margin-top:1.5rem!important}.mt-xxl-5{margin-top:3rem!important}.mt-xxl-auto{margin-top:auto!important}.me-xxl-0{margin-right:0!important}.me-xxl-1{margin-right:.25rem!important}.me-xxl-2{margin-right:.5rem!important}.me-xxl-3{margin-right:1rem!important}.me-xxl-4{margin-right:1.5rem!important}.me-xxl-5{margin-right:3rem!important}.me-xxl-auto{margin-right:auto!important}.mb-xxl-0{margin-bottom:0!important}.mb-xxl-1{margin-bottom:.25rem!important}.mb-xxl-2{margin-bottom:.5rem!important}.mb-xxl-3{margin-bottom:1rem!important}.mb-xxl-4{margin-bottom:1.5rem!important}.mb-xxl-5{margin-bottom:3rem!important}.mb-xxl-auto{margin-bottom:auto!important}.ms-xxl-0{margin-left:0!important}.ms-xxl-1{margin-left:.25rem!important}.ms-xxl-2{margin-left:.5rem!important}.ms-xxl-3{margin-left:1rem!important}.ms-xxl-4{margin-left:1.5rem!important}.ms-xxl-5{margin-left:3rem!important}.ms-xxl-auto{margin-left:auto!important}.p-xxl-0{padding:0!important}.p-xxl-1{padding:.25rem!important}.p-xxl-2{padding:.5rem!important}.p-xxl-3{padding:1rem!important}.p-xxl-4{padding:1.5rem!important}.p-xxl-5{padding:3rem!important}.px-xxl-0{padding-right:0!important;padding-left:0!important}.px-xxl-1{padding-right:.25rem!important;padding-left:.25rem!important}.px-xxl-2{padding-right:.5rem!important;padding-left:.5rem!important}.px-xxl-3{padding-right:1rem!important;padding-left:1rem!important}.px-xxl-4{padding-right:1.5rem!important;padding-left:1.5rem!important}.px-xxl-5{padding-right:3rem!important;padding-left:3rem!important}.py-xxl-0{padding-top:0!important;padding-bottom:0!important}.py-xxl-1{padding-top:.25rem!important;padding-bottom:.25rem!important}.py-xxl-2{padding-top:.5rem!important;padding-bottom:.5rem!important}.py-xxl-3{padding-top:1rem!important;padding-bottom:1rem!important}.py-xxl-4{padding-top:1.5rem!important;padding-bottom:1.5rem!important}.py-xxl-5{padding-top:3rem!important;padding-bottom:3rem!important}.pt-xxl-0{padding-top:0!important}.pt-xxl-1{padding-top:.25rem!important}.pt-xxl-2{padding-top:.5rem!important}.pt-xxl-3{padding-top:1rem!important}.pt-xxl-4{padding-top:1.5rem!important}.pt-xxl-5{padding-top:3rem!important}.pe-xxl-0{padding-right:0!important}.pe-xxl-1{padding-right:.25rem!important}.pe-xxl-2{padding-right:.5rem!important}.pe-xxl-3{padding-right:1rem!important}.pe-xxl-4{padding-right:1.5rem!important}.pe-xxl-5{padding-right:3rem!important}.pb-xxl-0{padding-bottom:0!important}.pb-xxl-1{padding-bottom:.25rem!important}.pb-xxl-2{padding-bottom:.5rem!important}.pb-xxl-3{padding-bottom:1rem!important}.pb-xxl-4{padding-bottom:1.5rem!important}.pb-xxl-5{padding-bottom:3rem!important}.ps-xxl-0{padding-left:0!important}.ps-xxl-1{padding-left:.25rem!important}.ps-xxl-2{padding-left:.5rem!important}.ps-xxl-3{padding-left:1rem!important}.ps-xxl-4{padding-left:1.5rem!important}.ps-xxl-5{padding-left:3rem!important}}@media print{.d-print-inline{display:inline!important}.d-print-inline-block{display:inline-block!important}.d-print-block{display:block!important}.d-print-grid{display:grid!important}.d-print-table{display:table!important}.d-print-table-row{display:table-row!important}.d-print-table-cell{display:table-cell!important}.d-print-flex{display:flex!important}.d-print-inline-flex{display:inline-flex!important}.d-print-none{display:none!important}}.glightbox-container{width:100%;height:100%;position:fixed;top:0;left:0;z-index:999999!important;touch-action:none;text-size-adjust:100%;-webkit-backface-visibility:hidden;backface-visibility:hidden;outline:0;overflow:hidden}.glightbox-container.inactive{display:none}.glightbox-container .gcontainer{position:relative;width:100%;height:100%;z-index:9999;overflow:hidden}.glightbox-container .gslider{transition:transform .4s ease;height:100%;left:0;top:0;position:relative;overflow:hidden;display:flex!important;transform:translateZ(0)}.glightbox-container .gslide,.glightbox-container .gslider{width:100%;justify-content:center;align-items:center}.glightbox-container .gslide{position:absolute;opacity:1;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:flex;opacity:0}.glightbox-container .gslide.current{opacity:1;z-index:99999;position:relative}.glightbox-container .gslide.prev{opacity:1;z-index:9999}.glightbox-container .gslide-inner-content{width:100%}.glightbox-container .ginner-container{position:relative;width:100%;display:flex;justify-content:center;flex-direction:column;max-width:100%;margin:auto;height:100vh}.glightbox-container .ginner-container.gvideo-container{width:100%}.glightbox-container .ginner-container.desc-bottom,.glightbox-container .ginner-container.desc-top{flex-direction:column}.glightbox-container .ginner-container.desc-left,.glightbox-container .ginner-container.desc-right{max-width:100%!important}.gslide iframe,.gslide video{outline:0!important;border:none;min-height:165px;-webkit-overflow-scrolling:touch;touch-action:auto}.gslide-image{align-items:center}.gslide-image img{max-height:100vh;display:block;padding:0;float:none;outline:0;border:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;max-width:100vw;width:auto;height:auto;object-fit:cover;touch-action:none;margin:auto;min-width:200px}.desc-bottom .gslide-image img,.desc-top .gslide-image img{width:auto}.desc-left .gslide-image img,.desc-right .gslide-image img{width:auto;max-width:100%}.gslide-image img.zoomable{position:relative}.gslide-image img.dragging{cursor:-webkit-grabbing!important;cursor:grabbing!important;transition:none}.gslide-video{position:relative;max-width:100vh;width:100%!important}.gslide-video .gvideo-wrapper{width:100%;margin:auto}.gslide-video:before{content:"";display:block;position:absolute;width:100%;height:100%;background:rgba(255,0,0,.34);display:none}.gslide-video.playing:before{display:none}.gslide-video.fullscreen{max-width:100%!important;min-width:100%;height:75vh}.gslide-video.fullscreen video{max-width:100%!important;width:100%!important}.gslide-inline{background:#fff;text-align:left;max-height:calc(100vh - 40px);overflow:auto;max-width:100%}.gslide-inline .ginlined-content{padding:20px;width:100%}.gslide-inline .dragging{cursor:-webkit-grabbing!important;cursor:grabbing!important;transition:none}.ginlined-content{overflow:auto;display:block!important;opacity:1}.gslide-external{width:100%;min-width:100%;background:#fff;padding:0;overflow:auto;max-height:75vh;height:100%}.gslide-external,.gslide-media{display:flex}.gslide-media{width:auto}.zoomed .gslide-media{box-shadow:none!important}.desc-bottom .gslide-media,.desc-top .gslide-media{margin:0 auto;flex-direction:column}.gslide-description{position:relative;flex:1 0 100%}.gslide-description.description-left,.gslide-description.description-right{max-width:100%}.gslide-description.description-bottom,.gslide-description.description-top{margin:0 auto;width:100%}.gslide-description p{margin-bottom:12px}.gslide-description p:last-child{margin-bottom:0}.glightbox-button-hidden,.zoomed .gslide-description{display:none}.glightbox-mobile .glightbox-container .gslide-description{height:auto!important;width:100%;background:0 0;position:absolute;bottom:15px;max-width:100vw!important;order:2!important;max-height:78vh;overflow:auto!important;background:linear-gradient(180deg,transparent 0,rgba(0,0,0,.75));transition:opacity .3s linear;padding:19px 11px 50px}.glightbox-mobile .glightbox-container .gslide-title{color:#fff;font-size:1em}.glightbox-mobile .glightbox-container .gslide-desc{color:#a1a1a1}.glightbox-mobile .glightbox-container .gslide-desc a{color:#fff;font-weight:700}.glightbox-mobile .glightbox-container .gslide-desc *{color:inherit}.glightbox-mobile .glightbox-container .gslide-desc string{color:#fff}.glightbox-mobile .glightbox-container .gslide-desc .desc-more{color:#fff;opacity:.4}.gdesc-open .gslide-media{transition:opacity .5s ease;opacity:.4}.gdesc-open .gdesc-inner{padding-bottom:30px}.gdesc-closed .gslide-media{transition:opacity .5s ease;opacity:1}.greset{transition:all .3s ease}.gabsolute{position:absolute}.grelative{position:relative}.glightbox-desc{display:none!important}.glightbox-open{overflow:hidden}.gloader{height:25px;width:25px;animation:lightboxLoader .8s linear infinite;border:2px solid #fff;border-right-color:transparent;border-radius:50%;position:absolute;display:block;z-index:9999;left:0;right:0;margin:0 auto;top:47%}.goverlay{width:100%;height:calc(100vh + 1px);position:fixed;top:-1px;left:0;will-change:opacity}.glightbox-mobile .goverlay,.goverlay{background:#000}.gclose,.gnext,.gprev{z-index:99999;cursor:pointer;width:26px;height:44px;border:none;display:flex;justify-content:center;align-items:center;flex-direction:column}.gclose svg,.gnext svg,.gprev svg{display:block;width:25px;height:auto;margin:0;padding:0}.gclose.disabled,.gnext.disabled,.gprev.disabled{opacity:.1}.gclose .garrow,.gnext .garrow,.gprev .garrow{stroke:#fff}iframe.wait-autoplay{opacity:0}.glightbox-closing .gclose,.glightbox-closing .gnext,.glightbox-closing .gprev{opacity:0!important}.glightbox-clean .gslide-description{background:#fff}.glightbox-clean .gdesc-inner{padding:22px 20px}.glightbox-clean .gslide-title{font-size:1em;font-weight:400;font-family:arial;color:#000;margin-bottom:19px;line-height:1.4em}.glightbox-clean .gslide-desc{font-size:.86em;margin-bottom:0;font-family:arial;line-height:1.4em}.glightbox-clean .gslide-video{background:#000}.glightbox-clean .gclose,.glightbox-clean .gnext,.glightbox-clean .gprev{background-color:rgba(0,0,0,.75);border-radius:4px}.glightbox-clean .gclose path,.glightbox-clean .gnext path,.glightbox-clean .gprev path{fill:#fff}.glightbox-clean button:focus:not(.focused):not(.disabled){outline:0}.glightbox-clean .gprev{left:30px}.glightbox-clean .gnext,.glightbox-clean .gprev{position:absolute;top:-100%;width:40px;height:50px}.glightbox-clean .gnext{right:30px}.glightbox-clean .gclose{width:35px;height:35px;top:15px;right:10px;position:absolute}.glightbox-clean .gclose svg{width:18px;height:auto}.glightbox-clean .gclose:hover{opacity:1}.gfadeIn{animation:gfadeIn .5s ease}.gfadeOut{animation:gfadeOut .5s ease}.gslideOutLeft{animation:gslideOutLeft .3s ease}.gslideInLeft{animation:gslideInLeft .3s ease}.gslideOutRight{animation:gslideOutRight .3s ease}.gslideInRight{animation:gslideInRight .3s ease}.gzoomIn{animation:gzoomIn .5s ease}.gzoomOut{animation:gzoomOut .5s ease}@keyframes lightboxLoader{0%{transform:rotate(0)}to{transform:rotate(1turn)}}@keyframes gfadeIn{0%{opacity:0}to{opacity:1}}@keyframes gfadeOut{0%{opacity:1}to{opacity:0}}@keyframes gslideInLeft{0%{opacity:0;transform:translate3d(-60%,0,0)}to{visibility:visible;transform:translateZ(0);opacity:1}}@keyframes gslideOutLeft{0%{opacity:1;visibility:visible;transform:translateZ(0)}to{transform:translate3d(-60%,0,0);opacity:0;visibility:hidden}}@keyframes gslideInRight{0%{opacity:0;visibility:visible;transform:translate3d(60%,0,0)}to{transform:translateZ(0);opacity:1}}@keyframes gslideOutRight{0%{opacity:1;visibility:visible;transform:translateZ(0)}to{transform:translate3d(60%,0,0);opacity:0}}@keyframes gzoomIn{0%{opacity:0;transform:scale3d(.3,.3,.3)}to{opacity:1}}@keyframes gzoomOut{0%{opacity:1}50%{opacity:0;transform:scale3d(.3,.3,.3)}to{opacity:0}}@media (min-width:769px){.glightbox-container .ginner-container{width:auto;height:auto;flex-direction:row}.glightbox-container .ginner-container.desc-top .gslide-description{order:0}.glightbox-container .ginner-container.desc-top .gslide-image,.glightbox-container .ginner-container.desc-top .gslide-image img{order:1}.glightbox-container .ginner-container.desc-left .gslide-description{order:0}.glightbox-container .ginner-container.desc-left .gslide-image{order:1}.gslide-image img{max-height:97vh;max-width:100%}.gslide-image img.zoomable{cursor:zoom-in}.zoomed .gslide-image img.zoomable{cursor:-webkit-grab;cursor:grab}.gslide-inline{max-height:95vh}.gslide-external{max-height:100vh}.gslide-description.description-left,.gslide-description.description-right{max-width:275px}.glightbox-open{height:auto}.goverlay{background:rgba(0,0,0,.92)}.glightbox-clean .gslide-media{box-shadow:1px 2px 9px 0 rgba(0,0,0,.65)}.glightbox-clean .description-left .gdesc-inner,.glightbox-clean .description-right .gdesc-inner{position:absolute;height:100%;overflow-y:auto}.glightbox-clean .gclose,.glightbox-clean .gnext,.glightbox-clean .gprev{background-color:rgba(0,0,0,.32)}.glightbox-clean .gclose:hover,.glightbox-clean .gnext:hover,.glightbox-clean .gprev:hover{background-color:rgba(0,0,0,.7)}.glightbox-clean .gnext,.glightbox-clean .gprev{top:45%}}@media (min-width:992px){.glightbox-clean .gclose{opacity:.7;right:20px}}@media screen and (max-height:420px){.goverlay{background:#000}}@font-face{font-family:icomoon;src:url(/fonts/icomoon.eot?ibiouq);src:url(/fonts/icomoon.eot?ibiouq#iefix) format("embedded-opentype"),url(/fonts/icomoon.ttf?ibiouq) format("truetype"),url(/fonts/icomoon.woff?ibiouq) format("woff"),url(/fonts/icomoon.svg?ibiouq#icomoon) format("svg");font-weight:400;font-style:normal;font-display:block}[class*=" icon-"],[class^=icon-]{font-family:icomoon!important;speak:never;font-style:normal;font-weight:400;font-feature-settings:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.icon-menu-2:before{content:"\e95e"}.icon-play:before{content:"\e95d"}.icon-trash:before{content:"\e95b"}.icon-day-night:before{content:"\e95c"}.icon-share:before{content:"\e951"}.icon-clock:before{content:"\e952"}.icon-customer:before{content:"\e953"}.icon-route:before{content:"\e954"}.icon-access-denied:before{content:"\e955"}.icon-compass:before{content:"\e956"}.icon-calendar-2:before{content:"\e957"}.icon-placeholder:before{content:"\e958"}.icon-group:before{content:"\e959"}.icon-calendar:before{content:"\e95a"}.icon-location-pin:before{content:"\e946"}.icon-nearby:before{content:"\e947"}.icon-plans:before{content:"\e948"}.icon-price-label:before{content:"\e949"}.icon-ticket:before{content:"\e94a"}.icon-food:before{content:"\e94d"}.icon-dislike:before{content:"\e94e"}.icon-like:before{content:"\e94f"}.icon-airplane:before{content:"\e950"}.icon-living-room:before{content:"\e945"}.icon-location-2:before{content:"\e941"}.icon-pedestrian:before{content:"\e942"}.icon-award:before{content:"\e943"}.icon-location:before{content:"\e944"}.icon-up-down:before{content:"\e940"}.icon-newsletter:before{content:"\e93f"}.icon-close:before{content:"\e93e"}.icon-kitchen:before{content:"\e939"}.icon-man:before{content:"\e93a"}.icon-no-smoke:before{content:"\e93b"}.icon-parking:before{content:"\e93c"}.icon-wifi:before{content:"\e93d"}.icon-city-2:before{content:"\e931"}.icon-tv:before{content:"\e932"}.icon-washing-machine:before{content:"\e933"}.icon-juice:before{content:"\e934"}.icon-shield:before{content:"\e935"}.icon-bell-ring:before{content:"\e936"}.icon-bathtub:before{content:"\e937"}.icon-check:before{content:"\e938"}.icon-arrow-right:before{content:"\e930"}.icon-edit:before{content:"\e92c"}.icon-eye:before{content:"\e92d"}.icon-trash-2:before{content:"\e92e"}.icon-upload-file:before{content:"\e92f"}.icon-email-2:before{content:"\e94b"}.icon-notification:before{content:"\e94c"}.icon-arrow-left:before{content:"\e92b"}.icon-arrow-sm-left:before{content:"\e929"}.icon-arrow-sm-right:before{content:"\e92a"}.icon-fire:before{content:"\e900"}.icon-globe:before{content:"\e901"}.icon-heart:before{content:"\e902"}.icon-hiking:before{content:"\e903"}.icon-hiking-2:before{content:"\e904"}.icon-home:before{content:"\e905"}.icon-instagram:before{content:"\e906"}.icon-jeep:before{content:"\e907"}.icon-linkedin:before{content:"\e908"}.icon-luggage:before{content:"\e909"}.icon-menu:before{content:"\e90a"}.icon-museum:before{content:"\e90b"}.icon-nature:before{content:"\e90c"}.icon-play-market:before{content:"\e90d"}.icon-search:before{content:"\e90e"}.icon-ski:before{content:"\e90f"}.icon-speedometer:before{content:"\e910"}.icon-star:before{content:"\e911"}.icon-tickets:before{content:"\e912"}.icon-transmission:before{content:"\e913"}.icon-traveller:before{content:"\e914"}.icon-twitter:before{content:"\e915"}.icon-usd:before{content:"\e916"}.icon-user:before{content:"\e917"}.icon-user-2:before{content:"\e918"}.icon-yatch:before{content:"\e919"}.icon-minus:before{content:"\e91a"}.icon-plus:before{content:"\e91b"}.icon-apple:before{content:"\e91c"}.icon-chevron-sm-down:before{content:"\e91d"}.icon-arrow-top-right:before{content:"\e91e"}.icon-beach-umbrella:before{content:"\e91f"}.icon-bed:before{content:"\e920"}.icon-camping:before{content:"\e921"}.icon-car:before{content:"\e922"}.icon-chevron-left:before{content:"\e923"}.icon-chevron-right:before{content:"\e924"}.icon-city:before{content:"\e925"}.icon-destination:before{content:"\e926"}.icon-email:before{content:"\e927"}.icon-facebook:before{content:"\e928"}.noUi-target,.noUi-target *{-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;touch-action:none;-moz-user-select:none;user-select:none;box-sizing:border-box}.noUi-target{position:relative}.noUi-base,.noUi-connects{width:100%;height:100%;position:relative;z-index:1}.noUi-connects{overflow:hidden;z-index:0}.noUi-connect,.noUi-origin{will-change:transform;position:absolute;z-index:1;top:0;right:0;height:100%;width:100%;-ms-transform-origin:0 0;-webkit-transform-origin:0 0;-webkit-transform-style:preserve-3d;transform-origin:0 0;transform-style:flat}.noUi-txt-dir-rtl.noUi-horizontal .noUi-origin{left:0;right:auto}.noUi-vertical .noUi-origin{top:-100%;width:0}.noUi-horizontal .noUi-origin{height:0}.noUi-handle{-webkit-backface-visibility:hidden;backface-visibility:hidden;position:absolute}.noUi-touch-area{height:100%;width:100%}.noUi-state-tap .noUi-connect,.noUi-state-tap .noUi-origin{transition:transform .3s}.noUi-state-drag *{cursor:inherit!important}.noUi-horizontal{height:18px}.noUi-horizontal .noUi-handle{width:34px;height:28px;right:-17px;top:-6px}.noUi-vertical{width:18px}.noUi-vertical .noUi-handle{width:28px;height:34px;right:-6px;bottom:-17px}.noUi-txt-dir-rtl.noUi-horizontal .noUi-handle{left:-17px;right:auto}.noUi-target{background:#fafafa;border-radius:4px;border:1px solid #d3d3d3;box-shadow:inset 0 1px 1px #f0f0f0,0 3px 6px -5px #bbb}.noUi-connects{border-radius:3px}.noUi-connect{background:#3fb8af}.noUi-draggable{cursor:ew-resize}.noUi-vertical .noUi-draggable{cursor:ns-resize}.noUi-handle{border:1px solid #d9d9d9;border-radius:3px;background:#fff;cursor:default;box-shadow:inset 0 0 1px #fff,inset 0 1px 7px #ebebeb,0 3px 6px -3px #bbb}.noUi-active{box-shadow:inset 0 0 1px #fff,inset 0 1px 7px #ddd,0 3px 6px -3px #bbb}.noUi-handle:after,.noUi-handle:before{content:"";display:block;position:absolute;height:14px;width:1px;background:#e8e7e6;left:14px;top:6px}.noUi-handle:after{left:17px}.noUi-vertical .noUi-handle:after,.noUi-vertical .noUi-handle:before{width:14px;height:1px;left:6px;top:14px}.noUi-vertical .noUi-handle:after{top:17px}[disabled] .noUi-connect{background:#b8b8b8}[disabled].noUi-handle,[disabled] .noUi-handle,[disabled].noUi-target{cursor:not-allowed}.noUi-pips,.noUi-pips *{box-sizing:border-box}.noUi-pips{position:absolute;color:#999}.noUi-value{position:absolute;white-space:nowrap;text-align:center}.noUi-value-sub{color:#ccc;font-size:10px}.noUi-marker{position:absolute;background:#ccc}.noUi-marker-large,.noUi-marker-sub{background:#aaa}.noUi-pips-horizontal{padding:10px 0;height:80px;top:100%;left:0;width:100%}.noUi-value-horizontal{transform:translate(-50%,50%)}.noUi-rtl .noUi-value-horizontal{transform:translate(50%,50%)}.noUi-marker-horizontal.noUi-marker{margin-left:-1px;width:2px;height:5px}.noUi-marker-horizontal.noUi-marker-sub{height:10px}.noUi-marker-horizontal.noUi-marker-large{height:15px}.noUi-pips-vertical{padding:0 10px;height:100%;top:0;left:100%}.noUi-value-vertical{transform:translateY(-50%);padding-left:25px}.noUi-rtl .noUi-value-vertical{transform:translateY(50%)}.noUi-marker-vertical.noUi-marker{width:5px;height:2px;margin-top:-1px}.noUi-marker-vertical.noUi-marker-sub{width:10px}.noUi-marker-vertical.noUi-marker-large{width:15px}.noUi-tooltip{display:block;position:absolute;border:1px solid #d9d9d9;border-radius:3px;background:#fff;color:#000;padding:5px;text-align:center;white-space:nowrap}.noUi-horizontal .noUi-tooltip{transform:translate(-50%);left:50%;bottom:120%}.noUi-vertical .noUi-tooltip{transform:translateY(-50%);top:50%;right:120%}.noUi-horizontal .noUi-origin>.noUi-tooltip{transform:translate(50%);left:auto;bottom:10px}.noUi-vertical .noUi-origin>.noUi-tooltip{transform:translateY(-18px);top:auto;right:28px}.swiper-container{margin:0 auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1}.swiper-container-no-flexbox .swiper-slide{float:left}.swiper-container-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;box-sizing:content-box}.swiper-container-android .swiper-slide,.swiper-wrapper{transform:translateZ(0)}.swiper-container-multirow>.swiper-wrapper{flex-wrap:wrap}.swiper-container-free-mode>.swiper-wrapper{transition-timing-function:ease-out;margin:0 auto}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform}.swiper-slide-invisible-blank{visibility:hidden}.swiper-container-autoheight,.swiper-container-autoheight .swiper-slide{height:auto}.swiper-container-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-container-3d{perspective:1200px}.swiper-container-3d .swiper-cube-shadow,.swiper-container-3d .swiper-slide,.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-container-3d .swiper-slide-shadow-left{background-image:linear-gradient(270deg,rgba(0,0,0,.5),transparent)}.swiper-container-3d .swiper-slide-shadow-right{background-image:linear-gradient(90deg,rgba(0,0,0,.5),transparent)}.swiper-container-3d .swiper-slide-shadow-top{background-image:linear-gradient(0deg,rgba(0,0,0,.5),transparent)}.swiper-container-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(180deg,rgba(0,0,0,.5),transparent)}.swiper-container-wp8-horizontal,.swiper-container-wp8-horizontal>.swiper-wrapper{touch-action:pan-y}.swiper-container-wp8-vertical,.swiper-container-wp8-vertical>.swiper-wrapper{touch-action:pan-x}.swiper-button-next,.swiper-button-prev{position:absolute;top:50%;width:27px;height:44px;margin-top:-22px;z-index:10;cursor:pointer;background-size:27px 44px;background-position:50%;background-repeat:no-repeat}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-prev,.swiper-container-rtl .swiper-button-next{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M0 22L22 0l2.1 2.1L4.2 22l19.9 19.9L22 44 0 22z' fill='%23007aff'/%3E%3C/svg%3E");left:10px;right:auto}.swiper-button-next,.swiper-container-rtl .swiper-button-prev{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M27 22L5 44l-2.1-2.1L22.8 22 2.9 2.1 5 0l22 22z' fill='%23007aff'/%3E%3C/svg%3E");right:10px;left:auto}.swiper-button-prev.swiper-button-white,.swiper-container-rtl .swiper-button-next.swiper-button-white{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M0 22L22 0l2.1 2.1L4.2 22l19.9 19.9L22 44 0 22z' fill='%23fff'/%3E%3C/svg%3E")}.swiper-button-next.swiper-button-white,.swiper-container-rtl .swiper-button-prev.swiper-button-white{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M27 22L5 44l-2.1-2.1L22.8 22 2.9 2.1 5 0l22 22z' fill='%23fff'/%3E%3C/svg%3E")}.swiper-button-prev.swiper-button-black,.swiper-container-rtl .swiper-button-next.swiper-button-black{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M0 22L22 0l2.1 2.1L4.2 22l19.9 19.9L22 44 0 22z'/%3E%3C/svg%3E")}.swiper-button-next.swiper-button-black,.swiper-container-rtl .swiper-button-prev.swiper-button-black{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M27 22L5 44l-2.1-2.1L22.8 22 2.9 2.1 5 0l22 22z'/%3E%3C/svg%3E")}.swiper-button-lock{display:none}.swiper-pagination{position:absolute;text-align:center;transition:opacity .3s;transform:translateZ(0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-container-horizontal>.swiper-pagination-bullets,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:10px;left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active,.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(.33)}.swiper-pagination-bullet{width:8px;height:8px;display:inline-block;border-radius:100%;background:#000;opacity:.2}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet-active{opacity:1;background:#007aff}.swiper-container-vertical>.swiper-pagination-bullets{right:10px;top:50%;transform:translate3d(0,-50%,0)}.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:6px 0;display:block}.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px}.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:transform .2s,top .2s}.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 4px}.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;transform:translateX(-50%);white-space:nowrap}.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:transform .2s,left .2s}.swiper-container-horizontal.swiper-container-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:transform .2s,right .2s}.swiper-pagination-progressbar{background:rgba(0,0,0,.25);position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:#007aff;position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top}.swiper-container-horizontal>.swiper-pagination-progressbar,.swiper-container-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:4px;left:0;top:0}.swiper-container-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-container-vertical>.swiper-pagination-progressbar{width:4px;height:100%;left:0;top:0}.swiper-pagination-white .swiper-pagination-bullet-active{background:#fff}.swiper-pagination-progressbar.swiper-pagination-white{background:hsla(0,0%,100%,.25)}.swiper-pagination-progressbar.swiper-pagination-white .swiper-pagination-progressbar-fill{background:#fff}.swiper-pagination-black .swiper-pagination-bullet-active{background:#000}.swiper-pagination-progressbar.swiper-pagination-black{background:rgba(0,0,0,.25)}.swiper-pagination-progressbar.swiper-pagination-black .swiper-pagination-progressbar-fill{background:#000}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:10px;position:relative;-ms-touch-action:none;background:rgba(0,0,0,.1)}.swiper-container-horizontal>.swiper-scrollbar{position:absolute;left:1%;bottom:3px;z-index:50;height:5px;width:98%}.swiper-container-vertical>.swiper-scrollbar{position:absolute;right:3px;top:1%;z-index:50;width:5px;height:98%}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:rgba(0,0,0,.5);border-radius:10px;left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;text-align:center}.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-width:100%;max-height:100%;object-fit:contain}.swiper-slide-zoomed{cursor:move}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;animation:swiper-preloader-spin 1s steps(12) infinite}.swiper-lazy-preloader:after{display:block;content:"";width:100%;height:100%;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpath id='a' stroke='%236c6c6c' stroke-width='11' stroke-linecap='round' d='M60 7v20'/%3E%3C/defs%3E%3Cuse xlink:href='%23a' opacity='.27'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(30 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(60 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(90 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(120 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(150 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.37' transform='rotate(180 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.46' transform='rotate(210 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.56' transform='rotate(240 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.66' transform='rotate(270 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.75' transform='rotate(300 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.85' transform='rotate(330 60 60)'/%3E%3C/svg%3E");background-position:50%;background-size:100%;background-repeat:no-repeat}.swiper-lazy-preloader-white:after{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpath id='a' stroke='%23fff' stroke-width='11' stroke-linecap='round' d='M60 7v20'/%3E%3C/defs%3E%3Cuse xlink:href='%23a' opacity='.27'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(30 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(60 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(90 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(120 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(150 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.37' transform='rotate(180 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.46' transform='rotate(210 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.56' transform='rotate(240 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.66' transform='rotate(270 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.75' transform='rotate(300 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.85' transform='rotate(330 60 60)'/%3E%3C/svg%3E")}@keyframes swiper-preloader-spin{to{transform:rotate(1turn)}}.swiper-container .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-container-fade.swiper-container-free-mode .swiper-slide{transition-timing-function:ease-out}.swiper-container-fade .swiper-slide{pointer-events:none;transition-property:opacity}.swiper-container-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-fade .swiper-slide-active,.swiper-container-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube{overflow:visible}.swiper-container-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;transform-origin:0 0;width:100%;height:100%}.swiper-container-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-cube.swiper-container-rtl .swiper-slide{transform-origin:100% 0}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-next,.swiper-container-cube .swiper-slide-next+.swiper-slide,.swiper-container-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-container-cube .swiper-slide-shadow-bottom,.swiper-container-cube .swiper-slide-shadow-left,.swiper-container-cube .swiper-slide-shadow-right,.swiper-container-cube .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-container-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0;width:100%;height:100%;background:#000;opacity:.6;filter:blur(50px);z-index:0}.swiper-container-flip{overflow:visible}.swiper-container-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-container-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-flip .swiper-slide-active,.swiper-container-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-flip .swiper-slide-shadow-bottom,.swiper-container-flip .swiper-slide-shadow-left,.swiper-container-flip .swiper-slide-shadow-right,.swiper-container-flip .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-container-coverflow .swiper-wrapper{-ms-perspective:1200px}
/*!**********************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/main.css ***!
  \**********************************************************************************************************************************************************************************************************************************************************************/
.ratio {
  position: relative;
  display: block;
  overflow: hidden;
}

.ratio::before {
  display: block;
  width: 100%;
  content: "";
}

.ratio-1\:1::before {
  padding-bottom: 100%;
}

.ratio-2\:1::before {
  padding-bottom: 50%;
}

.ratio-3\:2::before {
  padding-bottom: 66.66667%;
}

.ratio-3\:4::before {
  padding-bottom: 133.33333%;
}

.ratio-4\:3::before {
  padding-bottom: 75%;
}

.ratio-4\:1::before {
  padding-bottom: 25%;
}

.ratio-5\:4::before {
  padding-bottom: 80%;
}

.ratio-8\:5::before {
  padding-bottom: 62.5%;
}

.ratio-15\:9::before {
  padding-bottom: 60%;
}

.ratio-16\:9::before {
  padding-bottom: 56.25%;
}

.ratio-64\:45::before {
  padding-bottom: 70.3125%;
}

.ratio-6\:5::before {
  padding-bottom: 83.33333%;
}

.ratio-23\:18::before {
  padding-bottom: 78.26087%;
}

.ratio-41\:35::before {
  padding-bottom: 85.36585%;
}

.ratio-41\:45::before {
  padding-bottom: 109.7561%;
}

.ratio-63\:55::before {
  padding-bottom: 87.30159%;
}

:root {
  --font-primary: "Jost", sans-serif;
}

:root {
  --text-4: 4px;
  --text-7: 7px;
  --text-10: 10px;
  --text-12: 12px;
  --text-13: 13px;
  --text-14: 14px;
  --text-15: 15px;
  --text-16: 16px;
  --text-18: 18px;
  --text-20: 20px;
  --text-22: 22px;
  --text-24: 24px;
  --text-25: 25px;
  --text-26: 26px;
  --text-30: 30px;
  --text-40: 40px;
  --text-50: 50px;
  --text-60: 60px;
  --text-80: 80px;
}

:root {
  --color-white: #FFFFFF;
  --color-black: #000000;
  --color-border: #DDDDDD;
  --color-dark-1: #051036;
  --color-dark-2: #0D2857;
  --color-dark-3: #13357B;
  --color-dark-4: #163C8C;
  --color-light-1: #697488;
  --color-light-2: #F5F5F5;
  --color-light-3: #FBFCFF;
  --color-blue-1: #3554D1;
  --color-blue-2: #E5F0FD;
  --color-green-1: #EBFCEA;
  --color-green-2: #008009;
  --color-yellow-1: #F8D448;
  --color-yellow-2: #E1C03F;
  --color-yellow-3: #FFC700;
  --color-yellow-4: #FFF8DD;
  --color-brown-1: #923E01;
  --color-purple-1: #7E53F9;
  --color-red-1: #D93025;
  --color-red-2: #F1416C;
  --color-red-3: #FFF5F8;
  --color-info-1: #CDE9F6;
  --color-info-2: #4780AA;
  --color-warning-1: #F7F3D7;
  --color-warning-2: #927238;
  --color-error-1: #ECC8C5;
  --color-error-2: #AB3331;
  --color-success-1: #DEF2D7;
  --color-success-2: #5B7052;
}

[data-anim-wrap] {
  pointer-events: none;
}

[data-anim-wrap].animated {
  pointer-events: auto;
}

@keyframes reveal {
  100% {
    opacity: 1;
  }
}

[data-anim^='slide-'],
[data-anim-child^='slide-'] {
  opacity: 0;
  transition-property: opacity, transform;
  pointer-events: none;
  transition-duration: 1s;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}

[data-anim^='slide-'].is-in-view,
[data-anim-child^='slide-'].is-in-view {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  pointer-events: auto;
}

[data-anim^='slide-up'],
[data-anim-child^='slide-up'] {
  transform: translate3d(0, 40px, 0);
}

[data-anim^='slide-down'],
[data-anim-child^='slide-down'] {
  transform: translate3d(0, -40px, 0);
}

[data-anim^='slide-right'],
[data-anim-child^='slide-right'] {
  transform: translate3d(-40px, 0, 0);
}

[data-anim^='slide-left'],
[data-anim-child^='slide-left'] {
  transform: translate3d(40px, 0, 0);
}

[data-anim^='fade'],
[data-anim-child^='fade'] {
  opacity: 0;
  transition-property: opacity;
  pointer-events: none;
  transition-duration: 0.8s;
  transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
}

[data-anim^='fade'].is-in-view,
[data-anim-child^='fade'].is-in-view {
  opacity: 1;
  pointer-events: auto;
}

[data-anim*="delay-1"],
[data-anim-child*="delay-1"] {
  transition-delay: 0.1s;
  animation-delay: 0.1s;
}

[data-anim*="delay-1"]::after,
[data-anim-child*="delay-1"]::after {
  animation-delay: 0.1s;
}

[data-anim*="delay-1"] > *,
[data-anim-child*="delay-1"] > * {
  animation-delay: 0.1s;
}

[data-anim*="delay-2"],
[data-anim-child*="delay-2"] {
  transition-delay: 0.2s;
  animation-delay: 0.2s;
}

[data-anim*="delay-2"]::after,
[data-anim-child*="delay-2"]::after {
  animation-delay: 0.2s;
}

[data-anim*="delay-2"] > *,
[data-anim-child*="delay-2"] > * {
  animation-delay: 0.2s;
}

[data-anim*="delay-3"],
[data-anim-child*="delay-3"] {
  transition-delay: 0.3s;
  animation-delay: 0.3s;
}

[data-anim*="delay-3"]::after,
[data-anim-child*="delay-3"]::after {
  animation-delay: 0.3s;
}

[data-anim*="delay-3"] > *,
[data-anim-child*="delay-3"] > * {
  animation-delay: 0.3s;
}

[data-anim*="delay-4"],
[data-anim-child*="delay-4"] {
  transition-delay: 0.4s;
  animation-delay: 0.4s;
}

[data-anim*="delay-4"]::after,
[data-anim-child*="delay-4"]::after {
  animation-delay: 0.4s;
}

[data-anim*="delay-4"] > *,
[data-anim-child*="delay-4"] > * {
  animation-delay: 0.4s;
}

[data-anim*="delay-5"],
[data-anim-child*="delay-5"] {
  transition-delay: 0.5s;
  animation-delay: 0.5s;
}

[data-anim*="delay-5"]::after,
[data-anim-child*="delay-5"]::after {
  animation-delay: 0.5s;
}

[data-anim*="delay-5"] > *,
[data-anim-child*="delay-5"] > * {
  animation-delay: 0.5s;
}

[data-anim*="delay-6"],
[data-anim-child*="delay-6"] {
  transition-delay: 0.6s;
  animation-delay: 0.6s;
}

[data-anim*="delay-6"]::after,
[data-anim-child*="delay-6"]::after {
  animation-delay: 0.6s;
}

[data-anim*="delay-6"] > *,
[data-anim-child*="delay-6"] > * {
  animation-delay: 0.6s;
}

[data-anim*="delay-7"],
[data-anim-child*="delay-7"] {
  transition-delay: 0.7s;
  animation-delay: 0.7s;
}

[data-anim*="delay-7"]::after,
[data-anim-child*="delay-7"]::after {
  animation-delay: 0.7s;
}

[data-anim*="delay-7"] > *,
[data-anim-child*="delay-7"] > * {
  animation-delay: 0.7s;
}

[data-anim*="delay-8"],
[data-anim-child*="delay-8"] {
  transition-delay: 0.8s;
  animation-delay: 0.8s;
}

[data-anim*="delay-8"]::after,
[data-anim-child*="delay-8"]::after {
  animation-delay: 0.8s;
}

[data-anim*="delay-8"] > *,
[data-anim-child*="delay-8"] > * {
  animation-delay: 0.8s;
}

[data-anim*="delay-9"],
[data-anim-child*="delay-9"] {
  transition-delay: 0.9s;
  animation-delay: 0.9s;
}

[data-anim*="delay-9"]::after,
[data-anim-child*="delay-9"]::after {
  animation-delay: 0.9s;
}

[data-anim*="delay-9"] > *,
[data-anim-child*="delay-9"] > * {
  animation-delay: 0.9s;
}

[data-anim*="delay-10"],
[data-anim-child*="delay-10"] {
  transition-delay: 1s;
  animation-delay: 1s;
}

[data-anim*="delay-10"]::after,
[data-anim-child*="delay-10"]::after {
  animation-delay: 1s;
}

[data-anim*="delay-10"] > *,
[data-anim-child*="delay-10"] > * {
  animation-delay: 1s;
}

[data-anim*="delay-11"],
[data-anim-child*="delay-11"] {
  transition-delay: 1.1s;
  animation-delay: 1.1s;
}

[data-anim*="delay-11"]::after,
[data-anim-child*="delay-11"]::after {
  animation-delay: 1.1s;
}

[data-anim*="delay-11"] > *,
[data-anim-child*="delay-11"] > * {
  animation-delay: 1.1s;
}

[data-anim*="delay-12"],
[data-anim-child*="delay-12"] {
  transition-delay: 1.2s;
  animation-delay: 1.2s;
}

[data-anim*="delay-12"]::after,
[data-anim-child*="delay-12"]::after {
  animation-delay: 1.2s;
}

[data-anim*="delay-12"] > *,
[data-anim-child*="delay-12"] > * {
  animation-delay: 1.2s;
}

[data-anim*="delay-13"],
[data-anim-child*="delay-13"] {
  transition-delay: 1.3s;
  animation-delay: 1.3s;
}

[data-anim*="delay-13"]::after,
[data-anim-child*="delay-13"]::after {
  animation-delay: 1.3s;
}

[data-anim*="delay-13"] > *,
[data-anim-child*="delay-13"] > * {
  animation-delay: 1.3s;
}

[data-anim*="delay-14"],
[data-anim-child*="delay-14"] {
  transition-delay: 1.4s;
  animation-delay: 1.4s;
}

[data-anim*="delay-14"]::after,
[data-anim-child*="delay-14"]::after {
  animation-delay: 1.4s;
}

[data-anim*="delay-14"] > *,
[data-anim-child*="delay-14"] > * {
  animation-delay: 1.4s;
}

[data-anim*="delay-15"],
[data-anim-child*="delay-15"] {
  transition-delay: 1.5s;
  animation-delay: 1.5s;
}

[data-anim*="delay-15"]::after,
[data-anim-child*="delay-15"]::after {
  animation-delay: 1.5s;
}

[data-anim*="delay-15"] > *,
[data-anim-child*="delay-15"] > * {
  animation-delay: 1.5s;
}

[data-anim*="delay-16"],
[data-anim-child*="delay-16"] {
  transition-delay: 1.6s;
  animation-delay: 1.6s;
}

[data-anim*="delay-16"]::after,
[data-anim-child*="delay-16"]::after {
  animation-delay: 1.6s;
}

[data-anim*="delay-16"] > *,
[data-anim-child*="delay-16"] > * {
  animation-delay: 1.6s;
}

[data-anim*="delay-17"],
[data-anim-child*="delay-17"] {
  transition-delay: 1.7s;
  animation-delay: 1.7s;
}

[data-anim*="delay-17"]::after,
[data-anim-child*="delay-17"]::after {
  animation-delay: 1.7s;
}

[data-anim*="delay-17"] > *,
[data-anim-child*="delay-17"] > * {
  animation-delay: 1.7s;
}

[data-anim*="delay-18"],
[data-anim-child*="delay-18"] {
  transition-delay: 1.8s;
  animation-delay: 1.8s;
}

[data-anim*="delay-18"]::after,
[data-anim-child*="delay-18"]::after {
  animation-delay: 1.8s;
}

[data-anim*="delay-18"] > *,
[data-anim-child*="delay-18"] > * {
  animation-delay: 1.8s;
}

[data-anim*="delay-19"],
[data-anim-child*="delay-19"] {
  transition-delay: 1.9s;
  animation-delay: 1.9s;
}

[data-anim*="delay-19"]::after,
[data-anim-child*="delay-19"]::after {
  animation-delay: 1.9s;
}

[data-anim*="delay-19"] > *,
[data-anim-child*="delay-19"] > * {
  animation-delay: 1.9s;
}

[data-anim*="delay-20"],
[data-anim-child*="delay-20"] {
  transition-delay: 2s;
  animation-delay: 2s;
}

[data-anim*="delay-20"]::after,
[data-anim-child*="delay-20"]::after {
  animation-delay: 2s;
}

[data-anim*="delay-20"] > *,
[data-anim-child*="delay-20"] > * {
  animation-delay: 2s;
}

html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  min-height: 100%;
}

body {
  padding: 0;
  font-family: var(--font-primary);
  width: 100%;
  background-color: white;
  color: var(--color-dark-1);
  font-size: 16px;
  line-height: 1.875;
}

select,
input:not([type="range"]),
textarea {
  border: 0;
  outline: none;
  width: 100%;
  background-color: transparent;
}

main {
  overflow: hidden;
}

img {
  max-width: 100%;
  height: auto;
}

a {
  color: inherit;
  font-size: inherit;
  line-height: inherit;
  font-weight: inherit;
  transition: color 0.2s ease-in-out;
  text-decoration: none;
}

a:hover {
  text-decoration: none;
}

ul, li {
  list-style: none;
  margin: 0;
  padding: 0;
}

p {
  margin: 0;
  font-size: 16px;
  color: var(--color-light-1);
}

button {
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
  background-color: transparent;
  text-decoration: none;
}

button:focus {
  outline: 0;
}

.button {
  display: flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  text-align: center;
  line-height: 1;
  font-weight: 500;
  font-size: 15px;
  line-height: 1.2;
  border-radius: 4px;
  border: 1px solid transparent;
  transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.button.-md {
  padding: 14px 30px;
}

.button.-lg {
  padding: 19px 30px;
}

.button.-min-180 {
  min-width: 180px;
}

.button.-underline:hover {
  text-decoration: underline;
}

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

.button.-outline-white {
  border-color: var(--color-white);
}

.button.-outline-white:hover {
  background-color: var(--color-white);
  border-color: transparent;
  color: white !important;
}

.button.-black:hover {
  border-color: var(--color-black);
  background-color: var(--color-black) !important;
  color: white !important;
}

.button.-outline-black {
  border-color: var(--color-black);
}

.button.-outline-black:hover {
  background-color: var(--color-black);
  border-color: transparent;
  color: white !important;
}

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

.button.-outline-border {
  border-color: var(--color-border);
}

.button.-outline-border:hover {
  background-color: var(--color-border);
  border-color: transparent;
  color: white !important;
}

.button.-dark-1:hover {
  border-color: var(--color-dark-1);
  background-color: var(--color-dark-1) !important;
  color: white !important;
}

.button.-outline-dark-1 {
  border-color: var(--color-dark-1);
}

.button.-outline-dark-1:hover {
  background-color: var(--color-dark-1);
  border-color: transparent;
  color: white !important;
}

.button.-dark-2:hover {
  border-color: var(--color-dark-2);
  background-color: var(--color-dark-2) !important;
  color: white !important;
}

.button.-outline-dark-2 {
  border-color: var(--color-dark-2);
}

.button.-outline-dark-2:hover {
  background-color: var(--color-dark-2);
  border-color: transparent;
  color: white !important;
}

.button.-dark-3:hover {
  border-color: var(--color-dark-3);
  background-color: var(--color-dark-3) !important;
  color: white !important;
}

.button.-outline-dark-3 {
  border-color: var(--color-dark-3);
}

.button.-outline-dark-3:hover {
  background-color: var(--color-dark-3);
  border-color: transparent;
  color: white !important;
}

.button.-dark-4:hover {
  border-color: var(--color-dark-4);
  background-color: var(--color-dark-4) !important;
  color: white !important;
}

.button.-outline-dark-4 {
  border-color: var(--color-dark-4);
}

.button.-outline-dark-4:hover {
  background-color: var(--color-dark-4);
  border-color: transparent;
  color: white !important;
}

.button.-light-1:hover {
  border-color: var(--color-light-1);
  background-color: var(--color-light-1) !important;
  color: white !important;
}

.button.-outline-light-1 {
  border-color: var(--color-light-1);
}

.button.-outline-light-1:hover {
  background-color: var(--color-light-1);
  border-color: transparent;
  color: white !important;
}

.button.-light-2:hover {
  border-color: var(--color-light-2);
  background-color: var(--color-light-2) !important;
  color: white !important;
}

.button.-outline-light-2 {
  border-color: var(--color-light-2);
}

.button.-outline-light-2:hover {
  background-color: var(--color-light-2);
  border-color: transparent;
  color: white !important;
}

.button.-light-3:hover {
  border-color: var(--color-light-3);
  background-color: var(--color-light-3) !important;
  color: white !important;
}

.button.-outline-light-3 {
  border-color: var(--color-light-3);
}

.button.-outline-light-3:hover {
  background-color: var(--color-light-3);
  border-color: transparent;
  color: white !important;
}

.button.-blue-1:hover {
  border-color: var(--color-blue-1);
  background-color: var(--color-blue-1) !important;
  color: white !important;
}

.button.-outline-blue-1 {
  border-color: var(--color-blue-1);
}

.button.-outline-blue-1:hover {
  background-color: var(--color-blue-1);
  border-color: transparent;
  color: white !important;
}

.button.-blue-2:hover {
  border-color: var(--color-blue-2);
  background-color: var(--color-blue-2) !important;
  color: white !important;
}

.button.-outline-blue-2 {
  border-color: var(--color-blue-2);
}

.button.-outline-blue-2:hover {
  background-color: var(--color-blue-2);
  border-color: transparent;
  color: white !important;
}

.button.-green-1:hover {
  border-color: var(--color-green-1);
  background-color: var(--color-green-1) !important;
  color: white !important;
}

.button.-outline-green-1 {
  border-color: var(--color-green-1);
}

.button.-outline-green-1:hover {
  background-color: var(--color-green-1);
  border-color: transparent;
  color: white !important;
}

.button.-green-2:hover {
  border-color: var(--color-green-2);
  background-color: var(--color-green-2) !important;
  color: white !important;
}

.button.-outline-green-2 {
  border-color: var(--color-green-2);
}

.button.-outline-green-2:hover {
  background-color: var(--color-green-2);
  border-color: transparent;
  color: white !important;
}

.button.-yellow-1:hover {
  border-color: var(--color-yellow-1);
  background-color: var(--color-yellow-1) !important;
  color: white !important;
}

.button.-outline-yellow-1 {
  border-color: var(--color-yellow-1);
}

.button.-outline-yellow-1:hover {
  background-color: var(--color-yellow-1);
  border-color: transparent;
  color: white !important;
}

.button.-yellow-2:hover {
  border-color: var(--color-yellow-2);
  background-color: var(--color-yellow-2) !important;
  color: white !important;
}

.button.-outline-yellow-2 {
  border-color: var(--color-yellow-2);
}

.button.-outline-yellow-2:hover {
  background-color: var(--color-yellow-2);
  border-color: transparent;
  color: white !important;
}

.button.-yellow-3:hover {
  border-color: var(--color-yellow-3);
  background-color: var(--color-yellow-3) !important;
  color: white !important;
}

.button.-outline-yellow-3 {
  border-color: var(--color-yellow-3);
}

.button.-outline-yellow-3:hover {
  background-color: var(--color-yellow-3);
  border-color: transparent;
  color: white !important;
}

.button.-yellow-4:hover {
  border-color: var(--color-yellow-4);
  background-color: var(--color-yellow-4) !important;
  color: white !important;
}

.button.-outline-yellow-4 {
  border-color: var(--color-yellow-4);
}

.button.-outline-yellow-4:hover {
  background-color: var(--color-yellow-4);
  border-color: transparent;
  color: white !important;
}

.button.-brown-1:hover {
  border-color: var(--color-brown-1);
  background-color: var(--color-brown-1) !important;
  color: white !important;
}

.button.-outline-brown-1 {
  border-color: var(--color-brown-1);
}

.button.-outline-brown-1:hover {
  background-color: var(--color-brown-1);
  border-color: transparent;
  color: white !important;
}

.button.-purple-1:hover {
  border-color: var(--color-purple-1);
  background-color: var(--color-purple-1) !important;
  color: white !important;
}

.button.-outline-purple-1 {
  border-color: var(--color-purple-1);
}

.button.-outline-purple-1:hover {
  background-color: var(--color-purple-1);
  border-color: transparent;
  color: white !important;
}

.button.-red-1:hover {
  border-color: var(--color-red-1);
  background-color: var(--color-red-1) !important;
  color: white !important;
}

.button.-outline-red-1 {
  border-color: var(--color-red-1);
}

.button.-outline-red-1:hover {
  background-color: var(--color-red-1);
  border-color: transparent;
  color: white !important;
}

.button.-red-2:hover {
  border-color: var(--color-red-2);
  background-color: var(--color-red-2) !important;
  color: white !important;
}

.button.-outline-red-2 {
  border-color: var(--color-red-2);
}

.button.-outline-red-2:hover {
  background-color: var(--color-red-2);
  border-color: transparent;
  color: white !important;
}

.button.-red-3:hover {
  border-color: var(--color-red-3);
  background-color: var(--color-red-3) !important;
  color: white !important;
}

.button.-outline-red-3 {
  border-color: var(--color-red-3);
}

.button.-outline-red-3:hover {
  background-color: var(--color-red-3);
  border-color: transparent;
  color: white !important;
}

.button.-info-1:hover {
  border-color: var(--color-info-1);
  background-color: var(--color-info-1) !important;
  color: white !important;
}

.button.-outline-info-1 {
  border-color: var(--color-info-1);
}

.button.-outline-info-1:hover {
  background-color: var(--color-info-1);
  border-color: transparent;
  color: white !important;
}

.button.-info-2:hover {
  border-color: var(--color-info-2);
  background-color: var(--color-info-2) !important;
  color: white !important;
}

.button.-outline-info-2 {
  border-color: var(--color-info-2);
}

.button.-outline-info-2:hover {
  background-color: var(--color-info-2);
  border-color: transparent;
  color: white !important;
}

.button.-warning-1:hover {
  border-color: var(--color-warning-1);
  background-color: var(--color-warning-1) !important;
  color: white !important;
}

.button.-outline-warning-1 {
  border-color: var(--color-warning-1);
}

.button.-outline-warning-1:hover {
  background-color: var(--color-warning-1);
  border-color: transparent;
  color: white !important;
}

.button.-warning-2:hover {
  border-color: var(--color-warning-2);
  background-color: var(--color-warning-2) !important;
  color: white !important;
}

.button.-outline-warning-2 {
  border-color: var(--color-warning-2);
}

.button.-outline-warning-2:hover {
  background-color: var(--color-warning-2);
  border-color: transparent;
  color: white !important;
}

.button.-error-1:hover {
  border-color: var(--color-error-1);
  background-color: var(--color-error-1) !important;
  color: white !important;
}

.button.-outline-error-1 {
  border-color: var(--color-error-1);
}

.button.-outline-error-1:hover {
  background-color: var(--color-error-1);
  border-color: transparent;
  color: white !important;
}

.button.-error-2:hover {
  border-color: var(--color-error-2);
  background-color: var(--color-error-2) !important;
  color: white !important;
}

.button.-outline-error-2 {
  border-color: var(--color-error-2);
}

.button.-outline-error-2:hover {
  background-color: var(--color-error-2);
  border-color: transparent;
  color: white !important;
}

.button.-success-1:hover {
  border-color: var(--color-success-1);
  background-color: var(--color-success-1) !important;
  color: white !important;
}

.button.-outline-success-1 {
  border-color: var(--color-success-1);
}

.button.-outline-success-1:hover {
  background-color: var(--color-success-1);
  border-color: transparent;
  color: white !important;
}

.button.-success-2:hover {
  border-color: var(--color-success-2);
  background-color: var(--color-success-2) !important;
  color: white !important;
}

.button.-outline-success-2 {
  border-color: var(--color-success-2);
}

.button.-outline-success-2:hover {
  background-color: var(--color-success-2);
  border-color: transparent;
  color: white !important;
}

.button.-white:hover {
  background-color: var(--color-light-3) !important;
  color: var(--color-dark-1) !important;
}

.button.-blue-1-05:hover {
  background-color: rgba(53, 84, 209, 0.05) !important;
  color: var(--color-blue-1) !important;
}

.button.-outline-white:hover {
  background-color: white !important;
  color: var(--color-dark-1) !important;
}

.contact-form select,
.contact-form input:not([type="range"]),
.contact-form textarea {
  border-radius: 4px;
  padding: 17px 20px;
  font-size: 15px;
  letter-spacing: 0.02em;
  transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.contact-form select:focus,
.contact-form input:not([type="range"]):focus,
.contact-form textarea:focus {
  outline: none;
}

.contact-form ::placeholder {
  font-weight: 400;
}

input.text-white::placeholder {
  color: white;
}

.form-checkbox {
  cursor: pointer;
  position: relative;
  display: flex;
}

.form-checkbox label {
  margin: 0;
  margin-left: 9px;
  font-size: 14px;
}

.form-checkbox__mark {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 16px;
  height: 16px;
  border: 1px solid var(--color-dark-1);
  border-radius: 4px;
}

.form-checkbox__icon {
  display: none;
  position: absolute;
  font-size: 8px;
  color: white;
}

.form-checkbox input {
  cursor: pointer;
  z-index: 5;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
}

.form-checkbox input:checked ~ .form-checkbox__mark {
  background-color: var(--color-blue-1);
  border-color: var(--color-blue-1);
}

.form-checkbox input:checked ~ .form-checkbox__mark .form-checkbox__icon {
  display: block;
}

.form-checkbox:hover input ~ .form-checkbox__mark {
  background-color: var(--color-blue-1);
}

.form-checkbox:hover input:checked ~ .form-checkbox__mark {
  background-color: var(--color-blue-1);
}

.form-radio {
  display: flex;
  align-items: center;
}

.form-radio .radio {
  cursor: pointer;
  position: relative;
  display: block;
}

.form-radio .radio__mark {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 16px;
  width: 16px;
  border-radius: 100%;
  border: 1px solid var(--color-dark-1);
  transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.form-radio .radio__icon {
  position: absolute;
  width: 10px;
  height: 10px;
  border-radius: 100%;
  background-color: var(--color-white);
  transform-origin: center;
  opacity: 1;
  transform: scale(0.2);
  transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.form-radio .radio input {
  cursor: pointer;
  position: absolute;
  z-index: 5;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
}

.form-radio .radio input:checked ~ .radio__mark {
  border-color: var(--color-blue-1);
  background-color: var(--color-blue-1);
}

.form-radio .radio input:checked ~ .radio__mark .radio__icon {
  opacity: 1;
  transform: scale(1);
}

.form-switch .switch {
  position: relative;
  width: 60px;
  height: 30px;
}

.form-switch .switch__slider {
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  box-shadow: 0px 10px 50px rgba(13, 38, 59, 0.1);
  background-color: rgba(255, 255, 255, 0.2);
  transition: .3s;
  border-radius: 30px;
  border: 1px solid var(--color-blue-1);
}

.form-switch .switch__slider::before {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 5px;
  bottom: 4px;
  background-color: var(--color-blue-1);
  border-radius: 50%;
  transition: .3s;
}

.form-switch .switch input {
  z-index: 5;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
}

.form-switch .switch input:checked + .switch__slider {
  background-color: var(--color-blue-1);
}

.form-switch .switch input:checked + .switch__slider::before {
  transform: translateX(29px);
  background-color: white;
}

.single-field input {
  border-radius: 4px;
  padding: 17px 20px;
  font-size: 15px;
  letter-spacing: 0.02em;
  transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.single-field.-w-410 input {
  width: 410px;
}

@media (max-width: 991px) {
  .single-field.-w-410 input {
    width: 100%;
  }
}

h1, h2, h3, h4, h5, h6 {
  margin: 0;
  line-height: 1.45;
  font-weight: 600;
}

.text-4 {
  font-size: var(--text-4) !important;
}

.text-7 {
  font-size: var(--text-7) !important;
}

.text-10 {
  font-size: var(--text-10) !important;
}

.text-12 {
  font-size: var(--text-12) !important;
}

.text-13 {
  font-size: var(--text-13) !important;
}

.text-14 {
  font-size: var(--text-14) !important;
}

.text-15 {
  font-size: var(--text-15) !important;
}

.text-16 {
  font-size: var(--text-16) !important;
}

.text-18 {
  font-size: var(--text-18) !important;
}

.text-20 {
  font-size: var(--text-20) !important;
}

.text-22 {
  font-size: var(--text-22) !important;
}

.text-24 {
  font-size: var(--text-24) !important;
}

.text-25 {
  font-size: var(--text-25) !important;
}

.text-26 {
  font-size: var(--text-26) !important;
}

.text-30 {
  font-size: var(--text-30) !important;
}

.text-40 {
  font-size: var(--text-40) !important;
}

.text-50 {
  font-size: var(--text-50) !important;
}

.text-60 {
  font-size: var(--text-60) !important;
}

.text-80 {
  font-size: var(--text-80) !important;
}

@media (max-width: 1199px) {
  .xl\:text-4 {
    font-size: var(--text-4) !important;
  }
  .xl\:text-7 {
    font-size: var(--text-7) !important;
  }
  .xl\:text-10 {
    font-size: var(--text-10) !important;
  }
  .xl\:text-12 {
    font-size: var(--text-12) !important;
  }
  .xl\:text-13 {
    font-size: var(--text-13) !important;
  }
  .xl\:text-14 {
    font-size: var(--text-14) !important;
  }
  .xl\:text-15 {
    font-size: var(--text-15) !important;
  }
  .xl\:text-16 {
    font-size: var(--text-16) !important;
  }
  .xl\:text-18 {
    font-size: var(--text-18) !important;
  }
  .xl\:text-20 {
    font-size: var(--text-20) !important;
  }
  .xl\:text-22 {
    font-size: var(--text-22) !important;
  }
  .xl\:text-24 {
    font-size: var(--text-24) !important;
  }
  .xl\:text-25 {
    font-size: var(--text-25) !important;
  }
  .xl\:text-26 {
    font-size: var(--text-26) !important;
  }
  .xl\:text-30 {
    font-size: var(--text-30) !important;
  }
  .xl\:text-40 {
    font-size: var(--text-40) !important;
  }
  .xl\:text-50 {
    font-size: var(--text-50) !important;
  }
  .xl\:text-60 {
    font-size: var(--text-60) !important;
  }
  .xl\:text-80 {
    font-size: var(--text-80) !important;
  }
}

@media (max-width: 991px) {
  .lg\:text-4 {
    font-size: var(--text-4) !important;
  }
  .lg\:text-7 {
    font-size: var(--text-7) !important;
  }
  .lg\:text-10 {
    font-size: var(--text-10) !important;
  }
  .lg\:text-12 {
    font-size: var(--text-12) !important;
  }
  .lg\:text-13 {
    font-size: var(--text-13) !important;
  }
  .lg\:text-14 {
    font-size: var(--text-14) !important;
  }
  .lg\:text-15 {
    font-size: var(--text-15) !important;
  }
  .lg\:text-16 {
    font-size: var(--text-16) !important;
  }
  .lg\:text-18 {
    font-size: var(--text-18) !important;
  }
  .lg\:text-20 {
    font-size: var(--text-20) !important;
  }
  .lg\:text-22 {
    font-size: var(--text-22) !important;
  }
  .lg\:text-24 {
    font-size: var(--text-24) !important;
  }
  .lg\:text-25 {
    font-size: var(--text-25) !important;
  }
  .lg\:text-26 {
    font-size: var(--text-26) !important;
  }
  .lg\:text-30 {
    font-size: var(--text-30) !important;
  }
  .lg\:text-40 {
    font-size: var(--text-40) !important;
  }
  .lg\:text-50 {
    font-size: var(--text-50) !important;
  }
  .lg\:text-60 {
    font-size: var(--text-60) !important;
  }
  .lg\:text-80 {
    font-size: var(--text-80) !important;
  }
}

@media (max-width: 767px) {
  .md\:text-4 {
    font-size: var(--text-4) !important;
  }
  .md\:text-7 {
    font-size: var(--text-7) !important;
  }
  .md\:text-10 {
    font-size: var(--text-10) !important;
  }
  .md\:text-12 {
    font-size: var(--text-12) !important;
  }
  .md\:text-13 {
    font-size: var(--text-13) !important;
  }
  .md\:text-14 {
    font-size: var(--text-14) !important;
  }
  .md\:text-15 {
    font-size: var(--text-15) !important;
  }
  .md\:text-16 {
    font-size: var(--text-16) !important;
  }
  .md\:text-18 {
    font-size: var(--text-18) !important;
  }
  .md\:text-20 {
    font-size: var(--text-20) !important;
  }
  .md\:text-22 {
    font-size: var(--text-22) !important;
  }
  .md\:text-24 {
    font-size: var(--text-24) !important;
  }
  .md\:text-25 {
    font-size: var(--text-25) !important;
  }
  .md\:text-26 {
    font-size: var(--text-26) !important;
  }
  .md\:text-30 {
    font-size: var(--text-30) !important;
  }
  .md\:text-40 {
    font-size: var(--text-40) !important;
  }
  .md\:text-50 {
    font-size: var(--text-50) !important;
  }
  .md\:text-60 {
    font-size: var(--text-60) !important;
  }
  .md\:text-80 {
    font-size: var(--text-80) !important;
  }
}

@media (max-width: 575px) {
  .sm\:text-4 {
    font-size: var(--text-4) !important;
  }
  .sm\:text-7 {
    font-size: var(--text-7) !important;
  }
  .sm\:text-10 {
    font-size: var(--text-10) !important;
  }
  .sm\:text-12 {
    font-size: var(--text-12) !important;
  }
  .sm\:text-13 {
    font-size: var(--text-13) !important;
  }
  .sm\:text-14 {
    font-size: var(--text-14) !important;
  }
  .sm\:text-15 {
    font-size: var(--text-15) !important;
  }
  .sm\:text-16 {
    font-size: var(--text-16) !important;
  }
  .sm\:text-18 {
    font-size: var(--text-18) !important;
  }
  .sm\:text-20 {
    font-size: var(--text-20) !important;
  }
  .sm\:text-22 {
    font-size: var(--text-22) !important;
  }
  .sm\:text-24 {
    font-size: var(--text-24) !important;
  }
  .sm\:text-25 {
    font-size: var(--text-25) !important;
  }
  .sm\:text-26 {
    font-size: var(--text-26) !important;
  }
  .sm\:text-30 {
    font-size: var(--text-30) !important;
  }
  .sm\:text-40 {
    font-size: var(--text-40) !important;
  }
  .sm\:text-50 {
    font-size: var(--text-50) !important;
  }
  .sm\:text-60 {
    font-size: var(--text-60) !important;
  }
  .sm\:text-80 {
    font-size: var(--text-80) !important;
  }
}

@media (max-width: 479px) {
  .xs\:text-4 {
    font-size: var(--text-4) !important;
  }
  .xs\:text-7 {
    font-size: var(--text-7) !important;
  }
  .xs\:text-10 {
    font-size: var(--text-10) !important;
  }
  .xs\:text-12 {
    font-size: var(--text-12) !important;
  }
  .xs\:text-13 {
    font-size: var(--text-13) !important;
  }
  .xs\:text-14 {
    font-size: var(--text-14) !important;
  }
  .xs\:text-15 {
    font-size: var(--text-15) !important;
  }
  .xs\:text-16 {
    font-size: var(--text-16) !important;
  }
  .xs\:text-18 {
    font-size: var(--text-18) !important;
  }
  .xs\:text-20 {
    font-size: var(--text-20) !important;
  }
  .xs\:text-22 {
    font-size: var(--text-22) !important;
  }
  .xs\:text-24 {
    font-size: var(--text-24) !important;
  }
  .xs\:text-25 {
    font-size: var(--text-25) !important;
  }
  .xs\:text-26 {
    font-size: var(--text-26) !important;
  }
  .xs\:text-30 {
    font-size: var(--text-30) !important;
  }
  .xs\:text-40 {
    font-size: var(--text-40) !important;
  }
  .xs\:text-50 {
    font-size: var(--text-50) !important;
  }
  .xs\:text-60 {
    font-size: var(--text-60) !important;
  }
  .xs\:text-80 {
    font-size: var(--text-80) !important;
  }
}

.lh-1 {
  line-height: 1 !important;
}

.lh-11 {
  line-height: 1.1 !important;
}

.lh-12 {
  line-height: 1.2 !important;
}

.lh-13 {
  line-height: 1.3 !important;
}

.lh-14 {
  line-height: 1.4 !important;
}

.lh-15 {
  line-height: 1.5 !important;
}

.lh-16 {
  line-height: 1.6 !important;
}

.lh-17 {
  line-height: 1.7 !important;
}

.lh-18 {
  line-height: 1.8 !important;
}

.lh-19 {
  line-height: 1.9 !important;
}

.lh-2 {
  line-height: 2 !important;
}

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

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

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

@media (max-width: 1199px) {
  .xl\:text-center {
    text-align: center !important;
  }
  .xl\:text-right {
    text-align: right !important;
  }
  .xl\:text-left {
    text-align: left !important;
  }
}

@media (max-width: 991px) {
  .lg\:text-center {
    text-align: center !important;
  }
  .lg\:text-right {
    text-align: right !important;
  }
  .lg\:text-left {
    text-align: left !important;
  }
}

@media (max-width: 767px) {
  .md\:text-center {
    text-align: center !important;
  }
  .md\:text-right {
    text-align: right !important;
  }
  .md\:text-left {
    text-align: left !important;
  }
}

@media (max-width: 575px) {
  .sm\:text-center {
    text-align: center !important;
  }
  .sm\:text-right {
    text-align: right !important;
  }
  .sm\:text-left {
    text-align: left !important;
  }
}

.fw-300 {
  font-weight: 300;
}

.fw-400 {
  font-weight: 400;
}

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

.fw-600 {
  font-weight: 600;
}

.fw-700 {
  font-weight: 700;
}

.sectionTitle.-md .sectionTitle__title {
  font-size: var(--text-30);
}

@media (max-width: 767px) {
  .sectionTitle.-md .sectionTitle__title {
    font-size: var(--text-26);
  }
}

.sectionTitle.-lg .sectionTitle__title {
  font-size: var(--text-40);
}

.masthead.-type-1 {
  position: relative;
  padding-top: 330px;
  padding-bottom: 210px;
}

@media (max-width: 991px) {
  .masthead.-type-1 {
    padding-top: 260px;
    padding-bottom: 180px;
  }
}

@media (max-width: 575px) {
  .masthead.-type-1 {
    padding-top: 160px;
    padding-bottom: 20px;
  }
}

.masthead.-type-1 .masthead__bg {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.masthead.-type-1 .masthead__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.masthead.-type-1 .masthead__bg::after {
  content: "";
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(270deg, rgba(5, 16, 54, 0.5) 0%, #051036 72.43%);
  opacity: 0.85;
}

.masthead.-type-2 {
  position: relative;
}

.masthead.-type-2 .mainSearch {
  position: absolute;
  bottom: 30px;
}

@media (max-width: 1199px) {
  .masthead.-type-2 .mainSearch {
    position: relative;
    bottom: 0;
    width: 100%;
  }
}

.masthead.-type-2 .masthead__bg {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: calc(100% - 70px);
}

@media (max-width: 1199px) {
  .masthead.-type-2 .masthead__bg {
    height: 100%;
  }
}

.masthead.-type-2 .masthead__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.masthead.-type-2 .masthead__tabs {
  padding-top: 90px;
}

@media (max-width: 767px) {
  .masthead.-type-2 .masthead__tabs {
    padding-top: 74px;
  }
}

.masthead.-type-2 .masthead__content {
  padding-top: 120px;
}

@media (max-width: 1199px) {
  .masthead.-type-2 .masthead__content {
    padding-top: 120px;
    padding-bottom: 80px;
  }
}

@media (max-width: 767px) {
  .masthead.-type-2 .masthead__content {
    padding-top: 40px;
  }
}

@media (max-width: 575px) {
  .masthead.-type-2 .masthead__content {
    padding-bottom: 20px;
  }
}

.masthead.-type-2 .masthead__images {
  display: grid;
  grid-template-columns: auto auto;
  grid-template-rows: 1fr 1fr;
  grid-gap: 30px;
  gap: 30px;
}

@media (max-width: 575px) {
  .masthead.-type-2 .masthead__images {
    gap: 12px;
  }
}

.masthead.-type-2 .masthead__images img {
  border-radius: 4px;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.masthead.-type-2 .masthead__images > *:nth-child(1) {
  grid-row: span 2;
}

.masthead.-type-3 {
  position: relative;
  padding-top: 360px;
  padding-bottom: 100px;
}

@media (max-width: 991px) {
  .masthead.-type-3 {
    padding-top: 220px;
    padding-bottom: 80px;
  }
}

@media (max-width: 767px) {
  .masthead.-type-3 {
    padding-top: 160px;
    padding-bottom: 30px;
  }
}

.masthead.-type-3 .masthead__bg {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.masthead.-type-3 .masthead__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.masthead.-type-3 .masthead__bg::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(5, 16, 54, 0.5);
}

.masthead.-type-3 .masthead__tabs {
  margin-top: 110px;
}

@media (max-width: 767px) {
  .masthead.-type-3 .masthead__tabs {
    margin-top: 40px;
  }
}

.masthead.-type-3 .masthead__tabs .tabs__controls {
  bottom: -5px;
}

.masthead.-type-3 .masthead__tabs .tabs__button {
  height: 64px;
}

.masthead.-type-4 {
  position: relative;
  margin: 20px 20px 0 20px;
}

@media (max-width: 1199px) {
  .masthead.-type-4 {
    margin: 0;
  }
}

.masthead.-type-4 .masthead__content {
  position: relative;
  z-index: 1;
  padding-top: 360px;
  padding-bottom: 140px;
}

@media (max-width: 991px) {
  .masthead.-type-4 .masthead__content {
    padding-top: 220px;
    padding-bottom: 120px;
  }
}

@media (max-width: 767px) {
  .masthead.-type-4 .masthead__content {
    padding-top: 160px;
    padding-bottom: 100px;
  }
}

.masthead.-type-4 .masthead__scroll {
  position: absolute;
  z-index: 5;
  bottom: 18px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
}

@media (max-width: 767px) {
  .masthead.-type-4 .masthead__scroll {
    display: none;
  }
}

.masthead.-type-4 .masthead__scroll .-line {
  width: 1px;
  height: 48px;
  background-color: white;
  margin-top: 3px;
}

.masthead.-type-4 .masthead-slider {
  position: relative;
  z-index: 0;
}

.masthead.-type-4 .masthead-slider .masthead__image {
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
}

.masthead.-type-4 .masthead-slider .masthead__image::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  background-color: rgba(5, 16, 54, 0.5);
}

.masthead.-type-4 .masthead-slider img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.masthead.-type-4 .masthead-slider__nav {
  position: absolute;
  top: 50%;
  z-index: 10;
  transform: translateY(-50%);
}

.masthead.-type-4 .masthead-slider__nav.-prev {
  left: 40px;
}

.masthead.-type-4 .masthead-slider__nav.-next {
  right: 40px;
}

@media (max-width: 767px) {
  .masthead.-type-4 .masthead-slider__nav {
    top: unset;
    bottom: 30px;
    transform: none;
  }
  .masthead.-type-4 .masthead-slider__nav.-prev {
    left: unset;
    right: calc(50% + 10px);
  }
  .masthead.-type-4 .masthead-slider__nav.-next {
    right: unset;
    left: calc(50% + 10px);
  }
}

.masthead.-type-4 .mainSearch {
  margin-top: 90px;
}

@media (max-width: 767px) {
  .masthead.-type-4 .mainSearch {
    margin-top: 40px;
  }
}

.masthead.-type-5 {
  position: relative;
  padding-top: 260px;
  padding-bottom: 200px;
}

@media (max-width: 991px) {
  .masthead.-type-5 {
    padding-top: 220px;
    padding-bottom: 160px;
  }
}

@media (max-width: 767px) {
  .masthead.-type-5 {
    padding-top: 160px;
    padding-bottom: 40px;
  }
}

.masthead.-type-5 .masthead__bg {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 58%;
  z-index: -1;
}

@media (max-width: 767px) {
  .masthead.-type-5 .masthead__bg {
    width: 100%;
  }
}

.masthead.-type-5 .masthead__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.masthead.-type-5 .masthead__image {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 42%;
  z-index: -2;
}

.masthead.-type-5 .masthead__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.masthead.-type-5 .-line {
  position: absolute;
  bottom: -40%;
  left: 0;
  width: 100%;
}

.masthead.-type-5 .-line img {
  width: 100%;
  object-fit: cover;
}

.masthead.-type-6 {
  position: relative;
  padding-top: 360px;
  padding-bottom: 300px;
}

@media (max-width: 1199px) {
  .masthead.-type-6 {
    padding-top: 240px;
    padding-bottom: 180px;
  }
}

@media (max-width: 991px) {
  .masthead.-type-6 {
    padding-top: 200px;
    padding-bottom: 60px;
  }
}

@media (max-width: 767px) {
  .masthead.-type-6 {
    padding-top: 120px;
    padding-bottom: 40px;
  }
}

.masthead.-type-6 .masthead__bg {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: -1;
}

.masthead.-type-6 .masthead__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.masthead.-type-6 .masthead__bg::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  background-color: rgba(5, 16, 54, 0.5);
}

.masthead.-type-7 {
  position: relative;
  padding-top: 90px;
}

@media (max-width: 991px) {
  .masthead.-type-7 {
    padding-bottom: 200px;
  }
}

.masthead.-type-7 .masthead__bg {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.masthead.-type-7 .masthead__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.masthead.-type-7 .masthead__bg::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(5, 16, 54, 0.5);
}

.masthead.-type-7 .masthead__content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 650px;
}

@media (max-width: 991px) {
  .masthead.-type-7 .masthead__content {
    height: auto;
    width: 400px;
    max-width: 100%;
    padding-top: 100px;
    padding-bottom: 220px;
  }
}

@media (max-width: 767px) {
  .masthead.-type-7 .masthead__content {
    padding-top: 60px;
    padding-bottom: 260px;
  }
}

.masthead.-type-7 .masthead-slider {
  overflow: hidden;
  position: relative;
  width: 1720px;
  max-width: 100%;
  margin: 0 auto;
  border-radius: 4px;
}

.masthead.-type-7 .masthead-slider__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
}

.masthead.-type-7 .masthead-slider__nav.-prev {
  left: 40px;
}

.masthead.-type-7 .masthead-slider__nav.-next {
  right: 40px;
}

@media (max-width: 767px) {
  .masthead.-type-7 .masthead-slider__nav {
    top: 52%;
  }
  .masthead.-type-7 .masthead-slider__nav.-prev {
    left: unset;
    right: 51%;
  }
  .masthead.-type-7 .masthead-slider__nav.-next {
    right: unset;
    left: 51%;
  }
}

.masthead.-type-7 .mainSearch {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -50px;
  z-index: 1;
}

@media (max-width: 991px) {
  .masthead.-type-7 .mainSearch {
    bottom: 0;
    width: 480px;
    max-width: calc(100% - 40px);
  }
}

.masthead.-type-8 {
  position: relative;
  padding-top: 200px;
}

@media (max-width: 991px) {
  .masthead.-type-8 {
    padding-top: 160px;
  }
}

@media (max-width: 767px) {
  .masthead.-type-8 {
    padding-top: 120px;
  }
}

.masthead.-type-8 .masthead__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 700px;
  z-index: -1;
}

.masthead.-type-8 .masthead-bottom {
  position: relative;
  max-width: 1500px;
  margin: 0 auto;
}

.masthead.-type-8 .mainSearch {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: -50px;
  z-index: 2;
}

@media (max-width: 991px) {
  .masthead.-type-8 .mainSearch {
    position: relative;
    top: unset;
    left: unset;
    transform: none;
    max-width: 600px;
  }
}

.masthead.-type-8 .masthead-slider {
  position: relative;
  border-radius: 16px;
  margin: 0 24px;
}

@media (max-width: 767px) {
  .masthead.-type-8 .masthead-slider {
    border-radius: 0;
    margin: 0;
  }
}

.masthead.-type-8 .masthead-slider__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
}

.masthead.-type-8 .masthead-slider__nav.-prev {
  left: 40px;
}

@media (max-width: 767px) {
  .masthead.-type-8 .masthead-slider__nav.-prev {
    left: 12px;
  }
}

.masthead.-type-8 .masthead-slider__nav.-next {
  right: 40px;
}

@media (max-width: 767px) {
  .masthead.-type-8 .masthead-slider__nav.-next {
    right: 12px;
  }
}

.masthead.-type-9 {
  position: relative;
  z-index: 0;
}

.masthead.-type-9 .masthead__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}

.masthead.-type-9 .masthead__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.masthead.-type-9 .masthead__bg::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(2, 6, 20, 0.3);
}

.masthead.-type-9 .masthead__scroll {
  position: absolute;
  bottom: 30px;
  right: 50px;
}

@media (max-width: 1199px) {
  .masthead.-type-9 .masthead__scroll {
    display: none;
  }
}

.masthead.-type-9 .masthead__scroll .-icon {
  position: relative;
}

.masthead.-type-9 .masthead__scroll .-icon > *:nth-child(1) {
  width: 28px;
  height: 40px;
  border: 2px solid white;
  border-radius: 200px;
}

.masthead.-type-9 .masthead__scroll .-icon > *:nth-child(2) {
  position: absolute;
  top: 8px;
  left: 10px;
  width: 8px;
  height: 8px;
  border: 2px solid white;
  border-radius: 100%;
  transition: all 0.5s ease;
}

.masthead.-type-9 .masthead__scroll:hover .-icon > *:nth-child(2) {
  transform: translateY(16px);
}

.masthead.-type-9 .masthead-slider {
  position: relative;
  z-index: -1;
}

.masthead.-type-9 .masthead-slider .swiper-slide {
  padding-top: 385px;
  padding-bottom: 285px;
}

@media (max-width: 991px) {
  .masthead.-type-9 .masthead-slider .swiper-slide {
    padding-top: 200px;
    padding-bottom: 60px;
  }
}

@media (max-width: 767px) {
  .masthead.-type-9 .masthead-slider .swiper-slide {
    padding-top: 160px;
    padding-bottom: 40px;
  }
}

.masthead.-type-9 .masthead-slider__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
}

.masthead.-type-9 .masthead-slider__nav.-prev {
  left: 40px;
}

@media (max-width: 767px) {
  .masthead.-type-9 .masthead-slider__nav.-prev {
    left: 12px;
  }
}

.masthead.-type-9 .masthead-slider__nav.-next {
  right: 40px;
}

@media (max-width: 767px) {
  .masthead.-type-9 .masthead-slider__nav.-next {
    right: 12px;
  }
}

.masthead.-type-9 .mainSearch-wrap {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 2;
  display: flex;
  justify-content: flex-end;
  width: 55vw;
}

@media (max-width: 1300px) {
  .masthead.-type-9 .mainSearch-wrap {
    left: 50%;
    transform: translateX(-50%);
    justify-content: center;
    width: 100%;
    background-color: transparent !important;
  }
}

@media (max-width: 991px) {
  .masthead.-type-9 .mainSearch-wrap {
    left: unset;
    transform: none;
    position: relative;
    margin-top: 50px;
  }
}

.masthead.-type-10 {
  position: relative;
  padding-top: 360px;
  padding-bottom: 205px;
  background: linear-gradient(180deg, rgba(53, 84, 209, 0.1) 0%, rgba(196, 196, 196, 0) 100%);
}

@media (max-width: 991px) {
  .masthead.-type-10 {
    padding-top: 140px;
    padding-bottom: 60px;
  }
}

@media (max-width: 767px) {
  .masthead.-type-10 {
    padding-top: 120px;
    padding-bottom: 40px;
  }
}

.masthead.-type-10 .masthead__content {
  position: relative;
  z-index: 1;
}

.masthead.-type-10 .masthead__image {
  position: absolute;
  z-index: 0;
  display: flex;
  top: 160px;
  right: 0;
}

@media (max-width: 991px) {
  .masthead.-type-10 .masthead__image {
    top: unset;
    position: relative;
    margin-top: 30px;
  }
}

.masthead.-type-10 .container-1500 {
  margin: 0 auto;
  max-width: 1530px;
  padding: 0 15px;
}

@media (max-width: 1600px) {
  .masthead.-type-10 .container-1500 {
    max-width: 1320px;
  }
}

@media (max-width: 1399px) {
  .masthead.-type-10 .container-1500 {
    max-width: 1140px;
  }
}

@media (max-width: 1199px) {
  .masthead.-type-10 .container-1500 {
    max-width: 960px;
  }
}

@media (max-width: 991px) {
  .masthead.-type-10 .container-1500 {
    max-width: 720px;
  }
}

@media (max-width: 767px) {
  .masthead.-type-10 .container-1500 {
    max-width: 540px;
  }
}

@media (max-width: 575px) {
  .masthead.-type-10 .container-1500 {
    max-width: 100%;
  }
}

.masthead.-type-10 .mainSearch .button-grid {
  grid-template-columns: 1fr 1fr auto auto auto auto;
}

@media (max-width: 991px) {
  .masthead.-type-10 .mainSearch .button-grid {
    grid-template-columns: 1fr;
  }
}

.citiesCard.-type-1 {
  position: relative;
  z-index: 0;
}

.citiesCard.-type-1 .citiesCard__image {
  border-radius: inherit;
}

.citiesCard.-type-1 .citiesCard__image img {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: inherit;
}

.citiesCard.-type-1 .citiesCard__content {
  overflow: hidden;
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: inherit;
}

.citiesCard.-type-1 .citiesCard__bg {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(5, 16, 54, 0.4);
  border-radius: inherit;
  transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
  opacity: 0;
}

.citiesCard.-type-1 .citiesCard__top {
  transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
  opacity: 0;
}

.citiesCard.-type-1 .citiesCard__bottom {
  transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
  transform: translateY(80px);
}

.citiesCard.-type-1:hover {
  cursor: pointer;
}

.citiesCard.-type-1:hover .citiesCard__top {
  opacity: 1;
}

.citiesCard.-type-1:hover .citiesCard__bottom {
  transform: translateY(0);
}

.citiesCard.-type-1:hover .citiesCard__bg {
  opacity: 1;
}

.citiesCard.-type-2 {
  position: relative;
  z-index: 0;
}

.citiesCard.-type-2 .citiesCard__image {
  overflow: hidden;
}

.citiesCard.-type-2 .citiesCard__image img {
  transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.citiesCard.-type-2:hover {
  cursor: pointer;
}

.citiesCard.-type-2:hover .citiesCard__image img {
  transform: scale(1.15);
}

.citiesCard.-type-3 {
  position: relative;
  overflow: hidden;
  z-index: 0;
}

@media (max-width: 575px) {
  .citiesCard.-type-3 {
    width: 100%;
    padding-bottom: 100%;
  }
  .citiesCard.-type-3 > * {
    position: absolute;
    top: 0;
    left: 0;
  }
}

.citiesCard.-type-3 .citiesCard__image {
  overflow: hidden;
  border-radius: inherit;
  width: 100%;
  height: 100%;
}

.citiesCard.-type-3 .citiesCard__image img {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
  transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.citiesCard.-type-3 .citiesCard__content {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: inherit;
}

.citiesCard.-type-3 .citiesCard__content::before {
  content: "";
  position: absolute;
  border-radius: inherit;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(5, 16, 54, 0.6) 0%, rgba(5, 16, 54, 0) 63.5%);
}

.citiesCard.-type-3:hover .citiesCard__image img {
  transform: scale(1.1);
}

.citiesCard.-type-4 .citiesCard__image {
  overflow: hidden;
}

.citiesCard.-type-4 .citiesCard__image img {
  transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.citiesCard.-type-4:hover .citiesCard__image img {
  transform: scale(1.1);
}

.citiesCard.-type-5 {
  transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.citiesCard.-type-5:hover {
  background-color: var(--color-blue-1) !important;
}

.citiesCard.-type-5:hover * {
  color: white !important;
}

.ctaCard.-type-1 {
  position: relative;
  z-index: 0;
}

.ctaCard.-type-1 .ctaCard__image {
  border-radius: inherit;
}

.ctaCard.-type-1 .ctaCard__image img {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: inherit;
}

.ctaCard.-type-1 .ctaCard__content {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: inherit;
}

.ctaCard.-type-1 .ctaCard__content::before {
  content: "";
  border-radius: inherit;
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(5, 16, 54, 0.7) 0%, rgba(5, 16, 54, 0) 100%);
}

.ctaCard.-type-1.-no-overlay .ctaCard__content::before {
  display: none;
}

.tabs__content {
  position: relative;
}

.tabs__pane {
  position: absolute;
  top: 0;
  visibility: hidden;
  transition: none;
  opacity: 0;
}

.tabs__pane.is-tab-el-active {
  transition: opacity 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) 0.1s;
  position: relative;
  opacity: 1;
  visibility: visible;
}

.tabs.-pills .tabs__controls .tabs__button {
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.tabs.-pills .tabs__controls .tabs__button:hover {
  color: var(--color-blue-1) !important;
}

.tabs.-pills .tabs__controls .tabs__button.is-tab-el-active {
  color: var(--color-blue-1) !important;
  background-color: rgba(53, 84, 209, 0.05);
}

.tabs.-pills-2 .tabs__controls .tabs__button {
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.tabs.-pills-2 .tabs__controls .tabs__button:hover {
  color: var(--color-blue-1) !important;
}

.tabs.-pills-2 .tabs__controls .tabs__button.is-tab-el-active {
  color: var(--color-white) !important;
  background-color: var(--color-blue-1) !important;
}

.tabs.-pills-3 .tabs__controls .tabs__button {
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.tabs.-pills-3 .tabs__controls .tabs__button:hover {
  color: var(--color-dark-3) !important;
}

.tabs.-pills-3 .tabs__controls .tabs__button.is-tab-el-active {
  color: var(--color-white) !important;
  background-color: var(--color-dark-3) !important;
}

.tabs__controls {
  position: relative;
  overflow: auto;
  scroll-snap-type: x mandatory;
  white-space: nowrap;
}

.tabs__controls > div {
  scroll-snap-align: center;
}

.tabs.-bookmark .tabs__controls {
  position: relative;
  overflow: auto;
  scroll-snap-type: x mandatory;
}

.tabs.-bookmark .tabs__controls > div {
  scroll-snap-align: center;
}

.tabs.-bookmark .tabs__button {
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1.3;
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.tabs.-bookmark .tabs__button:hover {
  color: var(--color-blue-1) !important;
}

.tabs.-bookmark .tabs__button.is-tab-el-active {
  color: var(--color-dark-1) !important;
  background-color: white;
}

.tabs.-bookmark-2 .tabs__controls {
  position: relative;
  overflow: auto;
  scroll-snap-type: x mandatory;
}

.tabs.-bookmark-2 .tabs__controls > div {
  scroll-snap-align: center;
}

.tabs.-bookmark-2 .tabs__button {
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1.3;
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.tabs.-bookmark-2 .tabs__button:hover {
  color: var(--color-blue-1) !important;
}

.tabs.-bookmark-2 .tabs__button.is-tab-el-active {
  color: white !important;
  background-color: rgba(255, 255, 255, 0.1);
}

.tabs.-underline .tabs__controls .tabs__button {
  position: relative;
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.tabs.-underline .tabs__controls .tabs__button::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background-color: white;
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
  opacity: 0;
}

.tabs.-underline .tabs__controls .tabs__button:hover {
  color: var(--color-blue-1) !important;
}

.tabs.-underline .tabs__controls .tabs__button.is-tab-el-active::after {
  opacity: 1;
}

.tabs.-underline-2 .tabs__controls .tabs__button {
  position: relative;
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.tabs.-underline-2 .tabs__controls .tabs__button::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  background-color: var(--color-blue-1);
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
  opacity: 0;
}

.tabs.-underline-2 .tabs__controls .tabs__button:hover {
  color: var(--color-blue-1) !important;
}

.tabs.-underline-2 .tabs__controls .tabs__button.is-tab-el-active {
  color: var(--color-blue-1) !important;
}

.tabs.-underline-2 .tabs__controls .tabs__button.is-tab-el-active::after {
  opacity: 1;
}

.accordion__icon {
  position: relative;
}

.accordion__icon .icon {
  transition: all 0.2s ease-out;
}

.accordion__icon .icon:nth-child(1) {
  position: absolute;
  top: 0;
  left: 0;
}

.accordion__icon .icon:nth-child(2) {
  position: relative;
  transform: rotate(-90deg);
  opacity: 0;
}

.accordion__item.is-active .accordion__icon > *:nth-child(1) {
  transform: rotate(90deg);
  opacity: 0;
}

.accordion__item.is-active .accordion__icon > *:nth-child(2) {
  transform: none;
  opacity: 1;
}

.accordion__content {
  overflow: hidden;
  max-height: 0;
  transition: max-height 0.2s ease-out;
}

.accordion__button {
  cursor: pointer;
}

.accordion.-simple .accordion__button {
  cursor: pointer;
  transition: 0.4s;
}

.accordion.-simple .accordion__button button {
  color: var(--text-dark-1);
}

.accordion.-simple .accordion__icon {
  transition: all 0.2s ease-out;
}

.accordion.-simple .accordion__icon > *:nth-child(1) {
  position: absolute;
  transition: all 0.2s ease-out;
}

.accordion.-simple .accordion__icon > *:nth-child(2) {
  position: relative;
  transform: rotate(-90deg);
  opacity: 0;
  transition: all 0.2s ease-out;
}

.accordion.-simple .accordion__item.is-active .accordion__icon {
  background-color: var(--color-dark-1) !important;
  color: white !important;
}

.accordion.-simple .accordion__item.is-active .accordion__icon > *:nth-child(1) {
  transform: rotate(90deg);
  opacity: 0;
}

.accordion.-simple .accordion__item.is-active .accordion__icon > *:nth-child(2) {
  transform: none;
  opacity: 1;
}

.accordion.-map .accordion__icon {
  transition: all 0.2s ease-out;
}

.accordion.-map .accordion__item.is-active .accordion__icon {
  background-color: var(--color-blue-1) !important;
  color: white !important;
}

.accordion.-map .accordion__item.is-active .accordion__icon > * {
  transform: none !important;
  opacity: 1 !important;
}

.accordion.-db-sidebar .accordion__button {
  cursor: pointer;
  transition: 0.4s;
}

.accordion.-db-sidebar .accordion__button button {
  color: var(--text-dark-1);
}

.accordion.-db-sidebar .accordion__icon {
  transition: all 0.2s ease-out;
}

.accordion.-db-sidebar .accordion__icon > *:nth-child(1) {
  position: absolute;
  transition: all 0.2s ease-out;
}

.accordion.-db-sidebar .accordion__icon > *:nth-child(2) {
  position: relative;
  transform: rotate(-90deg);
  opacity: 0;
  transition: all 0.2s ease-out;
}

.accordion.-db-sidebar .accordion__item.is-active .sidebar__button {
  background-color: rgba(53, 84, 209, 0.05) !important;
  color: var(--color-blue-1) !important;
}

.accordion.-db-sidebar .accordion__item.is-active .accordion__icon {
  background-color: var(--color-dark-1) !important;
  color: white !important;
}

.accordion.-db-sidebar .accordion__item.is-active .accordion__icon > *:nth-child(1) {
  transform: rotate(90deg);
  opacity: 0;
}

.accordion.-db-sidebar .accordion__item.is-active .accordion__icon > *:nth-child(2) {
  transform: none;
  opacity: 1;
}

.header-margin {
  margin-top: 90px;
}

@media (max-width: 767px) {
  .header-margin {
    margin-top: 80px;
  }
}

.header {
  position: fixed;
  z-index: 1000;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  width: 100%;
  height: 90px;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

@media (max-width: 767px) {
  .header {
    height: 80px;
  }
}

.header.-fixed {
  position: absolute !important;
}

.header .is-menu-opened-hide {
  transition: opacity 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.header.is-menu-opened {
  background-color: white !important;
  border-bottom: 1px solid var(--color-border);
}

.header.is-menu-opened .is-menu-opened-hide {
  opacity: 0;
  pointer-events: none;
}

.header.is-sticky {
  margin: 0 !important;
}

.header .row {
  flex-wrap: nowrap;
}

.header__container {
  width: 100%;
}

.header__container-1500 {
  max-width: 1560px;
}

.header .header-logo {
  position: relative;
}

.header .header-logo img {
  width: 140px;
}

@media (max-width: 767px) {
  .header .header-logo img {
    max-width: 120px;
  }
}

.header .header-logo img:nth-child(2) {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}

.header .header-logo.is-logo-dark img:nth-child(1) {
  opacity: 0;
}

.header .header-logo.is-logo-dark img:nth-child(2) {
  opacity: 1;
}

.header.-type-2 {
  margin-top: 20px;
  transition: background-color 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), margin 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
}

@media (max-width: 1199px) {
  .header.-type-2 {
    margin-top: 0;
  }
}

.header.-type-2.is-sticky {
  margin: 0;
}

@media (max-width: 1199px) {
  .header.-type-2 .col-auto-menu {
    position: absolute;
  }
}

@media (max-width: 767px) {
  .header.-type-5 .header__buttons > *:nth-child(1) {
    color: white !important;
    background-color: var(--color-dark-1) !important;
    border-color: var(--color-dark-1) !important;
  }
  .header.-type-5 .header__buttons > *:nth-child(1):hover {
    background-color: var(--color-blue-1) !important;
    color: white !important;
    border-color: var(--color-blue-1) !important;
  }
  .header.-type-5 .header__buttons > *:nth-child(2) {
    color: var(--color-dark-1) !important;
    border-color: var(--color-dark-1) !important;
  }
  .header.-type-5 .header__buttons > *:nth-child(2):hover {
    background-color: var(--color-blue-1) !important;
    color: white !important;
    border-color: var(--color-blue-1) !important;
  }
}

.header.-type-5.-header-5-sticky {
  background-color: white !important;
  box-shadow: 0px 10px 30px 0px #05103608;
}

.header.-type-5.-header-5-sticky .header__buttons > *:nth-child(1) {
  color: white !important;
  background-color: var(--color-dark-1) !important;
  border-color: var(--color-dark-1) !important;
}

.header.-type-5.-header-5-sticky .header__buttons > *:nth-child(1):hover {
  background-color: var(--color-blue-1) !important;
  color: white !important;
  border-color: var(--color-blue-1) !important;
}

.header.-type-5.-header-5-sticky .header__buttons > *:nth-child(2) {
  color: var(--color-dark-1) !important;
  border-color: var(--color-dark-1) !important;
}

.header.-type-5.-header-5-sticky .header__buttons > *:nth-child(2):hover {
  background-color: var(--color-blue-1) !important;
  color: white !important;
  border-color: var(--color-blue-1) !important;
}

@media (max-width: 1199px) {
  .header.-type-9 .header-menu {
    top: 120px;
    height: calc(100vh - 120px);
  }
}

.header.-dashboard .header__container {
  display: flex;
  align-items: center;
}

.header.-dashboard .header__container > .row {
  width: 100%;
}

.header.-dashboard .-left-side {
  flex-shrink: 0;
  width: calc(var(--dashboard-width) - 30px);
}

@media (max-width: 991px) {
  .header.-dashboard .-left-side {
    width: auto;
  }
}

@media (min-width: 1200px) {
  .header .header-menu .menu li {
    position: relative;
  }
  .header .header-menu .menu li a {
    cursor: pointer;
  }
  .header .header-menu .menu li:hover > .subnav {
    opacity: 1;
    pointer-events: auto;
  }
  .header .header-menu .menu li.-has-mega-menu:hover > .mega {
    opacity: 1 !important;
    pointer-events: auto !important;
  }
  .header .header-menu .menu a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 15px;
    transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
  }
  .header .header-menu .menu__nav {
    display: flex;
  }
  .header .header-menu .menu__nav > li {
    padding: 25px 0;
  }
  .header .header-menu .menu__nav > li.menu-item-has-children > a .icon {
    font-size: 7px;
  }
  .header .header-menu .menu__nav > li > .subnav::before {
    content: '';
    position: absolute;
    top: -5px;
    left: 20px;
    width: 10px;
    height: 10px;
    background-color: white;
    transform: rotate(45deg);
  }
  .header .header-menu .menu__nav a {
    padding: 0 10px;
  }
  .header .header-menu .menu .subnav {
    position: absolute;
    top: 100%;
    background-color: white;
    border-radius: 4px;
    color: var(--color-dark-1) !important;
    min-width: 240px;
    padding: 20px;
    box-shadow: 0px 10px 60px 0px #0510360D;
    opacity: 0;
    pointer-events: none;
    transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
  }
  .header .header-menu .menu .subnav__backBtn {
    display: none;
  }
  .header .header-menu .menu .subnav .subnav {
    top: 0;
    left: 100%;
  }
  .header .header-menu .menu .subnav > li > a {
    padding: 5px 15px;
    border-radius: 4px;
  }
  .header .header-menu .menu .subnav > li > a:hover {
    color: var(--color-blue-1);
    background-color: rgba(53, 84, 209, 0.05);
  }
  .header .header-menu .menu .mega-mobile {
    display: none;
  }
  .header .header-menu .menu .mega {
    position: absolute;
    top: 100%;
    background-color: white;
    padding: 30px;
    border-radius: 4px;
    color: var(--color-dark-1);
    width: 800px;
    box-shadow: 0px 10px 30px 0px #05103608;
    transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
    opacity: 0;
    pointer-events: none;
  }
  .header .header-menu .menu .mega__content {
    display: flex;
    justify-content: space-between;
  }
  .header .header-menu .menu .mega__grid {
    display: grid;
    grid-gap: 60px;
    gap: 60px;
    grid-template-columns: auto auto auto;
  }
  .header .header-menu .menu .mega__image {
    width: 270px;
  }
  .header .header-menu .menu .mega__image img {
    width: 100%;
    min-height: 300px;
    object-fit: cover;
  }
  .header .header-menu .menu .mega a {
    padding-left: 0px;
    padding-right: 0px;
  }
  .header .header-menu .menu__backButton {
    display: none;
  }
  .header .header-menu .mobile-overlay {
    display: none;
  }
  .header .header-menu .mobile-bg {
    display: none;
  }
  .header .header-menu .mobile-back-button {
    display: none;
  }
  .header .header-menu .mobile-footer {
    display: none;
  }
}

@media (max-width: 1199px) {
  .header .header-menu {
    position: fixed;
    top: 80px;
    left: 0;
    z-index: 10;
    width: 100vw;
    height: calc(100vh - 80px);
    transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
    opacity: 0;
    pointer-events: none;
  }
  .header .header-menu.is-menu-active {
    opacity: 1;
    pointer-events: auto;
  }
  .header .header-menu.is-menu-active .-is-active {
    pointer-events: auto !important;
    overflow-y: scroll;
    overflow-x: hidden;
  }
  .header .header-menu .mega {
    display: none;
  }
  .header .header-menu ul {
    overflow-y: hidden;
    overflow-x: hidden;
  }
  .header .header-menu__content {
    display: flex;
    flex-direction: column;
    height: 100%;
  }
  .header .header-menu .mobile-overlay {
    display: none;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(5, 16, 54, 0.7);
    z-index: -2;
  }
  .header .header-menu .mobile-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    background-color: white;
  }
  .header .header-menu .menu {
    overflow-y: hidden;
    overflow-x: hidden;
    position: relative;
    height: 100%;
    padding: 20px;
    padding-top: 40px;
  }
  .header .header-menu .menu ul {
    pointer-events: none;
  }
  .header .header-menu .menu li {
    overflow: hidden;
  }
  .header .header-menu .menu a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 50px;
    padding: 0 20px;
    border-radius: 4px;
    font-weight: 500;
    color: var(--color-dark-1);
    transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
  }
  .header .header-menu .menu a .icon {
    font-size: 8px;
    transform: rotate(-90deg);
  }
  .header .header-menu .menu a:hover {
    color: var(--color-blue-1);
  }
  .header .header-menu .menu__nav {
    display: flex;
    flex-direction: column;
  }
  .header .header-menu .menu__nav > li > a {
    font-size: 20px;
  }
  .header .header-menu .menu__nav > li > a:hover {
    background-color: rgba(53, 84, 209, 0.05) !important;
  }
  .header .header-menu .menu .subnav {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding-top: 40px;
  }
  .header .header-menu .menu .subnav li {
    padding: 0 20px;
  }
  .header .header-menu .menu .subnav a {
    height: 40px;
    font-size: 18px;
    padding: 0 20px;
    transform: translateY(100%);
  }
  .header .header-menu .menu .subnav__backBtn {
    margin-bottom: 20px;
  }
  .header .header-menu .menu .subnav__backBtn li {
    padding: 0;
  }
  .header .header-menu .menu .subnav__backBtn a {
    justify-content: flex-start;
    height: 50px;
    font-size: 20px;
    color: var(--color-blue-1);
    background-color: rgba(53, 84, 209, 0.05) !important;
  }
  .header .header-menu .menu .subnav__backBtn a .icon {
    margin-right: 12px;
    transform: rotate(90deg);
  }
}

.cardImage {
  position: relative;
  z-index: 0;
  border-radius: inherit;
}

.cardImage:hover .cardImage-slider__nav {
  opacity: 1 !important;
}

.cardImage:hover .pagination__item {
  opacity: 1 !important;
}

.cardImage__content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  border-radius: inherit;
}

.cardImage__content > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
}

.cardImage .cardImage-slider .swiper-wrapper {
  position: relative;
  z-index: 0;
}

.cardImage .cardImage-slider__pagination {
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  color: rgba(255, 255, 255, 0.7);
}

.cardImage .cardImage-slider__pagination.-sm {
  bottom: 15px;
}

.cardImage .cardImage-slider__pagination > * + * {
  margin-left: 7px;
}

.cardImage .cardImage-slider__pagination .pagination__item {
  height: 8px;
  width: 8px;
  border-radius: 100%;
  background-color: currentColor;
  transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
  transform: scale(0.75);
  opacity: 0;
}

.cardImage .cardImage-slider__pagination .pagination__item.is-active {
  transform: scale(1);
  background-color: var(--color-white);
  opacity: 1;
}

.cardImage .cardImage-slider__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  transition: opacity 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
  opacity: 0;
}

.cardImage .cardImage-slider__nav.-prev {
  left: 20px;
}

.cardImage .cardImage-slider__nav.-next {
  right: 20px;
}

.cardImage__wishlist {
  position: absolute;
  top: 20px;
  right: 20px;
}

.cardImage__wishlist.-sm {
  top: 10px;
  right: 10px;
}

.cardImage__leftBadge {
  position: absolute;
  top: 20px;
  left: 0;
}

.footer.-dashboard {
  border-top: 1px solid var(--color-border);
}

.footer.-dashboard .footer__row {
  padding: 15px 0;
}

.mainSearch {
  position: relative;
  z-index: 20;
}

@media (max-width: 991px) {
  .mainSearch {
    width: 100%;
    border-radius: 4px !important;
  }
}

.mainSearch .button-grid {
  display: grid;
  grid-template-columns: 1fr 250px 290px auto;
}

.mainSearch .button-grid > * + * {
  border-left: 1px solid var(--color-border);
}

@media (max-width: 991px) {
  .mainSearch .button-grid {
    grid-template-columns: 1fr;
  }
  .mainSearch .button-grid > * + * {
    border-left: 0;
    border-top: 1px solid var(--color-border);
  }
}

.mainSearch .button-item {
  border: none !important;
}

@media (max-width: 991px) {
  .mainSearch__submit {
    border-radius: 4px !important;
  }
}

.mainSearch.-col-2 .button-grid {
  grid-template-columns: 1fr 1fr min-content;
}

@media (max-width: 991px) {
  .mainSearch.-col-2 .button-grid {
    grid-template-columns: 1fr;
  }
}

.mainSearch.-col-4 .button-grid {
  grid-template-columns: auto auto 200px 200px min-content;
}

@media (max-width: 991px) {
  .mainSearch.-col-4 .button-grid {
    grid-template-columns: 1fr;
  }
}

.mainSearch.-col-3-big .button-grid {
  grid-template-columns: 1fr 0.6fr 0.6fr auto;
}

@media (max-width: 991px) {
  .mainSearch.-col-3-big .button-grid {
    grid-template-columns: 1fr;
  }
}

.mainSearch.-col-5 .button-grid {
  grid-template-columns: auto auto auto auto auto min-content;
}

@media (max-width: 991px) {
  .mainSearch.-col-5 .button-grid {
    grid-template-columns: 1fr;
  }
  .mainSearch.-col-5 .button-grid > * + * {
    border-left: 0;
    border-top: 1px solid var(--color-border);
  }
}

.mainSearch.-w-900 {
  width: 900px;
}

@media (max-width: 991px) {
  .mainSearch.-w-900 {
    width: auto;
  }
}

.mainSearch.-w-1070 {
  width: 1070px;
  max-width: 100%;
}

@media (max-width: 991px) {
  .mainSearch.-w-1070 {
    width: auto;
  }
}

.searchMenu-loc {
  position: relative;
}

.searchMenu-loc__field {
  position: absolute;
  margin-top: 30px;
  top: 100%;
  left: 0;
  z-index: 20;
  width: 500px;
  max-width: 100vw;
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
  pointer-events: none;
  opacity: 0;
}

@media (max-width: 991px) {
  .searchMenu-loc__field {
    width: auto;
    left: -20px;
    right: -20px;
  }
}

@media (max-width: 575px) {
  .searchMenu-loc__field {
    left: -35px;
    right: -35px;
  }
}

.searchMenu-loc__field.-is-active {
  pointer-events: auto;
  opacity: 1;
}

.searchMenu-loc .-link:hover {
  background-color: rgba(53, 84, 209, 0.05) !important;
}

.searchMenu-date {
  position: relative;
}

.searchMenu-date.-left .searchMenu-date__field {
  transform: none !important;
}

.searchMenu-date.-right .searchMenu-date__field {
  left: unset;
  right: 0;
  transform: none !important;
}

.searchMenu-date__field {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 5;
  width: 900px;
  max-width: 100vw;
  margin-top: 30px;
  box-shadow: 0px 10px 60px 0px #0510360D;
  transform: translateX(-31%);
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
  pointer-events: none;
  opacity: 0;
}

.searchMenu-date__field.-is-active {
  pointer-events: auto;
  opacity: 1;
}

@media (max-width: 991px) {
  .searchMenu-date__field {
    transform: none;
    width: auto;
    left: -20px;
    right: -20px;
  }
}

@media (max-width: 575px) {
  .searchMenu-date__field {
    left: -35px;
    right: -35px;
  }
}

.searchMenu-guests {
  position: relative;
}

.searchMenu-guests__field {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 5;
  width: 400px;
  max-width: 100vw;
  margin-top: 30px;
  box-shadow: 0px 10px 60px 0px #0510360D;
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
  pointer-events: none;
  opacity: 0;
}

@media (max-width: 991px) {
  .searchMenu-guests__field {
    width: auto;
    left: -20px;
    right: -20px;
  }
}

@media (max-width: 575px) {
  .searchMenu-guests__field {
    left: -35px;
    right: -35px;
  }
}

.searchMenu-guests__field.-is-active {
  pointer-events: auto;
  opacity: 1;
}

.featureIcon.-type-1.-hover-shadow {
  transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.featureIcon.-type-1.-hover-shadow:hover {
  box-shadow: 0px 20px 40px 0px #05103612;
}

.testimonials-slider-2 .swiper-slide {
  opacity: 0.8;
}

.testimonials-slider-2 .swiper-slide.swiper-slide-active {
  opacity: 1;
}

.testimonials.-type-2 .testimonials__image {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 0;
}

.testimonials.-type-2 .testimonials__image > img:nth-child(2) {
  position: absolute;
  z-index: 1;
  width: 96px;
  height: 96px;
  object-fit: cover;
}

.pagination.-dots {
  display: flex;
}

.pagination.-dots > * {
  margin: 0 5px;
}

.pagination.-dots .pagination__item {
  background-color: currentColor;
  height: 8px;
  width: 8px;
  border-radius: 100%;
  transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
  transform: scale(0.75);
}

.pagination.-dots .pagination__item.is-active {
  background-color: var(--color-blue-1);
  transform: scale(1);
}

.arrow-left-hover {
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}

.arrow-left-hover:hover {
  color: var(--color-purple-1);
  transform: translateX(-5px) scale(1.25);
}

.arrow-right-hover {
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}

.arrow-right-hover:hover {
  color: var(--color-purple-1);
  transform: translateX(5px) scale(1.25);
}

.pagination.-buttons {
  display: flex;
  align-items: center;
}

.pagination.-buttons > * + * {
  margin-left: 40px;
}

.pagination.-buttons .pagination__button {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 45px;
  width: 45px;
  border-radius: 100%;
  background-color: var(--color-light-7);
  color: var(--color-purple-1);
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}

.pagination.-buttons .pagination__button .icon {
  font-size: 12px;
}

.pagination.-buttons .pagination__button:hover {
  background-color: var(--color-purple-1);
  color: white;
}

.pagination.-buttons .pagination__count > * {
  position: relative;
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  color: var(--color-dark-1);
}

.pagination.-buttons .pagination__count > * + * {
  margin-left: 30px;
}

.pagination.-buttons .pagination__count a::after {
  content: "";
  position: absolute;
  bottom: -4px;
  left: 50%;
  width: 16px;
  height: 2px;
  transform: translateX(-50%);
  background-color: var(--color-purple-1);
  transition: all 0.2s cubic-bezier(0.215, 0.61, 0.355, 1);
  opacity: 0;
}

.pagination.-buttons .pagination__count a.-count-is-active {
  color: var(--color-purple-1);
}

.pagination.-buttons .pagination__count a.-count-is-active::after {
  opacity: 1;
}

.pagination.-avatars {
  display: flex;
  align-items: center;
}

.pagination.-avatars .pagination__item {
  display: flex;
  align-items: center;
  justify-content: center;
}

.pagination.-avatars .pagination__item::before {
  content: "";
  position: absolute;
  border-radius: 100%;
  width: 92px;
  height: 92px;
  border: 2px solid var(--color-dark-1);
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  opacity: 0;
}

.pagination.-avatars .pagination__item.is-active::before {
  opacity: 1;
}

:root {
  --dashboard-width: 300px;
}

@media (max-width: 1199px) {
  :root {
    --dashboard-width: 250px;
  }
}

.dashboard {
  display: flex;
}

@media (max-width: 991px) {
  .dashboard {
    flex-direction: column;
  }
}

.dashboard__main {
  overflow: hidden;
  width: 100%;
  padding-left: var(--dashboard-width);
  will-change: padding-left;
  transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
}

.dashboard__main::after {
  content: "";
  display: none;
  position: fixed;
  z-index: 50;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: rgba(0, 0, 0, 0.5);
  transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
  pointer-events: none;
  opacity: 0;
}

@media (max-width: 991px) {
  .dashboard__main {
    padding-left: 0;
  }
  .dashboard__main::after {
    display: block;
  }
}

.dashboard__content {
  width: 100%;
  padding: 60px;
  padding-bottom: 0;
}

@media (max-width: 767px) {
  .dashboard__content {
    padding: 30px;
    padding-bottom: 0;
  }
}

@media (max-width: 575px) {
  .dashboard__content {
    padding: 20px;
    padding-bottom: 0;
  }
}

.dashboard__sidebar {
  overflow-y: scroll;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 100;
  width: var(--dashboard-width);
  height: calc(100% - 90px);
  padding: 30px;
  padding-top: 60px;
  padding-bottom: 40px;
  will-change: transform;
  transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
}

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

@media (max-width: 767px) {
  .dashboard__sidebar {
    width: 80%;
    height: calc(100% - 80px);
  }
}

@media (max-width: 991px) {
  .dashboard.-is-sidebar-open .dashboard__sidebar {
    transform: none;
  }
  .dashboard.-is-sidebar-open .dashboard__main::after {
    pointer-events: auto;
    opacity: 1;
  }
}

@media (min-width: 992px) {
  .dashboard.-is-sidebar-open .dashboard__sidebar {
    transform: translateX(-100%);
  }
  .dashboard.-is-sidebar-open .dashboard__main {
    padding-left: 0;
  }
  .dashboard.-is-sidebar-open .dashboard__main::after {
    pointer-events: auto;
    opacity: 1;
  }
}

.sidebar.-dashboard .sidebar__item {
  border: none;
}

.sidebar.-dashboard .sidebar__button {
  display: flex;
  align-items: center;
  border-radius: 4px;
  padding: 0 15px;
  height: 55px;
}

@media (max-width: 575px) {
  .sidebar.-dashboard .sidebar__button {
    height: 45px;
  }
}

.sidebar.-dashboard .sidebar__button.-is-active {
  background-color: rgba(53, 84, 209, 0.05);
  color: var(--color-blue-1) !important;
}

.scroll-bar-1::-webkit-scrollbar {
  width: 4px;
  height: 4px;
}

.scroll-bar-1::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.3);
  border-radius: 12px;
}

.dropdown {
  cursor: pointer;
  position: relative;
  display: flex;
  align-items: center;
  border-radius: 8px;
}

.dropdown__button {
  height: 40px;
}

.dropdown .icon {
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.dropdown.-is-dd-active .border-light {
  border: 2px solid var(--color-dark-1) !important;
}

.dropdown.-is-dd-active .icon {
  transform: rotate(180deg);
}

.dropdown__item {
  position: absolute;
  z-index: 500;
  pointer-events: none;
  top: 100%;
  left: 50%;
  padding: 26px;
  background-color: white;
  box-shadow: 0px 25px 70px rgba(1, 33, 58, 0.07);
  min-width: 180px;
  border-radius: 8px;
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
  transform: translateX(-50%);
  opacity: 0;
}

.dropdown:hover .dropdown__item {
  z-index: 20;
  transform: translateX(-50%);
  opacity: 1;
  pointer-events: auto;
}

.toggle-element {
  transition: all 0.2s cubic-bezier(0.215, 0.61, 0.355, 1);
  opacity: 0;
  pointer-events: none;
}

.toggle-element.-down {
  transform: translateY(20px);
}

.toggle-element.-is-el-visible {
  z-index: 25;
  transform: none;
  opacity: 1;
  pointer-events: auto;
}

.toggle-element.-dropdown {
  position: absolute;
  top: calc(100% + 10px);
  left: 50%;
  padding: 14px 20px;
  background-color: white;
  box-shadow: 0px 25px 70px rgba(1, 33, 58, 0.07);
  min-width: 160px;
  border-radius: 4px;
  border: 1px solid var(--color-border);
  font-weight: 500;
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
  transform: translateX(-50%);
}

.toggle-element.-dropdown-2 {
  position: absolute;
  top: 100%;
  left: 50%;
  padding: 10px;
  background-color: white;
  box-shadow: 0px 25px 70px rgba(1, 33, 58, 0.07);
  min-width: 120px;
  border-radius: 4px;
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
  transform: translateX(-50%);
}

.toggle-element.-dropdown-2 a {
  padding: 10px;
}

.toggle-element.-dropdown-2 a:hover {
  background-color: var(--color-light-2);
  color: var(--color-dark-1);
}

.blogCard.-type-1 .blogCard__image {
  overflow: hidden;
}

.blogCard.-type-1 .blogCard__image img {
  transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.blogCard.-type-1:hover .blogCard__image img {
  transform: scale(1.1);
}

.blogCard.-type-2 .blogCard__image {
  overflow: hidden;
}

.blogCard.-type-2 .blogCard__image img {
  transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.blogCard.-type-2:hover .blogCard__image img {
  transform: scale(1.15);
}

.blogCard.-type-3 {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
}

.blogCard.-type-3 .blogCard__image {
  overflow: hidden;
  position: relative;
  width: 100%;
  height: 100%;
}

.blogCard.-type-3 .blogCard__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.blogCard.-type-3 .blogCard__content {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(5, 16, 54, 0) 0%, rgba(5, 16, 54, 0.7) 100%);
  padding-left: 50px;
  padding-bottom: 30px;
  padding: 20px 20px;
}

.blogCard.-type-3:hover .blogCard__image img {
  transform: scale(1.1);
}

[data-slider] > div > [data-sign] {
  background-color: unset;
  width: unset;
  height: unset;
  border-radius: unset;
  display: inline-block;
  text-align: unset;
  margin-top: 22px;
  color: black;
}

[data-slider] > div > [data-sign]:last-child {
  float: right;
}

[data-slider] > div > [data-sign] span::before {
  content: 'Min Price: $';
  display: inline-block;
}

[data-slider] > div > [data-sign]:last-child span::before {
  content: 'Max Price: $';
  display: inline-block;
}

[data-slider] > div > [data-sign] > span {
  font-size: 14px;
  line-height: 16px;
}

[data-slider] {
  position: relative;
  border-radius: 10px;
  text-align: left;
}

[data-slider] > div {
  width: 100%;
}

[data-slider] > div > [data-inverse-left] {
  position: absolute;
  left: 0;
  height: 5px;
  border-radius: 10px;
  background-color: var(--color-blue-2);
}

[data-slider] > div > [data-inverse-right] {
  position: absolute;
  right: 0;
  height: 5px;
  border-radius: 10px;
  background-color: var(--color-blue-2);
}

[data-slider] > div > [data-range] {
  position: absolute;
  left: 0;
  height: 5px;
  border-radius: 14px;
  background-color: var(--color-blue-1);
}

[data-slider] > div > [data-thumb] {
  position: absolute;
  top: -7px;
  z-index: 2;
  height: 17px;
  width: 17px;
  text-align: left;
  margin-left: -11px;
  cursor: pointer;
  background-color: #FFF;
  border-radius: 50%;
  outline: none;
  border: 2px solid var(--color-blue-1);
}

div[data-slider] > input[type=range]::-ms-thumb {
  pointer-events: all;
  width: 17px;
  height: 17px;
  border-radius: 0px;
  border: 0 none;
  background: red;
}

div[data-slider] > input[type=range]::-moz-range-thumb {
  pointer-events: all;
  width: 17px;
  height: 17px;
  border-radius: 0px;
  border: 0 none;
  background: red;
}

div[data-slider] > input[type=range]::-webkit-slider-thumb {
  pointer-events: all;
  width: 17px;
  height: 17px;
  border-radius: 0px;
  border: 0 none;
  background: red;
  -webkit-appearance: none;
}

div[data-slider] > input[type=range]::-ms-fill-lower {
  background: transparent;
  border: 0 none;
}

div[data-slider] > input[type=range]::-ms-fill-upper {
  background: transparent;
  border: 0 none;
}

[data-slider] > input[type=range] {
  position: absolute;
  pointer-events: none;
  -webkit-appearance: none;
  z-index: 3;
  height: 5px;
  top: -2px;
  width: 100%;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
  -moz-opacity: 0;
  -khtml-opacity: 0;
  opacity: 0;
}

div[data-slider] > input[type=range]::-ms-track {
  -webkit-appearance: none;
  background: transparent;
  color: transparent;
}

div[data-slider] > input[type=range]::-moz-range-track {
  -moz-appearance: none;
  background: transparent;
  color: transparent;
}

div[data-slider] > input[type=range]:focus::-webkit-slider-runnable-track {
  background: transparent;
  border: transparent;
}

div[data-slider] > input[type=range]:focus {
  outline: none;
}

div[data-slider] > input[type=range]::-ms-tooltip {
  display: none;
}

[data-slider] > div > [data-sign] {
  display: inline-block;
  text-align: center;
  padding: 4px 16px;
  border-radius: 8px;
  margin-top: 22px;
}

[data-slider] > div > [data-sign] > span {
  font-size: 12px;
  line-height: 28px;
}

[data-slider]:hover > div > [data-sign] {
  opacity: 1;
}

.select {
  position: relative;
}

.select__button {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 0 15px;
  height: 70px;
  border-radius: 4px;
  border: 1px solid #DDDDDD;
  background-color: white;
  text-align: left;
}

.select__icon {
  width: 20px;
  height: 20px;
}

.select__dropdown {
  position: absolute;
  top: calc(100% + 10px);
  left: 50%;
  transform: translateX(-50%);
  z-index: 30;
  display: flex;
  flex-direction: column;
  border-radius: 4px;
  border: 1px solid var(--color-light-8);
  background-color: white;
  padding: 20px;
  width: 100%;
  min-height: 150px;
  max-height: 300px;
  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.05);
  border: 1px solid #DDDDDD;
  transition: all 0.2s ease;
  pointer-events: none;
  opacity: 0;
}

.select__dropdown.-is-visible {
  opacity: 1;
  pointer-events: auto;
}

.select__options {
  display: flex;
  flex-direction: column;
  overflow-x: hidden;
  overflow-y: scroll;
}

.select__options::-webkit-scrollbar {
  width: 4px;
  height: 4px;
}

.select__options::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.2);
  border-radius: 12px;
}

.select__options__button {
  display: flex;
  align-items: center;
  font-size: 15px;
  padding: 6px 0;
  text-align: left;
  transition: all 0.15s ease;
}

.select__options__button:hover {
  cursor: pointer;
  color: var(--color-purple-1) !important;
}

.select__options__button:focus {
  color: var(--color-purple-1) !important;
}

.select__search {
  flex-shrink: 0;
  height: 50px;
  border-radius: 4px;
  background-color: #F5F5F5 !important;
  color: black;
  padding: 0 20px;
  margin-bottom: 12px;
}

.mapFilter {
  overflow: hidden;
  position: fixed;
  top: 30px;
  bottom: 70px;
  left: 30px;
  right: 30px;
  z-index: 1000;
  border-radius: 4px;
  transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  pointer-events: none;
  opacity: 0;
}

@media (max-width: 1400px) {
  .mapFilter {
    top: 20px;
    bottom: 20px;
    left: 20px;
    right: 20px;
  }
}

@media (max-width: 1199px) {
  .mapFilter {
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    border-radius: 0;
  }
}

.mapFilter.-is-active {
  pointer-events: auto;
  opacity: 1;
}

.mapFilter__overlay {
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  background-color: rgba(5, 16, 54, 0.4);
}

.mapFilter__close {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 5;
}

@media (max-width: 575px) {
  .mapFilter__close {
    right: 50%;
    transform: translateX(50%);
  }
}

.mapFilter__grid {
  display: grid;
  grid-gap: 0;
  gap: 0;
  grid-template-columns: 515px 1fr;
  width: 100%;
  height: 100%;
  background-color: white;
  padding-left: 340px;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

@media (max-width: 991px) {
  .mapFilter__grid {
    grid-template-columns: 420px 1fr;
  }
}

@media (max-width: 767px) {
  .mapFilter__grid {
    grid-template-columns: 250px 1fr;
    padding-left: 330px;
  }
  .mapFilter__grid .ratio {
    width: 100%;
    height: auto;
  }
}

@media (max-width: 575px) {
  .mapFilter__grid {
    grid-template-columns: 1fr;
  }
}

.mapFilter__grid.-filters-hidden {
  padding-left: 80px;
}

.mapFilter__grid.-filters-hidden .mapFilter-filter {
  transform: translateX(-255px);
}

@media (max-width: 767px) {
  .mapFilter__grid.-filters-hidden {
    padding-left: 70px;
  }
}

.mapFilter-filter {
  overflow-y: scroll;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  box-shadow: 0px 10px 35px 0px #0510361A;
  transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.mapFilter-filter__item {
  border-top: 1px solid var(--color-border);
  padding-top: 20px;
  margin-top: 20px;
}

.mapFilter-results {
  overflow-y: scroll;
  transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

@media (max-width: 575px) {
  .mapFilter-results {
    display: none;
  }
}

.mapFilter-results__item {
  border-top: 1px solid var(--color-border);
  padding-top: 20px;
  margin-top: 20px;
}

.mapFilter-map {
  transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.mapFilter-map img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.scroll-bar-1::-webkit-scrollbar {
  width: 4px;
  height: 4px;
}

.scroll-bar-1::-webkit-scrollbar-thumb {
  background-color: #e7e7e7;
  border-radius: 4px;
}

.hotelsCard.-type-1 .hotelsCard__image {
  overflow: hidden;
  border-radius: 4px;
}

.hotelsCard.-type-1 .hotelsCard__image .cardImage__content .swiper-slide,
.hotelsCard.-type-1 .hotelsCard__image .cardImage__content > img {
  transition: all 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.hotelsCard.-type-1 .hotelsCard__image .swiper-slide-active {
  position: relative;
  z-index: 2;
}

.hotelsCard.-type-1 .hotelsCard__title span {
  background-image: linear-gradient(transparent 24px, black 20px);
  background-size: 0;
  background-repeat: no-repeat;
  transition: background-size 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;
}

.hotelsCard.-type-1:hover .hotelsCard__image .cardImage__content > img,
.hotelsCard.-type-1:hover .hotelsCard__image .swiper-slide {
  transform: scale(1.15);
}

.hotelsCard.-type-1:hover .hotelsCard__title span {
  background-size: 100% !important;
}

.tourCard.-type-1 .tourCard__image {
  overflow: hidden;
  border-radius: 4px;
}

.tourCard.-type-1 .tourCard__image .cardImage__content .swiper-slide,
.tourCard.-type-1 .tourCard__image .cardImage__content > img {
  transition: all 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.tourCard.-type-1 .tourCard__image .swiper-slide-active {
  position: relative;
  z-index: 2;
}

.tourCard.-type-1 .tourCard__title span {
  background-image: linear-gradient(transparent 24px, black 20px);
  background-size: 0;
  background-repeat: no-repeat;
  transition: background-size 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;
}

.tourCard.-type-1:hover .tourCard__image .cardImage__content > img,
.tourCard.-type-1:hover .tourCard__image .swiper-slide {
  transform: scale(1.15);
}

.tourCard.-type-1:hover .tourCard__title span {
  background-size: 100% !important;
}

.activityCard.-type-1 .activityCard__image {
  overflow: hidden;
  border-radius: 4px;
}

.activityCard.-type-1 .activityCard__image .cardImage__content .swiper-slide,
.activityCard.-type-1 .activityCard__image .cardImage__content > img {
  transition: all 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.activityCard.-type-1 .activityCard__image .swiper-slide-active {
  position: relative;
  z-index: 2;
}

.activityCard.-type-1 .activityCard__title span {
  background-image: linear-gradient(transparent 24px, black 20px);
  background-size: 0;
  background-repeat: no-repeat;
  transition: background-size 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;
}

.activityCard.-type-1:hover .activityCard__image .cardImage__content > img,
.activityCard.-type-1:hover .activityCard__image .swiper-slide {
  transform: scale(1.15);
}

.activityCard.-type-1:hover .activityCard__title span {
  background-size: 100% !important;
}

.rentalCard.-type-1 .rentalCard__image {
  overflow: hidden;
  border-radius: 4px;
}

.rentalCard.-type-1 .rentalCard__image .cardImage__content .swiper-slide,
.rentalCard.-type-1 .rentalCard__image .cardImage__content > img {
  transition: all 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.rentalCard.-type-1 .rentalCard__image .swiper-slide-active {
  position: relative;
  z-index: 2;
}

.rentalCard.-type-1 .rentalCard__title span {
  background-image: linear-gradient(transparent 24px, black 20px);
  background-size: 0;
  background-repeat: no-repeat;
  transition: background-size 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;
}

.rentalCard.-type-1:hover .rentalCard__image .cardImage__content > img,
.rentalCard.-type-1:hover .rentalCard__image .swiper-slide {
  transform: scale(1.15);
}

.rentalCard.-type-1:hover .rentalCard__title span {
  background-size: 100% !important;
}

.rentalCard.-type-2 .rentalCard__image {
  overflow: hidden;
  border-radius: 4px;
}

.rentalCard.-type-2 .rentalCard__image .cardImage__content .swiper-slide,
.rentalCard.-type-2 .rentalCard__image .cardImage__content > img {
  transition: all 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.rentalCard.-type-2 .rentalCard__image .swiper-slide-active {
  position: relative;
  z-index: 2;
}

.rentalCard.-type-2 .rentalCard__title span {
  background-image: linear-gradient(transparent 24px, black 20px);
  background-size: 0;
  background-repeat: no-repeat;
  transition: background-size 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;
}

.rentalCard.-type-2:hover .rentalCard__image .cardImage__content > img,
.rentalCard.-type-2:hover .rentalCard__image .swiper-slide {
  transform: scale(1.15);
}

.rentalCard.-type-2:hover .rentalCard__title span {
  background-size: 100% !important;
}

.carCard.-type-1 .carCard__image {
  overflow: hidden;
  border-radius: 4px;
}

.carCard.-type-1 .carCard__image .cardImage__content .swiper-slide,
.carCard.-type-1 .carCard__image .cardImage__content > img {
  transition: all 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.carCard.-type-1 .carCard__image .swiper-slide-active {
  position: relative;
  z-index: 2;
}

.carCard.-type-1:hover .carCard__image .cardImage__content > img,
.carCard.-type-1:hover .carCard__image .swiper-slide {
  transform: scale(1.05);
}

.cruiseCard.-type-1 .cruiseCard__image {
  overflow: hidden;
  border-radius: 4px;
}

.cruiseCard.-type-1 .cruiseCard__image .cardImage__content .swiper-slide,
.cruiseCard.-type-1 .cruiseCard__image .cardImage__content > img {
  transition: all 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.cruiseCard.-type-1 .cruiseCard__image .swiper-slide-active {
  position: relative;
  z-index: 2;
}

.cruiseCard.-type-1 .cruiseCard__title span {
  background-image: linear-gradient(transparent 24px, black 20px);
  background-size: 0;
  background-repeat: no-repeat;
  transition: background-size 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;
}

.cruiseCard.-type-1:hover .cruiseCard__image .cardImage__content > img,
.cruiseCard.-type-1:hover .cruiseCard__image .swiper-slide {
  transform: scale(1.15);
}

.cruiseCard.-type-1:hover .cruiseCard__title span {
  background-size: 100% !important;
}

.tourTypeCard.-type-1 {
  transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.tourTypeCard.-type-1:hover {
  background-color: var(--color-blue-1) !important;
  transform: translateY(-10px);
}

.tourTypeCard.-type-1:hover .tourTypeCard__content > * {
  color: white !important;
}

.destCard.-type-1 {
  transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.destCard.-type-1 .destCard__image {
  overflow: hidden;
}

.destCard.-type-1 .destCard__image img {
  transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.destCard.-type-1:hover .destCard__image img {
  transform: scale(1.15);
}

.preloader {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 5000;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  background-color: white;
  transition: opacity 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.preloader__wrap {
  overflow: hidden;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 72px;
  height: 72px;
  border-radius: 30px;
  background-color: white;
  box-shadow: 0px 2px 24px 0px #00000014;
  animation-name: preloaderWraper;
  animation-iteration-count: infinite;
  animation-duration: 1.8s;
  animation-timing-function: ease;
}

.preloader__icon {
  position: absolute;
  animation-name: preloader;
  animation-iteration-count: infinite;
  animation-duration: 1.8s;
  animation-timing-function: ease;
}

.preloader__title {
  font-size: 47px;
  font-weight: 600;
  line-height: 68px;
  letter-spacing: 0em;
  margin-top: 16px;
}

.preloader.-is-hidden {
  opacity: 0;
  pointer-events: none;
}

@keyframes preloaderWraper {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.2);
  }
  100% {
    transform: none;
  }
}

@keyframes preloader {
  0% {
    transform: translateY(150%) scale(1);
  }
  50% {
    transform: translateY(0%) scale(1.2) rotate(20deg);
  }
  100% {
    transform: translateY(-150%) rotate(-20deg);
  }
}

.py-0 {
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}

.px-0 {
  padding-left: 0px !important;
  padding-right: 0px !important;
}

.pt-0 {
  padding-top: 0px !important;
}

.pb-0 {
  padding-bottom: 0px !important;
}

.pl-0 {
  padding-left: 0px !important;
}

.pr-0 {
  padding-right: 0px !important;
}

.mt-0 {
  margin-top: 0px !important;
}

.mb-0 {
  margin-bottom: 0px !important;
}

.ml-0 {
  margin-left: 0px !important;
}

.mr-0 {
  margin-right: 0px !important;
}

.py-4 {
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}

.px-4 {
  padding-left: 4px !important;
  padding-right: 4px !important;
}

.pt-4 {
  padding-top: 4px !important;
}

.pb-4 {
  padding-bottom: 4px !important;
}

.pl-4 {
  padding-left: 4px !important;
}

.pr-4 {
  padding-right: 4px !important;
}

.mt-4 {
  margin-top: 4px !important;
}

.mb-4 {
  margin-bottom: 4px !important;
}

.ml-4 {
  margin-left: 4px !important;
}

.mr-4 {
  margin-right: 4px !important;
}

.py-5 {
  padding-top: 5px !important;
  padding-bottom: 5px !important;
}

.px-5 {
  padding-left: 5px !important;
  padding-right: 5px !important;
}

.pt-5 {
  padding-top: 5px !important;
}

.pb-5 {
  padding-bottom: 5px !important;
}

.pl-5 {
  padding-left: 5px !important;
}

.pr-5 {
  padding-right: 5px !important;
}

.mt-5 {
  margin-top: 5px !important;
}

.mb-5 {
  margin-bottom: 5px !important;
}

.ml-5 {
  margin-left: 5px !important;
}

.mr-5 {
  margin-right: 5px !important;
}

.py-10 {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

.px-10 {
  padding-left: 10px !important;
  padding-right: 10px !important;
}

.pt-10 {
  padding-top: 10px !important;
}

.pb-10 {
  padding-bottom: 10px !important;
}

.pl-10 {
  padding-left: 10px !important;
}

.pr-10 {
  padding-right: 10px !important;
}

.mt-10 {
  margin-top: 10px !important;
}

.mb-10 {
  margin-bottom: 10px !important;
}

.ml-10 {
  margin-left: 10px !important;
}

.mr-10 {
  margin-right: 10px !important;
}

.py-15 {
  padding-top: 15px !important;
  padding-bottom: 15px !important;
}

.px-15 {
  padding-left: 15px !important;
  padding-right: 15px !important;
}

.pt-15 {
  padding-top: 15px !important;
}

.pb-15 {
  padding-bottom: 15px !important;
}

.pl-15 {
  padding-left: 15px !important;
}

.pr-15 {
  padding-right: 15px !important;
}

.mt-15 {
  margin-top: 15px !important;
}

.mb-15 {
  margin-bottom: 15px !important;
}

.ml-15 {
  margin-left: 15px !important;
}

.mr-15 {
  margin-right: 15px !important;
}

.py-20 {
  padding-top: 20px !important;
  padding-bottom: 20px !important;
}

.px-20 {
  padding-left: 20px !important;
  padding-right: 20px !important;
}

.pt-20 {
  padding-top: 20px !important;
}

.pb-20 {
  padding-bottom: 20px !important;
}

.pl-20 {
  padding-left: 20px !important;
}

.pr-20 {
  padding-right: 20px !important;
}

.mt-20 {
  margin-top: 20px !important;
}

.mb-20 {
  margin-bottom: 20px !important;
}

.ml-20 {
  margin-left: 20px !important;
}

.mr-20 {
  margin-right: 20px !important;
}

.py-24 {
  padding-top: 24px !important;
  padding-bottom: 24px !important;
}

.px-24 {
  padding-left: 24px !important;
  padding-right: 24px !important;
}

.pt-24 {
  padding-top: 24px !important;
}

.pb-24 {
  padding-bottom: 24px !important;
}

.pl-24 {
  padding-left: 24px !important;
}

.pr-24 {
  padding-right: 24px !important;
}

.mt-24 {
  margin-top: 24px !important;
}

.mb-24 {
  margin-bottom: 24px !important;
}

.ml-24 {
  margin-left: 24px !important;
}

.mr-24 {
  margin-right: 24px !important;
}

.py-28 {
  padding-top: 28px !important;
  padding-bottom: 28px !important;
}

.px-28 {
  padding-left: 28px !important;
  padding-right: 28px !important;
}

.pt-28 {
  padding-top: 28px !important;
}

.pb-28 {
  padding-bottom: 28px !important;
}

.pl-28 {
  padding-left: 28px !important;
}

.pr-28 {
  padding-right: 28px !important;
}

.mt-28 {
  margin-top: 28px !important;
}

.mb-28 {
  margin-bottom: 28px !important;
}

.ml-28 {
  margin-left: 28px !important;
}

.mr-28 {
  margin-right: 28px !important;
}

.py-30 {
  padding-top: 30px !important;
  padding-bottom: 30px !important;
}

.px-30 {
  padding-left: 30px !important;
  padding-right: 30px !important;
}

.pt-30 {
  padding-top: 30px !important;
}

.pb-30 {
  padding-bottom: 30px !important;
}

.pl-30 {
  padding-left: 30px !important;
}

.pr-30 {
  padding-right: 30px !important;
}

.mt-30 {
  margin-top: 30px !important;
}

.mb-30 {
  margin-bottom: 30px !important;
}

.ml-30 {
  margin-left: 30px !important;
}

.mr-30 {
  margin-right: 30px !important;
}

.py-35 {
  padding-top: 35px !important;
  padding-bottom: 35px !important;
}

.px-35 {
  padding-left: 35px !important;
  padding-right: 35px !important;
}

.pt-35 {
  padding-top: 35px !important;
}

.pb-35 {
  padding-bottom: 35px !important;
}

.pl-35 {
  padding-left: 35px !important;
}

.pr-35 {
  padding-right: 35px !important;
}

.mt-35 {
  margin-top: 35px !important;
}

.mb-35 {
  margin-bottom: 35px !important;
}

.ml-35 {
  margin-left: 35px !important;
}

.mr-35 {
  margin-right: 35px !important;
}

.py-40 {
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}

.px-40 {
  padding-left: 40px !important;
  padding-right: 40px !important;
}

.pt-40 {
  padding-top: 40px !important;
}

.pb-40 {
  padding-bottom: 40px !important;
}

.pl-40 {
  padding-left: 40px !important;
}

.pr-40 {
  padding-right: 40px !important;
}

.mt-40 {
  margin-top: 40px !important;
}

.mb-40 {
  margin-bottom: 40px !important;
}

.ml-40 {
  margin-left: 40px !important;
}

.mr-40 {
  margin-right: 40px !important;
}

.py-45 {
  padding-top: 45px !important;
  padding-bottom: 45px !important;
}

.px-45 {
  padding-left: 45px !important;
  padding-right: 45px !important;
}

.pt-45 {
  padding-top: 45px !important;
}

.pb-45 {
  padding-bottom: 45px !important;
}

.pl-45 {
  padding-left: 45px !important;
}

.pr-45 {
  padding-right: 45px !important;
}

.mt-45 {
  margin-top: 45px !important;
}

.mb-45 {
  margin-bottom: 45px !important;
}

.ml-45 {
  margin-left: 45px !important;
}

.mr-45 {
  margin-right: 45px !important;
}

.py-50 {
  padding-top: 50px !important;
  padding-bottom: 50px !important;
}

.px-50 {
  padding-left: 50px !important;
  padding-right: 50px !important;
}

.pt-50 {
  padding-top: 50px !important;
}

.pb-50 {
  padding-bottom: 50px !important;
}

.pl-50 {
  padding-left: 50px !important;
}

.pr-50 {
  padding-right: 50px !important;
}

.mt-50 {
  margin-top: 50px !important;
}

.mb-50 {
  margin-bottom: 50px !important;
}

.ml-50 {
  margin-left: 50px !important;
}

.mr-50 {
  margin-right: 50px !important;
}

.py-60 {
  padding-top: 60px !important;
  padding-bottom: 60px !important;
}

.px-60 {
  padding-left: 60px !important;
  padding-right: 60px !important;
}

.pt-60 {
  padding-top: 60px !important;
}

.pb-60 {
  padding-bottom: 60px !important;
}

.pl-60 {
  padding-left: 60px !important;
}

.pr-60 {
  padding-right: 60px !important;
}

.mt-60 {
  margin-top: 60px !important;
}

.mb-60 {
  margin-bottom: 60px !important;
}

.ml-60 {
  margin-left: 60px !important;
}

.mr-60 {
  margin-right: 60px !important;
}

.py-70 {
  padding-top: 70px !important;
  padding-bottom: 70px !important;
}

.px-70 {
  padding-left: 70px !important;
  padding-right: 70px !important;
}

.pt-70 {
  padding-top: 70px !important;
}

.pb-70 {
  padding-bottom: 70px !important;
}

.pl-70 {
  padding-left: 70px !important;
}

.pr-70 {
  padding-right: 70px !important;
}

.mt-70 {
  margin-top: 70px !important;
}

.mb-70 {
  margin-bottom: 70px !important;
}

.ml-70 {
  margin-left: 70px !important;
}

.mr-70 {
  margin-right: 70px !important;
}

.py-80 {
  padding-top: 80px !important;
  padding-bottom: 80px !important;
}

.px-80 {
  padding-left: 80px !important;
  padding-right: 80px !important;
}

.pt-80 {
  padding-top: 80px !important;
}

.pb-80 {
  padding-bottom: 80px !important;
}

.pl-80 {
  padding-left: 80px !important;
}

.pr-80 {
  padding-right: 80px !important;
}

.mt-80 {
  margin-top: 80px !important;
}

.mb-80 {
  margin-bottom: 80px !important;
}

.ml-80 {
  margin-left: 80px !important;
}

.mr-80 {
  margin-right: 80px !important;
}

.py-90 {
  padding-top: 90px !important;
  padding-bottom: 90px !important;
}

.px-90 {
  padding-left: 90px !important;
  padding-right: 90px !important;
}

.pt-90 {
  padding-top: 90px !important;
}

.pb-90 {
  padding-bottom: 90px !important;
}

.pl-90 {
  padding-left: 90px !important;
}

.pr-90 {
  padding-right: 90px !important;
}

.mt-90 {
  margin-top: 90px !important;
}

.mb-90 {
  margin-bottom: 90px !important;
}

.ml-90 {
  margin-left: 90px !important;
}

.mr-90 {
  margin-right: 90px !important;
}

.py-120 {
  padding-top: 120px !important;
  padding-bottom: 120px !important;
}

.px-120 {
  padding-left: 120px !important;
  padding-right: 120px !important;
}

.pt-120 {
  padding-top: 120px !important;
}

.pb-120 {
  padding-bottom: 120px !important;
}

.pl-120 {
  padding-left: 120px !important;
}

.pr-120 {
  padding-right: 120px !important;
}

.mt-120 {
  margin-top: 120px !important;
}

.mb-120 {
  margin-bottom: 120px !important;
}

.ml-120 {
  margin-left: 120px !important;
}

.mr-120 {
  margin-right: 120px !important;
}

@media (max-width: 1199px) {
  .xl\:py-0 {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
  }
  .xl\:px-0 {
    padding-left: 0px !important;
    padding-right: 0px !important;
  }
  .xl\:pt-0 {
    padding-top: 0px !important;
  }
  .xl\:pb-0 {
    padding-bottom: 0px !important;
  }
  .xl\:pl-0 {
    padding-left: 0px !important;
  }
  .xl\:pr-0 {
    padding-right: 0px !important;
  }
  .xl\:mt-0 {
    margin-top: 0px !important;
  }
  .xl\:mb-0 {
    margin-bottom: 0px !important;
  }
  .xl\:ml-0 {
    margin-left: 0px !important;
  }
  .xl\:mr-0 {
    margin-right: 0px !important;
  }
  .xl\:py-4 {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
  }
  .xl\:px-4 {
    padding-left: 4px !important;
    padding-right: 4px !important;
  }
  .xl\:pt-4 {
    padding-top: 4px !important;
  }
  .xl\:pb-4 {
    padding-bottom: 4px !important;
  }
  .xl\:pl-4 {
    padding-left: 4px !important;
  }
  .xl\:pr-4 {
    padding-right: 4px !important;
  }
  .xl\:mt-4 {
    margin-top: 4px !important;
  }
  .xl\:mb-4 {
    margin-bottom: 4px !important;
  }
  .xl\:ml-4 {
    margin-left: 4px !important;
  }
  .xl\:mr-4 {
    margin-right: 4px !important;
  }
  .xl\:py-5 {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
  }
  .xl\:px-5 {
    padding-left: 5px !important;
    padding-right: 5px !important;
  }
  .xl\:pt-5 {
    padding-top: 5px !important;
  }
  .xl\:pb-5 {
    padding-bottom: 5px !important;
  }
  .xl\:pl-5 {
    padding-left: 5px !important;
  }
  .xl\:pr-5 {
    padding-right: 5px !important;
  }
  .xl\:mt-5 {
    margin-top: 5px !important;
  }
  .xl\:mb-5 {
    margin-bottom: 5px !important;
  }
  .xl\:ml-5 {
    margin-left: 5px !important;
  }
  .xl\:mr-5 {
    margin-right: 5px !important;
  }
  .xl\:py-10 {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
  .xl\:px-10 {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  .xl\:pt-10 {
    padding-top: 10px !important;
  }
  .xl\:pb-10 {
    padding-bottom: 10px !important;
  }
  .xl\:pl-10 {
    padding-left: 10px !important;
  }
  .xl\:pr-10 {
    padding-right: 10px !important;
  }
  .xl\:mt-10 {
    margin-top: 10px !important;
  }
  .xl\:mb-10 {
    margin-bottom: 10px !important;
  }
  .xl\:ml-10 {
    margin-left: 10px !important;
  }
  .xl\:mr-10 {
    margin-right: 10px !important;
  }
  .xl\:py-15 {
    padding-top: 15px !important;
    padding-bottom: 15px !important;
  }
  .xl\:px-15 {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }
  .xl\:pt-15 {
    padding-top: 15px !important;
  }
  .xl\:pb-15 {
    padding-bottom: 15px !important;
  }
  .xl\:pl-15 {
    padding-left: 15px !important;
  }
  .xl\:pr-15 {
    padding-right: 15px !important;
  }
  .xl\:mt-15 {
    margin-top: 15px !important;
  }
  .xl\:mb-15 {
    margin-bottom: 15px !important;
  }
  .xl\:ml-15 {
    margin-left: 15px !important;
  }
  .xl\:mr-15 {
    margin-right: 15px !important;
  }
  .xl\:py-20 {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }
  .xl\:px-20 {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  .xl\:pt-20 {
    padding-top: 20px !important;
  }
  .xl\:pb-20 {
    padding-bottom: 20px !important;
  }
  .xl\:pl-20 {
    padding-left: 20px !important;
  }
  .xl\:pr-20 {
    padding-right: 20px !important;
  }
  .xl\:mt-20 {
    margin-top: 20px !important;
  }
  .xl\:mb-20 {
    margin-bottom: 20px !important;
  }
  .xl\:ml-20 {
    margin-left: 20px !important;
  }
  .xl\:mr-20 {
    margin-right: 20px !important;
  }
  .xl\:py-24 {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
  }
  .xl\:px-24 {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
  .xl\:pt-24 {
    padding-top: 24px !important;
  }
  .xl\:pb-24 {
    padding-bottom: 24px !important;
  }
  .xl\:pl-24 {
    padding-left: 24px !important;
  }
  .xl\:pr-24 {
    padding-right: 24px !important;
  }
  .xl\:mt-24 {
    margin-top: 24px !important;
  }
  .xl\:mb-24 {
    margin-bottom: 24px !important;
  }
  .xl\:ml-24 {
    margin-left: 24px !important;
  }
  .xl\:mr-24 {
    margin-right: 24px !important;
  }
  .xl\:py-28 {
    padding-top: 28px !important;
    padding-bottom: 28px !important;
  }
  .xl\:px-28 {
    padding-left: 28px !important;
    padding-right: 28px !important;
  }
  .xl\:pt-28 {
    padding-top: 28px !important;
  }
  .xl\:pb-28 {
    padding-bottom: 28px !important;
  }
  .xl\:pl-28 {
    padding-left: 28px !important;
  }
  .xl\:pr-28 {
    padding-right: 28px !important;
  }
  .xl\:mt-28 {
    margin-top: 28px !important;
  }
  .xl\:mb-28 {
    margin-bottom: 28px !important;
  }
  .xl\:ml-28 {
    margin-left: 28px !important;
  }
  .xl\:mr-28 {
    margin-right: 28px !important;
  }
  .xl\:py-30 {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }
  .xl\:px-30 {
    padding-left: 30px !important;
    padding-right: 30px !important;
  }
  .xl\:pt-30 {
    padding-top: 30px !important;
  }
  .xl\:pb-30 {
    padding-bottom: 30px !important;
  }
  .xl\:pl-30 {
    padding-left: 30px !important;
  }
  .xl\:pr-30 {
    padding-right: 30px !important;
  }
  .xl\:mt-30 {
    margin-top: 30px !important;
  }
  .xl\:mb-30 {
    margin-bottom: 30px !important;
  }
  .xl\:ml-30 {
    margin-left: 30px !important;
  }
  .xl\:mr-30 {
    margin-right: 30px !important;
  }
  .xl\:py-35 {
    padding-top: 35px !important;
    padding-bottom: 35px !important;
  }
  .xl\:px-35 {
    padding-left: 35px !important;
    padding-right: 35px !important;
  }
  .xl\:pt-35 {
    padding-top: 35px !important;
  }
  .xl\:pb-35 {
    padding-bottom: 35px !important;
  }
  .xl\:pl-35 {
    padding-left: 35px !important;
  }
  .xl\:pr-35 {
    padding-right: 35px !important;
  }
  .xl\:mt-35 {
    margin-top: 35px !important;
  }
  .xl\:mb-35 {
    margin-bottom: 35px !important;
  }
  .xl\:ml-35 {
    margin-left: 35px !important;
  }
  .xl\:mr-35 {
    margin-right: 35px !important;
  }
  .xl\:py-40 {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }
  .xl\:px-40 {
    padding-left: 40px !important;
    padding-right: 40px !important;
  }
  .xl\:pt-40 {
    padding-top: 40px !important;
  }
  .xl\:pb-40 {
    padding-bottom: 40px !important;
  }
  .xl\:pl-40 {
    padding-left: 40px !important;
  }
  .xl\:pr-40 {
    padding-right: 40px !important;
  }
  .xl\:mt-40 {
    margin-top: 40px !important;
  }
  .xl\:mb-40 {
    margin-bottom: 40px !important;
  }
  .xl\:ml-40 {
    margin-left: 40px !important;
  }
  .xl\:mr-40 {
    margin-right: 40px !important;
  }
  .xl\:py-45 {
    padding-top: 45px !important;
    padding-bottom: 45px !important;
  }
  .xl\:px-45 {
    padding-left: 45px !important;
    padding-right: 45px !important;
  }
  .xl\:pt-45 {
    padding-top: 45px !important;
  }
  .xl\:pb-45 {
    padding-bottom: 45px !important;
  }
  .xl\:pl-45 {
    padding-left: 45px !important;
  }
  .xl\:pr-45 {
    padding-right: 45px !important;
  }
  .xl\:mt-45 {
    margin-top: 45px !important;
  }
  .xl\:mb-45 {
    margin-bottom: 45px !important;
  }
  .xl\:ml-45 {
    margin-left: 45px !important;
  }
  .xl\:mr-45 {
    margin-right: 45px !important;
  }
  .xl\:py-50 {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
  }
  .xl\:px-50 {
    padding-left: 50px !important;
    padding-right: 50px !important;
  }
  .xl\:pt-50 {
    padding-top: 50px !important;
  }
  .xl\:pb-50 {
    padding-bottom: 50px !important;
  }
  .xl\:pl-50 {
    padding-left: 50px !important;
  }
  .xl\:pr-50 {
    padding-right: 50px !important;
  }
  .xl\:mt-50 {
    margin-top: 50px !important;
  }
  .xl\:mb-50 {
    margin-bottom: 50px !important;
  }
  .xl\:ml-50 {
    margin-left: 50px !important;
  }
  .xl\:mr-50 {
    margin-right: 50px !important;
  }
  .xl\:py-60 {
    padding-top: 60px !important;
    padding-bottom: 60px !important;
  }
  .xl\:px-60 {
    padding-left: 60px !important;
    padding-right: 60px !important;
  }
  .xl\:pt-60 {
    padding-top: 60px !important;
  }
  .xl\:pb-60 {
    padding-bottom: 60px !important;
  }
  .xl\:pl-60 {
    padding-left: 60px !important;
  }
  .xl\:pr-60 {
    padding-right: 60px !important;
  }
  .xl\:mt-60 {
    margin-top: 60px !important;
  }
  .xl\:mb-60 {
    margin-bottom: 60px !important;
  }
  .xl\:ml-60 {
    margin-left: 60px !important;
  }
  .xl\:mr-60 {
    margin-right: 60px !important;
  }
  .xl\:py-70 {
    padding-top: 70px !important;
    padding-bottom: 70px !important;
  }
  .xl\:px-70 {
    padding-left: 70px !important;
    padding-right: 70px !important;
  }
  .xl\:pt-70 {
    padding-top: 70px !important;
  }
  .xl\:pb-70 {
    padding-bottom: 70px !important;
  }
  .xl\:pl-70 {
    padding-left: 70px !important;
  }
  .xl\:pr-70 {
    padding-right: 70px !important;
  }
  .xl\:mt-70 {
    margin-top: 70px !important;
  }
  .xl\:mb-70 {
    margin-bottom: 70px !important;
  }
  .xl\:ml-70 {
    margin-left: 70px !important;
  }
  .xl\:mr-70 {
    margin-right: 70px !important;
  }
  .xl\:py-80 {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
  }
  .xl\:px-80 {
    padding-left: 80px !important;
    padding-right: 80px !important;
  }
  .xl\:pt-80 {
    padding-top: 80px !important;
  }
  .xl\:pb-80 {
    padding-bottom: 80px !important;
  }
  .xl\:pl-80 {
    padding-left: 80px !important;
  }
  .xl\:pr-80 {
    padding-right: 80px !important;
  }
  .xl\:mt-80 {
    margin-top: 80px !important;
  }
  .xl\:mb-80 {
    margin-bottom: 80px !important;
  }
  .xl\:ml-80 {
    margin-left: 80px !important;
  }
  .xl\:mr-80 {
    margin-right: 80px !important;
  }
  .xl\:py-90 {
    padding-top: 90px !important;
    padding-bottom: 90px !important;
  }
  .xl\:px-90 {
    padding-left: 90px !important;
    padding-right: 90px !important;
  }
  .xl\:pt-90 {
    padding-top: 90px !important;
  }
  .xl\:pb-90 {
    padding-bottom: 90px !important;
  }
  .xl\:pl-90 {
    padding-left: 90px !important;
  }
  .xl\:pr-90 {
    padding-right: 90px !important;
  }
  .xl\:mt-90 {
    margin-top: 90px !important;
  }
  .xl\:mb-90 {
    margin-bottom: 90px !important;
  }
  .xl\:ml-90 {
    margin-left: 90px !important;
  }
  .xl\:mr-90 {
    margin-right: 90px !important;
  }
  .xl\:py-120 {
    padding-top: 120px !important;
    padding-bottom: 120px !important;
  }
  .xl\:px-120 {
    padding-left: 120px !important;
    padding-right: 120px !important;
  }
  .xl\:pt-120 {
    padding-top: 120px !important;
  }
  .xl\:pb-120 {
    padding-bottom: 120px !important;
  }
  .xl\:pl-120 {
    padding-left: 120px !important;
  }
  .xl\:pr-120 {
    padding-right: 120px !important;
  }
  .xl\:mt-120 {
    margin-top: 120px !important;
  }
  .xl\:mb-120 {
    margin-bottom: 120px !important;
  }
  .xl\:ml-120 {
    margin-left: 120px !important;
  }
  .xl\:mr-120 {
    margin-right: 120px !important;
  }
}

@media (max-width: 991px) {
  .lg\:py-0 {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
  }
  .lg\:px-0 {
    padding-left: 0px !important;
    padding-right: 0px !important;
  }
  .lg\:pt-0 {
    padding-top: 0px !important;
  }
  .lg\:pb-0 {
    padding-bottom: 0px !important;
  }
  .lg\:pl-0 {
    padding-left: 0px !important;
  }
  .lg\:pr-0 {
    padding-right: 0px !important;
  }
  .lg\:mt-0 {
    margin-top: 0px !important;
  }
  .lg\:mb-0 {
    margin-bottom: 0px !important;
  }
  .lg\:ml-0 {
    margin-left: 0px !important;
  }
  .lg\:mr-0 {
    margin-right: 0px !important;
  }
  .lg\:py-4 {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
  }
  .lg\:px-4 {
    padding-left: 4px !important;
    padding-right: 4px !important;
  }
  .lg\:pt-4 {
    padding-top: 4px !important;
  }
  .lg\:pb-4 {
    padding-bottom: 4px !important;
  }
  .lg\:pl-4 {
    padding-left: 4px !important;
  }
  .lg\:pr-4 {
    padding-right: 4px !important;
  }
  .lg\:mt-4 {
    margin-top: 4px !important;
  }
  .lg\:mb-4 {
    margin-bottom: 4px !important;
  }
  .lg\:ml-4 {
    margin-left: 4px !important;
  }
  .lg\:mr-4 {
    margin-right: 4px !important;
  }
  .lg\:py-5 {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
  }
  .lg\:px-5 {
    padding-left: 5px !important;
    padding-right: 5px !important;
  }
  .lg\:pt-5 {
    padding-top: 5px !important;
  }
  .lg\:pb-5 {
    padding-bottom: 5px !important;
  }
  .lg\:pl-5 {
    padding-left: 5px !important;
  }
  .lg\:pr-5 {
    padding-right: 5px !important;
  }
  .lg\:mt-5 {
    margin-top: 5px !important;
  }
  .lg\:mb-5 {
    margin-bottom: 5px !important;
  }
  .lg\:ml-5 {
    margin-left: 5px !important;
  }
  .lg\:mr-5 {
    margin-right: 5px !important;
  }
  .lg\:py-10 {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
  .lg\:px-10 {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  .lg\:pt-10 {
    padding-top: 10px !important;
  }
  .lg\:pb-10 {
    padding-bottom: 10px !important;
  }
  .lg\:pl-10 {
    padding-left: 10px !important;
  }
  .lg\:pr-10 {
    padding-right: 10px !important;
  }
  .lg\:mt-10 {
    margin-top: 10px !important;
  }
  .lg\:mb-10 {
    margin-bottom: 10px !important;
  }
  .lg\:ml-10 {
    margin-left: 10px !important;
  }
  .lg\:mr-10 {
    margin-right: 10px !important;
  }
  .lg\:py-15 {
    padding-top: 15px !important;
    padding-bottom: 15px !important;
  }
  .lg\:px-15 {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }
  .lg\:pt-15 {
    padding-top: 15px !important;
  }
  .lg\:pb-15 {
    padding-bottom: 15px !important;
  }
  .lg\:pl-15 {
    padding-left: 15px !important;
  }
  .lg\:pr-15 {
    padding-right: 15px !important;
  }
  .lg\:mt-15 {
    margin-top: 15px !important;
  }
  .lg\:mb-15 {
    margin-bottom: 15px !important;
  }
  .lg\:ml-15 {
    margin-left: 15px !important;
  }
  .lg\:mr-15 {
    margin-right: 15px !important;
  }
  .lg\:py-20 {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }
  .lg\:px-20 {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  .lg\:pt-20 {
    padding-top: 20px !important;
  }
  .lg\:pb-20 {
    padding-bottom: 20px !important;
  }
  .lg\:pl-20 {
    padding-left: 20px !important;
  }
  .lg\:pr-20 {
    padding-right: 20px !important;
  }
  .lg\:mt-20 {
    margin-top: 20px !important;
  }
  .lg\:mb-20 {
    margin-bottom: 20px !important;
  }
  .lg\:ml-20 {
    margin-left: 20px !important;
  }
  .lg\:mr-20 {
    margin-right: 20px !important;
  }
  .lg\:py-24 {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
  }
  .lg\:px-24 {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
  .lg\:pt-24 {
    padding-top: 24px !important;
  }
  .lg\:pb-24 {
    padding-bottom: 24px !important;
  }
  .lg\:pl-24 {
    padding-left: 24px !important;
  }
  .lg\:pr-24 {
    padding-right: 24px !important;
  }
  .lg\:mt-24 {
    margin-top: 24px !important;
  }
  .lg\:mb-24 {
    margin-bottom: 24px !important;
  }
  .lg\:ml-24 {
    margin-left: 24px !important;
  }
  .lg\:mr-24 {
    margin-right: 24px !important;
  }
  .lg\:py-28 {
    padding-top: 28px !important;
    padding-bottom: 28px !important;
  }
  .lg\:px-28 {
    padding-left: 28px !important;
    padding-right: 28px !important;
  }
  .lg\:pt-28 {
    padding-top: 28px !important;
  }
  .lg\:pb-28 {
    padding-bottom: 28px !important;
  }
  .lg\:pl-28 {
    padding-left: 28px !important;
  }
  .lg\:pr-28 {
    padding-right: 28px !important;
  }
  .lg\:mt-28 {
    margin-top: 28px !important;
  }
  .lg\:mb-28 {
    margin-bottom: 28px !important;
  }
  .lg\:ml-28 {
    margin-left: 28px !important;
  }
  .lg\:mr-28 {
    margin-right: 28px !important;
  }
  .lg\:py-30 {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }
  .lg\:px-30 {
    padding-left: 30px !important;
    padding-right: 30px !important;
  }
  .lg\:pt-30 {
    padding-top: 30px !important;
  }
  .lg\:pb-30 {
    padding-bottom: 30px !important;
  }
  .lg\:pl-30 {
    padding-left: 30px !important;
  }
  .lg\:pr-30 {
    padding-right: 30px !important;
  }
  .lg\:mt-30 {
    margin-top: 30px !important;
  }
  .lg\:mb-30 {
    margin-bottom: 30px !important;
  }
  .lg\:ml-30 {
    margin-left: 30px !important;
  }
  .lg\:mr-30 {
    margin-right: 30px !important;
  }
  .lg\:py-35 {
    padding-top: 35px !important;
    padding-bottom: 35px !important;
  }
  .lg\:px-35 {
    padding-left: 35px !important;
    padding-right: 35px !important;
  }
  .lg\:pt-35 {
    padding-top: 35px !important;
  }
  .lg\:pb-35 {
    padding-bottom: 35px !important;
  }
  .lg\:pl-35 {
    padding-left: 35px !important;
  }
  .lg\:pr-35 {
    padding-right: 35px !important;
  }
  .lg\:mt-35 {
    margin-top: 35px !important;
  }
  .lg\:mb-35 {
    margin-bottom: 35px !important;
  }
  .lg\:ml-35 {
    margin-left: 35px !important;
  }
  .lg\:mr-35 {
    margin-right: 35px !important;
  }
  .lg\:py-40 {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }
  .lg\:px-40 {
    padding-left: 40px !important;
    padding-right: 40px !important;
  }
  .lg\:pt-40 {
    padding-top: 40px !important;
  }
  .lg\:pb-40 {
    padding-bottom: 40px !important;
  }
  .lg\:pl-40 {
    padding-left: 40px !important;
  }
  .lg\:pr-40 {
    padding-right: 40px !important;
  }
  .lg\:mt-40 {
    margin-top: 40px !important;
  }
  .lg\:mb-40 {
    margin-bottom: 40px !important;
  }
  .lg\:ml-40 {
    margin-left: 40px !important;
  }
  .lg\:mr-40 {
    margin-right: 40px !important;
  }
  .lg\:py-45 {
    padding-top: 45px !important;
    padding-bottom: 45px !important;
  }
  .lg\:px-45 {
    padding-left: 45px !important;
    padding-right: 45px !important;
  }
  .lg\:pt-45 {
    padding-top: 45px !important;
  }
  .lg\:pb-45 {
    padding-bottom: 45px !important;
  }
  .lg\:pl-45 {
    padding-left: 45px !important;
  }
  .lg\:pr-45 {
    padding-right: 45px !important;
  }
  .lg\:mt-45 {
    margin-top: 45px !important;
  }
  .lg\:mb-45 {
    margin-bottom: 45px !important;
  }
  .lg\:ml-45 {
    margin-left: 45px !important;
  }
  .lg\:mr-45 {
    margin-right: 45px !important;
  }
  .lg\:py-50 {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
  }
  .lg\:px-50 {
    padding-left: 50px !important;
    padding-right: 50px !important;
  }
  .lg\:pt-50 {
    padding-top: 50px !important;
  }
  .lg\:pb-50 {
    padding-bottom: 50px !important;
  }
  .lg\:pl-50 {
    padding-left: 50px !important;
  }
  .lg\:pr-50 {
    padding-right: 50px !important;
  }
  .lg\:mt-50 {
    margin-top: 50px !important;
  }
  .lg\:mb-50 {
    margin-bottom: 50px !important;
  }
  .lg\:ml-50 {
    margin-left: 50px !important;
  }
  .lg\:mr-50 {
    margin-right: 50px !important;
  }
  .lg\:py-60 {
    padding-top: 60px !important;
    padding-bottom: 60px !important;
  }
  .lg\:px-60 {
    padding-left: 60px !important;
    padding-right: 60px !important;
  }
  .lg\:pt-60 {
    padding-top: 60px !important;
  }
  .lg\:pb-60 {
    padding-bottom: 60px !important;
  }
  .lg\:pl-60 {
    padding-left: 60px !important;
  }
  .lg\:pr-60 {
    padding-right: 60px !important;
  }
  .lg\:mt-60 {
    margin-top: 60px !important;
  }
  .lg\:mb-60 {
    margin-bottom: 60px !important;
  }
  .lg\:ml-60 {
    margin-left: 60px !important;
  }
  .lg\:mr-60 {
    margin-right: 60px !important;
  }
  .lg\:py-70 {
    padding-top: 70px !important;
    padding-bottom: 70px !important;
  }
  .lg\:px-70 {
    padding-left: 70px !important;
    padding-right: 70px !important;
  }
  .lg\:pt-70 {
    padding-top: 70px !important;
  }
  .lg\:pb-70 {
    padding-bottom: 70px !important;
  }
  .lg\:pl-70 {
    padding-left: 70px !important;
  }
  .lg\:pr-70 {
    padding-right: 70px !important;
  }
  .lg\:mt-70 {
    margin-top: 70px !important;
  }
  .lg\:mb-70 {
    margin-bottom: 70px !important;
  }
  .lg\:ml-70 {
    margin-left: 70px !important;
  }
  .lg\:mr-70 {
    margin-right: 70px !important;
  }
  .lg\:py-80 {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
  }
  .lg\:px-80 {
    padding-left: 80px !important;
    padding-right: 80px !important;
  }
  .lg\:pt-80 {
    padding-top: 80px !important;
  }
  .lg\:pb-80 {
    padding-bottom: 80px !important;
  }
  .lg\:pl-80 {
    padding-left: 80px !important;
  }
  .lg\:pr-80 {
    padding-right: 80px !important;
  }
  .lg\:mt-80 {
    margin-top: 80px !important;
  }
  .lg\:mb-80 {
    margin-bottom: 80px !important;
  }
  .lg\:ml-80 {
    margin-left: 80px !important;
  }
  .lg\:mr-80 {
    margin-right: 80px !important;
  }
  .lg\:py-90 {
    padding-top: 90px !important;
    padding-bottom: 90px !important;
  }
  .lg\:px-90 {
    padding-left: 90px !important;
    padding-right: 90px !important;
  }
  .lg\:pt-90 {
    padding-top: 90px !important;
  }
  .lg\:pb-90 {
    padding-bottom: 90px !important;
  }
  .lg\:pl-90 {
    padding-left: 90px !important;
  }
  .lg\:pr-90 {
    padding-right: 90px !important;
  }
  .lg\:mt-90 {
    margin-top: 90px !important;
  }
  .lg\:mb-90 {
    margin-bottom: 90px !important;
  }
  .lg\:ml-90 {
    margin-left: 90px !important;
  }
  .lg\:mr-90 {
    margin-right: 90px !important;
  }
  .lg\:py-120 {
    padding-top: 120px !important;
    padding-bottom: 120px !important;
  }
  .lg\:px-120 {
    padding-left: 120px !important;
    padding-right: 120px !important;
  }
  .lg\:pt-120 {
    padding-top: 120px !important;
  }
  .lg\:pb-120 {
    padding-bottom: 120px !important;
  }
  .lg\:pl-120 {
    padding-left: 120px !important;
  }
  .lg\:pr-120 {
    padding-right: 120px !important;
  }
  .lg\:mt-120 {
    margin-top: 120px !important;
  }
  .lg\:mb-120 {
    margin-bottom: 120px !important;
  }
  .lg\:ml-120 {
    margin-left: 120px !important;
  }
  .lg\:mr-120 {
    margin-right: 120px !important;
  }
}

@media (max-width: 767px) {
  .md\:py-0 {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
  }
  .md\:px-0 {
    padding-left: 0px !important;
    padding-right: 0px !important;
  }
  .md\:pt-0 {
    padding-top: 0px !important;
  }
  .md\:pb-0 {
    padding-bottom: 0px !important;
  }
  .md\:pl-0 {
    padding-left: 0px !important;
  }
  .md\:pr-0 {
    padding-right: 0px !important;
  }
  .md\:mt-0 {
    margin-top: 0px !important;
  }
  .md\:mb-0 {
    margin-bottom: 0px !important;
  }
  .md\:ml-0 {
    margin-left: 0px !important;
  }
  .md\:mr-0 {
    margin-right: 0px !important;
  }
  .md\:py-4 {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
  }
  .md\:px-4 {
    padding-left: 4px !important;
    padding-right: 4px !important;
  }
  .md\:pt-4 {
    padding-top: 4px !important;
  }
  .md\:pb-4 {
    padding-bottom: 4px !important;
  }
  .md\:pl-4 {
    padding-left: 4px !important;
  }
  .md\:pr-4 {
    padding-right: 4px !important;
  }
  .md\:mt-4 {
    margin-top: 4px !important;
  }
  .md\:mb-4 {
    margin-bottom: 4px !important;
  }
  .md\:ml-4 {
    margin-left: 4px !important;
  }
  .md\:mr-4 {
    margin-right: 4px !important;
  }
  .md\:py-5 {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
  }
  .md\:px-5 {
    padding-left: 5px !important;
    padding-right: 5px !important;
  }
  .md\:pt-5 {
    padding-top: 5px !important;
  }
  .md\:pb-5 {
    padding-bottom: 5px !important;
  }
  .md\:pl-5 {
    padding-left: 5px !important;
  }
  .md\:pr-5 {
    padding-right: 5px !important;
  }
  .md\:mt-5 {
    margin-top: 5px !important;
  }
  .md\:mb-5 {
    margin-bottom: 5px !important;
  }
  .md\:ml-5 {
    margin-left: 5px !important;
  }
  .md\:mr-5 {
    margin-right: 5px !important;
  }
  .md\:py-10 {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
  .md\:px-10 {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  .md\:pt-10 {
    padding-top: 10px !important;
  }
  .md\:pb-10 {
    padding-bottom: 10px !important;
  }
  .md\:pl-10 {
    padding-left: 10px !important;
  }
  .md\:pr-10 {
    padding-right: 10px !important;
  }
  .md\:mt-10 {
    margin-top: 10px !important;
  }
  .md\:mb-10 {
    margin-bottom: 10px !important;
  }
  .md\:ml-10 {
    margin-left: 10px !important;
  }
  .md\:mr-10 {
    margin-right: 10px !important;
  }
  .md\:py-15 {
    padding-top: 15px !important;
    padding-bottom: 15px !important;
  }
  .md\:px-15 {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }
  .md\:pt-15 {
    padding-top: 15px !important;
  }
  .md\:pb-15 {
    padding-bottom: 15px !important;
  }
  .md\:pl-15 {
    padding-left: 15px !important;
  }
  .md\:pr-15 {
    padding-right: 15px !important;
  }
  .md\:mt-15 {
    margin-top: 15px !important;
  }
  .md\:mb-15 {
    margin-bottom: 15px !important;
  }
  .md\:ml-15 {
    margin-left: 15px !important;
  }
  .md\:mr-15 {
    margin-right: 15px !important;
  }
  .md\:py-20 {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }
  .md\:px-20 {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  .md\:pt-20 {
    padding-top: 20px !important;
  }
  .md\:pb-20 {
    padding-bottom: 20px !important;
  }
  .md\:pl-20 {
    padding-left: 20px !important;
  }
  .md\:pr-20 {
    padding-right: 20px !important;
  }
  .md\:mt-20 {
    margin-top: 20px !important;
  }
  .md\:mb-20 {
    margin-bottom: 20px !important;
  }
  .md\:ml-20 {
    margin-left: 20px !important;
  }
  .md\:mr-20 {
    margin-right: 20px !important;
  }
  .md\:py-24 {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
  }
  .md\:px-24 {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
  .md\:pt-24 {
    padding-top: 24px !important;
  }
  .md\:pb-24 {
    padding-bottom: 24px !important;
  }
  .md\:pl-24 {
    padding-left: 24px !important;
  }
  .md\:pr-24 {
    padding-right: 24px !important;
  }
  .md\:mt-24 {
    margin-top: 24px !important;
  }
  .md\:mb-24 {
    margin-bottom: 24px !important;
  }
  .md\:ml-24 {
    margin-left: 24px !important;
  }
  .md\:mr-24 {
    margin-right: 24px !important;
  }
  .md\:py-28 {
    padding-top: 28px !important;
    padding-bottom: 28px !important;
  }
  .md\:px-28 {
    padding-left: 28px !important;
    padding-right: 28px !important;
  }
  .md\:pt-28 {
    padding-top: 28px !important;
  }
  .md\:pb-28 {
    padding-bottom: 28px !important;
  }
  .md\:pl-28 {
    padding-left: 28px !important;
  }
  .md\:pr-28 {
    padding-right: 28px !important;
  }
  .md\:mt-28 {
    margin-top: 28px !important;
  }
  .md\:mb-28 {
    margin-bottom: 28px !important;
  }
  .md\:ml-28 {
    margin-left: 28px !important;
  }
  .md\:mr-28 {
    margin-right: 28px !important;
  }
  .md\:py-30 {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }
  .md\:px-30 {
    padding-left: 30px !important;
    padding-right: 30px !important;
  }
  .md\:pt-30 {
    padding-top: 30px !important;
  }
  .md\:pb-30 {
    padding-bottom: 30px !important;
  }
  .md\:pl-30 {
    padding-left: 30px !important;
  }
  .md\:pr-30 {
    padding-right: 30px !important;
  }
  .md\:mt-30 {
    margin-top: 30px !important;
  }
  .md\:mb-30 {
    margin-bottom: 30px !important;
  }
  .md\:ml-30 {
    margin-left: 30px !important;
  }
  .md\:mr-30 {
    margin-right: 30px !important;
  }
  .md\:py-35 {
    padding-top: 35px !important;
    padding-bottom: 35px !important;
  }
  .md\:px-35 {
    padding-left: 35px !important;
    padding-right: 35px !important;
  }
  .md\:pt-35 {
    padding-top: 35px !important;
  }
  .md\:pb-35 {
    padding-bottom: 35px !important;
  }
  .md\:pl-35 {
    padding-left: 35px !important;
  }
  .md\:pr-35 {
    padding-right: 35px !important;
  }
  .md\:mt-35 {
    margin-top: 35px !important;
  }
  .md\:mb-35 {
    margin-bottom: 35px !important;
  }
  .md\:ml-35 {
    margin-left: 35px !important;
  }
  .md\:mr-35 {
    margin-right: 35px !important;
  }
  .md\:py-40 {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }
  .md\:px-40 {
    padding-left: 40px !important;
    padding-right: 40px !important;
  }
  .md\:pt-40 {
    padding-top: 40px !important;
  }
  .md\:pb-40 {
    padding-bottom: 40px !important;
  }
  .md\:pl-40 {
    padding-left: 40px !important;
  }
  .md\:pr-40 {
    padding-right: 40px !important;
  }
  .md\:mt-40 {
    margin-top: 40px !important;
  }
  .md\:mb-40 {
    margin-bottom: 40px !important;
  }
  .md\:ml-40 {
    margin-left: 40px !important;
  }
  .md\:mr-40 {
    margin-right: 40px !important;
  }
  .md\:py-45 {
    padding-top: 45px !important;
    padding-bottom: 45px !important;
  }
  .md\:px-45 {
    padding-left: 45px !important;
    padding-right: 45px !important;
  }
  .md\:pt-45 {
    padding-top: 45px !important;
  }
  .md\:pb-45 {
    padding-bottom: 45px !important;
  }
  .md\:pl-45 {
    padding-left: 45px !important;
  }
  .md\:pr-45 {
    padding-right: 45px !important;
  }
  .md\:mt-45 {
    margin-top: 45px !important;
  }
  .md\:mb-45 {
    margin-bottom: 45px !important;
  }
  .md\:ml-45 {
    margin-left: 45px !important;
  }
  .md\:mr-45 {
    margin-right: 45px !important;
  }
  .md\:py-50 {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
  }
  .md\:px-50 {
    padding-left: 50px !important;
    padding-right: 50px !important;
  }
  .md\:pt-50 {
    padding-top: 50px !important;
  }
  .md\:pb-50 {
    padding-bottom: 50px !important;
  }
  .md\:pl-50 {
    padding-left: 50px !important;
  }
  .md\:pr-50 {
    padding-right: 50px !important;
  }
  .md\:mt-50 {
    margin-top: 50px !important;
  }
  .md\:mb-50 {
    margin-bottom: 50px !important;
  }
  .md\:ml-50 {
    margin-left: 50px !important;
  }
  .md\:mr-50 {
    margin-right: 50px !important;
  }
  .md\:py-60 {
    padding-top: 60px !important;
    padding-bottom: 60px !important;
  }
  .md\:px-60 {
    padding-left: 60px !important;
    padding-right: 60px !important;
  }
  .md\:pt-60 {
    padding-top: 60px !important;
  }
  .md\:pb-60 {
    padding-bottom: 60px !important;
  }
  .md\:pl-60 {
    padding-left: 60px !important;
  }
  .md\:pr-60 {
    padding-right: 60px !important;
  }
  .md\:mt-60 {
    margin-top: 60px !important;
  }
  .md\:mb-60 {
    margin-bottom: 60px !important;
  }
  .md\:ml-60 {
    margin-left: 60px !important;
  }
  .md\:mr-60 {
    margin-right: 60px !important;
  }
  .md\:py-70 {
    padding-top: 70px !important;
    padding-bottom: 70px !important;
  }
  .md\:px-70 {
    padding-left: 70px !important;
    padding-right: 70px !important;
  }
  .md\:pt-70 {
    padding-top: 70px !important;
  }
  .md\:pb-70 {
    padding-bottom: 70px !important;
  }
  .md\:pl-70 {
    padding-left: 70px !important;
  }
  .md\:pr-70 {
    padding-right: 70px !important;
  }
  .md\:mt-70 {
    margin-top: 70px !important;
  }
  .md\:mb-70 {
    margin-bottom: 70px !important;
  }
  .md\:ml-70 {
    margin-left: 70px !important;
  }
  .md\:mr-70 {
    margin-right: 70px !important;
  }
  .md\:py-80 {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
  }
  .md\:px-80 {
    padding-left: 80px !important;
    padding-right: 80px !important;
  }
  .md\:pt-80 {
    padding-top: 80px !important;
  }
  .md\:pb-80 {
    padding-bottom: 80px !important;
  }
  .md\:pl-80 {
    padding-left: 80px !important;
  }
  .md\:pr-80 {
    padding-right: 80px !important;
  }
  .md\:mt-80 {
    margin-top: 80px !important;
  }
  .md\:mb-80 {
    margin-bottom: 80px !important;
  }
  .md\:ml-80 {
    margin-left: 80px !important;
  }
  .md\:mr-80 {
    margin-right: 80px !important;
  }
  .md\:py-90 {
    padding-top: 90px !important;
    padding-bottom: 90px !important;
  }
  .md\:px-90 {
    padding-left: 90px !important;
    padding-right: 90px !important;
  }
  .md\:pt-90 {
    padding-top: 90px !important;
  }
  .md\:pb-90 {
    padding-bottom: 90px !important;
  }
  .md\:pl-90 {
    padding-left: 90px !important;
  }
  .md\:pr-90 {
    padding-right: 90px !important;
  }
  .md\:mt-90 {
    margin-top: 90px !important;
  }
  .md\:mb-90 {
    margin-bottom: 90px !important;
  }
  .md\:ml-90 {
    margin-left: 90px !important;
  }
  .md\:mr-90 {
    margin-right: 90px !important;
  }
  .md\:py-120 {
    padding-top: 120px !important;
    padding-bottom: 120px !important;
  }
  .md\:px-120 {
    padding-left: 120px !important;
    padding-right: 120px !important;
  }
  .md\:pt-120 {
    padding-top: 120px !important;
  }
  .md\:pb-120 {
    padding-bottom: 120px !important;
  }
  .md\:pl-120 {
    padding-left: 120px !important;
  }
  .md\:pr-120 {
    padding-right: 120px !important;
  }
  .md\:mt-120 {
    margin-top: 120px !important;
  }
  .md\:mb-120 {
    margin-bottom: 120px !important;
  }
  .md\:ml-120 {
    margin-left: 120px !important;
  }
  .md\:mr-120 {
    margin-right: 120px !important;
  }
}

@media (max-width: 575px) {
  .sm\:py-0 {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
  }
  .sm\:px-0 {
    padding-left: 0px !important;
    padding-right: 0px !important;
  }
  .sm\:pt-0 {
    padding-top: 0px !important;
  }
  .sm\:pb-0 {
    padding-bottom: 0px !important;
  }
  .sm\:pl-0 {
    padding-left: 0px !important;
  }
  .sm\:pr-0 {
    padding-right: 0px !important;
  }
  .sm\:mt-0 {
    margin-top: 0px !important;
  }
  .sm\:mb-0 {
    margin-bottom: 0px !important;
  }
  .sm\:ml-0 {
    margin-left: 0px !important;
  }
  .sm\:mr-0 {
    margin-right: 0px !important;
  }
  .sm\:py-4 {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
  }
  .sm\:px-4 {
    padding-left: 4px !important;
    padding-right: 4px !important;
  }
  .sm\:pt-4 {
    padding-top: 4px !important;
  }
  .sm\:pb-4 {
    padding-bottom: 4px !important;
  }
  .sm\:pl-4 {
    padding-left: 4px !important;
  }
  .sm\:pr-4 {
    padding-right: 4px !important;
  }
  .sm\:mt-4 {
    margin-top: 4px !important;
  }
  .sm\:mb-4 {
    margin-bottom: 4px !important;
  }
  .sm\:ml-4 {
    margin-left: 4px !important;
  }
  .sm\:mr-4 {
    margin-right: 4px !important;
  }
  .sm\:py-5 {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
  }
  .sm\:px-5 {
    padding-left: 5px !important;
    padding-right: 5px !important;
  }
  .sm\:pt-5 {
    padding-top: 5px !important;
  }
  .sm\:pb-5 {
    padding-bottom: 5px !important;
  }
  .sm\:pl-5 {
    padding-left: 5px !important;
  }
  .sm\:pr-5 {
    padding-right: 5px !important;
  }
  .sm\:mt-5 {
    margin-top: 5px !important;
  }
  .sm\:mb-5 {
    margin-bottom: 5px !important;
  }
  .sm\:ml-5 {
    margin-left: 5px !important;
  }
  .sm\:mr-5 {
    margin-right: 5px !important;
  }
  .sm\:py-10 {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
  .sm\:px-10 {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  .sm\:pt-10 {
    padding-top: 10px !important;
  }
  .sm\:pb-10 {
    padding-bottom: 10px !important;
  }
  .sm\:pl-10 {
    padding-left: 10px !important;
  }
  .sm\:pr-10 {
    padding-right: 10px !important;
  }
  .sm\:mt-10 {
    margin-top: 10px !important;
  }
  .sm\:mb-10 {
    margin-bottom: 10px !important;
  }
  .sm\:ml-10 {
    margin-left: 10px !important;
  }
  .sm\:mr-10 {
    margin-right: 10px !important;
  }
  .sm\:py-15 {
    padding-top: 15px !important;
    padding-bottom: 15px !important;
  }
  .sm\:px-15 {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }
  .sm\:pt-15 {
    padding-top: 15px !important;
  }
  .sm\:pb-15 {
    padding-bottom: 15px !important;
  }
  .sm\:pl-15 {
    padding-left: 15px !important;
  }
  .sm\:pr-15 {
    padding-right: 15px !important;
  }
  .sm\:mt-15 {
    margin-top: 15px !important;
  }
  .sm\:mb-15 {
    margin-bottom: 15px !important;
  }
  .sm\:ml-15 {
    margin-left: 15px !important;
  }
  .sm\:mr-15 {
    margin-right: 15px !important;
  }
  .sm\:py-20 {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }
  .sm\:px-20 {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  .sm\:pt-20 {
    padding-top: 20px !important;
  }
  .sm\:pb-20 {
    padding-bottom: 20px !important;
  }
  .sm\:pl-20 {
    padding-left: 20px !important;
  }
  .sm\:pr-20 {
    padding-right: 20px !important;
  }
  .sm\:mt-20 {
    margin-top: 20px !important;
  }
  .sm\:mb-20 {
    margin-bottom: 20px !important;
  }
  .sm\:ml-20 {
    margin-left: 20px !important;
  }
  .sm\:mr-20 {
    margin-right: 20px !important;
  }
  .sm\:py-24 {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
  }
  .sm\:px-24 {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
  .sm\:pt-24 {
    padding-top: 24px !important;
  }
  .sm\:pb-24 {
    padding-bottom: 24px !important;
  }
  .sm\:pl-24 {
    padding-left: 24px !important;
  }
  .sm\:pr-24 {
    padding-right: 24px !important;
  }
  .sm\:mt-24 {
    margin-top: 24px !important;
  }
  .sm\:mb-24 {
    margin-bottom: 24px !important;
  }
  .sm\:ml-24 {
    margin-left: 24px !important;
  }
  .sm\:mr-24 {
    margin-right: 24px !important;
  }
  .sm\:py-28 {
    padding-top: 28px !important;
    padding-bottom: 28px !important;
  }
  .sm\:px-28 {
    padding-left: 28px !important;
    padding-right: 28px !important;
  }
  .sm\:pt-28 {
    padding-top: 28px !important;
  }
  .sm\:pb-28 {
    padding-bottom: 28px !important;
  }
  .sm\:pl-28 {
    padding-left: 28px !important;
  }
  .sm\:pr-28 {
    padding-right: 28px !important;
  }
  .sm\:mt-28 {
    margin-top: 28px !important;
  }
  .sm\:mb-28 {
    margin-bottom: 28px !important;
  }
  .sm\:ml-28 {
    margin-left: 28px !important;
  }
  .sm\:mr-28 {
    margin-right: 28px !important;
  }
  .sm\:py-30 {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }
  .sm\:px-30 {
    padding-left: 30px !important;
    padding-right: 30px !important;
  }
  .sm\:pt-30 {
    padding-top: 30px !important;
  }
  .sm\:pb-30 {
    padding-bottom: 30px !important;
  }
  .sm\:pl-30 {
    padding-left: 30px !important;
  }
  .sm\:pr-30 {
    padding-right: 30px !important;
  }
  .sm\:mt-30 {
    margin-top: 30px !important;
  }
  .sm\:mb-30 {
    margin-bottom: 30px !important;
  }
  .sm\:ml-30 {
    margin-left: 30px !important;
  }
  .sm\:mr-30 {
    margin-right: 30px !important;
  }
  .sm\:py-35 {
    padding-top: 35px !important;
    padding-bottom: 35px !important;
  }
  .sm\:px-35 {
    padding-left: 35px !important;
    padding-right: 35px !important;
  }
  .sm\:pt-35 {
    padding-top: 35px !important;
  }
  .sm\:pb-35 {
    padding-bottom: 35px !important;
  }
  .sm\:pl-35 {
    padding-left: 35px !important;
  }
  .sm\:pr-35 {
    padding-right: 35px !important;
  }
  .sm\:mt-35 {
    margin-top: 35px !important;
  }
  .sm\:mb-35 {
    margin-bottom: 35px !important;
  }
  .sm\:ml-35 {
    margin-left: 35px !important;
  }
  .sm\:mr-35 {
    margin-right: 35px !important;
  }
  .sm\:py-40 {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }
  .sm\:px-40 {
    padding-left: 40px !important;
    padding-right: 40px !important;
  }
  .sm\:pt-40 {
    padding-top: 40px !important;
  }
  .sm\:pb-40 {
    padding-bottom: 40px !important;
  }
  .sm\:pl-40 {
    padding-left: 40px !important;
  }
  .sm\:pr-40 {
    padding-right: 40px !important;
  }
  .sm\:mt-40 {
    margin-top: 40px !important;
  }
  .sm\:mb-40 {
    margin-bottom: 40px !important;
  }
  .sm\:ml-40 {
    margin-left: 40px !important;
  }
  .sm\:mr-40 {
    margin-right: 40px !important;
  }
  .sm\:py-45 {
    padding-top: 45px !important;
    padding-bottom: 45px !important;
  }
  .sm\:px-45 {
    padding-left: 45px !important;
    padding-right: 45px !important;
  }
  .sm\:pt-45 {
    padding-top: 45px !important;
  }
  .sm\:pb-45 {
    padding-bottom: 45px !important;
  }
  .sm\:pl-45 {
    padding-left: 45px !important;
  }
  .sm\:pr-45 {
    padding-right: 45px !important;
  }
  .sm\:mt-45 {
    margin-top: 45px !important;
  }
  .sm\:mb-45 {
    margin-bottom: 45px !important;
  }
  .sm\:ml-45 {
    margin-left: 45px !important;
  }
  .sm\:mr-45 {
    margin-right: 45px !important;
  }
  .sm\:py-50 {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
  }
  .sm\:px-50 {
    padding-left: 50px !important;
    padding-right: 50px !important;
  }
  .sm\:pt-50 {
    padding-top: 50px !important;
  }
  .sm\:pb-50 {
    padding-bottom: 50px !important;
  }
  .sm\:pl-50 {
    padding-left: 50px !important;
  }
  .sm\:pr-50 {
    padding-right: 50px !important;
  }
  .sm\:mt-50 {
    margin-top: 50px !important;
  }
  .sm\:mb-50 {
    margin-bottom: 50px !important;
  }
  .sm\:ml-50 {
    margin-left: 50px !important;
  }
  .sm\:mr-50 {
    margin-right: 50px !important;
  }
  .sm\:py-60 {
    padding-top: 60px !important;
    padding-bottom: 60px !important;
  }
  .sm\:px-60 {
    padding-left: 60px !important;
    padding-right: 60px !important;
  }
  .sm\:pt-60 {
    padding-top: 60px !important;
  }
  .sm\:pb-60 {
    padding-bottom: 60px !important;
  }
  .sm\:pl-60 {
    padding-left: 60px !important;
  }
  .sm\:pr-60 {
    padding-right: 60px !important;
  }
  .sm\:mt-60 {
    margin-top: 60px !important;
  }
  .sm\:mb-60 {
    margin-bottom: 60px !important;
  }
  .sm\:ml-60 {
    margin-left: 60px !important;
  }
  .sm\:mr-60 {
    margin-right: 60px !important;
  }
  .sm\:py-70 {
    padding-top: 70px !important;
    padding-bottom: 70px !important;
  }
  .sm\:px-70 {
    padding-left: 70px !important;
    padding-right: 70px !important;
  }
  .sm\:pt-70 {
    padding-top: 70px !important;
  }
  .sm\:pb-70 {
    padding-bottom: 70px !important;
  }
  .sm\:pl-70 {
    padding-left: 70px !important;
  }
  .sm\:pr-70 {
    padding-right: 70px !important;
  }
  .sm\:mt-70 {
    margin-top: 70px !important;
  }
  .sm\:mb-70 {
    margin-bottom: 70px !important;
  }
  .sm\:ml-70 {
    margin-left: 70px !important;
  }
  .sm\:mr-70 {
    margin-right: 70px !important;
  }
  .sm\:py-80 {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
  }
  .sm\:px-80 {
    padding-left: 80px !important;
    padding-right: 80px !important;
  }
  .sm\:pt-80 {
    padding-top: 80px !important;
  }
  .sm\:pb-80 {
    padding-bottom: 80px !important;
  }
  .sm\:pl-80 {
    padding-left: 80px !important;
  }
  .sm\:pr-80 {
    padding-right: 80px !important;
  }
  .sm\:mt-80 {
    margin-top: 80px !important;
  }
  .sm\:mb-80 {
    margin-bottom: 80px !important;
  }
  .sm\:ml-80 {
    margin-left: 80px !important;
  }
  .sm\:mr-80 {
    margin-right: 80px !important;
  }
  .sm\:py-90 {
    padding-top: 90px !important;
    padding-bottom: 90px !important;
  }
  .sm\:px-90 {
    padding-left: 90px !important;
    padding-right: 90px !important;
  }
  .sm\:pt-90 {
    padding-top: 90px !important;
  }
  .sm\:pb-90 {
    padding-bottom: 90px !important;
  }
  .sm\:pl-90 {
    padding-left: 90px !important;
  }
  .sm\:pr-90 {
    padding-right: 90px !important;
  }
  .sm\:mt-90 {
    margin-top: 90px !important;
  }
  .sm\:mb-90 {
    margin-bottom: 90px !important;
  }
  .sm\:ml-90 {
    margin-left: 90px !important;
  }
  .sm\:mr-90 {
    margin-right: 90px !important;
  }
  .sm\:py-120 {
    padding-top: 120px !important;
    padding-bottom: 120px !important;
  }
  .sm\:px-120 {
    padding-left: 120px !important;
    padding-right: 120px !important;
  }
  .sm\:pt-120 {
    padding-top: 120px !important;
  }
  .sm\:pb-120 {
    padding-bottom: 120px !important;
  }
  .sm\:pl-120 {
    padding-left: 120px !important;
  }
  .sm\:pr-120 {
    padding-right: 120px !important;
  }
  .sm\:mt-120 {
    margin-top: 120px !important;
  }
  .sm\:mb-120 {
    margin-bottom: 120px !important;
  }
  .sm\:ml-120 {
    margin-left: 120px !important;
  }
  .sm\:mr-120 {
    margin-right: 120px !important;
  }
}

.mx-auto {
  margin-left: auto;
  margin-right: auto;
}

.xl\:mx-auto {
  margin-left: auto;
  margin-right: auto;
}

.lg\:mx-auto {
  margin-left: auto;
  margin-right: auto;
}

.md\:mx-auto {
  margin-left: auto;
  margin-right: auto;
}

.sm\:mx-auto {
  margin-left: auto;
  margin-right: auto;
}

.x-gap-0 {
  margin-left: -0px;
  margin-right: -0px;
}

.x-gap-0 > * {
  padding-left: 0px;
  padding-right: 0px;
}

.y-gap-0 {
  margin-top: -0px;
  margin-bottom: -0px;
}

.y-gap-0 > * {
  padding-top: 0px;
  padding-bottom: 0px;
}

.x-gap-5 {
  margin-left: -2.5px;
  margin-right: -2.5px;
}

.x-gap-5 > * {
  padding-left: 2.5px;
  padding-right: 2.5px;
}

.y-gap-5 {
  margin-top: -2.5px;
  margin-bottom: -2.5px;
}

.y-gap-5 > * {
  padding-top: 2.5px;
  padding-bottom: 2.5px;
}

.x-gap-10 {
  margin-left: -5px;
  margin-right: -5px;
}

.x-gap-10 > * {
  padding-left: 5px;
  padding-right: 5px;
}

.y-gap-10 {
  margin-top: -5px;
  margin-bottom: -5px;
}

.y-gap-10 > * {
  padding-top: 5px;
  padding-bottom: 5px;
}

.x-gap-15 {
  margin-left: -7.5px;
  margin-right: -7.5px;
}

.x-gap-15 > * {
  padding-left: 7.5px;
  padding-right: 7.5px;
}

.y-gap-15 {
  margin-top: -7.5px;
  margin-bottom: -7.5px;
}

.y-gap-15 > * {
  padding-top: 7.5px;
  padding-bottom: 7.5px;
}

.x-gap-20 {
  margin-left: -10px;
  margin-right: -10px;
}

.x-gap-20 > * {
  padding-left: 10px;
  padding-right: 10px;
}

.y-gap-20 {
  margin-top: -10px;
  margin-bottom: -10px;
}

.y-gap-20 > * {
  padding-top: 10px;
  padding-bottom: 10px;
}

.x-gap-30 {
  margin-left: -15px;
  margin-right: -15px;
}

.x-gap-30 > * {
  padding-left: 15px;
  padding-right: 15px;
}

.y-gap-30 {
  margin-top: -15px;
  margin-bottom: -15px;
}

.y-gap-30 > * {
  padding-top: 15px;
  padding-bottom: 15px;
}

.x-gap-40 {
  margin-left: -20px;
  margin-right: -20px;
}

.x-gap-40 > * {
  padding-left: 20px;
  padding-right: 20px;
}

.y-gap-40 {
  margin-top: -20px;
  margin-bottom: -20px;
}

.y-gap-40 > * {
  padding-top: 20px;
  padding-bottom: 20px;
}

.x-gap-50 {
  margin-left: -25px;
  margin-right: -25px;
}

.x-gap-50 > * {
  padding-left: 25px;
  padding-right: 25px;
}

.y-gap-50 {
  margin-top: -25px;
  margin-bottom: -25px;
}

.y-gap-50 > * {
  padding-top: 25px;
  padding-bottom: 25px;
}

.x-gap-60 {
  margin-left: -30px;
  margin-right: -30px;
}

.x-gap-60 > * {
  padding-left: 30px;
  padding-right: 30px;
}

.y-gap-60 {
  margin-top: -30px;
  margin-bottom: -30px;
}

.y-gap-60 > * {
  padding-top: 30px;
  padding-bottom: 30px;
}

.x-gap-80 {
  margin-left: -40px;
  margin-right: -40px;
}

.x-gap-80 > * {
  padding-left: 40px;
  padding-right: 40px;
}

.y-gap-80 {
  margin-top: -40px;
  margin-bottom: -40px;
}

.y-gap-80 > * {
  padding-top: 40px;
  padding-bottom: 40px;
}

@media (max-width: 767px) {
  .md\:x-gap-0 {
    margin-left: -0px;
    margin-right: -0px;
  }
  .md\:x-gap-0 > * {
    padding-left: 0px;
    padding-right: 0px;
  }
  .md\:y-gap-0 {
    margin-top: -0px;
    margin-bottom: -0px;
  }
  .md\:y-gap-0 > * {
    padding-top: 0px;
    padding-bottom: 0px;
  }
  .md\:x-gap-5 {
    margin-left: -2.5px;
    margin-right: -2.5px;
  }
  .md\:x-gap-5 > * {
    padding-left: 2.5px;
    padding-right: 2.5px;
  }
  .md\:y-gap-5 {
    margin-top: -2.5px;
    margin-bottom: -2.5px;
  }
  .md\:y-gap-5 > * {
    padding-top: 2.5px;
    padding-bottom: 2.5px;
  }
  .md\:x-gap-10 {
    margin-left: -5px;
    margin-right: -5px;
  }
  .md\:x-gap-10 > * {
    padding-left: 5px;
    padding-right: 5px;
  }
  .md\:y-gap-10 {
    margin-top: -5px;
    margin-bottom: -5px;
  }
  .md\:y-gap-10 > * {
    padding-top: 5px;
    padding-bottom: 5px;
  }
  .md\:x-gap-15 {
    margin-left: -7.5px;
    margin-right: -7.5px;
  }
  .md\:x-gap-15 > * {
    padding-left: 7.5px;
    padding-right: 7.5px;
  }
  .md\:y-gap-15 {
    margin-top: -7.5px;
    margin-bottom: -7.5px;
  }
  .md\:y-gap-15 > * {
    padding-top: 7.5px;
    padding-bottom: 7.5px;
  }
  .md\:x-gap-20 {
    margin-left: -10px;
    margin-right: -10px;
  }
  .md\:x-gap-20 > * {
    padding-left: 10px;
    padding-right: 10px;
  }
  .md\:y-gap-20 {
    margin-top: -10px;
    margin-bottom: -10px;
  }
  .md\:y-gap-20 > * {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .md\:x-gap-30 {
    margin-left: -15px;
    margin-right: -15px;
  }
  .md\:x-gap-30 > * {
    padding-left: 15px;
    padding-right: 15px;
  }
  .md\:y-gap-30 {
    margin-top: -15px;
    margin-bottom: -15px;
  }
  .md\:y-gap-30 > * {
    padding-top: 15px;
    padding-bottom: 15px;
  }
  .md\:x-gap-40 {
    margin-left: -20px;
    margin-right: -20px;
  }
  .md\:x-gap-40 > * {
    padding-left: 20px;
    padding-right: 20px;
  }
  .md\:y-gap-40 {
    margin-top: -20px;
    margin-bottom: -20px;
  }
  .md\:y-gap-40 > * {
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .md\:x-gap-50 {
    margin-left: -25px;
    margin-right: -25px;
  }
  .md\:x-gap-50 > * {
    padding-left: 25px;
    padding-right: 25px;
  }
  .md\:y-gap-50 {
    margin-top: -25px;
    margin-bottom: -25px;
  }
  .md\:y-gap-50 > * {
    padding-top: 25px;
    padding-bottom: 25px;
  }
  .md\:x-gap-60 {
    margin-left: -30px;
    margin-right: -30px;
  }
  .md\:x-gap-60 > * {
    padding-left: 30px;
    padding-right: 30px;
  }
  .md\:y-gap-60 {
    margin-top: -30px;
    margin-bottom: -30px;
  }
  .md\:y-gap-60 > * {
    padding-top: 30px;
    padding-bottom: 30px;
  }
  .md\:x-gap-80 {
    margin-left: -40px;
    margin-right: -40px;
  }
  .md\:x-gap-80 > * {
    padding-left: 40px;
    padding-right: 40px;
  }
  .md\:y-gap-80 {
    margin-top: -40px;
    margin-bottom: -40px;
  }
  .md\:y-gap-80 > * {
    padding-top: 40px;
    padding-bottom: 40px;
  }
}

@media (max-width: 767px) {
  .sm\:x-gap-0 {
    margin-left: -0px;
    margin-right: -0px;
  }
  .sm\:x-gap-0 > * {
    padding-left: 0px;
    padding-right: 0px;
  }
  .sm\:y-gap-0 {
    margin-top: -0px;
    margin-bottom: -0px;
  }
  .sm\:y-gap-0 > * {
    padding-top: 0px;
    padding-bottom: 0px;
  }
  .sm\:x-gap-5 {
    margin-left: -2.5px;
    margin-right: -2.5px;
  }
  .sm\:x-gap-5 > * {
    padding-left: 2.5px;
    padding-right: 2.5px;
  }
  .sm\:y-gap-5 {
    margin-top: -2.5px;
    margin-bottom: -2.5px;
  }
  .sm\:y-gap-5 > * {
    padding-top: 2.5px;
    padding-bottom: 2.5px;
  }
  .sm\:x-gap-10 {
    margin-left: -5px;
    margin-right: -5px;
  }
  .sm\:x-gap-10 > * {
    padding-left: 5px;
    padding-right: 5px;
  }
  .sm\:y-gap-10 {
    margin-top: -5px;
    margin-bottom: -5px;
  }
  .sm\:y-gap-10 > * {
    padding-top: 5px;
    padding-bottom: 5px;
  }
  .sm\:x-gap-15 {
    margin-left: -7.5px;
    margin-right: -7.5px;
  }
  .sm\:x-gap-15 > * {
    padding-left: 7.5px;
    padding-right: 7.5px;
  }
  .sm\:y-gap-15 {
    margin-top: -7.5px;
    margin-bottom: -7.5px;
  }
  .sm\:y-gap-15 > * {
    padding-top: 7.5px;
    padding-bottom: 7.5px;
  }
  .sm\:x-gap-20 {
    margin-left: -10px;
    margin-right: -10px;
  }
  .sm\:x-gap-20 > * {
    padding-left: 10px;
    padding-right: 10px;
  }
  .sm\:y-gap-20 {
    margin-top: -10px;
    margin-bottom: -10px;
  }
  .sm\:y-gap-20 > * {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .sm\:x-gap-30 {
    margin-left: -15px;
    margin-right: -15px;
  }
  .sm\:x-gap-30 > * {
    padding-left: 15px;
    padding-right: 15px;
  }
  .sm\:y-gap-30 {
    margin-top: -15px;
    margin-bottom: -15px;
  }
  .sm\:y-gap-30 > * {
    padding-top: 15px;
    padding-bottom: 15px;
  }
  .sm\:x-gap-40 {
    margin-left: -20px;
    margin-right: -20px;
  }
  .sm\:x-gap-40 > * {
    padding-left: 20px;
    padding-right: 20px;
  }
  .sm\:y-gap-40 {
    margin-top: -20px;
    margin-bottom: -20px;
  }
  .sm\:y-gap-40 > * {
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .sm\:x-gap-50 {
    margin-left: -25px;
    margin-right: -25px;
  }
  .sm\:x-gap-50 > * {
    padding-left: 25px;
    padding-right: 25px;
  }
  .sm\:y-gap-50 {
    margin-top: -25px;
    margin-bottom: -25px;
  }
  .sm\:y-gap-50 > * {
    padding-top: 25px;
    padding-bottom: 25px;
  }
  .sm\:x-gap-60 {
    margin-left: -30px;
    margin-right: -30px;
  }
  .sm\:x-gap-60 > * {
    padding-left: 30px;
    padding-right: 30px;
  }
  .sm\:y-gap-60 {
    margin-top: -30px;
    margin-bottom: -30px;
  }
  .sm\:y-gap-60 > * {
    padding-top: 30px;
    padding-bottom: 30px;
  }
  .sm\:x-gap-80 {
    margin-left: -40px;
    margin-right: -40px;
  }
  .sm\:x-gap-80 > * {
    padding-left: 40px;
    padding-right: 40px;
  }
  .sm\:y-gap-80 {
    margin-top: -40px;
    margin-bottom: -40px;
  }
  .sm\:y-gap-80 > * {
    padding-top: 40px;
    padding-bottom: 40px;
  }
}

.layout-pt-sm {
  padding-top: 30px;
}

.layout-pb-sm {
  padding-bottom: 30px;
}

.layout-pt-md {
  padding-top: 60px;
}

.layout-pb-md {
  padding-bottom: 60px;
}

.layout-pt-lg {
  padding-top: 120px;
}

.layout-pb-lg {
  padding-bottom: 120px;
}

.layout-pt-xl {
  padding-top: 140px;
}

.layout-pb-xl {
  padding-bottom: 140px;
}

@media (max-width: 767px) {
  .layout-pt-sm {
    padding-top: 30px;
  }
  .layout-pb-sm {
    padding-bottom: 30px;
  }
}

@media (max-width: 767px) {
  .layout-pt-md {
    padding-top: 60px;
  }
  .layout-pb-md {
    padding-bottom: 60px;
  }
}

@media (max-width: 767px) {
  .layout-pt-lg {
    padding-top: 100px;
  }
  .layout-pb-lg {
    padding-bottom: 100px;
  }
}

@media (max-width: 767px) {
  .layout-pt-xl {
    padding-top: 120px;
  }
  .layout-pb-xl {
    padding-bottom: 120px;
  }
}

@media (max-width: 575px) {
  .layout-pt-sm {
    padding-top: 30px;
  }
  .layout-pb-sm {
    padding-bottom: 30px;
  }
}

@media (max-width: 575px) {
  .layout-pt-md {
    padding-top: 30px;
  }
  .layout-pb-md {
    padding-bottom: 30px;
  }
}

@media (max-width: 575px) {
  .layout-pt-lg {
    padding-top: 60px;
  }
  .layout-pb-lg {
    padding-bottom: 60px;
  }
}

@media (max-width: 575px) {
  .layout-pt-xl {
    padding-top: 60px;
  }
  .layout-pb-xl {
    padding-bottom: 60px;
  }
}

.w-1\/7 {
  width: 14.285714% !important;
}

.w-1\/5 {
  width: 20% !important;
}

.w-1\/4 {
  width: 25% !important;
}

.w-1\/3 {
  width: 33.333333% !important;
}

.w-1\/2 {
  width: 50% !important;
}

.w-1\/1 {
  width: 100% !important;
}

@media (max-width: 1199px) {
  .xl\:w-1\/5 {
    width: 20% !important;
  }
  .xl\:w-1\/4 {
    width: 25% !important;
  }
  .xl\:w-1\/3 {
    width: 33.333333% !important;
  }
  .xl\:w-1\/2 {
    width: 50% !important;
  }
  .xl\:w-1\/1 {
    width: 100% !important;
  }
}

@media (max-width: 991px) {
  .lg\:w-1\/5 {
    width: 20% !important;
  }
  .lg\:w-1\/4 {
    width: 25% !important;
  }
  .lg\:w-1\/3 {
    width: 33.333333% !important;
  }
  .lg\:w-1\/2 {
    width: 50% !important;
  }
  .lg\:w-1\/1 {
    width: 100% !important;
  }
}

@media (max-width: 767px) {
  .md\:w-1\/5 {
    width: 20% !important;
  }
  .md\:w-1\/4 {
    width: 25% !important;
  }
  .md\:w-1\/3 {
    width: 33.333333% !important;
  }
  .md\:w-1\/2 {
    width: 50% !important;
  }
  .md\:w-1\/1 {
    width: 100% !important;
  }
}

@media (max-width: 575px) {
  .sm\:w-1\/5 {
    width: 20% !important;
  }
  .sm\:w-1\/4 {
    width: 25% !important;
  }
  .sm\:w-1\/3 {
    width: 33.333333% !important;
  }
  .sm\:w-1\/2 {
    width: 50% !important;
  }
  .sm\:w-1\/1 {
    width: 100% !important;
  }
}

.flex-column {
  flex-direction: column;
}

@media (max-width: 1199px) {
  .xl\:flex-column {
    flex-direction: column !important;
  }
}

@media (max-width: 991px) {
  .lg\:flex-column {
    flex-direction: column !important;
  }
}

@media (max-width: 767px) {
  .md\:flex-column {
    flex-direction: column !important;
  }
}

@media (max-width: 575px) {
  .sm\:flex-column {
    flex-direction: column !important;
  }
}

.justify-start {
  justify-content: flex-start !important;
}

.justify-end {
  justify-content: flex-end !important;
}

.justify-center {
  justify-content: center !important;
}

.justify-between {
  justify-content: space-between !important;
}

.items-start {
  align-items: flex-start !important;
}

.items-end {
  align-items: flex-end !important;
}

.items-center {
  align-items: center !important;
}

@media (max-width: 1199px) {
  .xl\:justify-start {
    justify-content: flex-start !important;
  }
  .xl\:justify-end {
    justify-content: flex-end !important;
  }
  .xl\:justify-center {
    justify-content: center !important;
  }
  .xl\:justify-between {
    justify-content: space-between !important;
  }
  .xl\:items-start {
    align-items: flex-start !important;
  }
  .xl\:items-end {
    align-items: flex-end !important;
  }
  .xl\:items-center {
    align-items: center !important;
  }
}

@media (max-width: 991px) {
  .lg\:justify-start {
    justify-content: flex-start !important;
  }
  .lg\:justify-end {
    justify-content: flex-end !important;
  }
  .lg\:justify-center {
    justify-content: center !important;
  }
  .lg\:justify-between {
    justify-content: space-between !important;
  }
  .lg\:items-start {
    align-items: flex-start !important;
  }
  .lg\:items-end {
    align-items: flex-end !important;
  }
  .lg\:items-center {
    align-items: center !important;
  }
}

@media (max-width: 767px) {
  .md\:justify-start {
    justify-content: flex-start !important;
  }
  .md\:justify-end {
    justify-content: flex-end !important;
  }
  .md\:justify-center {
    justify-content: center !important;
  }
  .md\:justify-between {
    justify-content: space-between !important;
  }
  .md\:items-start {
    align-items: flex-start !important;
  }
  .md\:items-end {
    align-items: flex-end !important;
  }
  .md\:items-center {
    align-items: center !important;
  }
}

@media (max-width: 575px) {
  .sm\:justify-start {
    justify-content: flex-start !important;
  }
  .sm\:justify-end {
    justify-content: flex-end !important;
  }
  .sm\:justify-center {
    justify-content: center !important;
  }
  .sm\:justify-between {
    justify-content: space-between !important;
  }
  .sm\:items-start {
    align-items: flex-start !important;
  }
  .sm\:items-end {
    align-items: flex-end !important;
  }
  .sm\:items-center {
    align-items: center !important;
  }
}

.order-1 {
  order: 1;
}

.order-2 {
  order: 2;
}

.order-3 {
  order: 3;
}

@media (max-width: 1199px) {
  .xl\:order-1 {
    order: 1;
  }
  .xl\:order-2 {
    order: 2;
  }
  .xl\:order-3 {
    order: 3;
  }
}

@media (max-width: 991px) {
  .lg\:order-1 {
    order: 1;
  }
  .lg\:order-2 {
    order: 2;
  }
  .lg\:order-3 {
    order: 3;
  }
}

@media (max-width: 767px) {
  .md\:order-1 {
    order: 1;
  }
  .md\:order-2 {
    order: 2;
  }
  .md\:order-3 {
    order: 3;
  }
}

@media (max-width: 575px) {
  .sm\:order-1 {
    order: 1;
  }
  .sm\:order-2 {
    order: 2;
  }
  .sm\:order-3 {
    order: 3;
  }
}

.bg-white {
  background-color: var(--color-white) !important;
}

.bg-black {
  background-color: var(--color-black) !important;
}

.bg-border {
  background-color: var(--color-border) !important;
}

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

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

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

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

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

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

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

.bg-blue-1 {
  background-color: var(--color-blue-1) !important;
}

.bg-blue-2 {
  background-color: var(--color-blue-2) !important;
}

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

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

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

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

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

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

.bg-brown-1 {
  background-color: var(--color-brown-1) !important;
}

.bg-purple-1 {
  background-color: var(--color-purple-1) !important;
}

.bg-red-1 {
  background-color: var(--color-red-1) !important;
}

.bg-red-2 {
  background-color: var(--color-red-2) !important;
}

.bg-red-3 {
  background-color: var(--color-red-3) !important;
}

.bg-info-1 {
  background-color: var(--color-info-1) !important;
}

.bg-info-2 {
  background-color: var(--color-info-2) !important;
}

.bg-warning-1 {
  background-color: var(--color-warning-1) !important;
}

.bg-warning-2 {
  background-color: var(--color-warning-2) !important;
}

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

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

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

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

.bg-blue-1-05 {
  background-color: rgba(53, 84, 209, 0.05);
}

.bg-white-10 {
  background-color: rgba(255, 255, 255, 0.1);
}

.bg-white-20 {
  background-color: rgba(255, 255, 255, 0.2);
}

.bg-white-50 {
  background-color: rgba(255, 255, 255, 0.5);
}

.bg-black-20 {
  background-color: rgba(0, 0, 0, 0.2);
}

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

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

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

.text-dark-1 {
  color: var(--color-dark-1);
}

.text-dark-2 {
  color: var(--color-dark-2);
}

.text-dark-3 {
  color: var(--color-dark-3);
}

.text-dark-4 {
  color: var(--color-dark-4);
}

.text-light-1 {
  color: var(--color-light-1);
}

.text-light-2 {
  color: var(--color-light-2);
}

.text-light-3 {
  color: var(--color-light-3);
}

.text-blue-1 {
  color: var(--color-blue-1);
}

.text-blue-2 {
  color: var(--color-blue-2);
}

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

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

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

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

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

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

.text-brown-1 {
  color: var(--color-brown-1);
}

.text-purple-1 {
  color: var(--color-purple-1);
}

.text-red-1 {
  color: var(--color-red-1);
}

.text-red-2 {
  color: var(--color-red-2);
}

.text-red-3 {
  color: var(--color-red-3);
}

.text-info-1 {
  color: var(--color-info-1);
}

.text-info-2 {
  color: var(--color-info-2);
}

.text-warning-1 {
  color: var(--color-warning-1);
}

.text-warning-2 {
  color: var(--color-warning-2);
}

.text-error-1 {
  color: var(--color-error-1);
}

.text-error-2 {
  color: var(--color-error-2);
}

.text-success-1 {
  color: var(--color-success-1);
}

.text-success-2 {
  color: var(--color-success-2);
}

.text-inherit {
  color: inherit;
}

.text-white-50 {
  color: rgba(255, 255, 255, 0.5);
}

.d-none {
  display: none !important;
}

.d-flex {
  display: flex !important;
}

.d-block {
  display: block !important;
}

.d-inline-block {
  display: inline-block !important;
}

@media (max-width: 1199px) {
  .xl\:d-none {
    display: none !important;
  }
  .xl\:d-inline-block {
    display: inline-block !important;
  }
  .xl\:d-block {
    display: block !important;
  }
  .xl\:d-flex {
    display: flex !important;
  }
}

@media (max-width: 991px) {
  .lg\:d-none {
    display: none !important;
  }
  .lg\:d-inline-block {
    display: inline-block !important;
  }
  .lg\:d-block {
    display: block !important;
  }
  .lg\:d-flex {
    display: flex !important;
  }
}

@media (max-width: 767px) {
  .md\:d-none {
    display: none !important;
  }
  .md\:d-inline-block {
    display: inline-block !important;
  }
  .md\:d-block {
    display: block !important;
  }
  .md\:d-flex {
    display: flex !important;
  }
}

@media (max-width: 575px) {
  .sm\:d-none {
    display: none !important;
  }
  .sm\:d-inline-block {
    display: inline-block !important;
  }
  .sm\:d-block {
    display: block !important;
  }
  .sm\:d-flex {
    display: flex !important;
  }
}

@media (max-width: 1300px) {
  .xxl\:d-none {
    display: none !important;
  }
}

.html-overflow-hidden {
  overflow: hidden !important;
}

.html-overflow-hidden body {
  overflow-y: scroll;
}

.origin-top {
  transform-origin: top !important;
}

.origin-left {
  transform-origin: left !important;
}

.overflow-scroll {
  overflow: scroll !important;
}

.overflow-hidden {
  overflow: hidden !important;
}

.overflow-normal {
  overflow: initial !important;
}

.overflow-visible {
  overflow: visible !important;
}

.pointer-events-auto {
  pointer-events: auto !important;
}

.pointer-events-none {
  pointer-events: none !important;
}

.bg-image {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  width: 100%;
  height: 100%;
}

.img-ratio {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.line-through {
  text-decoration: line-through;
}

.underline {
  text-decoration: underline;
}

.italic {
  font-style: italic;
}

.uppercase {
  text-transform: uppercase;
}

.capitalize {
  text-transform: capitalize;
}

.normal {
  text-transform: none;
}

.rounded-0 {
  border-radius: 0;
}

.rounded-4 {
  border-radius: 4px;
}

.rounded-8 {
  border-radius: 8px;
}

.rounded-16 {
  border-radius: 16px;
}

.rounded-22 {
  border-radius: 22px;
}

.rounded-100 {
  border-radius: 100px;
}

.rounded-full {
  border-radius: 100%;
}

.rounded-right-4 {
  border-radius: 0 4px 4px 0;
}

@media (max-width: 991px) {
  .lg\:border-none {
    border: none !important;
  }
}

.border-type-1 {
  border: 1px dashed var(--color-blue-1);
}

.border-top-light {
  border-top: 1px solid var(--color-border);
}

.border-left-light {
  border-left: 1px solid var(--color-border);
}

.border-bottom-light {
  border-bottom: 1px solid var(--color-border);
}

.border-white {
  border: 1px solid white;
}

.border-dark-1 {
  border: 1px solid var(--color-dark-1);
}

.border-dark-4 {
  border: 1px solid var(--color-dark-4);
}

.border-blue-1 {
  border: 1px solid var(--color-blue-1);
}

.border-white-15 {
  border: 1px solid rgba(255, 255, 255, 0.15);
}

.border-top-white-15 {
  border-top: 1px solid rgba(255, 255, 255, 0.15);
}

.border-light {
  border: 1px solid var(--color-border) !important;
}

.size-3 {
  flex-shrink: 0;
  width: 3px;
  height: 3px;
}

.size-4 {
  flex-shrink: 0;
  width: 4px;
  height: 4px;
}

.size-10 {
  flex-shrink: 0;
  width: 10px;
  height: 10px;
}

.size-30 {
  flex-shrink: 0;
  width: 30px;
  height: 30px;
}

.size-38 {
  flex-shrink: 0;
  width: 38px;
  height: 38px;
}

.size-35 {
  flex-shrink: 0;
  width: 35px;
  height: 35px;
}

.size-40 {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
}

.size-180 {
  flex-shrink: 0;
  width: 180px;
  height: 180px;
}

.size-140 {
  flex-shrink: 0;
  width: 140px;
  height: 140px;
}

.size-80 {
  flex-shrink: 0;
  width: 80px;
  height: 80px;
}

.size-50 {
  flex-shrink: 0;
  width: 50px;
  height: 50px;
}

.size-60 {
  flex-shrink: 0;
  width: 60px;
  height: 60px;
}

.size-65 {
  flex-shrink: 0;
  width: 65px;
  height: 65px;
}

.size-20 {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
}

.size-70 {
  flex-shrink: 0;
  width: 70px;
  height: 70px;
}

.size-100 {
  flex-shrink: 0;
  width: 100px;
  height: 100px;
}

.size-120 {
  flex-shrink: 0;
  width: 120px;
  height: 120px;
}

.size-250 {
  flex-shrink: 0;
  width: 250px;
  height: 250px;
}

.size-160 {
  flex-shrink: 0;
  width: 160px;
  height: 160px;
}

.size-130 {
  flex-shrink: 0;
  width: 130px;
  height: 130px;
}

.shadow-1 {
  box-shadow: 0px 20px 40px 0px #05103612;
}

.shadow-2 {
  box-shadow: 0px 10px 35px 0px #0510361A;
}

.shadow-3 {
  box-shadow: 0px 10px 30px 0px #05103608;
}

.shadow-4 {
  box-shadow: 0px 10px 60px 0px #0510360D;
}

.flex-center {
  display: flex;
  justify-content: center;
  align-items: center;
}

.flex-wrap {
  flex-wrap: wrap;
}

.h-full {
  height: 100% !important;
}

.h-34 {
  height: 34px !important;
}

.h-60 {
  height: 60px !important;
}

.h-1 {
  height: 1px !important;
}

.h-68 {
  height: 68px !important;
}

.h-50 {
  height: 50px !important;
}

.h-20 {
  height: 20px !important;
}

.h-40 {
  height: 40px !important;
}

.w-48 {
  width: 48px;
}

.w-28 {
  width: 28px;
}

.w-max-300 {
  max-width: 300px;
}

.slider-scrollbar {
  width: 100%;
  border-radius: 4px;
  height: 3px;
}

.slider-scrollbar .swiper-scrollbar-drag {
  cursor: -webkit-grab;
  cursor: grab;
  background-color: var(--color-dark-1);
}

.slider-scrollbar .swiper-scrollbar-drag:active:hover {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}

.slider-scrollbar.-light .swiper-scrollbar-drag {
  background-color: var(--color-white);
}

.pointer {
  cursor: pointer;
}

.section-bg {
  position: relative;
  z-index: 0;
}

.section-bg__item {
  position: absolute;
  top: 0;
  height: 100%;
  z-index: -1;
}

.section-bg__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.section-bg__item.-w-1500 {
  width: 1500px;
  left: 50%;
  transform: translateX(-50%);
}

@media (max-width: 1199px) {
  .section-bg__item.-w-1500 {
    width: 100%;
  }
}

.section-bg__item.-w-1165 {
  width: 64vw;
}

@media (max-width: 1199px) {
  .section-bg__item.-w-1165 {
    width: 100%;
  }
}

.section-bg__item.-video-left {
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 40vw;
  height: unset;
}

@media (max-width: 1199px) {
  .section-bg__item.-video-left {
    top: unset;
    width: 100%;
    transform: none;
    position: relative;
    margin: 0 auto;
    padding: 0 15px;
    max-width: 960px;
  }
}

@media (max-width: 991px) {
  .section-bg__item.-video-left {
    max-width: 720px;
  }
}

@media (max-width: 767px) {
  .section-bg__item.-video-left {
    max-width: 540px;
  }
}

.section-bg__item.-left {
  left: 0;
}

.section-bg__item.-right {
  right: 0;
}

.section-bg__item.-left-100 {
  left: 100px;
}

@media (max-width: 991px) {
  .section-bg__item.-left-100 {
    left: 0;
  }
}

.section-bg__item.-right-100 {
  right: 100px;
}

@media (max-width: 991px) {
  .section-bg__item.-right-100 {
    right: 0;
  }
}

.section-bg__item.-mx-20 {
  left: 20px;
  right: 20px;
}

@media (max-width: 767px) {
  .section-bg__item.-mx-20 {
    left: 0;
    right: 0;
  }
}

@media (max-width: 767px) {
  .section-bg__item.-image {
    position: relative;
    width: 100%;
  }
}

.object-cover {
  object-fit: cover;
}

.currencyMenu {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding-top: 120px;
  z-index: 1100;
  pointer-events: auto;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.currencyMenu.is-hidden {
  pointer-events: none;
  opacity: 0;
}

.currencyMenu__bg {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(5, 16, 54, 0.4);
}

.currencyMenu__content {
  position: absolute;
  left: 50%;
  z-index: 1;
  width: 1070px;
  height: auto;
  transform: translateX(-50%);
}

.modalGrid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  grid-gap: 30px;
  gap: 30px;
}

@media (max-width: 991px) {
  .modalGrid {
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }
}

@media (max-width: 575px) {
  .modalGrid {
    grid-template-columns: 1fr 1fr 1fr;
    gap: 10px;
  }
}

.modalGrid__item {
  cursor: pointer;
  border-radius: 4px;
  transition: all 0.15s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.modalGrid__item > * > *:nth-child(1) {
  transition: all 0.15s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.modalGrid__item:hover {
  background-color: rgba(53, 84, 209, 0.05) !important;
}

.modalGrid__item:hover > * > *:nth-child(1) {
  color: var(--color-blue-1);
}

.modalGrid__item.-is-active {
  background-color: #F5F5F5;
}

.langMenu {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1100;
  width: 100%;
  height: 100%;
  padding-top: 120px;
  pointer-events: auto;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.langMenu.is-hidden {
  pointer-events: none;
  opacity: 0;
}

.langMenu__bg {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(5, 16, 54, 0.4);
}

.langMenu__content {
  position: absolute;
  left: 50%;
  z-index: 1;
  width: 1070px;
  max-width: 100%;
  height: auto;
  transform: translateX(-50%);
}

.relative {
  position: relative;
}

.ph-white::placeholder {
  color: var(--color-white);
}

.absolute {
  position: absolute;
}

.bottom-0 {
  bottom: 0;
}

.flightLine {
  position: relative;
  width: 100%;
  height: 1px;
  background-color: var(--color-border);
}

.flightLine > * {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 9px;
  height: 9px;
  border: 1px solid var(--color-border);
  border-radius: 100%;
}

.flightLine > *:nth-child(1) {
  left: 0;
  background-color: var(--color-white);
}

.flightLine > *:nth-child(2) {
  right: 0;
  background-color: var(--color-border);
}

.blog-grid-1 {
  display: grid;
  grid-template-columns: 0.66fr 0.33fr;
  grid-template-rows: 250px 250px;
  grid-gap: 30px;
  gap: 30px;
}

@media (max-width: 991px) {
  .blog-grid-1 {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
  }
}

.blog-grid-1 > *:nth-child(1) {
  grid-row: span 2;
}

@media (max-width: 991px) {
  .blog-grid-1 > *:nth-child(1) {
    grid-row: unset;
  }
}

.border-center > *:nth-child(2n + 2) {
  border-left: 1px solid var(--color-light-2);
}

.border-center > *:nth-child(1n + 3) {
  border-top: 1px solid var(--color-light-2);
}

@media (max-width: 991px) {
  .border-center > *:nth-child(1n + 2) {
    border-top: 1px solid var(--color-light-2);
  }
  .border-center > * {
    border-left: 0;
  }
}

.header-banner {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

.section-slider-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
}

.section-slider-nav.-prev {
  left: -20px;
}

.section-slider-nav.-next {
  right: -20px;
}

@media (max-width: 767px) {
  .md\:size-full {
    width: 100%;
    height: auto;
  }
}

.sidebar__item:not(.-no-border) {
  border-top: 1px solid var(--color-border);
}

.sidebar.-mobile-filter {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 40px;
  gap: 40px;
  padding-left: 24px;
  padding-right: 24px;
  padding-bottom: 10px;
  padding-top: 70px;
}

.sidebar.-mobile-filter .-icon-close {
  position: absolute;
  top: 20px;
  left: 24px;
}

@media (max-width: 767px) {
  .sidebar.-mobile-filter {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 575px) {
  .sidebar.-mobile-filter {
    grid-template-columns: 1fr;
  }
}

.sidebar.-mobile-filter > * {
  border-top: none !important;
}

.w-250 {
  width: 250px;
  max-width: 100%;
}

.w-1 {
  width: 1px;
  max-width: 100%;
}

.w-200 {
  width: 200px;
  max-width: 100%;
}

.w-180 {
  width: 180px;
  max-width: 100%;
}

.halfMap {
  display: flex;
  width: 100%;
  min-height: calc(100vh - 90px);
  margin-top: 90px;
}

@media (max-width: 991px) {
  .halfMap {
    flex-direction: column;
  }
}

@media (max-width: 767px) {
  .halfMap {
    margin-top: 80px;
  }
}

.halfMap__content {
  width: 865px;
  max-width: 100%;
  flex-shrink: 0;
  padding: 30px;
  min-height: 100%;
}

@media (max-width: 1199px) {
  .halfMap__content {
    width: 660px;
  }
}

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

@media (max-width: 767px) {
  .halfMap__content {
    padding: 20px;
  }
}

.halfMap__map {
  width: 100%;
  min-height: 100%;
}

@media (max-width: 991px) {
  .halfMap__map {
    order: 1;
  }
}

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

.galleryGrid.-type-1 {
  display: grid;
  grid-template-columns: 0.52fr 0.24fr 0.24fr;
  grid-template-rows: 1fr 1fr;
  grid-gap: 10px;
  gap: 10px;
}

@media (max-width: 991px) {
  .galleryGrid.-type-1 {
    grid-template-columns: 1fr 1fr 1fr;
  }
}

@media (max-width: 767px) {
  .galleryGrid.-type-1 {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 575px) {
  .galleryGrid.-type-1 {
    grid-template-columns: 1fr;
  }
}

.galleryGrid.-type-1 > *:nth-child(1) {
  grid-row: 2 span;
}

@media (max-width: 991px) {
  .galleryGrid.-type-1 > *:nth-child(1) {
    grid-row: 1;
  }
}

.galleryGrid.-type-1 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (max-width: 991px) {
  .galleryGrid.-type-1 img {
    width: 100%;
  }
}

.galleryGrid.-type-2 {
  display: grid;
  grid-template-columns: 0.6fr 0.2fr 0.2fr;
  grid-template-rows: 0.4fr 0.6fr;
  grid-gap: 10px;
  gap: 10px;
}

@media (max-width: 991px) {
  .galleryGrid.-type-2 {
    grid-template-columns: 1fr 1fr 1fr;
  }
}

@media (max-width: 767px) {
  .galleryGrid.-type-2 {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 575px) {
  .galleryGrid.-type-2 {
    grid-template-columns: 1fr;
  }
}

.galleryGrid.-type-2 > *:nth-child(1) {
  grid-row: 2 span;
}

.galleryGrid.-type-2 > *:nth-child(4) {
  grid-column: 2 span;
}

.galleryGrid.-type-2 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (max-width: 991px) {
  .galleryGrid.-type-2 img {
    width: 100%;
  }
}

.min-h-250 {
  min-height: 250px;
}

.roomGrid {
  width: 100%;
}

.roomGrid__header {
  display: grid;
  grid-template-columns: 180px 1fr 60px 170px 140px 270px;
  grid-gap: 30px;
  gap: 30px;
  background-color: var(--color-dark-3);
  color: white;
  font-weight: 500;
  padding: 15px 0;
}

@media (max-width: 1400px) {
  .roomGrid__header {
    grid-template-columns: 140px 1fr 60px 170px 140px 180px;
  }
}

@media (max-width: 1199px) {
  .roomGrid__header {
    display: none;
  }
}

.roomGrid__header > *:first-child {
  padding-left: 30px;
}

.roomGrid__grid {
  display: grid;
  grid-gap: 30px;
  gap: 30px;
  grid-template-columns: 180px auto 270px;
}

@media (max-width: 1400px) {
  .roomGrid__grid {
    grid-template-columns: 140px auto 180px;
  }
}

@media (max-width: 1199px) {
  .roomGrid__grid {
    grid-template-columns: 140px auto;
  }
  .roomGrid__grid > *:nth-child(3) {
    grid-column: 2 span;
  }
}

@media (max-width: 991px) {
  .roomGrid__grid {
    grid-template-columns: 1fr;
  }
  .roomGrid__grid > *:nth-child(1) {
    display: flex;
    align-items: center;
  }
  .roomGrid__grid > *:nth-child(1) > *:first-child {
    min-width: 200px;
    margin-right: 20px;
  }
  .roomGrid__grid > *:nth-child(2) {
    grid-column: 2 span;
  }
}

@media (max-width: 767px) {
  .roomGrid__grid > *:nth-child(1) {
    display: block;
    align-items: unset;
  }
  .roomGrid__grid > *:nth-child(1) > *:first-child {
    min-width: auto;
    width: 100%;
    margin-right: 0;
  }
}

.roomGrid__grid > * {
  padding-top: 20px;
}

.roomGrid__grid > *:nth-child(3) {
  background-color: rgba(53, 84, 209, 0.05);
  padding: 20px 30px;
}

.roomGrid__content {
  display: grid;
  grid-template-columns: 1fr 60px 170px 140px;
  grid-gap: 30px;
  gap: 30px;
}

@media (max-width: 767px) {
  .roomGrid__content {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

.roomGrid__content:nth-child(1n + 2) {
  border-top: 1px solid var(--color-border);
}

.progressBar {
  position: relative;
}

.progressBar__bg {
  width: 100%;
  height: 4px;
  border-radius: 4px;
}

.progressBar__bar {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 5;
  height: 100%;
  border-radius: 4px;
}

.progressBar__bar span {
  position: absolute;
  right: 0;
  bottom: 100%;
}

.tooltip {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #615E5E;
}

.tooltip__content {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 7px 11px;
  font-size: 14px;
  line-height: 1.2;
  background-color: var(--color-dark-1);
  color: white;
  border-radius: 8px;
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
  opacity: 0;
}

.tooltip__content::after {
  content: '';
  position: absolute;
  width: 8px;
  height: 8px;
  background-color: black;
  transform: rotate(45deg);
}

.tooltip.-top .tooltip__content {
  bottom: calc(100% + 6px);
  transform: translateY(8px);
}

.tooltip.-top .tooltip__content::after {
  bottom: -4px;
}

.tooltip.-bottom .tooltip__content {
  top: calc(100% + 6px);
  transform: translateY(-8px);
}

.tooltip.-bottom .tooltip__content::after {
  top: -4px;
}

.tooltip.-left .tooltip__content {
  right: calc(100% + 6px);
  transform: translateX(8px);
}

.tooltip.-left .tooltip__content::after {
  right: -4px;
}

.tooltip.-right .tooltip__content {
  left: calc(100% + 6px);
  transform: translateX(-8px);
}

.tooltip.-right .tooltip__content::after {
  left: -4px;
}

.tooltip:hover .tooltip__content {
  transform: none;
  opacity: 1;
}

.gallery__item {
  position: relative;
  display: block;
}

.gallery__item:hover .gallery__button {
  opacity: 1;
}

.gallery__button {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  background-color: black;
  border-radius: 100%;
  width: rem(52px);
  height: rem(52px);
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
  opacity: 0;
}

.gallery__button .icon {
  color: white;
  stroke-width: 1;
  width: rem(28px);
  height: rem(28px);
}

.gallery__button.-bottom-right {
  top: unset;
  left: unset;
  transform: unset;
  bottom: rem(30px);
  right: rem(30px);
}

.form-input {
  position: relative;
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
  display: flex;
}

.form-input label {
  position: absolute;
  top: 0;
  top: 26px;
  padding: 0 15px;
  pointer-events: none;
  font-size: 14px;
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.form-input textarea,
.form-input input {
  border: 1px solid var(--color-border);
  border-radius: 4px;
  padding: 0 15px;
  padding-top: 25px;
  min-height: 70px;
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.form-input textarea:focus,
.form-input input:focus {
  border: 2px solid #051036 !important;
}

.form-input textarea:focus ~ label, .form-input textarea:valid ~ label,
.form-input input:focus ~ label, .form-input input:valid ~ label {
  transform: translateY(-10px);
}

.sidebar.-blog > * + * {
  padding-top: 30px;
  margin-top: 30px;
}

.list-disc li {
  list-style-type: disc;
  list-style-position: inside;
}

.w-360 {
  width: 360px;
}

@media (max-width: 991px) {
  .lg\:w-full {
    width: 100% !important;
  }
}

@media (max-width: 575px) {
  .sm\:w-full {
    width: 100% !important;
  }
}

.w-140 {
  width: 140px;
  max-width: 100%;
}

.w-210 {
  width: 210px;
  max-width: 100%;
}

.w-230 {
  width: 230px;
  max-width: 100%;
}

.no-page__title {
  font-size: 200px;
  font-weight: 600;
  line-height: 1.2;
}

table.table th {
  padding: 25px 40px;
  line-height: 1;
  font-weight: 500;
}

table.table th:first-child {
  border-radius: 8px 0 0 8px;
}

table.table th:last-child {
  border-radius: 0 8px 8px 0;
}

table.table tbody > tr + tr {
  border-top: 1px solid var(--color-border);
}

table.table td {
  padding: 20px 40px;
  font-size: 15px;
  border-bottom: 1px solid var(--color-light-5);
}

table.table-2 th {
  font-weight: 500;
  padding: 15px 10px;
  line-height: 1.2;
}

table.table-2 th:first-child {
  border-radius: 8px 0 0 8px;
}

table.table-2 th:last-child {
  border-radius: 0 8px 8px 0;
}

table.table-2 th:nth-child(1) {
  padding-left: 0;
}

table.table-2 th:last-child {
  text-align: right;
  padding-right: 0;
}

table.table-2 tbody > tr {
  border-top: 1px dashed var(--color-border);
  vertical-align: top;
}

table.table-2 td {
  padding: 15px 10px;
  font-size: 15px;
  line-height: 1.2;
}

table.table-2 td:nth-child(1) {
  padding-left: 0;
}

table.table-2 td:last-child {
  text-align: right;
  padding-right: 0;
}

.overflow-x-scroll {
  overflow-x: scroll;
}

table.table-3 th {
  font-weight: 500;
  padding: 20px 30px;
  line-height: 1.2;
  min-width: 130px;
}

@media (max-width: 1199px) {
  table.table-3 th {
    padding: 15px 15px;
    min-width: 100px;
  }
}

table.table-3 th:first-child {
  border-radius: 8px 0 0 8px;
}

table.table-3 th:last-child {
  border-radius: 0 8px 8px 0;
}

table.table-3 tbody tr {
  vertical-align: top;
}

table.table-3 tbody > tr + tr {
  border-top: 1px dashed var(--color-border);
}

table.table-3 td {
  padding: 15px 30px;
  font-size: 15px;
  line-height: 1.2;
  min-width: 130px;
}

@media (max-width: 1199px) {
  table.table-3 td {
    padding: 15px 15px;
  }
}

table.table-3.-border-bottom tbody > tr {
  border-top: none;
  border-bottom: 1px dashed var(--color-border);
}

table.table-4 th {
  font-weight: 500;
  padding: 20px 30px;
  line-height: 1.2;
  min-width: 130px;
}

@media (max-width: 1199px) {
  table.table-4 th {
    padding: 15px 15px;
    min-width: 100px;
  }
}

table.table-4 th:first-child {
  border-radius: 8px 0 0 8px;
}

table.table-4 th:last-child {
  border-radius: 0 8px 8px 0;
}

table.table-4 tbody tr {
  vertical-align: top;
}

table.table-4 tbody > tr + tr {
  border-top: 1px dashed var(--color-border);
}

table.table-4 td {
  padding: 20px 30px;
  font-size: 15px;
  line-height: 1.2;
  min-width: 130px;
}

@media (max-width: 1199px) {
  table.table-4 td {
    padding: 15px 15px;
  }
}

table.table-4.-border-bottom tbody > tr {
  border-top: none;
  border-bottom: 1px dashed var(--color-border);
}

table.table-5 {
  width: 100%;
}

table.table-5 th {
  font-weight: 500;
  padding: 20px 15px;
  line-height: 1.2;
  min-width: 130px;
}

@media (max-width: 1199px) {
  table.table-5 th {
    padding: 15px 15px;
    min-width: 100px;
  }
}

table.table-5 th:first-child {
  border-radius: 8px 0 0 8px;
}

table.table-5 th:last-child {
  border-radius: 0 8px 8px 0;
}

table.table-5 tbody tr {
  vertical-align: top;
}

table.table-5 tbody > tr {
  border-bottom: 1px solid var(--color-border);
}

table.table-5 td {
  padding: 20px 15px;
  font-size: 15px;
  line-height: 1.2;
  min-width: 130px;
}

@media (max-width: 1199px) {
  table.table-5 td {
    padding: 15px 15px;
  }
}

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

.z-0 {
  z-index: 0;
}

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

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

.z-3 {
  z-index: 3;
}

.z-4 {
  z-index: 4;
}

.z-5 {
  z-index: 5;
}

.side-badge {
  position: absolute;
  top: -7px;
  left: -3px;
}

.side-badge > * {
  border: 3px solid white;
}

.map-500 {
  min-height: 500px;
  height: 500px;
}

@media (max-width: 575px) {
  .map-500 {
    min-height: 400px;
    height: 400px;
  }
}

.map-form {
  position: relative;
  margin-top: -680px;
}

@media (max-width: 991px) {
  .map-form {
    margin-top: 40px;
  }
}

.h-400 {
  height: 400px;
  min-height: 400px;
}

.table-calendar {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.table-calendar__header {
  font-size: 14px;
  font-weight: 600;
}

.table-calendar__grid {
  font-size: 15px;
}

.table-calendar__cell {
  cursor: pointer;
  position: relative;
  z-index: 0;
  transition: all 0.15s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.table-calendar__cell:hover {
  background-color: var(--color-dark-3);
  color: white;
}

.table-calendar__cell.-is-in-path {
  position: relative;
  z-index: 0;
  color: var(--color-dark-1) !important;
}

.table-calendar__cell.-is-in-path::before {
  content: "";
  background-color: var(--color-light-2);
  position: absolute;
  top: 0;
  left: -16px;
  right: -16px;
  z-index: -2;
  height: 100%;
}

.table-calendar__cell.-is-active {
  position: relative;
  z-index: 2;
  background-color: var(--color-dark-3);
  color: white;
}

.table-calendar__header, .table-calendar__grid {
  display: grid;
  justify-content: center;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-gap: 8px;
  gap: 8px;
}

.table-calendar__header > *, .table-calendar__grid > * {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  width: 48px;
  height: 48px;
  border-radius: 100%;
}

@media (max-width: 767px) {
  .table-calendar__header > *, .table-calendar__grid > * {
    width: 32px;
    height: 32px;
  }
}

.desktopMenu {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10;
  width: 450px;
  max-width: 100%;
  height: 100%;
  transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
  opacity: 0;
  pointer-events: none;
}

.desktopMenu .mobile-bg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  background-color: white;
}

.desktopMenu__content {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.desktopMenu-overlay {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: -2;
  background-color: rgba(5, 16, 54, 0.5);
}

.desktopMenu.is-menu-active {
  opacity: 1;
  pointer-events: auto;
}

.desktopMenu.is-menu-active .-is-active {
  pointer-events: auto !important;
  overflow-x: hidden;
}

.desktopMenu .menu {
  overflow-y: hidden;
  overflow-x: hidden;
  position: relative;
  height: 100%;
}

.desktopMenu .menu ul {
  pointer-events: none;
}

.desktopMenu .menu li {
  overflow: hidden;
}

.desktopMenu .menu a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 50px;
  padding: 0 20px;
  border-radius: 4px;
  font-weight: 500;
  color: var(--color-dark-1);
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.desktopMenu .menu a .icon {
  font-size: 8px;
  transform: rotate(-90deg);
}

.desktopMenu .menu a:hover {
  color: var(--color-blue-1);
}

.desktopMenu .menu__nav {
  display: flex;
  flex-direction: column;
}

.desktopMenu .menu__nav > li > a {
  font-size: 20px;
}

.desktopMenu .menu__nav > li > a:hover {
  background-color: rgba(53, 84, 209, 0.05) !important;
}

.desktopMenu .menu .subnav {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.desktopMenu .menu .subnav a {
  height: 40px;
  font-size: 18px;
  padding: 0 20px;
  transform: translateY(100%);
}

.desktopMenu .menu .subnav__backBtn {
  margin-bottom: 10px;
}

.desktopMenu .menu .subnav__backBtn li {
  padding: 0;
}

.desktopMenu .menu .subnav__backBtn a {
  justify-content: flex-start;
  height: 50px;
  font-size: 20px;
  color: var(--color-blue-1);
  background-color: rgba(53, 84, 209, 0.05) !important;
}

.desktopMenu .menu .subnav__backBtn a .icon {
  margin-right: 12px;
  transform: rotate(90deg);
}

.searchMenu {
  position: relative;
}

.searchMenu__field {
  position: absolute;
  padding-top: 30px;
  top: 100%;
  left: 0;
  z-index: 5;
  width: 500px;
  max-width: 100vw;
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
  pointer-events: none;
  opacity: 0;
}

.searchMenu__field.is-visible {
  pointer-events: auto;
  opacity: 1;
}

.searchMenu .-link:hover {
  background-color: rgba(53, 84, 209, 0.05) !important;
}

.h-34 {
  height: 34px;
}

.dropRating {
  position: absolute;
  top: calc(100% + 10px);
  z-index: 10;
  width: 340px;
  max-width: 100vw;
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
  pointer-events: none;
  opacity: 0;
}

.dropRating.-is-active {
  pointer-events: auto;
  opacity: 1;
}

.quote {
  position: relative;
  padding: 20px 0;
  padding-left: 75px;
  width: 740px;
  max-width: 100%;
}

.quote__line {
  width: 5px;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}

.quote__icon {
  position: absolute;
  top: 12px;
  left: 22px;
  z-index: -1;
}

.hotelSingleGrid {
  display: grid;
  grid-gap: 30px;
  gap: 30px;
  grid-template-columns: 1fr 360px;
}

@media (max-width: 767px) {
  .hotelSingleGrid {
    grid-template-columns: 1fr;
  }
}

.border-test {
  position: absolute;
  top: 0;
  bottom: 40px;
  left: 19px;
  z-index: -1;
  border-left: 2px dashed #E5F0FD;
}

.border-line-2 {
  position: absolute;
  top: 12px;
  bottom: 12px;
  left: 13px;
  z-index: -1;
  border-left: 1px solid var(--color-border);
}

@media (max-width: 575px) {
  .border-line-2 {
    display: none;
  }
}

.map {
  width: 100%;
  height: 100%;
  background-color: #a3a3a3;
}

.carsSlider {
  display: grid;
  grid-gap: 10px;
  gap: 10px;
  grid-template-columns: 120px calc(100% - 130px);
}

@media (max-width: 767px) {
  .carsSlider {
    grid-template-columns: 1fr;
  }
}

.carsSlider .carsSlider-slides {
  display: flex;
  flex-direction: column;
}

.carsSlider .carsSlider-slides > * + * {
  margin-top: 10px;
}

@media (max-width: 767px) {
  .carsSlider .carsSlider-slides {
    flex-direction: row;
    order: 2;
  }
  .carsSlider .carsSlider-slides > * + * {
    margin-top: 0;
    margin-left: 10px;
  }
}

.carsSlider .carsSlider-slides__item {
  border: 1px solid #DDDDDD;
}

.carsSlider .carsSlider-slides__item.-is-active {
  border: 1px solid #051036;
}

.carsSlider .carsSlider-slider {
  overflow: hidden;
  width: 100%;
}

@media (max-width: 767px) {
  .carsSlider .carsSlider-slider {
    order: 1;
  }
}

.carsSlider .carsSlider-slider img {
  border: 1px solid #DDDDDD;
  width: 100%;
  max-height: 510px;
}

.cruiseSlider .cruiseSlider-slides__item {
  border: 1px solid #DDDDDD;
}

.cruiseSlider .cruiseSlider-slides__item.-is-active {
  border: 1px solid #051036;
}

.cruiseSlider .cruiseSlider-slider {
  overflow: hidden;
  width: 100%;
}

@media (max-width: 767px) {
  .cruiseSlider .cruiseSlider-slider {
    order: 1;
  }
}

.cruiseSlider .cruiseSlider-slider img {
  border: 1px solid #DDDDDD;
  width: 100%;
  max-height: 510px;
}

.cruiseSlider__nav {
  position: absolute;
  top: 50%;
  z-index: 10;
  transform: translateY(-50%);
}

.cruiseSlider__nav.-prev {
  left: 20px;
}

.cruiseSlider__nav.-next {
  right: 20px;
}

@media (max-width: 767px) {
  .cruiseSlider__nav {
    top: unset;
    bottom: 30px;
    transform: none;
  }
  .cruiseSlider__nav.-prev {
    left: unset;
    right: calc(50% + 10px);
  }
  .cruiseSlider__nav.-next {
    right: unset;
    left: calc(50% + 10px);
  }
}

.w-max-120 {
  max-width: 120px;
}

.singleMenu {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 20;
  top: 0;
  background-color: white;
  border-bottom: 1px solid #DDDDDD;
  display: flex;
  align-items: center;
  transition: all 0.15s cubic-bezier(0.165, 0.84, 0.44, 1);
  opacity: 0;
  pointer-events: none;
}

.singleMenu.-is-active {
  opacity: 1;
  pointer-events: auto;
}

.singleMenu__content {
  width: 100%;
  min-height: 80px;
  padding: 15px 0;
}

.singleMenu__links a {
  font-size: 15px;
  font-weight: 500;
}

.overflow-x-hidden {
  overflow-x: clip;
}

.-is-dd-wrap-active .-dd-button {
  border-color: var(--color-dark-1) !important;
  outline: 1px solid var(--color-dark-1) !important;
}

.-is-dd-wrap-active .-dd-button .icon {
  transform: rotate(180deg);
}

.noUi-target {
  height: 4px;
  border: none;
  outline: 1px solid rgba(0, 0, 0, 0.08);
}

.noUi-connect {
  background-color: var(--color-blue-1) !important;
  box-shadow: 0 !important;
}

.noUi-handle {
  border-radius: 100%;
  width: 20px !important;
  height: 20px !important;
  top: 50% !important;
  transform: translateY(-50%);
  border: 2px solid var(--color-blue-1);
  box-shadow: 0 !important;
}

.noUi-handle::before {
  display: none;
}

.noUi-handle::after {
  display: none;
}

.filterPopup {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1100;
  overflow-y: scroll;
  transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
  opacity: 0;
  pointer-events: none;
}

.filterPopup.-is-active {
  opacity: 1;
  pointer-events: auto;
}

.base-tr {
  transition: all 0.2s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.date-input {
  display: flex;
  flex-flow: row-reverse;
  width: 100%;
}

.date-input::-webkit-calendar-picker-indicator {
  cursor: pointer;
  background: none;
  z-index: 2;
  margin-right: 10px;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}

.calendar-icon {
  position: absolute;
  top: 28px;
}

.calendar-icon.-left {
  left: 40px;
}

.calendar-icon.-right {
  right: 40px;
}

.gm-style-iw-t {
  right: unset !important;
  left: 25px;
  bottom: 20px !important;
}

.mapMarker {
  position: relative;
  z-index: 100;
}

.mapMarker:hover {
  background-color: var(--color-dark-1) !important;
  border-color: var(--color-dark-1) !important;
  color: white !important;
}

.gm-style .gm-style-iw-c {
  border-radius: 4px;
}

.mapItem__img {
  width: 100px !important;
  height: 100px !important;
  object-fit: cover;
}

.mapItem__content {
  height: 100px;
}

.map-ratio {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  max-height: 700px;
}

.show-more__content {
  overflow: hidden;
  max-height: 0;
  transition: .2s;
}

.show-more.-h-60 .show-more__content {
  max-height: 80px;
}

.elCalendar__slider {
  overflow: hidden;
}

.elCalendar__sliderNav {
  position: absolute;
  top: 40px;
  z-index: 10;
}

.elCalendar__sliderNav.-prev {
  left: 60px;
}

.elCalendar__sliderNav.-next {
  right: 60px;
}

@media (max-width: 767px) {
  .elCalendar__sliderNav.-prev {
    left: 54px;
  }
  .elCalendar__sliderNav.-next {
    right: 54px;
  }
}

.elCalendar__month {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.elCalendar__header {
  display: grid;
  grid-template-columns: repeat(7, min-content);
  grid-gap: 8px;
  gap: 8px;
}

.elCalendar__header__sell {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 48px;
  height: 48px;
  font-size: 14px;
  font-weight: 600;
}

@media (max-width: 767px) {
  .elCalendar__header__sell {
    width: 32px;
    height: 32px;
  }
}

.elCalendar__body {
  display: grid;
  grid-template-columns: repeat(7, min-content);
  grid-gap: 8px;
  gap: 8px;
}

.elCalendar__sell {
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 48px;
  height: 48px;
  border-radius: 100%;
  transition: 0.2s;
}

@media (max-width: 767px) {
  .elCalendar__sell {
    width: 32px;
    height: 32px;
  }
}

.elCalendar__sell.-dark {
  opacity: 0.4;
}

.elCalendar__sell:hover {
  background-color: rgba(0, 0, 0, 0.041);
}

.elCalendar__sell.-is-active {
  position: relative;
  color: white;
  background-color: var(--color-dark-3);
  z-index: 1;
}

.elCalendar__sell.-is-in-path {
  position: relative;
  color: var(--color-dark-1) !important;
  z-index: 0;
}

.elCalendar__sell.-is-in-path::before {
  content: "";
  position: absolute;
  top: 0;
  left: -12px;
  right: -12px;
  height: 100%;
  background-color: var(--color-light-2);
  z-index: -2;
}

/*!*******************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/common.css ***!
  \*******************************************************************************************************************************************************************************************************************************************************************************/
/* ==================================================
   Friday – Common Typography & Layout System
   ================================================== */

/* --------------------------------------------------
   1. Font definition & global base
-------------------------------------------------- */

:root {
  --font-friday: 'Paperlogy',
    -apple-system, BlinkMacSystemFont,
    'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR',
    Arial, sans-serif;
  --z-header: 3000;
  --z-header-menu: 3100;
  --z-stickybar: 1200;
}


html,
body {
  font-family: var(--font-friday);
  letter-spacing: -0.01em;
  text-rendering: geometricPrecision;
}

button,
input,
textarea,
select {
  font-family: inherit;
}

/* --------------------------------------------------
   2. Global layout spacing utilities
-------------------------------------------------- */

.layout-pt-sm { padding-top: 36px; }
.layout-pb-sm { padding-bottom: 40px; }

.layout-pt-md { padding-top: 48px; }
.layout-pb-md { padding-bottom: 56px; }

/* --------------------------------------------------
   3. Headings & section titles
   (global but intentional – product typography)
-------------------------------------------------- */

h1, h2, h3, h4, h5, h6,
.sectionTitle__title,
.sectionTitle h2,
.sectionTitle h3,
.sectionTitle__text {
  font-family: var(--font-friday);
}

/* Section title (primary headings) */
.sectionTitle__title,
.sectionTitle h2 {
  font-weight: 700;            /* Paperlogy Bold */
  letter-spacing: -0.02em;
  line-height: 1.15;
}

/* Section subtitle / description */
.sectionTitle__text {
  font-weight: 400;
  line-height: 1.65;
}

/* --------------------------------------------------
   4. Hero typography (explicit override zone)
-------------------------------------------------- */

.hero,
.hero h1,
.hero h2,
.hero p,
.hero a,
.hero button {
  font-family: var(--font-friday);
}

.hero h1,
.hero .hero__title {
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.05;
}

.hero p,
.hero .hero__text {
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: -0.01em;
}

/* --------------------------------------------------
   5. Card & list typography normalization
-------------------------------------------------- */

/* 카드 내부 폰트 통일 (의도적 전역) */
.card,
.card *,
.shadow-card,
.shadow-card * {
  font-family: var(--font-friday);
}

/* Card titles */
.card-title,
.card h3,
.card h4,
.blogCard__title,
.featureCard__title {
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.25;
}

/* Card body text */
.card p,
.blogCard__text,
.featureCard__text {
  font-weight: 400;
  line-height: 1.65;
}

/* --------------------------------------------------
   6. Buttons, badges, tags
-------------------------------------------------- */

button,
.btn,
.button,
a.button,
.btn-primary,
.btn-secondary {
  font-family: var(--font-friday);
  font-weight: 600;            /* SemiBold = product feel */
  letter-spacing: -0.01em;
}

/* Small UI elements */
.badge,
.tag,
.chip,
.pill {
  font-weight: 500;
  letter-spacing: -0.01em;
}

/* --------------------------------------------------
   7. fw-* utilities (Paperlogy weight mapping)
-------------------------------------------------- */

.fw-400 { font-weight: 400 !important; }
.fw-500 { font-weight: 500 !important; }
.fw-600 { font-weight: 600 !important; }
.fw-700 { font-weight: 700 !important; }

/* --------------------------------------------------
   8. Text utility line-height normalization
-------------------------------------------------- */

.text-12,
.text-13,
.text-14,
.text-15,
.text-16,
.text-18,
.text-20 {
  font-family: var(--font-friday);
  letter-spacing: -0.01em;
}

.text-12,
.text-13 { line-height: 1.35; }

.text-14,
.text-15,
.text-16 { line-height: 1.5; }

.text-18,
.text-20 { line-height: 1.35; }

/* --------------------------------------------------
   9. Footer readability
-------------------------------------------------- */

.footer,
.footer a,
.footer p,
.footer li {
  font-family: var(--font-friday);
  letter-spacing: -0.01em;
  line-height: 1.6;
}

/* --------------------------------------------------
   10. Mobile typography tuning
-------------------------------------------------- */

@media (max-width: 768px) {
  html,
  body {
    letter-spacing: -0.005em;
  }

  .hero h1,
  .hero .hero__title {
    letter-spacing: -0.02em;
    line-height: 1.08;
  }

  .sectionTitle__title,
  .sectionTitle h2 {
    letter-spacing: -0.015em;
  }
}

/* ==================================================
   Utility components
   ================================================== */

/* --------------------------------------------------
   Scroll-to-top button
-------------------------------------------------- */

.scrollTopBtn {
  position: fixed;
  right: 18px;
  bottom: 18px;
  width: 46px;
  height: 46px;
  border-radius: 999px;
  border: 1px solid rgba(148,163,184,0.35);
  background: rgba(255,255,255,0.92);
  box-shadow: 0 10px 24px rgba(15,23,42,0.10);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;

  opacity: 0;
  transform: translateY(10px);
  pointer-events: none;
  transition:
    opacity .2s ease,
    transform .2s ease,
    background .2s ease;

  z-index: 9999;
}

.scrollTopBtn.is-visible {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.scrollTopBtn:hover {
  background: rgba(255,255,255,1);
}

.scrollTopBtn__icon {
  font-size: 18px;
  line-height: 1;
  color: #0f172a;
}

@media (max-width: 575.98px) {
  .scrollTopBtn {
    bottom: 78px;
    right: 14px;
  }
}

/*!*****************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/main/header-menu.css ***!
  \*****************************************************************************************************************************************************************************************************************************************************************************************/
@media (min-width: 992px){
  .header .row.justify-between > .col-auto:first-child{ flex: 1 1 auto !important; }
  .header .row.justify-between > .col-auto:last-child{ flex: 0 0 auto !important; }
}

.header .menu-split{
  display: flex !important;
  align-items: center;
  width: 100%;
  margin-left: 30px;
}

.header .menu-split .menu__nav{
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
}

.header .menu__nav--left{ gap: 20px; }

.header .menu__nav--left .menu-main-item > a span{
  font-size: 17px !important;
  font-weight: 500;
}

.header .menu__nav--right{
  gap: 20px;
  margin-left: auto !important;
}

@media (max-width: 991.98px){
  .header .menu-split{ display: block !important; margin-left: 0; }

  .header .menu-split .menu__nav{
    display: block !important;
    flex-direction: column !important;
    padding: 0 12px !important;
  }

  .header .menu__nav--right{ margin-left: 0 !important; }

  .mobile-menu-sectionTitle{
    padding: 14px 20px 8px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: -0.01em;
    color: #94a3b8;
    text-transform: uppercase;
  }

  .header .menu-split .menu__nav > li{
    border-radius: 12px;
    overflow: hidden;
  }

  .header .menu-split .menu__nav > li > a{
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    padding: 14px 14px !important;
    font-size: 16px;
    line-height: 1.2;
  }

  .menu-split-divider{ padding: 8px 20px 4px; }
  .menu-split-divider .w-1{ display: none !important; }

  .menu-split-divider::after{
    content: "";
    display: block;
    height: 1px;
    background: rgba(148,163,184,0.35);
  }

  .mobile-cta-row{ display: flex; gap: 12px; }

  .mobile-cta-row .button{
    flex: 1 1;
    justify-content: center;
    width: auto !important;
    border-radius: 12px;
    font-weight: 600;
  }
}

.header,
.header a,
.header button,
.menu__nav a{
  font-family: var(--font-friday);
}

.menu__nav a{
  font-weight: 500;
  letter-spacing: -0.01em;
  line-height: 1.2;
}

.menu__nav--left > li > a,
.menu__nav--left .menu-main-item > a{
  font-weight: 600;
}

.menu__nav--right a{
  font-weight: 400;
  opacity: 0.92;
}

.megaMenu,
.megaMenu a,
.megaMenu button{
  font-family: var(--font-friday);
}

.megaMenu .text-12,
.megaMenu .text-13,
.megaMenu .text-14,
.megaMenu .text-15,
.megaMenu .text-16{
  letter-spacing: -0.01em;
}

.megaMenu .fw-500,
.megaMenu .fw-600{
  font-weight: 600;
}

.breadcrumb-mobile,
.badge-mobile{ display: none; }

.breadcrumb-desktop,
.badge-desktop{ display: inline; }

@media (max-width: 575.98px){
  .breadcrumb-desktop,
  .badge-desktop{ display: none; }

  .breadcrumb-mobile,
  .badge-mobile{ display: inline; }
}

[data-anim],
[data-anim="fade"]{
  opacity: 1 !important;
  transform: none !important;
}

/* ===== 레이어(가림 해결 핵심) ===== */

/* 헤더 바(스티키면 레이어 기준점) */
.siteHeader,
.header{
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  margin: 0;
  padding-top: 0;
  z-index: var(--z-header);
}

/* ✅ 메가메뉴는 반드시 위로 떠야 함 (storyAuthorBar 절대 못 덮게) */
.megaMenu{
  position: fixed;          /* 핵심 */
  z-index: var(--z-header-menu);
}

/* 혹시 megaMenu 내부에 overlay/backdrop이 있으면 이것도 위로 */
.megaMenuOverlay,
.megaMenuBackdrop{
  position: fixed;
  inset: 0;
  z-index: var(--z-header-menu);
}

/*!**********************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/main/hero.css ***!
  \**********************************************************************************************************************************************************************************************************************************************************************************/
/* ==================================================
   HERO (Video + Overlay + Title) — final refactor
   ================================================== */

/* --------------------------------------------------
   0) Tokens (hero-scope)
-------------------------------------------------- */
.hero-video-section{
  --hero-radius: 16px;
  --hero-search-radius: 18px;

  --hero-dd-radius: 14px;
  --hero-dd-shadow: 0 12px 30px rgba(15, 23, 42, 0.10);

  --hero-border: rgba(15, 23, 42, 0.08);
  --hero-divider: rgba(15, 23, 42, 0.10);

  --hero-blue: rgba(37, 99, 235, 1);
  --hero-blue-bg: rgba(37, 99, 235, 0.08);

  padding-top: 20px !important;
  padding-bottom: 20px !important;
}

/* --------------------------------------------------
   1) Wrapper + video + dim overlay
-------------------------------------------------- */
.hero-video-wrapper{
  position: relative;
  width: 100%;
  overflow: visible; /* dropdown 잘림 방지 */
  min-height: 440px;
  border-radius: var(--hero-radius);
}

.hero-bg-video{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  z-index: 0;
  border-radius: var(--hero-radius);
}

.hero-video-wrapper::after{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  border-radius: var(--hero-radius);
  background: linear-gradient(rgba(0,0,0,0.35), rgba(0,0,0,0.45));
}

/* --------------------------------------------------
   2) Overlay content layer
-------------------------------------------------- */
.hero-overlay-content{
  position: absolute;
  inset: 0;
  z-index: 3;
  width: 100%;
  padding: 0;
}

.hero-overlay-inner{
  width: 100%;
  max-width: 1100px;
  margin: 0 auto;
}

.hero-overlay-inner .hero-title,
.hero-overlay-inner .hero-subtitle{
  max-width: 1000px;
}

/* --------------------------------------------------
   3) Desktop/Mobile copy switch
-------------------------------------------------- */
.hero-title-mobile,
.hero-subtitle-mobile{ display: none; }

.hero-title-desktop,
.hero-subtitle-desktop{ display: inline; }

/* --------------------------------------------------
   4) Typography (Responsive by clamp)
   ✅ 유틸(text-40/md:text-50 등) 제거 권장
-------------------------------------------------- */
.hero-title{
  font-weight: 900;
  letter-spacing: -0.02em;
  font-size: clamp(26px, 3.2vw, 68px);
  line-height: 1.26;
}

.hero-subtitle{
  font-size: clamp(14px, 1.2vw, 20px);
  line-height: 1.55;
}

/* --------------------------------------------------
   5) Responsive (Mobile) — single source of truth
-------------------------------------------------- */
@media (max-width: 575.98px){
  .hero-video-section{
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }

  .hero-overlay-content{
    position: relative;
    padding: 18px 16px;
  }

  .hero-video-wrapper{
    min-height: 420px;
  }

  /* copy switch */
  .hero-title-desktop,
  .hero-subtitle-desktop{ display: none; }

  .hero-title-mobile,
  .hero-subtitle-mobile{ display: inline; }

  /* ✅ 모바일 타이틀: 2줄(br) 기준으로 확실히 작게 */
  .hero-title{
    font-size: 24px;           /* ✅ 핵심 */
    line-height: 1.14;
    margin-bottom: 10px;
    letter-spacing: -0.02em;
  }

  /* ✅ br 간격(두 줄 타이틀 덩어리 커 보이는 것 완화) */
  .hero-title br{
    display: block;
    margin-bottom: 2px;
  }

  /* ✅ 모바일 서브타이틀도 같이 줄여서 밸런스 맞춤 */
  .hero-subtitle{
    font-size: 13px;
    line-height: 1.55;
    max-width: 92%;
    margin-top: 8px;
    opacity: 0.92;
  }
}

/* --------------------------------------------------
   6) Desktop tweak
-------------------------------------------------- */
@media (min-width: 992px){
  .hero-video-wrapper{ min-height: 460px; }
}

/* ===========================
   HERO — mobile size only fix
   =========================== */
@media (max-width: 575.98px){

  .hero-title{
    font-size: 24px !important;   /* ✅ 모바일 최종 타이틀 크기 */
    line-height: 1.15 !important;
    letter-spacing: -0.02em;
  }

  .hero-subtitle{
    font-size: 13px !important;   /* ✅ 모바일 서브타이틀 */
    line-height: 1.55 !important;
    max-width: 92%;
  }
}

/*!*****************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/main/hero-search.css ***!
  \*****************************************************************************************************************************************************************************************************************************************************************************************/
/* ===========================
   HERO SEARCH — refined
   (Query input + Language + Submit + Under buttons)
   =========================== */

/* wrapper */
.hero-search-center{
  width: 100%;
  display: flex;
  justify-content: center;
}

.fridayHeroSearchBlock{
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* ===========================
   Search bar box (glass)
   =========================== */
.mainSearch--heroCompact{
  /* layout */
  width: min(860px, 92%);
  margin: 0 auto;
  padding: 6px 8px;
  position: relative;
  z-index: 30;

  /* shape */
  border-radius: var(--hero-search-radius);

  /* ✅ more transparent glass */
  background: rgba(255,255,255,0.15);
  border: 1px solid rgba(255, 255, 255, 0.45);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);

  /* depth */
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.18);

  /* motion */
  transition:
    background .18s ease,
    box-shadow .18s ease,
    transform .18s ease,
    border-color .18s ease;
}

/* spacing: title/subtitle -> search */
.hero-overlay-inner .mainSearch--heroCompact{
  margin-top: 44px !important;
}

/* ===========================
   Grid / cells
   =========================== */
.mainSearch--heroCompact .button-grid{
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  align-items: center;
  grid-gap: 0;
  gap: 0;
}

.mainSearch--heroCompact .searchMenu-loc,
.mainSearch--heroCompact .searchMenu-date{
  padding-top: 8px !important;
  padding-bottom: 8px !important;
  min-width: 0;
  position: relative;
}

.mainSearch--heroCompact .searchMenu-loc{
  border-right: 1px solid var(--hero-divider);
}

/* ===========================
   Fields (one-line)
   =========================== */
.mainSearch--heroCompact .fridayHeroField{
  width: 100%;
  text-align: left;
  background: transparent;
  border: 0;

  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 10px;

  border-radius: 14px;

  transition:
    background-color .18s ease,
    box-shadow .18s ease,
    transform .18s ease;
}

.mainSearch--heroCompact .fridayHeroField--input{ gap: 10px; }
.mainSearch--heroCompact .fridayHeroField--inline{ gap: 10px; }

.mainSearch--heroCompact .fridayHeroValue{
  flex: 1 1 auto;
  min-width: 0;

  font-size: 15px;
  line-height: 1.2;
  color: rgba(15, 23, 42, 0.65);

  display: flex;
  align-items: center;
}

/* input */
.mainSearch--heroCompact input[type="search"],
.mainSearch--heroCompact .fridayHeroInput{
  width: 100%;
  border: 0;
  outline: none;
  background: transparent;

  font-size: 15px;
  line-height: 1.2;
  color: rgba(15, 23, 42, 0.78); /* 살짝 선명 */
}

.mainSearch--heroCompact input[type="search"]::placeholder{
  color: rgba(15, 23, 42, 0.45);
}

/* icons */
.heroFieldIcon{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  opacity: .85;
  color: rgba(15, 23, 42, 0.75);
}

/* chevron */
.icon-chevron-down{
  transition: transform .18s ease;
}
.icon-chevron-down.is-open{
  transform: rotate(180deg);
}

/* submit */
.mainSearch--heroCompact .mainSearch__submit{
  padding: 10px 16px !important;
  border-radius: 14px !important;
  white-space: nowrap;

  transition:
    transform .18s ease,
    box-shadow .18s ease,
    filter .18s ease;
}

/* ===========================
   Dropdown
   =========================== */
.mainSearch--heroCompact .fridayHeroDropdown{
  position: absolute;
  z-index: 9999;
  top: calc(100% + 10px);
  left: 0;
}

.mainSearch--heroCompact .searchMenu-date .fridayHeroDropdown{
  width: 260px;
  max-width: 92vw;
}

.fridayHeroDropdownInner{
  background: #fff;
  border: 1px solid var(--hero-border);
  border-radius: var(--hero-dd-radius);
  padding: 10px;
  box-shadow: var(--hero-dd-shadow);
  max-height: 320px;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

.fridayHeroOption{
  width: 100%;
  border: 0;
  background: transparent;
  text-align: left;

  padding: 12px 12px;
  border-radius: 12px;

  font-size: 14px;
  font-weight: 600;
  color: rgba(15, 23, 42, 0.75);

  display: flex;
  align-items: center;

  transition:
    background-color .15s ease,
    color .15s ease,
    transform .08s ease;
}

.fridayHeroOption:hover,
.fridayHeroOption.is-selected{
  background: var(--hero-blue-bg);
  color: var(--hero-blue);
}

.fridayHeroOption:active{
  transform: translateY(1px);
}

/* ===========================
   States (hover/active/focus/open)
   =========================== */
@media (hover:hover){
  /* ✅ hover에서는 살짝 덜 투명(가독성+프리미엄) */
  .mainSearch--heroCompact:hover{
    background: rgba(255, 255, 255, 0.86);
    border-color: rgba(255, 255, 255, 0.58);
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.22);
    transform: translateY(-1px);
  }

  .mainSearch--heroCompact .fridayHeroField:hover{
    background: rgba(15, 23, 42, 0.03);
  }

  .mainSearch--heroCompact .mainSearch__submit:hover{
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.22);
    transform: translateY(-1px);
  }
}

.mainSearch--heroCompact .mainSearch__submit:active{
  transform: translateY(0);
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.18);
}

/* input focus ring */
.mainSearch--heroCompact .fridayHeroField--input:focus-within{
  background: rgba(37, 99, 235, 0.06);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.18);
}

/* language open state */
.mainSearch--heroCompact .searchMenu-date .fridayHeroField[aria-expanded="true"]{
  background: rgba(37, 99, 235, 0.06);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
}

/* keyboard focus */
.mainSearch--heroCompact .fridayHeroField:focus-visible,
.mainSearch--heroCompact .mainSearch__submit:focus-visible{
  outline: none;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.18);
}

/* ===========================
   Under buttons (white theme + active)
   =========================== */
.fridayHeroSearchButtons{
  margin-top: 16px;
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
}

.heroSubButton{
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border-radius: 14px;
  padding: 12px 26px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  white-space: nowrap;

  transition:
    background-color .2s ease,
    color .2s ease,
    border-color .2s ease,
    box-shadow .2s ease,
    transform .2s ease;
}

/* primary: glass */
.heroSubButton--primary{
  background: rgba(255,255,255,0.62);     /* 0.70 → 0.62 */
  color: rgba(15, 23, 42, 0.92);
  border: 1px solid rgba(255,255,255,0.42);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

@media (hover:hover){
  .heroSubButton--primary:hover{
    background: rgba(255,255,255,0.86);
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.16);
    transform: translateY(-1px);
  }
}

.heroSubButton--primary:active{
  transform: translateY(0);
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.14);
}

/* ghost */
.heroSubButton--ghost{
  background: rgba(255,255,255,0.08);
  color: #fff;
  border: 1px solid rgba(255,255,255,0.6);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

@media (hover:hover){
  .heroSubButton--ghost:hover{
    background: rgba(255,255,255,0.18);
    border-color: #fff;
    transform: translateY(-1px);
  }
}

.heroSubButton--ghost:active{
  transform: translateY(0);
  background: rgba(255,255,255,0.12);
}

.heroSubButton:focus-visible{
  outline: none;
  box-shadow:
    0 0 0 3px rgba(255,255,255,0.35),
    0 10px 26px rgba(15, 23, 42, 0.18);
}

/* sr-only */
.sr-only{
  position:absolute;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);
  white-space:nowrap;border:0;
}

/* ===========================
   Mobile
   =========================== */
@media (max-width: 575.98px){
  .hero-overlay-inner .mainSearch--heroCompact{
    width: 100% !important;
    margin-top: 16px !important;
    border-radius: var(--hero-radius);
    padding: 10px 10px;
  }

  /* 모바일은 가독성 위해 살짝 덜 투명 */
  .mainSearch--heroCompact{
    background: rgba(255,255,255,0.88);
    border-color: rgba(255,255,255,0.58);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
  }

  .mainSearch--heroCompact .button-grid{
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .mainSearch--heroCompact .searchMenu-loc{
    border-right: none;
  }

  .mainSearch--heroCompact .searchMenu-date .fridayHeroDropdown{
    width: 100% !important;
    left: 0 !important;
    right: 0 !important;
  }
}

/*!****************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/main/why-choose.css ***!
  \****************************************************************************************************************************************************************************************************************************************************************************************/
/* ==================================================
   Why Choose — Friday
   ================================================== */

.whyChoose{
  padding: 80px 0;
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}

/* Header */
.whyChoose__header{
  max-width: 680px;
  margin: 0 auto 48px;      /* ✅ 가운데 */
  text-align: center;       /* ✅ 텍스트 가운데 */
}

.whyChoose__title{
  font-size: 32px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: #0f172a;
}

.whyChoose__desc{
  margin-top: 12px;
  font-size: 16px;
  color: #64748b;
  line-height: 1.6;
}

/* Grid */
.whyChoose__grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 24px;
  gap: 24px;
}

/* Card */
.whyChoose__card{
  background: rgba(255,255,255,0.9);
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 20px;
  padding: 28px;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.08);
}

/* Index */
.whyChoose__index{
  display: block;
  font-size: 14px;
  font-weight: 700;
  color: #2563eb;
  margin-bottom: 12px;
}

/* Card text */
.whyChoose__cardTitle{
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: #0f172a;
}

.whyChoose__sub{
  margin-top: 4px;
  font-size: 14px;
  font-weight: 600;
  color: #2563eb;
}

.whyChoose__text{
  margin-top: 12px;
  font-size: 15px;
  line-height: 1.6;
  color: #475569;
}

/* Responsive */
@media (max-width: 992px){
  .whyChoose__grid{
    grid-template-columns: 1fr;
  }
}

/*!*********************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/main/featured-locals.css ***!
  \*********************************************************************************************************************************************************************************************************************************************************************************************/
/* ==================================================
   Featured Locals – Final (Friday) — refactored
   ================================================== */

/* --------------------------------------------------
   1) Section title & spacing
-------------------------------------------------- */
.friday-featured-locals.layout-pt-md { padding-top: 32px; }
.friday-featured-locals.layout-pb-md { padding-bottom: 40px; }

.friday-featured-locals .sectionTitle.-md { margin-bottom: 4px; }

.friday-featured-locals .sectionTitle__title {
  font-size: 24px;
  font-weight: 600;
}

.friday-featured-locals .sectionTitle__text {
  font-size: 14px;
  color: #64748b;
  line-height: 1.5;
}

/* --------------------------------------------------
   2) Swiper behavior
-------------------------------------------------- */
.friday-featured-locals .js-featured-slider { overflow: visible; }

/* --------------------------------------------------
   3) Card hover wrapper
-------------------------------------------------- */
.locals-card-link{
  display: block;
  border-radius: 16px;
  padding: 6px;
  margin: -6px;
  transition: 0.22s ease;
}

.locals-card-link:hover{ background: rgba(15, 23, 42, 0.02); }

.locals-card-link:focus-visible{
  outline: none;
  background: rgba(37, 99, 235, 0.08);
  box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.25);
}

.friday-featured-locals .hotelsCard{ transition: 0.22s ease; }

.friday-featured-locals .locals-card-link:hover .hotelsCard{
  transform: translateY(-3px);
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.06);
}

/* --------------------------------------------------
   4) Image / ratio handling (CRITICAL)
-------------------------------------------------- */
.friday-featured-locals .cardImage,
.friday-featured-locals .localsCard__media{ position: relative; }

.friday-featured-locals .localsCard__media{
  overflow: hidden;
  border-radius: 16px;
}

.friday-featured-locals .localsCard__img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
}

.friday-featured-locals .localsCard__media img{ max-width: none; }

.friday-featured-locals .ratio-1\:1{
  padding-bottom: 100% !important;
  height: 0 !important;
}

.friday-featured-locals .cardImage__content{
  position: absolute;
  inset: 0;
}

/* --------------------------------------------------
   5) Badge row (TOP) — no background bar
-------------------------------------------------- */
.friday-featured-locals .localsBadgeRow{
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 6;
  display: flex;
  gap: 8px;
}

.friday-featured-locals .localsBadge{
  display: inline-flex;
  align-items: center;
  gap: 6px;

  height: 22px;
  padding: 0 10px;
  border-radius: 999px;

  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: -0.01em;

  border: 1px solid transparent;
  background: rgba(255,255,255,0.70);
  color: #0f172a;

  box-shadow: 0 4px 10px rgba(15,23,42,0.10);
}

.friday-featured-locals .localsBadge__icon{ font-size: 14px; }

/* ✅ Verified: green */
.friday-featured-locals .localsBadge--verified{
  background: rgba(16, 185, 129, 0.18);
  border-color: rgba(16, 185, 129, 0.35);
  color: #fff;
}

/* ✅ Expert: red */
.friday-featured-locals .localsBadge--expert{
  background: rgba(239, 68, 68, 0.16);
  border-color: rgba(239, 68, 68, 0.35);
  color: #fff;
}

/* --------------------------------------------------
   6) Hover overlay
-------------------------------------------------- */
.friday-featured-locals .localsCard__overlay{
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(15, 23, 42, 0.72),
    rgba(15, 23, 42, 0.12)
  );
  opacity: 0;
  transform: translateY(6px);
  transition: 0.22s ease;
  pointer-events: none;
  z-index: 3;
}

.friday-featured-locals .localsCard:hover .localsCard__overlay,
.friday-featured-locals .localsCard:focus-visible .localsCard__overlay{
  opacity: 1;
  transform: translateY(0);
}

.friday-featured-locals .localsOverlay__inner{
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 12px;
  color: rgba(255,255,255,0.95);
}

.friday-featured-locals .localsOverlay__title{
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
}

.friday-featured-locals .localsOverlay__name{
  margin-top: 6px;
  font-size: 12px;
  font-weight: 600;
  opacity: 0.92;
}

.friday-featured-locals .localsOverlay__lines{ margin-top: 8px; }

.friday-featured-locals .localsOverlay__line{
  margin-top: 3px;
  font-size: 13px;
  line-height: 1.35;
  color: rgba(255,255,255,0.92);
}

.friday-featured-locals .localsOverlay__field{
  margin-top: 6px;
  font-size: 13px;
  font-weight: 600;
  opacity: 0.95;
}

/* --------------------------------------------------
   7) Body order (Location → Title → Tags → Languages → Bio)
-------------------------------------------------- */
.friday-featured-locals .localsCard__body{ margin-top: 10px; }

.friday-featured-locals .localsCard__location{
  font-size: 12.5px;
  color: #64748b;
  line-height: 1.3;
}

.friday-featured-locals .localsCard__title{
  margin-top: 4px;
  font-size: 15px;
  font-weight: 700;
  color: #0f172a;
}

.friday-featured-locals .localsTags{
  margin-top: 6px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.friday-featured-locals .localsTag{
  height: 22px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

/* 🟦 Visa / Immigration */
.friday-featured-locals .localsTag--blue{
  color: #1d4ed8;
  background: rgba(37, 99, 235, 0.12);
  border: 1px solid rgba(37, 99, 235, 0.22);
}

/* 🟪 Career / Business */
.friday-featured-locals .localsTag--purple{
  color: #6d28d9;
  background: rgba(124, 58, 237, 0.12);
  border: 1px solid rgba(124, 58, 237, 0.22);
}

/* 🟩 Education / Family */
.friday-featured-locals .localsTag--green{
  color: #047857;
  background: rgba(16, 185, 129, 0.14);
  border: 1px solid rgba(16, 185, 129, 0.24);
}

/* ⚪ Default */
.friday-featured-locals .localsTag--slate{
  color: #334155;
  background: rgba(148, 163, 184, 0.14);
  border: 1px solid rgba(148, 163, 184, 0.25);
}

/* Languages */
.friday-featured-locals .localsCard__langs{
  margin-top: 8px;
  font-size: 12px;
  color: #334155;
}

.friday-featured-locals .localsCard__label{
  font-weight: 700;
  color: #0f172a;
}

.friday-featured-locals .localsLangs{
  margin-left: 8px;
  display: inline-flex;
  gap: 12px;
  flex-wrap: wrap;
}

.friday-featured-locals .localsLang{
  display: inline-flex;
  align-items: center;
  gap: 6px;
}


.friday-featured-locals .localsLang__text{
  font-size: 12px;
  font-weight: 600;
  color: #334155;
}

.friday-featured-locals .localsCard__bio{
  margin-top: 8px;
  font-size: 13px;
  line-height: 1.45;
  color: #475569;
}

/* Meta link */
.friday-featured-locals .locals-meta-link{
  display: inline-block;
  margin-top: 8px;
  font-size: 12px;
  color: #2563eb;
  text-decoration: none;
}

.friday-featured-locals .locals-meta-link:hover{ text-decoration: underline; }

.friday-featured-locals .localsCard__langs--flagsOnly .localsLangs{
  margin-left: 8px;
  display: inline-flex;
  gap: 10px;
  flex-wrap: wrap;
}

.friday-featured-locals .localsCard__langs--flagsOnly .localsLang{
  display: inline-flex;
  align-items: center;
}

.friday-featured-locals .localsLang__flag{
  width: 18px;
  height: 18px;
  border-radius: 3px;
  box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.10);
}

/* --------------------------------------------------
   8) Responsive
-------------------------------------------------- */
@media (max-width: 991.98px){
  .friday-featured-locals .sectionTitle__title{ font-size: 22px; }
}

@media (max-width: 576px){
  .friday-featured-locals .sectionTitle__title{ font-size: 20px; }

  .friday-featured-locals .locals-card-link:hover .hotelsCard{
    transform: none;
    box-shadow: none;
  }
}

/*!*******************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/main/session-types.css ***!
  \*******************************************************************************************************************************************************************************************************************************************************************************************/
/* =====================================
   SessionTypes Card (clean)
   - height unify
   - text clamp
===================================== */

/* Card content layout */
.tourTypeCard__content {
  min-height: 320px;          /* 핵심: 카드 높이 통일 */
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

/* Icon spacing */
.tourTypeCard__content i {
  margin-top: 20px;
}

/* Title */
.tourTypeCard__content h4 {
  margin-top: 32px;

  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Description */
.tourTypeCard__content p {
  margin-top: 8px;

  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Mobile */
@media (max-width: 575.98px) {
  .tourTypeCard__content {
    min-height: 220px;
  }
}

/*!*********************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/main/friday-services.css ***!
  \*********************************************************************************************************************************************************************************************************************************************************************************************/
/* =====================================
   “What you can do with Friday”
   Services overview section
===================================== */

/* -----------------------------
   Section title
------------------------------ */
.friday-services .sectionTitle__title {
  font-size: 28px;
  font-weight: 600;
}

.friday-services .sectionTitle__text {
  font-size: 14px;
  color: #64748b;
}

/* -----------------------------
   Grid spacing
------------------------------ */
.friday-services .row.x-gap-15.y-gap-15 {
  row-gap: 18px;
}

/* -----------------------------
   Service card (base)
------------------------------ */
.friday-services .d-flex.flex-column.justify-center {
  padding: 18px;
  min-height: 150px;

  display: flex;
  flex-direction: column;
  justify-content: flex-start;

  border-radius: 14px;
  border: 1px solid rgba(148, 163, 184, 0.35);
  background-color: #ffffff;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.03);
}

/* optional icon placeholder */
.friday-services .card-icon-placeholder {
  height: 36px;
  margin-bottom: 8px;
}

/* -----------------------------
   Card typography
------------------------------ */
.friday-services .text-15 {
  font-size: 15px;
  margin-bottom: 6px;
}

.friday-services .text-13 {
  font-size: 12px;
  line-height: 1.6;
}

/* -----------------------------
   Footer helper text
------------------------------ */
.friday-services .mt-20.text-13 {
  margin-top: 18px;
  font-size: 12px;
  color: #6b7280;
}

.friday-services .mt-20.text-13 a {
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}

/* -----------------------------
   Responsive (mobile)
------------------------------ */
@media (max-width: 767.98px) {
  .friday-services .d-flex.flex-column.justify-center {
    padding: 20px 16px;
    min-height: 0;
  }
}

/*!**********************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/main/popular-services.css ***!
  \**********************************************************************************************************************************************************************************************************************************************************************************************/
/* =====================================
   Popular Services — Screenshot Layout
===================================== */

.popularServicesSection .psGrid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  grid-gap:24px;
  gap:24px;
}

.popularServicesSection .psCard{
  position:relative;
  display:block;
  background:#fff;
  border:1px solid rgba(15,23,42,0.08);
  border-radius:16px;
  padding:18px 18px 16px;
  box-shadow:0 8px 24px rgba(15,23,42,0.06);
  text-decoration:none;
  color:inherit;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.popularServicesSection .psCard:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 30px rgba(15,23,42,0.10);
  border-color:rgba(15,23,42,0.12);
}

/* heart */
.popularServicesSection .psFav{
  position:absolute;
  top:12px;
  right:12px;
  width:34px;
  height:34px;
  border-radius:999px;
  border:1px solid rgba(15,23,42,0.10);
  background:rgba(255,255,255,0.92);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:rgba(15,23,42,0.55);
  box-shadow:0 8px 18px rgba(15,23,42,0.10);
  transition:.18s ease;
}
.popularServicesSection .psFav svg{ width:18px; height:18px; }
.popularServicesSection .psFav.is-on{
  color:rgba(239,68,68,1);
  border-color:rgba(239,68,68,0.22);
}

/* title / subtitle */
.popularServicesSection .psTitle{
  font-size:18px;
  font-weight:900;
  line-height:1.22;
  margin:0 0 8px;
  letter-spacing:-0.02em;
  padding-right:44px; /* avoid heart overlap */
}

.popularServicesSection .psSub{
  margin:0 0 12px;
  font-size:13.5px;
  line-height:1.5;
  color:rgba(15,23,42,0.62);
}

/* thumbs */
.popularServicesSection .psThumbRow{
  display:flex;
  gap:10px;
  overflow-x:auto;
  padding:2px 2px 0;
  margin:0 0 14px;
  scrollbar-width:none;
}
.popularServicesSection .psThumbRow::-webkit-scrollbar{ display:none; }

.popularServicesSection .psThumb{
  width:46px;
  height:46px;
  border-radius:10px;
  overflow:hidden;
  border:1px solid rgba(15,23,42,0.08);
  background:rgba(15,23,42,0.04);
  flex:0 0 auto;
}
.popularServicesSection .psThumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* divider */
.popularServicesSection .psDivider{
  height:1px;
  background:rgba(15,23,42,0.10);
  margin:12px 0;
}

/* rating */
.popularServicesSection .psRatingRow{
  display:flex;
  align-items:center;
  gap:10px;
  margin:0 0 6px;
}

.popularServicesSection .psStars{
  display:inline-flex;
  gap:2px;
  line-height:1;
}
.popularServicesSection .psStar{
  font-size:14px;
  opacity:0.22;
}
.popularServicesSection .psStar.is-on{ opacity:1; }

.popularServicesSection .psRatingText{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:13px;
  color:rgba(15,23,42,0.78);
}
.popularServicesSection .psRatingValue{ font-weight:900; }
.popularServicesSection .psRatingCount{ color:rgba(15,23,42,0.55); }

/* review sentence */
.popularServicesSection .psReview{
  margin:0;
  font-size:13px;
  line-height:1.45;
  color:rgba(15,23,42,0.64);
}

/* bottom row: local left / price right */
.popularServicesSection .psBottomRow{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
}

.popularServicesSection .psLocal{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}

.popularServicesSection .psAvatar{
  width:36px;
  height:36px;
  border-radius:999px;
  overflow:hidden;
  flex:0 0 auto;
  background:rgba(15,23,42,0.06);
}
.popularServicesSection .psAvatar img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.popularServicesSection .psLocalMeta{ min-width:0; }

.popularServicesSection .psNameRow{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.popularServicesSection .psName{
  font-size:14px;
  font-weight:900;
  line-height:1.15;
}

.popularServicesSection .psLocation{
  font-size:12.5px;
  color:rgba(15,23,42,0.55);
  margin-top:2px;
  line-height:1.15;
}

/* verified / expert */
.popularServicesSection .psStatus{
  display:inline-flex;
  align-items:center;
  gap:6px;
  height:20px;
  padding:0 8px;
  border-radius:999px;
  font-size:10.5px;
  font-weight:900;
  color:#fff;
}
.popularServicesSection .psStatus__icon{
  width:14px;
  height:14px;
  color:#fff;
}
.popularServicesSection .psStatus--verified{ background:rgba(16,185,129,0.92); }
.popularServicesSection .psStatus--expert{ background:rgba(239,68,68,0.92); }

/* price */
.popularServicesSection .psPrice{
  font-size:20px;
  font-weight:900;
  color:rgba(37,99,235,1);
  flex:0 0 auto;
}

/* mobile swiper */
.popularServicesSection .psSwiper{ padding:4px 2px 26px; }
.popularServicesSection .psSwiper .swiper-slide{ height:auto; }
.popularServicesSection .psSwiper .swiper-pagination{ bottom:0 !important; }

/* responsive */
@media (max-width:991.98px){
  .popularServicesSection .psGrid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
@media (max-width:575.98px){
  .popularServicesSection .psGrid{ grid-template-columns:1fr; gap:16px; }
}

/*!*********************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/main/latest-insights.css ***!
  \*********************************************************************************************************************************************************************************************************************************************************************************************/
/* =====================================
   Latest Insights (layout only)
   - typography/color handled by main utilities
===================================== */

/* -----------------------------
   Card container
------------------------------ */
.latestInsightsSection .insightCard {
  display: block;
  text-decoration: none;
  color: inherit;

  border-radius: 18px;
  overflow: hidden;
  background: #ffffff;
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.06);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.latestInsightsSection .insightCard:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 42px rgba(15, 23, 42, 0.10);
}

/* -----------------------------
   Image (16:9)
------------------------------ */
.latestInsightsSection .insightCard__image {
  width: 100%;
  aspect-ratio: 16 / 9;
  background: #f3f4f6;
}

.latestInsightsSection .insightCard__image img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

/* -----------------------------
   Body padding
------------------------------ */
.latestInsightsSection .insightCard__body {
  padding: 22px 22px 18px;
}

/* -----------------------------
   Utility: clamp / ellipsis
------------------------------ */
/* 3-line clamp (excerpt etc.) */
.latestInsightsSection .insightClamp3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Single-line ellipsis (name etc.) */
.latestInsightsSection .insightEllipsis {
  max-width: 180px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* -----------------------------
   Meta row (author + stats)
------------------------------ */
.latestInsightsSection .insightCard__meta {
  margin-top: 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

/* Author */
.latestInsightsSection .insightAuthor {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.latestInsightsSection .insightAuthor__avatar {
  width: 36px;
  height: 36px;
  border-radius: 999px;
  object-fit: cover;
  background: #e5e7eb;
  flex: 0 0 auto;
}

/* Stats */
.latestInsightsSection .insightStats {
  display: flex;
  align-items: center;
  gap: 14px;
  flex: 0 0 auto;
}

.latestInsightsSection .insightStat {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

/*!************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/locals/locals-searchbar.css ***!
  \************************************************************************************************************************************************************************************************************************************************************************************************/
/* ==================================================
   Locals Page — Hero + Search (full-bleed)
   (cards are styled in "Featured Locals – Final" block)
================================================== */

/* Hero wrapper
   - hero is outside container, so width:100% is enough
   - 100vw trick is optional (use only if needed) */
.localsHeroFull{
  width: 100%;
}

/* (optional) 완전 풀폭 + 좌우 레이아웃 꼬임 있을 때만 사용
.localsHeroFull{
  width: 100vw;
  margin-left: calc(50% - 50vw);
  overflow: hidden;
}
*/

.localsHeroHead{
  position: relative;
  border-radius: 0;              /* ✅ 라운드 제거 */
  padding: 24px 0;               /* ✅ 세로 두께 */
  background: url("/img/pages/locals/locals-hero-bg.jpg") center/cover no-repeat;
  overflow: hidden;

  /* ✅ 카드 느낌 제거 */
  border: 0;
  box-shadow: none;
}

.localsHeroHead::before{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgba(2,6,23,0.60) 0%,
    rgba(2,6,23,0.40) 45%,
    rgba(2,6,23,0.22) 100%
  );
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  pointer-events: none;
}

.localsHeroHead > *{
  position: relative;
  z-index: 1;
}

.localsHeroHead h1,
.localsHeroHead .text-light-1{
  color: rgba(255,255,255,0.95) !important;
  text-shadow: 0 2px 10px rgba(0,0,0,0.25);
}

/* =========================
   Search Bar (inside hero)
========================= */

.localsSearchBarWrap{
  width: 100%;
  display: flex;
  justify-content: flex-end;
  position: relative;
  z-index: 5; /* overlay 위 + dropdown 기준 */
}

.localsSearchBar{
  width: min(1120px, 100%);
  position: relative;
  border-radius: 18px;
  border: 1px solid rgba(15, 23, 42, 0.10);
  background: rgba(255,255,255,0.92);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  overflow: visible;
}

/* dropdown layering 안정화 */
.localsSearchBar .fridayHeroDropdown{
  position: relative;
  z-index: 50;
}

.localsSearchBar .button-grid{
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center;
  gap: 10px;
}

.localsSearchBar .searchMenu-date,
.localsSearchBar .searchMenu-loc{
  padding-left: 14px !important;
  padding-right: 14px !important;
}

.localsSearchBar .js-form-dd{
  position: relative;
  flex: 0 0 auto;
  min-width: 150px;
  max-width: 210px;
}

.localsSearchBar .searchMenu-loc{
  flex: 1 1 520px;
  min-width: 360px;
}

.localsSearchBar .button-item{
  flex: 0 0 auto;
  min-width: 120px;
  white-space: nowrap;
}

.localsSearchBar .fridayHeroField{ white-space: nowrap; }
.localsSearchBar .fridayHeroField--inline{ max-width: 210px; }

.localsSearchBar .fridayHeroValue{
  display: inline-block;
  max-width: 135px;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
}

.localsSearchBar .fridayHeroValue,
.localsSearchBar .fridayHeroInput{
  color: #0f172a;
}

/* =========================
   Locals Filter – Typography Downscale
========================= */

.localsFilterSidebar{
  background: rgba(15, 23, 42, 0.01);   /* 아주 옅은 slate */
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 14px;

  padding: 18px 16px;                  /* 내부 여백 */
}

.localsFilterSidebar .sidebar__item{
  padding-bottom: 14px;
  margin-bottom: 14px;
  border-bottom: 1px dashed rgba(15, 23, 42, 0.08);
}

.localsFilterSidebar .sidebar__item.-no-border{
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}


/* Section title */
.localsFilterSidebar h5{
  font-size: 15px;     /* 기존 text-18 → ↓ */
  font-weight: 600;
  margin-bottom: 8px;
}

/* 일반 텍스트 (label 등) */
.localsFilterSidebar .text-15{
  font-size: 13px;
}

.localsFilterSidebar .text-14{
  font-size: 12px;
}

.localsFilterSidebar .text-13{
  font-size: 11.5px;
}

/* checkbox label */
.localsFilterSidebar .sidebar-checkbox .text-15{
  font-size: 13px;
}

/* =========================
   Inputs / Controls
========================= */

/* search / number input */
.localsFilterSidebar input{
  height: 44px;        /* 50px → ↓ */
  font-size: 13px;
}

/* price helper text */
.localsFilterSidebar .text-light-1{
  font-size: 12px;
}

/* rating buttons */
.localsFilterSidebar .button.-sm{
  font-size: 12px;
  padding: 4px 14px;
}

/* Apply / Reset buttons */
.localsFilterSidebar .button.-md{
  height: 40px;
  font-size: 13px;
}

/* checkbox spacing */
.localsFilterSidebar .row.y-gap-10{
  row-gap: 6px;
}

@media (min-width: 992px){
  .localsFilterSidebar{
    background: rgba(15, 23, 42, 0.03);
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 14px;
    padding: 18px 16px;
  }
}
/* =========================
   Responsive
========================= */

@media (max-width: 992px){
  .localsSearchBarWrap{ justify-content: flex-start; }
  .localsSearchBar .js-form-dd{ min-width: 132px; max-width: 170px; }
  .localsSearchBar .searchMenu-loc{ min-width: 260px; flex: 1 1 360px; }
  .localsSearchBar .fridayHeroField--inline{ max-width: 170px; }
  .localsSearchBar .fridayHeroValue{ max-width: 105px; }
}

@media (max-width: 576px){
  .localsHeroHead{ padding: 20px 0; }

  .localsSearchBarWrap{
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .localsSearchBar{ min-width: 920px; }
}

/*!******************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/local/detail-hero.css ***!
  \******************************************************************************************************************************************************************************************************************************************************************************************/
/* src/app/styles/local/detail-hero.css */

:root{
  --ld-ink:#0f172a;
  --ld-sub:#334155;
  --ld-muted:#64748b;
  --ld-line:rgba(15,23,42,.10);

  --ld-bg-0:#f7f9ff;
  --ld-bg-1:#eef3ff;

  --ld-chip-soft-bg:rgba(238,244,255,.88);
  --ld-chip-soft-tx:#1e40af;

  --ld-chip-solid-bg:#1d4ed8;
  --ld-chip-solid-tx:#ffffff;

  --ld-card: rgba(255,255,255,.82);
  --ld-shadow: 0 18px 46px rgba(2,6,23,.10), 0 8px 18px rgba(2,6,23,.06);
  --ld-shadow-soft: 0 12px 30px rgba(2,6,23,.10), 0 4px 10px rgba(2,6,23,.05);

  --ld-cta:#1d4ed8;
  --ld-cta2:#2563eb;
  --ld-cta-ring:rgba(29,78,216,.26);
  --ld-avatar: 220px;
}

.localsDetailHero .container{
  max-width: 1140px;
}

/* =========================
   HERO WRAP
========================= */
.localsDetailHero{
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(900px 420px at 18% 0%,
      rgba(15,23,42,.06) 0%,
      rgba(15,23,42,0) 60%
    ),
    linear-gradient(180deg, #ffffff 0%, #f7f8fb 100%);
}

/* 상단 + 하단 헤어라인 */
.localsDetailHero::before,
.localsDetailHero::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  height:1px;
  pointer-events:none;
  background: rgba(15,23,42,.08); /* ✅ 옅은 톤 */
}

/* 상단 */
.localsDetailHero::before{
  top:0;
}

/* 하단 */
.localsDetailHero::after{
  bottom:0;
}


/* ✅ 상/하단 여백 조금 더 */
.localsDetailHeroInner{
  display: grid;
  grid-template-columns: var(--ld-avatar) 1fr;
  grid-gap: 28px;
  gap: 28px;
  padding: 62px 0 54px;
  align-items: start;
}

@media (max-width: 768px){
  :root{
    --ld-avatar: 120px;
  }
}

/* =========================
   AVATAR (card + inner highlight)
========================= */
.localsDetailHeroAvatar{
  position: relative;
  width: var(--ld-avatar);
  height: var(--ld-avatar);
  border-radius: 18px;
  background: var(--ld-card);
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: var(--ld-shadow-soft);
  overflow: hidden;
}

@media (max-width: 768px){
  .localsDetailHeroAvatar{
    width: 86px;
    height: 86px;
    border-radius: 16px;
  }
}

.localsDetailHeroAvatar img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transform: scale(1.01);
  filter: saturate(1.03) contrast(1.02);
}

/* ✅ 미세 inner highlight */
.localsDetailHeroAvatar::before{
  content:"";
  position:absolute;
  inset: 0;
  pointer-events:none;
  border-radius: inherit;
  background:
    radial-gradient(520px 220px at 24% 18%, rgba(255,255,255,.70) 0%, rgba(255,255,255,0) 60%),
    linear-gradient(180deg, rgba(255,255,255,.50) 0%, rgba(255,255,255,0) 38%);
  opacity: .85;
}

.localsDetailHeroAvatar::after{
  content:"";
  position:absolute;
  inset: 0;
  pointer-events:none;
  border-radius: inherit;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.55) inset,
    0 -1px 0 rgba(15,23,42,.04) inset;
}

/* =========================
   TITLE / BADGE
========================= */
.localsDetailHeroTop{
  display:flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}

.localsDetailHeroTitle{
  margin: 0;
  color: var(--ld-ink);
  letter-spacing: -0.02em;
  font-weight: 900;
  font-size: 34px;
  line-height: 1.1;
}

@media (max-width: 768px){
  .localsDetailHeroTitle{
    font-size: 26px;
  }
}

.ld-badge{
  display:inline-flex;
  align-items:center;
  height: 26px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: rgba(15,23,42,.82);
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 0 1px 0 rgba(255,255,255,.6) inset;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

/* headline */
.localsDetailHeroHeadline{
  margin-top: 2px;
  color: rgba(15,23,42,.74);
  font-size: 15px;
  line-height: 1.6;
  max-width: 66ch;
}

/* =========================
   META
========================= */
.localsDetailHeroMeta{
  display:flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  margin-top: 14px;
  color: rgba(15,23,42,.70);
  font-size: 13px;
}

.localsDetailHeroMetaItem{
  display:inline-flex;
  align-items:center;
  gap: 8px;
}

.localsDetailHeroMetaItem .ico{
  font-size: 14px;
  line-height: 1;
  transform: translateY(-.5px);
  opacity: .92;
}

/* =========================
   CHIPS (smaller & classy)
========================= */
.localsDetailHeroChips{
  display:flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

/* ✅ 칩 크기 줄임 + 더 고급스럽게 */
.ld-chip{
  display:inline-flex;
  align-items:center;
  height: 28px;        /* ↓ */
  padding: 0 10px;     /* ↓ */
  border-radius: 999px;
  font-size: 12px;     /* ↓ */
  font-weight: 800;
  letter-spacing: -0.01em;
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 0 1px 0 rgba(255,255,255,.65) inset;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.ld-chip.soft{
  background: var(--ld-chip-soft-bg);
  color: var(--ld-chip-soft-tx);
}

.ld-chip.solid{
  background: linear-gradient(180deg, rgba(29,78,216,1) 0%, rgba(29,78,216,.94) 100%);
  color: var(--ld-chip-solid-tx);
  border-color: rgba(255,255,255,.22);
  box-shadow:
    0 1px 0 rgba(255,255,255,.28) inset,
    0 10px 24px rgba(29,78,216,.18);
}

/* =========================
   BOTTOM ROW
========================= */
.localsDetailHeroBottom{
  display:flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 18px;
}

/* rating */
.localsDetailHeroRating{
  display:flex;
  align-items:center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255,255,255,.70);
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 0 1px 0 rgba(255,255,255,.6) inset;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.ld-stars{
  display:flex;
  gap: 2px;
}

.ld-star{
  font-size: 14px;
  line-height: 1;
  color: rgba(15,23,42,.22);
}
.ld-star.on{
  color: rgba(245,158,11,.96); /* amber */
}

.localsDetailHeroRating .num{
  font-weight: 900;
  color: rgba(15,23,42,.86);
}
.localsDetailHeroRating .cnt{
  color: rgba(15,23,42,.60);
}

/* bookings */
.localsDetailHeroBookings{
  display:flex;
  align-items: baseline;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255,255,255,.70);
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 0 1px 0 rgba(255,255,255,.6) inset;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.localsDetailHeroBookings .b{
  font-weight: 900;
  color: rgba(15,23,42,.86);
}
.localsDetailHeroBookings .t{
  font-size: 12px;
  color: rgba(15,23,42,.62);
}

/* =========================
   CTA (Figma style)
========================= */
.ld-cta{
  margin-left: auto;
  position: relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height: 46px;
  padding: 0 16px;
  border-radius: 14px;

  font-weight: 900;
  letter-spacing: -0.01em;
  cursor: pointer;

  border: 1px solid rgba(255,255,255,.22);
  transition: transform .16s ease, box-shadow .16s ease, filter .16s ease;
}

@media (max-width: 768px){
  .ld-cta{
    margin-left: 0;
  }
}

/* Green CTA (Send Message 전용) */
.ld-cta--green{
  color:#ffffff;

  background:
    linear-gradient(180deg,
      rgba(255,255,255,.06) 0%,
      rgba(255,255,255,.02) 2%,
      rgba(0,0,0,0) 22%
    ),
    linear-gradient(180deg, #16a34a 0%, #15803d 100%); /* emerald → deep green */

  border: 1px solid rgba(255,255,255,.22);

  box-shadow:
    0 1px 0 rgba(255,255,255,.24) inset,
    0 16px 34px rgba(22,163,74,.22),
    0 8px 16px rgba(2,6,23,.12);

  transition: transform .16s ease, box-shadow .16s ease, filter .16s ease;
}

/* 상단 하이라이트 */
.ld-cta--green::before{
  content:"";
  position:absolute;
  inset: 1px 1px auto 1px;
  height: 46%;
  border-radius: 13px;
  pointer-events:none;
  background: linear-gradient(180deg, rgba(255,255,255,.38), rgba(255,255,255,0));
  opacity: .55;
}

.ld-cta--green:hover{
  transform: translateY(-1px);
  filter: saturate(1.05);
  box-shadow:
    0 1px 0 rgba(255,255,255,.26) inset,
    0 18px 40px rgba(22,163,74,.26),
    0 10px 18px rgba(2,6,23,.14);
}

.ld-cta--green:focus-visible{
  outline: none;
  box-shadow:
    0 0 0 4px rgba(22,163,74,.28),
    0 1px 0 rgba(255,255,255,.26) inset,
    0 16px 34px rgba(22,163,74,.22),
    0 8px 16px rgba(2,6,23,.12);
}


.ld-cta--primary{
  color:#fff;

  /* ✅ 2% gradient + inset highlight 느낌 */
  background:
    linear-gradient(180deg,
      rgba(255,255,255,.05) 0%,
      rgba(255,255,255,.02) 2%,
      rgba(0,0,0,0) 22%
    ),
    linear-gradient(180deg, var(--ld-cta2) 0%, var(--ld-cta) 100%);

  box-shadow:
    0 1px 0 rgba(255,255,255,.22) inset,
    0 16px 34px rgba(29,78,216,.20),
    0 8px 16px rgba(2,6,23,.10);
}

.ld-cta--primary::before{
  content:"";
  position:absolute;
  inset: 1px 1px auto 1px;
  height: 46%;
  border-radius: 13px;
  pointer-events:none;
  background: linear-gradient(180deg, rgba(255,255,255,.36), rgba(255,255,255,0));
  opacity: .55;
}

.ld-cta--primary:hover{
  transform: translateY(-1px);
  filter: saturate(1.04);
  box-shadow:
    0 1px 0 rgba(255,255,255,.24) inset,
    0 18px 40px rgba(29,78,216,.24),
    0 10px 18px rgba(2,6,23,.12);
}

.ld-cta--primary:active{
  transform: translateY(0);
}

.ld-cta--primary:focus-visible{
  outline: none;
  box-shadow:
    0 0 0 4px var(--ld-cta-ring),
    0 1px 0 rgba(255,255,255,.24) inset,
    0 16px 34px rgba(29,78,216,.20),
    0 8px 16px rgba(2,6,23,.10);
}

/* 작은 화면에서 하단 정렬이 어색하면 버튼 full */
@media (max-width: 520px){
  .localsDetailHeroBottom{
    gap: 10px;
  }
  .localsDetailHeroRating,
  .localsDetailHeroBookings{
    flex: 1 1 auto;
  }
  .ld-cta{
    width: 100%;
  }
}

/*!*************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/local/detail-panels.base.css ***!
  \*************************************************************************************************************************************************************************************************************************************************************************************************/
/* src/app/styles/local/detail-panels.base.css */

:root{
  --lp-ink: rgba(15,23,42,.92);
  --lp-sub: rgba(15,23,42,.72);
  --lp-muted: rgba(15,23,42,.55);

  --lp-bg: #fff;
  --lp-soft: rgba(15,23,42,.04);
  --lp-line: rgba(15,23,42,.10);

  --lp-r: 16px;
  --lp-shadow: 0 10px 30px rgba(2,6,23,.08), 0 2px 8px rgba(2,6,23,.06);

  --lp-pad: 18px;
  --lp-pad-lg: 20px;

  --lp-accent: #0ea5e9;
  --lp-accent-2: #22c55e;

  --lp-page-pb: 56px;
}

.localsDetailPage{
  color: var(--lp-ink);
  padding-bottom: var(--lp-page-pb);
}

.localsDetailLeftStack,
.localsDetailRightStack{
  gap: 16px;
}

@media (min-width: 1200px){
  .localsDetailRightSticky{
    position: -webkit-sticky;
    position: sticky;
    top: var(--header-h, 84px);
    align-self: flex-start;
  }
  .localsDetailRightStack{ position: static; }
}

.localPanel{
  background: var(--lp-bg);
  border: 1px solid var(--lp-line);
  border-radius: var(--lp-r);
  box-shadow: var(--lp-shadow);
  overflow: hidden;
}

.localPanel::before{
  content:"";
  display:block;
  height: 1px;
  background: linear-gradient(
    90deg,
    rgba(255,255,255,.55) 0%,
    rgba(255,255,255,.15) 35%,
    rgba(255,255,255,.55) 70%,
    rgba(255,255,255,.10) 100%
  );
}

.localPanel__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 14px var(--lp-pad) 10px;
  border-bottom: 1px solid rgba(15,23,42,.08);
  background: linear-gradient(180deg, rgba(15,23,42,.02) 0%, rgba(15,23,42,0) 100%);
}

.localPanel__title{
  margin: 0;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--lp-ink);
}

/* ===== Interview panel ===== */
.localInterviewPanel__empty{
  margin: 0;
  color: var(--lp-muted);
  font-size: 13px;
  font-weight: 700;
}

.localInterviewPanel__stack{
  display:flex;
  flex-direction: column;
  gap: 14px;
}

.localInterviewPanel__qa{
  padding: 12px 12px;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 12px;
  background: rgba(15,23,42,.02);
}

.localInterviewPanel__q{
  font-size: 12px;
  font-weight: 900;
  color: var(--lp-ink);
  margin-bottom: 6px;
}

.localInterviewPanel__a{
  font-size: 13px;
  line-height: 1.8;
  color: var(--lp-sub);
}

.localInterviewPanel__galleryTitle{
  font-size: 12px;
  font-weight: 900;
  color: var(--lp-ink);
  margin: 4px 0 10px;
}

.localInterviewPanel__grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-gap: 8px;
  gap: 8px;
}

.localInterviewPanel__imgWrap{
  display:block;
  border-radius: 12px;
  overflow:hidden;
  border: 1px solid rgba(15,23,42,.08);
}

.localInterviewPanel__img{
  width: 100%;
  height: 110px;
  object-fit: cover;
  display:block;
}

@media (max-width: 575px){
  .localInterviewPanel__grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .localInterviewPanel__img{ height: 120px; }
}

.localPanel__body{
  padding: var(--lp-pad-lg);
  color: var(--lp-sub);
  font-size: 14px;
  line-height: 1.6;
}

.localPanel__body .localAboutPanel__empty,
.localPanel__body .localServicesPanel__empty,
.localPanel__body .localPostsPanel__empty{
  margin: 0;
  color: var(--lp-muted);
}

.localChipRow{
  display:flex;
  flex-wrap:wrap;
  gap: 8px;
}

.localChip{
  display:inline-flex;
  align-items:center;
  height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(15,23,42,.03);
  color: var(--lp-ink);
  font-size: 12px;
  font-weight: 700;
}

.localList{
  margin: 10px 0 0;
  padding: 0;
  list-style: none;
  display:flex;
  flex-direction:column;
  gap: 8px;
}

.localListItem{
  display:flex;
  align-items:center;
  gap: 10px;
  color: var(--lp-sub);
}

.localListItem::before{
  content:"";
  width: 6px;
  height: 6px;
  border-radius: 99px;
  background: rgba(14,165,233,.45);
  box-shadow: 0 0 0 3px rgba(14,165,233,.10);
}

@media (max-width: 575px){
  .localPanel__body{ padding: 16px; }
}

/*!**************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/local/detail-panels.about.css ***!
  \**************************************************************************************************************************************************************************************************************************************************************************************************/
/* src/app/styles/local/detail-panels.about.css */

.localAboutPanel__headline{
  font-size: 16px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--lp-ink);
  margin-bottom: 10px;
}

.localAboutPanel__text{
  margin: 0;
  color: var(--lp-sub);
}

/*!*****************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/local/detail-panels.services.css ***!
  \*****************************************************************************************************************************************************************************************************************************************************************************************************/
/* src/app/styles/local/detail-panels.services.css */

.localServicesCardList{
  display:flex;
  flex-direction:column;
  gap: 14px;
}

.localServiceCard{
  padding: 14px;
  border-radius: 14px;
  border: 1px solid rgba(15,23,42,.08);
  background: rgba(15,23,42,.02);
}

.localServiceCard__top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap: 12px;
  margin-bottom: 8px;
}

.localServiceCard__badges{
  display:flex;
  flex-wrap:wrap;
  gap: 8px;
}

.localServiceCard__badge{
  display:inline-flex;
  align-items:center;
  height: 26px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(15,23,42,.03);
  color: var(--lp-ink);
  font-size: 12px;
  font-weight: 800;
}

.localServiceCard__price{
  font-size: 14px;
  font-weight: 950;
  color: var(--lp-ink);
  white-space: nowrap;
}

.localServiceCard__titleRow{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap: 12px;
  margin-bottom: 8px;
}

.localServiceCard__title{
  margin: 0;
  font-size: 15px;
  font-weight: 900;
  letter-spacing: -0.02em;
  color: var(--lp-ink);
  line-height: 1.25;
}

.localServiceCard__rating{
  display:flex;
  align-items:center;
  gap: 6px;
  white-space: nowrap;
}

.localServiceCard__stars{
  font-size: 12px;
  letter-spacing: -0.08em;
  opacity: .65;
}

.localServiceCard__ratingText{
  font-size: 12px;
  font-weight: 900;
  color: var(--lp-sub);
}

.localServiceCard__desc{
  margin: 0;
  color: var(--lp-sub);
}

.localServiceCard__meta{
  margin-top: 10px;
  display:flex;
  flex-wrap:wrap;
  gap: 8px;
}

.localServiceCard__metaItem{
  display:inline-flex;
  align-items:center;
  height: 26px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(15,23,42,.03);
  color: var(--lp-ink);
  font-size: 12px;
  font-weight: 800;
}

.localServiceCard__divider{
  margin: 12px 0;
  height: 1px;
  background: rgba(15,23,42,.08);
}

.localServiceCard__pricingTitle{
  font-size: 12px;
  font-weight: 950;
  color: var(--lp-ink);
  margin-bottom: 10px;
}

.localServiceCard__options{
  display:flex;
  flex-direction:column;
  gap: 10px;
}

.localServiceCard__optionRow{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap: 12px;
  padding-top: 10px;
  border-top: 1px dashed rgba(15,23,42,.12);
}

.localServiceCard__optionLeft{
  min-width: 0;
}

.localServiceCard__optionTitle{
  color: var(--lp-ink);
  font-weight: 800;
  font-size: 13px;
}

.localServiceCard__optionSub{
  color: var(--lp-muted);
  font-size: 12px;
  margin-top: 2px;
  white-space: nowrap;
}

.localServiceCard__optionPrice{
  color: var(--lp-ink);
  font-weight: 950;
  font-size: 13px;
  white-space: nowrap;
}

.localServiceCard__ctas{
  margin-top: 14px;
  display:flex;
  gap: 10px;
}

.localServiceCard__ctaPrimary,
.localServiceCard__ctaSecondary{
  flex: 1 1;
  height: 42px;
  border-radius: 12px;
  font-weight: 900;
  font-size: 13px;
  letter-spacing: -0.01em;
  cursor: pointer;
  transition: transform .14s ease, box-shadow .14s ease, background .14s ease, border-color .14s ease;
}

.localServiceCard__ctaPrimary{
  border: 1px solid rgba(14,165,233,.30);
  color: #fff;
  background: linear-gradient(180deg, rgba(14,165,233,.98), rgba(2,132,199,.98));
  box-shadow: 0 14px 28px rgba(14,165,233,.18);
}

.localServiceCard__ctaPrimary:hover{
  transform: translateY(-1px);
  box-shadow: 0 18px 34px rgba(14,165,233,.22);
}

.localServiceCard__ctaSecondary{
  border: 1px solid rgba(15,23,42,.14);
  background: #fff;
  color: var(--lp-ink);
}

.localServiceCard__ctaSecondary:hover{
  transform: translateY(-1px);
  border-color: rgba(14,165,233,.20);
  box-shadow: 0 12px 22px rgba(2,6,23,.08);
}

@media (max-width: 575px){
  .localServiceCard__ctas{ flex-direction: column; }
  .localServiceCard__ctaPrimary,
  .localServiceCard__ctaSecondary{ width: 100%; }
}

/*!**************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/local/detail-panels.posts.css ***!
  \**************************************************************************************************************************************************************************************************************************************************************************************************/
/* src/app/styles/local/detail-panels.posts.css */

.localPostsPanel__link{
  font-size: 12px;
  font-weight: 800;
  color: rgba(14,165,233,.95);
  text-decoration: none;
}

.localPostsPanel__link:hover{
  text-decoration: underline;
}

.localPostsPanel__list{
  display:flex;
  flex-direction:column;
  gap: 12px;
}

.localPostsPanel__item{
  display:flex;
  gap: 12px;
  padding: 12px;
  border-radius: 14px;
  border: 1px solid rgba(15,23,42,.08);
  background: rgba(15,23,42,.02);
  text-decoration: none;
  color: inherit;
  transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease;
}

.localPostsPanel__item:hover{
  transform: translateY(-1px);
  border-color: rgba(14,165,233,.22);
  box-shadow: 0 10px 22px rgba(2,6,23,.08);
}

.localPostsPanel__thumb{
  flex: 0 0 88px;
  height: 66px;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(14,165,233,.15), rgba(34,197,94,.12));
  border: 1px solid rgba(15,23,42,.08);
}

.localPostsPanel__content{ min-width: 0; }

.localPostsPanel__title{
  font-size: 14px;
  font-weight: 900;
  color: var(--lp-ink);
  letter-spacing: -0.02em;
  margin-bottom: 4px;
}

.localPostsPanel__excerpt{
  font-size: 13px;
  color: var(--lp-sub);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.localPostsPanel__meta{
  margin-top: 6px;
  font-size: 12px;
  color: var(--lp-muted);
}

/*!***************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/local/detail-panels.action.css ***!
  \***************************************************************************************************************************************************************************************************************************************************************************************************/
/* src/app/styles/local/detail-panels.action.css */

.localActionPanel__row{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(15,23,42,.02);
  border: 1px solid rgba(15,23,42,.08);
  margin-bottom: 14px;
}

.localActionPanel__priceLabel{
  font-size: 12px;
  color: var(--lp-muted);
  font-weight: 800;
}

.localActionPanel__priceValue{
  font-size: 22px;
  font-weight: 950;
  letter-spacing: -0.03em;
  color: var(--lp-ink);
}

.localActionPanel__buttons{
  display:flex;
  gap: 10px;
}

.localActionPanel__primaryBtn,
.localActionPanel__secondaryBtn{
  flex: 1 1;
  height: 44px;
  border-radius: 12px;
  font-weight: 900;
  font-size: 13px;
  letter-spacing: -0.01em;
  cursor: pointer;
  transition: transform .14s ease, box-shadow .14s ease, background .14s ease, border-color .14s ease;
}

.localActionPanel__primaryBtn{
  border: 1px solid rgba(14,165,233,.30);
  color: #fff;
  background: linear-gradient(180deg, rgba(14,165,233,.98), rgba(2,132,199,.98));
  box-shadow: 0 14px 28px rgba(14,165,233,.20);
}

.localActionPanel__primaryBtn:hover{
  transform: translateY(-1px);
  box-shadow: 0 18px 34px rgba(14,165,233,.24);
}

.localActionPanel__secondaryBtn{
  border: 1px solid rgba(15,23,42,.14);
  background: #fff;
  color: var(--lp-ink);
}

.localActionPanel__secondaryBtn:hover{
  transform: translateY(-1px);
  border-color: rgba(14,165,233,.20);
  box-shadow: 0 12px 22px rgba(2,6,23,.08);
}

.localActionPanel__fineprint{
  margin-top: 12px;
  font-size: 12px;
  color: var(--lp-muted);
}

@media (max-width: 575px){
  .localActionPanel__buttons{ flex-direction: column; }
  .localActionPanel__primaryBtn,
  .localActionPanel__secondaryBtn{ width: 100%; }
}

/*!*************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/local/detail-panels.meta.css ***!
  \*************************************************************************************************************************************************************************************************************************************************************************************************/
/* src/app/styles/local/detail-panels.meta.css */

.localMetaPanel__block + .localMetaPanel__block{
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px dashed rgba(15,23,42,.12);
}

.localMetaPanel__label{
  font-size: 12px;
  font-weight: 900;
  color: var(--lp-ink);
  margin-bottom: 10px;
}

.localMetaPanel__empty{
  color: var(--lp-muted);
  font-size: 13px;
}

/*!**************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/local/detail-panels.trust.css ***!
  \**************************************************************************************************************************************************************************************************************************************************************************************************/
/* src/app/styles/local/detail-panels.trust.css */

.localTrustPanel__row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  margin-bottom: 14px;
}

.localTrustPanel__badge{
  display:inline-flex;
  align-items:center;
  height: 30px;
  padding: 0 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(34,197,94,.10);
  color: rgba(15,23,42,.88);
}

.localTrustPanel__rating{
  display:flex;
  align-items:baseline;
  gap: 6px;
}

.localTrustPanel__ratingValue{
  font-size: 18px;
  font-weight: 950;
  color: var(--lp-ink);
}

.localTrustPanel__ratingCount,
.localTrustPanel__ratingEmpty{
  font-size: 12px;
  color: var(--lp-muted);
  font-weight: 800;
}

.localTrustPanel__location{
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(15,23,42,.02);
  border: 1px solid rgba(15,23,42,.08);
  margin-bottom: 12px;
}

.localTrustPanel__label{
  font-size: 12px;
  font-weight: 900;
  color: var(--lp-ink);
  margin-bottom: 4px;
}

.localTrustPanel__value{
  font-size: 13px;
  color: var(--lp-sub);
}

.localTrustPanel__mapPlaceholder{
  height: 140px;
  border-radius: 14px;
  border: 1px dashed rgba(15,23,42,.18);
  background: rgba(15,23,42,.02);
  color: var(--lp-muted);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 12px;
  font-weight: 800;
}

/*!********************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/local/detail-panels.css ***!
  \********************************************************************************************************************************************************************************************************************************************************************************************/
/* src/app/styles/local/detail-panels.css */

/*!*****************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/places/place-hub.css ***!
  \*****************************************************************************************************************************************************************************************************************************************************************************************/
/* src/styles/place-hub.css */

/* container */
.phContainer{ width:min(1120px, calc(100% - 40px)); margin:0 auto; }
.placeHubPage{ background:#fff; }

/* HERO */
.phHero{
  position: relative;
  min-height: 420px;   /* 🔻 520 → 420 */
  display: flex;
  align-items: center;
  padding: 32px 0;     /* 기존 유지 */
  overflow: hidden;
}

.phHeroBg{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
  filter: saturate(1.05) contrast(1.02);
  transform: scale(1.03);
}
.phHeroOverlay{
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.45) 0%, rgba(0,0,0,.55) 55%, rgba(0,0,0,.62) 100%);
}
.phHeroInner{ position:relative; z-index:2; display:flex; flex-direction:column; align-items:center; gap: 22px; text-align:center; }
.phHeroCopy{ max-width: 960px; }
.phHeroTitle{
  margin:0;
  color:#fff;
  font-weight: 900;
  letter-spacing: -0.02em;
  line-height: 1.08;
  font-size: clamp(30px, 4.5vw, 46px);
}
.phHeroLead{
  margin: 12px 0 0;
  color: rgba(255,255,255,.88);
  font-size: 15px;
  line-height: 1.7;
}

/* Search card */
.phSearchCard{
  width: min(860px, 100%);
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(15,23,42,.12);
  border-radius: 14px;
  box-shadow: 0 22px 60px rgba(0,0,0,.18);
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
  padding: 14px;
}
.phSearchRow{
  display:flex;
  gap: 12px;
  align-items:center;
}
.phSearchInputWrap{
  flex:1 1;
  display:flex;
  gap: 10px;
  align-items:center;
  background:#fff;
  border: 1px solid rgba(15,23,42,.12);
  border-radius: 12px;
  padding: 12px 12px;
}
.phSearchIcon{ opacity:.65; }
.phSearchInput{
  width:100%;
  border:0;
  outline:0;
  font-size: 14px;
  background: transparent;
}
.phExploreBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height: 44px;
  padding: 0 18px;
  border-radius: 12px;
  background: #10b981;
  color:#fff;
  font-weight: 800;
  text-decoration:none;
  border: 1px solid rgba(0,0,0,.08);
}
.phExploreBtn:hover{ filter: brightness(0.98); }

.phPills{
  display:flex;
  flex-wrap:wrap;
  gap: 8px;
  margin-top: 12px;
  justify-content:flex-start;
}
.phPill{
  border: 1px solid rgba(15,23,42,.12);
  background: rgba(15,23,42,.04);
  color: rgba(15,23,42,.82);
  font-weight: 700;
  font-size: 12px;
  border-radius: 999px;
  padding: 7px 10px;
  cursor:pointer;
}
.phPill:hover{ background: rgba(15,23,42,.07); }

/* sections */
.phSection{ padding: 56px 0; }
.phSectionHead{ margin-bottom: 18px; }
.phCenter{ text-align:center; }
.phH2{
  margin:0;
  font-size: 20px;
  font-weight: 900;
  letter-spacing: -0.01em;
  color: rgba(15,23,42,.92);
}
.phLead{
  margin: 10px 0 0;
  color: rgba(15,23,42,.58);
  font-size: 13px;
  line-height: 1.6;
}

/* Stories cards */
.phGrid3{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  grid-gap: 16px;
  gap: 16px;
}
.phStoryCard{
  display:block;
  text-decoration:none;
  border-radius: 14px;
  overflow:hidden;
  background:#fff;
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 0 14px 42px rgba(15,23,42,.08);
  transition: transform 160ms ease, box-shadow 160ms ease;
}
.phStoryCard:hover{ transform: translateY(-3px); box-shadow: 0 18px 54px rgba(15,23,42,.12); }
.phStoryMedia{ position:relative; aspect-ratio: 16/10; overflow:hidden; }
.phStoryMedia img{ width:100%; height:100%; object-fit:cover; }
.phStoryTag{
  position:absolute;
  top: 12px; left: 12px;
  background: rgba(0,0,0,.55);
  color:#fff;
  border: 1px solid rgba(255,255,255,.25);
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
}
.phStoryBody{ padding: 14px 14px 16px; }
.phStoryTitle{ font-weight: 900; color: rgba(15,23,42,.92); line-height: 1.3; }
.phStoryExcerpt{ margin-top: 8px; color: rgba(15,23,42,.62); font-size: 13px; line-height: 1.55; }
.phStoryMore{ margin-top: 12px; font-weight: 900; color: rgba(37,99,235,.92); }

/* Locals */
.phLocals{ padding-top: 18px; }
.phLocalsWrap{ margin-top: 18px; }

/* Blue band */
.phBand{
  background: #1d4ed8;
  color:#fff;
  padding: 26px 0;
}
.phBandInner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 18px;
}
.phBandKicker{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.25);
  font-weight: 900;
  font-size: 12px;
}
.phBandTitle{ margin-top: 10px; font-weight: 900; font-size: 18px; letter-spacing: -0.01em; }
.phBandLead{ margin-top: 8px; color: rgba(255,255,255,.86); font-size: 13px; line-height: 1.6; }
.phBandIconBtn{
  width: 48px;
  height: 48px;
  border-radius: 14px;
  display:grid;
  place-items:center;
  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.25);
  color:#fff;
  text-decoration:none;
}
.phBandIconBtn:hover{ background: rgba(255,255,255,.20); }

/* Destinations */
.phFilters{
  margin-top: 18px;
  display:flex;
  gap: 12px;
  align-items:flex-end;
  justify-content:center;
  flex-wrap: wrap;
}
.phSelectWrap{ display:flex; flex-direction:column; gap: 6px; }
.phLabel{ font-size: 12px; font-weight: 800; color: rgba(15,23,42,.66); }
.phSelect{
  height: 40px;
  min-width: 220px;
  border-radius: 12px;
  border: 1px solid rgba(15,23,42,.12);
  padding: 0 12px;
  outline: none;
  background:#fff;
}
.phClearBtn{
  height: 40px;
  padding: 0 16px;
  border-radius: 12px;
  border: 1px solid rgba(16,185,129,.55);
  background: rgba(16,185,129,.10);
  color: rgba(6,95,70,.98);
  font-weight: 900;
  cursor:pointer;
}
.phClearBtn:hover{ background: rgba(16,185,129,.14); }

.phGridCards{
  margin-top: 18px;
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  grid-gap: 16px;
  gap: 16px;
}
.phDestCard{
  border-radius: 14px;
  overflow:hidden;
  background:#fff;
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 0 14px 42px rgba(15,23,42,.08);
}
.phDestMedia{ aspect-ratio: 16/10; overflow:hidden; }
.phDestMedia img{ width:100%; height:100%; object-fit:cover; }
.phDestBody{ padding: 12px 12px 14px; }
.phDestTitle{ font-weight: 900; color: rgba(15,23,42,.92); }
.phDestSub{ margin-top: 4px; color: rgba(15,23,42,.60); font-size: 12px; }
.phDestActions{ margin-top: 10px; display:flex; gap: 8px; }
.phMiniBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(15,23,42,.06);
  border: 1px solid rgba(15,23,42,.10);
  text-decoration:none;
  font-weight: 900;
  font-size: 12px;
  color: rgba(15,23,42,.88);
}
.phMiniBtn.ghost{
  background: transparent;
}
.phMiniBtn:hover{ background: rgba(15,23,42,.08); }

/* responsive */
@media (max-width: 980px){
  .phGrid3{ grid-template-columns: 1fr; }
  .phGridCards{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .phHero{ min-height: 520px; }
}
@media (max-width: 560px){
  .phSearchRow{ flex-direction: column; }
  .phExploreBtn{ width:100%; }
  .phGridCards{ grid-template-columns: 1fr; }
  .phBandInner{ flex-direction: column; align-items:flex-start; }
}

/*!*************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/places/story.css ***!
  \*************************************************************************************************************************************************************************************************************************************************************************************/
/* =========================
   Place Story Detail (Friday Blue) - Refactor
   Scope: .placeStoryDetail
========================= */

.placeStoryDetail{
  --ps-ink:#0f172a;
  --ps-sub:rgba(15,23,42,.72);
  --ps-muted:rgba(15,23,42,.56);
  --ps-line:rgba(15,23,42,.10);

  --ps-blue:#1d4ed8;   /* blue-700 */
  --ps-blue2:#2563eb;  /* blue-600 */
  --ps-blue3:#0ea5e9;  /* accent optional */

  --ps-card:#ffffff;
  --ps-bg:#f6f9ff;

  background: transparent;
}

/* =========================
   Shared width harmony
========================= */
.placeStoryDetail .placeStoryCover,
.placeStoryDetail .placeStoryBody,
.placeStoryDetail .placeStoryCta,
.placeStoryDetail .placeStoryServices{
  border-radius: 14px;
}

/* =========================
   Cover
========================= */
.placeStoryDetail .placeStoryCover{
  overflow:hidden;
  box-shadow:0 14px 40px rgba(15,23,42,.10);
}
.placeStoryDetail .placeStoryCover img{
  width:100%;
  height:auto;
  display:block;
  object-fit:cover;
}

/* =========================
   Story Card (white card)
========================= */
.placeStoryDetail .placeStoryBody{
  background: var(--ps-card);
  border: 1px solid var(--ps-line);
}

.placeStoryDetail .placeStoryMeta{
  border-bottom:1px solid var(--ps-line);
  padding-bottom:16px;
}

.placeStoryDetail .placeStoryTitle{
  letter-spacing:-0.02em;
  color: var(--ps-ink);
}

.placeStoryDetail .placeStoryBody p{
  line-height:1.75;
  color: var(--ps-ink);
}

.placeStoryDetail .placeStoryStats i{
  font-size:14px;
  opacity:.75;
}

.placeStoryDetail .placeStoryShare a:hover{
  color: var(--ps-blue2);
}

/* =========================
   Chips / badges polish
   (기존 테마 bg-light-2 / bg-blue-1-05에 의존하면 충돌 가능)
   -> placeStoryMeta 안에서만 안전하게 덮어쓰기
========================= */
.placeStoryDetail .placeStoryMeta .bg-light-2{
  background: rgba(15,23,42,.06) !important;
  color: rgba(15,23,42,.78) !important;
}
.placeStoryDetail .placeStoryMeta .bg-blue-1-05{
  background: rgba(37,99,235,.10) !important;
  color: rgba(29,78,216,.95) !important;
}

/* =========================
   CTA Banner (screenshot style)
   ✅ 밝은 블루 배경 + 진한 텍스트(가독성)
========================= */
.placeStoryDetail .placeStoryCta{
  border:1px solid rgba(37,99,235,.16);
  background: linear-gradient(
    180deg,
    rgba(37,99,235,.12) 0%,
    rgba(37,99,235,.06) 55%,
    rgba(37,99,235,.03) 100%
  );
  box-shadow:0 14px 40px rgba(15,23,42,.08);
}

/* CTA 텍스트는 흰색 금지(스샷처럼 진한 텍스트) */
.placeStoryDetail .placeStoryCta .text-dark-1{
  color: var(--ps-ink) !important;
}
.placeStoryDetail .placeStoryCta .text-light-1{
  color: rgba(15,23,42,.72) !important;
}

/* CTA 가운데 정렬 */
.placeStoryDetail .placeStoryCta .row{
  justify-content:center !important;
  text-align:center;
}
.placeStoryDetail .placeStoryCta .col-lg-7,
.placeStoryDetail .placeStoryCta .col-lg-auto{
  flex:0 0 100%;
  max-width:100%;
}
.placeStoryDetail .placeStoryCta .col-lg-auto{
  margin-top:14px;
}
.placeStoryDetail .placeStoryCta .d-flex{
  justify-content:center;
}

/* CTA 버튼: secondary / primary (Friday) */
.placeStoryDetail .placeStoryCta .button{
  white-space:nowrap;
  border-radius:12px;
}

/* secondary (View profile) */
.placeStoryDetail .placeStoryCta .button.-outline-dark-1{
  background: rgba(255,255,255,.85) !important;
  border:1px solid rgba(37,99,235,.22) !important;
  color: var(--ps-blue2) !important;
}
.placeStoryDetail .placeStoryCta .button.-outline-dark-1:hover{
  background:#fff !important;
  border-color: rgba(37,99,235,.32) !important;
}

/* primary (Book a service) */
.placeStoryDetail .placeStoryCta .button.-blue-1.bg-blue-1{
  background: var(--ps-blue2) !important;
  border-color: transparent !important;
  box-shadow:0 10px 22px rgba(29,78,216,.22);
}
.placeStoryDetail .placeStoryCta .button.-blue-1.bg-blue-1:hover{
  background: var(--ps-blue) !important;
}

/* =========================
   Services section
========================= */
.placeStoryDetail .placeStoryServices{
  /* 섹션 전체는 별도 카드가 아니라면 생략 가능 */
}

/* service card hover polish */
.placeStoryDetail .placeStoryServiceCard{
  background:#fff;
  border:1px solid var(--ps-line);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.placeStoryDetail .placeStoryServiceCard:hover{
  transform: translateY(-2px);
  border-color: rgba(37,99,235,.18);
  box-shadow:0 18px 50px rgba(15,23,42,.12);
}

/* tags pill */
.placeStoryDetail .placeStoryServiceTag{
  background: rgba(37,99,235,.10);
  color: rgba(29,78,216,.95);
  font-size:12px;
  padding:4px 10px;
  border-radius:9999px;
}

/* price */
.placeStoryDetail .placeStoryPrice{
  font-weight:700;
  color: var(--ps-ink);
}

/* actions row (View details / Book) */
.placeStoryDetail .placeStoryServiceActions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-top:16px;
  gap:12px;
}
.placeStoryDetail .placeStoryServiceLink{
  font-size:14px;
  color: var(--ps-blue2);
  text-decoration: underline;
  white-space:nowrap;
}
.placeStoryDetail .placeStoryServiceBook{
  background: var(--ps-blue2);
  color:#fff;
  font-size:14px;
  font-weight:600;
  padding:8px 18px;
  border-radius:10px;
  line-height:1;
  transition: all .18s ease;
  white-space:nowrap;
}
.placeStoryDetail .placeStoryServiceBook:hover{
  background: var(--ps-blue);
  transform: translateY(-1px);
  box-shadow:0 6px 18px rgba(37,99,235,.22);
}

/* =========================
   Responsive
========================= */
@media (max-width: 768px){
  .placeStoryDetail .placeStoryTitle{ font-size:22px; }

  .placeStoryDetail .placeStoryCta{
    padding:20px !important;
  }

  /* 모바일에서는 Book 버튼 full */
  .placeStoryDetail .placeStoryServiceActions{
    flex-direction:column;
    align-items:stretch;
  }
  .placeStoryDetail .placeStoryServiceBook{
    width:100%;
    text-align:center;
    padding:12px 0;
  }
  .placeStoryDetail .placeStoryServiceLink{
    text-align:center;
  }
}

/*!**************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/stories/story.css ***!
  \**************************************************************************************************************************************************************************************************************************************************************************************/
.storiesFullBleed{
  width: 100vw;
  margin-left: calc(50% - 50vw);
}

.storiesHeroFull{
  margin-bottom: 24px;
}

.storiesHeroFull .storiesHero{
  position: relative;
  overflow: hidden;
  padding: 54px 0;
}

.storiesHeroBg{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.03);
}

.storiesHeroOverlay{
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgba(2,6,23,0.65) 0%,
    rgba(2,6,23,0.45) 45%,
    rgba(2,6,23,0.30) 100%
  );
}

.storiesHeroInner{
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.storiesHeroCopy h1{
  margin: 0;
  font-size: 38px;
  font-weight: 900;
  letter-spacing: -0.02em;
  color: rgba(255,255,255,0.96);
  text-shadow: 0 2px 10px rgba(0,0,0,0.25);
}

.storiesHeroCopy p{
  margin: 8px 0 0;
  font-size: 15px;
  color: rgba(255,255,255,0.88);
  max-width: 520px;
}

.storiesHeroCats{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
  position: relative;
  z-index: 2;
}

.storiesCat{
  height: 30px;
  padding: 0 14px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
  cursor: pointer;
  transition: transform .12s ease, background .12s ease, border-color .12s ease;
}

.storiesHero .storiesCat{
  border: 1px solid rgba(255,255,255,0.35);
  background: rgba(255,255,255,0.12);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  color: rgba(255,255,255,0.95);
}

.storiesHero .storiesCat:hover{
  background: rgba(255,255,255,0.20);
  transform: translateY(-1px);
}

.storiesHero .storiesCat.is-active{
  background: #fff;
  border-color: #fff;
  color: #0f172a;
}

.storiesCatsBar{
  width: 100vw;
  margin-left: calc(50% - 50vw);
  background: rgba(255,255,255,0.92);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
   margin-bottom: 36px;
}

.storiesCatsBar .container{
  border-bottom: 1px solid rgba(15,23,42,0.10);
}

.storiesCatsBar .storiesHeroCats{
  display: flex;
  gap: 8px;
  padding: 12px 0;
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.storiesCatsBar .storiesHeroCats::-webkit-scrollbar{ height: 6px; }

.storiesCatsBar .storiesCat{
  border: 1px solid rgba(15,23,42,0.18);
  background: rgba(15,23,42,0.04);
  color: rgba(15,23,42,0.85);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.storiesCatsBar .storiesCat:hover{
  background: rgba(15,23,42,0.08);
  transform: translateY(-1px);
}

.storiesCatsBar .storiesCat.is-active{
  background: rgba(15,23,42,0.92);
  border-color: rgba(15,23,42,0.92);
  color: #fff;
}

.storiesEmpty{
  padding: 28px 0;
  color: rgba(15,23,42,0.65);
  font-size: 13px;
}

.storiesMain{
  padding: 44px 0 72px;
}

.storiesTopbar{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 28px;
}

.storiesCount{
  font-size: 13px;
  font-weight: 700;
}

.storiesFilter{
  display: flex;
  align-items: center;
  gap: 10px;
}

.storiesFilterLabel{
  font-size: 12px;
  color: rgba(15,23,42,0.62);
}

.storiesSelect{
  height: 34px;
  padding: 0 12px;
  border-radius: 8px;
  border: 1px solid rgba(15,23,42,0.14);
  background: #fff;
  font-size: 12px;
  color: rgba(15,23,42,0.92);
}

.storiesGrid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-gap: 22px;
  gap: 22px;
}

.storyCard{
  border-radius: 14px;
  background: #fff;
  border: 1px solid rgba(15,23,42,0.10);
  box-shadow: 0 10px 26px rgba(15,23,42,0.08);
  overflow: hidden;
  color: rgba(15,23,42,0.92);
}

.storyCard a{
  color: inherit;
  text-decoration: none;
}

.storyThumb{
  position: relative;
  display: block;
  aspect-ratio: 16/9;
  overflow: hidden;
  background: rgba(15,23,42,0.04);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.storyThumb img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transform: scale(1.01);
  transition: transform .18s ease;
}

.storyBody{
  padding: 14px 14px 12px;
}

.storyTitle{
  margin: 0;
  font-size: 14px;
  font-weight: 900;
  line-height: 1.25;
  letter-spacing: -0.01em;
  color: rgba(15,23,42,0.96);
}

.storyTitle a:hover{
  text-decoration: underline;
  text-underline-offset: 3px;
}

.storyExcerpt{
  margin: 8px 0 12px;
  font-size: 12px;
  line-height: 1.45;
  color: rgba(15,23,42,0.68);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.storyMeta{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.storyAuthor{
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.storyAvatar{
  width: 26px;
  height: 26px;
  border-radius: 999px;
  object-fit: cover;
  flex: 0 0 auto;
}

.storyAuthorText{
  min-width: 0;
}

.storyName{
  font-size: 12px;
  font-weight: 800;
  color: rgba(15,23,42,0.92);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.storyDate{
  font-size: 11px;
  color: rgba(15,23,42,0.55);
}

.storyStats{
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 12px;
  color: rgba(15,23,42,0.65);
}

.storyCard:hover{
  box-shadow: 0 14px 34px rgba(15,23,42,0.12);
  border-color: rgba(15,23,42,0.14);
}

.storyCard:hover .storyThumb img{
  transform: scale(1.05);
}

.storyBadge{
  position: absolute;
  top: 10px;
  left: 10px;
  padding: 4px 8px;
  font-size: 11px;
  font-weight: 800;
  border-radius: 999px;
  background: rgba(15,23,42,0.9);
  color: #fff;
}
.sectionDivider{
  height: 1px;
  background: rgba(15,23,42,0.06);
  margin: 56px 0;
}

@media (max-width: 1024px){
  .storiesGrid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (max-width: 640px){
  .storiesHeroCopy h1{
    font-size: 28px;
  }  
  .updatesTitle{
    font-size: 20px;
  }  
  .storiesHeroCats{
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 6px;
  }
  .storiesHeroCats::-webkit-scrollbar{ height: 6px; }

  .storiesTopbar{
    flex-wrap: wrap;
    gap: 10px;
  }
  .storiesFilter{
    flex-wrap: wrap;
    width: 100%;
  }
  .storiesSelect{
    width: 100% !important;
  }
  .storiesGrid{
    grid-template-columns: 1fr;
  }
}


.updatesSection{
  padding: 0 0 30px;
}

.updatesHeader{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap: 14px;
  margin-bottom: 10px;
}

.updatesTitle{
  font-weight: 900;
  font-size: 26px;
  letter-spacing: -0.02em;
  color: rgba(15,23,42,0.92);
}

.updatesSub{
  margin-top: 6px;
  font-size: 12px;
  color: rgba(15,23,42,0.72);
}

.updatesAll{
  font-size: 12px;
  color: rgba(37,99,235,0.95);
  text-decoration: none;
  font-weight: 700;
  white-space: nowrap;
}
.updatesAll:hover{ text-decoration: underline; }

.updatesCard{
  border-radius: 16px;
  border: 1px solid rgba(15,23,42,0.10);
  box-shadow: 0 10px 26px rgba(15,23,42,0.08);
  overflow: hidden;
  background: #fff;
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  min-height: 170px;
}

.updatesMedia{
  position: relative;
  background: rgba(15,23,42,0.04);
}

.updatesImg,
.updatesImgFallback{
  width: 100%;
  height: 100%;
  min-height: 170px;
  object-fit: cover;
  display: block;
}

.updatesNav{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 34px;
  height: 34px;
  border-radius: 999px;
  border: 1px solid rgba(15,23,42,0.12);
  background: rgba(255,255,255,0.92);
  cursor: pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 18px;
  line-height: 1;
}

.updatesPrev{ left: 10px; }
.updatesNext{ right: 10px; }

.updatesNav:hover{
  background: rgba(255,255,255,0.98);
}

.updatesDots{
  position: absolute;
  left: 50%;
  bottom: 10px;
  transform: translateX(-50%);
  display: flex;
  gap: 8px;
}

.updatesDot{
  width: 22px;
  height: 6px;
  border-radius: 999px;
  border: 0;
  background: rgba(255,255,255,0.55);
  cursor: pointer;
}

.updatesDot.is-active{
  background: rgba(37,99,235,0.95);
}

.updatesBody{
  padding: 16px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap: 10px;
}

.updatesBodyTitle{
  font-weight: 900;
  font-size: 22px;
  color: rgba(15,23,42,0.92);
}

.updatesBodyExcerpt{
  font-size: 13px;
  color: rgba(15,23,42,0.65);
}

.updatesCta{
  margin-top: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 130px;
  height: 36px;
  border-radius: 999px;
  background: rgba(37,99,235,0.95);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}
.updatesCta:hover{ filter: brightness(0.98); }


.storiesBlock{
  padding: 32px 0 30px;
}

.storiesBlock + .storiesBlock{
  border-top: 1px solid rgba(15,23,42,0.07);
  margin-top: 18px;
}

.storiesSectionHead{
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}

.storiesSectionTitle{
  font-weight: 900;
  font-size: 26px;
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: rgba(15,23,42,0.94);
}

.storiesSectionSub{
  margin-top: 8px;
  font-size: 13px;
  line-height: 1.5;
  color: rgba(15,23,42,0.70);
  max-width: 720px;
  margin-bottom: 18px;
}

@media (max-width: 640px){
  .storiesSectionTitle{ font-size: 20px; }
}


@media (max-width: 768px){
  .updatesCard{
    grid-template-columns: 1fr;
  }
  .updatesBodyTitle{
    font-size: 18px;
  }
}

/* StoryCard title size lock */
.storyCard .storyBody .storyTitle{
  margin: 0;
  font-size: 16px !important;
  font-weight: 900;
  line-height: 1.25;
  letter-spacing: -0.01em;
  color: rgba(15,23,42,0.96);
}

/* 혹시 Link 내부 a / h3 스타일이 따로 먹는 경우 */
.storyCard .storyCardLink .storyTitle{
  font-size: 16px !important;
}

.prose .storyCard .storyTitle{
  font-size: 16px !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/*!**********************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/stories/detail-author.css ***!
  \**********************************************************************************************************************************************************************************************************************************************************************************************/
:root{
  --header-h: 82px;
  --safe-top: env(safe-area-inset-top, 0px);
  --sa-pad-top-extra: 10px;

  --z-header: 3000;
  --z-header-menu: 3100;
  --z-stickybar: 1200;

  --sa-bg: rgba(248,250,252,.92);
  --sa-bg-solid: #f8fafc;
  --sa-backdrop: blur(10px);

  --sa-ink: rgba(15,23,42,.92);
  --sa-sub: rgba(15,23,42,.62);

  --sa-line-top: rgba(15,23,42,.10);
  --sa-line-bottom: rgba(15,23,42,.08);

  /* 내부 공백(요청사항) */
  --sa-h: 104px;
  --sa-pad-y: 18px;
  --sa-pad-x: 16px;

  --sa-gap: 18px;
  --sa-left-gap: 16px;

  --sa-btn-h: 42px;
  --sa-btn-px: 16px;

  --sa-btn-bg: #ffffff;
  --sa-btn-bd: rgba(15,23,42,.14);
  --sa-btn-ink: rgba(15,23,42,.90);

  --sa-ghost-bg: #f1f5f9;
  --sa-ghost-bg-hover: #eaf0f7;

  --sa-primary-bg: #0ea5e9;
  --sa-primary-bg-hover: #0284c7;
  --sa-primary-bd: rgba(14,165,233,.22);

  --sa-icon-bg: rgba(15,23,42,.04);
  --sa-icon-ink: rgba(15,23,42,.56);
  --sa-icon-bg-primary: rgba(255,255,255,.18);
  --sa-icon-ink-primary: rgba(255,255,255,.88);
}

.storyAuthorBar{
  position: fixed;
  left: 0;
  right: 0;
  top: calc(var(--header-h) + var(--safe-top));
  z-index: var(--z-stickybar);

  background: var(--sa-bg-solid);
  background: var(--sa-bg);
  backdrop-filter: var(--sa-backdrop);
  -webkit-backdrop-filter: var(--sa-backdrop);

  border-top: 1px solid var(--sa-line-top);
  border-bottom: 1px solid var(--sa-line-bottom);

  box-shadow: 0 10px 24px rgba(2,6,23,.05);
}

.storyAuthorBar__inner{
  max-width: 1140px;
  margin: 0 auto;
  height: var(--sa-h);
  padding:
    calc(var(--sa-pad-y) + var(--sa-pad-top-extra) + 5px)
    var(--sa-pad-x)
    var(--sa-pad-y);

  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sa-gap);
}

.storyAuthorBar__left{
  display: flex;
  align-items: center;
  gap: var(--sa-left-gap);
  min-width: 0;
}

.storyAuthorBar__avatar{
  width: 44px;
  height: 44px;
  border-radius: 999px;
  background: #f1f5f9;
  border: 1px solid rgba(15,23,42,.12);
  overflow: hidden;
  flex: 0 0 auto;
}

.storyAuthorBar__avatar img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.storyAuthorBar__text{
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
}

.storyAuthorBar__name{
  font-size: 15px;
  font-weight: 800;
  color: var(--sa-ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.storyAuthorBar__sub{
  font-size: 13px;
  color: var(--sa-sub);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.storyAuthorBar__actions{
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 0 0 auto;
}

.storyAuthorBar__btn{
  height: var(--sa-btn-h);
  padding: 0 var(--sa-btn-px);
  border-radius: 999px;
  border: 1px solid var(--sa-btn-bd);
  background: var(--sa-btn-bg);
  color: var(--sa-btn-ink);
  font-size: 13px;
  font-weight: 700;

  display: inline-flex;
  align-items: center;
  gap: 8px;

  cursor: pointer;
  transition: background .12s ease, border-color .12s ease, transform .12s ease, filter .12s ease;
}

.storyAuthorBar__btn:active{
  transform: translateY(1px);
}

.storyAuthorBar__btnIcon{
  width: 18px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  font-size: 13px;
  line-height: 1;
  background: var(--sa-icon-bg);
  color: var(--sa-icon-ink);
}

.storyAuthorBar__btnGhost{
  background: var(--sa-ghost-bg);
}

.storyAuthorBar__btnGhost:hover{
  background: var(--sa-ghost-bg-hover);
}

.storyAuthorBar__btnPrimary{
  background: var(--sa-primary-bg);
  border-color: var(--sa-primary-bd);
  color: #ffffff;
}

.storyAuthorBar__btnPrimary:hover{
  background: var(--sa-primary-bg-hover);
  filter: saturate(1.02);
}

.storyAuthorBar__btnPrimary .storyAuthorBar__btnIcon{
  background: var(--sa-icon-bg-primary);
  color: var(--sa-icon-ink-primary);
}

.storyDetailContainer--withStickyBar{
  padding-top: calc(var(--header-h) + var(--safe-top) + var(--sa-h));
}

@media (max-width: 575px){
  :root{
    --header-h: 64px;

    --sa-h: 90px;
    --sa-pad-y: 16px;
    --sa-pad-x: 12px;

    --sa-gap: 14px;
    --sa-left-gap: 12px;

    --sa-btn-h: 38px;
    --sa-btn-px: 12px;
    --sa-pad-top-extra: 4px;
  }

  .storyAuthorBar__inner{
    padding: var(--sa-pad-y) var(--sa-pad-x);
  }

  .storyAuthorBar__btn{
    font-size: 12px;
  }
}

/*!**********************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/stories/detail-header.css ***!
  \**********************************************************************************************************************************************************************************************************************************************************************************************/
.storyHeader{
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 16px 14px;
  border-bottom: 1px solid rgba(15,23,42,.08);
}
.storyTagRow{
  display:flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 8px;
}

.storyTag{
  font-size: 12px;
  font-weight: 700;
  color: rgba(15,23,42,.70);
  background: rgba(15,23,42,.04);
  border: 1px solid rgba(15,23,42,.06);
  padding: 6px 10px;
  border-radius: 999px;
}

.storyTitle{
  margin: 0;
  font-size: 34px;
  line-height: 1.15;
  letter-spacing: -0.02em;
  font-weight: 900;
  color: rgba(15,23,42,.96);
}

.storySubtitle{
  margin: 8px 0 0;
  font-size: 16px;
  line-height: 1.7;
  color: rgba(15,23,42,.70);
  max-width: 68ch;
}

.storyMetaRow{
  margin-top: 10px;
  display:flex;
  align-items:center;
  gap: 10px;
  color: rgba(15,23,42,.58);
  font-size: 13px;
}

.storyShareBar{
  margin-top: 10px;
  display:flex;
  flex-wrap: wrap;
  gap: 8px;
}

.storyShareBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height: 34px;
  min-width: 34px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.92);
  color: rgba(15,23,42,.78);
  text-decoration:none;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}

.storyShareBtn:hover{
  transform: translateY(-1px);
  border-color: rgba(14,165,233,.25);
  box-shadow: 0 10px 20px rgba(2,6,23,.07);
}

.storyShareBtn--copy{
  background: rgba(14,165,233,.06);
  border-color: rgba(14,165,233,.20);
}

.storyMetaDot{
  width: 3px;
  height: 3px;
  border-radius: 999px;
  background: rgba(15,23,42,.28);
  display:inline-block;
}

.storyHero{
  margin: 14px 0 0;
}

.storyHeroImg{
  width: 100%;
  display:block;
  border-radius: 14px;
  object-fit: cover;
  border: 1px solid rgba(15,23,42,.08);
}

@media (max-width: 575px){
  .storyHeader{
    padding: 8px 12px 12px;
  }

  .storyTitle{
    font-size: 26px;
  }

  .storySubtitle{
    font-size: 15px;
  }

  .storyHeroImg{
    border-radius: 12px;
  }
}

/*!********************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/stories/detail-body.css ***!
  \********************************************************************************************************************************************************************************************************************************************************************************************/
:root{
  --sb-ink: rgba(15,23,42,.92);
  --sb-sub: rgba(15,23,42,.74);
  --sb-muted: rgba(15,23,42,.56);
  --sb-line: rgba(15,23,42,.10);
  --sb-soft: rgba(15,23,42,.04);
  --sb-accent: #0ea5e9;
}

.storyBody{
  max-width: 1140px;     /* ✅ header/author와 동일 */
  margin: 14px auto 0;
  padding: 0 16px;      /* ✅ 동일한 좌우 패딩 */

  color: var(--sb-sub);
  font-size: 15px;
  line-height: 1.9;
}

/* ===== translate toggle ===== */
.storyTranslateBar{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid var(--sb-line);
  background: var(--sb-soft);
  margin: 14px 0 10px;
}

.storyTranslateBtn{
  -webkit-appearance:none;
     -moz-appearance:none;
          appearance:none;
  border: 1px solid rgba(15,23,42,.12);
  background: #fff;
  border-radius: 999px;
  padding: 8px 12px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: -0.02em;
  cursor: pointer;
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}

.storyTranslateBtn:hover{
  transform: translateY(-1px);
  border-color: rgba(14,165,233,.28);
  box-shadow: 0 10px 18px rgba(2,6,23,.08);
}

.storyTranslateBtn:disabled{
  opacity: .65;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}

.storyTranslateHint{
  font-size: 12px;
  color: var(--sb-muted);
  font-weight: 700;
}

.storyEmpty{
  margin: 0;
  color: var(--sb-muted);
  font-weight: 700;
  font-size: 13px;
}

.storyP{
  margin: 0;
  color: var(--sb-sub);
}

.storyP + .storyP{
  margin-top: 14px;
}

.storyH2{
  margin: 22px 0 10px;
  font-size: 18px;
  font-weight: 900;
  letter-spacing: -0.02em;
  color: var(--sb-ink);
}

.storyUl{
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.storyLi{
  position: relative;
  padding-left: 16px;
  color: var(--sb-sub);
}

.storyLi::before{
  content:"";
  position: absolute;
  left: 0;
  top: .78em;
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: rgba(14,165,233,.55);
  box-shadow: 0 0 0 3px rgba(14,165,233,.12);
}

.storyQuote{
  margin: 18px 0 0;
  padding-left: 14px;
  border-left: 3px solid rgba(14,165,233,.35);
}

.storyQuoteText{
  margin: 0;
  color: var(--sb-ink);
  font-weight: 750;
}

.storyQuoteCite{
  margin-top: 8px;
  font-size: 13px;
  color: var(--sb-muted);
}

.storyImage{
  margin: 18px 0 0;
}

.storyImageImg{
  width: 100%;
  display: block;
  border-radius: 14px;
  border: 1px solid rgba(15,23,42,.08);
  object-fit: cover;
}

.storyImageCap{
  margin-top: 8px;
  font-size: 13px;
  color: var(--sb-muted);
}

@media (max-width: 575px){
  .storyBody{
    margin-top: 12px;
    padding: 0 12px;
    font-size: 14px;
    line-height: 1.85;
  }

  .storyH2{
    font-size: 16px;
    margin: 20px 0 10px;
  }

  .storyImageImg{
    border-radius: 12px;
  }
}


.storyLink{
  color: var(--sb-accent);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.storyLink:hover{
  opacity: .85;
}

/* ===== video embed (YouTube) ===== */
.storyVideo{
  margin: 18px 0 0;
  border-radius: 14px;
  border: 1px solid rgba(15,23,42,.08);
  overflow: hidden;
  background: #000;
}
.storyVideoRatio{
  position: relative;
  width: 100%;
  padding-top: 56.25%; /* 16:9 */
}
.storyVideoFrame{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}
.storyLiVideo{
  padding-left: 0;
}
.storyLiVideo::before{
  display: none;
}

@media (max-width: 575px){
  .storyVideo{
    border-radius: 12px;
  }
}

/*!*******************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/stories/detail-cta.css ***!
  \*******************************************************************************************************************************************************************************************************************************************************************************************/
:root{
  --sc-ink: rgba(15,23,42,.92);
  --sc-sub: rgba(15,23,42,.72);
  --sc-muted: rgba(15,23,42,.55);

  --sc-line: rgba(15,23,42,.10);
  --sc-soft: rgba(15,23,42,.04);

  --sc-surface: #ffffff;
  --sc-wrap: rgba(15,23,42,.03);

  --sc-r: 18px;
  --sc-card-r: 16px;

  --sc-shadow: 0 14px 36px rgba(2,6,23,.10), 0 3px 10px rgba(2,6,23,.06);
  --sc-shadow-soft: 0 10px 26px rgba(2,6,23,.08), 0 2px 8px rgba(2,6,23,.06);

  --sc-accent: #0ea5e9;
}

.storyCta{
  max-width: 1140px;
  margin: 22px auto 0;
  padding: 0 16px 64px;
}

.storyCta__inner{
  border-radius: var(--sc-r);
  border: 1px solid rgba(15,23,42,.10);
  background: var(--sc-wrap);
  padding: 34px 26px 26px;
}

.storyCtaHead{
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 22px;
}

.storyCtaTitle{
  margin: 0;
  font-size: 34px;
  line-height: 1.15;
  letter-spacing: -0.02em;
  font-weight: 950;
  color: var(--sc-ink);
}

.storyCtaSubtitle{
  margin: 0 auto;
  max-width: 72ch;
  font-size: 16px;
  line-height: 1.7;
  color: var(--sc-sub);
}

.storyCtaSubtitleStrong{
  font-weight: 950;
  color: var(--sc-ink);
  text-decoration: none;
}

.storyCtaGrid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 18px;
  gap: 18px;
}

.storyCtaCard{
  background: var(--sc-surface);
  border: 1px solid rgba(15,23,42,.10);
  border-radius: var(--sc-card-r);
  padding: 18px;
  box-shadow: var(--sc-shadow-soft);
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.storyCtaCardTop{
  display: grid;
  grid-template-columns: 52px 1fr;
  grid-gap: 14px;
  gap: 14px;
  align-items: start;
}

.storyCtaIcon{
  width: 52px;
  height: 52px;
  border-radius: 999px;
  background: rgba(15,23,42,.04);
  border: 1px solid rgba(15,23,42,.08);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.70);
}

.storyCtaIconText{
  font-size: 18px;
  font-weight: 950;
  color: rgba(15,23,42,.72);
  letter-spacing: -0.02em;
}

.storyCtaCardTopText{
  min-width: 0;
}

.storyCtaCardTitle{
  margin: 0;
  font-size: 16px;
  line-height: 1.35;
  font-weight: 950;
  letter-spacing: -0.02em;
  color: var(--sc-ink);
}

.storyCtaCardDesc{
  margin: 8px 0 0;
  font-size: 14px;
  line-height: 1.65;
  color: var(--sc-sub);
}

.storyCtaPriceRow{
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-top: 2px;
}

.storyCtaPrice{
  font-size: 28px;
  font-weight: 950;
  letter-spacing: -0.02em;
  color: var(--sc-ink);
}

.storyCtaDuration{
  font-size: 14px;
  color: var(--sc-muted);
  font-weight: 800;
}

.storyCtaPrimaryBtn{
  margin-top: 6px;
  height: 46px;
  width: 100%;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;

  font-size: 14px;
  font-weight: 950;
  letter-spacing: -0.01em;

  color: #fff;
  background: rgba(15,23,42,.88);
  box-shadow: 0 14px 30px rgba(2,6,23,.14), inset 0 1px 0 rgba(255,255,255,.18);
  transition: transform .12s ease, filter .12s ease;
}

.storyCtaPrimaryBtn:hover{
  filter: saturate(1.02);
}

.storyCtaPrimaryBtn:active{
  transform: translateY(1px);
}

.storyCtaFooter{
  margin-top: 18px;
  text-align: center;
}

.storyCtaFooterLink{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  font-weight: 950;
  color: var(--sc-ink);
  text-decoration: none;
}

.storyCtaFooterLink:hover{
  text-decoration: underline;
}

.storyCtaArrow{
  font-size: 16px;
  line-height: 1;
  opacity: .85;
}

@media (max-width: 575px){
  .storyCta{
    padding: 0 12px 56px;
  }

  .storyCta__inner{
    padding: 26px 16px 18px;
  }

  .storyCtaTitle{
    font-size: 26px;
  }

  .storyCtaSubtitle{
    font-size: 15px;
  }

  .storyCtaGrid{
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .storyCtaPrice{
    font-size: 26px;
  }
}

/*!***************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/stories/detail.css ***!
  \***************************************************************************************************************************************************************************************************************************************************************************************/
/* src/app/styles/stories/detail.css */
/*!************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/pages/about.css ***!
  \************************************************************************************************************************************************************************************************************************************************************************************/
/* =========================================
   About Page (Friday)
========================================= */

/* -------- Hero -------- */
.aboutHero {
  position: relative;
}

.aboutHeroMedia {
  width: 100%;
  height: 360px;
  object-fit: cover;
  object-position: center;
  display: block;
}

.aboutHeroOverlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(0,0,0,0.58) 0%,
    rgba(0,0,0,0.32) 55%,
    rgba(0,0,0,0.28) 100%
  );
}

.aboutHeroInner {
  min-height: 360px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.aboutHeroLead {
  opacity: 0.92;
  line-height: 1.7;
}

/* -------- buttons -------- */
.aboutBtnRow {
  display: flex;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 22px;
}

.aboutBtnRow .button,
.aboutActionGroup .button {
  border-radius: 14px;
  height: 48px;
  padding-left: 18px;
  padding-right: 18px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

/* -------- section heading spacing -------- */
.aboutSectionHead {
  margin-bottom: 56px; /* 고급스럽게 여백 조금 더 */
}

/* -------- cards (Why / Steps) -------- */
.aboutCard {
  background: #fff;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 16px;
  box-shadow: 0 10px 28px rgba(0,0,0,0.06);
  padding: 26px;
  height: 100%;
  transition: transform .18s ease, box-shadow .18s ease;
}

.aboutCard:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 40px rgba(0,0,0,0.10);
}

.aboutCardHead {
  display: flex;
  align-items: center;
  gap: 12px;
}

.aboutIconBox {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;

  background: rgba(34,197,255,0.10);
  border: 1px solid rgba(34,197,255,0.20);
  color: rgb(34,197,255); /* 아이콘 color는 currentColor로 */
}

.aboutCardText {
  margin-top: 12px;
  line-height: 1.7;
}

.aboutLearnMore {
  margin-top: 18px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

/* steps */
.aboutStepTop {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.aboutStepNum {
  font-size: 32px;
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -0.02em;
}

.aboutStepTitle {
  font-size: 18px;
  font-weight: 650;
  margin-top: 12px;
  margin-bottom: 0;
}

/* -------- About split (text + image) -------- */
.aboutSplit {
  align-items: stretch;
}

.aboutTextWrap {
  padding-right: 18px;
}

.aboutCopy {
  line-height: 1.75;
  max-width: 560px;
}

.aboutCopy + .aboutCopy {
  margin-top: 12px;
}

.aboutSubBlock {
  margin-top: 28px;
}

.aboutActionGroup {
  margin-top: 34px;
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

/* image frame */
.aboutImageFrame {
  width: 100%;
  height: 100%;
  min-height: 520px;
  overflow: hidden;
  border-radius: 16px;
  border: 1px solid rgba(0,0,0,0.08);
  box-shadow: 0 12px 30px rgba(0,0,0,0.08);
}

.aboutImageFrame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

/* -------- stats -------- */
.aboutStatNum {
  font-size: 40px;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.1;
}

.aboutStatLabel {
  font-size: 14px;
  margin-top: 6px;
}
.aboutStepDesc{ line-height: 1.7; }
.aboutBtnRowTight{ margin-top: 0; }

/* -------- responsive -------- */
@media (max-width: 991px) {
  .aboutHeroMedia,
  .aboutHeroInner {
    height: 320px;
    min-height: 320px;
  }
  .aboutTextWrap {
    padding-right: 0;
  }
}

@media (max-width: 575px) {
  .aboutHeroMedia,
  .aboutHeroInner {
    height: 280px;
    min-height: 280px;
  }
  .aboutCard {
    padding: 22px;
  }
}

/*!*************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/customs.css ***!
  \*************************************************************************************************************************************************************************************************************************************************************************/
/* --- Global Language Switcher --- */
.lang-switch{display:flex;align-items:center;gap:8px}
.lang-switch__item{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:30px;padding:0 10px;border:1px solid rgba(0,0,0,.08);border-radius:999px;font-size:12px;letter-spacing:.06em;transition:all .15s ease;background:#fff;color:#0b0b0b}
.lang-switch__item:hover{border-color:rgba(0,0,0,.18);transform:translateY(-1px)}
.lang-switch__item.is-active{border-color:rgba(0,0,0,.35);background:rgba(0,0,0,.04);font-weight:600}
.lang-switch--compact .lang-switch__item{min-width:32px;height:28px;padding:0 9px;font-size:11px}
@media (max-width: 991px){.lang-switch{gap:6px}}

/*!********************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/safepay-tweaks.css ***!
  \********************************************************************************************************************************************************************************************************************************************************************************/
/* ================================================================
   safepay-tweaks.css — v7 드롭다운 완전 재설계 (2026-03-28)
   핵심 변경: CSS hover 완전 제거, React 조건부 렌더링으로만 메뉴 표시
   ================================================================ */

/* ── Header Shell sticky ─────────────────────────────────────────── */
.sp-header-shell {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 1000;
  background: #fff;
  box-shadow: 0 1px 0 rgba(15,23,42,0.07);
}
body.safepay .header { position: relative !important; top: auto !important; z-index: auto !important; box-shadow: none !important; }
body.safepay main   { padding-top: 0 !important; }
.header-margin       { display: none !important; }

/* ── Notice Bar ──────────────────────────────────────────────────── */
.sp-noticebar { background: #fff; border-bottom: 1px solid rgba(15,23,42,0.07); padding: 8px 0; font-size: var(--fs-caption); }
.sp-noticebar__inner { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.sp-noticebar__left  { display: flex; align-items: center; gap: 10px; min-width: 0; flex: 1 1; overflow: hidden; }
.sp-noticebar__right { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.sp-noticebar__badge { flex-shrink:0; display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:999px; background:rgba(37,99,235,0.12); color:#2563eb; font-size:var(--fs-xs); font-weight:800; }
.sp-noticebar__text  { display:flex; align-items:baseline; gap:8px; overflow:hidden; }
.sp-noticebar__title { font-weight:700; color:#0f172a; white-space:nowrap; }
.sp-noticebar__body  { color:rgba(15,23,42,0.6); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sp-noticebar__cta   { flex-shrink:0; font-weight:700; color:#2563eb; text-decoration:none; white-space:nowrap; }
.sp-noticebar__cta:hover { text-decoration:underline; }
/* 가격 제안 순환 dots */
.sp-noticebar__dots  { display:flex; align-items:center; gap:4px; }
.sp-noticebar__dot   { width:6px; height:6px; border-radius:50%; background:rgba(37,99,235,0.2); border:none; padding:0; cursor:pointer; transition:background 0.2s; }
.sp-noticebar__dot.is-active { background:#2563eb; }
/* fade 애니메이션 */
@keyframes sp-notice-fade { from { opacity:0; transform:translateY(4px); } to { opacity:1; transform:translateY(0); } }
@media(max-width:640px){ .sp-noticebar__body{display:none;} .sp-noticebar__dots{display:none;} }

/* ── 헤더 우측 액션 ──────────────────────────────────────────────── */
.sp-hdr-actions { display:flex; align-items:center; gap:8px; }

/* ── 헤더 버튼 ───────────────────────────────────────────────────── */
.sp-hdr-btn {
  display:inline-flex; align-items:center; justify-content:center;
  height:40px; padding:0 16px; border-radius:10px;
  font-size:var(--fs-caption); font-weight:700; white-space:nowrap;
  text-decoration:none; cursor:pointer;
  border:1.5px solid transparent; transition:all 0.15s;
}
.sp-hdr-btn--fill    { background:#2563eb; color:#fff; border-color:#2563eb; }
.sp-hdr-btn--fill:hover { background:#1d4ed8; border-color:#1d4ed8; color:#fff; }
.sp-hdr-btn--outline { background:transparent; color:#2563eb; border-color:#2563eb; }
.sp-hdr-btn--outline:hover { background:#eff6ff; }

/* ── 드롭다운 그룹 ───────────────────────────────────────────────── */
.sp-dd-grp  { display:flex; align-items:center; gap:6px; margin-left:4px; }

/* ── 드롭다운 래퍼 — position:relative 기준점 ───────────────────── */
.sp-dd-wrap { position:relative; display:inline-flex; }

/* ── 드롭다운 버튼 ───────────────────────────────────────────────── */
.sp-dd-btn {
  position:relative; display:inline-flex; align-items:center;
  justify-content:center; gap:6px;
  height:40px; padding:0 11px; border-radius:10px;
  background:rgba(15,23,42,0.04); border:1px solid rgba(15,23,42,0.07);
  color:#334155; cursor:pointer; font-size:var(--fs-caption); font-weight:600;
  white-space:nowrap; transition:background 0.15s, border-color 0.15s;
  -webkit-user-select:none;
     -moz-user-select:none;
          user-select:none;
}
.sp-dd-btn:hover    { background:rgba(15,23,42,0.07); }
.sp-dd-btn.is-active { background:#eff6ff; border-color:#bfdbfe; color:#2563eb; }

.sp-dd-btn--lang  { padding:0 10px; }
.sp-dd-btn--icon  { width:40px; padding:0; }
.sp-dd-btn--acct  { padding:0 12px; }

.sp-dd-label   { font-size:var(--fs-sm); font-weight:700; }
.sp-dd-chevron { font-size:var(--fs-md); line-height:1; transform:rotate(90deg); display:inline-block; transition:transform 0.15s; opacity:0.6; }
.sp-dd-chevron.is-up { transform:rotate(-90deg); }

/* ── 알림 뱃지 ───────────────────────────────────────────────────── */
.sp-badge {
  position:absolute; top:-6px; right:-6px;
  min-width:18px; height:18px; padding:0 5px; border-radius:999px;
  background:#2563eb; color:#fff; font-size:var(--fs-xs); font-weight:800;
  display:inline-flex; align-items:center; justify-content:center;
  box-shadow:0 4px 10px rgba(37,99,235,0.3);
}

/* ── 드롭다운 메뉴 — React 조건부 렌더링으로만 표시 ─────────────── */
/*  CSS hover 트리거 완전 없음 — active 상태는 JS만 관리            */
.sp-dd-menu {
  position:absolute;
  top:calc(100% + 8px);   /* 버튼 아래 8px */
  right:0;
  background:#fff;
  border:1px solid rgba(15,23,42,0.10);
  border-radius:16px;
  box-shadow:0 20px 60px rgba(2,6,23,0.16);
  padding:8px;
  z-index:9999;
  min-width:160px;
  /* 진입 애니메이션 */
  animation: spDropIn 0.13s ease-out;
}
@keyframes spDropIn {
  from { opacity:0; transform:translateY(-6px); }
  to   { opacity:1; transform:translateY(0); }
}

.sp-dd-menu--sm   { min-width:150px; }
.sp-dd-menu--wide { width:300px; max-width:calc(100vw - 32px); padding:10px; }

/* ── 드롭다운 메뉴 내부 요소 ─────────────────────────────────────── */
.sp-dd-title {
  font-size:var(--fs-xs); font-weight:800; letter-spacing:0.08em;
  text-transform:uppercase; color:rgba(15,23,42,0.45);
  padding:4px 8px 10px;
}
.sp-dd-item {
  display:block; border-radius:10px; padding:10px;
  background:rgba(15,23,42,0.03); border:1px solid rgba(15,23,42,0.06);
  margin-bottom:8px; text-decoration:none; cursor:pointer;
  transition:background 0.1s;
}
.sp-dd-item:hover { background:rgba(15,23,42,0.06); }
.sp-dd-item-title { font-size:var(--fs-caption); font-weight:800; color:#0f172a; }
.sp-dd-item-sub   { font-size:var(--fs-sm); color:rgba(15,23,42,0.65); margin-top:3px; }

.sp-dd-footer { display:flex; justify-content:flex-end; padding-top:2px; }
.sp-dd-link   { font-size:var(--fs-caption); font-weight:800; color:#2563eb; text-decoration:none; }

.sp-dd-nav {
  display:flex; width:100%; padding:10px; border-radius:10px;
  font-weight:700; font-size:var(--fs-caption); color:#0f172a; text-decoration:none;
  transition:background 0.1s;
}
.sp-dd-nav:hover         { background:rgba(15,23,42,0.05); }
.sp-dd-nav--danger       { color:#dc2626; }
.sp-dd-divider           { height:1px; background:rgba(15,23,42,0.08); margin:6px 2px; }

/* 언어 옵션 */
.sp-dd-opt {
  display:flex; align-items:center; justify-content:space-between;
  width:100%; padding:9px 12px; border:none; border-radius:8px;
  background:transparent; cursor:pointer; font-size:var(--fs-caption); font-weight:500;
  color:#334155; text-align:left; transition:background 0.1s;
}
.sp-dd-opt:hover     { background:#f1f5f9; }
.sp-dd-opt.is-active { color:#2563eb; font-weight:700; }

/* ── safepay.css CSS hover 트리거 완전 무력화 ────────────────────── */
/* (이전 버전과의 충돌 방지용 방어 코드 — 실제 메뉴는 React 렌더링) */
.sp-dd:hover .sp-dd__menu,
.sp-dd:focus-within .sp-dd__menu,
body.safepay .sp-dd:hover .sp-dd__menu,
body.safepay .sp-dd:focus-within .sp-dd__menu {
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
}

/* ── 브랜드 ──────────────────────────────────────────────────────── */
.sp-brand { display:flex; align-items:center; gap:9px; text-decoration:none; }
.sp-brand__text   { display:flex; flex-direction:column; gap:1px; }
.sp-brand__top    { font-size:var(--fs-base); font-weight:800; color:#0f172a; line-height:1; }
.sp-brand__bottom { display:flex; align-items:center; gap:5px; }
.sp-brand__sub    { font-size:var(--fs-sm); font-weight:700; color:#2563eb; }
.sp-brand__tag    { font-size:var(--fs-xs); color:rgba(15,23,42,0.4); font-weight:500; }

/* ── Friday 링크 ─────────────────────────────────────────────────── */
.sp-friday-link { display:inline-flex; align-items:center; gap:6px; font-size:var(--fs-caption); font-weight:700; color:#334155; text-decoration:none; opacity:0.75; white-space:nowrap; transition:opacity 0.15s; }
.sp-friday-link:hover { opacity:1; }
.sp-friday-link--mobile { font-size:var(--fs-base); }

/* ── 모바일 ──────────────────────────────────────────────────────── */
.sp-mobile-cta-col { display:flex; flex-direction:column; gap:8px; }

/* ================================================================
   Deal Review 페이지 스타일
   ================================================================ */
.sp-deal-list { display:flex; flex-direction:column; gap:24px; }

.sp-deal-card {
  background:#fff;
  border:1px solid rgba(15,23,42,0.09);
  border-radius:20px;
  padding:28px;
  box-shadow:0 4px 20px rgba(2,6,23,0.06);
}
.sp-deal-card--done { opacity:0.72; }

/* ── Head ── */
.sp-deal-head {
  display:flex; align-items:flex-start; gap:14px; margin-bottom:20px;
}
.sp-deal-avatar {
  width:44px; height:44px; border-radius:12px;
  background:linear-gradient(135deg,#2563eb,#7c3aed);
  color:#fff; font-size:var(--fs-lg); font-weight:800;
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.sp-deal-meta    { flex:1 1; min-width:0; }
.sp-deal-provider { font-size:var(--fs-body); font-weight:800; color:#0f172a; }
.sp-deal-service  { font-size:var(--fs-caption); color:#334155; margin-top:2px; }
.sp-deal-time     { font-size:var(--fs-sm); color:rgba(15,23,42,0.45); margin-top:4px; }

.sp-deal-badge {
  flex-shrink:0; padding:4px 12px; border-radius:999px;
  font-size:var(--fs-sm); font-weight:700;
}
.sp-deal-badge--accepted { background:#d1fae5; color:#065f46; }
.sp-deal-badge--rejected { background:#fee2e2; color:#991b1b; }

/* ── 금액 비교 ── */
.sp-deal-pricing {
  background:rgba(37,99,235,0.04);
  border:1px solid rgba(37,99,235,0.10);
  border-radius:14px;
  padding:16px 20px;
  margin-bottom:18px;
}
.sp-deal-price-row {
  display:flex; align-items:center; gap:16px; flex-wrap:wrap;
}
.sp-deal-price-item  { display:flex; flex-direction:column; gap:2px; }
.sp-deal-price-label { font-size:var(--fs-xs); color:rgba(15,23,42,0.5); font-weight:600; text-transform:uppercase; letter-spacing:0.05em; }
.sp-deal-price-val   { font-size:var(--fs-xl); font-weight:800; }
.sp-deal-price-val--old { text-decoration:line-through; color:rgba(15,23,42,0.35); font-size:var(--fs-md); }
.sp-deal-price-val--new { color:#059669; }
.sp-deal-arrow { font-size:var(--fs-lg); color:rgba(15,23,42,0.25); }
.sp-deal-saving {
  margin-left:auto;
  background:#d1fae5; color:#065f46;
  font-size:var(--fs-sm); font-weight:700;
  padding:4px 12px; border-radius:999px;
}

/* ── 메시지 ── */
.sp-deal-msg { margin-bottom:16px; }
.sp-deal-msg-label { font-size:var(--fs-xs); font-weight:700; color:rgba(15,23,42,0.4); text-transform:uppercase; letter-spacing:0.05em; margin-bottom:6px; }
.sp-deal-msg-body  { font-size:var(--fs-base); color:#334155; line-height:1.65; margin:0; }

/* ── 마일스톤 ── */
.sp-deal-ms-toggle {
  background:none; border:none; cursor:pointer;
  font-size:var(--fs-caption); font-weight:700; color:#2563eb; padding:0; margin-bottom:12px;
}
.sp-deal-ms-list { display:flex; flex-direction:column; gap:8px; margin-bottom:16px; }
.sp-deal-ms-row  { display:flex; align-items:center; gap:12px; font-size:var(--fs-caption); }
.sp-deal-ms-num  {
  width:22px; height:22px; border-radius:6px;
  background:#eff6ff; color:#2563eb;
  font-weight:800; font-size:var(--fs-xs);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.sp-deal-ms-label { flex:1 1; color:#334155; }
.sp-deal-ms-pct   { color:#059669; font-weight:700; white-space:nowrap; }

/* ── 액션 버튼 ── */
.sp-deal-actions {
  display:flex; gap:8px; flex-wrap:wrap;
  margin-top:20px; padding-top:20px;
  border-top:1px solid rgba(15,23,42,0.07);
}
.sp-deal-btn {
  display:inline-flex; align-items:center; justify-content:center;
  height:44px; padding:0 20px; border-radius:10px;
  font-size:var(--fs-base); font-weight:700; cursor:pointer;
  border:1.5px solid transparent; transition:all 0.15s; white-space:nowrap;
}
.sp-deal-btn--reject  { background:transparent; border-color:#e2e8f0; color:#64748b; }
.sp-deal-btn--reject:hover  { background:#f8fafc; border-color:#cbd5e1; }
.sp-deal-btn--counter { background:transparent; border-color:#2563eb; color:#2563eb; }
.sp-deal-btn--counter:hover { background:#eff6ff; }
.sp-deal-btn--accept  { background:#059669; color:#fff; border-color:#059669; flex:1 1; }
.sp-deal-btn--accept:hover  { background:#047857; }

/* ── 수락/거절 후 ── */
.sp-deal-after {
  margin-top:18px; padding-top:18px;
  border-top:1px solid rgba(15,23,42,0.07);
}
.sp-deal-after--rejected { opacity:0.75; }
.sp-deal-after-msg { font-size:var(--fs-base); color:#334155; margin:0 0 12px; }

/* ── 빈 상태 ── */
.sp-empty-state { text-align:center; padding:60px 20px; }
.sp-empty-icon  { font-size:48px; margin-bottom:16px; }
.sp-empty-title { font-size:var(--fs-xl); font-weight:800; color:#0f172a; }
.sp-empty-sub   { font-size:var(--fs-base); color:rgba(15,23,42,0.5); margin-top:8px; }

/* ═══════════════════════════════════════════════════════════════════════
   Mobile responsive fixes
   ═══════════════════════════════════════════════════════════════════════ */

/* Header mobile: stack actions, hide non-essential */
@media (max-width: 768px) {
  .sp-hdr-actions { gap: 4px; }
  .sp-hdr-btn { height: 36px; padding: 0 10px; font-size: var(--fs-sm); border-radius: 8px; }
  .sp-dd-btn { height: 36px; padding: 0 8px; font-size: var(--fs-sm); }
  .sp-dd-btn--acct { padding: 0 8px; }
  .sp-dd-label { display: none; }
  .sp-friday-link { display: none !important; }
  .sp-brand__sub { display: none; }
  .sp-brand__tag { display: none; }
  .sp-dd-menu { min-width: 200px; right: -8px; }
}

/* Checkout page mobile: single column */
@media (max-width: 900px) {
  body.safepay .sp-checkout-grid,
  body.safepay .sp-page--checkout .row {
    display: flex !important;
    flex-direction: column !important;
  }
  body.safepay .sp-checkout-grid > *,
  body.safepay .sp-page--checkout .row > [class*="col-"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
  }
  body.safepay .sp-checkout-sidebar {
    order: -1;
    margin-bottom: 16px;
  }
}

/* Deal cards mobile: full width */
@media (max-width: 640px) {
  .sp-deal-grid {
    grid-template-columns: 1fr !important;
  }
  .sp-deal-card {
    border-radius: 14px;
  }
  .sp-deal-price-val { font-size: var(--fs-lg) !important; }
  .sp-step-row { flex-direction: column !important; gap: 12px !important; }
  .sp-step-card { width: 100% !important; }

  /* Form inputs full width */
  body.safepay input[type="text"],
  body.safepay input[type="number"],
  body.safepay input[type="email"],
  body.safepay select,
  body.safepay textarea {
    width: 100% !important;
    min-width: 0 !important;
  }

  /* Buttons: full width on mobile */
  body.safepay .sp-page--create .sp-hdr-btn,
  body.safepay .sp-page--checkout .sp-hdr-btn {
    width: 100%;
    justify-content: center;
  }

  /* Milestone tracker compact */
  .sp-ms-row { padding: 10px 12px !important; }
  .sp-ms-num { font-size: var(--fs-xs) !important; }
}

/* Small phones */
@media (max-width: 380px) {
  .sp-noticebar { padding: 6px 0; }
  .sp-noticebar__badge { display: none; }
  .sp-hdr-btn--fill span,
  .sp-hdr-btn--outline span { font-size: var(--fs-xs); }
  .sp-dd-btn--icon { width: 34px; height: 34px; }
}

/*!***************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/safepay-create-escrow.css ***!
  \***************************************************************************************************************************************************************************************************************************************************************************************/
/* ============================================================
   SafePay Create Escrow — Page CSS
   Appended to safepay-premium.css or imported standalone
   ============================================================ */


/* ── Input visibility global override ── */
.sp-form-input,
.sp-form-select,
.sp-form-textarea {
  background: #ffffff !important;
  border-color: #94a3b8 !important;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
}
.sp-form-input::placeholder,
.sp-form-textarea::placeholder {
  color: #94a3b8 !important;
}
.sp-form-input:focus,
.sp-form-select:focus,
.sp-form-textarea:focus {
  border-color: #2563eb !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12) !important;
}
.sp-form-input.is-error {
  border-color: #dc2626 !important;
}

/* ── Layout ── */
/* ── Create Escrow hero strip ── */
.sp-ce-hero {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  border-bottom: 1px solid rgba(255,255,255,.06);
  padding: 36px 0 32px;
  /* Remove the gap left by header-margin */
  margin-top: -90px;
  padding-top: calc(90px + 36px);
}
@media (max-width: 767px) {
  .sp-ce-hero { margin-top: -80px; padding-top: calc(80px + 28px); }
}
.sp-ce-hero-inner {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
}
.sp-ce-breadcrumb {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: var(--fs-sm);
  font-weight: 600;
  color: rgba(255,255,255,.50);
  text-decoration: none;
  margin-bottom: 10px;
  transition: color .14s;
}
.sp-ce-breadcrumb:hover { color: rgba(255,255,255,.80); }
.sp-ce-title {
  font-size: var(--fs-4xl);
  font-weight: 800;
  letter-spacing: -0.03em;
  color: #ffffff;
  margin: 0 0 8px;
  line-height: 1.1;
}
.sp-ce-sub {
  font-size: var(--fs-base);
  color: rgba(255,255,255,.55);
  margin: 0;
  letter-spacing: .01em;
}
.sp-ce-hero-badges {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  padding-bottom: 4px;
}
.sp-ce-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 28px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
  font-size: var(--fs-sm);
  font-weight: 600;
  color: rgba(255,255,255,.75);
  white-space: nowrap;
}
.sp-ce-badge-dot {
  width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0;
}
.sp-ce-badge-dot--green  { background: #10b981; box-shadow: 0 0 0 2px rgba(16,185,129,.25); }
.sp-ce-badge-dot--blue   { background: #3b82f6; box-shadow: 0 0 0 2px rgba(59,130,246,.25); }
.sp-ce-badge-dot--purple { background: #8b5cf6; box-shadow: 0 0 0 2px rgba(139,92,246,.25); }

@media (max-width: 767px) {
  .sp-ce-hero { padding: 28px 0 24px; }
  .sp-ce-title { font-size: var(--fs-2xl); }
  .sp-ce-hero-inner { flex-direction: column; align-items: flex-start; gap: 16px; }
}

/* ── Create body layout ── */
.sp-create-body {
  display: grid;
  grid-template-columns: 1fr 300px;
  grid-gap: 28px;
  gap: 28px;
  align-items: start;
  padding-top: 28px;
  padding-bottom: 80px;
}
@media (max-width: 900px) {
  .sp-create-body { grid-template-columns: 1fr; }
}

/* ── Main Card ── */
.sp-create-card {
  background: #ffffff;
  border-radius: 20px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 8px 32px rgba(2, 6, 23, 0.07);
  overflow: hidden;
}
.sp-card-body {
  padding: 24px 28px 28px;
}
@media (max-width: 600px) {
  .sp-card-body { padding: 18px 16px 22px; }
}

/* ── Step Bar ── */
.sp-stepbar {
  display: flex;
  align-items: center;
  padding: 22px 28px 0;
  gap: 0;
  border-bottom: 1px solid rgba(15,23,42,.06);
  padding-bottom: 18px;
  margin-bottom: 0;
}
.sp-stepbar-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: var(--fs-caption);
  font-weight: 600;
  color: #94a3b8;
  position: relative;
}
.sp-stepbar-item.is-active { color: #2563eb; }
.sp-stepbar-item.is-done { color: #059669; }

.sp-stepbar-dot {
  width: 26px;
  height: 26px;
  border-radius: 999px;
  border: 2px solid #e2e8f0;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--fs-xs);
  font-weight: 800;
  flex-shrink: 0;
  transition: all .2s ease;
}
.sp-stepbar-item.is-active .sp-stepbar-dot {
  border-color: #2563eb;
  background: #2563eb;
  color: #fff;
}
.sp-stepbar-item.is-done .sp-stepbar-dot {
  border-color: #059669;
  background: #059669;
  color: #fff;
}
.sp-stepbar-line {
  width: 32px;
  height: 2px;
  background: #e2e8f0;
  margin: 0 4px;
}
.sp-stepbar-item.is-done + .sp-stepbar-item .sp-stepbar-line,
.sp-stepbar-item.is-done .sp-stepbar-line { background: #059669; }

/* ── Form fields ── */
.sp-form-section { display: flex; flex-direction: column; gap: 18px; }

.sp-field { display: flex; flex-direction: column; gap: 6px; }
.sp-field--grow { flex: 1 1; min-width: 0; }
.sp-field--currency { width: 120px; flex-shrink: 0; }

.sp-field-label {
  font-size: var(--fs-caption);
  font-weight: 700;
  color: #0f172a;
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: default;
}
.sp-field-opt {
  font-size: var(--fs-xs);
  font-weight: 600;
  color: #94a3b8;
  background: #f1f5f9;
  padding: 2px 6px;
  border-radius: 4px;
}
.sp-field-hint {
  font-size: var(--fs-sm);
  color: #94a3b8;
  line-height: 1.5;
}
.sp-field-hint code {
  font-family: ui-monospace, monospace;
  font-size: var(--fs-xs);
  background: #f1f5f9;
  padding: 1px 5px;
  border-radius: 4px;
  color: #475569;
}
.sp-field-error { font-size: var(--fs-sm); color: #dc2626; }

.sp-form-row { display: flex; gap: 16px; }
@media (max-width: 600px) { .sp-form-row { flex-direction: column; } }

.sp-form-input {
  width: 100%;
  height: 42px;
  padding: 0 13px;
  border: 1.5px solid #cbd5e1;
  border-radius: 10px;
  font-size: var(--fs-base);
  color: #0f172a;
  background: #ffffff;
  outline: none;
  transition: border-color .15s, box-shadow .15s;
  font-family: inherit;
}
.sp-form-input:focus {
  border-color: #2563eb;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.10);
}
.sp-form-input.is-error { border-color: #dc2626; }
.sp-form-input::placeholder { color: #94a3b8; }

.sp-form-select {
  width: 100%;
  height: 42px;
  padding: 0 13px;
  border: 1.5px solid #cbd5e1;
  border-radius: 10px;
  font-size: var(--fs-base);
  color: #0f172a;
  background: #ffffff;
  outline: none;
  cursor: pointer;
  font-family: inherit;
}
.sp-form-select:focus {
  border-color: #2563eb;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.10);
}

.sp-form-textarea {
  width: 100%;
  padding: 10px 13px;
  border: 1.5px solid #cbd5e1;
  border-radius: 10px;
  font-size: var(--fs-base);
  color: #0f172a;
  background: #ffffff;
  outline: none;
  resize: vertical;
  font-family: inherit;
  line-height: 1.6;
}
.sp-form-textarea:focus {
  border-color: #2563eb;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.10);
}

.sp-input-addon {
  position: relative;
  display: flex;
  align-items: center;
}
.sp-input-addon .sp-form-input { padding-right: 42px; }
.sp-regen-btn {
  position: absolute;
  right: 8px;
  width: 28px;
  height: 28px;
  border: 0;
  background: rgba(37, 99, 235, 0.08);
  color: #2563eb;
  border-radius: 6px;
  cursor: pointer;
  font-size: var(--fs-md);
  display: flex;
  align-items: center;
  justify-content: center;
}
.sp-regen-btn:hover { background: rgba(37, 99, 235, 0.16); }

/* ── Buttons ── */
.sp-btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 46px;
  padding: 0 24px;
  border-radius: 12px;
  background: #2563eb;
  color: #fff;
  font-size: var(--fs-base);
  font-weight: 700;
  border: none;
  cursor: pointer;
  text-decoration: none;
  transition: background .15s, transform .1s;
}
.sp-btn-primary:hover { background: #1d4ed8; }
.sp-btn-primary:active { transform: translateY(1px); }
.sp-btn-primary:disabled { opacity: .55; cursor: not-allowed; }

.sp-btn-ghost {
  display: inline-flex;
  align-items: center;
  height: 46px;
  padding: 0 20px;
  border-radius: 12px;
  background: #f1f5f9;
  color: #475569;
  font-size: var(--fs-base);
  font-weight: 600;
  border: none;
  cursor: pointer;
  text-decoration: none;
  transition: background .15s;
}
.sp-btn-ghost:hover { background: #e2e8f0; }
.sp-btn-ghost:disabled { opacity: .55; cursor: not-allowed; }

.sp-btn-create { min-width: 180px; justify-content: center; }

.sp-form-actions { display: flex; justify-content: flex-end; padding-top: 8px; }
.sp-form-actions--split { justify-content: space-between; }

/* ── Spinner ── */
.sp-spinner {
  display: inline-block;
  width: 14px;
  height: 14px;
  border: 2px solid rgba(255, 255, 255, 0.4);
  border-top-color: #fff;
  border-radius: 999px;
  animation: sp-spin .6s linear infinite;
}
@keyframes sp-spin { to { transform: rotate(360deg); } }

/* ── Milestones ── */
.sp-milestone-info-box {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: var(--fs-caption);
  color: #475569;
  background: #f0f9ff;
  border: 1px solid #bae6fd;
  border-radius: 10px;
  padding: 12px 14px;
  line-height: 1.6;
}
.sp-milestone-info-icon { font-size: var(--fs-md); flex-shrink: 0; margin-top: 1px; }

.sp-milestone-progress { display: flex; flex-direction: column; gap: 6px; }
.sp-milestone-bar {
  display: flex;
  height: 8px;
  border-radius: 999px;
  overflow: hidden;
  background: #f1f5f9;
  gap: 2px;
}
.sp-milestone-bar-seg { border-radius: 999px; transition: width .2s; }
.sp-milestone-bar-rem { background: #e2e8f0; }
.sp-milestone-bar-labels {
  display: flex;
  justify-content: space-between;
  font-size: var(--fs-sm);
  color: #64748b;
  font-weight: 600;
}
.sp-pct-warn { color: #d97706; }
.sp-pct-over { color: #dc2626; }

.sp-milestone-list { display: flex; flex-direction: column; gap: 10px; }
.sp-milestone-row {
  display: flex;
  align-items: center;
  gap: 10px;
}
.sp-milestone-idx {
  width: 24px;
  height: 24px;
  border-radius: 999px;
  background: #2563eb;
  color: #fff;
  font-size: var(--fs-xs);
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.sp-milestone-label-input { flex: 1 1; }
.sp-milestone-pct-group {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
}
.sp-milestone-pct-input { width: 68px !important; text-align: center; background: #ffffff !important; border-color: #cbd5e1 !important; }
.sp-pct-sym { font-size: var(--fs-caption); font-weight: 700; color: #64748b; }
.sp-milestone-usd {
  font-size: var(--fs-sm);
  color: #059669;
  font-weight: 600;
  white-space: nowrap;
  min-width: 70px;
  text-align: right;
}
.sp-rm-btn {
  width: 28px;
  height: 28px;
  border: 0;
  background: #fee2e2;
  color: #dc2626;
  border-radius: 6px;
  cursor: pointer;
  font-size: var(--fs-sm);
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sp-rm-btn:hover { background: #fecaca; }

.sp-add-milestone-btn {
  align-self: flex-start;
  height: 36px;
  padding: 0 16px;
  border: 1.5px dashed #cbd5e1;
  border-radius: 10px;
  background: transparent;
  color: #64748b;
  font-size: var(--fs-caption);
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  transition: all .15s;
}
.sp-add-milestone-btn:hover { border-color: #2563eb; color: #2563eb; background: rgba(37,99,235,.04); }

/* ── Review ── */
.sp-review-table {
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  overflow: hidden;
}
.sp-review-row {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 11px 16px;
  border-bottom: 1px solid #f1f5f9;
}
.sp-review-row:last-child { border-bottom: 0; }
.sp-review-label {
  font-size: var(--fs-sm);
  font-weight: 600;
  color: #94a3b8;
  width: 130px;
  flex-shrink: 0;
  padding-top: 1px;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.sp-review-value {
  font-size: var(--fs-base);
  color: #0f172a;
  font-weight: 500;
  word-break: break-all;
}

.sp-review-milestones {
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  overflow: hidden;
}
.sp-review-milestones-hd {
  font-size: var(--fs-sm);
  font-weight: 700;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: 10px 16px;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
}
.sp-review-ms-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px;
  border-bottom: 1px solid #f1f5f9;
}
.sp-review-ms-row:last-child { border-bottom: 0; }
.sp-review-ms-num {
  width: 20px;
  height: 20px;
  border-radius: 999px;
  background: #2563eb;
  color: #fff;
  font-size: var(--fs-xs);
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.sp-review-ms-label { flex: 1 1; font-size: var(--fs-base); color: #0f172a; }
.sp-review-ms-amt { font-size: var(--fs-caption); color: #059669; font-weight: 600; }

/* ── Status Badge ── */
.sp-status-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid;
  font-size: var(--fs-sm);
  font-weight: 700;
  letter-spacing: .03em;
}
.sp-status-dot {
  width: 6px;
  height: 6px;
  border-radius: 999px;
}

/* ── Copy Button ── */
.sp-copy-btn {
  height: 28px;
  padding: 0 12px;
  border-radius: 6px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  color: #475569;
  font-size: var(--fs-sm);
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
  font-family: inherit;
  transition: all .15s;
}
.sp-copy-btn:hover { border-color: #2563eb; color: #2563eb; background: rgba(37,99,235,.05); }

/* ── Result ── */
.sp-result {
  background: #fff;
  border-radius: 20px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 8px 32px rgba(2, 6, 23, 0.07);
  padding: 40px 36px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 16px;
}
.sp-result-icon {
  width: 56px;
  height: 56px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--fs-xl);
  font-weight: 800;
}
.sp-result-icon--success { background: #d1fae5; color: #059669; }
.sp-result-icon--error { background: #fee2e2; color: #dc2626; }
.sp-result-title { font-size: var(--fs-xl); font-weight: 800; color: #0f172a; }
.sp-result-msg { font-size: var(--fs-base); color: #64748b; max-width: 360px; }

.sp-result-fields {
  width: 100%;
  text-align: left;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  overflow: hidden;
  margin-top: 8px;
}
.sp-result-field { padding: 12px 16px; border-bottom: 1px solid #f1f5f9; }
.sp-result-field:last-child { border-bottom: 0; }
.sp-result-field-label { font-size: var(--fs-xs); font-weight: 700; color: #94a3b8; text-transform: uppercase; letter-spacing: .05em; }
.sp-result-field-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 6px;
}
.sp-result-url-val {
  font-size: var(--fs-sm);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #475569;
}

.sp-result-actions { display: flex; gap: 12px; margin-top: 8px; }

/* ── Sidebar ── */
.sp-sidebar { display: flex; flex-direction: column; gap: 16px; }
.sp-sidebar-card {
  background: #fff;
  border-radius: 16px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  padding: 20px;
  box-shadow: 0 4px 16px rgba(2, 6, 23, 0.05);
}
.sp-sidebar-card--blue {
  background: linear-gradient(135deg, #eff6ff, #fff);
  border-color: #bfdbfe;
}
.sp-sidebar-card--muted { background: #f8fafc; box-shadow: none; }
.sp-sidebar-title {
  font-size: var(--fs-caption);
  font-weight: 800;
  color: #0f172a;
  margin-bottom: 14px;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.sp-summary-amount {
  font-size: var(--fs-3xl);
  font-weight: 800;
  color: #2563eb;
  letter-spacing: -0.02em;
}
.sp-summary-milestones { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; }
.sp-summary-ms {
  display: flex;
  justify-content: space-between;
  font-size: var(--fs-caption);
  color: #475569;
}
.sp-summary-note { font-size: var(--fs-sm); color: #94a3b8; margin-top: 8px; }

.sp-lifecycle { display: flex; flex-direction: column; gap: 10px; }
.sp-lifecycle-row { display: flex; align-items: center; gap: 10px; }
.sp-lifecycle-desc { font-size: var(--fs-sm); color: #64748b; }

.sp-checklist {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-left: 20px;
  margin: 0;
}
.sp-checklist li { font-size: var(--fs-sm); color: #475569; }
.sp-checklist code {
  font-family: ui-monospace, monospace;
  font-size: var(--fs-xs);
  background: #e2e8f0;
  padding: 1px 5px;
  border-radius: 4px;
  color: #334155;
}

/* ── Mono ── */
.sp-mono {
  font-family: ui-monospace, SFMono-Regular, monospace;
  font-size: var(--fs-caption);
  color: #334155;
}

/* ============================================================
   Checkout page
   ============================================================ */
.sp-co-header { padding: 40px 0 24px; }
.sp-co-title-row { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }

.sp-co-body {
  display: grid;
  grid-template-columns: 1fr 280px;
  grid-gap: 28px;
  gap: 28px;
  align-items: start;
  padding-bottom: 80px;
}
@media (max-width: 900px) { .sp-co-body { grid-template-columns: 1fr; } }

.sp-co-main { display: flex; flex-direction: column; gap: 16px; }
.sp-co-card {
  background: #fff;
  border-radius: 16px;
  border: 1px solid rgba(15,23,42,.08);
  padding: 22px 24px;
  box-shadow: 0 4px 16px rgba(2,6,23,.05);
}
.sp-co-section-title {
  font-size: var(--fs-sm);
  font-weight: 800;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-bottom: 14px;
}
.sp-co-loading { padding: 60px 0; text-align: center; color: #94a3b8; font-size: var(--fs-base); }
.sp-co-loading--page { padding: 120px 0; }
.sp-co-empty {
  display: flex; flex-direction: column; align-items: center; gap: 16px;
  padding: 80px 0; text-align: center;
}
.sp-co-empty-icon { font-size: 48px; }
.sp-co-empty-title { font-size: var(--fs-xl); font-weight: 700; color: #0f172a; }
.sp-co-err {
  font-size: var(--fs-caption); color: #dc2626; background: #fef2f2;
  border: 1px solid #fecaca; border-radius: 10px; padding: 12px 14px;
}
.sp-co-err--standalone { margin-top: 8px; }

/* Status card */
.sp-co-status-card {
  display: flex; align-items: center; gap: 16px;
  background: #fff; border-radius: 16px; border: 1.5px solid;
  padding: 18px 20px; box-shadow: 0 4px 16px rgba(2,6,23,.05);
}
.sp-co-status-icon {
  width: 44px; height: 44px; border-radius: 999px; font-size: var(--fs-xl);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.sp-co-status-body { flex: 1 1; }
.sp-co-status-label { font-size: var(--fs-sm); color: #64748b; font-weight: 600; }
.sp-co-status-val { font-size: var(--fs-lg); font-weight: 800; }
.sp-co-refresh-btn {
  width: 32px; height: 32px; border: 1px solid #e2e8f0; border-radius: 8px;
  background: #f8fafc; cursor: pointer; font-size: var(--fs-md); color: #64748b;
  display: flex; align-items: center; justify-content: center;
}

/* Amounts */
.sp-co-amounts { display: flex; flex-direction: column; }
.sp-co-amount-row { display: flex; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid #f1f5f9; font-size: var(--fs-base); color: #475569; }
.sp-co-amount-row:last-child { border-bottom: 0; }
.sp-co-amount-row--main { font-weight: 700; color: #0f172a; font-size: var(--fs-body); }
.sp-co-amount-row--net { color: #059669; font-weight: 700; }
.sp-co-amount-val { font-weight: 700; }
.sp-co-fee-val { color: #dc2626; }
.sp-co-net-val { color: #059669; font-weight: 800; font-size: var(--fs-body); }

/* Detail table */
.sp-co-detail-table { display: flex; flex-direction: column; }
.sp-co-detail-row {
  display: flex; align-items: flex-start; gap: 16px;
  padding: 10px 0; border-bottom: 1px solid #f1f5f9;
}
.sp-co-detail-row:last-child { border-bottom: 0; }
.sp-co-detail-label { font-size: var(--fs-xs); font-weight: 700; color: #94a3b8; width: 110px; flex-shrink: 0; text-transform: uppercase; letter-spacing: .04em; padding-top: 2px; }
.sp-co-detail-val-wrap { display: flex; align-items: center; gap: 10px; flex: 1 1; min-width: 0; }
.sp-co-detail-val { font-size: var(--fs-caption); color: #0f172a; word-break: break-all; }

/* Actions card */
.sp-co-actions-card { background: #fffbeb; border-color: #fde68a; }
.sp-co-note-wrap { margin-bottom: 14px; }
.sp-co-note-input { max-width: 400px; background: #ffffff !important; border-color: #cbd5e1 !important; }
.sp-co-action-btns { display: flex; flex-wrap: wrap; gap: 10px; }
.sp-co-action-btn { height: 42px; padding: 0 20px; border-radius: 10px; border: none; font-size: var(--fs-caption); font-weight: 700; cursor: pointer; font-family: inherit; transition: all .15s; }
.sp-co-action-btn--primary { background: #2563eb; color: #fff; }
.sp-co-action-btn--primary:hover { background: #1d4ed8; }
.sp-co-action-btn--ghost { background: #f1f5f9; color: #475569; }
.sp-co-action-btn--ghost:hover { background: #e2e8f0; }
.sp-co-action-btn--danger { background: #fee2e2; color: #dc2626; }
.sp-co-action-btn--danger:hover { background: #fecaca; }
.sp-co-action-btn:disabled { opacity: .55; cursor: not-allowed; }
.sp-co-admin-cta { display: flex; align-items: center; gap: 10px; font-size: var(--fs-caption); color: #94a3b8; padding: 12px 0; }
.sp-co-admin-link { font-weight: 700; color: #2563eb; text-decoration: none; }
.sp-co-admin-link:hover { opacity: .78; }

/* Milestones */
.sp-co-milestones { display: flex; flex-direction: column; gap: 12px; }
.sp-co-ms-count { font-weight: 800; color: #0f172a; }
.sp-co-ms-bar-wrap { display: flex; align-items: center; gap: 10px; }
.sp-co-ms-bar { flex: 1 1; height: 8px; background: #f1f5f9; border-radius: 999px; overflow: hidden; }
.sp-co-ms-bar-fill { height: 100%; background: #059669; border-radius: 999px; transition: width .3s ease; }
.sp-co-ms-pct { font-size: var(--fs-sm); font-weight: 700; color: #059669; min-width: 32px; text-align: right; }
.sp-co-ms-list { display: flex; flex-direction: column; gap: 8px; }
.sp-co-ms-row { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 10px; background: #f8fafc; border: 1px solid #e2e8f0; transition: all .15s; }
.sp-co-ms-row.is-done { background: #f0fdf4; border-color: #bbf7d0; }
.sp-co-ms-check { width: 24px; height: 24px; border-radius: 999px; display: flex; align-items: center; justify-content: center; font-size: var(--fs-xs); font-weight: 800; flex-shrink: 0; background: #e2e8f0; color: #64748b; }
.sp-co-ms-row.is-done .sp-co-ms-check { background: #059669; color: #fff; }
.sp-co-ms-body { flex: 1 1; }
.sp-co-ms-label { font-size: var(--fs-caption); font-weight: 600; color: #0f172a; }
.sp-co-ms-date { font-size: var(--fs-xs); color: #94a3b8; margin-top: 2px; }
.sp-co-ms-meta { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; flex-shrink: 0; }
.sp-co-ms-pct-tag { font-size: var(--fs-xs); font-weight: 700; color: #94a3b8; }
.sp-co-ms-amt { font-size: var(--fs-sm); font-weight: 700; color: #059669; }

/* Events */
.sp-co-events { display: flex; flex-direction: column; gap: 10px; }
.sp-co-event-list { display: flex; flex-direction: column; gap: 0; }
.sp-co-event-row { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid #f1f5f9; }
.sp-co-event-row:last-child { border-bottom: 0; }
.sp-co-event-dot { width: 8px; height: 8px; border-radius: 999px; background: #2563eb; flex-shrink: 0; }
.sp-co-event-body { flex: 1 1; font-size: var(--fs-caption); color: #0f172a; }
.sp-co-event-type { font-weight: 700; text-transform: capitalize; }
.sp-co-event-note { color: #64748b; font-weight: 400; }
.sp-co-event-date { font-size: var(--fs-xs); color: #94a3b8; white-space: nowrap; }

/* Sidebar links */
.sp-co-sidebar-links { display: flex; flex-direction: column; gap: 8px; }
.sp-co-sidebar-link { font-size: var(--fs-caption); font-weight: 600; color: #2563eb; text-decoration: none; }
.sp-co-sidebar-link:hover { opacity: .78; }
.sp-lifecycle-row.is-current .sp-lifecycle-desc { font-weight: 700; color: #0f172a; }

/* ============================================================
   Admin Escrow List
   ============================================================ */
.sp-admin-header { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: 16px; padding: 40px 0 24px; }
.sp-admin-header-actions { display: flex; gap: 10px; align-items: center; }

.sp-admin-stats {
  display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 12px; gap: 12px; margin-bottom: 24px;
}
@media (max-width: 700px) { .sp-admin-stats { grid-template-columns: repeat(2, 1fr); } }
.sp-admin-stat {
  background: #fff; border-radius: 12px; border: 1.5px solid transparent;
  padding: 16px; box-shadow: 0 2px 10px rgba(2,6,23,.05); transition: all .15s;
}
.sp-admin-stat:hover { box-shadow: 0 4px 20px rgba(2,6,23,.1); }
.sp-admin-stat-count { font-size: var(--fs-3xl); font-weight: 800; line-height: 1; }
.sp-admin-stat-label { font-size: var(--fs-xs); font-weight: 700; color: #94a3b8; text-transform: uppercase; letter-spacing: .05em; margin-top: 4px; }

.sp-admin-filters { display: flex; flex-direction: column; gap: 10px; margin-bottom: 20px; }
.sp-admin-search { max-width: 100%; background: #ffffff !important; border-color: #cbd5e1 !important; }
.sp-admin-filter-row { display: flex; gap: 10px; }
.sp-admin-status-select { width: 160px; flex-shrink: 0; background: #ffffff !important; border-color: #cbd5e1 !important; }
.sp-admin-limit-select { width: 120px; flex-shrink: 0; background: #ffffff !important; border-color: #cbd5e1 !important; }

.sp-admin-gate { display: flex; flex-direction: column; align-items: center; gap: 16px; padding: 100px 0; text-align: center; }
.sp-admin-gate-icon { font-size: 48px; }
.sp-admin-gate-title { font-size: var(--fs-xl); font-weight: 800; color: #0f172a; }
.sp-admin-gate-desc { font-size: var(--fs-body); color: #64748b; }

.sp-admin-table-card {
  background: #fff; border-radius: 16px; border: 1px solid rgba(15,23,42,.08);
  box-shadow: 0 4px 16px rgba(2,6,23,.05); overflow: hidden; margin-bottom: 80px;
}
.sp-admin-table-meta { font-size: var(--fs-sm); color: #94a3b8; padding: 12px 20px; border-bottom: 1px solid #f1f5f9; }
.sp-admin-table-wrap { overflow-x: auto; }
.sp-admin-table { width: 100%; border-collapse: collapse; }
.sp-admin-table th {
  text-align: left; font-size: var(--fs-xs); font-weight: 800; color: #94a3b8;
  text-transform: uppercase; letter-spacing: .05em;
  padding: 12px 16px; background: #f8fafc; border-bottom: 1px solid #e2e8f0; white-space: nowrap;
}
.sp-admin-table td { padding: 13px 16px; border-bottom: 1px solid #f1f5f9; vertical-align: middle; }
.sp-admin-table tbody tr:last-child td { border-bottom: 0; }
.sp-admin-table tbody tr:hover { background: #fafbff; }
.sp-admin-id { font-size: var(--fs-caption); font-weight: 600; color: #0f172a; }
.sp-admin-sub { font-size: var(--fs-xs); color: #94a3b8; margin-top: 2px; }
.sp-admin-amt { font-size: var(--fs-base); font-weight: 700; color: #0f172a; white-space: nowrap; }
.sp-admin-net { font-size: var(--fs-caption); color: #059669; font-weight: 600; white-space: nowrap; }
.sp-admin-empty { padding: 40px 16px; text-align: center; color: #94a3b8; font-size: var(--fs-base); }

.sp-admin-row-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.sp-admin-action-btn {
  height: 30px; padding: 0 12px; border-radius: 8px; border: 1px solid #e2e8f0;
  background: #f8fafc; color: #475569; font-size: var(--fs-sm); font-weight: 700;
  cursor: pointer; text-decoration: none; display: inline-flex; align-items: center;
  font-family: inherit; white-space: nowrap; transition: all .12s;
}
.sp-admin-action-btn:hover { border-color: #2563eb; color: #2563eb; background: rgba(37,99,235,.05); }
.sp-admin-action-btn--green { background: #d1fae5; color: #059669; border-color: #a7f3d0; }
.sp-admin-action-btn--green:hover { background: #a7f3d0; }
.sp-admin-action-btn--purple { background: #ede9fe; color: #7c3aed; border-color: #ddd6fe; }
.sp-admin-action-btn--purple:hover { background: #ddd6fe; }
.sp-admin-action-btn--red { background: #fee2e2; color: #dc2626; border-color: #fecaca; }
.sp-admin-action-btn--red:hover { background: #fecaca; }
.sp-admin-action-btn:disabled { opacity: .55; cursor: not-allowed; }

/* ============================================================
   Homepage precision CSS — safepay-homepage.css
   Appended to safepay.css / imported in layout
   ============================================================ */

/* ── Section utilities ── */
.sp-section-alt { background: #f8fafc; }


/* ── Input visibility global override ── */
.sp-form-input,
.sp-form-select,
.sp-form-textarea {
  background: #ffffff !important;
  border-color: #94a3b8 !important;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
}
.sp-form-input::placeholder,
.sp-form-textarea::placeholder {
  color: #94a3b8 !important;
}
.sp-form-input:focus,
.sp-form-select:focus,
.sp-form-textarea:focus {
  border-color: #2563eb !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12) !important;
}
.sp-form-input.is-error {
  border-color: #dc2626 !important;
}

/* ── Layout ── */
/* ── Create Escrow hero strip ── */
.sp-ce-hero {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  border-bottom: 1px solid rgba(255,255,255,.06);
  padding: 36px 0 32px;
  /* Remove the gap left by header-margin */
  margin-top: -90px;
  padding-top: calc(90px + 36px);
}
@media (max-width: 767px) {
  .sp-ce-hero { margin-top: -80px; padding-top: calc(80px + 28px); }
}
.sp-ce-hero-inner {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
}
.sp-ce-breadcrumb {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: var(--fs-sm);
  font-weight: 600;
  color: rgba(255,255,255,.50);
  text-decoration: none;
  margin-bottom: 10px;
  transition: color .14s;
}
.sp-ce-breadcrumb:hover { color: rgba(255,255,255,.80); }
.sp-ce-title {
  font-size: var(--fs-4xl);
  font-weight: 800;
  letter-spacing: -0.03em;
  color: #ffffff;
  margin: 0 0 8px;
  line-height: 1.1;
}
.sp-ce-sub {
  font-size: var(--fs-base);
  color: rgba(255,255,255,.55);
  margin: 0;
  letter-spacing: .01em;
}
.sp-ce-hero-badges {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  padding-bottom: 4px;
}
.sp-ce-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 28px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
  font-size: var(--fs-sm);
  font-weight: 600;
  color: rgba(255,255,255,.75);
  white-space: nowrap;
}
.sp-ce-badge-dot {
  width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0;
}
.sp-ce-badge-dot--green  { background: #10b981; box-shadow: 0 0 0 2px rgba(16,185,129,.25); }
.sp-ce-badge-dot--blue   { background: #3b82f6; box-shadow: 0 0 0 2px rgba(59,130,246,.25); }
.sp-ce-badge-dot--purple { background: #8b5cf6; box-shadow: 0 0 0 2px rgba(139,92,246,.25); }

@media (max-width: 767px) {
  .sp-ce-hero { padding: 28px 0 24px; }
  .sp-ce-title { font-size: var(--fs-2xl); }
  .sp-ce-hero-inner { flex-direction: column; align-items: flex-start; gap: 16px; }
}

/* ── Create body layout ── */
.sp-create-body {
  display: grid;
  grid-template-columns: 1fr 300px;
  grid-gap: 28px;
  gap: 28px;
  align-items: start;
  padding-top: 28px;
  padding-bottom: 80px;
}
@media (max-width: 900px) {
  .sp-create-body { grid-template-columns: 1fr; }
}

/* ── Main Card ── */
.sp-create-card {
  background: #ffffff;
  border-radius: 20px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 8px 32px rgba(2, 6, 23, 0.07);
  overflow: hidden;
}
.sp-card-body {
  padding: 24px 28px 28px;
}
@media (max-width: 600px) {
  .sp-card-body { padding: 18px 16px 22px; }
}

/* ── Step Bar ── */
.sp-stepbar {
  display: flex;
  align-items: center;
  padding: 22px 28px 0;
  gap: 0;
  border-bottom: 1px solid rgba(15,23,42,.06);
  padding-bottom: 18px;
  margin-bottom: 0;
}
.sp-stepbar-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: var(--fs-caption);
  font-weight: 600;
  color: #94a3b8;
  position: relative;
}
.sp-stepbar-item.is-active { color: #2563eb; }
.sp-stepbar-item.is-done { color: #059669; }

.sp-stepbar-dot {
  width: 26px;
  height: 26px;
  border-radius: 999px;
  border: 2px solid #e2e8f0;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--fs-xs);
  font-weight: 800;
  flex-shrink: 0;
  transition: all .2s ease;
}
.sp-stepbar-item.is-active .sp-stepbar-dot {
  border-color: #2563eb;
  background: #2563eb;
  color: #fff;
}
.sp-stepbar-item.is-done .sp-stepbar-dot {
  border-color: #059669;
  background: #059669;
  color: #fff;
}
.sp-stepbar-line {
  width: 32px;
  height: 2px;
  background: #e2e8f0;
  margin: 0 4px;
}
.sp-stepbar-item.is-done + .sp-stepbar-item .sp-stepbar-line,
.sp-stepbar-item.is-done .sp-stepbar-line { background: #059669; }

/* ── Form fields ── */
.sp-form-section { display: flex; flex-direction: column; gap: 18px; }

.sp-field { display: flex; flex-direction: column; gap: 6px; }
.sp-field--grow { flex: 1 1; min-width: 0; }
.sp-field--currency { width: 120px; flex-shrink: 0; }

.sp-field-label {
  font-size: var(--fs-caption);
  font-weight: 700;
  color: #0f172a;
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: default;
}
.sp-field-opt {
  font-size: var(--fs-xs);
  font-weight: 600;
  color: #94a3b8;
  background: #f1f5f9;
  padding: 2px 6px;
  border-radius: 4px;
}
.sp-field-hint {
  font-size: var(--fs-sm);
  color: #94a3b8;
  line-height: 1.5;
}
.sp-field-hint code {
  font-family: ui-monospace, monospace;
  font-size: var(--fs-xs);
  background: #f1f5f9;
  padding: 1px 5px;
  border-radius: 4px;
  color: #475569;
}
.sp-field-error { font-size: var(--fs-sm); color: #dc2626; }

.sp-form-row { display: flex; gap: 16px; }
@media (max-width: 600px) { .sp-form-row { flex-direction: column; } }

.sp-form-input {
  width: 100%;
  height: 42px;
  padding: 0 13px;
  border: 1.5px solid #cbd5e1;
  border-radius: 10px;
  font-size: var(--fs-base);
  color: #0f172a;
  background: #ffffff;
  outline: none;
  transition: border-color .15s, box-shadow .15s;
  font-family: inherit;
}
.sp-form-input:focus {
  border-color: #2563eb;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.10);
}
.sp-form-input.is-error { border-color: #dc2626; }
.sp-form-input::placeholder { color: #94a3b8; }

.sp-form-select {
  width: 100%;
  height: 42px;
  padding: 0 13px;
  border: 1.5px solid #cbd5e1;
  border-radius: 10px;
  font-size: var(--fs-base);
  color: #0f172a;
  background: #ffffff;
  outline: none;
  cursor: pointer;
  font-family: inherit;
}
.sp-form-select:focus {
  border-color: #2563eb;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.10);
}

.sp-form-textarea {
  width: 100%;
  padding: 10px 13px;
  border: 1.5px solid #cbd5e1;
  border-radius: 10px;
  font-size: var(--fs-base);
  color: #0f172a;
  background: #ffffff;
  outline: none;
  resize: vertical;
  font-family: inherit;
  line-height: 1.6;
}
.sp-form-textarea:focus {
  border-color: #2563eb;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.10);
}

.sp-input-addon {
  position: relative;
  display: flex;
  align-items: center;
}
.sp-input-addon .sp-form-input { padding-right: 42px; }
.sp-regen-btn {
  position: absolute;
  right: 8px;
  width: 28px;
  height: 28px;
  border: 0;
  background: rgba(37, 99, 235, 0.08);
  color: #2563eb;
  border-radius: 6px;
  cursor: pointer;
  font-size: var(--fs-md);
  display: flex;
  align-items: center;
  justify-content: center;
}
.sp-regen-btn:hover { background: rgba(37, 99, 235, 0.16); }

/* ── Buttons ── */
.sp-btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 46px;
  padding: 0 24px;
  border-radius: 12px;
  background: #2563eb;
  color: #fff;
  font-size: var(--fs-base);
  font-weight: 700;
  border: none;
  cursor: pointer;
  text-decoration: none;
  transition: background .15s, transform .1s;
}
.sp-btn-primary:hover { background: #1d4ed8; }
.sp-btn-primary:active { transform: translateY(1px); }
.sp-btn-primary:disabled { opacity: .55; cursor: not-allowed; }

.sp-btn-ghost {
  display: inline-flex;
  align-items: center;
  height: 46px;
  padding: 0 20px;
  border-radius: 12px;
  background: #f1f5f9;
  color: #475569;
  font-size: var(--fs-base);
  font-weight: 600;
  border: none;
  cursor: pointer;
  text-decoration: none;
  transition: background .15s;
}
.sp-btn-ghost:hover { background: #e2e8f0; }
.sp-btn-ghost:disabled { opacity: .55; cursor: not-allowed; }

.sp-btn-create { min-width: 180px; justify-content: center; }

.sp-form-actions { display: flex; justify-content: flex-end; padding-top: 8px; }
.sp-form-actions--split { justify-content: space-between; }

/* ── Spinner ── */
.sp-spinner {
  display: inline-block;
  width: 14px;
  height: 14px;
  border: 2px solid rgba(255, 255, 255, 0.4);
  border-top-color: #fff;
  border-radius: 999px;
  animation: sp-spin .6s linear infinite;
}
@keyframes sp-spin { to { transform: rotate(360deg); } }

/* ── Milestones ── */
.sp-milestone-info-box {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: var(--fs-caption);
  color: #475569;
  background: #f0f9ff;
  border: 1px solid #bae6fd;
  border-radius: 10px;
  padding: 12px 14px;
  line-height: 1.6;
}
.sp-milestone-info-icon { font-size: var(--fs-md); flex-shrink: 0; margin-top: 1px; }

.sp-milestone-progress { display: flex; flex-direction: column; gap: 6px; }
.sp-milestone-bar {
  display: flex;
  height: 8px;
  border-radius: 999px;
  overflow: hidden;
  background: #f1f5f9;
  gap: 2px;
}
.sp-milestone-bar-seg { border-radius: 999px; transition: width .2s; }
.sp-milestone-bar-rem { background: #e2e8f0; }
.sp-milestone-bar-labels {
  display: flex;
  justify-content: space-between;
  font-size: var(--fs-sm);
  color: #64748b;
  font-weight: 600;
}
.sp-pct-warn { color: #d97706; }
.sp-pct-over { color: #dc2626; }

.sp-milestone-list { display: flex; flex-direction: column; gap: 10px; }
.sp-milestone-row {
  display: flex;
  align-items: center;
  gap: 10px;
}
.sp-milestone-idx {
  width: 24px;
  height: 24px;
  border-radius: 999px;
  background: #2563eb;
  color: #fff;
  font-size: var(--fs-xs);
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.sp-milestone-label-input { flex: 1 1; }
.sp-milestone-pct-group {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
}
.sp-milestone-pct-input { width: 68px !important; text-align: center; background: #ffffff !important; border-color: #cbd5e1 !important; }
.sp-pct-sym { font-size: var(--fs-caption); font-weight: 700; color: #64748b; }
.sp-milestone-usd {
  font-size: var(--fs-sm);
  color: #059669;
  font-weight: 600;
  white-space: nowrap;
  min-width: 70px;
  text-align: right;
}
.sp-rm-btn {
  width: 28px;
  height: 28px;
  border: 0;
  background: #fee2e2;
  color: #dc2626;
  border-radius: 6px;
  cursor: pointer;
  font-size: var(--fs-sm);
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sp-rm-btn:hover { background: #fecaca; }

.sp-add-milestone-btn {
  align-self: flex-start;
  height: 36px;
  padding: 0 16px;
  border: 1.5px dashed #cbd5e1;
  border-radius: 10px;
  background: transparent;
  color: #64748b;
  font-size: var(--fs-caption);
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  transition: all .15s;
}
.sp-add-milestone-btn:hover { border-color: #2563eb; color: #2563eb; background: rgba(37,99,235,.04); }

/* ── Review ── */
.sp-review-table {
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  overflow: hidden;
}
.sp-review-row {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 11px 16px;
  border-bottom: 1px solid #f1f5f9;
}
.sp-review-row:last-child { border-bottom: 0; }
.sp-review-label {
  font-size: var(--fs-sm);
  font-weight: 600;
  color: #94a3b8;
  width: 130px;
  flex-shrink: 0;
  padding-top: 1px;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.sp-review-value {
  font-size: var(--fs-base);
  color: #0f172a;
  font-weight: 500;
  word-break: break-all;
}

.sp-review-milestones {
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  overflow: hidden;
}
.sp-review-milestones-hd {
  font-size: var(--fs-sm);
  font-weight: 700;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: 10px 16px;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
}
.sp-review-ms-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px;
  border-bottom: 1px solid #f1f5f9;
}
.sp-review-ms-row:last-child { border-bottom: 0; }
.sp-review-ms-num {
  width: 20px;
  height: 20px;
  border-radius: 999px;
  background: #2563eb;
  color: #fff;
  font-size: var(--fs-xs);
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.sp-review-ms-label { flex: 1 1; font-size: var(--fs-base); color: #0f172a; }
.sp-review-ms-amt { font-size: var(--fs-caption); color: #059669; font-weight: 600; }

/* ── Status Badge ── */
.sp-status-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid;
  font-size: var(--fs-sm);
  font-weight: 700;
  letter-spacing: .03em;
}
.sp-status-dot {
  width: 6px;
  height: 6px;
  border-radius: 999px;
}

/* ── Copy Button ── */
.sp-copy-btn {
  height: 28px;
  padding: 0 12px;
  border-radius: 6px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  color: #475569;
  font-size: var(--fs-sm);
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
  font-family: inherit;
  transition: all .15s;
}
.sp-copy-btn:hover { border-color: #2563eb; color: #2563eb; background: rgba(37,99,235,.05); }

/* ── Result ── */
.sp-result {
  background: #fff;
  border-radius: 20px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 8px 32px rgba(2, 6, 23, 0.07);
  padding: 40px 36px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 16px;
}
.sp-result-icon {
  width: 56px;
  height: 56px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--fs-xl);
  font-weight: 800;
}
.sp-result-icon--success { background: #d1fae5; color: #059669; }
.sp-result-icon--error { background: #fee2e2; color: #dc2626; }
.sp-result-title { font-size: var(--fs-xl); font-weight: 800; color: #0f172a; }
.sp-result-msg { font-size: var(--fs-base); color: #64748b; max-width: 360px; }

.sp-result-fields {
  width: 100%;
  text-align: left;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  overflow: hidden;
  margin-top: 8px;
}
.sp-result-field { padding: 12px 16px; border-bottom: 1px solid #f1f5f9; }
.sp-result-field:last-child { border-bottom: 0; }
.sp-result-field-label { font-size: var(--fs-xs); font-weight: 700; color: #94a3b8; text-transform: uppercase; letter-spacing: .05em; }
.sp-result-field-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 6px;
}
.sp-result-url-val {
  font-size: var(--fs-sm);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #475569;
}

.sp-result-actions { display: flex; gap: 12px; margin-top: 8px; }

/* ── Sidebar ── */
.sp-sidebar { display: flex; flex-direction: column; gap: 16px; }
.sp-sidebar-card {
  background: #fff;
  border-radius: 16px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  padding: 20px;
  box-shadow: 0 4px 16px rgba(2, 6, 23, 0.05);
}
.sp-sidebar-card--blue {
  background: linear-gradient(135deg, #eff6ff, #fff);
  border-color: #bfdbfe;
}
.sp-sidebar-card--muted { background: #f8fafc; box-shadow: none; }
.sp-sidebar-title {
  font-size: var(--fs-caption);
  font-weight: 800;
  color: #0f172a;
  margin-bottom: 14px;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.sp-summary-amount {
  font-size: var(--fs-3xl);
  font-weight: 800;
  color: #2563eb;
  letter-spacing: -0.02em;
}
.sp-summary-milestones { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; }
.sp-summary-ms {
  display: flex;
  justify-content: space-between;
  font-size: var(--fs-caption);
  color: #475569;
}
.sp-summary-note { font-size: var(--fs-sm); color: #94a3b8; margin-top: 8px; }

.sp-lifecycle { display: flex; flex-direction: column; gap: 10px; }
.sp-lifecycle-row { display: flex; align-items: center; gap: 10px; }
.sp-lifecycle-desc { font-size: var(--fs-sm); color: #64748b; }

.sp-checklist {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-left: 20px;
  margin: 0;
}
.sp-checklist li { font-size: var(--fs-sm); color: #475569; }
.sp-checklist code {
  font-family: ui-monospace, monospace;
  font-size: var(--fs-xs);
  background: #e2e8f0;
  padding: 1px 5px;
  border-radius: 4px;
  color: #334155;
}

/* ── Mono ── */
.sp-mono {
  font-family: ui-monospace, SFMono-Regular, monospace;
  font-size: var(--fs-caption);
  color: #334155;
}

/* ============================================================
   Checkout page
   ============================================================ */
.sp-co-header { padding: 40px 0 24px; }
.sp-co-title-row { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }

.sp-co-body {
  display: grid;
  grid-template-columns: 1fr 280px;
  grid-gap: 28px;
  gap: 28px;
  align-items: start;
  padding-bottom: 80px;
}
@media (max-width: 900px) { .sp-co-body { grid-template-columns: 1fr; } }

.sp-co-main { display: flex; flex-direction: column; gap: 16px; }
.sp-co-card {
  background: #fff;
  border-radius: 16px;
  border: 1px solid rgba(15,23,42,.08);
  padding: 22px 24px;
  box-shadow: 0 4px 16px rgba(2,6,23,.05);
}
.sp-co-section-title {
  font-size: var(--fs-sm);
  font-weight: 800;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-bottom: 14px;
}
.sp-co-loading { padding: 60px 0; text-align: center; color: #94a3b8; font-size: var(--fs-base); }
.sp-co-loading--page { padding: 120px 0; }
.sp-co-empty {
  display: flex; flex-direction: column; align-items: center; gap: 16px;
  padding: 80px 0; text-align: center;
}
.sp-co-empty-icon { font-size: 48px; }
.sp-co-empty-title { font-size: var(--fs-xl); font-weight: 700; color: #0f172a; }
.sp-co-err {
  font-size: var(--fs-caption); color: #dc2626; background: #fef2f2;
  border: 1px solid #fecaca; border-radius: 10px; padding: 12px 14px;
}
.sp-co-err--standalone { margin-top: 8px; }

/* Status card */
.sp-co-status-card {
  display: flex; align-items: center; gap: 16px;
  background: #fff; border-radius: 16px; border: 1.5px solid;
  padding: 18px 20px; box-shadow: 0 4px 16px rgba(2,6,23,.05);
}
.sp-co-status-icon {
  width: 44px; height: 44px; border-radius: 999px; font-size: var(--fs-xl);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.sp-co-status-body { flex: 1 1; }
.sp-co-status-label { font-size: var(--fs-sm); color: #64748b; font-weight: 600; }
.sp-co-status-val { font-size: var(--fs-lg); font-weight: 800; }
.sp-co-refresh-btn {
  width: 32px; height: 32px; border: 1px solid #e2e8f0; border-radius: 8px;
  background: #f8fafc; cursor: pointer; font-size: var(--fs-md); color: #64748b;
  display: flex; align-items: center; justify-content: center;
}

/* Amounts */
.sp-co-amounts { display: flex; flex-direction: column; }
.sp-co-amount-row { display: flex; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid #f1f5f9; font-size: var(--fs-base); color: #475569; }
.sp-co-amount-row:last-child { border-bottom: 0; }
.sp-co-amount-row--main { font-weight: 700; color: #0f172a; font-size: var(--fs-body); }
.sp-co-amount-row--net { color: #059669; font-weight: 700; }
.sp-co-amount-val { font-weight: 700; }
.sp-co-fee-val { color: #dc2626; }
.sp-co-net-val { color: #059669; font-weight: 800; font-size: var(--fs-body); }

/* Detail table */
.sp-co-detail-table { display: flex; flex-direction: column; }
.sp-co-detail-row {
  display: flex; align-items: flex-start; gap: 16px;
  padding: 10px 0; border-bottom: 1px solid #f1f5f9;
}
.sp-co-detail-row:last-child { border-bottom: 0; }
.sp-co-detail-label { font-size: var(--fs-xs); font-weight: 700; color: #94a3b8; width: 110px; flex-shrink: 0; text-transform: uppercase; letter-spacing: .04em; padding-top: 2px; }
.sp-co-detail-val-wrap { display: flex; align-items: center; gap: 10px; flex: 1 1; min-width: 0; }
.sp-co-detail-val { font-size: var(--fs-caption); color: #0f172a; word-break: break-all; }

/* Actions card */
.sp-co-actions-card { background: #fffbeb; border-color: #fde68a; }
.sp-co-note-wrap { margin-bottom: 14px; }
.sp-co-note-input { max-width: 400px; background: #ffffff !important; border-color: #cbd5e1 !important; }
.sp-co-action-btns { display: flex; flex-wrap: wrap; gap: 10px; }
.sp-co-action-btn { height: 42px; padding: 0 20px; border-radius: 10px; border: none; font-size: var(--fs-caption); font-weight: 700; cursor: pointer; font-family: inherit; transition: all .15s; }
.sp-co-action-btn--primary { background: #2563eb; color: #fff; }
.sp-co-action-btn--primary:hover { background: #1d4ed8; }
.sp-co-action-btn--ghost { background: #f1f5f9; color: #475569; }
.sp-co-action-btn--ghost:hover { background: #e2e8f0; }
.sp-co-action-btn--danger { background: #fee2e2; color: #dc2626; }
.sp-co-action-btn--danger:hover { background: #fecaca; }
.sp-co-action-btn:disabled { opacity: .55; cursor: not-allowed; }
.sp-co-admin-cta { display: flex; align-items: center; gap: 10px; font-size: var(--fs-caption); color: #94a3b8; padding: 12px 0; }
.sp-co-admin-link { font-weight: 700; color: #2563eb; text-decoration: none; }
.sp-co-admin-link:hover { opacity: .78; }

/* Milestones */
.sp-co-milestones { display: flex; flex-direction: column; gap: 12px; }
.sp-co-ms-count { font-weight: 800; color: #0f172a; }
.sp-co-ms-bar-wrap { display: flex; align-items: center; gap: 10px; }
.sp-co-ms-bar { flex: 1 1; height: 8px; background: #f1f5f9; border-radius: 999px; overflow: hidden; }
.sp-co-ms-bar-fill { height: 100%; background: #059669; border-radius: 999px; transition: width .3s ease; }
.sp-co-ms-pct { font-size: var(--fs-sm); font-weight: 700; color: #059669; min-width: 32px; text-align: right; }
.sp-co-ms-list { display: flex; flex-direction: column; gap: 8px; }
.sp-co-ms-row { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 10px; background: #f8fafc; border: 1px solid #e2e8f0; transition: all .15s; }
.sp-co-ms-row.is-done { background: #f0fdf4; border-color: #bbf7d0; }
.sp-co-ms-check { width: 24px; height: 24px; border-radius: 999px; display: flex; align-items: center; justify-content: center; font-size: var(--fs-xs); font-weight: 800; flex-shrink: 0; background: #e2e8f0; color: #64748b; }
.sp-co-ms-row.is-done .sp-co-ms-check { background: #059669; color: #fff; }
.sp-co-ms-body { flex: 1 1; }
.sp-co-ms-label { font-size: var(--fs-caption); font-weight: 600; color: #0f172a; }
.sp-co-ms-date { font-size: var(--fs-xs); color: #94a3b8; margin-top: 2px; }
.sp-co-ms-meta { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; flex-shrink: 0; }
.sp-co-ms-pct-tag { font-size: var(--fs-xs); font-weight: 700; color: #94a3b8; }
.sp-co-ms-amt { font-size: var(--fs-sm); font-weight: 700; color: #059669; }

/* Events */
.sp-co-events { display: flex; flex-direction: column; gap: 10px; }
.sp-co-event-list { display: flex; flex-direction: column; gap: 0; }
.sp-co-event-row { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid #f1f5f9; }
.sp-co-event-row:last-child { border-bottom: 0; }
.sp-co-event-dot { width: 8px; height: 8px; border-radius: 999px; background: #2563eb; flex-shrink: 0; }
.sp-co-event-body { flex: 1 1; font-size: var(--fs-caption); color: #0f172a; }
.sp-co-event-type { font-weight: 700; text-transform: capitalize; }
.sp-co-event-note { color: #64748b; font-weight: 400; }
.sp-co-event-date { font-size: var(--fs-xs); color: #94a3b8; white-space: nowrap; }

/* Sidebar links */
.sp-co-sidebar-links { display: flex; flex-direction: column; gap: 8px; }
.sp-co-sidebar-link { font-size: var(--fs-caption); font-weight: 600; color: #2563eb; text-decoration: none; }
.sp-co-sidebar-link:hover { opacity: .78; }
.sp-lifecycle-row.is-current .sp-lifecycle-desc { font-weight: 700; color: #0f172a; }

/* ============================================================
   Admin Escrow List
   ============================================================ */
.sp-admin-header { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: 16px; padding: 40px 0 24px; }
.sp-admin-header-actions { display: flex; gap: 10px; align-items: center; }

.sp-admin-stats {
  display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 12px; gap: 12px; margin-bottom: 24px;
}
@media (max-width: 700px) { .sp-admin-stats { grid-template-columns: repeat(2, 1fr); } }
.sp-admin-stat {
  background: #fff; border-radius: 12px; border: 1.5px solid transparent;
  padding: 16px; box-shadow: 0 2px 10px rgba(2,6,23,.05); transition: all .15s;
}
.sp-admin-stat:hover { box-shadow: 0 4px 20px rgba(2,6,23,.1); }
.sp-admin-stat-count { font-size: var(--fs-3xl); font-weight: 800; line-height: 1; }
.sp-admin-stat-label { font-size: var(--fs-xs); font-weight: 700; color: #94a3b8; text-transform: uppercase; letter-spacing: .05em; margin-top: 4px; }

.sp-admin-filters { display: flex; flex-direction: column; gap: 10px; margin-bottom: 20px; }
.sp-admin-search { max-width: 100%; background: #ffffff !important; border-color: #cbd5e1 !important; }
.sp-admin-filter-row { display: flex; gap: 10px; }
.sp-admin-status-select { width: 160px; flex-shrink: 0; background: #ffffff !important; border-color: #cbd5e1 !important; }
.sp-admin-limit-select { width: 120px; flex-shrink: 0; background: #ffffff !important; border-color: #cbd5e1 !important; }

.sp-admin-gate { display: flex; flex-direction: column; align-items: center; gap: 16px; padding: 100px 0; text-align: center; }
.sp-admin-gate-icon { font-size: 48px; }
.sp-admin-gate-title { font-size: var(--fs-xl); font-weight: 800; color: #0f172a; }
.sp-admin-gate-desc { font-size: var(--fs-body); color: #64748b; }

.sp-admin-table-card {
  background: #fff; border-radius: 16px; border: 1px solid rgba(15,23,42,.08);
  box-shadow: 0 4px 16px rgba(2,6,23,.05); overflow: hidden; margin-bottom: 80px;
}
.sp-admin-table-meta { font-size: var(--fs-sm); color: #94a3b8; padding: 12px 20px; border-bottom: 1px solid #f1f5f9; }
.sp-admin-table-wrap { overflow-x: auto; }
.sp-admin-table { width: 100%; border-collapse: collapse; }
.sp-admin-table th {
  text-align: left; font-size: var(--fs-xs); font-weight: 800; color: #94a3b8;
  text-transform: uppercase; letter-spacing: .05em;
  padding: 12px 16px; background: #f8fafc; border-bottom: 1px solid #e2e8f0; white-space: nowrap;
}
.sp-admin-table td { padding: 13px 16px; border-bottom: 1px solid #f1f5f9; vertical-align: middle; }
.sp-admin-table tbody tr:last-child td { border-bottom: 0; }
.sp-admin-table tbody tr:hover { background: #fafbff; }
.sp-admin-id { font-size: var(--fs-caption); font-weight: 600; color: #0f172a; }
.sp-admin-sub { font-size: var(--fs-xs); color: #94a3b8; margin-top: 2px; }
.sp-admin-amt { font-size: var(--fs-base); font-weight: 700; color: #0f172a; white-space: nowrap; }
.sp-admin-net { font-size: var(--fs-caption); color: #059669; font-weight: 600; white-space: nowrap; }
.sp-admin-empty { padding: 40px 16px; text-align: center; color: #94a3b8; font-size: var(--fs-base); }

.sp-admin-row-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.sp-admin-action-btn {
  height: 30px; padding: 0 12px; border-radius: 8px; border: 1px solid #e2e8f0;
  background: #f8fafc; color: #475569; font-size: var(--fs-sm); font-weight: 700;
  cursor: pointer; text-decoration: none; display: inline-flex; align-items: center;
  font-family: inherit; white-space: nowrap; transition: all .12s;
}
.sp-admin-action-btn:hover { border-color: #2563eb; color: #2563eb; background: rgba(37,99,235,.05); }
.sp-admin-action-btn--green { background: #d1fae5; color: #059669; border-color: #a7f3d0; }
.sp-admin-action-btn--green:hover { background: #a7f3d0; }
.sp-admin-action-btn--purple { background: #ede9fe; color: #7c3aed; border-color: #ddd6fe; }
.sp-admin-action-btn--purple:hover { background: #ddd6fe; }
.sp-admin-action-btn--red { background: #fee2e2; color: #dc2626; border-color: #fecaca; }
.sp-admin-action-btn--red:hover { background: #fecaca; }
.sp-admin-action-btn:disabled { opacity: .55; cursor: not-allowed; }

/* ============================================================
   Homepage precision CSS — safepay-homepage.css
   Appended to safepay.css / imported in layout
   ============================================================ */

/* ── Section utilities ── */
.sp-section-alt { background: #f8fafc; }

/* ── Section spacing guarantees ── */
/* Ensure all homepage sections have consistent spacing */
.sp-page--home > section,
body.safepay section {
  position: relative;
}

/* Card row spacing when y-gap-16 is used (doesn't exist, fallback) */
.sp-card-grid {
  display: grid;
  grid-gap: 20px;
  gap: 20px;
}
@media (min-width: 992px) { .sp-card-grid--3 { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 768px) and (max-width: 991px) { .sp-card-grid--3 { grid-template-columns: repeat(2, 1fr); } }

/* sp-readdy-section-title spacing */
.sp-readdy-section-title {
  margin-bottom: 0;
}
.sp-readdy-section-title h2 {
  line-height: 1.15 !important;
}


/* ── Problem cards ── */
.sp-problem-card {
  background: #fff;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 18px;
  padding: 28px 26px;
  height: 100%;
  transition: box-shadow .2s ease;
}
.sp-problem-card:hover { box-shadow: 0 10px 32px rgba(2,6,23,.10); }
.sp-problem-icon { font-size: var(--fs-4xl); }

/* ── Feature cards (Solution) ── */
.sp-feature-card {
  background: #fff;
  border: 1px solid rgba(15,23,42,.07);
  border-radius: 18px;
  padding: 30px 26px;
  height: 100%;
  box-shadow: 0 4px 18px rgba(2,6,23,.06);
  transition: box-shadow .2s ease, transform .2s ease;
}
.sp-feature-card:hover { box-shadow: 0 12px 36px rgba(2,6,23,.10); transform: translateY(-2px); }
.sp-feature-icon { font-size: var(--fs-4xl); }

/* ── Step cards ── */
.sp-step-card {
  background: #fff;
  border: 1px solid rgba(15,23,42,.07);
  border-radius: 16px;
  padding: 26px 24px 28px;
  height: 100%;
}
.sp-step-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background: #2563eb;
  color: #fff;
  font-size: var(--fs-base);
  font-weight: 800;
}

/* ── Trust cards ── */
.sp-trust-card {
  background: #fff;
  border: 1px solid rgba(15,23,42,.07);
  border-radius: 16px;
  padding: 22px;
  height: 100%;
}
.sp-trust-icon { font-size: var(--fs-2xl); }

/* ── Testimonial cards ── */
.sp-testimonial-card {
  background: #fff;
  border: 1px solid rgba(15,23,42,.07);
  border-radius: 18px;
  padding: 24px;
  height: 100%;
}
.sp-testimonial-stars { color: #f59e0b; font-size: var(--fs-base); letter-spacing: 2px; }

/* ── Pricing cards ── */
.sp-pricing-card {
  background: #fff;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 20px;
  padding: 28px 26px 26px;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.sp-pricing-card--featured {
  background: #1e3a8a;
  border-color: transparent;
  box-shadow: 0 16px 48px rgba(30,58,138,.30);
}
.sp-pricing-badge {
  display: inline-block;
  font-size: var(--fs-sm);
  font-weight: 700;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.sp-pricing-badge--blue {
  color: #93c5fd;
}
.sp-pricing-rate {
  font-size: 48px;
  font-weight: 900;
  color: #0f172a;
  letter-spacing: -0.04em;
  line-height: 1;
  margin-top: 14px;
}
.sp-pricing-card--featured .sp-pricing-rate { color: #fff; }
.sp-pricing-list {
  list-style: none;
  padding: 0;
  margin: 18px 0 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1 1;
}
.sp-pricing-list li { font-size: var(--fs-caption); color: #475569; }
.sp-pricing-card--featured .sp-pricing-list li { color: #bfdbfe; }
.sp-pricing-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 46px;
  border-radius: 12px;
  font-size: var(--fs-base);
  font-weight: 700;
  text-decoration: none;
  margin-top: 22px;
  cursor: pointer;
  border: 0;
  font-family: inherit;
  transition: all .15s;
}
.sp-pricing-btn--primary {
  background: #2563eb;
  color: #fff;
  padding: 0 24px;
}
.sp-pricing-btn--primary:hover { background: #1d4ed8; }
.sp-pricing-btn--outline {
  border: 1.5px solid rgba(15,23,42,.18);
  background: transparent;
  color: #0f172a;
  padding: 0 24px;
}
.sp-pricing-btn--outline:hover { border-color: #2563eb; color: #2563eb; }
.sp-pricing-card--featured .sp-pricing-btn--primary {
  background: #fff;
  color: #1e3a8a;
}
.sp-pricing-card--featured .sp-pricing-btn--primary:hover { background: #f0f9ff; }

/* ── Compare table ── */
.sp-compare-table-wrap {
  overflow-x: auto;
  border-radius: 16px;
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 0 4px 18px rgba(2,6,23,.06);
}
.sp-compare-table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  border-radius: 16px;
  overflow: hidden;
}
.sp-compare-table th {
  text-align: left;
  font-size: var(--fs-sm);
  font-weight: 800;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: .05em;
  padding: 14px 18px;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
  white-space: nowrap;
}
.sp-compare-th--highlight {
  background: #eff6ff !important;
  color: #2563eb !important;
}
.sp-compare-table td {
  padding: 13px 18px;
  font-size: var(--fs-base);
  color: #475569;
  border-bottom: 1px solid #f1f5f9;
  vertical-align: middle;
}
.sp-compare-table tbody tr:last-child td { border-bottom: 0; }
.sp-compare-table tbody tr:hover { background: #fafbff; }
.sp-compare-feature { font-weight: 700; color: #0f172a !important; }
.sp-compare-td--highlight { background: #f0f9ff; color: #1d4ed8 !important; font-weight: 700; }

/* ── CTA cards ── */
.sp-cta-card {
  background: #fff;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 20px;
  padding: 30px;
  height: 100%;
  display: flex;
  flex-direction: column;
  box-shadow: 0 6px 24px rgba(2,6,23,.07);
}
.sp-cta-icon { font-size: var(--fs-5xl); }
.sp-cta-btn {
  display: inline-flex;
  align-items: center;
  height: 48px;
  padding: 0 24px;
  border-radius: 12px;
  font-size: var(--fs-base);
  font-weight: 700;
  text-decoration: none;
  width: -moz-fit-content;
  width: fit-content;
  transition: all .15s;
}
.sp-cta-btn--primary { background: #2563eb; color: #fff; }
.sp-cta-btn--primary:hover { background: #1d4ed8; }
.sp-cta-btn--outline { border: 1.5px solid rgba(15,23,42,.18); color: #0f172a; }
.sp-cta-btn--outline:hover { border-color: #2563eb; color: #2563eb; }

/* ── Friday back-link in header ── */
.sp-friday-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 36px;
  padding: 0 14px;
  border-radius: 10px;
  border: 1.5px solid rgba(15,23,42,.14);
  background: #f8fafc;
  color: #334155;
  font-size: var(--fs-caption);
  font-weight: 700;
  text-decoration: none;
  transition: all .15s;
  white-space: nowrap;
}
.sp-friday-link:hover { border-color: #2563eb; color: #2563eb; background: rgba(37,99,235,.05); }
.sp-friday-link__icon { width: 18px; height: 18px; object-fit: contain; }
.sp-friday-link--mobile { font-size: var(--fs-caption); font-weight: 600; color: #2563eb; border: none; background: transparent; padding: 0; height: auto; }

/* ── FAQ transition fix ── */
body.safepay .sp-faq-a { min-height: 0; }

/* ── Section head eyebrow ── */
.sp-readdy-section-title .eyebrow {
  display: inline-block;
  font-size: var(--fs-sm);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: #2563eb;
  background: rgba(37,99,235,.08);
  padding: 5px 12px;
  border-radius: 999px;
}

/*!***************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/sp-design.css ***!
  \***************************************************************************************************************************************************************************************************************************************************************************/
/* ================================================================
   SafePay Design System — sp-design.css
   Single source of truth. Imported after safepay.css.
   All classes use sp- prefix to avoid conflicts.
   ================================================================ */

/* ── Design tokens ─────────────────────────────────────────────── */
:root {
  /* Colors */
  --sp-blue:       #2563eb;
  --sp-blue-dk:    #1d4ed8;
  --sp-blue-lt:    #eff6ff;
  --sp-ink:        #0f172a;
  --sp-ink-2:      #334155;
  --sp-ink-3:      #475569;
  --sp-muted:      #64748b;
  --sp-subtle:     #94a3b8;
  --sp-line:       rgba(15,23,42,.08);
  --sp-line-md:    rgba(15,23,42,.12);
  --sp-bg:         #ffffff;
  --sp-bg-alt:     #f8fafc;
  --sp-danger:     #dc2626;

  /* Spacing scale (section) */
  --sp-section-v:  88px;
  --sp-section-v-sm: 60px;

  /* Card */
  --sp-card-r:     18px;
  --sp-card-p:     26px;
  --sp-card-shadow: 0 2px 8px rgba(2,6,23,.06), 0 0 0 1px rgba(15,23,42,.07);
  --sp-card-shadow-hover: 0 8px 28px rgba(2,6,23,.10), 0 0 0 1px rgba(15,23,42,.09);
}

/* ── Section layout ─────────────────────────────────────────────── */
.sp-section {
  padding-top: var(--sp-section-v);
  padding-bottom: var(--sp-section-v);
}
.sp-section--hero {
  padding-top: 80px;
  padding-bottom: 80px;
}
.sp-section--alt {
  background: var(--sp-bg-alt);
}
@media (max-width: 767px) {
  .sp-section { padding-top: var(--sp-section-v-sm); padding-bottom: var(--sp-section-v-sm); }
}

/* ── Section head ───────────────────────────────────────────────── */
.sp-section-head { max-width: 640px; margin: 0 auto; }
.sp-section-head.text-center { text-align: center; }

.sp-eyebrow {
  display: inline-flex;
  align-items: center;
  height: 26px;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(37,99,235,.09);
  border: 1px solid rgba(37,99,235,.18);
  font-size: var(--fs-xs);
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--sp-blue);
}

.sp-section-h2 {
  font-size: var(--fs-4xl);
  font-weight: 800;
  color: var(--sp-ink);
  letter-spacing: -0.025em;
  line-height: 1.18;
  margin: 0;
}

.sp-section-sub {
  font-size: var(--fs-md);
  color: var(--sp-muted);
  line-height: 1.65;
  margin: 0;
  max-width: 560px;
}
.text-center .sp-section-sub { margin-left: auto; margin-right: auto; }

/* ── Hero typography ────────────────────────────────────────────── */
.sp-hero-h1 {
  font-size: 44px;
  font-weight: 800;
  line-height: 1.12;
  letter-spacing: -0.03em;
  color: #ffffff;
  margin: 0;
}
@media (max-width: 767px) { .sp-hero-h1 { font-size: var(--fs-4xl); } }

.sp-hero-p {
  font-size: var(--fs-md);
  line-height: 1.7;
  color: rgba(255,255,255,.84);
  max-width: 480px;
  margin: 0;
}

/* ── Buttons ────────────────────────────────────────────────────── */
.sp-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 48px;
  padding: 0 24px;
  border-radius: 12px;
  font-size: var(--fs-base);
  font-weight: 700;
  text-decoration: none;
  border: none;
  cursor: pointer;
  font-family: inherit;
  white-space: nowrap;
  transition: background .14s ease, transform .1s ease, box-shadow .14s ease;
}
.sp-btn:active { transform: translateY(1px); }
.sp-btn:disabled { opacity: .5; cursor: not-allowed; }

.sp-btn--primary {
  background: var(--sp-blue);
  color: #ffffff;
  box-shadow: 0 2px 8px rgba(37,99,235,.28);
}
.sp-btn--primary:hover { background: var(--sp-blue-dk); box-shadow: 0 4px 16px rgba(37,99,235,.35); }

.sp-btn--outline {
  background: transparent;
  color: var(--sp-blue);
  border: 1.5px solid rgba(37,99,235,.30);
}
.sp-btn--outline:hover { border-color: var(--sp-blue); background: var(--sp-blue-lt); }

.sp-btn--ghost-white {
  background: rgba(255,255,255,.10);
  color: #ffffff;
  border: 1px solid rgba(255,255,255,.28);
  -webkit-backdrop-filter: blur(6px);
          backdrop-filter: blur(6px);
}
.sp-btn--ghost-white:hover { background: rgba(255,255,255,.18); }

.sp-btn--full { width: 100%; }
.sp-btn--sm { height: 40px; padding: 0 18px; font-size: var(--fs-sm); border-radius: 10px; }

/* Hero CTA row */
.sp-hero-cta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

/* ── Cards ──────────────────────────────────────────────────────── */
.sp-card {
  background: var(--sp-bg);
  border-radius: var(--sp-card-r);
  padding: var(--sp-card-p);
  box-shadow: var(--sp-card-shadow);
  height: 100%;
  transition: box-shadow .2s ease, transform .2s ease;
}
.sp-card:hover {
  box-shadow: var(--sp-card-shadow-hover);
  transform: translateY(-2px);
}
.sp-card--elevated {
  box-shadow: 0 6px 24px rgba(2,6,23,.09), 0 0 0 1px rgba(15,23,42,.07);
}
.sp-card--step {
  padding: 26px;
  background: var(--sp-bg);
}
.sp-card--trust {
  padding: 24px;
}
.sp-card--testimonial {
  padding: 24px;
  background: var(--sp-bg);
}

.sp-card-icon { font-size: var(--fs-3xl); line-height: 1; display: block; }
.sp-card-body-text { color: var(--sp-ink-3); line-height: 1.65; }

.sp-step-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: var(--sp-blue);
  color: #ffffff;
  font-size: var(--fs-base);
  font-weight: 800;
}
.sp-stat-tag {
  display: inline-flex;
  align-items: center;
  height: 26px;
  padding: 0 10px;
  border-radius: 999px;
  background: var(--sp-blue-lt);
  color: var(--sp-blue);
  font-size: var(--fs-sm);
  font-weight: 800;
}
.sp-stars { color: #f59e0b; font-size: var(--fs-caption); letter-spacing: 2px; }

/* ── Pricing cards ──────────────────────────────────────────────── */
.sp-pricing-card {
  background: var(--sp-bg);
  border-radius: 20px;
  padding: 28px 26px;
  height: 100%;
  display: flex;
  flex-direction: column;
  box-shadow: var(--sp-card-shadow);
  border: 1.5px solid var(--sp-line);
}
.sp-pricing-card--featured {
  background: #1e3a8a;
  border-color: transparent;
  box-shadow: 0 12px 40px rgba(30,58,138,.35);
}
.sp-pricing-label { font-size: var(--fs-body); font-weight: 800; color: var(--sp-ink); }
.sp-pricing-sub { font-size: var(--fs-caption); color: var(--sp-muted); }
.sp-pricing-popular {
  display: inline-block;
  font-size: var(--fs-xs);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: #93c5fd;
}
.sp-pricing-rate {
  font-size: 52px;
  font-weight: 900;
  letter-spacing: -0.04em;
  color: var(--sp-ink);
  line-height: 1;
}
.sp-pricing-card--featured .sp-pricing-rate { color: #ffffff; }
.sp-pricing-card--featured .sp-pricing-label { color: #bfdbfe; }
.sp-pricing-features {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 9px;
  flex: 1 1;
}
.sp-pricing-features li { font-size: var(--fs-caption); color: var(--sp-ink-3); line-height: 1.5; }
.sp-pricing-card--featured .sp-pricing-features li { color: #bfdbfe; }
.sp-pricing-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 46px;
  border-radius: 12px;
  font-size: var(--fs-base);
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  border: none;
  font-family: inherit;
  transition: all .14s ease;
}
.sp-pricing-cta--primary {
  background: #ffffff;
  color: #1e3a8a;
}
.sp-pricing-cta--primary:hover { background: #e0f2fe; }
.sp-pricing-cta--outline {
  border: 1.5px solid var(--sp-line-md);
  color: var(--sp-ink-2);
  background: transparent;
}
.sp-pricing-cta--outline:hover { border-color: var(--sp-blue); color: var(--sp-blue); }

/* ── Compare table ──────────────────────────────────────────────── */
.sp-compare-wrap {
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(2,6,23,.07), 0 0 0 1px rgba(15,23,42,.08);
}
.sp-compare-table {
  width: 100%;
  border-collapse: collapse;
  background: var(--sp-bg);
}
.sp-compare-table th {
  text-align: left;
  font-size: var(--fs-xs);
  font-weight: 800;
  color: var(--sp-muted);
  text-transform: uppercase;
  letter-spacing: .06em;
  padding: 14px 20px;
  background: var(--sp-bg-alt);
  border-bottom: 1px solid var(--sp-line);
  white-space: nowrap;
}
.sp-compare-th-hl { background: #eff6ff !important; color: var(--sp-blue) !important; }
.sp-compare-table td {
  padding: 14px 20px;
  font-size: var(--fs-base);
  color: var(--sp-ink-3);
  border-bottom: 1px solid #f1f5f9;
  vertical-align: middle;
}
.sp-compare-table tbody tr:last-child td { border-bottom: 0; }
.sp-compare-table tbody tr:hover { background: #fafbff; }
.sp-compare-feature { font-weight: 700; color: var(--sp-ink) !important; }
.sp-compare-td-hl { color: var(--sp-blue) !important; font-weight: 700; background: #f0f9ff; }

/* ── FAQ ────────────────────────────────────────────────────────── */
.sp-faq-wrap {
  max-width: 860px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* Override the body.safepay rules with higher specificity */
body.safepay .sp-faq {
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-width: 860px;
  margin-left: auto;
  margin-right: auto;
}

body.safepay .sp-faq-item {
  border-radius: 14px !important;
  border: 1.5px solid var(--sp-line) !important;
  background: #ffffff !important;
  box-shadow: 0 1px 4px rgba(2,6,23,.05) !important;
  overflow: visible !important;   /* CRITICAL: grid animation needs this */
  transition: border-color .15s, box-shadow .15s;
}
body.safepay .sp-faq-item:hover {
  border-color: rgba(37,99,235,.22) !important;
  box-shadow: 0 4px 16px rgba(2,6,23,.08) !important;
}

body.safepay .sp-faq-btn {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 20px 22px !important;
  background: transparent;
  border: 0;
  text-align: left;
  cursor: pointer;
  font-family: inherit;
  border-radius: 14px;
}
body.safepay .sp-faq-item.is-open .sp-faq-btn {
  padding-bottom: 16px !important;
  border-bottom: 1px solid rgba(15,23,42,.07) !important;
  border-radius: 14px 14px 0 0;
}

body.safepay .sp-faq-q {
  font-size: var(--fs-body);
  font-weight: 700;
  color: var(--sp-ink);
  letter-spacing: -0.01em;
  line-height: 1.4;
}

body.safepay .sp-faq-icon {
  width: 30px;
  height: 30px;
  border-radius: 8px;
  border: 1.5px solid var(--sp-line-md) !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--sp-muted);
  font-size: var(--fs-md);
  font-weight: 800;
  flex: 0 0 auto;
  transition: all .18s ease;
}
body.safepay .sp-faq-item.is-open .sp-faq-icon {
  background: var(--sp-blue-lt) !important;
  border-color: rgba(37,99,235,.25) !important;
  color: var(--sp-blue) !important;
}

/* Grid animation — MUST have display:grid + default 0fr */
body.safepay .sp-faq-panel {
  display: grid !important;
  grid-template-rows: 0fr !important;
  transition: grid-template-rows .24s cubic-bezier(0.4, 0, 0.2, 1) !important;
}
body.safepay .sp-faq-item.is-open .sp-faq-panel {
  grid-template-rows: 1fr !important;
}

/* Inner: overflow:hidden + min-height:0 clips at 0fr */
body.safepay .sp-faq-a {
  overflow: hidden !important;
  min-height: 0 !important;
  padding: 0 22px 0 !important;
}
body.safepay .sp-faq-item.is-open .sp-faq-a {
  padding: 16px 22px 20px !important;
}

body.safepay .sp-faq-a .text-14 {
  color: var(--sp-ink-3);
  line-height: 1.7;
}

/* ── CTA cards ──────────────────────────────────────────────────── */
.sp-cta-card {
  background: var(--sp-bg);
  border-radius: 20px;
  padding: 30px;
  height: 100%;
  display: flex;
  flex-direction: column;
  box-shadow: 0 4px 20px rgba(2,6,23,.07), 0 0 0 1px rgba(15,23,42,.07);
}
.sp-cta-icon { font-size: var(--fs-4xl); line-height: 1; }

/* ── Hero card ──────────────────────────────────────────────────── */
.sp-hero-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 18px;
}

/* ── Hero input ── */
.sp-hero-input {
  display: block;
  width: 100%;
  height: 44px;
  border-radius: 10px;
  border: 1.5px solid rgba(255,255,255,.30);
  background: rgba(255,255,255,.12);
  color: #ffffff;
  font-size: var(--fs-base);
  font-weight: 500;
  padding: 0 12px;
  outline: none;
  font-family: inherit;
  transition: border-color .15s, background .15s;
}
.sp-hero-input::placeholder { color: rgba(255,255,255,.45); }
.sp-hero-input:focus {
  border-color: rgba(167,243,208,.60);
  background: rgba(255,255,255,.16);
  box-shadow: 0 0 0 3px rgba(167,243,208,.12);
}

.sp-field-label-white {
  display: block;
  font-size: var(--fs-sm);
  font-weight: 700;
  letter-spacing: .02em;
  color: rgba(255,255,255,.75);
  margin-bottom: 7px;
}

/* ── Milestone preview box ── */
.sp-milestone-preview {
  border-radius: 14px;
  background: #ffffff;                   /* solid white for crisp contrast */
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 0 2px 12px rgba(2,6,23,.14);
  padding: 14px 14px 12px;
  margin-top: 14px;
}
.sp-milestone-preview-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(15,23,42,.07);
}
.sp-milestone-preview-head span:first-child {
  font-size: var(--fs-sm);
  font-weight: 800;
  color: #0f172a;
  letter-spacing: .01em;
}
.sp-milestone-preview-head span:last-child {
  font-size: var(--fs-xs);
  font-weight: 600;
  color: #94a3b8;
}

.sp-milestone-list { display: flex; flex-direction: column; gap: 7px; }
.sp-milestone-item {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 9px 11px;
  border-radius: 9px;
  background: #f8fafc;                   /* subtle off-white — distinct from container */
  border: 1px solid rgba(15,23,42,.07);
}
.sp-milestone-item-body { flex: 1 1; min-width: 0; }
.sp-milestone-item-title {
  font-size: var(--fs-caption);
  font-weight: 700;
  color: #0f172a;                        /* crisp dark ink */
  line-height: 1.3;
}
.sp-milestone-item-desc {
  font-size: var(--fs-xs);
  color: #64748b;                        /* medium gray — readable but secondary */
  margin-top: 2px;
  line-height: 1.45;
}

.sp-milestone-num {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #2563eb;                   /* solid blue badge */
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: var(--fs-xs);
  flex-shrink: 0;
  margin-top: 1px;                       /* optical align with first text line */
}

/* ── Friday link (header) ───────────────────────────────────────── */
.sp-friday-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 34px;
  padding: 0 12px;
  border-radius: 10px;
  border: 1.5px solid var(--sp-line-md);
  background: var(--sp-bg-alt);
  color: var(--sp-ink-2);
  font-size: var(--fs-caption);
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
  transition: all .14s ease;
}
.sp-friday-link:hover { border-color: var(--sp-blue); color: var(--sp-blue); background: var(--sp-blue-lt); }
.sp-friday-link__icon { width: 18px; height: 18px; object-fit: contain; }

/* ── Providers page ─────────────────────────────────────────────── */
.sp-providers-header {
  padding: 64px 0 56px;
  background: var(--sp-bg);
  border-bottom: 1px solid var(--sp-line);
}
.sp-page-kicker {
  font-size: var(--fs-sm);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--sp-blue);
}

/* ── Checkout & create pages ────────────────────────────────────── */
.sp-page--create .sp-create-header,
.sp-page--checkout .sp-co-header {
  padding-top: 48px;
  padding-bottom: 32px;
}
.sp-page-title {
  font-size: var(--fs-4xl);
  font-weight: 800;
  letter-spacing: -0.025em;
  color: var(--sp-ink);
  margin: 12px 0 0;
}
.sp-page-subtitle {
  font-size: var(--fs-body);
  color: var(--sp-muted);
  max-width: 520px;
  line-height: 1.65;
  margin: 8px 0 0;
}

/* ── Admin page ─────────────────────────────────────────────────── */
.sp-admin-header {
  padding: 48px 0 28px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 16px;
}

/* ── Legal pages ─────────────────────────────────────────────────── */
body.safepay .sp-page--legal {
  max-width: 860px;
  margin-left: auto;
  margin-right: auto;
  padding: 56px 16px 80px;
}

/* ── Responsive ─────────────────────────────────────────────────── */
@media (max-width: 991px) {
  .sp-section-h2 { font-size: var(--fs-2xl); }
  .sp-pricing-rate { font-size: 44px; }
  .sp-compare-table th, .sp-compare-table td { padding: 12px 14px; }
}
@media (max-width: 575px) {
  :root { --sp-section-v: 56px; --sp-card-p: 20px; }
  .sp-hero-h1 { font-size: var(--fs-3xl); }
  .sp-section-h2 { font-size: var(--fs-2xl); }
  .sp-pricing-rate { font-size: var(--fs-5xl); }
  .sp-cta-card { padding: 22px; }
  body.safepay .sp-faq-btn { padding: 18px 18px !important; }
  body.safepay .sp-faq-item.is-open .sp-faq-a { padding: 14px 18px 18px !important; }
  .sp-compare-wrap { overflow-x: auto; }
}

/* ================================================================
   Providers page
   ================================================================ */

/* ── Hero strip ── */
.sp-pv-hero {
  background: linear-gradient(135deg, #0f172a 0%, #1a2744 60%, #0f172a 100%);
  border-bottom: 1px solid rgba(255,255,255,.06);
  padding: 56px 0 52px;
  /* Remove header-margin gap */
  margin-top: -90px;
  padding-top: calc(90px + 56px);
}
@media (max-width: 767px) {
  .sp-pv-hero { margin-top: -80px; padding-top: calc(80px + 40px); padding-bottom: 40px; }
}

.sp-pv-hero-inner {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-gap: 48px;
  gap: 48px;
  align-items: center;
}
@media (max-width: 991px) {
  .sp-pv-hero-inner { grid-template-columns: 1fr; gap: 32px; }
}

.sp-pv-kicker {
  font-size: var(--fs-xs);
  font-weight: 800;
  letter-spacing: .10em;
  text-transform: uppercase;
  color: rgba(167,243,208,.85);
  margin-bottom: 14px;
}
.sp-pv-title {
  font-size: 44px;
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -0.03em;
  color: #ffffff;
  margin: 0 0 16px;
}
@media (max-width: 767px) { .sp-pv-title { font-size: var(--fs-4xl); } }

.sp-pv-sub {
  font-size: var(--fs-md);
  color: rgba(255,255,255,.65);
  line-height: 1.7;
  max-width: 520px;
  margin: 0 0 28px;
}
.sp-pv-cta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

/* Stats grid */
.sp-pv-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 12px;
  gap: 12px;
  min-width: 260px;
}
.sp-pv-stat {
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 14px;
  padding: 16px 18px;
  -webkit-backdrop-filter: blur(8px);
          backdrop-filter: blur(8px);
}
.sp-pv-stat-v {
  font-size: var(--fs-2xl);
  font-weight: 800;
  letter-spacing: -0.03em;
  color: #ffffff;
  line-height: 1;
}
.sp-pv-stat-k {
  font-size: var(--fs-sm);
  color: rgba(255,255,255,.55);
  margin-top: 4px;
  font-weight: 500;
}

/* ── Value cards ── */
.sp-pv-card {
  background: #ffffff;
  border-radius: 18px;
  padding: 26px;
  height: 100%;
  box-shadow: 0 2px 8px rgba(2,6,23,.06), 0 0 0 1px rgba(15,23,42,.07);
  transition: box-shadow .2s ease, transform .2s ease;
}
.sp-pv-card:hover {
  box-shadow: 0 8px 28px rgba(2,6,23,.10), 0 0 0 1px rgba(15,23,42,.09);
  transform: translateY(-2px);
}
.sp-pv-card-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  font-size: var(--fs-xl);
}
.sp-pv-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.sp-pv-list li {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: var(--fs-caption);
  font-weight: 600;
  color: #334155;
}
.sp-pv-list-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  flex-shrink: 0;
}

/* ── Bottom CTA ── */
.sp-pv-bottom-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  flex-wrap: wrap;
  background: #f0f7ff;
  border: 1.5px solid #bfdbfe;
  border-radius: 20px;
  padding: 36px 40px;
}
.sp-pv-bottom-btns {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  flex-shrink: 0;
}
@media (max-width: 767px) {
  .sp-pv-bottom-cta { padding: 28px 24px; }
  .sp-pv-bottom-btns { width: 100%; }
}

/* ================================================================
   Admin login page
   ================================================================ */

.sp-admin-login-page {
  min-height: 100vh;
  background: #f8fafc;
}

.sp-admin-login-header {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  padding: 18px 0;
  margin-top: -90px;
  padding-top: calc(90px + 18px);
  border-bottom: 1px solid rgba(255,255,255,.06);
}
@media (max-width: 767px) {
  .sp-admin-login-header { margin-top: -80px; padding-top: calc(80px + 18px); }
}

.sp-admin-login-wrap {
  display: grid;
  grid-template-columns: 1fr 420px;
  grid-gap: 48px;
  gap: 48px;
  align-items: start;
  padding: 56px 0 80px;
}
@media (max-width: 900px) {
  .sp-admin-login-wrap { grid-template-columns: 1fr; gap: 32px; padding: 40px 0 60px; }
}

/* ── Left info column ── */
.sp-admin-login-badge {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 26px;
  padding: 0 12px;
  border-radius: 999px;
  background: #fef9c3;
  border: 1px solid #fde047;
  font-size: var(--fs-xs);
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #854d0e;
  margin-bottom: 16px;
}
.sp-admin-badge-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #ca8a04;
}
.sp-admin-login-title {
  font-size: var(--fs-5xl);
  font-weight: 800;
  letter-spacing: -0.03em;
  color: #0f172a;
  margin: 0 0 14px;
  line-height: 1.1;
}
.sp-admin-login-desc {
  font-size: var(--fs-body);
  color: #475569;
  line-height: 1.7;
  max-width: 440px;
  margin: 0 0 32px;
}
.sp-admin-login-features {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 10px;
  gap: 10px;
}
.sp-admin-login-feature {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: var(--fs-caption);
  font-weight: 600;
  color: #334155;
  padding: 10px 14px;
  border-radius: 10px;
  background: #ffffff;
  border: 1px solid rgba(15,23,42,.07);
}

/* ── Right card ── */
.sp-admin-login-card {
  background: #ffffff;
  border-radius: 20px;
  padding: 32px;
  box-shadow: 0 4px 24px rgba(2,6,23,.09), 0 0 0 1px rgba(15,23,42,.07);
}

/* Checking state */
.sp-admin-checking {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: var(--fs-base);
  color: #64748b;
  padding: 16px 0;
}
.sp-admin-spinner {
  width: 18px;
  height: 18px;
  border: 2px solid #e2e8f0;
  border-top-color: #2563eb;
  border-radius: 50%;
  animation: sp-spin .6s linear infinite;
  flex-shrink: 0;
}

/* Active state */
.sp-admin-active-badge {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 26px;
  padding: 0 12px;
  border-radius: 999px;
  background: #d1fae5;
  border: 1px solid #6ee7b7;
  font-size: var(--fs-xs);
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #065f46;
  margin-bottom: 12px;
}
.sp-admin-active-dot {
  width: 6px; height: 6px; border-radius: 50%; background: #059669;
}
.sp-admin-active-desc {
  font-size: var(--fs-base);
  color: #475569;
  line-height: 1.6;
  margin: 0 0 20px;
}
.sp-admin-active-actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.sp-admin-logout-btn {
  height: 38px;
  border: 0;
  background: transparent;
  color: #94a3b8;
  font-size: var(--fs-caption);
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  text-align: left;
  padding: 0;
  transition: color .14s;
}
.sp-admin-logout-btn:hover { color: #dc2626; }

/* Login form */
.sp-admin-login-form-head {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 24px;
  padding-bottom: 20px;
  border-bottom: 1px solid rgba(15,23,42,.07);
}
.sp-admin-lock-icon { font-size: var(--fs-4xl); flex-shrink: 0; }
.sp-admin-form-title { font-size: var(--fs-lg); font-weight: 800; color: #0f172a; }
.sp-admin-form-sub { font-size: var(--fs-caption); color: #64748b; margin-top: 2px; }

.sp-admin-field { margin-bottom: 16px; }
.sp-admin-field-label {
  display: block;
  font-size: var(--fs-sm);
  font-weight: 700;
  color: #475569;
  text-transform: uppercase;
  letter-spacing: .05em;
  margin-bottom: 8px;
}
.sp-admin-input {
  display: block;
  width: 100%;
  height: 46px;
  padding: 0 12px;
  border: 1.5px solid #cbd5e1;
  border-radius: 10px;
  font-size: var(--fs-body);
  color: #0f172a;
  background: #f8fafc;
  outline: none;
  font-family: inherit;
  letter-spacing: .12em;
  transition: border-color .14s, background .14s, box-shadow .14s;
}
.sp-admin-input:focus {
  border-color: #2563eb;
  background: #ffffff;
  box-shadow: 0 0 0 3px rgba(37,99,235,.10);
}
.sp-admin-input::placeholder { letter-spacing: .06em; color: #cbd5e1; }

.sp-admin-submit { margin-top: 4px; }

.sp-admin-msg {
  margin-top: 14px;
  padding: 10px 14px;
  border-radius: 10px;
  font-size: var(--fs-caption);
  font-weight: 600;
}
.sp-admin-msg--ok { background: #d1fae5; color: #065f46; border: 1px solid #6ee7b7; }
.sp-admin-msg--err { background: #fee2e2; color: #991b1b; border: 1px solid #fca5a5; }

.sp-admin-note {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid rgba(15,23,42,.06);
  font-size: var(--fs-sm);
  color: #94a3b8;
  line-height: 1.6;
}
.sp-admin-note code {
  font-family: ui-monospace, monospace;
  font-size: var(--fs-xs);
  background: #f1f5f9;
  padding: 1px 5px;
  border-radius: 4px;
  color: #475569;
}

/* ─── SafepayHero (refined, balanced) ──────────────────────────────────── */
.safepayHero {
  padding: 40px 0 32px;
}
.safepayHero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  grid-gap: 36px;
  gap: 36px;
  align-items: center;
}
.safepayHero__copy {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-width: 0;
}
.safepayHero__eyebrow {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(37,99,235,0.08);
  color: #1d4ed8;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.safepayHero__title {
  margin: 0;
  font-size: clamp(1.75rem, 2.2vw + 0.4rem, 2.5rem);
  line-height: 1.15;
  font-weight: 700;
  letter-spacing: -0.015em;
  color: #0f172a;
  overflow-wrap: break-word;
  word-break: keep-all;
}
.safepayHero__titleBreak {
  display: inline;
}
@media (min-width: 900px) {
  .safepayHero__titleBreak {
    display: block;
  }
}
.safepayHero__lead {
  margin: 0;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #475569;
  max-width: 540px;
}
.safepayHero__ctaRow {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 4px;
}
.safepayHero__stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-gap: 10px;
  gap: 10px;
  margin-top: 6px;
}
.safepayHero__stat {
  padding: 10px 12px;
  border-radius: 10px;
  background: #f8fafc;
  border: 1px solid rgba(15,23,42,0.06);
}
.safepayHero__statValue {
  font-size: 1rem;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
}
.safepayHero__statLabel {
  margin-top: 2px;
  font-size: 0.75rem;
  color: #64748b;
  line-height: 1.3;
}
.safepayHero__panel {
  border-radius: 14px;
  background: #fff;
  border: 1px solid rgba(15,23,42,0.08);
  box-shadow: 0 12px 32px rgba(15,23,42,0.06);
  overflow: hidden;
}
.safepayHero__panelMedia {
  position: relative;
  aspect-ratio: 3 / 2;
  background: #f1f5f9;
  overflow: hidden;
}
.safepayHero__panelImg {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.safepayHero__panelBody {
  padding: 16px 18px 18px;
}
.safepayHero__panelTitle {
  font-size: 0.875rem;
  font-weight: 600;
  color: #0f172a;
  margin-bottom: 10px;
}
.safepayHero__milestones {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.safepayHero__milestone {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 10px;
  background: #f8fafc;
  border: 1px solid rgba(15,23,42,0.05);
}
.safepayHero__milestoneKicker {
  font-size: 0.75rem;
  color: #64748b;
  line-height: 1.2;
}
.safepayHero__milestoneTitle {
  margin-top: 2px;
  font-size: 0.875rem;
  font-weight: 500;
  color: #0f172a;
  line-height: 1.3;
}
.safepayHero__milestoneLock {
  font-size: 0.75rem;
  font-weight: 600;
  color: #2563eb;
  padding: 3px 8px;
  border-radius: 999px;
  background: rgba(37,99,235,0.08);
  white-space: nowrap;
}
@media (max-width: 900px) {
  .safepayHero {
    padding: 28px 0 24px;
  }
  .safepayHero__grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .safepayHero__stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/*!**********************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[12].use[3]!./src/app/styles/lc-system.css ***!
  \**********************************************************************************************************************************************************************************************************************************************************************************/
/* ═══════════════════════════════════════════════════════════════════════
   LC — Unified Typography + Card System (SafePay mirror of web app)
   Loaded LAST so it wins specificity without !important everywhere.
   Vendor utility overrides use !important because main.css also uses it.
   ═══════════════════════════════════════════════════════════════════════ */

:root {
  --lc-xs:      var(--fs-xs);
  --lc-sm:      var(--fs-sm);
  --lc-caption: var(--fs-caption);
  --lc-base:    var(--fs-base);
  --lc-body:    var(--fs-body);
  --lc-md:      var(--fs-md);
  --lc-lg:      var(--fs-lg);
  --lc-xl:      var(--fs-xl);
  --lc-h4: var(--fs-lg);
  --lc-h3: var(--fs-xl);
  --lc-h2: var(--fs-2xl);
  --lc-h1: var(--fs-3xl);
  --lc-display: var(--fs-4xl);

  --lc-card-radius: 14px;
  --lc-card-bg: #fff;
  --lc-card-border: 1px solid rgba(15, 23, 42, 0.08);
  --lc-card-border-hover: 1px solid rgba(15, 23, 42, 0.14);
  --lc-card-shadow: 0 4px 14px rgba(15, 23, 42, 0.05);
  --lc-card-shadow-hover: 0 12px 28px rgba(15, 23, 42, 0.10);
  --lc-card-transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease;

  --lc-ink-1: rgba(15, 23, 42, 0.95);
  --lc-ink-2: rgba(15, 23, 42, 0.78);
  --lc-ink-3: rgba(15, 23, 42, 0.62);
  --lc-ink-4: rgba(15, 23, 42, 0.48);
  --lc-brand: #2563eb;
}

.lc-eyebrow  { font-size: var(--lc-xs); font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--lc-ink-3); }
.lc-kicker   { font-size: var(--lc-caption); font-weight: 700; letter-spacing: 0.04em; color: var(--lc-brand); }
.lc-display  { font-size: clamp(1.75rem, 2vw + 0.6rem, var(--lc-display)); font-weight: 800; line-height: 1.15; letter-spacing: -0.02em; color: var(--lc-ink-1); }
.lc-h1       { font-size: clamp(1.5rem, 1.2vw + 0.6rem, var(--lc-h1));     font-weight: 800; line-height: 1.2;  letter-spacing: -0.015em; color: var(--lc-ink-1); }
.lc-h2       { font-size: var(--lc-h2); font-weight: 700; line-height: 1.25; letter-spacing: -0.01em; color: var(--lc-ink-1); }
.lc-h3       { font-size: var(--lc-h3); font-weight: 700; line-height: 1.3;  color: var(--lc-ink-1); }
.lc-h4       { font-size: var(--lc-h4); font-weight: 700; line-height: 1.35; color: var(--lc-ink-1); }

.lc-lead     { font-size: var(--lc-body); line-height: 1.6;  color: var(--lc-ink-3); }
.lc-body     { font-size: var(--lc-body); line-height: 1.65; color: var(--lc-ink-2); }
.lc-label    { font-size: var(--lc-base); font-weight: 600;  color: var(--lc-ink-1); }
.lc-caption  { font-size: var(--lc-caption); color: var(--lc-ink-3); }
.lc-meta     { font-size: var(--lc-sm); color: var(--lc-ink-4); }
.lc-xs-text  { font-size: var(--lc-xs); color: var(--lc-ink-4); }

.lc-display, .lc-h1, .lc-h2, .lc-h3, .lc-h4 {
  overflow-wrap: break-word;
  word-break: keep-all;
}

/* ─── Unified card shell ─────────────────────────────────────────── */
.lc-card {
  background: var(--lc-card-bg);
  border: var(--lc-card-border);
  border-radius: var(--lc-card-radius);
  box-shadow: var(--lc-card-shadow);
  overflow: hidden;
  transition: var(--lc-card-transition);
  text-decoration: none;
  color: inherit;
  display: block;
}
.lc-card:hover {
  box-shadow: var(--lc-card-shadow-hover);
  transform: translateY(-2px);
  border-color: rgba(15, 23, 42, 0.14);
}
.lc-card__media  { position: relative; aspect-ratio: 16 / 10; background: #f1f5f9; overflow: hidden; }
.lc-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.lc-card__body   { padding: 14px 18px 16px; display: flex; flex-direction: column; gap: 6px; }
.lc-card__kicker { font-size: var(--lc-sm); font-weight: 700; letter-spacing: 0.04em; color: var(--lc-brand); }
.lc-card__title  { font-size: var(--lc-lg); font-weight: 700; line-height: 1.3; color: var(--lc-ink-1); margin: 0; }
.lc-card__sub    { font-size: var(--lc-caption); line-height: 1.5; color: var(--lc-ink-3); margin: 0; }
.lc-card__meta   { font-size: var(--lc-sm); color: var(--lc-ink-4); }

/* ─── Retrofit existing safepay card classes ──────────────────────── */
/* Skip .sp-pricing-card — it has a featured variant with dark bg we must preserve */
.safepayHero__panel,
.sp-feature-card,
.sp-compare-card,
.sp-step-card {
  background: var(--lc-card-bg);
  border: var(--lc-card-border);
  border-radius: var(--lc-card-radius);
  box-shadow: var(--lc-card-shadow);
  transition: var(--lc-card-transition);
}

/* ─── Tame oversized vendor text utilities ─────────────────────────── */
.text-80, .text-60 { font-size: clamp(var(--fs-3xl), 3.2vw, var(--fs-5xl)) !important; line-height: 1.15 !important; }
.text-50, .text-44 { font-size: clamp(var(--fs-3xl), 2.4vw + 0.4rem, var(--fs-4xl)) !important; line-height: 1.18 !important; }
.text-40, .text-38 { font-size: clamp(var(--fs-2xl), 2vw + 0.4rem, var(--fs-4xl)) !important; line-height: 1.2 !important; }
.text-36, .text-34, .text-32, .text-30 { font-size: var(--fs-3xl) !important; line-height: 1.22 !important; }
.text-28 { font-size: var(--fs-3xl) !important; }
.text-26, .text-25, .text-24 { font-size: var(--fs-2xl) !important; }
.text-22, .text-20 { font-size: var(--fs-xl) !important; }
.text-18 { font-size: var(--fs-lg) !important; }
.text-17, .text-16 { font-size: var(--fs-md) !important; }
.text-15 { font-size: var(--fs-body) !important; }
.text-14 { font-size: var(--fs-base) !important; }
.text-13 { font-size: var(--fs-caption) !important; }
.text-12 { font-size: var(--fs-sm) !important; }
.text-11, .text-10 { font-size: var(--fs-xs) !important; }

/* ─── SafePay PageHero (was undefined — define it now) ─────────────── */
.sp-page-hero {
  padding: 40px 0 28px;
  background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
  border-bottom: 1px solid rgba(15, 23, 42, 0.06);
}
.sp-page-hero__inner {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
}
.sp-page-hero__kicker {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  margin-bottom: 10px;
  border-radius: 999px;
  background: rgba(37, 99, 235, 0.08);
  color: #1d4ed8;
  font-size: var(--fs-xs);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.sp-page-hero__title {
  margin: 0;
  font-size: clamp(var(--fs-2xl), 1.5vw + 0.6rem, var(--fs-4xl));
  line-height: 1.18;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--lc-ink-1);
  overflow-wrap: break-word;
  word-break: keep-all;
}
.sp-page-hero__desc {
  margin: 10px 0 0;
  font-size: var(--fs-body);
  line-height: 1.65;
  color: var(--lc-ink-3);
  max-width: 640px;
}
.sp-page-hero__actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
@media (max-width: 640px) {
  .sp-page-hero { padding: 28px 0 20px; }
  .sp-page-hero__inner { align-items: flex-start; }
}

/* ─── Detail page typography ───────────────────────────────────────── */
.lc-detail h1,
.lc-detail .lc-detail__title {
  font-size: clamp(var(--fs-2xl), 1.5vw + 0.8rem, var(--fs-4xl));
  font-weight: 800; line-height: 1.2; letter-spacing: -0.02em;
  color: var(--lc-ink-1);
  overflow-wrap: break-word; word-break: keep-all;
  margin: 0 0 0.6em;
}
.lc-detail h2 { font-size: var(--fs-2xl); font-weight: 700; line-height: 1.25; letter-spacing: -0.01em; margin: 1.6em 0 0.5em; color: var(--lc-ink-1); }
.lc-detail h3 { font-size: var(--fs-xl); font-weight: 700; line-height: 1.3;  margin: 1.3em 0 0.45em; color: var(--lc-ink-1); }
.lc-detail h4 { font-size: var(--fs-lg); font-weight: 600; line-height: 1.35; margin: 1.1em 0 0.4em; color: var(--lc-ink-1); }
.lc-detail p,
.lc-detail li { font-size: var(--fs-body); line-height: 1.85; color: var(--lc-ink-2); }
.lc-detail p { margin: 0 0 1em; }
.lc-detail blockquote {
  border-left: 3px solid rgba(15,23,42,0.18);
  padding: 4px 0 4px 16px;
  margin: 1.4em 0;
  color: var(--lc-ink-3);
  font-style: italic;
}
.lc-detail hr {
  border: 0;
  border-top: 1px solid rgba(15,23,42,0.08);
  margin: 2em 0;
}
.lc-detail code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.9em;
  background: rgba(15,23,42,0.04);
  padding: 2px 6px;
  border-radius: 4px;
}
.lc-detail pre {
  background: rgba(15,23,42,0.04);
  padding: 14px 16px;
  border-radius: 10px;
  overflow-x: auto;
  font-size: var(--fs-caption);
  line-height: 1.6;
}
.lc-detail img {
  max-width: 100%;
  border-radius: 10px;
  margin: 1em 0;
}

@media (max-width: 640px) {
  .text-80, .text-60, .text-50, .text-44 { font-size: var(--fs-3xl) !important; }
  .text-40, .text-38, .text-36, .text-34, .text-32, .text-30 { font-size: var(--fs-2xl) !important; }
}

