/* ============================================================
   CMS INDIA V2 — EDITORIAL CONTROL SYSTEM
   Custom CSS intentionally uses px / % only. No rem, em, vw, vh, clamp.
============================================================ */
:root {
   --ink: #18201d;
   --muted: #66706b;
   --line: #d8ded9;
   --paper: #fff;
   --mint: #eaf8f1;
   --peach: #fff0e8;
   --lemon: #fff8cc;
   --blue: #eaf2ff;
   --lav: #f3efff;
   --rose: #fff0f4;
   --accent: #ff6b3d;
   --green: #1e6a50;
   --plate: #13201b;
   --shadow: 0 20px 60px rgba(24, 32, 29, .08)
}

* {
   box-sizing: border-box
}

html {
   scroll-behavior: smooth
}

body {
   margin: 0;
   color: var(--ink);
   background: #fff;
   font-family: Arial, Helvetica, sans-serif;
   overflow-x: hidden
}

img {
   max-width: 100%;
   display: block
}

a {
   text-decoration: none;
   color: inherit
}

button,
input,
textarea,
select {
   font: inherit
}

::selection {
   background: #ffd8c9;
   color: #18201d
}

.container {
   max-width: 1260px
}

.cms-section {
   padding: 50px 0;
   position: relative
}

.section-head {
   max-width: 860px;
   margin-bottom: 34px
}

.section-head h2,
.faq-monument h2,
.contact-copy h2 {
   font-size: 46px;
   line-height: 1.04;
   letter-spacing: -2px;
   margin: 10px 0 0;
   font-weight: 800
}

.section-head p {
   font-size: 17px;
   line-height: 1.7;
   color: var(--muted);
   margin: 14px 0 0
}

.section-head--split {
   max-width: none;
   display: flex;
   align-items: flex-end;
   justify-content: space-between;
   gap: 40px
}

.section-head--split>div {
   max-width: 780px
}

.section-head--split>p {
   max-width: 300px;
   font-size: 17px;
   font-weight: 700;
   color: var(--green)
}

.section-kicker {
   display: flex;
   align-items: center;
   gap: 10px;
   font-size: 13px;
   font-weight: 800;
   letter-spacing: 1.6px;
   text-transform: uppercase;
   color: var(--green)
}

.section-kicker span {
   width: 34px;
   height: 22px;
   border: 1px solid #b5c7bd;
   border-radius: 50%;
   display: grid;
   place-items: center;
   font-size: 10px
}

.cms-button {
   height: 52px;
   display: inline-flex;
   align-items: center;
   gap: 12px;
   padding: 0 22px;
   border: 1px solid var(--ink);
   background: var(--ink);
   color: #fff;
   font-size: 14px;
   font-weight: 800;
   border-radius: 0;
   position: relative;
   overflow: hidden;
   transition: transform .25s ease, box-shadow .25s ease
}

.cms-button:before {
   content: "";
   position: absolute;
   inset: 0;
   background: var(--accent);
   transform: translateY(102%);
   transition: transform .35s cubic-bezier(.2, .8, .2, 1)
}

.cms-button>* {
   position: relative
}

.cms-button:hover {
   color: #fff;
   box-shadow: 8px 8px 0 #ffd9cc
}

.cms-button:hover:before {
   transform: translateY(0)
}

.pointer-halo {
   position: fixed;
   width: 28px;
   height: 28px;
   border: 1px solid rgba(30, 106, 80, .28);
   border-radius: 50%;
   pointer-events: none;
   z-index: 9999;
   transform: translate(-50%, -50%);
   transition: width .2s ease, height .2s ease, opacity .2s ease;
   opacity: 0
}

.pointer-halo.is-on {
   opacity: 1
}

.pointer-halo.is-big {
   width: 54px;
   height: 54px
}

.motion-title,
.motion-item,
.motion-card {
   opacity: 0;
   transform: translateY(34px);
   transition: opacity .75s ease, transform .75s cubic-bezier(.2, .8, .2, 1)
}

.motion-title.is-in,
.motion-item.is-in,
.motion-card.is-in {
   opacity: 1;
   transform: translateY(0)
}

.motion-card {
   transition-delay: var(--chain-delay, 0ms)
}

@media(max-width:767px) {
   .cms-section {
      padding: 20px 0
   }

   .section-head {
      margin-bottom: 22px
   }

   .section-head h2,
   .faq-monument h2,
   .contact-copy h2 {
      font-size: 32px;
      letter-spacing: -1px
   }

   .section-head--split {
      display: block
   }

   .section-head--split>p {
      margin-top: 12px
   }

   .pointer-halo {
      display: none
   }
}

/* HEADER */
.headerTop {
   position: sticky;
   top: 0;
   z-index: 1000;
   background: #fff;
   border-bottom: 1px solid #e8ece9
}

.headerTop .navbar {
   min-height: 76px;
   padding: 8px 18px
}

.headerTop .navbar-brand {
   padding: 0;
   margin-right: 26px
}

.brand-plate,
.footer-logo-plate {
   display: inline-flex;
   align-items: center;
   background: var(--plate);
   padding: 8px 14px;
   border-radius: 5px;
   box-shadow: 5px 5px 0 #d9efe4
}

.headerTop .navbar-brand img {
   width: 210px;
   height: 42px;
   object-fit: contain
}

.headerTop .real-menu {
   margin-left: auto;
   align-items: center;
   gap: 2px
}

.headerTop .nav-link {
   color: #1e2823 !important;
   font-size: 14px;
   font-weight: 700;
   padding: 12px 10px !important;
   position: relative
}

.headerTop .real-menu>.nav-item>.nav-link:after {
   content: "";
   position: absolute;
   left: 10px;
   right: 10px;
   bottom: 6px;
   height: 2px;
   background: var(--accent);
   transform: scaleX(0);
   transform-origin: left;
   transition: transform .25s ease;
   border: 0 !important
}

.headerTop .real-menu>.nav-item>.nav-link:hover:after,
.headerTop .real-menu>.nav-item>.nav-link.active:after {
   transform: scaleX(1)
}

.headerTop .dropdown-toggle::after {
   display: none
}

.mm-caret {
   font-size: 10px;
   margin-left: 3px
}

.headerTop .mega-menu {
   position: fixed !important;
   left: 20px !important;
   right: 20px !important;
   top: 72px !important;
   width: auto !important;
   margin: 0 !important;
   padding: 18px !important;
   border: 1px solid #dde6e0 !important;
   border-radius: 8px;
   background: #fff;
   box-shadow: 0 26px 70px rgba(24, 32, 29, .12)
}

.mega-menu-column {
   height: 100%;
   padding: 15px;
   background: #fbfcfb;
   border: 1px solid #edf0ee
}

.mega-menu-title {
   display: flex;
   align-items: center;
   gap: 8px;
   border-bottom: 1px solid #e3e8e5;
   padding-bottom: 8px;
   margin-bottom: 7px
}

.mega-menu-title>.nav-link {
   font-size: 13px !important;
   padding: 0 !important
}

.mm-icon {
   width: 30px;
   height: 30px;
   display: grid;
   place-items: center;
   background: var(--peach);
   border-radius: 50%;
   color: var(--accent)
}

.mega-menu ul,
.mm-simple {
   list-style: none;
   padding: 0;
   margin: 0
}

.mega-menu li .nav-link,
.mm-simple .nav-link {
   font-size: 12px !important;
   font-weight: 600 !important;
   padding: 5px 4px !important;
   color: #4e5a54 !important
}

.mega-menu li .nav-link:hover,
.mm-simple .nav-link:hover {
   color: var(--green) !important;
   transform: translateX(3px)
}

.mm-list {
   columns: 2
}

.headerTop .mm-simple {
   border: 1px solid #dde6e0;
   padding: 10px;
   min-width: 300px;
   box-shadow: var(--shadow)
}

.headerTop .navbar-toggler {
   border: 0;
   color: var(--ink);
   font-size: 26px;
   box-shadow: none
}

.headerTop .mitem {
   display: none
}

@media(max-width:991px) {
   .headerTop .navbar {
      min-height: 72px;
      padding: 8px 10px
   }

   .headerTop .navbar-brand img {
      width: 168px;
      height: 34px
   }

   .brand-plate {
      padding: 7px 10px
   }

   .headerTop .navbar-collapse {
      position: fixed;
      top: 0;
      left: 10px;
      right: 10px;
      height: 550px;
      overflow-y: auto;
      background: #fff;
      border: 1px solid #dfe7e2;
      box-shadow: 0 20px 70px rgba(24, 32, 29, .16);
      padding: 54px 14px 20px;
      z-index: 1001
   }

   .headerTop .navbar-collapse:not(.show) {
      display: none
   }

   .headerTop .mitem {
      display: block;
      position: absolute;
      right: 10px;
      top: 10px;
      font-size: 22px
   }

   .headerTop .d-flex.w-100 {
      display: block !important
   }

   .headerTop .real-menu {
      display: block;
      margin: 0
   }

   .headerTop .nav-link {
      padding: 10px 8px !important;
      border-bottom: 1px solid #edf1ee
   }

   .headerTop .mega-menu {
      position: static !important;
      left: auto !important;
      right: auto !important;
      top: auto !important;
      padding: 8px !important;
      box-shadow: none !important;
      border: 0 !important;
      background: #fafcfb !important
   }

   .mm-list {
      columns: 1
   }

   .mega-menu-column {
      padding: 10px
   }

   .headerTop .mm-simple {
      position: static !important;
      min-width: 0;
      width: 100%;
      box-shadow: none;
      border: 0
   }

   .headerTop .real-menu>.nav-item>.nav-link:after {
      display: none
   }
}

/* HERO */
.hero-section {
   background: linear-gradient(90deg, #fff 0%, #fff 60%, #f4fbf7 60%, #f4fbf7 100%);
   min-height: 650px;
   display: flex;
   align-items: center;
   overflow: hidden;
   border-bottom: 1px solid #e7ece9
}

.hero-ghost {
   position: absolute;
   right: -28px;
   top: 78px;
   font-size: 270px;
   line-height: .8;
   font-weight: 900;
   letter-spacing: -22px;
   color: rgba(30, 106, 80, .045);
   user-select: none
}

.hero-copy {
   padding-right: 28px
}

.hero-copy h1 {
   font-size: 68px;
   line-height: .94;
   letter-spacing: -4px;
   font-weight: 900;
   margin: 14px 0 24px;
   max-width: 760px
}

.hero-copy p {
   font-size: 16px;
   line-height: 1.75;
   color: #56625c;
   margin: 0 0 12px;
   max-width: 760px
}

.hero-actions {
   display: flex;
   align-items: center;
   gap: 22px;
   margin-top: 28px
}

.hero-phone {
   display: inline-flex;
   align-items: center;
   gap: 9px;
   font-size: 15px;
   font-weight: 800
}

.hero-phone i {
   width: 36px;
   height: 36px;
   display: grid;
   place-items: center;
   border: 1px solid #bfd1c7;
   border-radius: 50%;
   color: var(--green)
}

.hero-composer {
   height: 520px;
   position: relative;
   perspective: 900px
}

.composer-orbit {
   position: absolute;
   border: 1px dashed #bdd3c7;
   border-radius: 50%;
   animation: orbitSpin 18s linear infinite
}

.composer-orbit--1 {
   width: 390px;
   height: 390px;
   right: -35px;
   top: 50px
}

.composer-orbit--2 {
   width: 300px;
   height: 300px;
   right: 8px;
   top: 96px;
   animation-direction: reverse
}

.composer-sheet {
   position: absolute;
   width: 330px;
   border: 1px solid #cddbd4;
   background: #fff;
   box-shadow: 0 26px 60px rgba(24, 32, 29, .11);
   transition: transform .45s cubic-bezier(.2, .8, .2, 1)
}

.composer-sheet--back {
   right: 12px;
   top: 64px;
   height: 370px;
   background: var(--blue);
   transform: rotate(7deg) translate(18px, -8px);
   padding: 25px
}

.composer-sheet--mid {
   right: 48px;
   top: 72px;
   height: 390px;
   background: var(--peach);
   transform: rotate(-6deg) translate(-12px, 6px);
   padding: 25px
}

.composer-sheet--back span,
.composer-sheet--mid span {
   display: block;
   font-size: 11px;
   letter-spacing: 1.5px;
   text-transform: uppercase
}

.composer-sheet--back b,
.composer-sheet--mid b {
   display: block;
   font-size: 30px;
   margin-top: 12px
}

.composer-sheet--back i,
.composer-sheet--mid i {
   position: absolute;
   right: 24px;
   bottom: 24px;
   font-size: 50px;
   color: rgba(24, 32, 29, .16)
}

.composer-sheet--front {
   right: 28px;
   top: 78px;
   height: 405px;
   padding: 18px;
   transform: rotate(1deg)
}

.hero-composer:hover .composer-sheet--back {
   transform: rotate(12deg) translate(42px, -24px)
}

.hero-composer:hover .composer-sheet--mid {
   transform: rotate(-11deg) translate(-38px, 16px)
}

.composer-sheet__top {
   height: 42px;
   display: flex;
   align-items: center;
   justify-content: space-between;
   border-bottom: 1px solid #dbe4df;
   font-size: 11px;
   font-weight: 800;
   letter-spacing: 1.4px
}

.composer-sheet__top i {
   font-size: 20px;
   color: var(--green)
}

.composer-action {
   height: 66px;
   display: grid;
   grid-template-columns: 38px 1fr 28px;
   align-items: center;
   border-bottom: 1px solid #e3e9e6;
   position: relative;
   overflow: hidden
}

.composer-action:before {
   content: "";
   position: absolute;
   left: 0;
   top: 0;
   bottom: 0;
   width: 0;
   background: var(--mint);
   transition: width .35s ease
}

.composer-action:hover:before {
   width: 100%
}

.composer-action>* {
   position: relative
}

.composer-action i {
   width: 30px;
   height: 30px;
   border: 1px solid #c9d8d0;
   border-radius: 50%;
   display: grid;
   place-items: center;
   color: var(--green)
}

.composer-action span {
   font-size: 15px;
   font-weight: 800
}

.composer-action b {
   font-size: 11px;
   color: #8a9690
}

.composer-status {
   margin-top: 22px;
   display: flex;
   align-items: center;
   gap: 9px;
   font-size: 13px;
   font-weight: 800
}

.composer-status span {
   width: 9px;
   height: 9px;
   border-radius: 50%;
   background: #55b98f;
   box-shadow: 0 0 0 5px #e3f6ed
}

@keyframes orbitSpin {
   to {
      transform: rotate(360deg)
   }
}

@media(max-width:991px) {
   .hero-section {
      background: #fff;
      min-height: 0
   }

   .hero-copy {
      padding-right: 0
   }

   .hero-copy h1 {
      font-size: 52px;
      letter-spacing: -3px
   }

   .hero-composer {
      height: 470px;
      max-width: 430px;
      margin: 0 auto
   }

   .hero-ghost {
      font-size: 190px;
      top: 100px
   }

   .composer-sheet {
      width: 300px
   }

   .composer-sheet--front {
      right: 46px
   }

   .composer-sheet--back {
      right: 28px
   }

   .composer-sheet--mid {
      right: 54px
   }
}

@media(max-width:575px) {
   .hero-copy h1 {
      font-size: 40px;
      letter-spacing: -2px
   }

   .hero-copy p {
      font-size: 15px
   }

   .hero-actions {
      align-items: flex-start;
      flex-direction: column;
      gap: 14px
   }

   .hero-composer {
      height: 390px;
      transform: scale(.82);
      transform-origin: top center;
      margin-bottom: -70px
   }

   .hero-ghost {
      display: none
   }
}

/* MARQUEE */
.soft-marquee {
   height: 46px;
   overflow: hidden;
   border-bottom: 1px solid #e5ebe7;
   border-top: 1px solid #e5ebe7;
   background: var(--lemon);
   display: flex;
   align-items: center
}

.soft-marquee>div {
   display: flex;
   align-items: center;
   width: max-content;
   animation: marq 22s linear infinite
}

.soft-marquee span {
   font-size: 11px;
   font-weight: 900;
   letter-spacing: 2px;
   white-space: nowrap;
   margin: 0 24px
}

.soft-marquee i {
   width: 5px;
   height: 5px;
   border-radius: 50%;
   background: var(--accent)
}

@keyframes marq {
   to {
      transform: translateX(-50%)
   }
}

@media(max-width:767px) {
   .soft-marquee {
      height: 40px
   }

   .soft-marquee span {
      margin: 0 16px
   }
}

/* SERVICES — COMMAND ROWS */
.services-section {
   background: #fff
}

.command-list {
   border-top: 1px solid var(--line)
}

.cmd-row {
   position: relative;
   display: grid;
   grid-template-columns: 60px 58px 260px 1fr 38px;
   gap: 18px;
   align-items: start;
   padding: 24px 4px;
   border-bottom: 1px solid var(--line);
   overflow: hidden;
   transition: padding .35s ease, background .35s ease
}

.cmd-row__line {
   position: absolute;
   left: 0;
   top: -1px;
   height: 2px;
   width: 0;
   background: var(--accent);
   transition: width .8s ease .08s
}

.cmd-row.is-in .cmd-row__line {
   width: 100%
}

.cmd-row:hover {
   padding-left: 18px;
   padding-right: 18px;
   background: var(--peach)
}

.cmd-row__index {
   font-size: 12px;
   font-weight: 900;
   color: #8f9b95;
   padding-top: 11px
}

.cmd-row__icon {
   width: 42px;
   height: 42px;
   display: grid;
   place-items: center;
   border: 1px solid #cdd8d2;
   border-radius: 50%;
   font-size: 18px;
   color: var(--green);
   opacity: 0;
   transform: scale(.5) rotate(-18deg);
   transition: opacity .45s ease .2s, transform .45s ease .2s, background .25s ease
}

.cmd-row.is-in .cmd-row__icon {
   opacity: 1;
   transform: scale(1) rotate(0)
}

.cmd-row:hover .cmd-row__icon {
   background: #fff
}

.cmd-row__title h3 {
   font-size: 21px;
   line-height: 1.2;
   margin: 8px 0 0;
   font-weight: 850;
   opacity: 0;
   transform: translateY(18px);
   transition: opacity .5s ease .34s, transform .5s ease .34s
}

.cmd-row.is-in .cmd-row__title h3 {
   opacity: 1;
   transform: none
}

.cmd-row__copy p {
   font-size: 14px;
   line-height: 1.7;
   color: var(--muted);
   margin: 3px 0 0;
   opacity: 0;
   transform: translateY(18px);
   transition: opacity .55s ease .48s, transform .55s ease .48s
}

.cmd-row.is-in .cmd-row__copy p {
   opacity: 1;
   transform: none
}

.cmd-row__includes {
   font-size: 12px;
   line-height: 1.6;
   margin-top: 9px;
   color: var(--green);
   font-weight: 700;
   opacity: 0;
   transition: opacity .55s ease .62s
}

.cmd-row.is-in .cmd-row__includes {
   opacity: 1
}

.cmd-row__arrow {
   padding-top: 10px;
   font-size: 18px;
   transition: transform .3s ease
}

.cmd-row:hover .cmd-row__arrow {
   transform: rotate(-45deg)
}

@media(max-width:991px) {
   .cmd-row {
      grid-template-columns: 42px 46px 1fr
   }

   .cmd-row__title {
      grid-column: 3
   }

   .cmd-row__copy {
      grid-column: 3
   }

   .cmd-row__arrow {
      display: none
   }
}

@media(max-width:575px) {
   .cmd-row {
      grid-template-columns: 34px 42px 1fr;
      gap: 10px;
      padding: 18px 0
   }

   .cmd-row:hover {
      padding-left: 8px;
      padding-right: 8px
   }

   .cmd-row__title h3 {
      font-size: 18px
   }

   .cmd-row__copy p {
      font-size: 13px
   }
}

/* WHY — FOLD NOTES */
.why-section {
   background: var(--mint);
   overflow: hidden
}

.fold-grid {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 1px;
   background: #cfded6;
   border: 1px solid #cfded6
}

.fold-note {
   min-height: 290px;
   padding: 28px;
   background: #fff;
   position: relative;
   overflow: hidden
}

.fold-note:nth-child(2),
.fold-note:nth-child(5) {
   background: var(--lemon)
}

.fold-note:nth-child(3),
.fold-note:nth-child(6) {
   background: var(--peach)
}

.fold-note__edge {
   position: absolute;
   left: 0;
   top: 0;
   width: 0;
   height: 5px;
   background: var(--accent);
   transition: width .65s ease .05s
}

.fold-note.is-in .fold-note__edge {
   width: 100%
}

.fold-note__num {
   position: absolute;
   right: 18px;
   top: 16px;
   font-size: 11px;
   font-weight: 900;
   color: #8d9993
}

.fold-note__icon {
   width: 46px;
   height: 46px;
   border: 1px solid #b9cdc2;
   border-radius: 50%;
   display: grid;
   place-items: center;
   color: var(--green);
   font-size: 18px;
   opacity: 0;
   transform: translateY(16px);
   transition: opacity .4s ease .18s, transform .4s ease .18s
}

.fold-note.is-in .fold-note__icon {
   opacity: 1;
   transform: none
}

.fold-note h3 {
   font-size: 22px;
   line-height: 1.2;
   margin: 38px 0 12px;
   font-weight: 850;
   opacity: 0;
   transform: translateY(18px);
   transition: opacity .45s ease .3s, transform .45s ease .3s
}

.fold-note.is-in h3 {
   opacity: 1;
   transform: none
}

.fold-note p {
   font-size: 14px;
   line-height: 1.75;
   color: #59645e;
   margin: 0;
   opacity: 0;
   transform: translateY(18px);
   transition: opacity .48s ease .42s, transform .48s ease .42s
}

.fold-note.is-in p {
   opacity: 1;
   transform: none
}

.fold-note:after {
   content: "";
   position: absolute;
   right: -46px;
   bottom: -46px;
   width: 92px;
   height: 92px;
   background: #fff;
   border: 1px solid #c7d7cf;
   transform: rotate(45deg);
   transition: transform .4s ease
}

.fold-note:hover:after {
   transform: rotate(45deg) translate(-10px, -10px)
}

@media(max-width:991px) {
   .fold-grid {
      grid-template-columns: repeat(2, 1fr)
   }
}

@media(max-width:575px) {
   .fold-grid {
      grid-template-columns: 1fr
   }

   .fold-note {
      min-height: 0;
      padding: 22px
   }

   .fold-note h3 {
      margin-top: 24px;
      font-size: 20px
   }
}

/* COMPARISON — LENS */
.comparison-section {
   background: #fff
}

.comparison-lens {
   border: 1px solid #d8e0dc;
   background: #fff
}

.lens-tabs {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   border-bottom: 1px solid #d8e0dc
}

.lens-tab {
   height: 58px;
   border: 0;
   border-right: 1px solid #d8e0dc;
   background: #fafcfb;
   font-weight: 850;
   font-size: 14px;
   position: relative
}

.lens-tab:last-child {
   border-right: 0
}

.lens-tab.is-active {
   background: var(--peach)
}

.lens-tab.is-active:after {
   content: "";
   position: absolute;
   left: 20%;
   right: 20%;
   bottom: -1px;
   height: 3px;
   background: var(--accent)
}

.lens-table {
   margin: 0
}

.lens-table th,
.lens-table td {
   padding: 15px 16px;
   border-color: #e8ecea;
   font-size: 13px;
   vertical-align: middle
}

.lens-table thead th {
   font-size: 13px;
   font-weight: 900;
   background: #fff
}

.lens-table tbody th {
   font-weight: 800;
   color: #334039;
   width: 220px
}

.lens-table .is-focus {
   background: #fff7f3;
   box-shadow: inset 1px 0 #ffd6c8, inset -1px 0 #ffd6c8
}

.comparison-note {
   padding: 20px 22px;
   margin: 0;
   border-top: 1px solid #d8e0dc;
   background: var(--blue);
   font-size: 14px;
   line-height: 1.75;
   color: #4e5a54
}

@media(max-width:767px) {
   .lens-tab {
      height: 50px;
      font-size: 12px
   }

   .lens-table th,
   .lens-table td {
      min-width: 150px;
      padding: 12px;
      font-size: 12px
   }

   .lens-table tbody th {
      min-width: 170px
   }

   .comparison-note {
      padding: 16px;
      font-size: 13px
   }
}

/* REMOTE — RELAY */
.remote-section {
   background: var(--blue)
}

.relay-track {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   gap: 22px;
   position: relative;
   padding-top: 42px
}

.relay-track__line {
   position: absolute;
   left: 12%;
   right: 12%;
   top: 62px;
   height: 1px;
   background: #aabfd8
}

.relay-track__line:after {
   content: "";
   position: absolute;
   left: 0;
   top: -2px;
   width: 0;
   height: 5px;
   background: #7ea6d5;
   transition: width 1.1s ease
}

.relay-track.is-in .relay-track__line:after {
   width: 100%
}

.relay-stop {
   position: relative;
   padding: 58px 20px 22px;
   background: #fff;
   border: 1px solid #ccd9e8;
   min-height: 245px
}

.relay-stop__pin {
   position: absolute;
   top: -23px;
   left: 20px;
   width: 46px;
   height: 46px;
   border-radius: 50%;
   background: #fff;
   border: 1px solid #9eb8d6;
   display: grid;
   place-items: center;
   color: #557ea9;
   z-index: 2;
   opacity: 0;
   transform: scale(.4);
   transition: opacity .45s ease .2s, transform .45s ease .2s
}

.relay-stop.is-in .relay-stop__pin {
   opacity: 1;
   transform: scale(1)
}

.relay-stop__number {
   position: absolute;
   right: 15px;
   top: 14px;
   font-size: 11px;
   font-weight: 900;
   color: #8ba0b7
}

.relay-stop h3 {
   font-size: 19px;
   line-height: 1.25;
   margin: 0 0 12px;
   font-weight: 850
}

.relay-stop p {
   font-size: 13px;
   line-height: 1.7;
   color: #5b6770;
   margin: 0
}

.relay-stop:hover {
   transform: translateY(-7px) !important;
   box-shadow: 0 18px 40px rgba(69, 100, 132, .12)
}

@media(max-width:991px) {
   .relay-track {
      grid-template-columns: repeat(2, 1fr);
      gap: 40px 18px
   }

   .relay-track__line {
      display: none
   }
}

@media(max-width:575px) {
   .relay-track {
      grid-template-columns: 1fr;
      gap: 34px
   }

   .relay-stop {
      min-height: 0
   }
}

/* PROJECTS — EDITORIAL REEL */
.projects-section {
   background: #fff;
   overflow: hidden
}

.project-reel__top {
   display: flex;
   justify-content: space-between;
   align-items: flex-end;
   margin-bottom: 24px
}

.project-reel__controls {
   display: flex;
   align-items: center;
   gap: 10px
}

.project-reel__controls button {
   width: 44px;
   height: 44px;
   border: 1px solid #cad7d0;
   background: #fff
}

.project-reel__controls button:hover {
   background: var(--mint)
}

.project-fraction {
   min-width: 70px;
   text-align: center;
   font-size: 12px;
   font-weight: 900
}

.project-reel {
   overflow: visible
}

.project-reel .swiper-slide {
   width: 72%;
   opacity: .32;
   transition: opacity .4s ease, transform .4s ease;
   transform: scale(.94)
}

.project-reel .swiper-slide-active {
   opacity: 1;
   transform: scale(1)
}

.project-reel__slide {
   display: grid;
   grid-template-columns: 68% 32%;
   border: 1px solid #d7dfdb;
   background: #fff;
   min-height: 350px
}

.project-reel__image {
   position: relative;
   overflow: hidden;
   background: var(--mint)
}

.project-reel__image img {
   width: 100%;
   height: 350px;
   object-fit: cover;
   transition: transform .8s cubic-bezier(.2, .8, .2, 1), filter .5s ease
}

.project-reel__scan {
   position: absolute;
   left: 0;
   right: 0;
   top: -30%;
   height: 24%;
   background: linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .55), rgba(255, 255, 255, 0));
   transform: skewY(-8deg);
   transition: top .8s ease
}

.project-reel__slide:hover .project-reel__scan {
   top: 110%
}

.project-reel__slide:hover img {
   transform: scale(1.035);
   filter: saturate(1.08)
}

.project-reel__meta {
   padding: 32px;
   display: flex;
   flex-direction: column;
   justify-content: flex-end;
   background: var(--peach);
   position: relative
}

.project-reel__meta>span {
   position: absolute;
   left: 30px;
   top: 28px;
   font-size: 11px;
   font-weight: 900;
   letter-spacing: 1.2px;
   text-transform: uppercase
}

.project-reel__meta h3 {
   font-size: 30px;
   line-height: 1.05;
   letter-spacing: -1px;
   margin: 0 0 12px;
   font-weight: 900
}

.project-reel__meta p {
   font-size: 14px;
   line-height: 1.7;
   color: #5e6763;
   margin: 0
}

.project-reel__meta>i {
   position: absolute;
   right: 28px;
   top: 26px;
   font-size: 28px;
   color: rgba(24, 32, 29, .25)
}

@media(max-width:991px) {
   .project-reel .swiper-slide {
      width: 88%
   }

   .project-reel__slide {
      grid-template-columns: 1fr
   }

   .project-reel__image img {
      height: 380px
   }

   .project-reel__slide {
      min-height: 0
   }

   .project-reel__meta {
      min-height: 220px
   }
}

@media(max-width:575px) {
   .project-reel__top {
      align-items: flex-start;
      gap: 18px
   }

   .project-reel__controls {
      margin-top: 10px
   }

   .project-reel .swiper-slide {
      width: 92%
   }

   .project-reel__image img {
      height: 260px
   }

   .project-reel__meta {
      padding: 22px;
      min-height: 200px
   }

   .project-reel__meta h3 {
      font-size: 24px
   }

   .project-reel__meta>span {
      left: 22px;
      top: 20px
   }
}

/* INDUSTRIES — ORBIT + READER */
.industries-section {
   background: var(--lemon);
   overflow: hidden
}

.industry-orbit {
   display: grid;
   grid-template-columns: 60% 40%;
   gap: 26px;
   align-items: stretch
}

.industry-orbit__map {
   height: 610px;
   position: relative;
   border: 1px solid #e6db98;
   background: #fffdf0;
   overflow: hidden
}

.industry-orbit__map:before,
.industry-orbit__map:after {
   content: "";
   position: absolute;
   border: 1px dashed #dccf86;
   border-radius: 50%;
   left: 50%;
   top: 50%;
   transform: translate(-50%, -50%)
}

.industry-orbit__map:before {
   width: 460px;
   height: 460px
}

.industry-orbit__map:after {
   width: 320px;
   height: 320px
}

.orbit-core {
   position: absolute;
   left: 50%;
   top: 50%;
   transform: translate(-50%, -50%);
   width: 150px;
   height: 150px;
   border-radius: 50%;
   background: var(--green);
   color: #fff;
   display: grid;
   place-content: center;
   text-align: center;
   z-index: 2;
   box-shadow: 0 0 0 18px rgba(30, 106, 80, .08)
}

.orbit-core span {
   font-size: 36px;
   font-weight: 900;
   letter-spacing: -2px
}

.orbit-core strong {
   font-size: 12px;
   letter-spacing: 1px;
   text-transform: uppercase
}

.orbit-node {
   position: absolute;
   width: 156px;
   min-height: 58px;
   padding: 10px 12px;
   border: 1px solid #d9cf92;
   background: #fff;
   text-align: left;
   z-index: 3;
   display: grid;
   grid-template-columns: 24px 24px 1fr;
   align-items: center;
   gap: 5px;
   transition: transform .25s ease, box-shadow .25s ease, background .25s ease
}

.orbit-node span {
   font-size: 9px;
   font-weight: 900;
   color: #948b56
}

.orbit-node i {
   font-size: 16px;
   color: var(--green)
}

.orbit-node strong {
   font-size: 11px;
   line-height: 1.2
}

.orbit-node:hover,
.orbit-node.is-active {
   background: var(--peach);
   transform: translateY(-4px);
   box-shadow: 7px 7px 0 rgba(255, 107, 61, .12)
}

.orbit-node:nth-of-type(1) {
   left: 22px;
   top: 48px
}

.orbit-node:nth-of-type(2) {
   right: 24px;
   top: 48px
}

.orbit-node:nth-of-type(3) {
   left: 8px;
   top: 180px
}

.orbit-node:nth-of-type(4) {
   right: 8px;
   top: 180px
}

.orbit-node:nth-of-type(5) {
   left: 16px;
   bottom: 165px
}

.orbit-node:nth-of-type(6) {
   right: 16px;
   bottom: 165px
}

.orbit-node:nth-of-type(7) {
   left: 40px;
   bottom: 38px
}

.orbit-node:nth-of-type(8) {
   right: 40px;
   bottom: 38px
}

.orbit-node:nth-of-type(9) {
   left: 50%;
   top: 18px;
   transform: translateX(-50%)
}

.orbit-node:nth-of-type(9):hover,
.orbit-node:nth-of-type(9).is-active {
   transform: translateX(-50%) translateY(-4px)
}

.orbit-node:nth-of-type(10) {
   left: 50%;
   bottom: 18px;
   transform: translateX(-50%)
}

.orbit-node:nth-of-type(10):hover,
.orbit-node:nth-of-type(10).is-active {
   transform: translateX(-50%) translateY(-4px)
}

.industry-reader {
   position: relative;
   border: 1px solid #e6db98;
   background: #fff;
   min-height: 610px
}

.industry-panel {
   position: absolute;
   inset: 0;
   padding: 42px;
   opacity: 0;
   transform: translateY(24px);
   pointer-events: none;
   transition: opacity .4s ease, transform .4s ease
}

.industry-panel.is-active {
   opacity: 1;
   transform: none;
   pointer-events: auto
}

.industry-panel__num {
   display: block;
   font-size: 12px;
   font-weight: 900;
   color: #99906a
}

.industry-panel>i {
   font-size: 56px;
   color: var(--green);
   display: block;
   margin: 76px 0 26px
}

.industry-panel h3 {
   font-size: 34px;
   line-height: 1.05;
   letter-spacing: -1.4px;
   font-weight: 900;
   margin: 0 0 18px
}

.industry-panel p {
   font-size: 15px;
   line-height: 1.8;
   color: #59625e;
   margin: 0
}

.industry-ending {
   margin: 20px 0 0;
   font-size: 14px;
   font-weight: 800
}

@media(max-width:991px) {
   .industry-orbit {
      grid-template-columns: 1fr
   }

   .industry-orbit__map {
      height: auto;
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 10px;
      padding: 12px
   }

   .industry-orbit__map:before,
   .industry-orbit__map:after,
   .orbit-core {
      display: none
   }

   .orbit-node,
   .orbit-node:nth-of-type(n) {
      position: static !important;
      width: 100%;
      min-height: 64px;
      transform: none !important
   }

   .industry-reader {
      min-height: 330px
   }

   .industry-panel {
      padding: 28px
   }

   .industry-panel>i {
      margin: 24px 0 20px
   }

   .industry-panel h3 {
      font-size: 28px
   }
}

@media(max-width:575px) {
   .industry-orbit__map {
      grid-template-columns: 1fr
   }

   .industry-reader {
      min-height: 380px
   }

   .industry-panel {
      padding: 22px
   }

   .industry-panel h3 {
      font-size: 25px
   }
}

/* PROCESS — 30-DAY CALENDAR */
.process-section {
   background: #fff
}

.process-calendar {
   border: 1px solid #d8e0dc;
   background: #fff
}

.process-days {
   display: grid;
   grid-template-columns: repeat(5, 1fr);
   border-bottom: 1px solid #d8e0dc
}

.day-strip {
   min-height: 114px;
   border: 0;
   border-right: 1px solid #d8e0dc;
   background: #f9fbfa;
   text-align: left;
   padding: 18px;
   position: relative;
   transition: background .25s ease, color .25s ease
}

.day-strip:last-child {
   border-right: 0
}

.day-strip__range {
   display: block;
   font-size: 10px;
   letter-spacing: 1px;
   text-transform: uppercase;
   color: #7b8881
}

.day-strip strong {
   display: block;
   font-size: 13px;
   line-height: 1.25;
   margin-top: 15px;
   max-width: 140px
}

.day-strip b {
   position: absolute;
   right: 12px;
   bottom: 7px;
   font-size: 34px;
   color: rgba(24, 32, 29, .09)
}

.day-strip.is-active {
   background: var(--green);
   color: #fff
}

.day-strip.is-active .day-strip__range {
   color: #cfe7db
}

.day-strip.is-active b {
   color: rgba(255, 255, 255, .17)
}

.process-panels {
   position: relative;
   min-height: 300px
}

.process-panel {
   position: absolute;
   inset: 0;
   display: grid;
   grid-template-columns: 120px 1fr;
   gap: 30px;
   padding: 34px;
   opacity: 0;
   transform: translateY(22px);
   pointer-events: none;
   transition: opacity .4s ease, transform .4s ease
}

.process-panel.is-active {
   opacity: 1;
   transform: none;
   pointer-events: auto
}

.process-panel__count {
   font-size: 76px;
   font-weight: 900;
   letter-spacing: -5px;
   color: #dfe8e3;
   line-height: .9
}

.process-panel h3 {
   font-size: 26px;
   line-height: 1.15;
   font-weight: 900;
   margin: 0 0 14px
}

.process-panel p {
   font-size: 14px;
   line-height: 1.75;
   color: #5d6862;
   margin: 0 0 16px
}

.process-panel__note {
   display: flex;
   gap: 9px;
   align-items: flex-start;
   font-size: 13px;
   font-weight: 800;
   margin: 8px 0;
   color: #34433b
}

.process-panel__note i {
   color: var(--green)
}

@media(max-width:767px) {
   .process-days {
      display: flex;
      overflow-x: auto
   }

   .day-strip {
      min-width: 180px
   }

   .process-panels {
      min-height: 460px
   }

   .process-panel {
      grid-template-columns: 1fr;
      padding: 24px;
      gap: 14px
   }

   .process-panel__count {
      font-size: 52px
   }

   .process-panel h3 {
      font-size: 22px
   }
}

/* PRICING — TICKETS */
.pricing-section {
   background: var(--rose)
}

.ticket-row {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 18px
}

.price-ticket {
   position: relative;
   padding: 30px;
   border: 1px solid #dfcbd2;
   background: #fff;
   min-height: 410px;
   overflow: hidden
}

.price-ticket:before {
   content: "";
   position: absolute;
   left: 0;
   top: 0;
   width: 0;
   height: 5px;
   background: var(--accent);
   transition: width .7s ease .06s
}

.price-ticket.is-in:before {
   width: 100%
}

.ticket-cut {
   position: absolute;
   width: 28px;
   height: 28px;
   background: var(--rose);
   border: 1px solid #dfcbd2;
   border-radius: 50%;
   top: 96px;
   z-index: 2
}

.ticket-cut--a {
   left: -15px
}

.ticket-cut--b {
   right: -15px
}

.price-ticket__label {
   font-size: 12px;
   font-weight: 900;
   letter-spacing: 1.3px;
   text-transform: uppercase;
   color: var(--green);
   padding-bottom: 22px;
   border-bottom: 1px dashed #d8c8ce
}

.price-ticket h3 {
   font-size: 34px;
   line-height: 1.05;
   letter-spacing: -1.5px;
   font-weight: 900;
   margin: 28px 0 8px
}

.price-ticket>p {
   font-size: 13px;
   font-weight: 800;
   color: #68716d
}

.price-ticket ul {
   list-style: none;
   padding: 18px 0 0;
   margin: 0
}

.price-ticket li {
   font-size: 13px;
   line-height: 1.5;
   padding: 10px 0;
   border-top: 1px solid #eee5e8
}

.price-ticket:hover {
   transform: translateY(-8px) !important;
   box-shadow: 10px 10px 0 #f4dfe6
}

@media(max-width:991px) {
   .ticket-row {
      grid-template-columns: 1fr
   }

   .price-ticket {
      min-height: 0
   }
}

/* TEAM — EDITORIAL STRIPS */
.team-section {
   background: #fff
}

.team-editorial {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   border-top: 1px solid #dbe2de;
   border-left: 1px solid #dbe2de
}

.team-strip {
   border-right: 1px solid #dbe2de;
   border-bottom: 1px solid #dbe2de;
   background: #fff;
   overflow: hidden
}

.team-strip__image {
   height: 360px;
   overflow: hidden;
   background: var(--mint);
   position: relative
}

.team-strip__image:after {
   content: "";
   position: absolute;
   inset: 0;
   background: linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(234, 248, 241, .45));
   transform: translateY(100%);
   transition: transform .45s ease
}

.team-strip:hover .team-strip__image:after {
   transform: translateY(0)
}

.team-strip__image img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   filter: saturate(.75);
   transition: transform .55s ease, filter .45s ease
}

.team-strip:hover img {
   transform: scale(1.04);
   filter: saturate(1)
}

.team-strip__copy {
   padding: 22px
}

.team-strip__copy span {
   font-size: 10px;
   font-weight: 900;
   color: #8e9a94
}

.team-strip__copy h3 {
   font-size: 20px;
   font-weight: 900;
   margin: 10px 0
}

.team-strip__copy p {
   font-size: 13px;
   line-height: 1.65;
   color: #64706a;
   margin: 0
}

@media(max-width:991px) {
   .team-editorial {
      grid-template-columns: repeat(2, 1fr)
   }
}

@media(max-width:575px) {
   .team-editorial {
      grid-template-columns: 1fr
   }

   .team-strip__image {
      height: 390px
   }
}

/* REVIEWS — RAIL */
.reviews-section {
   background: var(--peach)
}

.review-rail {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   border: 1px solid #e3d5cf;
   background: #fff
}

.review-rail a {
   min-height: 140px;
   padding: 20px;
   border-right: 1px solid #e8ddd8;
   display: grid;
   grid-template-columns: 1fr auto;
   grid-template-rows: 1fr auto;
   gap: 8px;
   transition: background .25s ease
}

.review-rail a:last-child {
   border-right: 0
}

.review-rail img {
   max-height: 42px;
   max-width: 130px;
   object-fit: contain;
   align-self: center
}

.review-rail span {
   font-size: 12px;
   font-weight: 800;
   align-self: end
}

.review-rail i {
   align-self: end
}

.review-rail a:hover {
   background: var(--lemon)
}

@media(max-width:767px) {
   .review-rail {
      grid-template-columns: repeat(2, 1fr)
   }

   .review-rail a {
      border-bottom: 1px solid #e8ddd8;
      min-height: 120px
   }
}

@media(max-width:420px) {
   .review-rail {
      grid-template-columns: 1fr
   }

   .review-rail a {
      border-right: 0
   }
}

/* FAQ — MONUMENT + ACCORDION */
.faq-section {
   background: #fff
}

.faq-layout {
   display: grid;
   grid-template-columns: 34% 66%;
   gap: 38px;
   align-items: start
}

.faq-monument {
   position: sticky;
   top: 100px
}

.faq-monument>div:last-child {
   font-size: 170px;
   font-weight: 900;
   letter-spacing: -12px;
   color: #fff;
   line-height: .8;
   margin-top: 44px
}

.faq-accordion {
   border-top: 1px solid #d9e1dd
}

.faq-accordion .accordion-item {
   border: 0;
   border-bottom: 1px solid #d9e1dd;
   border-radius: 0;
   background: transparent
}

.faq-accordion .accordion-button {
   padding: 20px 4px;
   background: transparent;
   box-shadow: none !important;
   color: var(--ink);
   font-size: 16px;
   font-weight: 850;
   gap: 16px
}

.faq-accordion .accordion-button span {
   font-size: 10px;
   color: #8c9992;
   width: 26px
}

.faq-accordion .accordion-button:not(.collapsed) {
   color: var(--green)
}

.faq-accordion .accordion-body {
   padding: 0 4px 22px 46px;
   font-size: 14px;
   line-height: 1.75;
   color: #59645e
}

.faq-accordion .accordion-button::after {
   background-size: 14px
}

@media(max-width:991px) {
   .faq-layout {
      grid-template-columns: 1fr
   }

   .faq-monument {
      position: static
   }

   .faq-monument>div:last-child {
      display: none
   }
}

@media(max-width:575px) {
   .faq-accordion .accordion-button {
      font-size: 14px;
      align-items: flex-start
   }

   .faq-accordion .accordion-body {
      padding-left: 0
   }
}

/* CONTACT — SHEET */
.contact-section {
   background: var(--mint)
}

.contact-sheet {
   display: grid;
   grid-template-columns: 42% 58%;
   border: 1px solid #cadbd2;
   background: #fff
}

.contact-copy {
   padding: 40px;
   border-right: 1px solid #cadbd2;
   background: linear-gradient(135deg, #fff 0%, #f4fbf7 100%)
}

.contact-copy h2 {
   font-size: 42px;
   margin: 16px 0 18px
}

.contact-copy p {
   font-size: 14px;
   line-height: 1.75;
   color: #5b6760
}

.contact-call {
   display: flex;
   align-items: center;
   gap: 10px;
   margin-top: 14px;
   font-size: 14px;
   font-weight: 800
}

.contact-call i {
   width: 34px;
   height: 34px;
   border: 1px solid #b9cdc2;
   border-radius: 50%;
   display: grid;
   place-items: center;
   color: var(--green)
}

.quote-form {
   padding: 40px
}

.quote-form label {
   display: block;
   font-size: 11px;
   font-weight: 900;
   letter-spacing: .8px;
   text-transform: uppercase;
   margin-bottom: 6px
}

.quote-form .form-control,
.quote-form .form-select {
   border: 0;
   border-bottom: 1px solid #aebdb5;
   border-radius: 0;
   padding: 10px 2px;
   background: transparent;
   box-shadow: none !important;
   font-size: 14px
}

.quote-form .form-control:focus,
.quote-form .form-select:focus {
   border-color: var(--accent)
}

.form-status {
   font-size: 12px;
   font-weight: 700;
   color: var(--green);
   margin-top: 10px
}

@media(max-width:991px) {
   .contact-sheet {
      grid-template-columns: 1fr
   }

   .contact-copy {
      border-right: 0;
      border-bottom: 1px solid #cadbd2
   }

   .contact-copy,
   .quote-form {
      padding: 28px
   }
}

@media(max-width:575px) {

   .contact-copy,
   .quote-form {
      padding: 20px
   }

   .contact-copy h2 {
      font-size: 30px
   }
}

/* FOOTER — LIGHT SYSTEM */
.gix-footer {
   background: #f8faf9;
   color: #27332d;
   border-top: 1px solid #dfe7e2;
   padding: 50px 0 22px
}

.gix-footer__inner {
   max-width: 1320px;
   margin: 0 auto;
   padding: 0 24px
}

.gix-footer__main-grid {
   display: grid;
   grid-template-columns: 1.25fr 1.2fr .8fr .72fr 1fr;
   gap: 28px
}

.gix-footer__brand p,
.gix-footer__office p {
   font-size: 12px;
   line-height: 1.7;
   color: #68736d
}

.gix-footer__brand-mark {
   display: flex;
   gap: 8px;
   flex-wrap: wrap;
   margin-top: 14px
}

.gix-footer__brand-mark span {
   font-size: 10px;
   font-weight: 900;
   padding: 6px 8px;
   border: 1px solid #cfd9d3;
   background: #fff
}

.gix-footer__title {
   font-size: 14px;
   font-weight: 900;
   margin: 4px 0 16px
}

.gix-footer__office {
   margin-bottom: 16px
}

.gix-footer__office h3 {
   font-size: 12px;
   font-weight: 900;
   margin: 0 0 6px
}

.gix-footer__office a,
.gix-footer__links a,
.gix-footer__sector-links a {
   font-size: 12px;
   line-height: 1.55;
   color: #4f5b55
}

.gix-footer__office>a {
   display: block;
   margin-top: 4px
}

.gix-footer__inline-links {
   display: flex;
   gap: 10px
}

.gix-footer__links,
.gix-footer__sector-links {
   list-style: none;
   padding: 0;
   margin: 0
}

.gix-footer__links li,
.gix-footer__sector-links li {
   margin: 0 0 8px
}

.gix-footer__sector-links li {
   display: flex;
   gap: 8px;
   align-items: flex-start
}

.gix-footer__sector-links i {
   color: var(--green)
}

.gix-footer a:hover {
   color: var(--accent)
}

.gix-footer__reviews {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   margin-top: 32px;
   border: 1px solid #dfe7e2;
   background: #fff
}

.gix-footer__review-card {
   min-height: 92px;
   padding: 14px;
   border-right: 1px solid #dfe7e2;
   display: grid;
   grid-template-columns: 1fr auto;
   grid-template-rows: 1fr auto;
   gap: 5px
}

.gix-footer__review-card:last-child {
   border-right: 0
}

.gix-footer__review-card img {
   max-height: 34px;
   max-width: 110px;
   object-fit: contain
}

.gix-footer__review-card span {
   font-size: 10px;
   font-weight: 800
}

.gix-footer__bottom {
   display: grid;
   grid-template-columns: 1fr auto auto;
   gap: 22px;
   align-items: center;
   margin-top: 20px;
   padding-top: 18px;
   border-top: 1px solid #dfe7e2
}

.gix-footer__bottom p,
.gix-footer__legal a {
   font-size: 11px;
   color: #69756f
}

.gix-footer__legal {
   display: flex;
   gap: 14px
}

.gix-footer__social {
   display: flex;
   gap: 7px
}

.gix-footer__social a {
   width: 30px;
   height: 30px;
   display: grid;
   place-items: center;
   border: 1px solid #d1dbd5;
   background: #fff
}

.footer-logo-plate {
   margin-bottom: 12px
}

@media(max-width:1100px) {
   .gix-footer__main-grid {
      grid-template-columns: repeat(3, 1fr)
   }
}

@media(max-width:767px) {
   .gix-footer {
      padding: 30px 0 18px
   }

   .gix-footer__inner {
      padding: 0 16px
   }

   .gix-footer__main-grid {
      grid-template-columns: 1fr
   }

   .gix-footer__reviews {
      grid-template-columns: repeat(2, 1fr)
   }

   .gix-footer__review-card {
      border-bottom: 1px solid #dfe7e2
   }

   .gix-footer__bottom {
      grid-template-columns: 1fr
   }

   .gix-footer__legal {
      flex-wrap: wrap
   }
}

@media(max-width:420px) {
   .gix-footer__reviews {
      grid-template-columns: 1fr
   }

   .gix-footer__review-card {
      border-right: 0
   }
}