/* =====================
       Design Tokens
    ====================== */
    :root{
      --bg:#f2f1ec; 
      --ink:#0f1115; 
      --muted:#6b7280; 
      --border:#e5e7eb; 
      --card:#ffffff; 
      --chip:#e6e5e0; 
      --primary:#717171; 
      --primary-ink:#0000;
      --cta:#5b7cfa;
      --radius:16px;
      --shadow:0 6px 20px rgba(15,17,21,.06);
      --max:1200px;
    }

/* =====================
   Base & Typography
====================== */
    html,body{height:100%;}
    body{
      margin:0; background:var(--bg); color:var(--ink);
      font-family: system-ui, -apple-system, Segoe UI, Roboto, "Noto Sans", Ubuntu, Cantarell, "Helvetica Neue", Arial, "Apple Color Emoji", "Segoe UI Emoji";
      line-height:1.6;
      background: var(--bg);
    }
    a{color:inherit; text-decoration:none}
    img{max-width:100%; display:block}
    .container{max-width:var(--max); margin-inline:auto; padding-inline:16px}
    .visually-hidden{position:absolute!important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0}
    .accent {color: #c8c8c8;} 
    .section{padding:28px 0}
    .section h2 {
        font-size: clamp(31px, 6vw, 62px);
        margin: 0 0 10px;
        text-align: center;
        border-bottom: 3px solid #00000005;
    }
    .section-sub-heading {
        text-align: center;
        color: var(--muted);
        font-weight: 500;
        margin-bottom: 4px;
    }

/* =====================
   Header & Navigation (FIXED)
====================== */
header {
    position:sticky; 
    top:0; 
    z-index:50; 
    background: #000000; 
    color: #fff; 
    border-bottom: 1px solid var(--border);
}
.nav {
    height:91px; 
    display:flex; 
    align-items:center; 
    justify-content:space-between; 
    gap:12px;
}
.nav a:hover{color:var(--primary);}

/* Primary Navigation (Large Screens Default) */
.primary-nav { 
    display:flex; 
    align-items:center;
    flex-grow: 1; 
    justify-content: center;
}
.primary-nav ul { 
  display: flex; 
  gap: 20px; 
  list-style: none; 
  padding: 0; 
  margin: 0; 
}
.primary-nav a { 
  color: #fff; 
  font-weight: 500; 
  font-size: 0.95rem;
}

/* Header Actions/Buttons (Right Side) */
.actions {
    display: flex;
    gap: 8px; 
    align-items: center;
}

/* Hamburger Button (Hidden by default, shown in mobile @media) */
.hamburger { 
  display: none; 
  border: none; 
  background: transparent; 
  width: 52px; 
  height: 52px; 
  border-radius: 12px; 
  z-index: 10;
  cursor: pointer;
  color: #fff;
  padding: 0;
  transition: transform .2s ease;
}
.hamburger i{
  font-size: 22px;
  transition: transform .25s ease, color .25s ease;
  color: #fff;
}
.hamburger:hover i{ transform: scale(1.12); }
.hamburger[aria-expanded="true"] i{ transform: rotate(90deg) scale(1.05); }

/* Header Buttons Style */
.btn{
  color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    padding: .6rem 1rem;
    border-radius: 30px;
    border: 1px solid #fcfcfc;
    border-bottom: 2px solid;
    background: #000000;
    cursor: pointer;
    outline-offset: 4px;
    transition: transform .12s ease;
}
.btn--solid{
    background:var(--ink); 
    color:#fff;
    border: 1px solid;
}
.btn--primary{
    background:var(--primary); 
    color:#fff; 
    border-color:var(--primary);
    border-bottom: 5px solid #5a5858;
}

.btn:active{
    transform: translateY(2px);
}

/* =====================
   Loader
====================== */
#loader {
  position: fixed;
  top:0; left:0; right:0; bottom:0;
  background: #030303; 
  display:flex;
  justify-content:center;
  align-items:center;
  z-index: 9999;
}
#loader img {width:180px; height:auto;}
body.loaded #loader {
  opacity:0;
  visibility:hidden;
  transition:opacity .6s ease, visibility .6s;
}

/* =====================
   Mode Toggle
====================== */
.mode-toggle{
    display:flex; 
    gap:8px; 
    padding:8px;    
    border: 1px solid #18181814;
    border-radius: 999px;

}
.mode-toggle button{border:0;  padding:.45rem .8rem; border-radius:999px; cursor:pointer}
.mode-toggle button[aria-pressed="true"]{
    background:#fff; 
    background: #f1f0eb;
    border: 1px solid #18181814;
    box-shadow: var(--shadow);
}
@keyframes shadowPulse{
  0%,100%{ box-shadow:-1px 10px 22px rgba(0,0,0,.36); }
  25%    { box-shadow:-1px 8px 16px  rgba(0,0,0,.30); }
  50%    { box-shadow:-1px 12px 28px rgba(0,0,0,.40); }
  75%    { box-shadow:-1px 9px 20px  rgba(0,0,0,.32); }
}

/* =====================
   Hero Section
====================== */
.hero{padding:32px 0;}
.hero-grid{display: flex; grid-template-columns: 1.1fr .9fr; gap:28px; align-items:center}
.hero h1{font-size:clamp(28px, 4vw, 48px); line-height:1.15; margin:.25rem 0}
.lead{color:#2f3340; max-width:55ch}
.sec {width: 71%;}

.stats{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:12px; margin:18px 0}
.stat{
    background: #f2f1ec; 
    border:1px solid var(--border); 
    border-radius:12px;     
    padding: 10px 12px;
    text-align: center;
    box-shadow: -1px 10px 22px 0px rgba(0, 0, 0, 0.36);
    -webkit-box-shadow: -1px 4px 8px 0px rgba(0, 0, 0, 0.36);
    -moz-box-shadow: -1px 10px 22px 0px rgba(0,0,0,0.36);
}
.stat b{font-size:1.1rem}
.hero-img{ width: 100%;border-radius:20px; overflow:hidden; box-shadow:var(--shadow)}

/* Rotating Text */
.rotating{
  display:inline-flex;
  flex-direction:column;
  height:1.2em;            
  overflow:hidden;
  vertical-align:baseline;
}
.rotator{
  margin:0; padding:0; list-style:none;
  line-height:1.2;
  animation:textSlide 12s steps(6) infinite;
  will-change:transform;
  color: #959595;
}
.rotator li{ margin:0; padding:0; }
@keyframes textSlide{
  from{ transform:translateY(0); }
  to  { transform:translateY(-7.2em); }
}

/* =====================
   Brand strip
====================== */
.brands{padding:18px 0}
.brand-scroll-container {
  overflow: hidden;
  -webkit-mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
  mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
}

.brand-scroll-track {
  display: flex;
  gap: 12px;
  width: calc(2 * ( (180px + 12px) * 6 ));
  animation: scrollBrands 30s linear infinite;
}
@keyframes scrollBrands {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
.brand-chip {
    flex-shrink: 0;
    width: 180px;
    background: var(--chip);
    border: 1px solid var(--border);
    border-radius: 12px;
    height: 82px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #374151;
    font-weight: 600;
    font-size: 25px;
}

/* =====================
   Jobs Section
====================== */
/* Tabs */
.tabs {
  border-bottom: 2px solid #f0f0f0; 
  margin-bottom: 1.5rem;
  overflow-x: auto; 
  white-space: nowrap; 
  padding-bottom: 5px;
  overflow: hidden;
}
.tab {
    margin-bottom: -3px !important;
    padding: 0.75rem 1.25rem;
    font-size: 1rem;
    font-weight: 600;
    color: #555;
    background-color: transparent;
    border: none;
    border-bottom: 4px solid #7e0a0a00;
    cursor: pointer;
    transition: color 0.3s ease, border-color 0.3s ease;
    margin-bottom: -7px;
}
.tab:hover {
  color: #111; 
  border-bottom-color: #ccc; 
}
.tab[aria-selected="true"] {
  color: var(--primary); 
  border-bottom-color: var(--primary);
}

/* Video Slider (Owl Carousel) */
.video-section .item{opacity:.4; transition:.4s; transform:scale(.9); padding:0 10px}
.video-section .owl-item.active.center .item{opacity:1; transform:scale(1)}
.video-section video{width:100%; height:auto; display:block; border-radius:16px; box-shadow:var(--shadow)}
.video-section .owl-stage{align-items:center; display:flex}
.video-section .item{
  opacity:0.4;
  transition:.4s ease all;
  margin:0 20px;
  transform:scale(.8);
}
.video-section .active .item{
  opacity:1;
  transform:scale(1);
} 
.owl-nav {display: none;}

/* =====================
   How it works
====================== */
.how{display:grid; grid-template-columns: 1fr 1fr; gap:20px; align-items:center}
.how-media {
  border-radius: var(--radius, 16px);
  overflow: hidden;
  box-shadow: var(--shadow);
  line-height: 0; 
}
.how-media video {
   border-radius: var(--radius, 16px); 
}
.how-content-box {
  background: var(--card, #fff);
  border: 1px solid var(--border, #e5e7eb);
  border-radius: var(--radius, 16px);
  padding: 24px; 
  box-shadow: var(--shadow);
}
.how-content-box h4 {
  font-size: 1.75rem; 
  font-weight: 700;
  margin-top: 0;
  margin-bottom: 12px;
}
.how-content-box p {
  color: var(--ink); 
  margin-bottom: 20px;
  line-height: 1.6;
}
.icon-list {
  list-style: none;
  padding: 0;
  margin: 0 0 16px 0; 
}
.icon-list li {
  display: flex;
  align-items: flex-start;
  gap: 12px; 
  margin-bottom: 12px; 
  color: var(--ink);
  font-size: 0.95rem;
}
.icon-list li:last-child {
  margin-bottom: 0;
}
.icon-list svg {
  flex-shrink: 0; 
  margin-top: 2px;
  color: var(--primary); 
}

/* =====================
   Forms (Contact/Hiring)
====================== */
/* Dark Theme Form (Index & Hiring) */
.form-container {
    width: 100%;
    max-width: 58%;
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.1);
    padding: 3rem;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);
}
.form-input,
.form-textarea {
    width: 100%;
    padding: 10px 0;
    font-size: 1rem;
    color: #ffffff; 
    background: transparent;
    border: none;
    border-bottom: 2px solid #555; 
    outline: none;
    position: relative;
    z-index: 1; 
}
.form-textarea {resize: none; min-height: 80px;}
.form-label {
    position: absolute;
    top: 10px;
    left: 0;
    font-size: 1rem;
    color: #aaa; 
    pointer-events: none;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    z-index: 0;
}
.form-input:focus + .form-label, .form-input:valid + .form-label,
.form-textarea:focus + .form-label, .form-textarea:valid + .form-label {
    transform: translateY(-24px);
    font-size: 0.85rem;
    color: #fff; 
}
.underline {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 2px;
    width: 100%;
    background: #000000;
    transform: scaleX(0); 
    transform-origin: left; 
    transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    z-index: 2;
}
.form-input:focus ~ .underline, .form-textarea:focus ~ .underline {
    transform: scaleX(1);
}
.submit-btn {
    width: 100%;
    padding: 1rem;
    background: #000;
    color: #fff;
    border: 1px solid #000;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
}
.submit-btn:hover {background: #333;}
.form-group {position: relative; margin-bottom: 2.5rem;}
h2#jjdhd {text-align: center; font-size: xxx-large;}

/* Contact Us Page Form (Light Theme Overrides) */
.contact-form-wrapper .form-container {background: transparent; border: none; box-shadow: none; padding: 0;}
.contact-form-wrapper .form-input, .contact-form-wrapper .form-textarea {color: #000000; border-bottom: 2px solid #ccc;}
.contact-form-wrapper .form-label {color: #777;}
.contact-form-wrapper .form-input:focus + .form-label, .contact-form-wrapper .form-input:valid + .form-label,
.contact-form-wrapper .form-textarea:focus + .form-label, .contact-form-wrapper .form-textarea:valid + .form-label {color: #000;}
.contact-form-wrapper .underline {background: #000000;}

/* =====================
   CTA Banner
====================== */
.cta {
    text-align: center;
    background: #656565;
    color: #fff;
    border-radius: 3px;
    padding: 32px;
    box-shadow: var(--shadow);
    border-right: 10px solid #828282;
    border-bottom: 12px solid #595959;
}
.cta h3{font-size:clamp(22px,3vw,32px); margin:0 0 12px}
.cta .row{    text-align: center; gap:10px; flex-wrap:wrap}
.cta .btn{border-color:#fff}

/* =====================
   Footer
====================== */
footer {
    margin-top: 28px;
    color: #e5e7eb;
    padding: 40px 0;
    background: radial-gradient(120% 80% at 50% 120%, rgba(255, 255, 255, .06), rgba(255, 255, 255, 0) 58%), radial-gradient(80% 60% at 50% -20%, rgba(0, 0, 0, .45), rgba(0, 0, 0, 0) 60%), linear-gradient(to top, #0d0e10 0%, #16171c 45%, #1c1e24 100%);
    background-blend-mode: overlay, multiply, normal;
    border-top: 1px solid rgba(255, 255, 255, .07);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), inset 0 -18px 36px rgb(0 0 0 / 12%), 0 -10px 30px rgb(0 0 0 / 25%);
}
.foot{padding:0}
.foot-grid{display:grid; grid-template-columns:repeat(4, 1fr); gap:16px; padding-bottom: 30px;}
.foot h4{color: #ffffff; margin:0 0 8px;}
.foot ul{list-style:none; padding:0; margin:0}
.foot li{margin:.35rem 0}
.foot-grid a {color: #aaa; text-decoration: none; transition: color 0.3s ease;}
.foot-grid a:hover {color: #ffffff;}
.footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 20px;
    border-top: 1px solid #444;
    flex-wrap: wrap;
    gap: 15px;
}
.legal{margin:0; opacity: .7;}
.social-media {display: flex; gap: 18px; margin-left: 7%;}
.social-media a {color: #aaa; font-size: 1.2rem; text-decoration: none; transition: all 0.3s ease;}
.social-media a:hover {color: #ffffff; transform: translateY(-3px);}
@keyframes subtle-jiggle {
    0%, 100% {transform: scale(1);}
    50% {transform: scale(1.2);}
}
.social-media a i {display: inline-block;}
.social-media a:nth-child(1) i { animation-delay: 4.0s; }
.social-media a:nth-child(2) i { animation-delay: 4.3s; }
.social-media a:nth-child(3) i { animation-delay: 4.6s; }
.social-media a:nth-child(4) i { animation-delay: 4.9s; }

.mobile-mini-footer {position: fixed; left: 0; right: 0; bottom: 0; background: #000; border-top: 1px solid rgba(255,255,255,.18); z-index: 100; padding: 10px 0; display: none;}
.mobile-mini-footer .row {display: flex; gap: 8px;}
.mobile-mini-footer .btn {flex: 1; color: #fff; border-color: rgba(255,255,255,.35);}
.has-mobile-footer #main {padding-bottom: 74px;}

/* =====================
   Projects Page
====================== */
main.main-dark-bg {background: #000000;}
.main-dark-bg .section h2 {color: #FFFFFF; border-bottom: none;}
.main-dark-bg .section .section-sub-heading {color: #a0a0a0;}
.projects-grid {display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 25px;}
.project-card {position: relative; aspect-ratio: 9 / 12; border-radius: 12px; overflow: hidden; cursor: pointer; background: #222;}
.project-thumbnail img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform 0.6s cubic-bezier(0.25, 0.8, 0.25, 1);
}
.project-overlay {
  position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: space-between; padding: 20px;
  background: linear-gradient(0deg, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.2) 40%, rgba(0,0,0,0.2) 100%);
  opacity: 0; transition: opacity 0.5s ease;
}
/* ... Project Card Hover Styles ... */
.project-card:hover .project-thumbnail img {transform: scale(1.1);}
.project-card:hover .project-overlay {opacity: 1;}
/* ... Modal Styles ... */
.modal-close-btn {top: -40px; right: 0; font-size: 2.5rem;}


/* =====================
   About Us Page
====================== */
.ceo-section {background: #000000; color: #FFFFFF; padding: 80px 0; overflow: hidden;}
.ceo-container {position: relative; max-width: 900px; text-align: center; z-index: 2;}
.ceo-section h2 {font-size: clamp(2.5rem, 5vw, 3.5rem); font-weight: 800; margin-bottom: 24px; color: #FFFFFF; border-bottom: none;}
.highlight-yellow {color: #f8db4a;}
.ceo-stats {display: grid; grid-template-columns: 1fr 1fr; gap: 20px 10px; max-width: 600px; margin: 40px auto;}
.ceo-img {
 position: absolute; z-index: 1; border-radius: 50%; object-fit: cover; box-shadow: 0 0 15px rgba(255, 255, 255, 0.1);
 border: 2px solid rgba(255, 255, 255, 0.2); width: var(--size, 80px); height: var(--size, 80px); top: var(--top); left: var(--left);
 opacity: 0; animation: fadeInCEO 1s ease-out forwards, float1 8s ease-in-out 1s infinite; transition: transform 0.3s ease, box-shadow 0.3s ease;
}
/* ... CEO Image Animation Delays ... */
@keyframes fadeInCEO {from {opacity: 0; transform: scale(0.5);} to {opacity: 1; transform: scale(1);}}
@keyframes float1 {0% { transform: scale(1) translate(0, 0); } 50% { transform: scale(1) translate(8px, 4px); } 100% { transform: scale(1) translate(0, 0); }}
@keyframes float2 {0% { transform: scale(1) translate(0, 0); } 50% { transform: scale(1) translate(-4px, 6px); } 100% { transform: scale(1) translate(0, 0); }}
@keyframes float3 {0% { transform: scale(1) translate(0, 0); } 50% { transform: scale(1) translate(5px, -5px); } 100% { transform: scale(1) translate(0, 0); }}

/* =====================
   Contact Us Page
====================== */
.contact-grid {display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: flex-start;}
.contact-info-wrapper {background: var(--card, #fff); border: 1px solid var(--border, #e5e7eb); border-radius: var(--radius, 16px); padding: 24px; box-shadow: var(--shadow);}
.contact-details-list {list-style: none; padding: 0; margin: 0;}

/* Hiring page video background */
.hiring-page {position: relative; min-height: 100vh; background: #000; color: #fff; overflow: hidden;}
.hiring-page .page-wrap {position: relative; z-index: 2;}
.bg-video {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; opacity: .38; filter: saturate(1.1) contrast(1.05) brightness(.85);}
.bg-overlay {position: absolute; inset: 0; z-index: 1; pointer-events: none; background: radial-gradient(120% 80% at 50% 120%, rgba(255,255,255,.06), rgba(255,255,255,0) 58%), linear-gradient(to top, rgba(0,0,0,.85), rgba(0,0,0,.45));}
.hiring-hero {text-align: center; padding: 40px 16px; animation: fadeInScale .7s ease both;}
.hiring-hero h2 {color: #fff;}
.hiring-hero .accent {color: #f8db4a; animation: glowAccent 2.8s ease-in-out infinite;}
.fade-in-up {opacity: 0; transform: translateY(18px); animation: fadeUp .8s ease .15s forwards;}
@keyframes fadeUp {from {opacity: 0; transform: translateY(18px);} to {opacity: 1; transform: translateY(0);}}
@keyframes fadeInScale {from {opacity: 0; transform: scale(.98);} to {opacity: 1; transform: scale(1);}}
@keyframes glowAccent {0% {text-shadow: 0 0 0 rgba(248,219,74,0);} 50% {text-shadow: 0 0 14px rgba(248,219,74,.45);} 100% {text-shadow: 0 0 0 rgba(248,219,74,0);}}
.form-container.glass-form {backdrop-filter: blur(6px); background: rgba(255,255,255,.02); border-color: rgba(255,255,255,.12); box-shadow: 0 18px 48px rgba(0,0,0,.5);}
.form-container.glass-form .form-input, .form-container.glass-form .form-textarea {color: #fff; border-bottom-color: #666;}
.form-container.glass-form .form-label {color: #aaa;}
.form-container.glass-form .submit-btn {background: #111; border-color: #111;}
.form-container.glass-form .submit-btn:hover {background: #222;}


/* =====================
   Responsive (CONSOLIDATED & FIXED)
====================== */
@media (max-width: 1100px){
  .brand-scroll-track {width: calc(2 * ( (150px + 12px) * 6 ));} 
  .brand-chip {width: 150px;}
}
@media (max-width: 900px){
  .video-section .item{padding:0 !important; margin:0 !important}
  .video-section video{width:calc(100vw + 15px); max-width:none; margin-left:-7.5px}
  /* === Header Fix === */
  .hamburger { 
    display: inline-flex; 
    align-items: center; 
    justify-content: center; 
  }
  .primary-nav { 
    position: absolute; 
    inset-inline-start: 0; 
    inset-block-start: 64px; 
    background: #000000; 
    border-top: 1px solid #333; 
    width: 100%; 
    opacity: 0; 
    pointer-events: none; 
    transition: opacity .2s ease, transform .2s ease; 
    transform: translateY(-10px);
    box-shadow: 0 10px 20px rgba(0,0,0,.3);
    display: block; 
  }
  .actions {
    display: none !important;
  }
  .primary-nav.open { 
    opacity: 1; 
    pointer-events: auto; 
    transform: translateY(0);
    margin-top: 14px;
  }
  .primary-nav ul { 
    flex-direction: column; 
    gap: 0; 
  }
  .primary-nav li a { 
    display: block; 
    padding: 14px 16px; 
    border-bottom: 1px solid #333; 
    color: #fff; 
    font-weight: 500;
  }
  .primary-nav li:last-child a {border-bottom: none;}

  /* === Layout Adjustments === */
  .hero-grid{grid-template-columns:1fr; flex-direction: column-reverse; gap: 40px;} 
  .how{grid-template-columns:1fr; flex-direction: column; gap: 40px;} 
  .hero .sec {width: 100%;}
  .hero-img {max-width: 500px; margin: 0 auto;} 
  .stats{grid-template-columns:repeat(2, minmax(0,1fr))} 
  .brand-scroll-track {width: calc(2 * ( (120px + 12px) * 6 ));} 
  .brand-chip {width: 120px; font-size: 1rem; height: 50px;} 
  .foot-grid{grid-template-columns:repeat(2, 1fr); gap:30px} 
  .form-container {max-width: 85%; padding: 2.5rem;} 
  .contact-grid {grid-template-columns: 1fr; gap: 30px;} 
  .ceo-stats {grid-template-columns: 1fr; gap: 15px;}
  .ceo-section h2 {font-size: 2rem;}
  .ceo-img {width: calc(var(--size) * 0.7); height: calc(var(--size) * 0.7);}
}
@media (max-width: 640px){
  /* === Small Mobile Adjustments === */
  .container {padding-inline: 12px;}
  .section {padding: 20px 0;}
  .stats {grid-template-columns: 1fr;} 
  /* .cta .row {flex-direction: column;}*/
  .cta .btn {width: auto; text-align: center;}
  .foot {text-align: center;}
  .foot-grid {grid-template-columns: 1fr; gap: 25px;} 
  .foot-grid > div {text-align: center;}
  .social-media {justify-content: center; margin-left: 0;}
  .foot-grid a {font-size: calc(1rem + 4px);}
  .foot h4 {font-size: calc(1rem + 4px);}
  .legal {font-size: calc(1rem + 4px); text-align: center;}
  .projects-grid {grid-template-columns: 1fr;} 
  .form-container {max-width: 95%; padding: 2rem 1.5rem;}
  .modal-close-btn {top: -35px; right: 5px;}
  .mobile-mini-footer {display: block;}
}
@media (prefers-reduced-motion: reduce){
  * {animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important;}
  .rotator{ animation:none; }
  .brand-scroll-track {animation: none;}
  .ceo-img {animation: fadeInCEO 1s ease-out forwards;} 
}
@media (max-width: 768px) {
  .foot-grid > div:first-child img {
    display: block;
    margin: 0 auto;
  }
}