/*
Theme Name: AGA Child
Theme URI: https://example.com/
Description: Child Theme for AGA Theme
Author: Your Name
Author URI: https://example.com/
Template: aga
Version: 1.0.0.21
Text Domain: aga-child
*/

:root {
  --bg: #efeae0;
  --bg-2: #e6e0d2;
  --ink: #111;
  --ink-2: #1c1c1c;
  --muted: #6b675e;
  --line: rgba(17, 17, 17, 0.1);
  --accent: #EE1C23;
  --accent-2: #b94e1e;
  --cream: #f5f2ec;
}

/* Reset and general styles */
body {
  background-color: var(--bg);
  color: var(--ink);
  font-family: 'Inter', sans-serif;
  overflow-x: hidden;
  margin: 0;
  padding: 0;
}

/* Typography mappings */
.font-hero {
  font-family: 'Bricolage Grotesque', 'Inter', sans-serif;
  font-variation-settings: "opsz" 96, "wdth" 100;
  letter-spacing: 0.02em;
}

.font-display {
  font-family: 'Bricolage Grotesque', 'Inter', sans-serif;
  font-weight: 700;
  font-optical-sizing: auto;
  font-variation-settings: "opsz" 96, "wdth" 100;
  letter-spacing: 0.00em;
}

.font-mono {
  font-family: 'JetBrains Mono', monospace;
}

.btn {display: inline-flex; align-items: center; padding: 15px 27px; border-radius: 90px; letter-spacing: .22em; text-transform: uppercase; font-size: 12px; gap: .75rem; transition: background .35s ease,color .35s ease,transform .4s cubic-bezier(.2,.7,.2,1);}
.btn svg {display: block; width: 16px; height: 16px; color: var(--cream);}

.btn.btn-primary {background-color: var(--ink); border-color: var(--ink); color: var(--cream);}
.btn.btn-primary:hover, .btn.btn-primary:focus {background-color: var(--accent); border-color: var(--accent); color: var(--cream); box-shadow: none; outline: none;}

/* Custom rounded outline buttons */
.btn-quote {border-color: #fff; transition: all 0.3s ease;}
.btn-quote:hover {background-color: #fff; color: var(--ink);}

/* Custom buttons */
.btn-accent {background-color: var(--accent); color: #fff; text-decoration: none; transition: background-color 0.3s ease, color 0.3s ease; font-size: 12px; letter-spacing: 0.22em; padding: 6px 12px 6px 24px;}
.btn-accent:hover {background-color: #fff; color: var(--ink);}
.btn-accent .icon {background-color: rgba(255, 255, 255, 0.2); width: 40px; height: 40px; border-radius: 50%;}
.btn-accent .icon svg {display: block; width: 16px; height: 16px;}
.btn-accent:hover .icon {background-color: #000;}

.btn-ghost {border: 1px solid var(--ink); color: var(--ink); text-decoration: none; transition: background-color 0.3s ease, color 0.3s ease; font-size: 12px; letter-spacing: 0.22em; padding: 12px 28px;}
.btn-ghost svg {display: block; width: 16px; height: 16px;}
.btn-ghost:hover {background-color: var(--ink); color: var(--cream);}


.animate-bounce {
  animation: bounce 1s infinite;
}

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-10px);
  }
  60% {
    transform: translateY(-5px);
  }
}

.opacity-10 {opacity: 0.1;}
.opacity-15 {opacity: 0.15;}
.opacity-20 {opacity: 0.2;}
.opacity-25 {opacity: 0.25;}
.opacity-30 {opacity: 0.3;}
.opacity-35 {opacity: 0.35;}
.opacity-40 {opacity: 0.4;}
.opacity-45 {opacity: 0.45;}
.opacity-50 {opacity: 0.5;}
.opacity-55 {opacity: 0.55;}
.opacity-60 {opacity: 0.6;}
.opacity-65 {opacity: 0.65;}
.opacity-70 {opacity: 0.7;}
.opacity-75 {opacity: 0.75;}
.opacity-80 {opacity: 0.8;}
.opacity-85 {opacity: 0.85;}
.opacity-90 {opacity: 0.9;}
.opacity-95 {opacity: 0.95;}



/* Link underline effect */
.link-u {
  position: relative;
  text-decoration: none;
  color: inherit;
  display: inline-block;
}
.link-u svg {
  display: block;
  width: 14px;
  height: 14px;
}
.link-u::after {
  content: '';
  position: absolute;
  width: 100%;
  transform: scaleX(0);
  height: 1px;
  bottom: -2px;
  left: 0;
  background-color: currentColor;
  transform-origin: bottom right;
  transition: transform 0.4s cubic-bezier(0.2, 0.7, 0.2, 1);
}
.link-u:hover::after {
  transform: scaleX(1);
  transform-origin: bottom left;
}

/* Custom scroll transitions */
.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 1.2s cubic-bezier(0.2, 0.8, 0.2, 1), transform 1.2s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.reveal.reveal-active {
  opacity: 1;
  transform: translateY(0);
}

.fade-page {padding: 128px 0 0 0;}


/* Header style state transitions */
header.fixed {transition: background-color 0.4s ease, border-color 0.4s ease, padding 0.4s ease, color 0.4s ease; color: #fff; position: fixed; top: 0; left: 0; right: 0; z-index: 99999; padding: 24px 0px;}
header.fixed .header-main {margin: 0 24px; padding: 0 12px;}
header.fixed .header-main .logo {color: #fff;}
header.fixed .header-main .logo .logo-title {letter-spacing: -0.035em; font-weight: 700;}
header.fixed .header-main .logo .logo-title img {width: clamp(120px, 18vw, 220px); height: auto; padding:10px 10px 10px 20px;}
header.fixed .header-main .logo .logo-title img.white-color {display: block;}
header.fixed .header-main .logo .logo-title img.black-color {display: none;}

header.fixed .header-main .logo .logo-subtitle {font-size: 11px; letter-spacing: 0.22em; margin-top: 4px;}

header.fixed nav {gap: 28px;}
header.fixed nav a {font-size: 13px; font-weight: 500; letter-spacing: 0.18em; color: #fff;}
header.fixed .time {gap: 8px; font-size: 11px; letter-spacing: 0.2em; color: #fff;}
header.fixed .time span.dot {display: block; width: 6px; height: 6px; background-color: var(--accent); border-radius: 50%;}

header.fixed .btn-quote {font-size: 12px; font-weight: 500; letter-spacing: 0.2em; color: #fff; border: solid 1px #fff; padding: 8px 16px; margin-right:20px;}
header.fixed .btn-quote svg {display: block; width: 14px; height: 14px;}
header.fixed .btn-quote:hover {background-color: var(--ink); border-color: var(--ink);}

header.fixed.scrolled {padding: 10px 0px;}
header.fixed.scrolled .header-main {background-color: var(--ink); backdrop-filter: blur(12px); border-radius: 50px; padding-top: 5px; padding-bottom: 5px;}
header.fixed.scrolled .btn-quote:hover {background-color: var(--accent); border-color: var(--accent);}

header.fixed.header-black {color: var(--ink);}
header.fixed.header-black .header-main .logo {color: var(--ink);}
header.fixed.header-black nav a {color: var(--ink);}
header.fixed.header-black .time {color: var(--ink);}
header.fixed.header-black .btn-quote {color: var(--ink); border-color: var(--ink);}
header.fixed.header-black .btn-quote:hover {background-color: var(--ink); color: #fff; border-color: var(--ink);}
header.fixed.header-black .header-main .logo .logo-title img.white-color {display: none;}
header.fixed.header-black .header-main .logo .logo-title img.black-color {display: block;}
header.fixed.header-black #mobile-menu-toggle svg {color: var(--ink);}

header.fixed.header-black.scrolled {color: #fff;}
header.fixed.header-black.scrolled .header-main .logo {color: #fff;}
header.fixed.header-black.scrolled nav a {color: #fff;}
header.fixed.header-black.scrolled .time {color: #fff;}
header.fixed.header-black.scrolled .btn-quote {color: #fff; border-color: #fff;}
header.fixed.header-black.scrolled .header-main .logo .logo-title img.white-color {display: block;}
header.fixed.header-black.scrolled .header-main .logo .logo-title img.black-color {display: none;}
header.fixed.header-black.scrolled #mobile-menu-toggle svg {color: #fff;}


/* Pulse animation */
@keyframes pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.4; transform: scale(1.15); }
}
.animate-pulse {
  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

/* Ken burns animation */
@keyframes kenburns {
  0% { transform: scale(1) translate3d(0,0,0); }
  100% { transform: scale(1.08) translate3d(0,0,0); }
}

.ken-burns {
  animation: kenburns 12s ease-out forwards;
}

/* Marquee text animations */
@keyframes marquee {
  0% { transform: translate3d(0, 0, 0); }
  100% { transform: translate3d(-50%, 0, 0); }
}
.marquee-track {
  display: flex;
  animation: marquee 25s linear infinite;
  width: max-content;
}
.marquee-slow {
  display: flex;
  animation: marquee 140s linear infinite;
  width: max-content;
}

.marquee-to-slow {
  display: flex;
  animation: marquee 280s linear infinite;
  width: max-content;
}

.marquee-to-slow-to-slow {
  display: flex;
  animation: marquee 1200s linear infinite;
  width: max-content;
}


/* Vertical text helper */
.annotations-text {left: 1rem; width: 40px; z-index: 10; padding: 7rem 0 14rem 0; position: absolute; top: 0; bottom: 0;}
.vtext {writing-mode: sideways-lr; text-orientation: mixed; font-size: 11px; letter-spacing: 0.35em;}
.ns-text {writing-mode: sideways-lr; text-orientation: mixed; font-size: 11px; letter-spacing: 0.3em;}

.hero-section {position: relative; overflow: hidden; background-color: var(--ink); min-height: 100vh;}
.hero-section .hero-slider {position: absolute; width: 100%; height: 100%; z-index: 0;}

/* Slide transitions for hero */
.hero-slide {position: absolute; inset: 0; opacity: 0; transition: opacity 1.5s ease-in-out; z-index: 0;}
.hero-slide.active {opacity: 1; z-index: 1;}
.hero-slide img {width: 100%; height: 100%; object-fit: cover; transition: all 0.5s;}

.hero-indicators-scroll {right: 1rem; width: 77px; z-index: 10; padding: 7rem 0 14rem; top: 0px; bottom: 0px; position: absolute;}
#hero-indicators button .line {width: 24px; height: 1px; background: #fff; transition: all 0.3s ease; opacity: 0.25;}
#hero-indicators button .text {font-size: 10px; letter-spacing: 0.25em; opacity: 0.25;}
#hero-indicators button.active .line {width: 48px; background-color: var(--accent); opacity: 1;}
#hero-indicators button.active .text {opacity: 1;}


.hero-content {margin-bottom: 2rem; z-index: 10; margin-left: 2rem; margin-right: 2rem; margin-top: 100px;}
.hero-content .hero-tagline {font-size: 12px; letter-spacing: 0.32em;}
.hero-content .hero-tagline .hero-tagline-dot {width: 36px; height: 1px; background-color: var(--accent);}
.hero-content .hero-tagline svg {display: block; width: 14px; height: 14px; color: var(--accent);}
.hero-content h1 {font-size: 9.5vw; line-height: 0.85; letter-spacing: -0.045em; font-weight: 800;}
.hero-content .line-divider {height: 1px; width: 100%; max-width: 55%; transition-delay: 750ms; background-color: #fff; margin: 44px 0px;}
.hero-content .leading-relaxed {font-size: 1.125rem;}
.hero-content .btn-project {font-size: 12px; letter-spacing: 0.22em;}

.scroll-anchor {bottom: 190px; z-index: 10; left: 50%; transform: translateX(-50%);}
.scroll-anchor span {font-size: 10px; letter-spacing: 0.3em;}

.marquee-block {background-color: #0006; border-top: solid 1px #ffffff26; --tw-backdrop-blur: blur(12px); -webkit-backdrop-filter:var(--tw-backdrop-blur); backdrop-filter: var(--tw-backdrop-blur);}
.marquee-block .marquee-anim {gap: 40px;}
.marquee-block .marquee-anim span {gap: 40px; font-size: 11px; letter-spacing: 0.3em;}


/* Navigation Overlay */
.nav-overlay {
  position: fixed;
  inset: 0;
  background-color: var(--ink);
  color: var(--cream);
  z-index: 99999;
  transform: translateY(-100%);
  transition: transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 8rem 2rem 2rem 2rem;
  opacity: 0;
  visibility: hidden;
}
.nav-overlay.open {
  transform: translateY(0);
  opacity: 1;
  visibility: visible;
}



/* Custom dot spacing for stats */
.count-main {
  display: block;
  border-top: solid 1px #ffffff26;
}
.count-main .count-boxs {
  display: block;
  padding: 1.5rem 2rem;
  border-right: solid 1px #ffffff26;
  height: 100%;
}
.count-main .count-boxs .count-title {
  font-size: 2.25rem;
  font-weight: 700;
  line-height: 2.5rem;
}
.count-main .count-boxs .count-text {
  font-size: 11px;
  letter-spacing: 0.22em;
  opacity: 0.65;
}

.divide-white-10 > div {
  border-color: rgba(255,255,255,0.1);
}

/* Custom classes for layout margins/paddings */
.py-28 {
  padding-top: 7rem;
  padding-bottom: 7rem;
}
.py-40 {
  padding-top: 10rem;
  padding-bottom: 10rem;
}
.mb-28 {
  margin-bottom: 7rem;
}

.section-header {margin-bottom: 6rem;}
.section-header.margin-bottom-48 {margin-bottom: 48px;}
.section-header .subtitle {font-size: 11px; letter-spacing: 0.3em;}
.section-header .subtitle span {width: 24px; height: 1px; background-color: var(--ink);}
.section-header .whatwedo-text {font-size: 11px; letter-spacing: 0.3em; opacity: 0.6;}


/* Services Section */
.services-section {display: block; padding: 160px 64px; background-color: var(--bg);}
.services-section h2 {display: block; margin: 0 0 112px; font-size: 9vw; line-height: 0.88;}

/* Sticky image layout for services */
.services-image-container {top: 0px; aspect-ratio: 4/5;}
.services-image-container img {transition: opacity 0.5s ease, transform 0.5s ease; position: absolute; inset: 0;}
.services-image-container .slide-count {bottom: 15px; left: 15px; right: 15px; z-index: 10;}
.services-image-container .slide-count span {font-size: 11px; letter-spacing: 0.25em; text-transform: uppercase;}

.service-main {display: block; border-bottom: solid 1px #e5e7eb;}
.service-main .service-hover-item {display: block; padding: 40px 0; border-top: solid 1px #adb0b5;}
.service-main .service-hover-item .service-count {font-size: 0.75rem; letter-spacing: 0.25em; line-height: 1rem; padding-top: 8px;}
.service-main .service-hover-item h3 {font-size: 3rem; letter-spacing: 0em; line-height: 1; margin: 0 0 1rem; transition: all 0.5s;}
.service-main .service-hover-item p {font-size: 1.125rem; line-height: 1.75rem; max-width: 100%; margin: 0 0 1.25rem;}
.service-main .service-hover-item span {border-color: #adb0b5 !important; font-size: 10px; letter-spacing: 0.2em;}
.service-main .service-hover-item svg {color: var(--accent); transition: all 0.5s;}
.service-main .service-hover-item:hover h3 {transform: translate(0.5rem, 0);}
.service-main .service-hover-item:hover svg {transform: translate(0.25rem, 0);}


/* About Section */
.about-section {display: block; background-color: var(--cream); padding: 160px 64px;}
.about-title-content {margin-bottom: 112px;}
.about-title-content h2 {font-size: 6.5vw; line-height: 0.9; margin: 0px;}
.about-title-content h2 em {font-weight: 200; color: var(--accent);}
.about-title-content p {font-size: 1rem; line-height: 1.5rem;}
.photo-stats-main .photo-img {aspect-ratio: 16/10;}
.photo-stats-main .stats-boxs {padding: 2rem;}
.photo-stats-main .stats-boxs span {font-size: 11px; letter-spacing: 0.25em;}
.photo-stats-main .stats-boxs .stats-count {font-size: 3.75rem; font-weight: 700; line-height: 1; margin: 0 0 .75rem;}
.photo-stats-main .stats-boxs .small {line-height: 1.25rem;}


/* Projects Section */
.projects-section {display: block; padding: 160px 64px; background-color: var(--bg); position: relative;}
.projects-section h2 {display: block; font-size: 8vw; line-height: 0.9; letter-spacing: 0em; margin: 0 0 6rem;}
.projects-section h2 em {font-weight:200;}
.projects-section h2 span.pl {padding-left: 18vw;}

.projects-table-main {display: block; border-top: solid 1px #e5e7eb;}

/* Project Row Hovers */
.proj-row {position: relative; transition: background-color 0.3s ease; border-bottom: 1px solid #e5e7eb; padding: 32px 16px; color: var(--ink);}
.proj-row .proj-count {font-size: .75rem; letter-spacing: 0.2em;}
.proj-row .proj-title {letter-spacing: 0em; font-size: 3rem; font-weight: 700; line-height: 1;}
.proj-row .proj-text {font-size: .75rem; letter-spacing: 0.2em; line-height: 1rem;}
.proj-row .proj-text svg {width: 16px; height: 16px; display: block;}
.proj-row:hover {background-color: var(--ink); color: #fff;}

/* Floating Project Image container */
.proj-img-float {position: fixed; pointer-events: none; width: 24rem; height: 16rem; z-index: 50; overflow: hidden; opacity: 0; transform: scale(0.9); transition: opacity 0.3s ease, transform 0.3s ease; box-shadow: 0 25px 50px -12px rgba(0,0,0,0.5);}
.proj-img-float.visible {opacity: 1; transform: scale(1);}
.proj-img-float img {width: 100%; height: 100%; object-cover: cover; transition: opacity 0.3s ease;}


/* Affiliations Section */
.affiliations-section {display: block; position: relative; background-color: var(--cream);}
.affiliations-marquee {display: block; padding: 24px 0px; border: solid 1px #e5e7eb;}
.affiliations-marquee span {font-size: 3rem; letter-spacing: 0em; margin-right: 40px;}
.affiliations-marquee span span {color: var(--accent); margin: 0 0 0 40px;}

.affiliations-grid {display: block; padding: 128px 64px;}

.accreditation-card {padding: 2.5rem;}
.accreditation-card .accreditation-card-count {display: block; font-size: 11px; letter-spacing: 0.25em;}
.accreditation-card .accreditation-card-title {display: block; font-size: 3rem; line-height: 1; letter-spacing: 0em;}
.accreditation-card .image {display: block; margin: .5rem 0 .75rem 0; background-color: var(--cream);}
.accreditation-card .image img {display: block; max-width: 180px; max-height: 80px; mix-blend-mode: multiply;}
.accreditation-card .small {line-height: 1.25rem;}


/* Footer */
footer {display: block; background-color: var(--ink); color: var(--cream); position: relative; overflow: hidden;}
.footer-marquee {display: block; padding: 32px 0px; border-bottom: solid 1px #ffffff1a;}
.footer-marquee span {display: flex; flex-wrap: wrap; gap: 48px; margin-right: 48px; font-size: 12vw; font-weight: 700; line-height: 1; letter-spacing: 0em;}
.footer-marquee span span {color: var(--accent); margin: 0px;}

.footer-contact-section {display: block; padding: 96px 40px;}
.footer-contact-section .sub-title {display: block; font-size: .75rem; line-height: 1rem; letter-spacing: 0.25em; margin: 0 0 1.5rem;}
.footer-contact-section ul {font-size: 1.125rem; line-height: 1.75rem;}
.footer-contact-section ul li {margin-top: 0.75rem; display: block;}
.footer-contact-section ul li:first-child {margin-top: 0;}
.footer-contact-section .contact-list {font-size: 1.125rem; line-height: 2rem;}
.footer-contact-section .contact-list p {margin: 0px;}

.start-project-main {display: block;}
.start-project-main h2 {display: block; margin: 0 0 40px; font-size: 4.5rem; font-weight: 700; color: var(--cream); line-height: 1;}
.start-project-main h2 span {font-weight: 300; font-style: italic; color: var(--accent);}
.start-project-main .btn-request {gap: 12px;}
.start-project-main .btn-request .request-arrow {width: 56px; height: 56px; border-radius: 50%; transition: all 0.3s ease; border: solid 1px rgba(255, 255, 255, 0.3);}
.start-project-main .btn-request .request-arrow svg {display: block; width: 20px; height: 20px;}
.start-project-main .btn-request .tracking-widest {font-size: 14px; letter-spacing: 0.22em;}
.start-project-main .btn-request:hover .request-arrow {background: var(--accent); border-color: var(--accent);}
.footer-bottom {display: block; border-top: solid 1px rgba(255, 255, 255, 0.1); margin: 80px 0 0 0; padding: 32px 0 0 0;}
.footer-bottom .copyrights-text {display: block; font-size: .75rem; letter-spacing: 0.2em;}



/* Sub Hero Section */
.sub-hero-section {display: block; padding: 48px 64px;}
.sub-hero-section .hero-sub-title {display: flex; flex-wrap: wrap; align-items: center; margin: 0 0 32px; font-size: 11px; letter-spacing: 0.3em; color: var(--ink);}
.sub-hero-section .hero-sub-title span {width: 24px; height: 1px; background-color: var(--ink);}
.sub-hero-section h1 {display: block; font-size: 8.5vw; font-weight: 800; line-height: 0.9; letter-spacing: 0em;}
.sub-hero-section h1 span.pl-10 {padding-left: 10vw;}
.sub-hero-section h1 span.pl-14 {padding-left: 14vw;}
.sub-hero-section h1 span.pl-16 {padding-left: 16vw;}
.sub-hero-section h1 span.pl-20 {padding-left: 20vw;}


.sub-hero-section h1.big {font-size: 10vw; font-weight: 700; letter-spacing: 0em;}
.sub-hero-section h1.big-800 {font-size: 10vw; font-weight: 800; letter-spacing: 0em;}
.sub-hero-section p {display: block; font-size: 1.125rem; max-width: 450px; line-height: 1.75rem;}
.sub-hero-section p.full-width {max-width: 100%; padding-right: 20px;}
.sub-hero-section .location-text {display: flex; flex-wrap: wrap; align-items: center; font-size: 11px; letter-spacing: 0.28em; text-transform: uppercase; margin: 16px 0px 0; gap: 8px; color: var(--ink);}

.stats-section {display: block; border-top: solid 1px #e5e7eb; border-bottom: solid 1px #e5e7eb;}
.stats-section .stats-card {display: block; border-right: solid 1px #e5e7eb; padding: 2rem;}
.stats-section .stats-card.br-0 {border-right: 0px;}
.stats-section .stats-card .stats-card-title {display: block; font-size: 2.25rem; color: var(--ink); font-weight: 700; line-height: 2.5rem; margin: 0 0 .5rem;}
.stats-section .stats-card .stats-card-text {display: block; font-size: 11px; letter-spacing: 0.22em; color: var(--ink); line-height: 1; margin: 0;}


.services-cards-section {display: block; padding: 112px 64px; background-color: var(--bg);}
.service-page-card {display: block; height: 100%; background-color: var(--cream); border: 1px solid #e5e7eb; transition: border-color 0.4s ease, background-color 0.4s ease; overflow: hidden; text-decoration: none; color: var(--ink);}
.service-page-card:hover {border-color: var(--ink);}
.service-page-card .service-img-wrap {aspect-ratio: 16/11; overflow: hidden; position: relative;}
.service-page-card .service-img-wrap img {width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(0.2, 0.8, 0.2, 1);}
.service-page-card:hover .service-img-wrap img {transform: scale(1.05);}
.service-card-info {display: block; padding: 2rem;}
.service-card-info .service-card-icon {margin: 0 0 1.5rem;}
.service-card-info .service-icon-circle {width: 40px; height: 40px; border-radius: 50%; background-color: var(--ink); color: var(--cream); display: inline-flex; align-items: center; justify-content: center; transition: background-color 0.3s ease;}
.service-card-info .service-icon-circle svg {display: block; width: 16px; height: 16px;}
.service-page-card:hover .service-icon-circle {background-color: var(--accent);}
.service-card-info .service-card-count {font-size: 11px; letter-spacing: 0.25em;}
.service-card-info .service-card-icon .arrow-right {width: 20px; height: 20px; display: block; transition: all 0.5s; opacity: 0.6;}
.service-page-card:hover .service-card-info .service-card-icon .arrow-right {transform: translateX(10px); color: var(--accent); opacity: 1;}
.service-page-card h3 {display: block; font-size: 1.875rem; line-height: 2.25rem; font-weight: 700; margin: 0 0 1rem;}
.service-page-card p {display: block; font-size: 1rem; line-height: 1.5rem; font-weight: 400; margin: 0 0 1.5rem;}
.service-page-card .badge-boxs {margin: 0 0 2rem; display: flex; flex-wrap: wrap; gap: 0.5rem;}
.service-page-card .badge-mono {font-family: 'JetBrains Mono', monospace; font-size: 10px; text-transform: uppercase; letter-spacing: 0.22em; padding: 4px 10px; border: 1px solid #adb0b5; border-radius: 50px; display: inline-block; color: var(--ink);}
.service-page-card .btn-service-explore {font-size: 12px; font-weight: 500; letter-spacing: 0.22em;}
.service-page-card .btn-service-explore svg {width: 14px; height: 14px; display: block; transition: all 0.5s;}
.service-page-card:hover .btn-service-explore svg {transform: translateX(10px);}


.capabilities-section {display: block; background-color: var(--cream); border-top: 1px solid #e5e7eb; border-bottom: 1px solid #e5e7eb; padding: 112px 64px;}
.capabilities-section .capabilities-subtitle {font-size: 11px; letter-spacing: 0.3em; margin: 0 0 1.5rem;}
.capabilities-section .capabilities-subtitle span {width: 24px; height: 1px; background-color: var(--ink);}
.capabilities-section h2 {font-size: 3.75rem; font-weight: 700; line-height: 1; letter-spacing: 0em;}
.capabilities-section p {font-size: 1.125rem; line-height: 1.75rem;}
.capabilities-section .capabilities-card {display: block; padding: 2rem;}
.capabilities-section .capabilities-card .capabilities-card-subtitle {display: block; font-size: 11px; letter-spacing: 0.28em; margin: 0 0 1rem;}
.capabilities-section .capabilities-card h4 {display: block; font-size: 1.5rem; font-weight: 700; letter-spacing: 0em; margin: 0 0 1.5rem;}
.capabilities-section .capabilities-card ul {margin: 0 0 2rem;}
.capabilities-section .capabilities-card ul li {margin: 0 0 12px; gap: 12px;}
.capabilities-section .capabilities-card ul li svg {width: 16px; height: 16px; color: var(--accent); flex-shrink: 0;}
.capabilities-section .capabilities-card ul li span {font-size: 1rem; line-height: 1.5rem;}
.capabilities-section .capabilities-card a {font-size: 11px; letter-spacing: 0.22em; gap: .5rem;}
.capabilities-section .capabilities-card a svg {width: 14px; height: 14px;}

/* Process Workflow Section */
.process-workflow-section {background-color: var(--bg); padding: 112px 64px;}
.process-workflow-section .process-subtitle {font-size: 11px; letter-spacing: 0.3em; margin: 0 0 1.5rem;}
.process-workflow-section .process-subtitle span {width: 24px; height: 1px; background-color: var(--ink);}
.process-workflow-section h2 {font-size: 3.75rem; font-weight: 700; line-height: 1; letter-spacing: 0em;}
.process-workflow-section p {font-size: 1.125rem; line-height: 1.75rem;}

.workflow-card {background-color: var(--bg); padding: 2rem; min-height: 220px; display: flex; flex-direction: column; justify-content: space-between;}
.workflow-card .workflow-count {font-size: 11px; letter-spacing: 0.28em;}
.workflow-card h4 {font-size: 1.5rem; font-weight: 700; letter-spacing: 0em; line-height: 2rem; margin: 0 0 .75rem;}
.workflow-card p {font-size: 1rem; line-height: 1.5rem; max-width: 97%;}

/* Where Together Section */
.where-together-section {display: block; background-color: var(--cream); border-top: 1px solid #e5e7eb; border-bottom: 1px solid #e5e7eb; padding: 112px 64px;}
.where-together-section .where-header {margin: 0 0 2.5rem;}
.where-together-section .where-subtitle {font-size: 11px; letter-spacing: 0.3em;}
.where-together-section .where-subtitle span {width: 24px; height: 1px; background-color: var(--ink);}
.where-together-section a {font-size: 11px; letter-spacing: 0.28em;}

.where-card {display: block;}
.where-card .where-card-img {display: block; aspect-ratio: 4/3; position: relative; overflow: hidden;}
.where-card .where-card-img img {display: block; transition: transform 1.2s cubic-bezier(0.2, 0.8, 0.2, 1);}
.where-card .where-card-content {display: flex; flex-wrap: wrap; justify-content: space-between; margin: 16px 0 0 0;}
.where-card .where-card-content .where-card-subtitle {display: block; font-size: 10px; letter-spacing: 0.22em; margin: 0 0 .25rem;}
.where-card .where-card-content h4 {display: block; font-size: 1.125rem; font-weight: 600; letter-spacing: 0em; line-height: 1.25; margin: 0px;}
.where-card .where-card-content svg {display: block; width: 16px; height: 16px;}
.where-card:hover .where-card-img img {transform: scale(1.1);}
.where-card:hover .where-card-content svg {color: var(--accent);}

/* Final Section */
.final-section {background-color: var(--bg); padding: 112px 64px;}
.final-section.bg-cream {background-color: var(--cream);}
.final-section .final-bg {display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; background-color: var(--ink); color: var(--cream); padding: 3.5rem;}
.final-section .final-icon-text {display: flex; flex-wrap: wrap; align-items: center; margin: 0 0 16px; font-size: 11px; letter-spacing: 0.3em; color: var(--cream); gap: 12px; text-transform: uppercase;}
.final-section .final-icon-text svg {display: block; width: 14px; height: 14px; color: var(--accent);}
.final-section h3 {display: block; margin: 0px; font-size: 3rem; letter-spacing: 0em; font-weight: 700; max-width: 48rem; line-height: 1;}
.final-section .construction-text {display: block; margin: 24px 0 0 0; font-size: 11px; letter-spacing: 0.28em; text-transform: uppercase; text-align: center;}

/* Custom Cursor Blob */
.cursor-blob {background: var(--accent); border-radius: 999px; height: 14px; width: 14px; left: 0; top: 0; mix-blend-mode: difference; pointer-events: none; position: fixed; z-index: 999999; transform: translate3d(0, 0, 0) scale(1); transition: width .3s ease, height .3s ease, background-color .3s ease;}

/* Projects Page Filter Buttons */
.project-filter {display: flex; flex-wrap: wrap; align-items: center; margin: 3rem 0 0; gap: .75rem;}
.project-filter-btn {font-family: 'JetBrains Mono', monospace; font-size: 12px; text-transform: uppercase; letter-spacing: 0.22em; padding: 8px 16px; border-radius: 50px; border: 1px solid #adb0b5; background: transparent; color: var(--ink); transition: all 0.3s ease; cursor: pointer; display: block;}
.project-filter-btn.active, .project-filter-btn:hover {background-color: var(--ink); color: var(--cream); border-color: var(--ink);}


/* Quick Links Section */
.quick-links-section {display: block; padding: 0 48px 48px;}
.quick-links-section .quick-card {display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; padding: 1.5rem; border: solid 1px #e5e7eb; text-decoration: none; transition: all 0.5s;}
.quick-links-section .quick-card .quick-icon {display: flex; flex-wrap: wrap; justify-content: center; align-items: center; width: 44px; height: 44px; border-radius: 50%; background-color: var(--ink); transition: all 0.5s;}
.quick-links-section .quick-card .quick-icon svg {display: block; width: 16px; height: 16px; color: #fff;}
.quick-links-section .quick-card .quick-content {display: block; width: calc(100% - 44px - 1rem);}
.quick-links-section .quick-card .quick-subtitle {display: block; font-size: 10px; letter-spacing: 0.25em; color: var(--ink);}
.quick-links-section .quick-card .quick-text {display: block; font-size: 1.25rem; line-height: 1.75rem; letter-spacing: 0em; font-weight: 600; color: var(--ink);}
.quick-links-section .quick-card:hover {border-color: var(--ink);}
.quick-links-section .quick-card:hover .quick-icon {background-color: var(--accent);}


/* Direct Message Section */
.direct-message-section {display: block; padding: 0 64px 128px;}
.direct-main {display: flex; flex-direction: column; gap: 40px;}
.direct-main .direct-subtitle {font-size: 11px; letter-spacing: 0.3em; margin: 0 0 12px;}
.direct-main .direct-text {font-size: 1.125rem; line-height: 1.625; color: var(--ink);}
.direct-main a.direct-big {font-size: 1.875rem; font-weight: 700; line-height: 2.25rem; letter-spacing: 0em;}
.direct-main a.direct-middle {font-size: 1.5rem; font-weight: 700; line-height: 2rem; letter-spacing: 0em;}
.direct-main ul.direct-list {display: block; padding: 0px; margin: 0px;}
.direct-main ul.direct-list li {display: flex; flex-wrap: wrap; align-items: center; gap: 12px; font-size: 16px; font-weight: 400; line-height: 24px; margin: 0 0 8px 0; color: var(--ink);}
.direct-main ul.direct-list li span {display: block; background-color: var(--accent); width: 6px; height: 6px; border-radius: 50%;}
.direct-main ul.direct-list li:last-child {margin: 0;}
.form-main {margin: 0;}
.form-main .form-subtitle {font-size: 11px; letter-spacing: 0.3em; margin: 0 0 24px;}
.form-main label {display: block; width: 100%;}
.form-main label span {display: block; width: 100%; font-size: 11px; letter-spacing: 0.25em; line-height: 24px; margin: 0px;}
.form-main .field {background: transparent; border: none; border-bottom: 1px solid rgba(17, 17, 17, 0.4); color: var(--ink); font-size: 18px; outline: none; padding: 18px 0; transition: border-color .3s; width: 100%; border-radius: 0; margin: 0;}
.form-main .field:focus {border-bottom-color: var(--ink);}
.form-main .field::placeholder {color: rgba(17, 17, 17, 0.4);}
.form-main textarea.field {resize: none;}
.form-main .buttons {display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px; margin: 40px 0 0 0;}
.form-main .buttons .button-text {font-size: 11px; letter-spacing: 0.25em;}
.form-main .buttons .button-text p {margin: 0px;}

/* Location Section */
.location-section {display: block; padding: 0 64px 128px;}
.location-section .location-header {margin: 0 0 32px;}
.location-section .location-header .location-subtitle {display: block; font-size: 11px; letter-spacing: 0.3em; color: var(--ink); margin: 0 0 12px;}
.location-section .location-header .location-title {display: block; font-size: 3.75rem; font-weight: 700; letter-spacing: 0em; line-height: 1; color: var(--ink); margin: 0;}
.location-section .location-header a {font-size: 12px; letter-spacing: 0.22em; font-weight: 500;}
.location-section .map-main {background-color: var(--cream); border: solid 1px #e5e7eb;}
.location-section .map-main iframe {display: block; border: 0px; filter: grayscale(0.4) contrast(1.05); aspect-ratio: 21/9;}

.location-section .float-address-card {position: absolute; left: 32px; bottom: 32px; background-color: var(--ink); color: var(--cream); max-width: 320px; z-index: 10; padding: 24px; box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.1) 0px 8px 10px -6px}
.location-section .float-address-card .float-address-subtitle {gap: 8px; font-size: 10px; letter-spacing: 0.28em; margin: 0 0 12px; text-transform: uppercase;}
.location-section .float-address-card .float-address-subtitle svg {color: var(--accent); width: 14px; height: 14px;}
.location-section .float-address-card .float-address-title {font-size: 1.125rem; font-weight: 700; line-height: 1.25;}
.location-section .float-address-card .float-address-text {font-size: .875rem; font-weight: 400; line-height: 1.25rem; margin: .25rem 0 0 0;}
.location-section .float-address-card .float-address-btn {margin: 1rem 0 0 0; font-size: 11px; letter-spacing: 0.22em; color: var(--accent);}
.location-section .float-address-card .float-address-btn svg {display: block; width: 14px; height: 14px;}
.location-section .float-address-card .float-address-btn:hover {color: #fff;}

/* Recent Project Section */
.recent-project-section {display: block; padding: 0 64px 96px;}
.recent-project-section .recent-project-aspect {display: block; aspect-ratio: 21/9;}
.recent-project-section .recent-project-aspect img {width: 100%; height: 100%; object-fit: cover; display: block;}
.recent-project-section .recent-project-text {font-size: 11px; letter-spacing: 0.25em; margin: 16px 0 0;}

/* Stats Section */
.stats-section {display: block; border-top: solid 1px #e5e7eb; border-bottom: solid 1px #e5e7eb;}
.stats-section .stats-card {display: block; padding: 2rem;}
.stats-section .stats-card.br {border-right: solid 1px #e5e7eb;}
.stats-section .stats-card .stats-count {display: block; font-size: 2.25rem; font-weight: 700; letter-spacing: 0em; line-height: 2.5rem;}
.stats-section .stats-card .stats-text {display: block; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; margin: 0.5rem 0 0;}

/* Story Section */
.story-section {display: block; padding: 128px 64px;}
.story-section .story-subtitle {display: flex; flex-wrap: wrap; align-items: center; margin: 0 0 32px; font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--ink); gap: 12px;}
.story-section .story-subtitle span {display: block; width: 24px; height: 1px; background-color: var(--ink);}
.story-section .story-title {display: flex; flex-wrap: wrap; gap: 8px; font-size: 3rem; font-weight: 700; letter-spacing: 0em; line-height: 1;}
.story-section p {font-size: 1.125rem; line-height: 1.75rem; color: var(--ink);}

/* Core Principles Section */
.core-principles-section {display: block; padding: 112px 64px; background-color: var(--cream); border-bottom: solid 1px #e5e7eb;}
.core-principles-section .mb-56 {margin-bottom: 56px;}
.core-principles-section .principles-subtitle {display: flex; flex-wrap: wrap; align-items: center; margin: 0 0 24px; font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--ink); gap: 12px;}
.core-principles-section .principles-subtitle span {display: block; width: 24px; height: 1px; background-color: var(--ink);}
.core-principles-section .principles-title {display: flex; flex-wrap: wrap; gap: 8px; font-size: 3.75rem; font-weight: 700; letter-spacing: 0em; line-height: 1;}
.core-principles-section p {font-size: 1.125rem; line-height: 1.75rem; color: var(--ink); margin: 0px;}

.core-principles-section .principles-card {display: block; padding: 2.5rem;}
.core-principles-section .principles-card .principles-card-header {display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; margin: 0 0 2rem;}
.core-principles-section .principles-card .principles-card-header .icon-circle {width: 40px; height: 40px; border-radius: 50%; background-color: var(--ink); color: var(--cream); display: inline-flex; align-items: center; justify-content: center; transition: background-color 0.3s ease;}
.core-principles-section .principles-card .principles-card-header .icon-circle svg {display: block; width: 16px; height: 16px;}
.core-principles-section .principles-card .principles-card-header span {display: block; font-size: 11px; letter-spacing: 0.25em; width: auto;}
.core-principles-section .principles-card .principles-card-info {display: block;}
.core-principles-section .principles-card .principles-card-info h3 {display: block; font-size: 1.875rem; font-weight: 700; letter-spacing: 0em; line-height: 2.25rem; margin: 0px 0 12px;}
.core-principles-section .principles-card .principles-card-info p {display: block; font-size: 1rem; font-weight: 400; line-height: 1.5rem; margin: 0px;}


/* Historical Timeline Section */
.timeline-section {display: block; padding: 128px 64px;}
.timeline-section .mb-64 {margin-bottom: 64px;}
.timeline-section .timeline-subtitle {display: flex; flex-wrap: wrap; align-items: center; margin: 0 0 24px; font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--ink); gap: 12px;}
.timeline-section .timeline-subtitle span {display: block; width: 24px; height: 1px; background-color: var(--ink);}
.timeline-section .timeline-title {display: flex; flex-wrap: wrap; gap: 8px; font-size: 3.75rem; font-weight: 700; letter-spacing: 0em; line-height: 1; margin: 0px;}
.timeline-section p {font-size: 1.125rem; line-height: 1.75rem; color: var(--ink); margin: 0px;}

.timeline-list {display: block; border-top: solid 1px #e5e7eb;}
.timeline-list .timeline-card {display: block; border-bottom: solid 1px #e5e7eb; padding: 48px 0px;}
.timeline-list .timeline-card .timeline-years {display: block; font-size: 3rem; font-weight: 800; letter-spacing: 0em; color: var(--accent); line-height: 1;}
.timeline-list .timeline-card h3 {display: block; font-size: 1.875rem; font-weight: 700; line-height: 2.25rem; letter-spacing: 0em; color: var(--ink); margin: 0px 0 12px;}
.timeline-list .timeline-card p {display: block; font-size: 1rem; font-weight: 400; line-height: 1.5rem; color: var(--ink); margin: 0px;}
.timeline-list .timeline-card .chapter-text {display: block; font-size: 11px; letter-spacing: 0.22em; color: var(--ink); text-transform: uppercase;}


/* Team Section */
.team-section {display: block; padding: 112px 64px; background-color: var(--cream); border-top: solid 1px #e5e7eb; border-bottom: solid 1px #e5e7eb;}
.team-section .team-aspect {display: block; aspect-ratio: 4/5;}
.team-section .team-aspect img {display: block; width: 100%; height: 100%; object-fit: cover;}
.team-section .team-subtitle {display: flex; flex-wrap: wrap; align-items: center; font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase; margin: 0 0 24px; color: var(--ink); gap: 12px;}
.team-section .team-subtitle span {width: 24px; height: 1px; background-color: var(--ink);}
.team-section h2 {display: flex; flex-wrap: wrap; gap: 6px; font-size: 3rem; font-weight: 700; letter-spacing: 0em; line-height: 1; margin: 0 0 1.5rem;}
.team-section .team-content {display: block; margin: 0 0 2rem;}
.team-section .team-content p {display: block; font-size: 1.125rem; line-height: 1.75rem; margin: 0 0 1rem;}
.team-section .team-list {display: flex; flex-wrap: wrap; align-items: center; gap: 8px;}
.team-section .team-list span {display: block; font-size: 11px; letter-spacing: 0.22em; padding: 6px 12px; text-transform: uppercase; border: solid 1px #adb0b5; border-radius: 50px;}

/* What We Practise Section */
.what-practise-section {display: block; padding: 112px 64px;}
.what-practise-section .practise-header {margin: 0 0 48px;}
.what-practise-section .practise-header .practise-subtitle {display: flex; flex-wrap: wrap; align-items: center; font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--ink); gap: 12px;}
.what-practise-section .practise-header .practise-subtitle span {width: 24px; height: 1px; background-color: var(--ink);}
.what-practise-section .practise-header a {font-size: 11px; letter-spacing: 0.28em; text-transform: uppercase;}
.what-practise-section .practise-card {background-color: var(--cream); border: solid 1px #e5e7eb; text-decoration: none; transition: all 0.5s; color: var(--ink);}
.what-practise-section .practise-card .practise-aspect {aspect-ratio: 4/3;}
.what-practise-section .practise-card .practise-aspect img {display: block; width: 100%; height: 100%; object-fit: cover; transition: all 0.5s;}
.what-practise-section .practise-card .practise-content {display: block; padding: 28px;}
.what-practise-section .practise-card .practise-content .practise-link {display: flex; flex-wrap: wrap; justify-content: space-between; margin: 0 0 16px;}
.what-practise-section .practise-card .practise-content .practise-link .practise-subtitle {display: block; font-size: 10px; letter-spacing: 0.25em; text-transform: uppercase;}
.what-practise-section .practise-card .practise-content .practise-link svg {display: block; width: 16px; height: 16px; color: var(--ink); opacity: 0.6;}
.what-practise-section .practise-card .practise-content h3 {display: block; font-size: 1.5rem; font-weight: 700; line-height: 2rem; letter-spacing: 0em; margin: 0px;}

.what-practise-section .practise-card:hover {border-color: var(--ink);}
.what-practise-section .practise-card:hover .practise-aspect img {transform: scale(1.05, 1.05);}
.what-practise-section .practise-card:hover .practise-content .practise-link svg {color: var(--accent); opacity: 1;}

/* Accreditations Section */
.accreditations-section {display: block; padding: 112px 64px; background-color: var(--cream);}
.accreditations-section .mb-48 {margin-bottom: 48px;}
.accreditations-section .accreditations-subtitle {display: flex; flex-wrap: wrap; align-items: center; font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--ink); gap: 12px; margin: 0 0 24px;}
.accreditations-section .accreditations-subtitle span {width: 24px; height: 1px; background-color: var(--ink);}
.accreditations-section h2 {display: flex; flex-wrap: wrap; align-items: center; font-size: 3.75rem; font-weight: 700; letter-spacing: 0em; line-height: 1; gap: 6px;}
.accreditations-section p {display: block; font-size: 1.125rem; line-height: 1.75rem; color: var(--ink); margin: 0px;}

.accreditations-section .accreditations-card {display: flex; flex-direction: column; justify-content: space-between; padding: 2rem; min-height: 180px;}
.accreditations-section .accreditations-card .accreditations-icon {display: flex; flex-wrap: wrap; gap: 12px;}
.accreditations-section .accreditations-card .accreditations-icon svg {display: block; width: 16px; height: 16px; color: var(--accent);}
.accreditations-section .accreditations-card .accreditations-icon span {display: block; width: calc(100% - 28px); font-size: 10px; letter-spacing: 0.25em; text-transform: uppercase; color: var(--ink);}
.accreditations-section .accreditations-card .accreditations-info {display: block;}
.accreditations-section .accreditations-card .accreditations-info .image {display: block; margin: .5rem 0 .75rem 0; background-color: var(--cream);}
.accreditations-section .accreditations-card .accreditations-info .image img {display: block; max-width: 180px; max-height: 80px; mix-blend-mode: multiply;}
/*.accreditations-section .accreditations-card .accreditations-info h4 {display: block; font-size: 2.25rem; font-weight: 700; letter-spacing: 0em; line-height: 2.5rem;}*/
.accreditations-section .accreditations-card .accreditations-info p {display: block; font-size: .875rem; line-height: 1.25rem; margin: 8px 0 0 0; color: var(--ink);}


/* Service Details Section */
.sd-hero-section {display: flex; flex-direction: column; justify-content: flex-end; background-color: var(--ink); position: relative; overflow: hidden; height: 70vh; min-height: 520px;}
.sd-hero-section.height-560 {height: 75vh; min-height: 560px;}
.sd-hero-section .sd-hero-img {position: absolute; top:0; left:0; width:100%; height:100%; z-index: 1;}
.sd-hero-section .sd-hero-img img {display: block; object-fit: cover; width:100%; height:100%;}
.sd-hero-section .sd-hero-img .over-bg {display: block; position: absolute; top:0; left:0; width:100%; height:100%; background: linear-gradient(to bottom, rgba(0,0,0,0.55) 0%, rgba(0,0,0,0.25) 50%, rgba(0,0,0,0.8) 100%);}

.sd-hero-section .sd-hero-info {position: relative; z-index: 2; padding: 128px 64px 80px;}
.sd-hero-section .sd-hero-info .btn-back {display: inline-flex; align-items: center; gap: 8px; color: rgba(255, 255, 255, 0.8); letter-spacing: 0.28em; text-transform: uppercase; text-decoration: none; font-size: 11px; margin: 0 0 1.5rem;}
.sd-hero-section .sd-hero-info .btn-back:hover {color: rgba(255, 255, 255, 1);}
.sd-hero-section .sd-hero-info .sd-hero-subtitle {display: flex; flex-wrap: wrap; align-items: center; gap: 12px; color: rgba(255, 255, 255, 0.8); margin: 0 0 1.25rem; font-size: 11px; letter-spacing: 0.28em; text-transform: uppercase;}
.sd-hero-section .sd-hero-info .sd-hero-subtitle span {display: block; width: 36px; height: 1px; background-color: var(--accent);}
.sd-hero-section .sd-hero-info h1 {display: block; max-width: 64rem; font-size: 7vw; font-weight: 800; line-height: 0.9; letter-spacing: 0em; color: #fff; margin: 0px;}
.sd-hero-section .sd-hero-info h1.text-small {font-size: 6.5vw;}
.sd-hero-section .sd-hero-info p {display: block; max-width: 42rem; font-size: 1.125rem; line-height: 1.75rem; color: rgba(255, 255, 255, 0.85); margin: 1.5rem 0 0 0;}


.sd-practice-section {display: block; padding: 128px 64px; background-color: var(--bg);}
.sd-practice-section .sd-practice-subtitle {display: flex; flex-wrap: wrap; align-items: center; font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase; gap: .75rem; margin: 0 0 2rem;}
.sd-practice-section .sd-practice-subtitle span {display: inline-flex; width: 24px; height: 1px; background-color: var(--ink);}
.sd-practice-section h2 {display: block; font-size: 3rem; font-weight: 700; letter-spacing: 0em; line-height: 1;}
.sd-practice-section p {display: block; font-size: 1.125rem; line-height: 1.75rem; color: var(--ink);}
.sd-practice-section .sd-practice-list {display: flex; flex-wrap: wrap; align-items: center; gap: .5rem;}
.sd-practice-section .sd-practice-list span {display: block; font-size: 11px; letter-spacing: 0.22em; line-height: 1.75rem; text-transform: uppercase; padding: 6px 12px; border-radius: 99px; border: solid 1px #adb0b5;}

.sd-capabilities-section {display: block; padding: 112px 64px; background-color: var(--cream); border-top: solid 1px #e5e7eb; border-bottom: solid 1px #e5e7eb;}
.sd-capabilities-section .sd-capabilities-subtitle {display: flex; flex-wrap: wrap; align-items: center; font-size: 11px; letter-spacing: 0.3em; gap: 12px; margin: 0 0 3rem; text-transform: uppercase; color: var(--ink);}
.sd-capabilities-section .sd-capabilities-subtitle span {display: inline-flex; width: 24px; height: 1px; background-color: var(--ink);}
.sd-capabilities-section .sd-capabilities-card {display: flex; flex-wrap: wrap; align-items: flex-start; gap: 1rem; padding: 2rem;}
.sd-capabilities-section .sd-capabilities-card .sd-capabilities-icon {display: flex; flex-wrap: wrap; align-items: center; justify-content: center; width: 36px; height: 36px; background-color: var(--ink); border-radius: 50%;}
.sd-capabilities-section .sd-capabilities-card .sd-capabilities-icon svg {display: block; width: 16px; height: 16px; color: var(--cream);}
.sd-capabilities-section .sd-capabilities-card .sd-capabilities-info {display: block; width: calc(100% - 52px);}
.sd-capabilities-section .sd-capabilities-card .sd-capabilities-info .sd-capabilities-subtitle {display: block; font-size: 10px; letter-spacing: 0.25em; color: var(--ink); text-transform: uppercase; opacity: 0.6; margin: 0px 0 4px;}
.sd-capabilities-section .sd-capabilities-card .sd-capabilities-info h3 {display: block; font-size: 1.25rem; font-weight: 600; line-height: 1.75rem; letter-spacing: 0em; color: var(--ink); margin: 0px;}

.sb-deliverables-section {display: block; padding: 96px 64px; background-color: var(--cream); border-top: solid 1px #e5e7eb; border-bottom: solid 1px #e5e7eb;}
.sb-deliverables-section .sb-deliverables-subtitle {display: flex; flex-wrap: wrap; align-items: center; font-size: 11px; letter-spacing: 0.3em; gap: 12px; margin: 0 0 24px; text-transform: uppercase; color: var(--ink);}
.sb-deliverables-section .sb-deliverables-subtitle span {display: inline-flex; width: 24px; height: 1px; background-color: var(--ink);}
.sb-deliverables-section h3 {display: block; font-size: 2.25rem; font-weight: 700; letter-spacing: 0em; line-height: 2.5rem; margin: 0px;}
.sb-deliverables-section .sb-deliverables-list {display: block; font-size: 1rem; line-height: 1.5rem; text-transform: uppercase; border-radius: 60px; letter-spacing: 0.18em; color: var(--ink); border: solid 1px #adb0b5; padding: 8px 16px;}

.navigation-section {display: block; padding: 96px 64px; background-color: var(--cream); border-top: solid 1px #e5e7eb; border-bottom: solid 1px #e5e7eb;}
.navigation-section .navigation-link {display: block; padding: 32px; border: solid 1px #adb0b5; transition: all 0.5s; text-decoration: none;}
.navigation-section .navigation-link .navigation-subtitle {display: block; font-size: 10px; letter-spacing: 0.28em; text-transform: uppercase; color: var(--ink); margin: 0 0 16px;}
.navigation-section .navigation-link .navigation-title {display: block; font-size: 1.875rem; font-weight: 700; line-height: 2.25rem; letter-spacing: 0em; color: var(--ink); margin: 0;}
.navigation-section .navigation-link:hover {background-color: var(--ink);}
.navigation-section .navigation-link.bg-accent:hover {background-color: var(--accent);}
.navigation-section .navigation-link:hover .navigation-subtitle {color: #fff;}
.navigation-section .navigation-link:hover .navigation-title {color: #fff;}
.navigation-section .navigation-cbwp-text {display: block; text-align: center; font-size: 11px; letter-spacing: 0.28em; text-transform: uppercase; margin: 40px 0 0 0;}



.pd-metadata-section {display: block; background-color: var(--cream); border-bottom: solid 1px #e5e7eb;}
.pd-metadata-section .metadata-card {display: block; padding: 2rem; border-right: solid 1px #e5e7eb;}
.pd-metadata-section .metadata-card .metadata-icon {display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; text-transform: uppercase; font-size: 11px; letter-spacing: 0.25em; margin: 0 0 0.75rem;}
.pd-metadata-section .metadata-card .metadata-icon svg {display: block; width: 14px; height: 14px; color: var(--accent);}
.pd-metadata-section .metadata-card h4 {display: block; font-size: 1.875rem; font-weight: 700; line-height: 2.25rem; letter-spacing: 0em; color: var(--ink); margin: 0px;}


.pd-scope-services-section {display: block; background-color: var(--cream); padding: 112px 64px; border-top: solid 1px #e5e7eb; border-bottom: solid 1px #e5e7eb;}
.pd-scope-services-section .pd-scope-services-subtitle {display: flex; flex-wrap: wrap; align-items: center; font-size: 11px; letter-spacing: 0.3em; gap: 0.75rem; margin: 0 0 2rem; text-transform: uppercase; color: var(--ink);}
.pd-scope-services-section .pd-scope-services-subtitle span {display: inline-flex; width: 24px; height: 1px; background-color: var(--ink);}
.pd-scope-services-section .pd-scope-services-list {display: block; padding: 0px; margin: 0px; list-style: none;}
.pd-scope-services-section .pd-scope-services-list li {display: flex; flex-wrap: wrap; align-items: flex-start; padding: 0.75rem 0; gap: 1rem; border-top: solid 1px #e5e7eb; margin-top: 0.75rem;}
.pd-scope-services-section .pd-scope-services-list li .pd-scope-services-count {display: block; width: 32px; letter-spacing: .22em; text-transform: uppercase; font-size: 11px; padding-top: .25rem; opacity: 0.6;}
.pd-scope-services-section .pd-scope-services-list li .pd-scope-services-text {display: block; width: calc(100% - 48px); font-size: 1.5rem; font-weight: 600; line-height: 2rem; letter-spacing: 0em;}
.pd-scope-services-section .pd-scope-services-list li:first-child {margin-top: 0;}

.pd-scope-services-section .pd-scope-list {display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0 0 2rem;}
.pd-scope-services-section .pd-scope-list span {display: block; border: 1px solid #adb0b5; padding: 6px 12px; border-radius: 50px; letter-spacing: .2em; font-size: 11px; text-transform: uppercase;}
.pd-scope-services-section p {display: block; font-size: 1.125rem; line-height: 1.75rem; opacity: 0.85; color: var(--ink); margin: 0 0 2rem;}
.pd-scope-services-section .btn-request-pd {display: inline-flex; align-items: center; gap: 12px; color: var(--ink); text-decoration: none;}
.pd-scope-services-section .btn-request-pd .btn-request-icon {display: flex; flex-wrap: wrap; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 50%; background-color: var(--ink); transition: background-color 1s ease, color 1s ease;}
.pd-scope-services-section .btn-request-pd .btn-request-icon svg {display: block; width: 16px; height: 16px; color: #fff;}
.pd-scope-services-section .btn-request-pd span {display: inline-flex; font-size: 12px; letter-spacing: .22em; text-transform: uppercase;}
.pd-scope-services-section .btn-request-pd:hover .btn-request-icon {background-color: var(--accent);}


.pd-gallery-section {display: block; padding: 112px 64px;}
.pd-gallery-section .pd-gallery-subtitle {display: flex; flex-wrap: wrap; align-items: center; font-size: 11px; letter-spacing: 0.3em; gap: 12px; margin: 0 0 40px; text-transform: uppercase; color: var(--ink);}
.pd-gallery-section .pd-gallery-subtitle span {display: inline-flex; width: 24px; height: 1px; background-color: var(--ink);}
.pd-gallery-section .pd-gallery-grid {display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 24px;}
.pd-gallery-section .pd-gallery-grid .col-span-2 {grid-column: span 2 / span 2;}
.pd-gallery-section .pd-gallery-grid .aspect-16-9 {aspect-ratio: 16/9;}
.pd-gallery-section .pd-gallery-grid .aspect-4-3 {aspect-ratio: 4/3;}
.pd-gallery-section .pd-gallery-grid img {display: block; width: 100%; height: 100%; object-fit: cover; transition: all 0.5s;}
.pd-gallery-section .pd-gallery-grid > div:hover img {transform: scale(1.05, 1.05);}


/* Responsive */

/* Screen Size 1600px */
@media (max-width: 1700px) {

}

/* Screen Size 1440px */
@media (max-width: 1599px) {
  .hero-content .col-12.col-xxl-8 {width: 1200px;}
}

/* Screen Size 1366px */
@media (max-width: 1439px) {
}

/* Screen Size 1280px */
@media (max-width: 1335px) {
  .hero-content .col-12.col-xxl-8 {width: 100%;}
}

/* Screen Size 1024px */
@media (max-width: 1199px) {
  .hero-content {margin: 5rem 1rem 1rem 1rem;}
  .annotations-text {left: 0px;}
  .hero-indicators-scroll {right: 0px;}

  .workflow-card {min-height: 100%;}
  .where-card .where-card-content > div {width: calc(100% - 16px);}
  .final-section h3 {flex: 1;}
  .final-section .final-bg > div {flex: 1;}

  .form-main .buttons .button-text {flex: 1;}
  .quick-links-section .quick-card .quick-text {word-break: break-all;}

}

/* Screen Size 768px */
@media (max-width: 991px) {
  .hero-content {height: calc(100vh - 17rem); align-items: flex-end;}
  .accreditation-card .image img {max-width: 120px; max-height: 40px;}
  .accreditations-section .accreditations-card .accreditations-info .image img {max-width: 120px; max-height: 40px;}

  .navigation-section .navigation-link {height: 100%;}

  .sub-hero-section .location-text {flex-wrap: nowrap;}
  .direct-main a.direct-middle {word-break: break-all;}
  .location-section .location-header > div {flex: 1;}

}

/* Screen Size 767px */
@media (max-width: 767px) {
  .logo-mobile img {max-width: 100%; width: 220px;}

  header.fixed {padding: 1.25rem 0;}
  header.fixed .header-main {padding: 0 .25rem; margin: 0 1rem;}
  header.fixed.scrolled .header-main {margin: 0 1rem; padding: 0 1.25rem;}
  header.fixed .header-main .logo .logo-title img {padding: 10px;}

  .btn-accent {font-size: 11px; padding: 0.5rem 0.5rem 0.5rem 1.25rem;}
  .btn-accent .icon {width: 36px; height: 36px;}

  .hero-content {margin: 5rem 0.5rem 0rem 0.5rem;}
  .hero-content .hero-tagline {font-size: 11px;}
  .hero-content h1 {font-size: 14vw;}
  .hero-content .line-divider {margin: 0.25rem 0 1.75rem; max-width: 100%;}
  .hero-content .leading-relaxed {font-size: .875rem; line-height: 1.625;}
  .hero-content .btn-project {font-size: 11px;}

  .count-main .count-boxs {padding: 1rem; border-bottom: solid 1px #ffffff26;}
  .count-main .col-md-3.col-6:nth-child(2) .count-boxs {border-right: 0px;}
  .count-main .count-boxs .count-title {font-size: 1.5rem; line-height: 1;}
  .count-main .count-boxs .count-text {font-size: 9px; letter-spacing: 0.22em;}

  .services-section {padding: 7rem 1.5rem;}
  .section-header {margin-bottom: 4rem;}
  .services-section h2 {font-size: 12vw; margin-bottom: 5rem;}
  .service-main .service-hover-item {padding: 0px 0 1.5rem;}
  .service-main .service-hover-item a {padding: 2rem 0px;}
  .service-main .service-hover-item h3 {font-size: 1.875rem; line-height: 2.25rem; letter-spacing: 0em;}
  .service-main .service-hover-item p {font-size: 1rem; line-height: 1.5rem;}
  .service-main .service-image {aspect-ratio: 4/3;}

  .about-section {padding: 7rem 1.5rem;}
  .about-title-content {margin-bottom: 5rem;}
  .about-title-content h2 {font-size: 10vw; line-height: 0.92; margin-bottom: 2.5rem;}
  .about-title-content p {font-size: 15px; line-height: 1.625;}

  .photo-stats-main .stats-boxs {padding: 1.5rem; min-height: 180px;}
  .photo-stats-main .stats-boxs .stats-count {font-size: 3rem;}

  .projects-section {padding: 7rem 1.5rem;}
  .projects-section h2 {font-size: 12vw; margin-bottom: 4rem;}
  .projects-section h2 span.pl {padding-left: 12vw;}

  .proj-row {padding: 1.5rem 0.25rem;}
  .proj-row .proj-title {font-size: 1.5rem; line-height: 2rem; margin-bottom: 1rem;}
  .proj-row .proj-title .aspect-4-3 {aspect-ratio: 4/3;}

  .affiliations-marquee {padding: 1.5rem 0;}
  .affiliations-marquee span {font-size: 1.875rem; line-height: 2.25rem; margin-right: 0.75rem;}
  .affiliations-marquee span span {margin-left: 0.75rem;}

  .affiliations-grid {padding: 6rem 1.5rem;}
  .section-header.margin-bottom-48 {margin-bottom: 3rem;}
  .accreditation-card {padding: 2rem;}
  .accreditation-card .image img {max-width: 180px; max-height: 80px;}

  .footer-marquee {padding: 2rem 0px;}
  .footer-marquee span {font-size: 18vw; gap: 0.75rem; margin-right: 0.75rem;}

  .footer-contact-section {padding: 4rem 1.5rem;}
  .start-project-main {margin-bottom: 2.5rem;}
  .start-project-main h2 {font-size: 3rem; margin-bottom: 2.5rem;}
  .start-project-main h2 p {margin: 0px;}
  .footer-contact-section ul {margin-bottom: 2.5rem;}

  .footer-bottom {margin: 5rem 0 0 0; padding: 2rem 0 0 0;}

  .fade-page {padding: 8rem 0 0 0;}
  .sub-hero-section {padding: 2rem 1.5rem 3rem;}
  .sub-hero-section.project-hero-section {padding: 3rem 1.5rem 4rem;}
  .sub-hero-section.contact-hero-section {padding: 3rem 1.5rem;}
  .sub-hero-section .hero-sub-title {margin-bottom: 2rem;}
  .sub-hero-section h1 {font-size: 14vw; margin-bottom: 2rem;}
  .sub-hero-section h1 span.pl-14 {padding-left: 8vw;}
  .sub-hero-section h1.big {font-size: 14vw;}
  .sub-hero-section h1.big-800 {font-size: 14vw;}
  .sub-hero-section h1 span.pl-20 {padding-left: 12vw;}
  .sub-hero-section h1 span.pl-16 {padding-left: 8vw;}
  .sub-hero-section p {font-size: 1rem; max-width: 28rem; line-height: 1.625;}

  .stats-section .stats-card {padding: 1.5rem 1.25rem;}
  .stats-section .stats-card .stats-card-title {font-size: 1.875rem; line-height: 1;}
  .stats-section .stats-card .stats-card-text {font-size: 10px;}

  .services-cards-section {padding: 5rem 1.5rem;}
  .service-card-info {padding: 1.5rem;}
  .service-page-card h3 {font-size: 1.5rem; line-height: 1.25;}
  .service-page-card p {font-size: .875rem; line-height: 1.625;}

  .capabilities-section {padding: 5rem 1.5rem;}
  .capabilities-section h2 {font-size: 2.25rem; line-height: .95; margin: 0px 0 2.5rem;}
  .capabilities-section p {font-size: 1rem; line-height: 1.625;}
  .capabilities-section .capabilities-card {padding: 1.5rem;}
  .capabilities-section .capabilities-card h4 {font-size: 1.25rem;}
  .capabilities-section .capabilities-card ul li span {font-size: .875rem; line-height: 1.25rem;}

  .process-workflow-section {padding: 5rem 1.5rem;}
  .process-workflow-section h2 {margin: 0px 0 2.5rem; font-size: 2.25rem; line-height: 0.95;}
  .process-workflow-section p {font-size: 1rem; line-height: 1.625;}

  .workflow-card {padding: 1.5rem; min-height: 220px;}
  .workflow-card h4 {font-size: 1.25rem; line-height: 1.25;}
  .workflow-card p {font-size: .875rem; line-height: 1.625;}

  .where-together-section {padding: 5rem 1.5rem;}

  .final-section {padding: 5rem 1.5rem;}
  .final-section .final-bg {padding: 2rem; gap: 1.5rem;}
  .final-section .final-bg h3 {flex: 0 0 100%; font-size: 1.875rem; line-height: 1.25;}

  .sd-hero-section .sd-hero-info {padding: 8rem 1.5rem 3.5rem;}
  .sd-hero-section .sd-hero-info h1 {font-size: 11vw;}
  .sd-hero-section .sd-hero-info p {font-size: 1rem; line-height: 1.5rem;}

  .sd-practice-section {padding: 6rem 1.5rem;}
  .sd-practice-section h2 {font-size: 2.25rem; line-height: 1.25; margin: 0 0 2.5rem;}
  .sd-practice-section p {font-size: 1rem; line-height: 1.625;}
  .sd-practice-section .sd-practice-list {margin-top: 1rem;}
  .sd-practice-section .sd-practice-list span {padding: .375rem .75rem; line-height: 1;}

  .sd-capabilities-section {padding: 6rem 1.5rem;}
  .sd-capabilities-section .sd-capabilities-card {padding: 1.5rem; min-height: 140px;}
  .sd-capabilities-section .sd-capabilities-card .sd-capabilities-info h3 {font-size: 1.125rem; line-height: 1.375;}

  .sb-deliverables-section {padding: 5rem 1.5rem;}
  .sb-deliverables-section .sb-deliverables-subtitle {margin: 0 0 1.5rem;}
  .sb-deliverables-section h3 {font-size: 1.875rem; line-height: 1.25; margin: 0 0 2.5rem;}
  .sb-deliverables-section .sb-deliverables-list {font-size: .875rem; line-height: 1.25rem; padding: .5rem 1rem;}

  .navigation-section {padding: 4rem 1.5rem;}
  .navigation-section .navigation-link {padding: 1.5rem;}
  .navigation-section .navigation-link .navigation-subtitle {margin: 0 0 1rem;}
  .navigation-section .navigation-link .navigation-title {font-size: 1.5rem; line-height: 1.25;}

  .sd-hero-section .sd-hero-info h1.text-small {font-size: 10vw;}
  .pd-metadata-section {border-bottom: 0px;}
  .pd-metadata-section .metadata-card {padding: 1.5rem 1.25rem; border-bottom: solid 1px #e5e7eb;}
  .pd-metadata-section .metadata-card h4 {font-size: 1.5rem; line-height: 1;}

  .pd-scope-services-section {padding: 6rem 1.5rem;}
  .pd-scope-services-section .pd-scope-services-list {margin: 0 0 2.5rem;}
  .pd-scope-services-section .pd-scope-services-list li .pd-scope-services-text {font-size: 1.25rem; line-height: 1.375;}
  .pd-scope-services-section p {font-size: 1rem; line-height: 1.625;}

  .pd-gallery-section {padding: 5rem 1.5rem;}

  .pd-gallery-section .pd-gallery-grid {grid-template-columns: repeat(1,minmax(0,1fr));}
  .pd-gallery-section .pd-gallery-grid .col-span-2 {grid-column: span 1 / span 1;}
  .navigation-section .navigation-cbwp-text {margin-top: 2.5rem;}

  .sub-hero-section h1 span.pl-10 {padding-left: 6vw;}
  .sub-hero-section p.full-width {padding: 0px;}
  .recent-project-section {padding: 0 1.5rem 4rem;}

  .story-section {padding: 6rem 1.5rem;}
  .story-section .story-title {font-size: 2.25rem; line-height: 1.25; margin: 0 0 2.5rem;}
  .story-section p {font-size: 1rem; line-height: 1.625;}

  .core-principles-section {padding: 5rem 1.5rem;}
  .core-principles-section .principles-title {font-size: 2.25rem; line-height: 1.25; margin: 0 0 2.5rem;}
  .core-principles-section p {font-size: 1rem; line-height: 1.625;}

  .core-principles-section .principles-card {padding: 1.5rem;}
  .core-principles-section .principles-card .principles-card-info h3 {font-size: 1.5rem; line-height: 1.25;}
  .core-principles-section .principles-card .principles-card-info p {font-size: .875rem; line-height: 1.625;}

  .timeline-section {padding: 6rem 1.5rem;}
  .timeline-section .timeline-title {font-size: 2.25rem; line-height: 1.25; margin: 0 0 2.5rem;}
  .timeline-section p {font-size: 1rem; line-height: 1.625;}

  .timeline-list .timeline-card {padding: 2rem 0;}
  .timeline-list .timeline-card .timeline-years {font-size: 1.875rem; line-height: 2.25rem;}
  .timeline-list .timeline-card h3 {font-size: 1.5rem; line-height: 1.25;}
  .timeline-list .timeline-card p {font-size: .875rem; line-height: 1.625;}

  .team-section {padding: 5rem 1.5rem;}
  .team-section .team-subtitle {margin-bottom: 1.5rem;}
  .team-section h2 {font-size: 2.25rem; line-height: 0.95;}
  .team-section .team-content p {font-size: 1rem; line-height: 1.625;}

  .what-practise-section {padding: 5rem 1.5rem;}
  .what-practise-section .practise-card .practise-content {padding: 1.5rem;}
  .what-practise-section .practise-card .practise-content h3 {font-size: 1.25rem; line-height: 1.25;}

  .accreditations-section {padding: 5rem 1.5rem;}
  .accreditations-section h2 {font-size: 2.25rem; line-height: 0.95; margin: 0 0 2.5rem;}
  .accreditations-section p {font-size: 1rem; line-height: 1.625;}

  .final-section .final-bg > div {flex: 0 0 100%;}

  .quick-links-section {padding: 0 1.5rem 3rem;}
  .quick-links-section .quick-card {padding: 1.25rem;}
  .quick-links-section .quick-card .quick-text {font-size: 1rem; line-height: 1.25;}

  .direct-message-section {padding: 0 1.5rem 6rem;}
  .direct-main {gap: 2rem; margin-bottom: 3rem;}
  .direct-main .direct-text {font-size: 1.125rem; line-height: 1.625;}
  .direct-main a.direct-big {font-size: 1.5rem; line-height: 2rem;}
  .direct-main a.direct-middle {font-size: 1.25rem; line-height: 1.75rem;}

  .form-main textarea.field {height: 145px;}
  .form-main .buttons p {margin: 0px;}

  .location-section {padding: 0 1.5rem 6rem;}
  .location-section .location-header {margin: 0 0 2rem;}
  .location-section .location-header .location-title {font-size: 2.25rem; line-height: 1.25;}
  .location-section .map-main iframe {aspect-ratio: 16/10;}

}


/* Screen Size 414px */
@media (max-width: 567px) {
  .small, small {font-size: .75rem;}

  .nav-overlay {padding: 7rem 2rem 2rem 2rem;}
  .nav-overlay ul li a {font-size: 3rem; letter-spacing: 0em; line-height: 1;}

  .logo-mobile img {width: 120px; padding: 10px;}
  
  .hero-content {height: auto;}
  .hero-content h1 {font-size: 16vw;}

  .services-section h2 span:nth-child(2) {padding-left: 18vw !important;}
  .accreditation-card .image img {max-width: 100px; max-height: 45px;}

  .story-section .story-title {line-height: 0.95;}
  .timeline-section .timeline-subtitle {flex-wrap: nowrap;}
  .what-practise-section .practise-header .practise-subtitle {flex-wrap: nowrap;}

  .form-main .buttons .button-text {flex: 0 0 100%;}

}