@charset "UTF-8";
/*-----------------------------------------------------------------------------------

    Project: GymGrid Marketing Website
    Description: GymGrid gym management software website styles
    Version: 1.0.0



**********************************************/
/*----------------------------------------*/
/*  1.1 Default
/*----------------------------------------*/
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:opsz,wght@9..40,100..1000&display=swap"');
/* beautify ignore:start */
.back-to-top-wrapper, a,
button,
p,
input,
textarea,
li {
  transition: all 0.3s ease-out;
}

/* transform */
/* beautify ignore:start */

.fz-ds-1 {
  font-size: 80px !important;
}

@media screen and (min-width: 1441px) {
  .fz-ds-1 {
    font-size: 124px !important;
  }
  .footer-2-connect-title {
    font-size: 220px;
  }
}

.topbar {
  border-bottom-right-radius: 16px;
  border-bottom-left-radius: 16px;
  padding: 7px 0;
}

.odometer {
  letter-spacing: 12px;
}

.px-blur-bottom {
  backdrop-filter: blur(10px);
  bottom: 0;
  flex: none;
  height: 80px;
  left: 0;
  -webkit-mask: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, black 100%) add;
          mask: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, black 100%) add;
  overflow: visible;
  position: fixed;
  right: 0;
  pointer-events: none;
  z-index: 999;
}

/* Text Truncation */

.border-100 {
  border: 1px solid var(--at-neutral-100) !important;
}

.border-top-100 {
  border-top: 1px solid var(--at-neutral-100) !important;
}

.home-3-section-12 .box-newsletter {
  position: relative;
  border-radius: 42px;
}
.home-3-section-12 .box-newsletter::before {
  content: "";
  position: absolute;
  bottom: -20px;
  left: 50%;
  transform: translateX(-50%);
  z-index: -1;
  width: 90%;
  height: 20%;
  border-radius: 42px;
  border: 1px solid var(--at-neutral-100, #dfdfdf);
  background: var(--at-neutral-0, #fefefe);
}

.input-subscribe {
  position: relative;
  background: #fefefe;
  padding: 12px 14px 12px 32px;
  border-radius: 8px;
}
.input-subscribe input {
  width: 100%;
  height: 100%;
  border: none !important;
  outline: none;
}

.size-56 {
  width: 56px;
  height: 56px;
}

/* Allow page scroll when cursor is in empty area; children (.client-capsule-wrapper > *) keep pointer-events: auto for drag */

:root {
  /**
  @font family declaration
  */
  --at-ff-body: 'DM Sans', sans-serif;
  --at-ff-heading: 'DM Sans', sans-serif;
  --at-ff-fontawesome: "Font Awesome 6 Pro";
  /**
  @font size declaration
  */
  --at-fz-body: 14px;
  --at-fz-font-label: 12px;
  --at-fz-font-md: 16px;
  --at-fz-font-lg: 20px;
  --at-fz-font-xl: 22px;
  --at-fz-font-2xl: 28px;
  --at-fz-font-3xl: 32px;
  --at-fz-ds-1: 124px;
  --at-fz-24: 24px;
  --at-fz-10: 10px;
  /**
  @color declaration
  */
  --at-common-white: #ffffff;
  --at-common-white-rgb: 255, 255, 255;
  --at-common-black: #1e1e1e;
  --at-common-black-rgb: 30, 30, 30;
  --at-common-bubbles: #e1eeb7;
  --at-common-dark-white: #1e1e1e;
  --at-common-dark-white-rgb: 30, 30, 30;
  --at-common-dark-black: #FFFFFF;
  --at-common-dark-black-rgb: 255, 255, 255;
  --at-common-dark-bubbles: #040403;
  --at-neutral-0: #FEFEFE;
  --at-neutral-0-rgb: 254, 254, 254;
  --at-neutral-50: #F2F2F2;
  --at-neutral-50-rgb: 242, 242, 242;
  --at-neutral-100: #DFDFDF;
  --at-neutral-200: #CDCCCC;
  --at-neutral-300: #B7B7B7;
  --at-neutral-500: #585959;
  --at-neutral-700: #303030;
  --at-neutral-800: #212121;
  --at-neutral-900: #1D1D1D;
  --at-neutral-950: #0F0F0F;
  --at-neutral-dark-0: #0C0C0C;
  --at-neutral-dark-0-rgb: 12, 12, 12;
  --at-neutral-dark-50: #141414;
  --at-neutral-dark-50-rgb: 20, 20, 20;
  --at-neutral-dark-100: #212121;
  --at-neutral-dark-200: #2D2D2D;
  --at-neutral-dark-300: #404040;
  --at-neutral-dark-500: #B3B3B3;
  --at-neutral-dark-700: #535353;
  --at-neutral-dark-800: #EAEAEA;
  --at-neutral-dark-900: #EFEFEF;
  --at-neutral-dark-950: #F4F4F4;
  --at-grey-1: #5e5959;
  --at-grey-2: #f3f3f3;
  --at-grey-3: #b6bcc6;
  --at-grey-4: #f6f6f6;
  --at-grey-5: #d7cdcd;
  --at-theme-primary: #FF5701;
  --at-gradient-primary: linear-gradient(90deg, #a020f0 0%, #00ffd1 100%);
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/*---------------------------------
	typography css start 
---------------------------------*/
body {
  font-size: 16px;
  line-height: 1.2;
  font-weight: normal;
  color: var(--at-neutral-900);
  background-color: var(--at-neutral-0);
  font-family: var(--at-ff-body);
}

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

a {
  text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin-top: 0px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -5%;
  transition: color 0.3s ease-out;
  color: var(--at-neutral-900);
  font-family: var(--at-ff-body);
}

h1,
.h1 {
  font-size: 70px;
}

h2,
.h2 {
  font-size: 60px;
}

h3,
.h3 {
  font-size: 52px;
}

h4,
.h4 {
  font-size: 38px;
}

h5,
.h5 {
  font-size: 26px;
}

h6,
.h6 {
  font-size: 20px;
}

.fz-font-lg {
  font-size: 18px !important;
}

@media screen and (min-width: 1401px) {
  h1,
  .h1 {
    font-size: 84px;
  }
  h2,
  .h2 {
    font-size: 72px;
  }
  h3,
  .h3 {
    font-size: 64px;
  }
  h4,
  .h4 {
    font-size: 48px;
  }
  h5,
  .h5 {
    font-size: 34px;
  }
  h6,
  .h6 {
    font-size: 24px;
  }
  .fz-font-lg {
    font-size: 20px !important;
  }
}
ul {
  margin: 0px;
  padding: 0px;
}

p {
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 15px;
  letter-spacing: -2%;
  line-height: 1.2;
  font-family: var(--at-ff-body);
  color: var(--at-neutral-500);
}

a:not([href]):not([class]),
a:not([href]):not([class]):hover {
  color: inherit;
  text-decoration: none;
}

a:focus,
.button:focus {
  text-decoration: none;
  outline: none;
}

a:focus,
a:hover {
  color: inherit;
  text-decoration: none;
}

a,
button {
  color: inherit;
  outline: none;
  border: none;
  background: transparent;
}

button:hover {
  cursor: pointer;
}

button:focus {
  outline: 0;
}

input[type=text],
input[type=email],
input[type=tel],
input[type=number],
textarea {
  outline: none;
  height: 56px;
  width: 100%;
  line-height: 56px;
  font-size: 14px;
  color: var(--at-neutral-900);
}
input[type=text]::-moz-placeholder,
input[type=email]::-moz-placeholder,
input[type=tel]::-moz-placeholder,
input[type=number]::-moz-placeholder,
textarea::-moz-placeholder {
  /* Firefox 19+ */
  color: var(--at-neutral-500);
}
input[type=text]::-moz-placeholder, input[type=email]::-moz-placeholder, input[type=tel]::-moz-placeholder, input[type=number]::-moz-placeholder, textarea::-moz-placeholder {
  /* MODERN BROWSER */
  color: var(--at-neutral-500);
}
input[type=text]::placeholder,
input[type=email]::placeholder,
input[type=tel]::placeholder,
input[type=number]::placeholder,
textarea::placeholder {
  /* MODERN BROWSER */
  color: var(--at-neutral-500);
}
input[type=text]:focus,
input[type=email]:focus,
input[type=tel]:focus,
input[type=number]:focus,
textarea:focus {
  border-color: var(--at-neutral-900);
}
input[type=text]:focus::-moz-placeholder, input[type=email]:focus::-moz-placeholder, input[type=tel]:focus::-moz-placeholder, input[type=number]:focus::-moz-placeholder, textarea:focus::-moz-placeholder {
  opacity: 0;
}
input[type=text]:focus::placeholder,
input[type=email]:focus::placeholder,
input[type=tel]:focus::placeholder,
input[type=number]:focus::placeholder,
textarea:focus::placeholder {
  opacity: 0;
}

textarea {
  line-height: 1.4;
  padding-top: 17px;
  padding-bottom: 17px;
}

*::-moz-selection {
  background: var(--at-neutral-900);
  color: var(--at-neutral-0);
  text-shadow: none;
}

::-moz-selection {
  background: var(--at-neutral-900);
  color: var(--at-neutral-0);
  text-shadow: none;
}

::selection {
  background: var(--at-neutral-900);
  color: var(--at-neutral-0);
  text-shadow: none;
}

*::-moz-placeholder {
  color: var(--at-neutral-900);
  font-size: 14px;
  opacity: 1;
}

*::placeholder {
  color: var(--at-neutral-900);
  font-size: 14px;
  opacity: 1;
}

/*---------------------------------
    1.1 Common Classes
---------------------------------*/

.fix {
  overflow: hidden;
}

.clear {
  clear: both;
}

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

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

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

.p-relative {
  position: relative;
}

.p-absolute {
  position: absolute;
}

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

.bg-cover {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
@media (min-width: 1400px) {
  .container-2200 {
    max-width: 2200px;
    margin-left: auto;
    margin-right: auto;
  }
}

/* Font weight */

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

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

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

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

/* Font size */

.fz-font-label {
  font-size: var(--at-fz-font-label);
}

.fz-font-md {
  font-size: var(--at-fz-font-md);
}

.fz-font-lg {
  font-size: var(--at-fz-font-lg);
}

.fz-font-xl {
  font-size: var(--at-fz-font-xl);
}

.fz-font-2xl {
  font-size: var(--at-fz-font-2xl);
}

.fz-ds-1 {
  font-size: var(--at-fz-ds-1);
}

.fz-24 {
  font-size: var(--at-fz-24);
}

/* Color */
.common-white {
  color: var(--at-common-white) !important;
}

.common-black {
  color: var(--at-common-black) !important;
}

.neutral-500 {
  color: var(--at-neutral-500) !important;
}

.neutral-700 {
  color: var(--at-neutral-700) !important;
}

.neutral-900 {
  color: var(--at-neutral-900) !important;
}

/* Background Color */

.bg-neutral-0 {
  background-color: var(--at-neutral-0) !important;
}

.bg-neutral-50 {
  background-color: var(--at-neutral-50) !important;
}

.bg-neutral-900 {
  background-color: var(--at-neutral-900) !important;
}

.bg-neutral-950 {
  background-color: var(--at-neutral-950) !important;
}

#smooth-content {
  pointer-events: none;
}
#smooth-content > * {
  pointer-events: auto;
}
#smooth-content main {
  position: relative;
  z-index: 2;
  will-change: transform;
  min-height: 100vh;
}

.footer-site-bottom {
  position: relative;
  z-index: 2;
}

/*---------------------------------
    1.2 Default Spacing
---------------------------------*/

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 574.98px) {
  .pt-150 {
    padding-top: 100px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 574.98px) {
  .pt-120 {
    padding-top: 80px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 574.98px) {
  .pt-100 {
    padding-top: 60px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 574.98px) {
  .pb-120 {
    padding-bottom: 80px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 574.98px) {
  .pb-100 {
    padding-bottom: 60px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  /* Font size */
  .fz-font-label {
    font-size: 12px !important;
  }
  .fz-font-md {
    font-size: 18px !important;
  }
  .fz-font-lg {
    font-size: 20px !important;
  }
  .fz-font-xl {
    font-size: 22px !important;
  }
  .fz-font-2xl {
    font-size: 26px !important;
  }
  .fz-ds-1 {
    font-size: 72px !important;
  }
  h1,
  .h1 {
    font-size: 58px;
  }
  h2,
  .h2 {
    font-size: 50px;
  }
  h3,
  .h3 {
    font-size: 42px;
  }
  h4,
  .h4 {
    font-size: 30px;
  }
  h5,
  .h5 {
    font-size: 28px;
  }
  h6,
  .h6 {
    font-size: 20px;
  }
  .d-md-none {
    display: none;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  /* Font size */
  .fz-font-label {
    font-size: 12px !important;
  }
  .fz-font-md {
    font-size: 16px !important;
  }
  .fz-font-lg {
    font-size: 18px !important;
  }
  .fz-font-xl {
    font-size: 20px !important;
  }
  .fz-font-2xl {
    font-size: 24px !important;
  }
  .fz-ds-1 {
    font-size: 60px !important;
  }
  h1,
  .h1 {
    font-size: 54px;
  }
  h2,
  .h2 {
    font-size: 52px;
  }
  h3,
  .h3 {
    font-size: 40px;
  }
  h4,
  .h4 {
    font-size: 36px;
  }
  h5,
  .h5 {
    font-size: 24px;
  }
  h6,
  .h6 {
    font-size: 20px;
  }
  br {
    display: none;
  }
  .d-md-none {
    display: none;
  }
}
@media (max-width: 574.98px) {
  /* Font size */
  .fz-font-label {
    font-size: 12px !important;
  }
  .fz-font-md {
    font-size: 14px !important;
  }
  .fz-font-lg {
    font-size: 16px !important;
  }
  .fz-font-xl {
    font-size: 18px !important;
  }
  .fz-font-2xl {
    font-size: 22px !important;
  }
  .fz-ds-1 {
    font-size: 54px !important;
  }
  h1,
  .h1 {
    font-size: 50px;
  }
  h2,
  .h2 {
    font-size: 42px;
  }
  h3,
  .h3 {
    font-size: 36px;
  }
  h4,
  .h4 {
    font-size: 30px;
  }
  h5,
  .h5 {
    font-size: 20px;
  }
  h6,
  .h6 {
    font-size: 16px;
  }
  br {
    display: none;
  }
}
@media (min-width: 1400px) {
  .container {
    max-width: 1750px;
  }
}
/* HEADER CSS */
/*----------------------------------------*/
/*  3.2 Header main
/*----------------------------------------*/
.at-header-sidebar-btn {
  display: flex;
  flex-direction: column;
  gap: 5px;
  width: 40px;
  height: 40px;
  align-items: center;
  justify-content: center;
  border-radius: 50px;
}
.at-header-logo {
  display: flex;
  align-items: center;
}
.at-header-logo a {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.at-header-spacing {
  padding: 10px 0;
}

.header-transparent {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 9;
  width: 100%;
}

/*----------------------------------------*/
/*  Header 7 (toggle inline nav)
/*----------------------------------------*/

/*----------------------------------------*/
/*  Header 8 — primary-coloured CTA button
/*----------------------------------------*/

:root {
  --basic-ease: cubic-bezier(.625, .05, 0, 1);
}

.at-title-text span {
  display: inline-block;
  text-shadow: 0 1.05em var(--at-theme-primary);
  transition: translate 0.3s var(--basic-ease), text-shadow 0.1s 0.15s ease;
}
.at-title-anim:hover .at-title-text span {
  text-shadow: 0 1.05em currentColor;
  translate: 0 -1.05em 0;
  transition: translate 0.5s calc((var(--char) - 1) * 0.024s) var(--basic-ease), text-shadow 0.175s calc((var(--char) - 1) * 0.024s + 0.225s) ease;
}

/* Header 12 (Home 12) */

/* Header 14 (Home 14 — Photography Showcase) */

/*----------------------------------------*/
/*  5.2 Postbox css
/*----------------------------------------*/

@keyframes postbox-marquee-left {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}
@keyframes postbox-marquee-right {
  0% {
    transform: translateX(-50%);
  }
  100% {
    transform: translateX(0);
  }
}
/*----------------------------------------*/
/*  5.1 Blog css
/*----------------------------------------*/
.blog-card {
  display: flex;
  flex-direction: column;
  gap: 25px;
}
.blog-card__thumb {
  position: relative;
  width: 100%;
}
.blog-card__img-link {
  display: block;
  width: 100%;
  height: 100%;
}
.blog-card__content {
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 100%;
}
.blog-card__title {
  font-weight: 600;
  color: var(--at-neutral-900);
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  max-height: 4.5em;
}
.blog-card__title-link {
  text-decoration: none;
  transition: color 0.3s ease;
}
.blog-card__title-link:hover {
  color: var(--at-theme-primary);
}
.blog-card__meta {
  font-family: var(--at-ff-body);
  font-size: 16px;
  font-weight: 500;
  line-height: 100%;
  color: #585959;
  margin: 0;
}
.blog-card__meta-text {
  color: #585959;
}
.blog-card__author {
  color: var(--at-neutral-900);
  text-decoration: none;
  transition: color 0.3s ease;
}
.blog-card__author:hover {
  color: var(--at-theme-primary, var(--at-neutral-900));
}

/* Blog card 2 – horizontal 3-column layout  */
.blog-card-2 {
  display: flex;
  align-items: center;
  gap: 40px;
  width: 100%;
  padding-bottom: 32px;
  border-bottom: 1px solid rgba(30, 30, 30, 0.08);
}
.blog-card-2-wrap:last-child .blog-card-2 {
  border-bottom: none;
  padding-bottom: 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 574.98px) {
  .blog-card-2 {
    flex-direction: column;
    align-items: stretch;
    gap: 24px;
  }
}
.blog-card-2__left {
  flex: 0 1 40%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 26px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 574.98px) {
  .blog-card-2__left {
    flex: none;
    order: 1;
  }
}
.blog-card-2__category {
  display: inline-block;
  font-family: var(--at-ff-body);
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--at-neutral-900);
  padding: 8px 16px;
  background: var(--at-common-white);
  border: 1px solid var(--at-neutral-100);
  border-radius: 50px;
  width: -moz-fit-content;
  width: fit-content;
}
.blog-card-2__title {
  margin: 0;
}
@media (max-width: 574.98px) {
  .blog-card-2__title {
    font-size: 18px;
  }
}
.blog-card-2__title-link {
  color: inherit;
  text-decoration: none;
  transition: color 0.3s ease;
}
.blog-card-2__title-link:hover {
  color: var(--at-theme-primary);
}
.blog-card-2__thumb {
  flex: 0 0 340px;
  width: 340px;
  height: 210px;
  overflow: hidden;
  border-radius: 12px;
  flex-shrink: 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 574.98px) {
  .blog-card-2__thumb {
    flex: none;
    width: 100%;
    height: 220px;
    order: 2;
  }
}
.blog-card-2__img-link {
  display: block;
  width: 100%;
  height: 100%;
}
.blog-card-2__img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 12px;
  transition: transform 0.5s ease;
}
.blog-card-2:hover .blog-card-2__img {
  transform: scale(1.05);
}
.blog-card-2__right {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 56px;
  justify-content: center;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 574.98px) {
  .blog-card-2__right {
    gap: 26px;
    flex: none;
    order: 3;
  }
}
.blog-card-2__excerpt {
  font-family: var(--at-ff-body);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
  color: #585959;
  margin: 0;
}
.blog-card-2__meta {
  font-family: var(--at-ff-body);
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  color: #585959;
  margin: 0;
}
.blog-card-2__meta-text {
  color: #585959;
}
.blog-card-2__author {
  color: var(--at-theme-primary, #FF5701);
  text-decoration: none;
  transition: color 0.3s ease;
}
.blog-card-2__author:hover {
  color: var(--at-common-black);
}

/* Blog card 3 – sidebar Flash news (compact horizontal) */

/* Product card – shop archive */

/*----------------------------------------*/
/*  4.1 Mobile Menu
/*----------------------------------------*/
.at-main-menu {
  padding: 5px 8px;
}
.at-main-menu nav ul li {
  list-style: none;
  display: inline-block;
  position: relative;
}
.at-main-menu nav ul li a {
  font-family: var(--at-ff-body);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: -0.02em;
  color: var(--at-common-black);
  padding: 10px 24px;
  display: inline-block;
  line-height: 1;
}
.at-main-menu nav ul li a:hover {
  color: var(--at-common-black);
}
.at-main-menu nav ul li a::before {
  content: "";
  position: absolute;
  bottom: -20px;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}

/*----------------------------------------*/
/*  4.x Main menu — text swap hover animation
/*  Wrapper .at-link-swap is injected by main.js (section 47c)
/*----------------------------------------*/
.at-main-menu > nav > ul > li > a {
  /* Descender room: wrapper has 4px padding-bottom for "g","p" tails;
     compensate link's bottom padding so total height stays 36px. */
  --link-desc-room: 4px;
  padding-bottom: calc(10px - var(--link-desc-room));
}

/* Trigger swap on the parent <li>:hover so the hit area covers the
   entire menu item (incl. empty space inside .menu-light.style-1
   where <a> is shorter than the 48px container). */

/*----------------------------------------*/
/*  4.3 offcanvas scss
/*----------------------------------------*/
.body-overlay {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 995;
  width: 100%;
  height: 100%;
  background: rgba(24, 24, 24, 0.5);
  visibility: hidden;
  opacity: 0;
  transition: 0.45s ease-in-out;
}
.body-overlay.apply {
  opacity: 1;
  visibility: visible;
}
.body-overlay:hover {
  cursor: url("../imgs/icons/cross-out.dfb4dac7f9fb.webp"), pointer;
}

.at-offcanvas {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: fixed;
  top: 0;
  right: -100%;
  width: 460px;
  bottom: 0;
  box-shadow: 0 16px -32px 0 rgba(0, 0, 0, 0.8);
  background-color: var(--at-common-white);
  z-index: 997;
  padding: 50px;
  scrollbar-width: none;
  opacity: 0;
  visibility: hidden;
  transition: 0.45s ease-in-out;
  overflow-y: scroll;
}
@media (max-width: 574.98px) {
  .at-offcanvas {
    width: 100%;
    padding: 40px 35px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .at-offcanvas {
    width: 400px;
    padding: 40px;
  }
}
.at-offcanvas-logo a {
  display: flex;
  align-items: center;
  gap: 4px;
}
.at-offcanvas.opened {
  opacity: 1;
  visibility: visible;
  right: 0;
  transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-duration: 0.6s;
}
.at-offcanvas-top {
  margin-bottom: 50px;
}
.at-offcanvas-close-btn button {
  color: rgba(var(--at-common-black), 1);
}
.at-offcanvas-close-btn button:hover {
  opacity: 1;
  transform: rotate(90deg);
}
.at-offcanvas-title {
  font-size: 64px;
  line-height: 1;
  letter-spacing: -0.8px;
  font-weight: 700;
  color: var(--at-common-black);
}
.at-offcanvas-title.sm {
  font-size: 36px;
  font-weight: 600;
  margin-bottom: 15px;
  color: var(--at-common-black);
}
.at-offcanvas-contact {
  margin-bottom: 55px;
}
.at-offcanvas-contact ul li {
  list-style: none;
}
.at-offcanvas-contact ul li:not(:last-child) {
  margin-bottom: 2px;
}
.at-offcanvas-contact ul li a {
  display: inline-block;
  color: var(--at-neutral-900);
  position: relative;
  font-family: var(--at-ff-body);
}
.at-offcanvas-gallery {
  margin-bottom: 65px;
}
.at-offcanvas-gallery-img {
  width: 65px;
  height: 65px;
  border-radius: 8px;
  overflow: hidden;
  padding: 4px;
  background: var(--at-neutral-50);
}
.at-offcanvas-gallery-img img {
  transition: 0.9s;
  border-radius: 4px;
  filter: grayscale(100%);
}
.at-offcanvas-gallery-img:hover img {
  transform: scale(1.2) rotate(-2deg);
}
.at-offcanvas-content p {
  font-size: 20px;
  font-weight: 500;
  line-height: normal;
  color: var(--at-neutral-900);
  font-family: var(--at-ff-body);
}

.at-offcanvas-social {
  margin-top: 40px;
  margin-bottom: 60px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 574.98px) {
  .at-offcanvas-social {
    margin-bottom: 40px;
  }
}
.at-offcanvas-social__grid {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 24px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.at-offcanvas-social__link {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  color: var(--at-common-black);
  font-size: 16px;
  font-weight: 500;
  font-family: var(--at-ff-body);
  text-decoration: none;
  transition: color 0.3s ease, opacity 0.3s ease;
}
.at-offcanvas-social__link:hover {
  color: var(--at-theme-primary, var(--at-common-black));
  opacity: 0.85;
}
.at-offcanvas-social__link svg {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
}

.at-offcanvas-2-wrapper {
  padding: 100px 100px 0px;
  position: relative;
  z-index: 2;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .at-offcanvas-2-wrapper {
    padding: 80px 50px 0px;
    padding-right: 60px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .at-offcanvas-2-wrapper {
    padding: 60px 50px 0px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 574.98px) {
  .at-offcanvas-2-wrapper {
    padding: 60px 30px 0px;
  }
}
.at-offcanvas-2-wrapper .at-offcanvas-menu > nav > ul > li {
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  transition: all 1.5s ease-in-out !important;
}
.at-offcanvas-2-wrapper .at-offcanvas-menu > nav > ul > li:nth-child(2) > a {
  transition-delay: 1.7s;
}
.at-offcanvas-2-wrapper .at-offcanvas-menu > nav > ul > li:nth-child(3) > a {
  transition-delay: 1.8s;
}
.at-offcanvas-2-wrapper .at-offcanvas-menu > nav > ul > li:nth-child(3) > a {
  transition-delay: 1.9s;
}
.at-offcanvas-2-wrapper .at-offcanvas-menu > nav > ul > li:nth-child(4) > a {
  transition-delay: 2s;
}
.at-offcanvas-2-wrapper .at-offcanvas-menu > nav > ul > li:nth-child(5) > a {
  transition-delay: 2.1s;
}
.at-offcanvas-2-wrapper .at-offcanvas-menu > nav > ul > li > a {
  font-size: 48px;
  padding: 0;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.04em;
  color: var(--at-common-black);
  font-family: var(--at-ff-body);
  transform: translateY(-300px);
  opacity: 0;
  visibility: hidden;
  transition: all 1.5s ease-in-out !important;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .at-offcanvas-2-wrapper .at-offcanvas-menu > nav > ul > li > a {
    font-size: 42px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .at-offcanvas-2-wrapper .at-offcanvas-menu > nav > ul > li > a {
    font-size: 54px;
  }
}
@media (max-width: 574.98px) {
  .at-offcanvas-2-wrapper .at-offcanvas-menu > nav > ul > li > a {
    font-size: 50px;
  }
}
.at-offcanvas-2-wrapper .at-offcanvas-menu > nav > ul > li .at-menu-close i {
  font-size: 28px;
  color: var(--at-common-black);
}
.at-offcanvas-2-wrapper .hamburger-close-btn {
  color: var(--at-common-black);
  cursor: pointer;
  transition: all 0.4s ease;
}
.at-offcanvas-2-wrapper .hamburger-close-btn:hover {
  transform: rotate(90deg);
}
.at-offcanvas-2-wrapper .hamburger-mobile-close-btn:hover {
  transform: rotate(0);
}
.at-offcanvas-2-wrapper .hamburger-mobile-close-btn {
  position: absolute;
  bottom: -100px;
  left: 0;
  right: 0;
  text-align: center;
  font-size: 20px;
}
.at-offcanvas-2-wrapper .hamburger-mobile-close-btn:hover {
  color: var(--at-theme-primary);
}
.at-offcanvas-2-wrapper .at-header-logo {
  transform: translateY(-80px);
  visibility: hidden;
  opacity: 0;
  transition-delay: 0s;
  transition: all 1.5s ease-in-out !important;
}
.at-offcanvas-2-left {
  opacity: 0;
  animation-delay: 1s;
  transform: translateY(20px);
}
.at-offcanvas-2-left .at-offcanvas-menu {
  border-bottom: 1px solid var(--at-neutral-100);
  padding-bottom: 105px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .at-offcanvas-2-left .at-offcanvas-menu {
    margin-bottom: 65px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 574.98px) {
  .at-offcanvas-2-left .at-offcanvas-menu {
    margin-bottom: 0;
  }
}
.at-offcanvas-2-left .at-offcanvas-menu ul {
  overflow: hidden;
  overflow-y: scroll;
  scrollbar-width: none;
  max-height: 450px;
  padding-top: 10px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .at-offcanvas-2-left .at-offcanvas-menu ul {
    max-height: 350px;
  }
}

.at-offcanvas-2-area.menu-open,
.at-offcanvas-2-area.menu-open-temp {
  position: fixed;
  top: 0;
  right: 0;
  left: auto;
  height: 100%;
  transition: all 0s 2s;
  width: 600px;
  z-index: 1000;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 574.98px) {
  .at-offcanvas-2-area.menu-open,
  .at-offcanvas-2-area.menu-open-temp {
    width: 100%;
  }
}

.at-offcanvas-2-area {
  position: fixed;
  left: 100%;
}
.at-offcanvas-2-area .offcanvas-bg {
  inset: 0;
  border-radius: 20px;
  clip-path: circle(0% at calc(100% - 45px) 45px);
  transition: clip-path 0.7s ease-in-out;
  position: fixed;
  width: 570px;
  margin: 20px;
  right: 0;
  left: auto;
  z-index: 2;
  backdrop-filter: blur(20px);
  background: rgb(var(--at-neutral-0-rgb), 0.9);
  box-shadow: 0 20px 30px -8px rgba(19, 19, 22, 0.1);
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 574.98px) {
  .at-offcanvas-2-area .offcanvas-bg {
    margin: 0;
    border-radius: 0;
    width: 100%;
  }
}
.at-offcanvas-2-area.menu-open .offcanvas-bg {
  clip-path: circle(150% at calc(100% - 45px) 45px);
}
.at-offcanvas-2-area.menu-open .offcanvas-menu {
  pointer-events: auto;
}
.at-offcanvas-2-area.menu-open .at-offcanvas-menu > nav > ul > li {
  visibility: visible;
  opacity: 1;
}
.at-offcanvas-2-area.menu-open .at-offcanvas-menu > nav > ul > li a {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
}
.at-offcanvas-2-area.menu-open .at-header-logo {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
}
.at-offcanvas-2-area.menu-open .at-offcanvas-2-left {
  opacity: 1;
  transform: translateY(0);
  transition-delay: calc(0.7s + 0.06s);
}
.at-offcanvas-2-area.menu-open .at-offcanvas-2-left .at-offcanvas-menu {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.6s cubic-bezier(0.2, 0.8, 0.2, 1), transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1);
  transition-delay: calc(calc(0.7s + 0.06s) + 0.2s);
}
.at-offcanvas-2-area:not(.menu-open) .offcanvas-menu {
  pointer-events: none;
}
.at-offcanvas-2-area:not(.menu-open) .at-offcanvas-2-left {
  transition-delay: 0.6s;
  opacity: 0;
  transform: translateY(30px);
}
.at-offcanvas-2-area:not(.menu-open) .at-offcanvas-2-left .at-offcanvas-menu {
  opacity: 0;
  transform: translateY(20px);
  transition-delay: 0.4s;
}
.at-offcanvas-2-area:not(.menu-open) .offcanvas-bg {
  clip-path: circle(0% at calc(100% - 45px) 45px);
  transition-delay: 0.4s;
}

.hamburger-sticky-menu {
  border-radius: 16px;
  border: 1px solid var(--at-neutral-100, #DFDFDF);
  background: var(--at-neutral-0, #FEFEFE);
  color: var(--at-neutral-950);
  font-size: 16px;
  font-weight: 600;
  display: inline-flex;
  padding: 15px 24px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  position: absolute;
  top: 40px;
  right: 20px;
  z-index: 10;
  opacity: 0;
  visibility: hidden;
  transform: scale(0.5);
  transition-delay: 0.4s;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 574.98px) {
  .hamburger-sticky-menu {
    top: 20px;
    right: 20px;
    padding: 5px 10px;
    font-size: 14px;
  }
}
.hamburger-sticky-menu.header-sticky {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
  position: fixed;
}

/*----------------------------------------*/
/*  4.2 Mobile Menu
/*----------------------------------------*/
.at-offcanvas-menu ul {
  list-style: none;
}
.at-offcanvas-menu ul li {
  position: relative;
}
.at-offcanvas-menu ul li > a {
  padding: 7px 0;
  display: block;
  font-size: 18px;
  font-weight: 600;
}
.at-offcanvas-menu ul li.active > a {
  color: var(--at-common-black);
}
.at-offcanvas-menu ul li.active > .at-menu-close i {
  top: 10px;
  transform: rotate(90deg);
}

.at-menu-close {
  position: absolute;
  right: 7px;
  top: 12px;
}
.at-menu-close i {
  transition: all 0.3s;
  font-size: 18px;
  font-weight: 500;
}

/*----------------------------------------*/
/*  6.1 Footer Style 1
/*----------------------------------------*/
.at-footer-link .at-hero-social {
  justify-content: flex-start;
}
.at-footer-copyright {
  font-weight: 500;
  font-size: 16px;
  opacity: 0.5;
  color: var(--at-common-black);
}
.alt-footer-link-item ul li {
  list-style: none;
}
.alt-footer-link-item ul li a {
  font-weight: 400;
  font-size: 22px;
  letter-spacing: -0.02em;
  line-height: 1;
  color: var(--at-neutral-300);
  position: relative;
  background-image: linear-gradient(currentColor, currentColor), linear-gradient(currentColor, currentColor);
  background-size: 0 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  transition: background-size 0.3s linear;
  transition: all 0.4s ease 0.3s ease-out;
}
.alt-footer-link-item ul li a::before {
  content: "";
  width: 14px;
  height: 13px;
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="13" viewBox="0 0 14 13" fill="none"><g opacity="0.3" clip-path="url(%23clip0_1857_869)"><path d="M11.0037 3.41421L2.39712 12.0208L0.98291 10.6066L9.5895 2H2.00373V0H13.0037V11H11.0037V3.41421Z" fill="%23FEFEFE"/></g><defs><clipPath id="clip0_1857_869"><rect width="14" height="13" fill="white"/></clipPath></defs></svg>');
  margin-left: 14px;
  position: absolute;
  left: 100%;
  top: 50%;
  opacity: 0;
  transition: all 0.5s ease;
  transform: translate(-15px, -40%);
}
.alt-footer-link-item ul li a.fz-font-md::before {
  width: 12px;
  height: 12px;
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 14 13" fill="none"><g opacity="0.3" clip-path="url(%23clip0_1857_869)"><path d="M11.0037 3.41421L2.39712 12.0208L0.98291 10.6066L9.5895 2H2.00373V0H13.0037V11H11.0037V3.41421Z" fill="%23FEFEFE"/></g><defs><clipPath id="clip0_1857_869"><rect width="14" height="13" fill="white"/></clipPath></defs></svg>');
}
.alt-footer-link-item ul li a:hover {
  background-image: linear-gradient(currentColor, currentColor), linear-gradient(currentColor, currentColor);
  background-size: 0 1px, 100% 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  transition: background-size 0.3s linear;
  transition: all 0.4s ease 0.3s ease-out;
  color: var(--at-neutral-0);
}
.alt-footer-link-item ul li a:hover::before {
  opacity: 1;
  transform: translate(-50%, -50%);
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 574.98px) {
  .alt-footer-link-item-wrap {
    margin-left: 0;
    margin-right: 0;
  }
}

.mp-footer-style .at-hero-social a {
  color: var(--at-common-white);
  border: 1px solid rgba(255, 255, 255, 0.1);
}
.mp-footer-style .at-hero-social a:hover {
  background: var(--at-common-white);
  color: var(--at-common-black);
}
.mp-footer-style .at-footer-copyright {
  color: var(--at-common-white);
}

.text-scale-anim {
  white-space: pre-wrap;
  transform-origin: top left;
}

.at-letter-span {
  display: inline-block;
}

.at-word-span {
  display: inline-block;
}

/*----------------------------------------*/
/*  Footer Style 2
/*----------------------------------------*/
.footer-2-follow-label {
  font-size: 12px;
  letter-spacing: 0.02em;
  font-weight: 500;
}

.footer-2-border {
  border-top: 1px solid rgba(255, 255, 255, 0.3);
}

.footer-2-connect-title {
  font-weight: 500;
  font-size: 160px;
  letter-spacing: -11px;
  line-height: 1.1;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 574.98px) {
  .footer-2-connect-title {
    letter-spacing: 0;
    font-size: clamp(3rem, 4vw, 3rem);
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-2-connect-title {
    font-size: clamp(4rem, 4vw, 3rem);
  }
}

/*----------------------------------------*/
/*  Footer style 7 (Home 7)
/*----------------------------------------*/

/*----------------------------------------*/
/*  Footer style 8 (Home 8)
/*----------------------------------------*/

/*----------------------------------------*/
/*  Footer style 9 (Home 9)
/*----------------------------------------*/

/*----------------------------------------*/
/*  Footer style 10 (Home 10)
/*----------------------------------------*/

/*----------------------------------------*/
/*  Footer style 11 (Home 11)
/*----------------------------------------*/
@keyframes footer11-grid {
  from {
    transform: translate(0, 0);
  }
  to {
    transform: translate(57px, 57px);
  }
}
@keyframes footer11-scan {
  0% {
    top: -40%;
    opacity: 0;
  }
  8% {
    opacity: 1;
  }
  88% {
    opacity: 1;
  }
  100% {
    top: 115%;
    opacity: 0;
  }
}

/* Footer 12 (Home 12) — Always-dark CTA + main footer */
.footer-12 {
  background-color: #0f0f0f;
  color: #fefefe;
  position: relative;
  isolation: isolate;
}

/* ── CTA strip ──────────────────────────────────── */
.footer-12__cta {
  position: relative;
  z-index: 1;
  padding-top: 120px;
  padding-bottom: 120px;
  overflow: hidden;
  background-color: #0f0f0f;
  isolation: isolate;
}
.footer-12__cta::before,
.footer-12__cta::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.footer-12__cta::before {
  z-index: -2;
  background-image: url("../imgs/optimized/banner-960.90beca5738b0.webp");
  background-image: image-set(
    url("../imgs/optimized/banner-960.a93196b5857f.avif") type("image/avif"),
    url("../imgs/optimized/banner-960.90beca5738b0.webp") type("image/webp")
  );
  background-position: center 48%;
  background-repeat: no-repeat;
  background-size: cover;
  filter: saturate(0.82) contrast(1.08);
  transform: scale(1.015);
}
.footer-12__cta::after {
  z-index: -1;
  background:
    radial-gradient(circle at 78% 24%, rgba(255, 87, 1, 0.14), transparent 28%),
    linear-gradient(180deg, rgba(8, 8, 8, 0.78) 0%, rgba(8, 8, 8, 0.84) 58%, #0f0f0f 100%);
}

.footer-12__cta-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  row-gap: 20px;
}

.footer-12__cta-pill {
  display: inline-flex;
  align-items: center;
  -moz-column-gap: 8px;
       column-gap: 8px;
  padding: 7px 14px;
  background-color: #212121;
  border: 1px solid #303030;
  border-radius: 999px;
}

.footer-12__cta-pill-dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background-color: var(--at-theme-primary);
}

.footer-12__cta-pill-text {
  font-family: var(--at-ff-heading);
  font-weight: 500;
  font-size: 13px;
  line-height: 1;
  letter-spacing: -0.02em;
  color: #fefefe;
  white-space: nowrap;
}

.footer-12__cta-title {
  max-width: 1080px;
  font-family: var(--at-ff-heading);
  font-weight: 600;
  font-size: clamp(40px, 5.6vw, 76px);
  line-height: 0.98;
  letter-spacing: -0.045em;
  color: #fefefe;
  text-align: center;
}

.footer-12__cta-sub {
  max-width: 760px;
  font-family: var(--at-ff-heading);
  font-weight: 500;
  font-size: clamp(17px, 1.5vw, 21px);
  line-height: 1.5;
  letter-spacing: -0.025em;
  color: rgba(255, 255, 255, 0.82);
}

.footer-12__cta-form {
  width: min(100%, 860px);
  margin-top: 8px;
  padding: 20px;
  background: rgba(18, 18, 18, 0.86);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 24px;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.32);
  -webkit-backdrop-filter: blur(14px);
          backdrop-filter: blur(14px);
}

.footer-12__cta-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.footer-12__cta-field {
  min-width: 0;
  text-align: left;
}

.footer-12__cta-field--phone {
  grid-column: 1 / -1;
}

.footer-12__cta-honeypot {
  position: absolute !important;
  left: -10000px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

.footer-12__cta-label {
  display: block;
  margin: 0 0 8px 2px;
  color: rgba(255, 255, 255, 0.76);
  font-family: var(--at-ff-heading);
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

input.footer-12__cta-input {
  width: 100%;
  height: 54px;
  padding: 0 16px;
  background: rgba(255, 255, 255, 0.075);
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 13px;
  color: #fefefe;
  font-family: var(--at-ff-heading);
  font-weight: 500;
  font-size: 14px;
  line-height: 1.4;
  letter-spacing: -0.02em;
  outline: none;
  transition: border-color 0.25s ease, background-color 0.25s ease, box-shadow 0.25s ease;
}
input.footer-12__cta-input:focus {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 87, 1, 0.8);
  box-shadow: 0 0 0 3px rgba(255, 87, 1, 0.14);
}
input.footer-12__cta-input::-moz-placeholder {
  color: #8f8f8f;
  opacity: 1;
}
input.footer-12__cta-input::placeholder {
  color: #8f8f8f;
  opacity: 1;
}

.footer-12__cta-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  min-height: 54px;
  margin-top: 14px;
  padding: 0 24px;
  background-color: var(--at-theme-primary);
  color: #fefefe;
  border: 0;
  border-radius: 13px;
  font-family: var(--at-ff-heading);
  font-weight: 700;
  font-size: 15px;
  line-height: 1;
  letter-spacing: -0.02em;
  cursor: pointer;
  transition: background-color 0.3s ease, transform 0.3s ease;
}
.footer-12__cta-submit:hover, .footer-12__cta-submit:focus-visible {
  background-color: #ff6128;
  transform: translateY(-2px);
}

.footer-12__cta-note {
  margin-top: 11px;
  color: rgba(255, 255, 255, 0.48);
  font-family: var(--at-ff-heading);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.4;
  text-align: center;
}

/* ── Footer main ────────────────────────────────── */
.footer-12__main {
  position: relative;
  z-index: 1;
  padding-top: 72px;
  padding-bottom: 32px;
  background-color: #0f0f0f;
  display: flex;
  flex-direction: column;
}

.footer-12__divider {
  display: block;
  width: 100%;
  height: 1px;
  background-color: rgba(255, 255, 255, 0.1);
}

.footer-12__columns {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr)) minmax(0, 0.9fr);
  -moz-column-gap: 48px;
       column-gap: 48px;
  row-gap: 48px;
  padding: 64px 0;
}

.footer-12__col {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  row-gap: 18px;
  min-width: 0;
}

.footer-12__col--brand {
  max-width: 420px;
  row-gap: 24px;
}

/* Brand */
.footer-12__brand {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  color: #fefefe;
}
.footer-12__brand:hover, .footer-12__brand:focus-visible {
  color: #fefefe;
}

.footer-12__brand-logo {
  display: block;
  height: 30px;
  width: auto;
}

.footer-12__brand-desc {
  margin: 0;
  font-family: var(--at-ff-heading);
  font-weight: 500;
  font-size: 15px;
  line-height: 1.6;
  letter-spacing: -0.02em;
  color: #b7b7b7;
}

/* Socials — uses .at-hero-social pill pattern (shared with footer-1).
   Compound selector (.at-hero-social.footer-12__socials) keeps specificity
   above the global .at-hero-social rule from _hero.scss, which is loaded
   later in the cascade and would otherwise win on equal specificity. */

/* Column links */
.footer-12__col-title {
  margin: 0;
  font-family: var(--at-ff-heading);
  font-weight: 600;
  font-size: 12px;
  line-height: 1;
  letter-spacing: 0.96px;
  color: #585959;
  text-transform: uppercase;
}

.footer-12__col-links {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  row-gap: 12px;
}
.footer-12__col-links a {
  font-family: var(--at-ff-heading);
  font-weight: 500;
  font-size: 15px;
  line-height: 1;
  letter-spacing: -0.02em;
  color: #fefefe;
  text-decoration: none;
  transition: color 0.3s ease;
}
.footer-12__col-links a:hover, .footer-12__col-links a:focus-visible {
  color: var(--at-theme-primary);
}

/* Hours column */
.footer-12__col--hours {
  row-gap: 13px;
}

.footer-12__hours-value {
  font-family: var(--at-ff-heading);
  font-weight: 400;
  font-size: 20px;
  line-height: 1.25;
  letter-spacing: -0.05em;
  color: #fefefe;
}

/* ── Bottom bar ─────────────────────────────────── */
.footer-12__bottom {
  padding-top: 24px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  -moz-column-gap: 24px;
       column-gap: 24px;
  row-gap: 12px;
}

.footer-12__copy {
  font-family: var(--at-ff-heading);
  font-weight: 500;
  font-size: 13px;
  line-height: 1;
  letter-spacing: -0.02em;
  color: #585959;
}

/* ── Responsive ─────────────────────────────────── */
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .footer-12__cta {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .footer-12__cta {
    padding-top: 90px;
    padding-bottom: 90px;
  }
  .footer-12__columns {
    -moz-column-gap: 36px;
         column-gap: 36px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer-12__cta {
    padding-top: 80px;
    padding-bottom: 80px;
  }
  .footer-12__cta-inner {
    row-gap: 24px;
  }
  .footer-12__main {
    padding-top: 56px;
  }
  .footer-12__columns {
    grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr));
    padding: 48px 0;
    -moz-column-gap: 32px;
         column-gap: 32px;
    row-gap: 32px;
  }
  .footer-12__col--hours {
    grid-column: 1/-1;
    flex-direction: row;
    align-items: center;
    -moz-column-gap: 18px;
         column-gap: 18px;
    row-gap: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-12__cta {
    padding-top: 64px;
    padding-bottom: 64px;
  }
  .footer-12__cta-inner {
    row-gap: 20px;
  }
  .footer-12__main {
    padding-top: 48px;
  }
  .footer-12__columns {
    grid-template-columns: 1fr 1fr;
    -moz-column-gap: 32px;
         column-gap: 32px;
    row-gap: 32px;
    padding: 40px 0;
  }
  .footer-12__col--brand {
    grid-column: 1/-1;
    max-width: 100%;
  }
  .footer-12__col--hours {
    grid-column: 1/-1;
    flex-direction: row;
    align-items: center;
    -moz-column-gap: 18px;
         column-gap: 18px;
    row-gap: 0;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .footer-12__cta {
    padding-top: 56px;
    padding-bottom: 56px;
  }
  .footer-12__cta-inner {
    row-gap: 18px;
  }
  .footer-12__cta-form {
    width: 100%;
    max-width: 680px;
    padding: 18px;
  }
  .footer-12__cta-submit {
    min-height: 52px;
    padding: 0 18px;
    font-size: 13px;
  }
  .footer-12__main {
    padding-top: 40px;
  }
  .footer-12__columns {
    grid-template-columns: 1fr 1fr;
    -moz-column-gap: 20px;
         column-gap: 20px;
    row-gap: 28px;
    padding: 36px 0;
  }
  .footer-12__col--brand {
    grid-column: 1/-1;
  }
  .footer-12__col--hours {
    grid-column: 1/-1;
    flex-direction: row;
    align-items: center;
    -moz-column-gap: 14px;
         column-gap: 14px;
    row-gap: 0;
  }
  .footer-12__bottom {
    -moz-column-gap: 18px;
         column-gap: 18px;
  }
}
@media (max-width: 574.98px) {
  .footer-12__cta {
    padding-top: 48px;
    padding-bottom: 48px;
  }
  .footer-12__cta-inner {
    row-gap: 16px;
  }
  .footer-12__cta-pill-text {
    font-size: 12px;
  }
  .footer-12__cta-sub {
    font-size: 16px;
  }
  .footer-12__cta-form {
    width: 100%;
    margin-top: 4px;
    padding: 14px;
    border-radius: 18px;
  }
  .footer-12__cta-fields {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  input.footer-12__cta-input {
    height: 52px;
    text-align: left;
    padding: 0 16px;
    border-radius: 12px;
  }
  .footer-12__cta-submit {
    width: 100%;
    min-height: 52px;
    margin-top: 12px;
    padding: 0 16px;
    border-radius: 12px;
    font-size: 14px;
  }
  .footer-12__main {
    padding-top: 32px;
    padding-bottom: 24px;
  }
  .footer-12__columns {
    grid-template-columns: 1fr;
    -moz-column-gap: 0;
         column-gap: 0;
    row-gap: 24px;
    padding: 28px 0;
  }
  .footer-12__col {
    row-gap: 14px;
  }
  .footer-12__col--brand {
    row-gap: 18px;
  }
  .footer-12__col--hours {
    flex-direction: row;
    -moz-column-gap: 12px;
         column-gap: 12px;
  }
  .footer-12__hours-value {
    font-size: 18px;
  }
  .footer-12__brand-logo {
    height: 26px;
  }
  .footer-12__brand-desc {
    font-size: 14px;
  }
  .footer-12__col-links a {
    font-size: 14px;
  }
  .footer-12__bottom {
    flex-direction: column;
    align-items: flex-start;
    row-gap: 10px;
  }
}
/* Footer 13 — Architecture */

/* ── Meta bar ────────────────────────────────── */

/* ── Body ────────────────────────────────────── */

/* ── Top row ─────────────────────────────────── */

/* Brand */

/* Newsletter form */

/* Link columns */

/* ── Studios row ─────────────────────────────── */

/* ── Big brand text ──────────────────────────── */

/* ── Legal bar ───────────────────────────────── */

/* ── Responsive ──────────────────────────────── */
/* Desktop fine-tuning (range-based) */
/* Tablet & phone (≤1199px): stack top row, shrink paddings */
/* Tablet portrait & phone (≤991px): 2-col link cols, single-col studios, stacked legal */
/* Phone (≤767px): single-col link cols, form wraps */
/* Small phone (≤574px) */
/* ===========================================================
   Footer 14 — Photography Studio

   Designed dark in light mode. Inverts to light-on-dark via
   the --at-neutral-* token swap in dark mode (handled centrally
   in components/_dark-mode.scss).
   =========================================================== */

/* ===========================================================
   Footer 15 — Fashion Agency

   Layout: 2x2 panel grid of dark rounded cards.
   Row 1: nav+social (64.5%)  |  newsletter (35.5%)
   Row 2: brand+services (35.5%) | contact+legal (64.5%)

   Always-dark surface (does not swap in dark mode) — uses
   literal hex tokens to match Figma frame intent.
   =========================================================== */

/* ── Grid ────────────────────────────────────────────────── */
/* 3-col grid with staggered spans: row 1 = 2/3 + 1/3,
   row 2 = 1/3 + 2/3 (zigzag panel layout). */

/* ── Panel 1 — Nav + social ─────────────────────────────── */

/* ── Panel 2 — Newsletter ───────────────────────────────── */

/* ── Panel 3 — Brand + services ─────────────────────────── */

/* ── Panel 4 — Contact + legal ──────────────────────────── */

/* ── Responsive ─────────────────────────────────────────── */
/* Tablet landscape — stack panel 1 (nav + social) vertically */
/* Tablet portrait — single column stack */
/* Phone */
/* Small phone (≤574.98px) — explicit rules; ranges do NOT cascade */
/*----------------------------------------*/
/*  7.1 about css
/*----------------------------------------*/

/*----------------------------------------*/
/*  sec-4 about contact form 
/*----------------------------------------*/
.sec-4-about-form__field {
  margin-bottom: 0;
}
.sec-4-about-form__input {
  display: block;
  width: 100%;
  padding: 16px 0;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: var(--at-neutral-500);
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--at-neutral-900);
  border-radius: 0;
  outline: none;
  transition: border-color 0.2s ease;
}
.sec-4-about-form__input::-moz-placeholder {
  color: var(--at-neutral-500);
}
.sec-4-about-form__input::placeholder {
  color: var(--at-neutral-500);
}
.sec-4-about-form__input:focus {
  border-bottom-color: var(--at-neutral-900);
}
.sec-4-about-form__textarea {
  min-height: 120px;
  resize: vertical;
  padding-top: 16px;
}
.sec-4-about-form__actions {
  margin-top: 40px;
  margin-bottom: 16px;
}
.sec-4-about-form__disclaimer {
  margin: 0;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--at-neutral-500);
}
.sec-4-about-form__link {
  color: var(--at-neutral-900);
}

/*----------------------------------------*/
/*  About 2 - Sec 3 Our Journey / card-award-2
/*----------------------------------------*/
/*----------------------------------------*/
/*  sec-2-about: process cards (scroll-section)
/*----------------------------------------*/

/*----------------------------------------*/
/*  7.14 hero css
/*----------------------------------------*/
.at-hero-social {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 574.98px) {
  .at-hero-social {
    margin-left: 0;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 574.98px) {
  .at-hero-social {
    justify-content: flex-start;
  }
}
.at-hero-social a {
  font-weight: 500;
  font-size: 14px;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--at-neutral-500);
  border: 1px solid rgba(38, 38, 38, 0.1);
  border-radius: 20px;
  padding: 6px 20px;
  display: inline-block;
}
.at-hero-social a:hover {
  background: var(--at-common-black);
  border-color: var(--at-common-black);
  color: var(--at-common-white);
}

.bg-linear-opacity {
  position: relative;
  z-index: 1;
  overflow: hidden;
}
.bg-linear-opacity::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0.84;
  background: linear-gradient(99deg, #000 5.05%, rgba(0, 0, 0, 0.44) 49.84%, #000 94.63%);
  z-index: -1;
}

/*----------------------------------------*/
/*  sec-1-home-4 (GymGrid AI Solutions Hero)
/*----------------------------------------*/
.sec-1-home-4-wrap {
  padding-top: 140px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 574.98px) {
  .sec-1-home-4-wrap {
    padding-top: 100px;
  }
}
.sec-1-home-4-wrap .sec-1-home-4 {
  display: flex;
  align-items: flex-end;
  min-height: clamp(680px, calc(100vh - 130px), 900px);
  min-height: clamp(680px, calc(100svh - 130px), 900px);
  padding-top: 220px;
  padding-bottom: 40px;
}
@media (min-width: 992px) {
  .sec-1-home-4-wrap .sec-1-home-4 > .container {
    padding-left: clamp(48px, 5vw, 96px);
  }
}
.sec-1-home-4-wrap .sec-1-home-4.bg-linear-opacity::after {
  opacity: 1;
  background: linear-gradient(to left, rgba(0, 0, 0, 0.18) 0%, rgba(0, 0, 0, 0.34) 48%, rgba(0, 0, 0, 0.58) 100%);
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 574.98px) {
  .sec-1-home-4-wrap .sec-1-home-4 {
    min-height: clamp(620px, calc(100vh - 115px), 820px);
    min-height: clamp(620px, calc(100svh - 115px), 820px);
    padding-top: 120px;
    padding-bottom: 32px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 574.98px) {
  .sec-1-home-4-wrap .sec-1-home-4 {
    min-height: clamp(560px, calc(100vh - 105px), 740px);
    min-height: clamp(560px, calc(100svh - 105px), 740px);
  }
}
.sec-1-home-4-wrap .sec-1-home-4__tagline {
  font-weight: 600;
  font-size: 16px;
  line-height: 1;
  letter-spacing: 0.15em;
  color: #FEFEFE;
}
.sec-1-home-4-wrap .sec-1-home-4__support {
  margin-bottom: 64px;
}
@media (max-width: 574.98px) {
  .sec-1-home-4-wrap .sec-1-home-4__tagline {
    font-size: 10px;
    letter-spacing: 0.1em;
  }
  .sec-1-home-4-wrap .sec-1-home-4__support {
    margin-bottom: 40px;
  }
}
.sec-1-home-4-wrap .sec-1-home-4__btns .at-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 52px;
  padding: 16px 28px;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.05em;
  border: 1px solid rgba(255, 255, 255, 0.5);
  background: rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(3px);
}
.sec-1-home-4-wrap .sec-1-home-4__btns .at-btn:first-child {
  color: var(--at-neutral-950) !important;
  border-color: #FEFEFE;
  background: #FEFEFE;
}
.sec-1-home-4-wrap .sec-1-home-4__btns .at-btn:first-child:hover {
  color: #FEFEFE !important;
  background: transparent;
}
.sec-1-home-4-wrap .sec-1-home-4__btns .at-btn:hover {
  background: rgba(255, 255, 255, 0.16);
  border-color: rgba(255, 255, 255, 0.5);
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 574.98px) {
  .sec-1-home-4-wrap .sec-1-home-4__btns .at-btn {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.5);
  }
  .sec-1-home-4-wrap .sec-1-home-4__btns .at-btn:first-child {
    background: #FEFEFE;
    border-color: #FEFEFE;
  }
}
@media (max-width: 574.98px) {
  .sec-1-home-4-wrap .sec-1-home-4__btns {
    width: 100%;
  }
  .sec-1-home-4-wrap .sec-1-home-4__btns .at-btn {
    width: 100%;
  }
}

/*----------------------------------------*/
/*  sec-3-home-4 (How We Work Process Cards)
/*----------------------------------------*/

/*----------------------------------------*/
/*  sec-4-home-4 (Featured Case Card)
/*----------------------------------------*/

/*----------------------------------------*/
/*  7.22 service css
/*----------------------------------------*/

/*----------------------------------------*/
/*  7.17 portfolio
/*----------------------------------------*/
:root {
  --numOfSlides: 5;
  --slidingAT: 1.3s;
  --controlSize: 60px;
}

/*----------------------------------------*/
/*  Award Card Styles
/*----------------------------------------*/

/* Card award expanded image preview (follows cursor, top-right of cursor, rotated -15deg) */

/*  testimonial css start */

/*  testimonial css end */
/*----------------------------------------*/
/*  Team Card Styles
/*----------------------------------------*/
/*----------------------------------------*/
/*  Team Card 2 (Home 4 Sec 6) - Social overlay on hover
/*----------------------------------------*/
.team-card-2__image {
  position: relative;
  width: 100%;
  overflow: hidden;
  border-radius: 16px;
  border: 1px solid var(--at-neutral-100, #DFDFDF);
  background: var(--at-neutral-100, #DFDFDF);
}
.team-card-2__image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: transform 0.4s ease;
}
.team-card-2__image--reception {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 22px 18px 12px;
  background: linear-gradient(180deg, #141414 0%, #020202 100%);
}
.team-card-2__image--reception img {
  width: 100%;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: center top;
     object-position: center top;
  border-radius: 28px;
}
.team-card-2:hover .team-card-2__image img {
  transform: scale(1.05);
}
.team-card-2:hover .team-card-2__image--reception img {
  transform: scale(1.02);
}
.team-card-2__content {
  margin-top: 8px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 26px 45px;
  min-height: 72px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
  border-radius: 16px;
  background: var(--at-neutral-0, #FEFEFE);
}
@media (max-width: 574.98px) {
  .team-card-2__content {
    padding: 20px;
  }
}
.team-card-2__name {
  text-decoration: none;
  color: var(--at-common-black);
}
.team-card-2__name .h6 {
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.3;
  transition: color 0.25s ease;
}
.team-card-2__name:hover .h6 {
  color: var(--at-theme-primary, #6366f1);
}

/*----------------------------------------*/
/*  7.11 faq css
/*----------------------------------------*/

/*----------------------------------------*/
/*  7.3 banner
/*----------------------------------------*/
.at-banner-thumb {
  height: 800px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .at-banner-thumb {
    height: 600px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 574.98px) {
  .at-banner-thumb {
    height: 400px;
  }
}

/*----------------------------------------*/
/*  7.13 gallery css
/*----------------------------------------*/

/*----------------------------------------*/
/*  Content product right – shop details 
/*----------------------------------------*/

/*----------------------------------------*/
/*  Shop cart – list & items 
/*----------------------------------------*/

/* Cart item card */

/*----------------------------------------*/
/*  Shop cart – summary 
/*----------------------------------------*/

/*----------------------------------------*/
/*  Shop checkout – Billing Details & Payment 
/*----------------------------------------*/
/* Billing Details */

/* Payment */

/*----------------------------------------*/
/*  7.23 skill css
/*----------------------------------------*/

/*----------------------------------------*/
/*  sec-6-about: skill cards
/*----------------------------------------*/

/*----------------------------------------*/
/*  Home 2 Section 11 - Price plan toggle
/*----------------------------------------*/

/*----------------------------------------*/
/*  Home 2 Section 11 - Pricing cards
/*----------------------------------------*/

/*----------------------------------------*/
/*  sec-2-home-5 - Why GymGrid 3 columns
/*----------------------------------------*/
.sec-2-home-5__avatars-row {
  flex-wrap: wrap;
}
.sec-2-home-5__avatar-sm {
  width: 65px;
  height: 65px;
  border-radius: 8px;
  overflow: hidden;
  padding: 4px;
  background: var(--at-neutral-50);
}
.sec-2-home-5__avatar-sm img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 4px;
  filter: grayscale(100%);
}

/*----------------------------------------*/
/*  at-brand-scroll - Vertical random scroll of 3 logos in each brand cell
/*----------------------------------------*/

/*----------------------------------------*/
/*  block-journey - Career Path & Expertise
/*  Header CTA: Book A Call Now | Hero card: SINCE 2012 + overlay | Journey list
/*----------------------------------------*/

/*----------------------------------------*/
/*  sec-1-home-7 (Advancing Startup Innovation Hero)
/*----------------------------------------*/

/*----------------------------------------*/
/*  sec-2-home-7 (We Power the World's Fastest Growing Startups)
/*----------------------------------------*/

/*----------------------------------------*/
/*  sec-4-home-7 (Our mission — dual reveal-text headline + locations)
/*----------------------------------------*/

/*----------------------------------------*/
/*  sec-5-home-7 (Specialized services + accordion + throwable logos)
/*----------------------------------------*/

/*----------------------------------------*/
/*  sec-6-home-7 (The Process — Growth Engine)
/*----------------------------------------*/
.sec-6-home-7 {
  position: relative;
  border-top: 1px solid var(--at-neutral-100, #dfdfdf);
}
.sec-6-home-7__eyebrow {
  color: var(--at-neutral-900, #1d1d1d);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: -0.05em;
}
.sec-6-home-7__eyebrow svg {
  transition: transform 0.35s ease;
}
.sec-6-home-7__eyebrow:hover {
  color: var(--at-theme-primary);
}
.sec-6-home-7__eyebrow:hover svg {
  transform: translate(2px, -2px);
}
.sec-6-home-7__title {
  font-family: var(--at-heading-font);
  color: var(--at-neutral-900, #1d1d1d);
  font-size: clamp(2.5rem, 5.5vw, 4.5rem);
  font-weight: 600;
  line-height: 1.05;
  letter-spacing: -0.05em;
}
.sec-6-home-7__desc {
  max-width: 494px;
  color: var(--at-neutral-900, #1d1d1d);
  font-size: 18px;
  font-weight: 600;
  line-height: 1.45;
  letter-spacing: -0.05em;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 574.98px) {
  .sec-6-home-7__desc {
    font-size: 16px;
    max-width: 100%;
  }
}
.sec-6-home-7__cards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 30px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .sec-6-home-7__cards {
    gap: 24px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .sec-6-home-7__cards {
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sec-6-home-7__cards {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 574.98px) {
  .sec-6-home-7__cards {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}
.sec-6-home-7__card-wrap {
  min-width: 0;
}
.sec-6-home-7__card {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  min-height: 487px;
  padding: 51px 52px;
  border: 1px solid var(--at-neutral-100, #dfdfdf);
  border-radius: 8px;
  background: var(--at-neutral-0, #fefefe);
  overflow: hidden;
  transition: border-color 0.4s ease, transform 0.4s ease, box-shadow 0.4s ease;
}
.sec-6-home-7__card:hover {
  border-color: var(--at-neutral-300, #b7b7b7);
  transform: translateY(-4px);
  box-shadow: 0 20px 40px -20px rgba(15, 15, 15, 0.12);
}
.sec-6-home-7__card:hover .sec-6-home-7__card-media img {
  transform: scale(1.06);
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .sec-6-home-7__card {
    min-height: 440px;
    padding: 40px 36px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .sec-6-home-7__card {
    min-height: 420px;
    padding: 36px 32px;
  }
}
@media (max-width: 574.98px) {
  .sec-6-home-7__card {
    min-height: auto;
    padding: 32px 24px;
  }
}
.sec-6-home-7__card-body {
  display: flex;
  flex-direction: column;
  gap: 17px;
  margin-bottom: 24px;
}
.sec-6-home-7__card-num {
  font-family: var(--at-heading-font);
  font-size: 24px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.05em;
  color: var(--at-neutral-300, #b7b7b7);
}
.sec-6-home-7__card-title {
  font-family: var(--at-heading-font);
  font-size: 24px;
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -0.05em;
  color: var(--at-neutral-900, #1d1d1d);
}
.sec-6-home-7__card-desc {
  font-size: 16px;
  font-weight: 500;
  line-height: 1.45;
  letter-spacing: -0.02em;
  color: var(--at-neutral-900, #1d1d1d);
}
.sec-6-home-7__card-media {
  position: relative;
  width: 100%;
  aspect-ratio: 305/185;
  border-radius: 8px;
  overflow: hidden;
  background: var(--at-neutral-100, #dfdfdf);
}
.sec-6-home-7__card-media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  filter: grayscale(0%);
  transition: transform 0.6s ease, filter 0.4s ease;
}
.sec-6-home-7__card-media:hover img {
  filter: grayscale(100%);
  transition: transform 0.6s ease, filter 0.4s ease;
}

/*----------------------------------------*/
/*  sec-7-home-7 (CTA — Ready to Build the Future?)
/*----------------------------------------*/
.sec-7-home-7 {
  position: relative;
  background: radial-gradient(1100px 700px at 80% 15%, rgba(255, 87, 1, 0.14), transparent 62%), #7f0b01;
  color: #fefefe;
}
.sec-7-home-7__media {
  width: 100%;
  max-width: 798px;
  aspect-ratio: 1/1;
  overflow: hidden;
}
.sec-7-home-7__media img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}
.sec-7-home-7__eyebrow {
  color: var(--at-theme-primary, #FF5701);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: -0.05em;
}
.sec-7-home-7__eyebrow-icon {
  display: block;
}
.sec-7-home-7__headline {
  font-family: var(--at-heading-font);
  font-size: 48px;
  font-weight: 600;
  line-height: 52px;
  letter-spacing: -0.05em;
  color: #fefefe;
  max-width: 650px;
}
.sec-7-home-7__headline-accent {
  color: var(--at-theme-primary, #FF5701);
}
.sec-7-home-7__subtext {
  max-width: 620px;
  margin: 0 0 36px;
  color: #fefefe;
  font-size: 20px;
  font-weight: 400;
  line-height: 1.45;
  text-align: left;
}
.sec-7-home-7__trust {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  max-width: 650px;
  margin: 0 0 32px;
}
.sec-7-home-7__trust-item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 10px 16px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.09);
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: #fefefe;
  font-size: 15px;
  font-weight: 500;
  letter-spacing: -0.02em;
  backdrop-filter: blur(16px);
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .sec-7-home-7__headline {
    font-size: 40px;
    line-height: 1.15;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 574.98px) {
  .sec-7-home-7__headline {
    font-size: 32px;
    line-height: 1.2;
  }
  .sec-7-home-7__subtext {
    font-size: 18px;
    line-height: 1.5;
  }
  .sec-7-home-7__trust {
    gap: 10px;
    margin-bottom: 28px;
  }
  .sec-7-home-7__trust-item {
    width: 100%;
    justify-content: flex-start;
  }
}
.sec-7-home-7__cta-btn {
  background: var(--at-theme-primary, #FF5701);
  border-radius: 50px 0 0 50px;
  padding-inline: 27px;
  min-height: 50px;
}
.sec-7-home-7__cta-circle {
  width: 50px;
  min-width: 50px;
  height: 50px;
  background: var(--at-theme-primary, #FF5701);
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.35s ease, background 0.35s ease;
}
.sec-7-home-7__cta-btn:hover {
  background: #e04c00;
}
.sec-7-home-7__cta-circle:hover {
  transform: translateY(-2px);
  background: #e04c00;
}
.sec-7-home-7__cta-circle img {
  display: block;
}
.sec-7-home-7__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 22px;
  margin-top: 20px;
}
.sec-7-home-7__meta-note {
  color: rgba(254, 254, 254, 0.74);
  font-size: 15px;
  line-height: 1.45;
}
.sec-7-home-7__meta-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #fefefe;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: -0.02em;
  text-decoration: none;
  transition: color 0.3s ease, transform 0.3s ease;
}
.sec-7-home-7__meta-link::after {
  content: "\2192";
  font-size: 16px;
  line-height: 1;
}
.sec-7-home-7__meta-link:hover {
  color: var(--at-theme-primary, #FF5701);
  transform: translateX(2px);
}
.sec-7-home-7__star {
  position: absolute;
  right: 100px;
  bottom: 120px;
  width: 100px;
  height: 100px;
  pointer-events: none;
  color: var(--at-theme-primary, #FF5701);
}
.sec-7-home-7__star img,
.sec-7-home-7__star svg {
  width: 100%;
  height: 100%;
  display: block;
  animation: sec7Home7Spin 12s linear infinite;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 574.98px) {
  .sec-7-home-7__star {
    right: 24px;
    bottom: 24px;
    opacity: 0.9;
  }
  .sec-7-home-7__meta {
    align-items: flex-start;
  }
}

@keyframes sec7Home7Spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
/*----------------------------------------*/
/*  Life Before / Life After
/*----------------------------------------*/
.sec-life-after {
  position: relative;
  padding: 132px 0 144px;
  background:
    radial-gradient(circle at 8% 18%, rgba(255, 87, 1, 0.07), transparent 28%),
    radial-gradient(circle at 92% 82%, rgba(127, 11, 1, 0.06), transparent 30%),
    #f6f3ee;
  color: #111827;
  overflow: hidden;
  isolation: isolate;
}
.sec-life-after::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: min(1180px, 88vw);
  height: 1px;
  background: linear-gradient(90deg, rgba(255, 87, 1, 0), rgba(255, 87, 1, 0.4), rgba(255, 87, 1, 0));
  transform: translateX(-50%);
  z-index: -1;
}
.sec-life-after .container {
  max-width: 1720px;
}
.sec-life-after__header {
  max-width: 820px;
  margin: 0 auto 72px;
}
.sec-life-after__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 22px;
  padding: 10px 15px;
  border: 1px solid rgba(255, 87, 1, 0.16);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.68);
  color: var(--at-theme-primary, #FF5701);
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  backdrop-filter: blur(10px);
}
.sec-life-after__eyebrow-icon {
  display: block;
}
.sec-life-after__num {
  display: block;
  margin: 0;
  font-family: var(--at-heading-font);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.08em;
  color: #9a938b;
}
.sec-life-after__meta {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 28px;
}
.sec-life-after__title {
  margin: 0 0 22px;
  color: #11100f;
  font-family: var(--at-heading-font);
  font-size: clamp(48px, 5.2vw, 72px);
  font-weight: 600;
  line-height: 1.02;
  letter-spacing: -0.055em;
}
.sec-life-after__title span {
  color: var(--at-theme-primary, #FF5701);
}
.sec-life-after__intro {
  max-width: 720px;
  margin: 0 auto;
  color: #66615b;
  font-size: 18px;
  line-height: 1.65;
}
.sec-life-after__labels,
.sec-life-after__pair {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 68px minmax(0, 1fr);
  gap: 24px;
  max-width: 1660px;
  margin-right: auto;
  margin-left: auto;
}
.sec-life-after__labels {
  margin-bottom: 24px;
}
.sec-life-after__label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 58px;
  padding: 0 24px;
  border-radius: 16px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.sec-life-after__label::after {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
}
.sec-life-after__label--before {
  grid-column: 1;
  border: 1px solid rgba(17, 16, 15, 0.1);
  background: rgba(255, 255, 255, 0.72);
  color: #68625c;
  box-shadow: 0 12px 34px rgba(44, 34, 24, 0.04);
}
.sec-life-after__label--before::after {
  background: #b7afa7;
}
.sec-life-after__label--after {
  grid-column: 3;
  border: 1px solid #211b18;
  background: #171412;
  color: #fffaf6;
  box-shadow: 0 16px 38px rgba(38, 21, 12, 0.14);
}
.sec-life-after__label--after::after {
  background: var(--at-theme-primary, #FF5701);
  box-shadow: 0 0 0 5px rgba(255, 87, 1, 0.14);
}
.sec-life-after__pairs {
  display: flex;
  flex-direction: column;
  gap: 28px;
}
.sec-life-after__pair {
  position: relative;
  align-items: stretch;
}
.sec-life-after__card {
  position: relative;
  z-index: 1;
  display: grid;
  min-height: 270px;
  padding: 0;
  border: 1px solid rgba(17, 16, 15, 0.1);
  border-radius: 24px;
  background: #fffdfa;
  overflow: hidden;
  box-shadow: 0 20px 56px -38px rgba(36, 25, 16, 0.3);
  transition: transform 0.4s ease, border-color 0.4s ease, box-shadow 0.4s ease;
  will-change: transform;
}
.sec-life-after__card--before {
  grid-template-columns: 46% minmax(0, 54%);
}
.sec-life-after__card--after {
  grid-template-columns: minmax(0, 54%) 46%;
  border-color: rgba(255, 87, 1, 0.24);
  background: linear-gradient(145deg, #741006 0%, #4a0904 100%);
  box-shadow: 0 22px 60px -34px rgba(88, 12, 4, 0.54);
}
.sec-life-after__copy {
  min-width: 0;
  align-self: center;
  padding: 36px 32px 34px;
}
.sec-life-after__card--before .sec-life-after__copy {
  grid-column: 2;
  grid-row: 1;
}
.sec-life-after__card--after .sec-life-after__copy {
  grid-column: 1;
  grid-row: 1;
}
.sec-life-after__pair:hover .sec-life-after__card {
  transform: translateY(-5px);
}
.sec-life-after__card--before:hover {
  border-color: rgba(17, 16, 15, 0.2);
  box-shadow: 0 28px 64px -34px rgba(36, 25, 16, 0.34);
}
.sec-life-after__card--after:hover {
  border-color: rgba(255, 87, 1, 0.7);
  box-shadow: 0 30px 68px -32px rgba(88, 12, 4, 0.68);
}
.sec-life-after__media {
  position: relative;
  width: 100%;
  min-width: 0;
  height: 100%;
  margin: 0;
  overflow: hidden;
  border-radius: 0;
  background: #d8d2cb;
}
.sec-life-after__card--before .sec-life-after__media {
  grid-column: 1;
  grid-row: 1;
}
.sec-life-after__card--after .sec-life-after__media {
  grid-column: 2;
  grid-row: 1;
}
.sec-life-after__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, rgba(16, 13, 11, 0.04), rgba(16, 13, 11, 0.24));
  pointer-events: none;
}
.sec-life-after__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(0.48) contrast(0.98) brightness(0.9);
  transition: transform 0.5s ease, filter 0.45s ease;
}
.sec-life-after__pair:hover .sec-life-after__media img,
.sec-life-after__card:hover .sec-life-after__media img {
  filter: saturate(0.85) contrast(1.02) brightness(0.96);
}
.sec-life-after__card:hover .sec-life-after__media img {
  transform: scale(1.04);
}
.sec-life-after__card--after .sec-life-after__media {
  background: #211915;
}
.sec-life-after__card--after .sec-life-after__media img {
  filter: saturate(0.92) contrast(1.04) brightness(0.94);
}
.sec-life-after__card--after .sec-life-after__media::after {
  background: linear-gradient(90deg, rgba(74, 9, 4, 0.38), transparent 48%);
}
.sec-life-after__card--after:hover .sec-life-after__media img {
  filter: saturate(1.05) contrast(1.04) brightness(1);
}
.sec-life-after__media--before img {
  object-position: 50% 50%;
}
.sec-life-after__media--dashboard img {
  object-position: 50% 50%;
}
.sec-life-after__media--frontdesk img {
  object-position: 54% 50%;
}
.sec-life-after__card h3 {
  margin: 0 0 12px;
  color: #171412;
  font-size: clamp(22px, 1.7vw, 28px);
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: -0.035em;
  overflow-wrap: break-word;
  transition: color 0.35s ease;
}
.sec-life-after__card p {
  margin: 0;
  color: #6d665f;
  font-size: 15px;
  line-height: 1.65;
  overflow-wrap: break-word;
}
.sec-life-after__card--after h3 {
  color: #fffaf6;
}
.sec-life-after__card--after p {
  color: rgba(255, 250, 246, 0.72);
}
.sec-life-after__card--after .sec-life-after__num {
  color: rgba(255, 250, 246, 0.5);
}
.sec-life-after__status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  min-width: 34px;
  height: 34px;
  border-radius: 50%;
  font-size: 16px;
  font-weight: 800;
  line-height: 1;
  box-shadow: 0 10px 22px rgba(17, 16, 15, 0.12);
  transition: transform 0.35s ease;
}
.sec-life-after__card:hover .sec-life-after__status {
  transform: scale(1.06);
}
.sec-life-after__card--before .sec-life-after__status {
  color: #81150b;
  background: #f7e8e4;
}
.sec-life-after__card--before .sec-life-after__status::before {
  content: "!";
}
.sec-life-after__card--after .sec-life-after__status {
  color: #fffaf6;
  background: var(--at-theme-primary, #FF5701);
  box-shadow: 0 10px 24px rgba(255, 87, 1, 0.28);
}
.sec-life-after__card--after .sec-life-after__status::before {
  content: "\2713";
}
.sec-life-after__arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  width: 52px;
  height: 52px;
  border: 1px solid rgba(255, 87, 1, 0.34);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.8);
  color: var(--at-theme-primary, #FF5701);
  font-size: 23px;
  font-weight: 600;
  box-shadow: 0 12px 30px rgba(57, 38, 24, 0.08);
  transition: transform 0.35s ease, box-shadow 0.35s ease, color 0.35s ease, background 0.35s ease, border-color 0.35s ease;
}
.sec-life-after__pair:hover .sec-life-after__arrow {
  color: #fff;
  background: var(--at-theme-primary, #FF5701);
  border-color: var(--at-theme-primary, #FF5701);
  transform: translateX(3px);
  box-shadow: 0 16px 38px rgba(255, 87, 1, 0.26);
}
.sec-life-after__mobile-label {
  display: none;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .sec-life-after__card {
    min-height: 260px;
  }
  .sec-life-after__copy {
    padding-right: 26px;
    padding-left: 26px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .sec-life-after {
    padding: 104px 0;
  }
  .sec-life-after__header {
    margin-bottom: 56px;
  }
  .sec-life-after__card {
    display: flex;
    flex-direction: column;
    min-height: 0;
  }
  .sec-life-after__media,
  .sec-life-after__card--after .sec-life-after__media {
    order: 0;
    width: 100%;
    height: 230px;
  }
  .sec-life-after__copy,
  .sec-life-after__card--before .sec-life-after__copy,
  .sec-life-after__card--after .sec-life-after__copy {
    order: 2;
    padding: 18px 28px 32px;
  }
  .sec-life-after__labels,
  .sec-life-after__pair {
    grid-template-columns: minmax(0, 1fr) 50px minmax(0, 1fr);
    gap: 16px;
  }
  .sec-life-after__meta {
    margin-bottom: 22px;
  }
  .sec-life-after__label {
    min-height: 54px;
    padding: 0 18px;
  }
  .sec-life-after__arrow {
    width: 44px;
    height: 44px;
    font-size: 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 574.98px) {
  .sec-life-after {
    padding: 88px 0;
  }
  .sec-life-after__header {
    margin-bottom: 44px;
    text-align: left !important;
  }
  .sec-life-after__title {
    line-height: 1.14;
  }
  .sec-life-after__intro {
    font-size: 17px;
    line-height: 1.55;
  }
  .sec-life-after__labels {
    display: none;
  }
  .sec-life-after__pairs {
    gap: 38px;
  }
  .sec-life-after__pair {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .sec-life-after__arrow {
    width: 46px;
    height: 46px;
    margin: 0 auto;
    font-size: 22px;
    transform: rotate(90deg);
  }
  .sec-life-after__pair:hover .sec-life-after__arrow {
    transform: rotate(90deg) translateX(3px);
  }
  .sec-life-after__card {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: auto;
    border-radius: 22px;
  }
  .sec-life-after__media,
  .sec-life-after__card--after .sec-life-after__media {
    order: 0;
    width: 100%;
    min-width: 0;
    aspect-ratio: 16 / 9;
    height: auto;
  }
  .sec-life-after__copy,
  .sec-life-after__card--before .sec-life-after__copy,
  .sec-life-after__card--after .sec-life-after__copy {
    order: 2;
    padding: 16px 24px 30px;
  }
  .sec-life-after__meta {
    margin-bottom: 20px;
  }
  .sec-life-after__card h3 {
    font-size: 24px;
  }
  .sec-life-after__mobile-label {
    display: inline-block;
    margin-bottom: 12px;
    color: var(--at-theme-primary, #FF5701);
    font-size: 11px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.12em;
    text-transform: uppercase;
  }
  .sec-life-after__card--after .sec-life-after__mobile-label {
    color: rgba(254, 254, 254, 0.85);
  }
}
@media (max-width: 574.98px) {
  .sec-life-after {
    padding: 76px 0;
  }
  .sec-life-after .container {
    padding-right: 20px;
    padding-left: 20px;
  }
  .sec-life-after__title {
    font-size: 38px;
  }
  .sec-life-after__media {
    aspect-ratio: 1.55 / 1;
  }
  .sec-life-after__status {
    width: 32px;
    min-width: 32px;
    height: 32px;
    font-size: 15px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .sec-life-after__card,
  .sec-life-after__media img,
  .sec-life-after__status,
  .sec-life-after__arrow {
    transition: none;
  }
  .sec-life-after__pair:hover .sec-life-after__card,
  .sec-life-after__card:hover .sec-life-after__media img,
  .sec-life-after__card:hover .sec-life-after__status,
  .sec-life-after__pair:hover .sec-life-after__arrow {
    transform: none;
  }
}
/*----------------------------------------*/
/*  sec-8-home-7 (Team — Dedicated Team + Staggered Portrait Grid)
/*----------------------------------------*/

/*----------------------------------------*/
/*  sec-9-home-7 (Marquee — carouselTicker + GSAP scroll-move)
/*  Structure mirrors Home 3 sec-2: .carouselTicker > ul.carouselTicker__list
/*----------------------------------------*/

/*----------------------------------------*/
/*  sec-10-home-7 (Insights for Founders — blog grid)
/*----------------------------------------*/

/*----------------------------------------*/
/*  sec-11-home-7 (Get in touch — contact form)
/*----------------------------------------*/

/*------------------------------------------------------------------
  Home 8 — Section 1: Hero
------------------------------------------------------------------*/

/*----------------------------------------*/
/*  Home 8 — Section 2 (Orange marquee — carouselTicker-left)
/*  Brand-1 bar, 32px semibold white, 20px gap, 16px star
/*----------------------------------------*/

/*------------------------------------------------------------------
  Home 8 — Section 3 (About block + staggered photos)
------------------------------------------------------------------*/

/*----------------------------------------*/
/*  Home 8 — Section 4 (Services + Home 1 sec-4 GSAP hover stack)
/*----------------------------------------*/

/*------------------------------------------------------------------
  Home 8 — Section 6 (Selected works)
------------------------------------------------------------------*/

/*------------------------------------------------------------------
  Home 8 — Section 7 (Image rails with scroll-move-right/left)
------------------------------------------------------------------*/

/*------------------------------------------------------------------
  Home 8 — Section 8 (Testimonials)
------------------------------------------------------------------*/

/*------------------------------------------------------------------
  Home 8 — Section 9 (CTA)
------------------------------------------------------------------*/

/*----------------------------------------*/
/*  sec-1-home-9 (Modern Agency Hero)
/*----------------------------------------*/

/*----------------------------------------*/
/*  sec-2-home-9 (Home 9 — stats / odometer row)
/*----------------------------------------*/

/*----------------------------------------*/
/*  sec-3-home-9 (Home 9 — about + 3 pillars)
/*----------------------------------------*/

/*----------------------------------------*/
/*  sec-4-home-9 (Home 9 — Selected work)
/*----------------------------------------*/

/*----------------------------------------*/
/*  sec-5-home-9 (Home 9 — Marquee / contact)
/*----------------------------------------*/
[data-bs-theme=dark] .sec-5-home-9 {
  --sec5-text: var(--at-neutral-950, #f4f4f4);
}

@keyframes sec5-home-9-marquee {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(-50%, 0, 0);
  }
}
/*----------------------------------------*/
/*  sec-6-home-9 (Home 9 — Meet our team)
/*----------------------------------------*/

/*----------------------------------------*/
/*  sec-7-home-9 (Home 9 — Collective)
/*----------------------------------------*/

@keyframes sec-7-home-9-deco-spin {
  to {
    transform: rotate(360deg);
  }
}

/*----------------------------------------*/
/*  Home 10 — placeholder section spacing
/*----------------------------------------*/

/*------------------------------------------------------------------
  Home 10 — Section 1: Creative 3D Studio Hero
------------------------------------------------------------------*/
@keyframes h10-marquee {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}

/*----------------------------------------*/
/*  sec-2-home-10 (Home 10 — Panoramic scene)
/*----------------------------------------*/

/*----------------------------------------*/
/*  sec-3-home-10 (Home 10 — Selected projects / masonry)
/*----------------------------------------*/

/*----------------------------------------*/
/*  sec-4-home-10 (Home 10 — Our services)
/*----------------------------------------*/

/*----------------------------------------*/
/*  sec-5-home-10 (Home 10 — About + metrics)
/*----------------------------------------*/

/*----------------------------------------*/
/*  sec-6-home-10 (Home 10 — Meet the team)
/*----------------------------------------*/

/*==================================================================
  Home 11 — Motion & Video Creative Studio
==================================================================*/

/*------------------------------------------------------------------
  Section 1 — Cinematic Hero
------------------------------------------------------------------*/
@keyframes scroll-line-drop {
  0% {
    top: -40%;
  }
  100% {
    top: 140%;
  }
}

/*------------------------------------------------------------------
  Section 2 — Trusted Clients Marquee
------------------------------------------------------------------*/

/*------------------------------------------------------------------
  Section 3 — About Studio
------------------------------------------------------------------*/

/*------------------------------------------------------------------
  Section 4 — Featured Works
------------------------------------------------------------------*/

/*------------------------------------------------------------------
  Section 5 — Services (modernized)
------------------------------------------------------------------*/

/*------------------------------------------------------------------
  Section 6 — Studio Process
------------------------------------------------------------------*/

/*------------------------------------------------------------------
  Section 7 — Testimonials
------------------------------------------------------------------*/

/*------------------------------------------------------------------
  Section 8 — Call to Action
------------------------------------------------------------------*/

/* Home 12 / Section 1 — Hero (Pure Design. Potent Storytelling) */

/* ── Social proof pill ───────────────────────────── */

/* ── Headline ────────────────────────────────────── */

/* ── Subline ─────────────────────────────────────── */

/* ── CTAs ────────────────────────────────────────── */

/* ── Image strip — Swiper marquee ────────────────── */

/* ── Responsive ──────────────────────────────────── */
/* Home 12 / Section 2 — Selected Projects */
.sec-2-home-12 {
  background-color: var(--at-neutral-50);
  padding-top: 120px;
}

/* ── Section header ─────────────────────────────── */
.sec-2-home-12__header {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  row-gap: 16px;
  margin-bottom: 64px;
}

.sec-2-home-12__eyebrow {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 10px 16px;
  border: 1px solid rgba(255, 87, 1, 0.16);
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(255, 87, 1, 0.1), rgba(255, 87, 1, 0.04));
  font-family: var(--at-ff-heading);
  font-weight: 600;
  font-size: 11px;
  line-height: 1;
  letter-spacing: 0.14em;
  color: var(--at-theme-primary);
  text-transform: uppercase;
}

.sec-2-home-12__title {
  font-family: var(--at-ff-heading);
  font-weight: 500;
  font-size: clamp(46px, 5.6vw, 84px);
  line-height: 1.04;
  letter-spacing: -0.05em;
  color: var(--at-neutral-950);
}

.sec-2-home-12__sub {
  font-family: var(--at-ff-heading);
  font-weight: 500;
  font-size: 16px;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--at-neutral-500);
  max-width: 620px;
}

/* ── Cards container ────────────────────────────── */
.sec-2-home-12__cards {
  display: flex;
  flex-direction: column;
  row-gap: 32px;
  margin-inline: auto;
  max-width: 1280px;
}

/* ── Project card ───────────────────────────────── */
.card-home-12-project {
  display: flex;
  align-items: center;
  gap: 48px;
  padding: 32px;
  background-color: var(--at-neutral-0);
  border: 1px solid var(--at-neutral-100);
  border-radius: 24px;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  box-shadow: 0 18px 40px -28px rgba(0, 0, 0, 0.18);
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
  /* JS-driven stack: ScrollTrigger pins each card; transform-origin keeps the
     scale-down "tucking under" feel anchored at the top of each card. */
  transform-origin: 50% 0%;
  will-change: transform;
}
.card-home-12-project:hover, .card-home-12-project:focus-visible {
  border-color: var(--at-neutral-300);
  box-shadow: 0 12px 32px -16px rgba(0, 0, 0, 0.12);
  color: inherit;
}
.card-home-12-project:hover .card-home-12-project__img, .card-home-12-project:focus-visible .card-home-12-project__img {
  transform: scale(1.04);
}
.card-home-12-project:hover .card-home-12-project__title, .card-home-12-project:focus-visible .card-home-12-project__title {
  color: var(--at-theme-primary);
}

.card-home-12-project__image {
  flex: 0 0 480px;
  width: 480px;
  height: 400px;
  border-radius: 16px;
  overflow: hidden;
  background-color: var(--at-neutral-100);
  position: relative;
}

.card-home-12-project__img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
  transition: transform 0.6s ease;
}

.card-home-12-project__content {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  row-gap: 24px;
}

.card-home-12-project__top {
  display: flex;
  align-items: center;
  -moz-column-gap: 12px;
       column-gap: 12px;
}

.card-home-12-project__num {
  font-family: var(--at-ff-heading);
  font-weight: 600;
  font-size: 12px;
  line-height: 1;
  letter-spacing: 0.24px;
  color: var(--at-theme-primary);
}

.card-home-12-project__dot {
  display: inline-block;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background-color: var(--at-neutral-300);
}

.card-home-12-project__label {
  font-family: var(--at-ff-heading);
  font-weight: 600;
  font-size: 12px;
  line-height: 1;
  letter-spacing: 0.24px;
  color: var(--at-neutral-500);
  text-transform: uppercase;
}

.card-home-12-project__title {
  margin: 0;
  font-family: var(--at-ff-heading);
  font-weight: 600;
  font-size: 36px;
  line-height: 1;
  letter-spacing: -0.05em;
  color: var(--at-neutral-950);
  transition: color 0.3s ease;
}

.card-home-12-project__desc {
  margin: 0;
  font-family: var(--at-ff-heading);
  font-weight: 500;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: var(--at-neutral-500);
}

.card-home-12-project__tags {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.card-home-12-project__tags li {
  display: inline-flex;
}

.card-home-12-project__tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10.5px 19px;
  border: 1px solid var(--at-neutral-100);
  border-radius: 32px;
  font-family: var(--at-ff-heading);
  font-weight: 600;
  font-size: 12px;
  line-height: 1;
  letter-spacing: -0.24px;
  color: var(--at-neutral-900);
  text-transform: uppercase;
  white-space: nowrap;
  background-color: transparent;
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}
.card-home-12-project__tag.is-filled {
  background-color: var(--at-neutral-900);
  border-color: var(--at-neutral-900);
  color: var(--at-neutral-0);
}

/* ── Responsive ─────────────────────────────────── */
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .sec-2-home-12 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  .card-home-12-project__image {
    flex: 0 0 420px;
    width: 420px;
    height: 360px;
  }
  .card-home-12-project__title {
    font-size: 32px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .sec-2-home-12 {
    padding-top: 90px;
    padding-bottom: 90px;
  }
  .card-home-12-project {
    gap: 32px;
    padding: 24px;
  }
  .card-home-12-project__image {
    flex: 0 0 360px;
    width: 360px;
    height: 320px;
  }
  .card-home-12-project__title {
    font-size: 30px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .sec-2-home-12 {
    padding-top: 80px;
    padding-bottom: 80px;
  }
  .sec-2-home-12__header {
    margin-bottom: 48px;
  }
  .card-home-12-project {
    gap: 24px;
    padding: 20px;
  }
  .card-home-12-project__image {
    flex: 0 0 320px;
    width: 320px;
    height: 300px;
  }
  .card-home-12-project__content {
    row-gap: 16px;
  }
  .card-home-12-project__title {
    font-size: 28px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sec-2-home-12 {
    padding-top: 64px;
    padding-bottom: 64px;
  }
  .sec-2-home-12__header {
    margin-bottom: 40px;
    row-gap: 12px;
  }
  .sec-2-home-12__cards {
    row-gap: 24px;
  }
  .card-home-12-project {
    flex-direction: column;
    align-items: stretch;
    gap: 24px;
    padding: 20px;
  }
  .card-home-12-project__image {
    flex: 0 0 auto;
    width: 100%;
    height: 360px;
  }
  .card-home-12-project__title {
    font-size: 28px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .sec-2-home-12 {
    padding-top: 56px;
    padding-bottom: 56px;
  }
  .sec-2-home-12__header {
    margin-bottom: 32px;
    row-gap: 12px;
  }
  .sec-2-home-12__cards {
    row-gap: 20px;
  }
  .card-home-12-project {
    flex-direction: column;
    align-items: stretch;
    gap: 20px;
    padding: 16px;
  }
  .card-home-12-project__image {
    flex: 0 0 auto;
    width: 100%;
    height: 280px;
  }
  .card-home-12-project__content {
    row-gap: 14px;
  }
  .card-home-12-project__title {
    font-size: 24px;
  }
  .card-home-12-project__tag {
    padding: 9px 16px;
    font-size: 11px;
  }
}
@media (max-width: 574.98px) {
  .sec-2-home-12 {
    padding-top: 48px;
    padding-bottom: 48px;
  }
  .sec-2-home-12__header {
    margin-bottom: 28px;
  }
  .card-home-12-project {
    flex-direction: column;
    align-items: stretch;
    gap: 18px;
    padding: 14px;
    border-radius: 20px;
  }
  .card-home-12-project__image {
    flex: 0 0 auto;
    width: 100%;
    height: 240px;
  }
  .card-home-12-project__content {
    row-gap: 12px;
  }
  .card-home-12-project__title {
    font-size: 22px;
  }
  .card-home-12-project__desc {
    font-size: 15px;
  }
  .card-home-12-project__tag {
    padding: 8px 14px;
    font-size: 10.5px;
  }
}
/* Home 12 / Section 3 — Our Services */

/* ── Section header ─────────────────────────────── */

/* ── Services grid ──────────────────────────────── */

/* ── Service card ───────────────────────────────── */

/* ── Responsive ─────────────────────────────────── */
/* GymGrid connected ecosystem */
.sec-connected {
  background-color: var(--at-neutral-50);
  padding-bottom: 120px;
}

.sec-connected__shell {
  position: relative;
  overflow: hidden;
  padding: 120px 0;
  border-radius: 36px;
  background-color: var(--at-neutral-950);
  color: var(--at-neutral-0);
}
.sec-connected__shell::before {
  position: absolute;
  inset: 0;
  content: "";
  pointer-events: none;
  opacity: 0.18;
  background-image: linear-gradient(rgba(255, 255, 255, 0.12) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.12) 1px, transparent 1px);
  background-size: 80px 80px;
  -webkit-mask-image: linear-gradient(to bottom, black, transparent 50%);
          mask-image: linear-gradient(to bottom, black, transparent 50%);
}
.sec-connected__shell .container {
  position: relative;
  z-index: 1;
}

.sec-connected__header {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 1040px;
  margin: 0 auto 64px;
  text-align: center;
}

.sec-connected__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin: 0 0 20px;
  padding: 9px 14px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 999px;
  font-family: var(--at-ff-heading);
  font-size: 11px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.08em;
  color: var(--at-neutral-0);
  text-transform: uppercase;
}

.sec-connected__eyebrow-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background-color: var(--at-theme-primary);
  box-shadow: 0 0 0 4px rgba(255, 87, 1, 0.16);
}

.sec-connected__title {
  max-width: 980px;
  font-family: var(--at-ff-heading);
  font-size: clamp(42px, 5.5vw, 76px);
  font-weight: 600;
  line-height: 1.02;
  letter-spacing: -0.055em;
  color: var(--at-neutral-0);
}
.sec-connected__title span {
  color: var(--at-theme-primary);
}

.sec-connected__intro {
  max-width: 760px;
  margin-top: 24px !important;
  font-family: var(--at-ff-heading);
  font-size: 17px;
  font-weight: 500;
  line-height: 1.55;
  letter-spacing: -0.02em;
  color: var(--at-neutral-300);
}

.sec-connected__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.connected-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 100%;
  padding: 0;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 22px;
  background-color: var(--at-neutral-0);
  color: var(--at-neutral-950);
  transition: transform 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease;
}
.connected-card:hover {
  transform: translateY(-6px);
  border-color: rgba(255, 87, 1, 0.5);
  box-shadow: 0 24px 50px -30px rgba(0, 0, 0, 0.75);
}

.connected-card__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 42px;
}

.connected-card__head {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 250px;
  padding: 26px;
  overflow: hidden;
  color: var(--at-neutral-0);
}
.connected-card__head::after {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--connected-card-overlay, linear-gradient(180deg, rgba(8, 8, 8, 0.22), rgba(8, 8, 8, 0.95)));
  z-index: 1;
}
.connected-card__head > * {
  position: relative;
  z-index: 2;
}
.connected-card__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--connected-card-bg-pos, center);
  transition: transform 0.45s ease;
}
.connected-card__head--payments {
  --connected-card-overlay: linear-gradient(180deg, rgba(8, 8, 8, 0.26), rgba(8, 8, 8, 0.95));
  --connected-card-bg-pos: 50% center;
}
.connected-card__head--access {
  --connected-card-overlay: linear-gradient(180deg, rgba(8, 8, 8, 0.22), rgba(8, 8, 8, 0.95));
  --connected-card-bg-pos: 52% 42%;
}
.connected-card__head--member {
  --connected-card-overlay: linear-gradient(180deg, rgba(8, 8, 8, 0.16), rgba(8, 8, 8, 0.95));
  --connected-card-bg-pos: center 18%;
}
.connected-card__head--communication {
  --connected-card-overlay: linear-gradient(180deg, rgba(8, 8, 8, 0.18), rgba(8, 8, 8, 0.95));
  --connected-card-bg-pos: 42% center;
}
.connected-card:hover .connected-card__bg {
  transform: scale(1.04);
}

.connected-card__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  border-radius: 15px;
  background-color: rgba(255, 255, 255, 0.92);
  color: var(--at-theme-primary);
}
.connected-card__icon svg {
  width: 25px;
  height: 25px;
}

.connected-card__num {
  font-family: var(--at-ff-heading);
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.08em;
  color: rgba(255, 255, 255, 0.76);
}

.connected-card__title {
  margin: 0 0 8px;
  font-family: var(--at-ff-heading);
  font-size: clamp(24px, 2vw, 31px);
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.045em;
  color: var(--at-neutral-0);
}

.connected-card__desc {
  min-height: 44px;
  margin: 0;
  font-family: var(--at-ff-heading);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: rgba(255, 255, 255, 0.8);
}

.connected-card__list {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin: 20px 26px 26px;
  padding: 0;
  border-top: 1px solid var(--at-neutral-100);
  list-style: none;
}
.connected-card__list li {
  position: relative;
  display: flex;
  align-items: center;
  gap: 11px;
  min-height: 44px;
  padding: 8px 0;
  border-bottom: 1px solid var(--at-neutral-100);
  font-family: var(--at-ff-heading);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: -0.02em;
  color: var(--at-neutral-900);
}
.connected-card__list i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  border-radius: 8px;
  background-color: rgba(255, 87, 1, 0.1);
  font-size: 13px;
  color: var(--at-theme-primary);
}

.connected-card__note {
  margin: auto 26px 0;
  padding-bottom: 26px;
  font-family: var(--at-ff-heading);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: -0.015em;
  color: var(--at-neutral-500);
}

.connected-flow {
  display: grid;
  grid-template-columns: 230px minmax(0, 1fr);
  gap: 30px 42px;
  margin-top: 18px;
  padding: 34px;
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 22px;
  background: linear-gradient(120deg, rgba(255, 87, 1, 0.18), rgba(255, 255, 255, 0.045) 40%, rgba(255, 255, 255, 0.02));
}

.connected-flow__lead {
  display: flex;
  align-items: center;
  gap: 16px;
}

.connected-flow__mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  flex: 0 0 54px;
  border-radius: 16px;
  background-color: var(--at-theme-primary);
  color: var(--at-neutral-0);
}
.connected-flow__mark svg {
  width: 28px;
  height: 28px;
}

.connected-flow__lead p {
  margin: 0;
  font-family: var(--at-ff-heading);
  font-size: 17px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.035em;
  color: var(--at-neutral-0);
}

.connected-flow__steps {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 22px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.connected-flow__steps li {
  position: relative;
  min-width: 0;
}
.connected-flow__steps li:not(:last-child)::after {
  position: absolute;
  top: 16px;
  right: -16px;
  content: "\2192";
  font-family: var(--at-ff-heading);
  font-size: 17px;
  color: var(--at-neutral-500);
}
.connected-flow__steps p {
  margin: 12px 0 0;
  font-family: var(--at-ff-heading);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: -0.015em;
  color: var(--at-neutral-300);
}

.connected-flow__num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 50%;
  font-family: var(--at-ff-heading);
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
  color: var(--at-neutral-0);
}

.connected-flow__footer {
  grid-column: 1 / -1;
  margin: 0;
  padding-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  font-family: var(--at-ff-heading);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
  text-align: center;
  letter-spacing: -0.015em;
  color: var(--at-neutral-300);
}
.connected-flow__footer strong {
  color: var(--at-theme-primary);
  font-weight: 600;
}

@media only screen and (max-width: 1399px) {
  .sec-connected,
  .sec-connected__shell {
    padding-bottom: 90px;
  }
  .sec-connected__shell {
    padding-top: 90px;
  }
  .connected-card {
    padding: 0;
  }
  .connected-card__head {
    padding: 22px;
  }
  .connected-flow {
    grid-template-columns: 200px minmax(0, 1fr);
    gap: 28px;
    padding: 28px;
  }
  .connected-flow__steps {
    gap: 17px;
  }
  .connected-flow__steps li:not(:last-child)::after {
    right: -12px;
  }
}

@media only screen and (max-width: 1199px) {
  .sec-connected__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .connected-card__desc {
    min-height: auto;
  }
  .connected-flow {
    grid-template-columns: 1fr;
  }
  .connected-flow__steps {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    row-gap: 26px;
  }
  .connected-flow__steps li:nth-child(3)::after {
    display: none;
  }
}

@media only screen and (max-width: 991px) {
  .sec-connected {
    padding-bottom: 64px;
  }
  .sec-connected__shell {
    padding: 64px 0;
    border-radius: 28px;
  }
  .sec-connected__header {
    margin-bottom: 44px;
  }
  .sec-connected__intro {
    font-size: 16px;
  }
}

@media only screen and (max-width: 767px) {
  .sec-connected {
    padding-bottom: 56px;
  }
  .sec-connected__shell {
    padding: 56px 0;
    border-radius: 24px;
  }
  .sec-connected__grid {
    grid-template-columns: 1fr;
  }
  .connected-card {
    padding: 0;
  }
  .connected-flow__steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .connected-flow__steps li:nth-child(3)::after {
    display: block;
  }
  .connected-flow__steps li:nth-child(2n)::after {
    display: none;
  }
}

@media (max-width: 574.98px) {
  .sec-connected {
    padding-bottom: 48px;
  }
  .sec-connected__shell {
    padding: 48px 0;
    border-radius: 20px;
  }
  .sec-connected__shell::before {
    background-size: 48px 48px;
  }
  .sec-connected__header {
    align-items: flex-start;
    margin-bottom: 32px;
    text-align: left;
  }
  .sec-connected__eyebrow {
    margin-bottom: 16px;
  }
  .sec-connected__title {
    font-size: 38px;
  }
  .sec-connected__intro {
    margin-top: 18px !important;
    font-size: 15px;
  }
  .connected-card {
    padding: 0;
    border-radius: 18px;
  }
  .connected-card__head {
    min-height: 230px;
    padding: 20px;
  }
  .connected-card__top {
    margin-bottom: 24px;
  }
  .connected-card__list {
    margin: 18px 20px 22px;
  }
  .connected-card__note {
    margin-right: 20px;
    margin-left: 20px;
    padding-bottom: 20px;
  }
  .connected-flow {
    gap: 26px;
    padding: 20px;
    border-radius: 18px;
  }
  .connected-flow__steps {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .connected-flow__steps li {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
  }
  .connected-flow__steps li:not(:last-child)::after,
  .connected-flow__steps li:nth-child(3)::after {
    display: block;
    top: auto;
    right: auto;
    bottom: -18px;
    left: 12px;
    content: "\2193";
    font-size: 14px;
  }
  .connected-flow__steps p {
    margin: 0;
    font-size: 13px;
  }
  .connected-flow__footer {
    padding-top: 20px;
    text-align: left;
  }
}

@media (prefers-reduced-motion: reduce) {
  .connected-card {
    transition: none;
  }
  .connected-card:hover {
    transform: none;
  }
}

/* Home 12 / Section 4 — Process Philosophy */

/* ── Section header ─────────────────────────────── */

/* ── Cards row ──────────────────────────────────── */

/* ── Process card ───────────────────────────────── */

/* ── Responsive ─────────────────────────────────── */
/* Home 12 / Section 5 — Pricing */
.sec-5-home-12 {
  background-color: var(--at-neutral-50);
  padding-top: 120px;
  padding-bottom: 120px;
  position: relative;
  overflow: hidden;
}

/* ── Dot pattern background ─────────────────────── */
.sec-5-home-12__dots {
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.18;
  background-image: radial-gradient(circle, rgba(0, 0, 0, 0.45) 1.2px, transparent 1.4px), radial-gradient(circle, rgba(0, 0, 0, 0.45) 1.2px, transparent 1.4px);
  background-size: 96px 96px, 96px 96px;
  background-position: 0 0, 48px 48px;
}

/* ── Section header ─────────────────────────────── */
.sec-5-home-12__header {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  row-gap: 16px;
  margin-bottom: 64px;
}

.sec-5-home-12__eyebrow {
  margin: 0;
  font-family: var(--at-ff-heading);
  font-weight: 600;
  font-size: 12px;
  line-height: 1;
  letter-spacing: 0.96px;
  color: var(--at-neutral-500);
  text-transform: uppercase;
}

.sec-5-home-12__title {
  margin: 0;
  font-family: var(--at-ff-heading);
  font-weight: 600;
  font-size: clamp(36px, 5vw, 64px);
  line-height: 1.125;
  letter-spacing: -0.05em;
  color: var(--at-neutral-950);
}

/* ── Tables row ─────────────────────────────────── */
.sec-5-home-12__tables {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 30px;
  max-width: 1287px;
  margin-inline: auto;
  margin-bottom: 64px;
}

/* ── Pricing card ───────────────────────────────── */
.card-home-12-price {
  position: relative;
  background-color: var(--at-neutral-0);
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.card-home-12-price__badge {
  position: absolute;
  top: 23px;
  right: 25px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 10px;
  border-radius: 20px;
  background-color: var(--at-theme-primary);
  color: var(--at-neutral-0);
  font-family: var(--at-ff-heading);
  font-weight: 600;
  font-size: 10px;
  line-height: 1;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  white-space: nowrap;
}

.card-home-12-price__plan {
  margin: 0;
  font-family: var(--at-ff-heading);
  font-weight: 600;
  font-size: 18px;
  line-height: 1;
  letter-spacing: -0.05em;
  color: var(--at-neutral-900);
  text-transform: capitalize;
}

.card-home-12-price__price {
  display: flex;
  align-items: flex-end;
  -moz-column-gap: 0;
       column-gap: 0;
}

.card-home-12-price__amount {
  font-family: var(--at-ff-heading);
  font-weight: 600;
  font-size: 48px;
  line-height: 52px;
  letter-spacing: -0.05em;
  color: var(--at-neutral-900);
}

.card-home-12-price__period {
  font-family: var(--at-ff-heading);
  font-weight: 500;
  font-size: 16px;
  line-height: 1.4;
  letter-spacing: -0.02em;
  color: var(--at-neutral-500);
  align-self: flex-end;
  padding-bottom: 4px;
}

.card-home-12-price__cta {
  margin-top: auto;
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  -moz-column-gap: 12px;
       column-gap: 12px;
  height: 50px;
  padding: 14px 42px;
  border-radius: 50px;
  background-color: var(--at-neutral-900);
  color: var(--at-neutral-0);
  text-decoration: none;
  font-family: var(--at-ff-heading);
  font-weight: 600;
  font-size: 16px;
  line-height: 1;
  letter-spacing: -0.05em;
  transition: background-color 0.3s ease, transform 0.3s ease;
}
.card-home-12-price__cta:hover, .card-home-12-price__cta:focus-visible {
  background-color: var(--at-theme-primary);
  color: var(--at-neutral-0);
}

/* ── Features list ──────────────────────────────── */

/* ── Custom pricing CTA ─────────────────────────── */

/* ── Responsive ─────────────────────────────────── */
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .sec-5-home-12 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .sec-5-home-12 {
    padding-top: 90px;
    padding-bottom: 90px;
  }
  .sec-5-home-12__tables {
    gap: 20px;
  }
  .card-home-12-price__cta {
    padding: 14px 28px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .sec-5-home-12 {
    padding-top: 80px;
    padding-bottom: 80px;
  }
  .sec-5-home-12__header {
    margin-bottom: 48px;
  }
  .sec-5-home-12__tables {
    gap: 18px;
    margin-bottom: 48px;
  }
  .card-home-12-price__cta {
    padding: 14px 22px;
    font-size: 15px;
  }
  .card-home-12-price__amount {
    font-size: 42px;
    line-height: 46px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sec-5-home-12 {
    padding-top: 64px;
    padding-bottom: 64px;
  }
  .sec-5-home-12__header {
    margin-bottom: 40px;
  }
  .sec-5-home-12__tables {
    grid-template-columns: 1fr;
    gap: 20px;
    max-width: 480px;
    margin-bottom: 40px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .sec-5-home-12 {
    padding-top: 56px;
    padding-bottom: 56px;
  }
  .sec-5-home-12__header {
    margin-bottom: 32px;
    row-gap: 12px;
  }
  .sec-5-home-12__tables {
    grid-template-columns: 1fr;
    gap: 16px;
    margin-bottom: 32px;
  }
  .card-home-12-price__amount {
    font-size: 40px;
    line-height: 44px;
  }
}
@media (max-width: 574.98px) {
  .sec-5-home-12 {
    padding-top: 48px;
    padding-bottom: 48px;
  }
  .sec-5-home-12__header {
    margin-bottom: 28px;
  }
  .sec-5-home-12__tables {
    grid-template-columns: 1fr;
    gap: 14px;
    margin-bottom: 28px;
  }
  .card-home-12-price {
    border-radius: 14px;
  }
  .card-home-12-price__amount {
    font-size: 36px;
    line-height: 40px;
  }
  .card-home-12-price__cta {
    padding: 13px 20px;
    font-size: 14px;
  }
  .sec-5-home-12__dots {
    background-size: 64px 64px, 64px 64px;
    background-position: 0 0, 32px 32px;
  }
}
/* Annual member-count pricing */
.sec-5-home-12 {
  position: relative;
  padding: 128px 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 12% 10%, rgba(255, 87, 1, 0.08), transparent 24%),
    radial-gradient(circle at 88% 86%, rgba(127, 11, 1, 0.06), transparent 26%),
    #f7f5f1;
}
.sec-5-home-12 .container {
  max-width: 1720px;
}
.sec-5-home-12__dots {
  opacity: 0.1;
  background-image: radial-gradient(circle, rgba(34, 27, 22, 0.42) 1px, transparent 1.2px);
  background-size: 72px 72px;
  background-position: 0 0;
  mask-image: linear-gradient(to bottom, transparent, #000 18%, #000 78%, transparent);
}
.sec-5-home-12__header {
  max-width: 940px;
  margin: 0 auto 54px;
  row-gap: 16px;
}
.sec-5-home-12__eyebrow {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 10px 15px;
  border: 1px solid rgba(255, 87, 1, 0.18);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.64);
  color: var(--at-theme-primary, #FF5701);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.13em;
}
.sec-5-home-12__title {
  max-width: 900px;
  font-size: clamp(44px, 5vw, 72px);
  line-height: 1.04;
}
.sec-5-home-12__subtitle {
  max-width: 720px;
  margin: 0;
  color: #665f59;
  font-family: var(--at-ff-heading);
  font-size: 18px;
  font-weight: 500;
  line-height: 1.55;
}
.sec-5-home-12__basis {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: 4px;
  padding: 11px 18px;
  border: 1px solid rgba(28, 23, 19, 0.1);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.76);
  color: #4d4742;
  font-family: var(--at-ff-heading);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.3;
  box-shadow: 0 14px 34px rgba(45, 32, 23, 0.05);
}
.sec-5-home-12__basis svg {
  flex: 0 0 auto;
  color: var(--at-theme-primary, #FF5701);
}
.sec-5-home-12__tables {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 12px;
  max-width: none;
  margin: 0 auto 52px;
  padding-top: 12px;
}
.card-home-12-price {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 0;
  min-height: 430px;
  padding: 30px 16px 18px;
  border: 1px solid rgba(31, 24, 19, 0.12);
  border-radius: 18px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.84);
  box-shadow: 0 20px 48px -38px rgba(38, 25, 17, 0.42);
  transition: transform 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease;
}
.card-home-12-price:hover {
  z-index: 2;
  border-color: rgba(255, 87, 1, 0.42);
  transform: translateY(-6px);
  box-shadow: 0 28px 56px -34px rgba(61, 31, 14, 0.34);
}
.card-home-12-price.is-popular {
  border-color: rgba(255, 87, 1, 0.58);
  background: linear-gradient(180deg, rgba(255, 87, 1, 0.13), rgba(255, 255, 255, 0.96) 44%);
  box-shadow: 0 26px 58px -34px rgba(255, 87, 1, 0.42);
}
.card-home-12-price__badge {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  display: flex;
  height: 23px;
  padding: 0 8px;
  border-radius: 0;
  background: var(--at-theme-primary, #FF5701);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.card-home-12-price.is-popular {
  padding-top: 38px;
}
.card-home-12-price__plan {
  margin: 0;
  color: #171412;
  font-family: var(--at-ff-heading);
  font-size: 22px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.04em;
  text-transform: none;
}
.card-home-12-price__members {
  margin: 10px 0 0;
  color: var(--at-theme-primary, #FF5701);
  font-family: var(--at-ff-heading);
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}
.card-home-12-price__visual {
  width: 60px;
  height: 52px;
  margin: 24px 0 20px;
  color: var(--at-theme-primary, #FF5701);
  filter: drop-shadow(0 8px 14px rgba(255, 87, 1, 0.12));
}
.card-home-12-price__price {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 5px;
  width: 100%;
  white-space: nowrap;
}
.card-home-12-price__currency {
  color: #171412;
  font-family: var(--at-ff-heading);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
}
.card-home-12-price__amount {
  color: #171412;
  font-family: var(--at-ff-heading);
  font-size: clamp(24px, 1.7vw, 30px);
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.045em;
}
.card-home-12-price__period {
  margin: 9px 0 0;
  padding: 0;
  align-self: auto;
  color: var(--at-theme-primary, #FF5701);
  font-family: var(--at-ff-heading);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
}
.card-home-12-price__monthly {
  margin: 24px 0 0;
  color: #4d4742;
  font-family: var(--at-ff-heading);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.35;
  text-align: center;
}
.card-home-12-price__billing {
  margin: 5px 0 0;
  color: #9b938b;
  font-family: var(--at-ff-heading);
  font-size: 10px;
  font-weight: 500;
  line-height: 1;
}
.card-home-12-price__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  width: 100%;
  height: 44px;
  margin-top: auto;
  padding: 0 12px;
  border: 1px solid rgba(255, 87, 1, 0.56);
  border-radius: 10px;
  background: transparent;
  color: #c94400;
  font-family: var(--at-ff-heading);
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  transition: color 0.3s ease, background 0.3s ease, border-color 0.3s ease, transform 0.3s ease;
}
.card-home-12-price__cta:hover,
.card-home-12-price__cta:focus-visible,
.card-home-12-price.is-popular .card-home-12-price__cta {
  border-color: var(--at-theme-primary, #FF5701);
  background: var(--at-theme-primary, #FF5701);
  color: #fff;
}
.card-home-12-price.is-popular .card-home-12-price__cta:hover,
.card-home-12-price.is-popular .card-home-12-price__cta:focus-visible {
  border-color: #171412;
  background: #171412;
}
.card-home-12-price--custom {
  background: #171412;
  border-color: #171412;
}
.card-home-12-price--custom .card-home-12-price__plan {
  color: #fff;
}
.card-home-12-price--custom .card-home-12-price__members {
  color: rgba(255, 255, 255, 0.58);
}
.card-home-12-price--custom .card-home-12-price__visual {
  color: var(--at-theme-primary, #FF5701);
}
.card-home-12-price__custom-price {
  margin: 0;
  color: #fff;
  font-family: var(--at-ff-heading);
  font-size: 26px;
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: -0.04em;
  text-align: center;
}
.card-home-12-price__custom-price span {
  color: var(--at-theme-primary, #FF5701);
}
.card-home-12-price__custom-desc {
  margin: 22px 0 18px;
  color: rgba(255, 255, 255, 0.66);
  font-family: var(--at-ff-heading);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.5;
  text-align: center;
}
.card-home-12-price--custom .card-home-12-price__cta {
  border-color: var(--at-theme-primary, #FF5701);
  background: var(--at-theme-primary, #FF5701);
  color: #fff;
}
.sec-5-home-12__included {
  position: relative;
  max-width: 1500px;
  margin: 0 auto 20px;
  padding: 40px;
  border: 1px solid rgba(255, 87, 1, 0.24);
  border-radius: 26px;
  overflow: hidden;
  background: #171412;
  box-shadow: 0 28px 64px -38px rgba(31, 15, 8, 0.62);
  isolation: isolate;
}
.sec-5-home-12__included::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: -160px;
  right: -100px;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 87, 1, 0.23), transparent 66%);
}
.sec-5-home-12__included::after {
  content: "";
  position: absolute;
  z-index: -1;
  right: 34px;
  bottom: 22px;
  width: 112px;
  height: 112px;
  opacity: 0.18;
  background-image: radial-gradient(circle, #fff 1.4px, transparent 1.6px);
  background-size: 14px 14px;
}
.sec-5-home-12__included-heading {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 28px;
  margin-bottom: 28px;
}
.sec-5-home-12__included-heading p {
  order: 2;
  max-width: 230px;
  margin: 0;
  color: rgba(255, 255, 255, 0.48);
  font-family: var(--at-ff-heading);
  font-size: 11px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.1em;
  text-align: right;
  text-transform: uppercase;
}
.sec-5-home-12__included h3 {
  max-width: 620px;
  margin: 0;
  color: #fff;
  font-family: var(--at-ff-heading);
  font-size: clamp(26px, 2.3vw, 36px);
  font-weight: 700;
  line-height: 1.08;
  letter-spacing: -0.045em;
  text-align: left;
}
.sec-5-home-12__included ul {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.sec-5-home-12__included li {
  display: flex;
  min-height: 132px;
  align-items: center;
  justify-content: space-between;
  flex-direction: column;
  gap: 18px;
  padding: 18px 14px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.055);
  color: #fff;
  font-family: var(--at-ff-heading);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.3;
  text-align: center;
  transition: border-color 0.3s ease, background 0.3s ease, transform 0.3s ease;
}
.sec-5-home-12__included li:hover {
  border-color: rgba(255, 87, 1, 0.42);
  background: rgba(255, 87, 1, 0.1);
  transform: translateY(-4px);
}
.sec-5-home-12__included-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(255, 87, 1, 0.24);
  border-radius: 13px;
  background: rgba(255, 87, 1, 0.13);
  color: var(--at-theme-primary, #FF5701);
}
.sec-5-home-12__included-icon svg {
  width: 24px;
  height: 24px;
}
.sec-5-home-12__included li strong {
  color: rgba(255, 255, 255, 0.9);
  font-family: inherit;
  font-size: inherit;
  font-weight: 600;
  line-height: inherit;
}
.sec-5-home-12__note {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  max-width: 1500px;
  margin: 0 auto;
  padding: 22px 24px;
  border: 1px solid rgba(31, 24, 19, 0.1);
  border-radius: 18px;
  background: #fff;
}
.sec-5-home-12__note strong {
  display: block;
  margin-bottom: 4px;
  color: #171412;
  font-family: var(--at-ff-heading);
  font-size: 15px;
  font-weight: 700;
}
.sec-5-home-12__note p {
  margin: 0;
  color: #777068;
  font-family: var(--at-ff-heading);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.45;
}
.sec-5-home-12__note > a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex: 0 0 auto;
  min-height: 48px;
  padding: 0 22px;
  border-radius: 999px;
  background: #171412;
  color: #fff;
  font-family: var(--at-ff-heading);
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  transition: background 0.3s ease, transform 0.3s ease;
}
.sec-5-home-12__note > a:hover,
.sec-5-home-12__note > a:focus-visible {
  background: var(--at-theme-primary, #FF5701);
  color: #fff;
  transform: translateY(-2px);
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .sec-5-home-12__tables {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    max-width: 1120px;
  }
  .card-home-12-price__amount {
    font-size: 28px;
  }
  .sec-5-home-12__included ul {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    row-gap: 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .sec-5-home-12 {
    padding: 92px 0;
  }
  .sec-5-home-12__tables {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    max-width: 760px;
  }
  .card-home-12-price {
    min-height: 420px;
  }
  .card-home-12-price__amount {
    font-size: 30px;
  }
  .sec-5-home-12__included ul {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    row-gap: 18px;
  }
}
@media (max-width: 767px) {
  .sec-5-home-12 {
    padding: 76px 0;
  }
  .sec-5-home-12__header {
    align-items: flex-start;
    margin-bottom: 40px;
    text-align: left;
  }
  .sec-5-home-12__title {
    font-size: clamp(38px, 11vw, 52px);
  }
  .sec-5-home-12__subtitle {
    font-size: 16px;
  }
  .sec-5-home-12__basis {
    align-items: flex-start;
    border-radius: 16px;
    text-align: left;
  }
  .sec-5-home-12__tables {
    display: flex;
    gap: 14px;
    max-width: none;
    margin-right: calc(var(--bs-gutter-x, 1.5rem) * -0.5);
    margin-bottom: 40px;
    padding: 12px 24px 18px 0;
    overflow-x: auto;
    scroll-padding-left: 0;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }
  .sec-5-home-12__tables::-webkit-scrollbar {
    display: none;
  }
  .card-home-12-price {
    flex: 0 0 min(82vw, 300px);
    min-height: 420px;
    scroll-snap-align: start;
  }
  .card-home-12-price__amount {
    font-size: 30px;
  }
  .sec-5-home-12__included {
    padding: 30px 20px;
    border-radius: 22px;
  }
  .sec-5-home-12__included-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 24px;
  }
  .sec-5-home-12__included-heading p {
    order: -1;
    text-align: left;
  }
  .sec-5-home-12__included h3 {
    text-align: left;
  }
  .sec-5-home-12__included ul {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
  .sec-5-home-12__included li {
    min-height: 118px;
    justify-content: space-between;
    gap: 14px;
    padding: 16px 10px;
    text-align: center;
  }
  .sec-5-home-12__note {
    align-items: stretch;
    flex-direction: column;
    padding: 22px;
  }
  .sec-5-home-12__note > a {
    width: 100%;
  }
}
@media (prefers-reduced-motion: reduce) {
  .card-home-12-price,
  .card-home-12-price__cta,
  .sec-5-home-12__included li,
  .sec-5-home-12__note > a {
    transition: none;
  }
  .card-home-12-price:hover,
  .sec-5-home-12__included li:hover,
  .sec-5-home-12__note > a:hover {
    transform: none;
  }
}
/* Home 12 / Section 6 — About + Brand logos (dark) */

/* ── Top bar with line ──────────────────────────── */

/* ── Lede paragraph ─────────────────────────────── */

/* ── Brand logos — Swiper marquee ────────────────── */

/* ── Responsive ─────────────────────────────────── */
/* Home 12 / Section 7 — Testimonials */
.sec-7-home-12 {
  background-color: var(--at-neutral-50);
  border-bottom: 1px solid var(--at-neutral-200, #cdcccc);
  padding-top: 120px;
  padding-bottom: 120px;
}

/* ── Section header ─────────────────────────────── */
.sec-7-home-12__header {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  row-gap: 16px;
  margin-bottom: 80px;
}

.sec-7-home-12__eyebrow {
  margin: 0;
  font-family: var(--at-ff-heading);
  font-weight: 600;
  font-size: 12px;
  line-height: 1;
  letter-spacing: 0.96px;
  color: var(--at-neutral-500);
  text-transform: uppercase;
}

.sec-7-home-12__title {
  margin: 0;
  font-family: var(--at-ff-heading);
  font-weight: 600;
  font-size: clamp(36px, 5vw, 64px);
  line-height: 1.125;
  letter-spacing: -0.05em;
  color: var(--at-neutral-950);
}

/* ── Cards row (3 staggered columns) ────────────── */
.sec-7-home-12__row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  max-width: 1280px;
  margin-inline: auto;
  align-items: start;
}

.sec-7-home-12__col {
  display: flex;
  flex-direction: column;
  row-gap: 24px;
}

.sec-7-home-12__col--offset-lg {
  padding-top: 48px;
}

.sec-7-home-12__col--offset-sm {
  padding-top: 16px;
}

/* ── Testimonial card ───────────────────────────── */
.card-home-12-testimonial {
  background-color: var(--at-neutral-0);
  border: 1px solid var(--at-neutral-100);
  border-radius: 20px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  row-gap: 16px;
  transition: border-color 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease;
}
.card-home-12-testimonial:hover, .card-home-12-testimonial:focus-within {
  border-color: var(--at-neutral-300);
  box-shadow: 0 12px 32px -16px rgba(0, 0, 0, 0.12);
}

.card-home-12-testimonial--dark {
  background-color: var(--at-neutral-950);
  border-color: var(--at-neutral-950);
}
.card-home-12-testimonial--dark .card-home-12-testimonial__quote {
  color: var(--at-neutral-0);
}
.card-home-12-testimonial--dark .card-home-12-testimonial__name {
  color: var(--at-neutral-0);
}
.card-home-12-testimonial--dark .card-home-12-testimonial__role {
  color: var(--at-neutral-300);
}
.card-home-12-testimonial--dark:hover, .card-home-12-testimonial--dark:focus-within {
  border-color: var(--at-neutral-800);
}

.card-home-12-testimonial__quote {
  font-family: var(--at-ff-heading);
  font-weight: 500;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: var(--at-neutral-700);
}

.card-home-12-testimonial__author {
  display: flex;
  align-items: center;
  -moz-column-gap: 12px;
       column-gap: 12px;
}

.card-home-12-testimonial__avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  -o-object-fit: cover;
     object-fit: cover;
  flex-shrink: 0;
}

.card-home-12-testimonial__meta {
  display: flex;
  flex-direction: column;
  row-gap: 4px;
  line-height: 1;
}

.card-home-12-testimonial__name {
  font-family: var(--at-ff-heading);
  font-weight: 600;
  font-size: 15px;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--at-neutral-950);
}

.card-home-12-testimonial__role {
  font-family: var(--at-ff-heading);
  font-weight: 500;
  font-size: 13px;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--at-neutral-500);
}

/* ── Responsive ─────────────────────────────────── */
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .sec-7-home-12 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .sec-7-home-12 {
    padding-top: 90px;
    padding-bottom: 90px;
  }
  .sec-7-home-12__row {
    gap: 18px;
  }
  .sec-7-home-12__col {
    row-gap: 18px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .sec-7-home-12 {
    padding-top: 80px;
    padding-bottom: 80px;
  }
  .sec-7-home-12__header {
    margin-bottom: 56px;
  }
  .sec-7-home-12__row {
    gap: 16px;
  }
  .sec-7-home-12__col {
    row-gap: 16px;
  }
  .sec-7-home-12__col--offset-lg {
    padding-top: 32px;
  }
  .sec-7-home-12__col--offset-sm {
    padding-top: 12px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sec-7-home-12 {
    padding-top: 64px;
    padding-bottom: 64px;
  }
  .sec-7-home-12__header {
    margin-bottom: 48px;
  }
  .sec-7-home-12__row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
  }
  .sec-7-home-12__col {
    row-gap: 16px;
    padding-top: 0 !important;
  }
  .card-home-12-testimonial {
    padding: 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .sec-7-home-12 {
    padding-top: 56px;
    padding-bottom: 56px;
  }
  .sec-7-home-12__header {
    margin-bottom: 40px;
    row-gap: 12px;
  }
  .sec-7-home-12__row {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .sec-7-home-12__col {
    row-gap: 14px;
    padding-top: 0 !important;
  }
  .card-home-12-testimonial {
    padding: 18px;
    border-radius: 18px;
  }
}
@media (max-width: 574.98px) {
  .sec-7-home-12 {
    padding-top: 48px;
    padding-bottom: 48px;
  }
  .sec-7-home-12__header {
    margin-bottom: 32px;
    row-gap: 12px;
  }
  .sec-7-home-12__row {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .sec-7-home-12__col {
    row-gap: 12px;
    padding-top: 0 !important;
  }
  .card-home-12-testimonial {
    padding: 16px;
    border-radius: 16px;
    row-gap: 14px;
  }
  .card-home-12-testimonial__quote {
    font-size: 15px;
  }
}
/* Home 12 / Section 8 — FAQ accordion */
.sec-8-home-12 {
  background-color: var(--at-neutral-50);
  padding-top: 120px;
  padding-bottom: 120px;
}

/* ── Section header ─────────────────────────────── */
.sec-8-home-12__header {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  row-gap: 16px;
  margin-bottom: 64px;
}

.sec-8-home-12__eyebrow {
  margin: 0;
  font-family: var(--at-ff-heading);
  font-weight: 600;
  font-size: 12px;
  line-height: 1;
  letter-spacing: 0.96px;
  color: var(--at-neutral-500);
  text-transform: uppercase;
}

.sec-8-home-12__title {
  margin: 0;
  font-family: var(--at-ff-heading);
  font-weight: 600;
  font-size: clamp(36px, 5vw, 64px);
  line-height: 1.125;
  letter-spacing: -0.05em;
  color: var(--at-neutral-950);
}

/* ── List ───────────────────────────────────────── */
.sec-8-home-12__list {
  display: flex;
  flex-direction: column;
  row-gap: 12px;
  max-width: 800px;
  margin-inline: auto;
}

/* ── Accordion item (native <details>) ──────────── */
.sec-8-home-12__item {
  background-color: var(--at-neutral-0);
  border: 1px solid var(--at-neutral-100);
  border-radius: 16px;
  overflow: hidden;
  transition: border-color 0.3s ease;
}
.sec-8-home-12__item[open] {
  border-color: var(--at-neutral-300);
}

.sec-8-home-12__summary {
  list-style: none;
  cursor: pointer;
  padding: 22px 24px 22px 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  -moz-column-gap: 16px;
       column-gap: 16px;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.sec-8-home-12__summary::-webkit-details-marker {
  display: none;
}
.sec-8-home-12__summary::marker {
  content: "";
}

.sec-8-home-12__question {
  font-family: var(--at-ff-heading);
  font-weight: 600;
  font-size: 17px;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: var(--at-neutral-950);
}

.sec-8-home-12__toggle {
  flex-shrink: 0;
  position: relative;
  width: 32px;
  height: 32px;
  border-radius: 999px;
  background-color: var(--at-neutral-50);
  color: var(--at-neutral-950);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.3s ease, color 0.3s ease;
}

.sec-8-home-12__bar {
  position: absolute;
  background-color: currentColor;
  border-radius: 1px;
  transition: opacity 0.25s ease, transform 0.25s ease;
}

.sec-8-home-12__bar--h {
  width: 14px;
  height: 1.6px;
}

.sec-8-home-12__bar--v {
  width: 1.6px;
  height: 14px;
}

.sec-8-home-12__item[open] .sec-8-home-12__toggle {
  background-color: var(--at-neutral-950);
  color: var(--at-neutral-0);
}

.sec-8-home-12__item[open] .sec-8-home-12__bar--v {
  opacity: 0;
  transform: scaleY(0);
}

.sec-8-home-12__answer {
  padding: 0 24px 22px 28px;
  display: flex;
  flex-direction: column;
  row-gap: 16px;
}
.sec-8-home-12__answer p {
  font-family: var(--at-ff-heading);
  font-weight: 500;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: -0.02em;
  color: var(--at-neutral-500);
}

.sec-8-home-12__answer ul {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.sec-8-home-12__answer li {
  font-family: var(--at-ff-heading);
  font-weight: 600;
  font-size: 14px;
  line-height: 1.3;
  letter-spacing: -0.01em;
  color: var(--at-neutral-800);
  background-color: var(--at-neutral-50);
  border: 1px solid var(--at-neutral-100);
  border-radius: 999px;
  padding: 10px 14px;
}

.sec-8-home-12__divider {
  display: block;
  width: 100%;
  height: 1px;
  background-color: var(--at-neutral-100);
  margin-top: -2px;
}

/* ── Responsive ─────────────────────────────────── */
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .sec-8-home-12 {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .sec-8-home-12 {
    padding-top: 90px;
    padding-bottom: 90px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .sec-8-home-12 {
    padding-top: 80px;
    padding-bottom: 80px;
  }
  .sec-8-home-12__header {
    margin-bottom: 48px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sec-8-home-12 {
    padding-top: 64px;
    padding-bottom: 64px;
  }
  .sec-8-home-12__header {
    margin-bottom: 40px;
  }
  .sec-8-home-12__summary {
    padding: 20px 22px 20px 24px;
  }
  .sec-8-home-12__answer {
    padding: 0 22px 20px 24px;
  }
  .sec-8-home-12__question {
    font-size: 16px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .sec-8-home-12 {
    padding-top: 56px;
    padding-bottom: 56px;
  }
  .sec-8-home-12__header {
    margin-bottom: 32px;
    row-gap: 12px;
  }
  .sec-8-home-12__list {
    row-gap: 10px;
  }
  .sec-8-home-12__summary {
    padding: 18px 20px 18px 22px;
    -moz-column-gap: 12px;
         column-gap: 12px;
  }
  .sec-8-home-12__answer {
    padding: 0 20px 20px 22px;
    row-gap: 14px;
  }
  .sec-8-home-12__answer p {
    font-size: 15px;
  }
  .sec-8-home-12__answer ul {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .sec-8-home-12__answer li {
    font-size: 13.5px;
    padding: 9px 12px;
  }
  .sec-8-home-12__question {
    font-size: 15px;
    line-height: 1.35;
  }
  .sec-8-home-12__toggle {
    width: 28px;
    height: 28px;
  }
  .sec-8-home-12__bar--h {
    width: 12px;
  }
  .sec-8-home-12__bar--v {
    height: 12px;
  }
}
@media (max-width: 574.98px) {
  .sec-8-home-12 {
    padding-top: 48px;
    padding-bottom: 48px;
  }
  .sec-8-home-12__header {
    margin-bottom: 28px;
  }
  .sec-8-home-12__list {
    row-gap: 8px;
  }
  .sec-8-home-12__item {
    border-radius: 14px;
  }
  .sec-8-home-12__summary {
    padding: 16px 18px 16px 20px;
    -moz-column-gap: 12px;
         column-gap: 12px;
  }
  .sec-8-home-12__answer {
    padding: 0 18px 18px 20px;
    row-gap: 12px;
  }
  .sec-8-home-12__answer p {
    font-size: 14.5px;
  }
  .sec-8-home-12__answer ul {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .sec-8-home-12__answer li {
    font-size: 13.5px;
    padding: 9px 12px;
  }
  .sec-8-home-12__question {
    font-size: 14.5px;
    line-height: 1.4;
  }
  .sec-8-home-12__toggle {
    width: 26px;
    height: 26px;
  }
  .sec-8-home-12__bar--h {
    width: 11px;
  }
  .sec-8-home-12__bar--v {
    height: 11px;
  }
}
/* Home 13 / Section 1 — Hero (GymGrid® Architecture) */

/* ── Top row ─────────────────────────────────── */

/* ── Hero card ───────────────────────────────── */

/* ── Main slider ─────────────────────────────── */

/* ── Vertical nav buttons ────────────────────── */

/* ── Thumbs slider ───────────────────────────── */

/* ── Responsive ──────────────────────────────── */
/* Cascading mobile pivot: stack top row + wrap brand from tablet down */
/* Home 13 / Section 2 — About Us */

/* ── Top row ─────────────────────────────────── */

/* ── Left column ─────────────────────────────── */

/* ── Right column ────────────────────────────── */

/* ── Stats row ───────────────────────────────── */

/* ── Responsive ──────────────────────────────── */
/* Cascading mobile pivot: stack top grid for tablet & phone */
/* Cascading mobile pivot: single-column media grid for phone */
/* Home 13 / Section 3 — Selected Projects */

/* ── Header ──────────────────────────────────── */

/* ── Project list ────────────────────────────── */

/* ── Card meta (left) ────────────────────────── */

/* ── Card media (middle) ─────────────────────── */

/* ── Card info (right) ───────────────────────── */

/* ── Responsive ──────────────────────────────── */
/* Cascading mobile pivot: stack header for tablet & phone */
/* Cascading mobile pivot: single-column card layout for phone */
/* Home 13 / Section 4 — Build with us CTA */

/* ── Top meta bar ────────────────────────────── */

/* ── Heading ─────────────────────────────────── */

/* ── Bottom row ──────────────────────────────── */

/* ── Responsive ──────────────────────────────── */
/* Cascading mobile pivot: stack bottom row + left-align contact for tablet & phone */
/* Phone: hide center coord bar; loosen card */
/* Home 13 / Section 5 — Our Expertise */

/* ── Header ──────────────────────────────────── */

/* ── List ────────────────────────────────────── */

/* ── Card ────────────────────────────────────── */

/* ── Responsive ──────────────────────────────── */
/* Cascading mobile pivot: stack header + card-head for tablet & phone */
/* Cascading mobile pivot: single-column card layout for phone */
/* Home 13 / Section 6 — Our Process Timeline */

/* ── Header ──────────────────────────────────── */

/* ── Timeline ────────────────────────────────── */

/* Active phase state */

@keyframes sec-6-home-13-ripple {
  0% {
    opacity: 0.55;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(4);
  }
}
/* ── Responsive ──────────────────────────────── */
/* Cascading mobile pivot: single-column header for tablet & phone */
/* Cascading mobile pivot: single-column timeline for phone */
/* Home 13 / Section 7 — Testimonial */

/* ── Media ───────────────────────────────────── */

/* ── Content ─────────────────────────────────── */

/* ── Head ────────────────────────────────────── */

/* ── Quote ───────────────────────────────────── */

/* ── CTA ─────────────────────────────────────── */

/* ── Responsive ──────────────────────────────── */
/* Stack inner as flex column on tablet & phone */
/* Home 13 / Section 8 — The GymGrid Distinction */

/* ── Top wrapper ─────────────────────────────── */

/* ── Body ────────────────────────────────────── */

/* ── Left ────────────────────────────────────── */

/* ── List ────────────────────────────────────── */

/* Active / hover state */

/* ── Responsive ──────────────────────────────── */
/* Stack body as flex column on tablet & phone */
/* Cascading mobile pivot: stack top wrapper for tablet & phone */
/* Cascading mobile pivot: shrink row grid for small phones */
/* ===========================================================
   Section 1 — Home 14 (Photography Hero)
   =========================================================== */

/* ===========================================================
   Section 2 — Home 14 (The Studio)
   =========================================================== */

/* ===========================================================
   Section 3 — Home 14 (Selected Series)
   =========================================================== */

/* ===========================================================
   Section 4 — Home 14 (Gallery / Archive)
   =========================================================== */

/* ===========================================================
   Section 5 — Home 14 (Services list)

   Note: this section uses an inverted (dark) palette in light mode.
   In dark mode it inherits inverse colors via the --at-neutral-*
   token swap, becoming light-on-dark.
   =========================================================== */

/* ===========================================================
   Section 6 — Home 14 (Our Process)
   =========================================================== */

/* ===========================================================
   Section 7 — Home 14 (Client Stories / Testimonial)
   =========================================================== */

/* ===========================================================
   Section 8 — Home 14 (Recognition Index: Press + Awards)
   =========================================================== */
@keyframes sec8home14TickerScroll {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(-50%, 0, 0);
  }
}

/* ===========================================================
   Section 9 — Home 14 (From the Feed)
   =========================================================== */

/* ===========================================================
   Section 1 — Home 15 (Agency Hero)
   =========================================================== */
@keyframes secOneHome15ScrollLine {
  0%, 100% {
    transform: scaleY(0.4);
    transform-origin: top;
    opacity: 0.4;
  }
  50% {
    transform: scaleY(1);
    transform-origin: top;
    opacity: 0.9;
  }
}

/* ===========================================================
   Section 2 — Home 15 (About Us)
   =========================================================== */

@keyframes sec-2-home-15-pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(74, 222, 128, 0.7);
  }
  70% {
    box-shadow: 0 0 0 12px rgba(74, 222, 128, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(74, 222, 128, 0);
  }
}
/* ===========================================================
   Section 3 — Home 15 (Brand strip with auto-marquee)
   =========================================================== */

/* ===========================================================
   Section 4 — Home 15 (Selected work)
   =========================================================== */

/* ===========================================================
   Section 5 — Home 15 (From idea to final project)
   =========================================================== */

/*----------------------------------------*/
/*  sec-6-home-15 (Home 15 — Meet our team + throwable logos)
/*----------------------------------------*/

/*----------------------------------------*/
/*  sec-7-home-15 (Home 15 — What we do)
/*----------------------------------------*/

/*----------------------------------------*/
/*  sec-8-home-15 (Home 15 — Testimonials)
/*----------------------------------------*/

/* ===========================================================
   Section 9 — Home 15 (Inside / Article & blogs)
   =========================================================== */

/* Slideshow — 6 layout variants in one partial.
   Wrapper: .slideshow
     - default (no modifier)        → Horizontal Cinema
     - .is-split                    → Editorial Split + Orbital
     - .is-stack                    → Typographic Stack + bottom progress bar
     - .is-curtain                  → Diagonal Curtain Reveal
     - .is-zstack                   → 3D Z-Stack Reveal
     - .is-vista                    → Slideshow-faithful vertical scroll + central minimap
   All rules scoped under the wrapper to avoid global pollution.
*/

/* Portfolio - Horizontal Scroll Gallery
   ---------------------------------------------------------------
   Two scoped wrappers:
     .hsg-intro  - normal-flow lead-in section above the gallery
     .hsg-stage  - the pinned section driven by GSAP ScrollTrigger
                   (see assets/js/horizontal-scroll-gallery.js)

   Everything is namespaced under .hsg- to avoid clashing with the
   other slideshow variants in _slideshow.scss.
*/
/* =====================================================================
   INTRO - lead-in section before the pin
   ===================================================================== */

@keyframes hsgHintPulse {
  0%, 100% {
    opacity: 0.35;
    transform: translateX(0);
  }
  50% {
    opacity: 1;
    transform: translateX(8px);
  }
}
/* =====================================================================
   STAGE - the pinned horizontal scroll section
   ===================================================================== */

/*----------------------------------------*/
/*  Portfolio Details 3 — Editorial Split
/*----------------------------------------*/
/* JS injects `.anim-zoomin-wrap` around every `.anim-zoomin` <img>.
   Our image hosts position the <img> as absolute fill inside an
   aspect-ratio box — make the injected wrap fill the same box. */

/* ---------- shared plus glyph ---------- */

/* ===========================================
   SEC 1 — Hero split
   =========================================== */

/* ===========================================
   SEC 2 — 3-col Intro
   =========================================== */

/* ===========================================
   SEC 3 — Bento Gallery
   =========================================== */

/* ===========================================
   SEC 4 — Process timeline (dark)
   =========================================== */

/* ===========================================
   SEC 5 — Quote overlay
   =========================================== */

/* ===========================================
   SEC 6 — Solution + Outcome (2-col w/ divider)
   =========================================== */

/* ===========================================
   SEC 7 — Big image strip
   =========================================== */

/* ===========================================
   SEC 8 — Related projects (2 large cards)
   =========================================== */

/*----------------------------------------*/
/*  Portfolio Details 4 — Sticky Sidebar + Chapters
/*  Brand accent: var(--at-theme-primary) (#FF5701)
/*----------------------------------------*/
/* JS injects `.anim-zoomin-wrap` around every `.anim-zoomin` <img>.
   Image hosts use absolute-fill img inside aspect-ratio box. */

/* =========================================================
   SEC 1 — Compact title block
   ========================================================= */

/* =========================================================
   SEC 2 — Sticky sidebar + chapters
   ========================================================= */

/* =========================================================
   SEC 3 — Pull-quote callout (centered)
   ========================================================= */

/* =========================================================
   SEC 4 — Visual showcase 3 rows
   ========================================================= */

/* =========================================================
   SEC 5 — Next project banner
   ========================================================= */

/*----------------------------------------*/
/*  Portfolio Details 5 — Swiper Fade + Cinematic
/*  Brand accent: var(--at-theme-primary) (#FF5701)
/*----------------------------------------*/
/* JS injects `.anim-zoomin-wrap` around every `.anim-zoomin` <img>.
   Image hosts use absolute-fill img inside aspect-ratio box. */

/* =========================================================
   SEC 1 — Swiper fade hero (full-bleed)
   ========================================================= */

/* =========================================================
   SEC 2 — Project brief strip
   ========================================================= */

/* =========================================================
   SEC 3 — Services + Stats (2-col)
   ========================================================= */

/* =========================================================
   SEC 4 — Image grid asymmetric (magazine)
   ========================================================= */

/* =========================================================
   SEC 5 — Vertical timeline alternating L/R
   ========================================================= */

/* =========================================================
   SEC 6 — Awards & Recognition (dark)
   ========================================================= */

/* =========================================================
   SEC 7 — Next project side-by-side (light)
   ========================================================= */

/*----------------------------------------*/
/*  Portfolio Details 6 — Editorial + Marquee + Accordion
/*  Brand accent: var(--at-theme-primary)
/*----------------------------------------*/
/* JS injects `.anim-zoomin-wrap` — fit aspect-ratio hosts */

/* =========================================================
   SEC 1 — Hero + marquee strip
   ========================================================= */

@keyframes pd6-marquee {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-33.3333%);
  }
}
/* =========================================================
   SEC 2 — Magazine 2-col + drop cap
   ========================================================= */

/* =========================================================
   SEC 3 — Horizontal scroll Swiper gallery
   ========================================================= */

/* =========================================================
   SEC 4 — Stats grid (4 inline with dot dividers)
   ========================================================= */

/* =========================================================
   SEC 5 — Quote + portrait side-by-side
   ========================================================= */

/* =========================================================
   SEC 6 — Accordion FAQ "Project details"
   ========================================================= */

/* =========================================================
   SEC 7 — Next project compact dark card
   ========================================================= */

/*----------------------------------------*/
/*  2.3 Back to top
/*----------------------------------------*/
.back-to-top-wrapper {
  position: fixed;
  right: 50px;
  bottom: 0;
  height: 44px;
  width: 44px;
  cursor: pointer;
  display: block;
  border-radius: 50%;
  z-index: 99;
  opacity: 0;
  visibility: hidden;
}
@media (max-width: 574.98px) {
  .back-to-top-wrapper {
    right: 20px;
    bottom: 20px;
  }
}
.back-to-top-wrapper.back-to-top-btn-show {
  visibility: visible;
  opacity: 1;
  bottom: 50px;
}

.back-to-top-btn {
  display: inline-block;
  width: 44px;
  height: 44px;
  line-height: 44px;
  text-align: center;
  background: var(--at-common-white);
  box-shadow: 0px 8px 16px rgba(3, 4, 28, 0.3);
  color: var(--at-common-black);
  border-radius: 50%;
  transition: all 0.3s ease-out;
}
.back-to-top-btn svg {
  transform: translateY(-2px);
}
.back-to-top-btn:hover {
  transform: translateY(-4px);
}

/*----------------------------------------*/
/*  2.5 Buttons
/*----------------------------------------*/
.at-btn {
  gap: 8px;
  line-height: 1;
  font-weight: 600;
  font-size: 16px;
  letter-spacing: -0.05em;
  padding: 17px 25px;
  text-transform: capitalize;
  color: #FEFEFE;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: #1D1D1D;
  border-radius: 50px;
}
.at-btn:hover {
  color: #FEFEFE;
}
.at-btn:hover span span.text-1 {
  transform: translateY(-150%);
}
.at-btn:hover span span.text-2 {
  top: 50%;
  transform: translateY(-50%);
}
.at-btn:hover i svg:first-child {
  transform: translate(16px, -16px);
}
.at-btn:hover i svg:last-child {
  opacity: 1;
  visibility: visible;
  transform: translate(13px, -13px);
}
.at-btn:hover i.icon-arrow-right svg:first-child {
  transform: translate(16px, 0);
}
.at-btn:hover i.icon-arrow-right svg:last-child {
  transform: translate(16px, 0);
}
.at-btn span {
  position: relative;
  z-index: 1;
  overflow: hidden;
  display: inline-block;
}
.at-btn span span.text-1 {
  position: relative;
  display: block;
  transition: 0.3s;
}
.at-btn span span.text-2 {
  position: absolute;
  top: 100%;
  display: block;
  transition: 0.3s;
}
.at-btn i {
  position: relative;
  overflow: hidden;
  width: 16px;
  height: 16px;
  display: inline-flex;
  margin-left: 4px;
}
.at-btn i svg {
  transform: translateY(-2px);
  position: absolute;
  bottom: -1px;
  left: 1px;
  transition: all 0.2s ease-out;
}
.at-btn i svg:last-child {
  left: -12px;
  bottom: -12px;
  transform: translate(0, 0);
  opacity: 0;
}
.at-btn i.icon-arrow-right svg:last-child {
  left: -16px;
  bottom: 0;
}
.at-btn.btn-sm {
  padding: 10px 20px;
}
.at-btn.filter-btn {
  border-radius: 100px;
  border: 1px solid var(--at-neutral-100, #DFDFDF);
  background: var(--at-neutral-0, #FEFEFE);
  color: var(--at-neutral-900);
  white-space: nowrap;
}
.at-btn.active {
  background: var(--at-neutral-900);
  border-color: var(--at-neutral-900);
  color: var(--at-neutral-0);
}
.at-btn.at-btn-disabled,
.at-btn[aria-disabled=true] {
  background: #F3F3F3;
  border: 1px solid #D6D6D6;
  color: #8A8A8A;
  cursor: not-allowed;
  pointer-events: none;
  box-shadow: none;
}
.at-btn.at-btn-disabled i svg,
.at-btn[aria-disabled=true] i svg {
  opacity: 0.55;
}
.at-btn.at-btn-disabled:hover span span.text-1,
.at-btn.at-btn-disabled:hover span span.text-2,
.at-btn[aria-disabled=true]:hover span span.text-1,
.at-btn[aria-disabled=true]:hover span span.text-2 {
  transform: none;
  top: auto;
}
.at-btn.at-btn-disabled:hover i svg:first-child,
.at-btn.at-btn-disabled:hover i svg:last-child,
.at-btn[aria-disabled=true]:hover i svg:first-child,
.at-btn[aria-disabled=true]:hover i svg:last-child {
  transform: translateY(-2px);
  visibility: visible;
}
.at-btn-border-white {
  border: 1px solid rgba(255, 255, 255, 0.3);
  background: rgba(255, 255, 255, 0.25);
}
.blog-category-rail {
  display: flex;
  gap: 8px;
  flex-wrap: nowrap;
  overflow-x: auto;
  align-items: flex-start;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.blog-category-rail::-webkit-scrollbar {
  display: none;
}
.blog-category-rail .at-btn {
  flex: 0 0 auto;
}
@media (min-width: 768px) {
  .blog-category-rail {
    flex-wrap: wrap;
    overflow-x: visible;
  }
}
@media (min-width: 1400px) {
  .blog-category-rail {
    flex-direction: column;
    flex-wrap: nowrap;
    overflow-x: visible;
  }
}

/*----------------------------------------*/
/*  2.1 Animations
/*----------------------------------------*/
@keyframes rotate-infinite {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes rotate-infinite-2 {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(-360deg);
  }
}

@keyframes animate-pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.2), 0 0 0 0 rgba(255, 255, 255, 0.2);
  }
  40% {
    box-shadow: 0 0 0 50px rgba(255, 109, 74, 0), 0 0 0 0 rgba(255, 255, 255, 0.2);
  }
  80% {
    box-shadow: 0 0 0 50px rgba(255, 109, 74, 0), 0 0 0 30px rgba(255, 109, 74, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(255, 109, 74, 0), 0 0 0 30px rgba(255, 109, 74, 0);
  }
}
@keyframes arrowLineRotation {
  to {
    transform: rotate(180deg);
  }
}
@keyframes arrowLineRotationRev {
  to {
    transform: rotate(-180deg);
  }
}

/*----------------------------------------*/
/*  2.10 Preloader
/*----------------------------------------*/

@keyframes preloader {
  0% {
    transform: scale(0, 0);
    opacity: 0.5;
  }
  100% {
    transform: scale(1, 1);
    opacity: 0;
  }
}
/*--- end of preloader ---*/
/*----------------------------------------*/
/*  2.11 search style
/*----------------------------------------*/
.at-search-form-toggle {
  position: fixed;
  top: 115px;
  left: 50%;
  max-width: 1136px;
  width: 100%;
  padding: 50px 60px 60px;
  border-radius: 16px;
}
@media (max-width: 574.98px) {
  .at-search-form-toggle {
    padding: 15px;
  }
}
.at-search-form-toggle {
  background-color: rgba(var(--at-neutral-50-rgb), 0.9);
  backdrop-filter: blur(20px);
  opacity: 0;
  transform: translate(-50%, calc(-100% - 80px));
  transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
  transition-delay: 0s, 0s, 0s;
  transition-delay: 0.5s;
  z-index: 9999;
  pointer-events: none;
  visibility: hidden;
}
.at-search-form-toggle.active {
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
  transform: translate(-50%, 0);
  transition-delay: 0s;
}
.at-search-form-toggle.active .at-search-form-input {
  transform: translate(0, 0) !important;
  opacity: 1;
  transition-delay: 0.5s;
}
.at-search-form-btn {
  position: absolute;
  top: 50%;
  right: 12px;
  transform: translateY(-50%);
  font-size: 16px;
  border-radius: 8px;
}
.at-search-form-input {
  position: relative;
  transform: translateY(-40px);
  transition: all 0.3s ease-in-out !important;
  transition-delay: 0.5s;
  padding: 12px 15px 12px 32px;
  border-radius: 8px;
  opacity: 0;
  border: 1px solid var(--at-neutral-100);
  background: var(--at-neutral-0);
  overflow: hidden;
}
.at-search-form-input input {
  width: 100%;
  height: 100%;
  border: 0;
  outline: 0;
  font-size: 24px;
  font-weight: 400;
  color: var(--at-common-black);
  display: inline-flex;
  justify-content: space-between;
  align-items: center;
  gap: 636px;
  background: var(--at-neutral-0);
  transition-delay: 0.5s;
  transition: all 0.3s ease-in-out !important;
}
.at-search-form-input input::-moz-placeholder {
  /* Firefox 19+ */
  font-size: 24px;
  color: var(--at-neutral-500);
}
.at-search-form-input input::placeholder {
  /* MODERN BROWSER */
  font-size: 24px;
  color: var(--at-neutral-500);
}
.at-search-form-input input:focus {
  border-color: transparent;
}
.at-search-form-input input:focus ~ .at-search-focus-border {
  width: 100%;
  left: 0;
  right: auto;
  transition: all 2s;
}
.at-search-form-input .at-search-focus-border {
  position: absolute;
  bottom: 0;
  left: auto;
  right: 0;
  width: 0;
  height: 1px;
  background-color: var(--at-common-black);
  transition: all 0.5s;
}
.at-search-close {
  color: var(--at-common-black);
  font-size: 40px;
  transition: all 0.3s ease;
}
.at-search-close:hover {
  color: var(--at-neutral-500);
  transform: rotate(180deg);
}
.at-search-body-overlay {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(24, 24, 24, 0.5);
  z-index: 99;
  cursor: zoom-out;
  pointer-events: none;
  transform: translateY(calc(-100% - 80px));
  transition: all 0.5s ease-in-out 0s;
  transition-delay: 0.3s;
}
.at-search-body-overlay.active {
  pointer-events: auto;
  transform: translateY(0);
}

.at-categories-title {
  font-size: 16px;
  font-weight: 600;
  color: var(--at-neutral-900);
  margin-bottom: 16px;
  margin-top: 50px;
}
.at-categories-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.at-categories-item {
  display: flex;
  padding: 12px 24px;
  justify-content: center;
  align-items: center;
  gap: 18px;
  border-radius: 100px;
  border: 1px solid var(--at-neutral-100);
  background: var(--at-neutral-0);
  color: var(--at-neutral-900);
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  letter-spacing: -0.8px;
  transition: all 0.3s ease;
}
.at-categories-item:hover {
  background: var(--at-neutral-900);
  color: var(--at-neutral-0);
  border-color: var(--at-neutral-900);
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

/*----------------------------------------*/
/*  2.8 Magic Cursor
/*----------------------------------------*/
body.at-magic-cursor #magic-cursor {
  display: block;
}

#magic-cursor {
  position: absolute;
  display: none;
  width: 10px;
  height: 10px;
  pointer-events: none;
  z-index: 99999;
  opacity: 0;
  top: 0;
  left: 0;
}

/* Disable magic cursor on tablet/mobile (≤991px) and on touch/no-hover devices. */
@media (max-width: 991.98px), (hover: none), (pointer: coarse) {
  body.at-magic-cursor #magic-cursor,
  #magic-cursor,
  #ball {
    display: none !important;
  }
}
#ball {
  position: fixed;
  display: flex;
  align-items: center;
  pointer-events: none;
  border-radius: 50%;
  color: transparent;
  justify-content: center;
  mix-blend-mode: difference;
  background-color: var(--at-common-black);
}

/* Ball view 
============= */

/* Ball drag 
============= */

/* Ball close 
============== */

/*----------------------------------------*/
/*  2.9 Nice Select
/*----------------------------------------*/

[data-bs-theme=dark] {
  --at-common-white: var(--at-common-dark-white);
  --at-common-white-rgb: var(--at-common-dark-white-rgb);
  --at-common-black: var(--at-common-dark-black);
  --at-common-black-rgb: var(--at-common-dark-black-rgb);
  --at-common-bubbles: var(--at-common-dark-bubbles);
  --at-neutral-0: var(--at-neutral-dark-0);
  --at-neutral-0-rgb: var(--at-neutral-dark-0-rgb);
  --at-neutral-50: var(--at-neutral-dark-50);
  --at-neutral-50-rgb: var(--at-neutral-dark-50-rgb);
  --at-neutral-100: var(--at-neutral-dark-100);
  --at-neutral-200: var(--at-neutral-dark-200);
  --at-neutral-300: var(--at-neutral-dark-300);
  --at-neutral-500: var(--at-neutral-dark-500);
  --at-neutral-700: var(--at-neutral-dark-700);
  --at-neutral-800: var(--at-neutral-dark-800);
  --at-neutral-900: var(--at-neutral-dark-900);
  --at-neutral-950: var(--at-neutral-dark-950);
}
[data-bs-theme=dark] .invert-1 {
  filter: invert(0);
}
[data-bs-theme=dark] .at-header-logo img,
[data-bs-theme=dark] .at-offcanvas-logo img {
  filter: invert(1);
}
[data-bs-theme=dark] .invert-0 {
  filter: invert(0) !important;
}
[data-bs-theme=dark] .dark-mode-invert {
  filter: invert(1);
}
[data-bs-theme=dark] .at-main-menu nav ul li.has-dropdown > a::after {
  filter: invert(1);
}
[data-bs-theme=dark] .changeless {
  --at-common-white: #ffffff;
  --at-common-white-rgb: 255, 255, 255;
  --at-common-black: #1e1e1e;
  --at-common-bubbles: #e1eeb7;
  --at-neutral-950: #0f0f0f;
  --at-neutral-900: #1d1d1d;
  --at-neutral-800: #212121;
  --at-neutral-700: #303030;
  --at-neutral-500: #585959;
  --at-neutral-300: #b7b7b7;
  --at-neutral-100: #dfdfdf;
  --at-neutral-50: #f2f2f2;
  --at-neutral-0: #fefefe;
}

.dark-light-mode .toggle {
  display: grid;
  place-items: center;
  cursor: pointer;
  line-height: 1;
}

.dark-light-mode .input {
  display: none;
}

.dark-light-mode label {
  margin-bottom: 0 !important;
}

.dark-light-mode .icon {
  grid-column: 1/1;
  grid-row: 1/1;
  transition: transform 500ms;
  line-height: 0.1;
}

.dark-light-mode .icon--moon {
  transition-delay: 200ms;
}

.dark-light-mode .icon--sun {
  transform: scale(0);
}

.dark-light-mode #switch:checked + .icon--moon {
  transform: rotate(360deg) scale(0);
}

.dark-light-mode #switch:checked ~ .icon--sun {
  transition-delay: 200ms;
  transform: scale(1) rotate(360deg);
}

/* GymGrid brand accent pass */
.gg-accent {
  color: var(--at-theme-primary, #FF5701) !important;
}

.sec-1-home-4__headline .gg-accent,
.footer-12__cta-title .gg-accent {
  text-shadow: 0 10px 34px rgba(255, 87, 1, 0.18);
}


.sec-7-home-12__eyebrow,
.sec-8-home-12__eyebrow,
.at-sec8-area__stat {
  color: var(--at-theme-primary, #FF5701);
}

.at-main-menu nav ul li a:hover {
  color: var(--at-theme-primary, #FF5701);
}

.at-header-area .at-header-right > .at-btn,
.at-service-btn .at-btn,
.sec-1-home-4-wrap .sec-1-home-4__btns .at-btn:first-child {
  color: #fff !important;
  border-color: var(--at-theme-primary, #FF5701) !important;
  background: var(--at-theme-primary, #FF5701) !important;
}

.at-header-area .at-header-right > .at-btn:hover,
.at-service-btn .at-btn:hover,
.sec-1-home-4-wrap .sec-1-home-4__btns .at-btn:first-child:hover {
  color: #fff !important;
  border-color: #d94700 !important;
  background: #d94700 !important;
}

.card-home-12-price__cta,
.card-home-12-price.is-popular .card-home-12-price__cta {
  color: #fff;
  border-color: var(--at-theme-primary, #FF5701);
  background: var(--at-theme-primary, #FF5701);
}

.card-home-12-price__cta:hover,
.card-home-12-price__cta:focus-visible,
.card-home-12-price.is-popular .card-home-12-price__cta:hover,
.card-home-12-price.is-popular .card-home-12-price__cta:focus-visible {
  color: #fff;
  border-color: #171412;
  background: #171412;
}

.sec-5-home-12__note > a {
  background: var(--at-theme-primary, #FF5701);
}

.sec-5-home-12__note > a:hover,
.sec-5-home-12__note > a:focus-visible {
  background: #171412;
}

.sec-8-home-12__item[open] {
  border-color: rgba(255, 87, 1, 0.42);
}

.sec-8-home-12__item[open] .sec-8-home-12__toggle {
  color: #fff;
  background-color: var(--at-theme-primary, #FF5701);
}

.footer-12__cta-submit:hover,
.footer-12__cta-submit:focus-visible {
  background-color: #d94700;
}

.back-to-top-btn {
  color: #fff;
  background: var(--at-theme-primary, #FF5701);
  box-shadow: 0 10px 24px rgba(255, 87, 1, 0.28);
}

.back-to-top-btn:hover {
  color: #fff;
  background: #d94700;
}

/* GymGrid page rhythm */
:root {
  --gg-section-space: 112px;
  --gg-section-header-gap: 64px;
}

html {
  scroll-padding-top: 120px;
}

.responsive-picture {
  display: contents;
}

.sec-1-home-4 {
  background-image: url("../imgs/optimized/banner-960.90beca5738b0.webp");
  background-image: image-set(
    url("../imgs/optimized/banner-960.a93196b5857f.avif") type("image/avif"),
    url("../imgs/optimized/banner-960.90beca5738b0.webp") type("image/webp")
  );
}

@media (min-width: 1200px) {
  .sec-1-home-4,
  .footer-12__cta::before {
    background-image: url("../imgs/optimized/banner-1662.10c9421bd039.webp");
    background-image: image-set(
      url("../imgs/optimized/banner-1662.ded295848d47.avif") type("image/avif"),
      url("../imgs/optimized/banner-1662.10c9421bd039.webp") type("image/webp")
    );
  }
}

button.hamburger-close-btn {
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
}

#problems,
#product,
#go-live,
#transformations,
#pricing,
#faq,
#insights {
  scroll-margin-top: 120px;
}

.gg-section-space,
.sec-6-home-7,
.sec-7-home-7,
.sec-2-home-12,
.sec-7-home-12,
.sec-life-after,
.sec-5-home-12,
.sec-8-home-12,
.home-4-section-8 {
  padding-top: var(--gg-section-space);
  padding-bottom: var(--gg-section-space);
}

.sec-connected {
  padding-bottom: var(--gg-section-space);
}

.sec-connected__shell {
  padding-top: var(--gg-section-space);
  padding-bottom: var(--gg-section-space);
}

.sec-6-home-7__header,
.sec-2-home-12__header,
.sec-connected__header,
.sec-7-home-12__header,
.sec-life-after__header,
.sec-5-home-12__header,
.sec-8-home-12__header {
  margin-bottom: var(--gg-section-header-gap);
}

.at-sec8-area {
  padding-top: clamp(56px, 6vw, 80px);
  padding-bottom: clamp(56px, 6vw, 80px);
}

.at-sec8-area__stat {
  margin: 0 0 8px;
  color: var(--at-theme-primary, #FF5701);
  font-family: var(--at-heading-font);
  font-size: clamp(32px, 4vw, 54px);
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.04em;
}

@media (max-width: 1599.98px) {
  :root {
    --gg-section-space: 96px;
    --gg-section-header-gap: 56px;
  }
}

@media (max-width: 1399.98px) {
  :root {
    --gg-section-space: 88px;
  }
}

@media (max-width: 1199.98px) {
  :root {
    --gg-section-space: 80px;
    --gg-section-header-gap: 48px;
  }
}

@media (max-width: 991.98px) {
  :root {
    --gg-section-space: 64px;
    --gg-section-header-gap: 40px;
  }
}

@media (max-width: 767.98px) {
  :root {
    --gg-section-space: 56px;
    --gg-section-header-gap: 32px;
  }

  html {
    scroll-padding-top: 80px;
  }

  #problems,
  #product,
  #go-live,
  #transformations,
  #pricing,
  #faq,
  #insights {
    scroll-margin-top: 80px;
  }
}

@media (max-width: 574.98px) {
  :root {
    --gg-section-space: 48px;
    --gg-section-header-gap: 28px;
  }
}