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

:root{
  --primary-color:#e55a2a;
  --accent-color:#ff8149;
  --text-color:#0b1220;
  --muted:#475467;
  --light:#ffffff;
  --bg:#ffffff;

  --glass-bg: rgba(255,255,255,.70);
  --glass-brd: rgba(255,255,255,.35);

  --radius-s:12px;
  --radius-m:18px;
  --radius-l:22px;

  --shadow-s:0 6px 16px rgba(0,0,0,.08);
  --shadow-m:0 12px 32px rgba(0,0,0,.12);
  --shadow-l:0 22px 60px rgba(229,90,42,.28);

  --page-gutter: clamp(16px, 4vw, 48px);
  --section-vspace: clamp(32px, 6vw, 72px);

  --t-fast:.25s ease;
  --t-med:.35s cubic-bezier(.2,.8,.2,1);

  font-family:'Poppins',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}

html{ scroll-behavior:smooth }
body{
  background:var(--bg);
  color:var(--text-color);
  line-height:1.6;
  font-size:16px;
  overflow-x:hidden;
}
a{ color:inherit; text-decoration:none }
.container{ width:90%; max-width:1200px; margin:0 auto }

.header-content {
  position: relative;
  z-index: 2147483647;
  background: url("assets/images/aboutus/about_background.jpg") no-repeat center center;
  background-size: cover;
  color: #fff;
  overflow: hidden;
}

.header-content::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.55);
  z-index: 0;
}

.header-content > * {
  position: relative;
  z-index: 1;
}

.header-content,
.header-content h1,.header-content h2,.header-content h3,
.header-content p,.header-content li,.header-content a,
.header-content .count{color:#fff}

.top-bar{
  background-color: transparent;
  font-size:.875rem;
  padding:.5rem 0;
}
.top-container{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap: wrap;
  gap: 0.5rem;
}

@media (max-width: 768px) {
  .top-bar {
    font-size: 0.8rem;
  }
  
  .top-container {
    justify-content: center;
    gap: 1rem;
  }
  
  .call-info {
    order: 1;
    flex: 1 1 100%;
    text-align: center;
  }
  
  .social-icons {
    order: 2;
  }
  
  .quote-btn {
    order: 3;
  }
}

.top-bar .call-info a{color:var(--accent-color)}
.social-icons a img {
  width: 20px;
  height: 20px;
  display: inline-block;
  filter: brightness(0) saturate(100%) invert(56%) sepia(81%) saturate(459%) hue-rotate(356deg) brightness(95%) contrast(95%);
  transition: filter var(--t-fast), transform var(--t-fast);
}

.social-icons a:hover img {
  filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(0%) hue-rotate(315deg) brightness(103%) contrast(103%);
  transform: scale(1.1);
}

@media (max-width: 480px) {
  .social-icons {
    display: flex;
    gap: 0.5rem;
  }
  
  .social-icons a img {
    width: 18px;
    height: 18px;
  }
}

.quote-btn{
  background:var(--primary-color);
  color:#fff;
  padding:.45rem 1rem;
  border-radius:8px;
  font-weight:600;
  transition:filter var(--t-fast),transform var(--t-fast);
  white-space: nowrap;
}
.quote-btn:hover{filter:brightness(1.05);transform:translateY(-1px)}

@media (max-width: 640px) {
  .quote-btn {
    padding: 0.4rem 0.8rem;
    font-size: 0.85rem;
  }
}

.nav-bar{
  margin:12px 4rem 0;
  padding:.75rem 1rem;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.22);
  border-radius:16px;
  backdrop-filter:blur(18px) saturate(160%);
  -webkit-backdrop-filter:blur(18px) saturate(160%);
  box-shadow:0 8px 24px rgba(0,0,0,.12);
  position: relative;
  z-index: 9998;
}

.menu-toggle {
  display: none;
  flex-direction: column;
  gap: 5px;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 8px;
  z-index: 10000;
  transition: transform 0.3s ease;
  position: relative;
}

.menu-toggle span {
  width: 25px;
  height: 3px;
  background: #fff;
  border-radius: 3px;
  transition: all 0.3s ease;
  transform-origin: center;
}

.menu-toggle.active span:nth-child(1) {
  transform: translateY(8px) rotate(45deg);
}

.menu-toggle.active span:nth-child(2) {
  opacity: 0;
  transform: translateX(-20px);
}

.menu-toggle.active span:nth-child(3) {
  transform: translateY(-8px) rotate(-45deg);
}

.nav-container{
  display:flex;
  align-items:center;
  justify-content:center;
}

nav .menu{
  list-style:none;
  display:flex;
  gap:1.4rem;
  flex-wrap:wrap;
  justify-content:center;
}

.menu li a{
  color:#fff;
  font-weight:500;
  letter-spacing:.2px;
  position:relative;
  transition:color var(--t-fast);
}

.menu li a::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-6px;
  height:2px;
  background:linear-gradient(90deg,var(--primary-color),var(--accent-color));
  transform:scaleX(0);
  transform-origin:left;
  transition:transform var(--t-med);
}

.menu li a:hover{color:#fff}
.menu li a:hover::after{transform:scaleX(1)}

@media (max-width: 768px) {
  .nav-bar{
    position: relative;
    margin: 10px 1rem 0;
    padding: 0.6rem 0.8rem;
    z-index: 2147483647;
    isolation: isolate;
  }

  .menu-toggle{ display: flex; margin-left: auto; align-self: flex-end; }
  .nav-container{ flex-direction: row; align-items: center; justify-content: flex-end; width: 100%; }
  nav{ width: auto; position: static; }

  nav .menu{
    box-sizing: border-box;
    position: absolute;
    top: 100%;
    left: 8px;
    right: 8px;
    margin-top: 10px;
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 6px 0;
    border-radius: 22px;
    border: 1px solid rgba(255,255,255,.38);
    background:
      linear-gradient(135deg,
        rgba(58,183,149,.28) 0%,
        rgba(242,201,76,.30) 55%,
        rgba(168,224,235,.28) 100%),
      rgba(17,25,40,.60);
    -webkit-backdrop-filter: blur(16px) saturate(160%);
    backdrop-filter: blur(16px) saturate(160%);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.35),
      0 6px 20px rgba(0,0,0,.18);
    max-height: 0;
    opacity: 0;
    transform: translateY(-8px);
    transition: max-height .4s ease, opacity .28s ease, transform .28s ease;
    overflow: hidden;
    overflow-x: hidden;
    pointer-events: none;
    visibility: hidden;
    max-width: calc(100vw - 16px);
    z-index: 2147483647;
  }

  nav .menu.active{
    max-height: 70vh;
    opacity: 1;
    transform: translateY(0);
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    touch-action: pan-y;
    pointer-events: auto;
    visibility: visible;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    background:
      linear-gradient(135deg,
        rgba(58,183,149,.42) 0%,
        rgba(242,201,76,.46) 55%,
        rgba(168,224,235,.42) 100%),
      rgba(17,25,40,.82);
  }
 
  nav .menu::before{
    content: "";
    position: absolute; inset: 0;
    border-radius: inherit; pointer-events: none;
    background:
      radial-gradient(120% 60% at 0% 0%, rgba(255,255,255,.22) 0%, rgba(255,255,255,0) 60%),
      linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0));
    mix-blend-mode: screen;
  }

  nav .menu.is-dragging{ cursor: grabbing; user-select: none; }
  nav .menu li{ width: 100%; border-bottom: 1px solid rgba(255,255,255,.18); }
  nav .menu li:last-child{ border-bottom: none; }
  nav .menu li a{
    display: block;
    padding: 14px 18px;
    width: 100%;
    color: #fff;
    text-shadow: 0 1px 1px rgba(0,0,0,.25);
    cursor: pointer;
    transition: background .2s ease, padding-left .25s ease;
  }
  nav .menu li a:hover{ background: rgba(229,90,42,.22); padding-left: 28px; }
  nav .menu li a::after{ display: none; }

  .nav-container { display: flex; }
  .menu-toggle { margin-left: auto !important; }
  nav .menu li a { text-align: center !important; }

  html.is-nav-open #whatsappBtn {
    z-index: 2147483640 !important;
    pointer-events: none;
  }
}

html.is-nav-open, body.is-nav-open {
  overflow: hidden !important;
  max-width: 100%;
}

.hero.hero--split{
  position: relative;
  color: #fff;
  padding: clamp(3rem, 6vw, 6rem) 0;
  background: transparent; 
  overflow: hidden;
}

.hero-split{
  display: grid;
  grid-template-columns: 1fr;
  align-items: center;
  justify-items: center;
  gap: clamp(2rem, 4vw, 3rem);
  position: relative;
  text-align: center;
}

.hero-copy{ position:relative; z-index:2; margin-right:0 }
.tagline{
  font-size: 1.15rem; font-weight: 700; color: var(--accent-color);
  letter-spacing: .3px; text-transform: uppercase;
}

.hero-title{
  color:#fff;
  font-size:clamp(2rem,4.2vw,3.2rem);
  font-weight:900;
  line-height:1.14;
  letter-spacing:.2px;
  margin-top:.5rem;
  max-width:none;
  text-wrap:balance;
  text-shadow:0 6px 22px rgba(0,0,0,.38), 0 2px 8px rgba(0,0,0,.28);
  position:relative;
}

.hero-title::after{
  content:"";
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  bottom:-12px;
  width:min(240px,48%);
  height:4px;
  border-radius:4px;
  background:linear-gradient(90deg,var(--primary-color),var(--accent-color));
  box-shadow:0 8px 20px rgba(229,90,42,.30);
}

.hero-desc{
  font-size:1.02rem;
  line-height:1.75;
  margin:1rem auto 1.8rem;
  max-width:90ch;
  color:rgba(255,255,255,.92);
  text-align:justify;             
  text-justify:inter-word;
  letter-spacing:.14px;
}

.btn{
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.85rem 1.8rem; border-radius:12px; font-weight:700; font-size:.95rem;
  text-transform:uppercase; letter-spacing:.5px; cursor:pointer; transition:all .3s ease;
}
.btn.btn--sm{ padding:.5rem .8rem; font-size:.85rem; border-radius:10px }
.ai-btn{
  background:linear-gradient(135deg,var(--primary-color),var(--accent-color));
  color:#fff; box-shadow:0 6px 18px rgba(0,0,0,.3);
}
.ai-btn:hover{ transform:translateY(-3px) scale(1.03); box-shadow:0 10px 25px rgba(0,0,0,.4) }
.brochure-btn{
  background:rgba(255,255,255,.15);
  backdrop-filter:blur(8px);
  border:2px solid rgba(255,255,255,.4);
  color:#fff;
}
.brochure-btn:hover{ background:rgba(255,255,255,.25); transform:translateY(-3px) scale(1.03) }

.section-block{
  margin: 12px 4rem 0;
  padding: clamp(32px,6vw,72px) 0;
}
.section-title{ font-size: 2rem; font-weight: 800; margin-bottom: 1.5rem; }

@media (max-width: 768px){
  .section-block{
    margin: 12px 1rem 0;
    padding: clamp(24px, 6vw, 48px) 0;
  }
}

.story-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(1.25rem, 3vw, 2.5rem);
  align-items: stretch;
  margin: 0;
  width: 100%;
}

.story-block .story-text p {
  text-align: justify;
  text-justify: inter-word;
}

.story-block .story-grid figure{
  margin: 0;
  width: 100%;
  height: 100%;
  border: 0; box-shadow: none; border-radius: 0; overflow: hidden;
}
.story-block .story-grid figure img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
}

@media (max-width: 900px){
  .story-grid{ grid-template-columns: 1fr; align-items: start; }
  .story-block .story-grid figure{ height: clamp(240px, 36vh, 420px); }
  .story-block .story-grid figure img{ height: 100%; }
}

.vm-grid{ display:grid; grid-template-columns:1fr 1fr; gap: clamp(1.25rem, 3vw, 2.5rem); margin:0; width:100%; }

.vm-card{
  background:#fff; border-radius:16px; box-shadow:0 8px 24px rgba(0,0,0,.12);
  padding:1.5rem; text-align:center; transition:.3s;
}
.vm-card:hover{ transform: translateY(-5px); }
.vm-card img{
  width:100%; border-radius:12px; margin-bottom:1rem;
  height: clamp(180px, 26vw, 220px); object-fit:cover;
}
@media (max-width: 900px){ .vm-grid{ grid-template-columns: 1fr; } }

.values-circle{ display:flex; flex-wrap:wrap; gap: clamp(14px, 2.6vw, 22px); justify-content:center; margin:0; }

.value{
  width:180px; height:220px; background:linear-gradient(135deg,#f97316,#f59e0b);
  border-radius:16px; color:#fff; padding:1rem; text-align:center;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  box-shadow:0 6px 20px rgba(0,0,0,.2); scroll-snap-align: start;
}
.value img{ width:48px; margin-bottom:.5rem; }

@media (max-width: 700px){
  .values-circle{
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    gap: 1rem;
    padding: 0 1rem .5rem 1rem;
    padding-left: calc(1rem + 16px); 
    scroll-snap-type: x proximity;
    scroll-padding-inline: 1rem;
    overscroll-behavior-x: contain;
    -webkit-mask-image: linear-gradient(to right, transparent 0, #000 16px, #000 calc(100% - 16px), transparent 100%);
            mask-image: linear-gradient(to right, transparent 0, #000 16px, #000 calc(100% - 16px), transparent 100%);
  }
  .value{
    flex: 0 0 180px;
    scroll-snap-align: center;
    scroll-snap-stop: always;
  }

.value:first-child {
    margin-left: 250px;
  }
  .values-circle::-webkit-scrollbar{ height: 0 }
}

.brand-marquee{
  --card-h: clamp(72px, 9vw, 96px);
  --card-w: clamp(160px, 16vw, 220px);
  --gap: clamp(14px, 2.6vw, 24px);
  position: relative; overflow: hidden;
  margin-top: 1.25rem;
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 40px, #000 calc(100% - 40px), transparent 100%);
          mask-image: linear-gradient(to right, transparent 0, #000 40px, #000 calc(100% - 40px), transparent 100%);
}
.brand-marquee + .brand-marquee{ margin-top: clamp(10px, 1.6vw, 16px); }

.brand-track{ display: flex; gap: var(--gap); align-items: center; will-change: transform; }
.brand-card{
  flex: 0 0 var(--card-w); height: var(--card-h);
  display:flex; align-items:center; justify-content:center;
  background:#fff; border:1px solid #eef2f7; border-radius:14px;
  padding: clamp(8px, 1.2vw, 14px); box-sizing:border-box;
}
.brand-card img{
  max-width: 100%; max-height: 70%; width: auto; height: auto; object-fit: contain; display: block;
  image-rendering: -webkit-optimize-contrast; filter: grayscale(100%) contrast(1.05);
  transform: scale(var(--logoScale, 1)); transform-origin: center;
}
.brand-card img[data-scale="1.05"]{ --logoScale: 1.05 }
.brand-card img[data-scale="1.1"] { --logoScale: 1.1 }
.brand-card img[data-scale="1.15"]{ --logoScale: 1.15 }
.brand-card img[data-scale="1.2"] { --logoScale: 1.2 }
.brand-card:hover img{ filter: grayscale(0%) contrast(1); transform: scale(var(--logoScale, 1)) translateY(-1px); }
@media (max-width: 420px){ .brand-marquee{ --card-w: clamp(140px, 44vw, 180px); } }
@media (prefers-reduced-motion: reduce){ .brand-marquee{ -webkit-mask-image: none; mask-image: none; } }

.timeline{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: clamp(1.1rem, 2.4vw, 1.75rem);
  padding: 0;
  overflow: visible;
}

.year{
  background:#fff; border-radius:16px; box-shadow:0 6px 18px rgba(0,0,0,.1);
  padding:1rem; text-align:center;
}
.year img{
  width:100%; aspect-ratio: 4 / 3; object-fit:cover;
  border-radius:12px; margin-bottom:.5rem;
}
.year span{ display:block; font-weight:800; font-size:1.1rem; margin:.5rem 0; color:#f97316; }

@media (max-width: 760px){
  .timeline{
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: min(80%, 19rem);
    overflow-x: auto;
    overflow-y: hidden;
    gap: 1rem;
    padding: 0 1rem .5rem;
    scroll-snap-type: x proximity;
    scroll-padding-inline: 1rem;
    overscroll-behavior-x: contain;
    -webkit-mask-image: linear-gradient(to right, transparent 0, #000 16px, #000 calc(100% - 16px), transparent 100%);
            mask-image: linear-gradient(to right, transparent 0, #000 16px, #000 calc(100% - 16px), transparent 100%);
  }
  .year{
    scroll-snap-align: center;
    scroll-snap-stop: always;
  }
  .timeline::-webkit-scrollbar{ height: 0 }
}

#vision-mission .section-title,
#vision-mission > p { 
  text-align: center; 
  margin-left: auto; 
  margin-right: auto; 
}

.values .section-title,
.values > p {
  text-align: center; 
  margin-left: auto; 
  margin-right: auto;
}

.brands .section-title,
.brands > p {
  text-align: center; 
  margin-left: auto; 
  margin-right: auto;
}

#team.section-block.team-split{
  position:relative;
  isolation:isolate;
  margin:clamp(1rem,2vw,1.6rem) var(--page-gutter) clamp(1.8rem,3vw,2.6rem);
  display:grid;
  grid-template-columns:1fr 1.15fr;
  gap:clamp(1.2rem,3vw,2rem);
  align-items:stretch;
}
@media (max-width:900px){
  #team.section-block.team-split{
    grid-template-columns:1fr;
    margin-inline: var(--page-gutter);
  }
}

#team.section-block.team-split::before{
  content:"";
  position:absolute; inset:-6% -4% auto -4%; height:62%;
  background:
    radial-gradient(700px 260px at 8% 0%, rgba(229,90,42,.22), transparent 60%),
    radial-gradient(680px 240px at 92% 10%, rgba(255,129,73,.18), transparent 60%);
  filter:blur(8px);
  z-index:-1; pointer-events:none;
}

#team .team-carousel{
  align-self:stretch;
  height:100%;
  position:relative;
  display:flex; flex-direction:column;
  overflow:hidden;
  border-radius:24px;
  background:#fff;
  box-shadow:0 24px 68px rgba(0,0,0,.14);
  border:1px solid #eceff3;
}

#team .team-carousel::before{
  content:""; position:absolute; inset:0; pointer-events:none; border-radius:inherit;
  background:
    radial-gradient(1200px 520px at -10% -10%, rgba(255,255,255,.35), transparent 55%),
    radial-gradient(900px 380px at 110% -10%, rgba(255,255,255,.22), transparent 60%);
}
#team .team-carousel::after{
  content:""; position:absolute; inset:0; border-radius:inherit; padding:1px; pointer-events:none;
  background:linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,.08));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
}

#team .tc-viewport{ flex:1 1 auto; width:100%; height:100%; overflow:hidden }

#team .tc-track{
  display:flex; height:100%; gap:0; padding:0;
  transition:transform .6s cubic-bezier(.2,.8,.2,1);
  will-change:transform;
}

#team .tc-track img{
  flex:0 0 100%;
  width:100%; height:100%;
  object-fit:cover; object-position:center;
  display:block;
  border-radius:inherit;
  user-select:none; -webkit-user-drag:none;
  transform:translateZ(0);
  transition:transform .35s ease, filter .35s ease, box-shadow .35s ease;
}
#team .tc-track img:hover{
  transform:scale(1.015);
  filter:saturate(1.04);
  box-shadow:0 18px 48px rgba(0,0,0,.18) inset;
}

#team .team-copy{
  background:linear-gradient(180deg, rgba(18,18,20,.92), rgba(16,16,18,.86));
  border:1px solid rgba(255,255,255,.14);
  border-radius:22px;
  padding:clamp(1rem,2.2vw,1.6rem);
  color:#fff;
  box-shadow:inset 0 0 40px rgba(255,255,255,.04), 0 18px 48px rgba(0,0,0,.35);
  position:relative; overflow:hidden;
}
#team .team-copy::before{
  content:""; position:absolute; left:0; right:0; top:0; height:3px;
  background:linear-gradient(90deg, #ff8149, #e55a2a);
  box-shadow:0 10px 24px rgba(229,90,42,.35);
}
#team .team-copy .section-title{
  color:#fff !important; letter-spacing:.3px; margin-bottom:.5rem;
  text-shadow:0 2px 10px rgba(0,0,0,.35);
}
#team .team-copy .lead{
  margin:.6rem 0 1rem; color:rgba(255,255,255,.92);
  font-size:1.02rem; line-height:1.75;
}
#team .team-copy .bullets{ list-style:none; margin:.4rem 0 0; padding:0; display:grid; gap:.55rem }
#team .team-copy .bullets li{
  position:relative; padding-left:1.35rem; color:rgba(255,255,255,.95);
}
#team .team-copy .bullets li::before{
  content:""; position:absolute; left:0; top:.45em; width:10px; height:10px; border-radius:50%;
  background:linear-gradient(135deg, #ff8149, #e55a2a);
  box-shadow:0 0 0 3px rgba(229,90,42,.18), 0 6px 14px rgba(229,90,42,.32);
}

#team .tc-btn{
  display: grid !important;
  place-items: center;
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 32px; height: 32px; border-radius: 10px; font-size: 16px;
  background: linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.06));
  border: 1px solid rgba(255,255,255,.28);
  backdrop-filter: blur(10px) saturate(140%);
  -webkit-backdrop-filter: blur(10px) saturate(140%);
  color: #fff;
  text-shadow: 0 2px 8px rgba(0,0,0,.45);
  box-shadow: 0 6px 16px rgba(0,0,0,.18);
  cursor: pointer; z-index: 3;
  opacity: .85;
  transition:
    transform .2s ease,
    box-shadow .2s ease,
    background .2s ease,
    border-color .2s ease,
    opacity .2s ease;
}
#team .tc-btn:hover{
  opacity: 1;
  background: linear-gradient(180deg, rgba(255,255,255,.28), rgba(255,255,255,.12));
  border-color: rgba(255,255,255,.42);
  box-shadow: 0 10px 28px rgba(0,0,0,.25), 0 0 0 3px rgba(229,90,42,.15);
  transform: translateY(-50%) scale(1.04);
}
#team .tc-btn:active{
  transform: translateY(-50%) scale(.98);
}
#team .tc-btn:focus-visible{
  outline: none;
  box-shadow: 0 0 0 3px rgba(229,90,42,.30), 0 8px 24px rgba(0,0,0,.2);
}

#team .tc-prev{ left: .5rem }
#team .tc-next{ right: .5rem }

@media (hover:none){
  #team .tc-btn{
    width: 38px; height: 38px; border-radius: 12px; font-size: 18px;
    background: rgba(255,255,255,.18);
    border-color: rgba(255,255,255,.28);
  }
}

@media (max-width:600px){
  #team .team-copy{ padding:1rem .95rem }
}

footer {
  background: linear-gradient(135deg, rgba(229,90,42,.97), rgba(255,129,73,.92));
  color: #0f1724;
  padding: 3.25rem 0;
  font-size: .95rem;
  position: relative;
  overflow: hidden;
  border-top: 3px solid rgba(255,255,255,.38);
}

footer::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 0;
  pointer-events: none;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.28);
}

footer::after {
  content: "";
  position: absolute;
  right: -70px;
  bottom: -70px;
  width: 260px;
  height: 260px;
  border-radius: 50%;
  background: radial-gradient(circle at 40% 40%, rgba(255,255,255,.42), rgba(255,255,255,0) 60%);
  filter: blur(8px);
  pointer-events: none;
  mix-blend-mode: screen;
}

.footer-container {
  max-width: 1250px;
  margin: 0 auto;
  padding: 0 0.5rem;
  animation: footerFadeUp .5s ease both;
  position: relative;
  z-index: 1;
}

.footer-title {
  font-size: 1.7rem;
  font-weight: 800;
  margin-bottom: 1.75rem;
  color: #071d31;
  text-align: left;
  letter-spacing: .6px;
  line-height: 1.2;
}

.footer-content-wrapper {
  display: flex;
  flex-wrap: nowrap;
  gap: 1.5rem;
  justify-content: space-between;
  text-align: left;
}

.footer-col { flex: 1 1 0; min-width: 0; }
.footer-company { flex: 1.5 1 0; }

.footer-col p {
  margin: 0;
  line-height: 1.8;
  opacity: .95;
  color: #173046;
  text-align: justify;
  text-justify: inter-word;
  letter-spacing: 0.2px;
}

.footer-col h4 {
  margin-bottom: .75rem;
  color: #071d31;
  font-size: 1.06rem;
  font-weight: 800;
  letter-spacing: .4px;
  text-transform: uppercase;
}

.footer-links ul,
.footer-services ul {
  list-style: none;
  margin-top: .35rem;
  padding: 0;
}

.footer-links li,
.footer-services li {
  margin-bottom: .45rem;
}

.footer-links a,
.footer-services a {
  color: #173046;
  text-decoration: none;
  position: relative;
  transition: color .2s ease;
  background-image: linear-gradient(currentColor, currentColor);
  background-repeat: no-repeat;
  background-size: 0% 2px;
  background-position: 0 100%;
}

.footer-links a:hover,
.footer-services a:hover,
.footer-links a:focus-visible,
.footer-services a:focus-visible {
  color: #071d31;
  background-size: 100% 2px;
  outline: none;
}

.footer-note {
  margin-top: 2.25rem;
  padding-top: 1rem;
  text-align: center;
  font-size: .86rem;
  color: #05233a;
  border-top: 1px solid rgba(255,255,255,.35);
  letter-spacing: .2px;
  opacity: .9;
}

.footer-col a:focus-visible {
  outline: 3px solid rgba(7,29,49,.35);
  outline-offset: 2px;
  border-radius: 4px;
}
@media (max-width:900px){
  .footer-content-wrapper{ flex-wrap:wrap }
  .footer-company{ flex-basis:100% }
}
@media (max-width:600px){
  .footer-title{ text-align:left }
  .footer-content-wrapper{ gap:1.5rem }
  .footer-col{ flex:1 1 100% }
  .footer-note{ font-size:.84rem }
}

#whatsappBtn{
  position:fixed; bottom:70px; right:20px; background:var(--accent-color);
  border:none; padding:10px; border-radius:8px; cursor:pointer; box-shadow:0 2px 6px rgba(0,0,0,.15);
  transition: transform .3s ease, background .3s ease; z-index:2147483647;
}
#whatsappBtn img{ width:28px; height:28px; display:block; filter:brightness(0) invert(1) }
#whatsappBtn:hover{ background:#25D366; transform:translateY(-3px) }

#scrollToTopBtn{
  position:fixed; bottom:20px; right:20px; background:var(--accent-color); color:#fff; border:none;
  padding:10px; width:48px; height:48px; border-radius:8px; font-size:1.2rem; display:flex; align-items:center; justify-content:center;
  cursor:pointer; box-shadow:0 2px 6px rgba(0,0,0,.15); transition: opacity .3s ease, transform .3s ease, background .3s ease; opacity:0; visibility:hidden; z-index:999;
}
#scrollToTopBtn.show{ opacity:1; visibility:visible }
#scrollToTopBtn:hover{ transform:translateY(-3px); background:var(--primary-color) }

@media (max-width:768px){
  .cta-wrapper{ flex-direction:column; align-items:flex-start }
  .nav-container{ flex-direction:column; }
  .menu{ flex-wrap:wrap; gap:1rem }
  .footer-content-wrapper{ flex-direction:column; align-items:flex-start }
}