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

:root{
  --primary-color:#e55a2a;         
  --accent-color:#ff8149;          
  --text-color:#1a1a1a;           
  --light:#ffffff;
  --muted:#4a4a4a;
  --bg:#ffffff;                    
  --secondary:#ffffff;             

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

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

  --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);

  --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:
    radial-gradient(1100px 450px at 20% -10%, rgba(229,90,42,.28), transparent 60%),
    linear-gradient(180deg, #141414 0%, #0d0d0d 100%);
}

.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; }
}

@media (max-width: 768px) {
  .nav-container { display: flex; }         
  .menu-toggle { margin-left: auto !important; }  
  nav .menu li a { text-align: center !important; }
}

@media (max-width: 768px) {
  html.is-nav-open #whatsappBtn {
    z-index: 2147483640 !important; 
    pointer-events: none;           
  }
}

@media (max-width: 640px) {
  .nav-bar {
    margin: 10px 0.5rem 0;
    padding: 0.5rem 0.5rem;
  }
  
  .cta-wrapper {
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    gap: 0.8rem;
  }
  
  .cta-wrapper .btn {
    width: 100%;
    justify-content: center;
    padding: 0.85rem 1.8rem;
  }
  
  .btn {
    padding: 0.85rem 1.8rem;
    font-size: 0.95rem;
  }
  
  .hero.hero--split {
    padding: 2rem 0;
  }
  .hero-copy {
    text-align: left;
    padding: 0 1rem;
  }
  .hero-desc {
    text-align: left;
  }
  .tagline {
    font-size: 1.15rem;
  }
  .hero-title {
    font-size: clamp(1.8rem, 8vw, 2.5rem);
  }
  .hero-gallery{
    min-height: 340px;
    padding: 0 0.5rem;
  }
  .carousel-frame{
    min-height: 340px;
    border-radius: 16px;
  }
  .carousel-track{
    grid-auto-columns: clamp(250px, 75vw, 300px);
    padding: 12px;
    column-gap: 12px;
  }
  .slide{
    border-radius: 14px;
  }
  .slide img {
    object-fit: contain;
    max-height: 100%;
    max-width: 100%;
  }
}

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: 1.05fr .95fr;
  align-items: stretch;
  gap: clamp(2rem, 4vw, 3rem);
  position: relative;
}

.hero-copy{
  position: relative;
  z-index: 2;
  margin-right: 0;
}

.tagline{
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--accent-color);
  text-shadow: 0 2px 8px rgba(0,0,0,0.5);
}

.hero-title{
  font-size: clamp(2rem, 4.2vw, 3.2rem);
  font-weight: 900;
  line-height: 1.14;
  margin-top: 0.3rem;
  text-shadow: 0 4px 18px rgba(0,0,0,0.5);
}

.hero-desc{
  font-size: 1rem;
  line-height: 1.6;
  margin: 1.2rem 0 2rem;
  max-width: 700px;
  color: #f5f5f5;
  text-shadow: 0 2px 10px rgba(0,0,0,0.55);
}

.hero-gallery{
  display: flex;
  align-items: stretch;
  justify-content: flex-end;
  padding-right: clamp(0.3rem, 0.6vw, 0.6rem);
  min-height: 400px;
}

.carousel-frame{
  flex: 1;
  height: 100%;
  min-height: 400px;
  position: relative;
  overflow: hidden;
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.15);
  box-shadow:
    inset 12px 0 30px rgba(0,0,0,.22),
    0 14px 40px rgba(0,0,0,.30);
}

.carousel-frame::before{ content:none; }

.carousel-track{
  position: absolute;
  top: 0; 
  bottom: 0; 
  left: 0;
  width: max-content;
  height: 100%;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: clamp(260px, 32vw, 420px);
  align-items: center;
  column-gap: clamp(14px, 2.2vw, 24px);
  padding: clamp(14px, 2vw, 20px);
  will-change: transform;
}

.slide{
  height: 100%;
  width: 100%;
  border-radius: 18px;
  overflow: hidden;
  position: relative;
  background: #0f0f0f;
  box-shadow: 0 10px 26px rgba(0,0,0,.25);
}
.slide img{ 
  display:block; 
  width:100%; 
  height:100%; 
  object-fit:cover;
  object-position: center;
}

.slide:hover img{ transform: scale(1.06); }

.carousel-frame:hover .carousel-track{ transition-timing-function: linear; }

@media (max-width: 1100px){
  .carousel-track{ grid-auto-columns: minmax(240px, 46%); }
}
@media (max-width: 900px){
  .hero-split{
    grid-template-columns: 1fr;
    gap: 2rem;
  }
  .hero-copy {
    text-align: left;
  }
  .hero-desc {
    text-align: left;
  }
  .cta-wrapper {
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
  }
  .cta-wrapper .btn {
    width: 100%;
    justify-content: center;
  }
  .hero-gallery{
    min-height: 350px;
  }
  .carousel-frame{
    min-height: 350px;
    height: clamp(350px, 50vh, 520px);
  }
  .carousel-track{
    grid-auto-columns: clamp(280px, 70vw, 380px);
  }
}
@media (max-width: 700px){
  .carousel-track{ grid-auto-columns: clamp(260px, 75vw, 320px); }
  .hero-gallery{
    min-height: 320px;
  }
  .carousel-frame{
    min-height: 320px;
  }
}

@media (max-width: 640px) {
  .hero.hero--split {
    padding: 2rem 0;
  }
  .hero-copy {
    text-align: left;
    padding: 0 1rem;
  }
  .hero-desc {
    text-align: left;
  }
  .tagline {
    font-size: 1.15rem;
  }
  .hero-title {
    font-size: clamp(1.8rem, 8vw, 2.5rem);
  }
  .hero-gallery{
    min-height: 300px;
    padding-right: 0;
  }
  .carousel-frame{
    min-height: 300px;
    border-radius: 16px;
  }
  .carousel-track{
    grid-auto-columns: clamp(240px, 80vw, 300px);
  }
  .slide{
    border-radius: 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;
}
.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)}

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

.features{padding:4rem 1rem;background:var(--secondary);text-align:center}
.features h2{font-size:2rem;font-weight:700;margin-bottom:2rem;color:var(--primary-color)}
.feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:2rem}
.feature-box{
  position:relative;text-align:center;overflow:hidden;
  background:var(--glass-bg);border:1px solid var(--glass-brd);
  border-radius:18px;backdrop-filter:blur(14px) saturate(180%);-webkit-backdrop-filter:blur(14px) saturate(180%);
  box-shadow:0 12px 40px rgba(0,0,0,.10);
  padding:2rem;transition:transform var(--t-med),box-shadow var(--t-med);
}
.feature-box:hover{transform:translateY(-6px);box-shadow:0 18px 60px rgba(229,90,42,.20)}
.feature-icon{font-size:2rem;color:var(--primary-color);margin-bottom:1rem}
.feature-title{font-size:1.25rem;font-weight:700;margin-bottom:.5rem}
.feature-desc{font-size:.95rem;color:var(--muted)}

@media (max-width: 768px) {
  .features {
    padding: 3rem 0.5rem;
  }
  
  .feature-grid {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
}

.tabs{display:flex;justify-content:center;flex-wrap:wrap;gap:.5rem;margin:3rem auto 1.25rem}
.tab{
  padding:.8rem 1.6rem;border-radius:12px;background:#f5f5f5;border:none;
  font-weight:700;cursor:pointer;transition:var(--t-fast)
}
.tab:hover{background:var(--accent-color);color:#fff}
.tab.active{background:var(--primary-color);color:#fff}

@media (max-width: 640px) {
  .tabs {
    gap: 0.4rem;
    margin: 2rem auto 1rem;
  }
  
  .tab {
    padding: 0.6rem 1rem;
    font-size: 0.85rem;
  }
}

.product-grid{
  margin-top:2rem;
  display:flex;
  gap:1.5rem;
  padding:0 1rem 2.25rem;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-behavior:smooth;
  scrollbar-width:none;
  -ms-overflow-style:none;
  cursor:grab;
  user-select:none;
  -webkit-overflow-scrolling:touch;
  flex-wrap: nowrap;
}

.product-grid::-webkit-scrollbar{
  display:none;
}

.product-grid.is-dragging{
  cursor:grabbing;
  scroll-behavior:auto;
}

@media (min-width: 769px) {
  .product-grid {
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
    overflow:visible;
    cursor:default;
    flex-wrap: wrap;
  }
}

@media (max-width: 768px) {
  .product-grid {
    padding: 0 1rem 2rem;
    gap: 1rem;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
  }
}

@media (max-width: 480px) {
  .product-grid {
    gap: 0.8rem;
    padding: 0 1rem 1.5rem;
  }
}

.product-card{
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  align-items:center;
  border-radius:16px;
  box-shadow:0 8px 24px rgba(0,0,0,.15);
  transition:transform .35s ease, box-shadow .35s ease;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(18px) saturate(160%);
  -webkit-backdrop-filter:blur(18px) saturate(160%);
  padding:0;
  transform-style:preserve-3d;
  perspective:800px;
  will-change:transform;
  flex-shrink:0;
  width: 260px;
  min-width: 260px;
  max-width: 260px;
}

@media (min-width: 769px) {
  .product-card {
    width: auto;
    min-width:auto;
    max-width:none;
    flex-shrink: 1;
  }
}

@media (max-width: 480px) {
  .product-card {
    width: 220px;
    min-width: 220px;
    max-width: 220px;
  }
}
.product-card img,
.product-card picture{width:100%;display:block}
.product-card img{
  aspect-ratio:4 / 3; object-fit:cover; transform:translateZ(8px);
  transition:transform .45s ease; border-radius:16px;
}
.product-card::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(0,0,0,.55) 20%, rgba(0,0,0,.05) 70%);
  z-index:1; transition:opacity .35s ease;
}
.product-card h3{
  position:absolute; bottom:16px; left:50%; transform:translateX(-50%) translateZ(24px);
  z-index:2; font-weight:800; font-size:1rem; text-transform:uppercase; letter-spacing:1px;
  color:#fff; background:rgba(0,0,0,.45); padding:.6rem 1rem; border-radius:10px;
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); white-space:nowrap;
}
.product-card .price, .product-card .desc{ display:none } 
.product-card:hover{ transform:translateY(-6px) scale(1.02); box-shadow:0 16px 32px rgba(0,0,0,.25) }
.product-card:hover img{ transform:translateZ(8px) scale(1.08) }
.product-card:hover::before{ opacity:.85 }

.product-card:not(:has(img)){
  padding:2rem 1rem; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2);
}

@media (max-width: 640px) {
  .product-card h3 {
    font-size: 0.85rem;
    padding: 0.5rem 0.8rem;
    bottom: 12px;
  }
}

.modal-overlay{
  position:fixed; inset:0; display:flex; align-items:center; justify-content:center;
  background:rgba(0,0,0,.70); backdrop-filter:blur(6px);
  z-index:10000; opacity:0; transition:opacity .25s ease;
}

.modal-box{
  background:#fff; width:min(960px,92vw); max-width:960px; max-height:90vh;
  border-radius:var(--radius-m);
  box-shadow:0 20px 60px rgba(0,0,0,.35);
  position:relative; overflow:hidden;
  display:flex; flex-direction:column;
}

.modal-close{
  position:absolute; top:12px; right:16px;
  border:0; background:rgba(255,255,255,.9); 
  width:36px; height:36px; border-radius:50%;
  font-size:24px; line-height:1; display:flex; align-items:center; justify-content:center;
  cursor:pointer; color:#111; z-index:10;
  box-shadow:0 2px 8px rgba(0,0,0,.15);
  transition:all .2s ease;
}
.modal-close:hover{ background:#fff; transform:scale(1.08); box-shadow:0 4px 12px rgba(0,0,0,.25); }

.modal-title{
  padding:20px 60px 16px 24px; margin:0; 
  color:var(--primary-color); font-size:1.65rem; font-weight:800;
  border-bottom:2px solid #f0f0f0;
}

.modal-body{
  display:grid; grid-template-columns:400px 1fr;
  gap:0; overflow:auto; flex:1;
}

.modal-media{
  background:#f8f9fa; 
  display:flex; align-items:center; justify-content:center;
  padding:24px; border-right:1px solid #e9ecef;
  position:sticky; top:0; align-self:start;
}
.modal-media img{
  width:100%; height:auto; max-height:450px; display:block; object-fit:contain;
  border-radius:8px; box-shadow:0 4px 12px rgba(0,0,0,.08);
}
.modal-media .img-placeholder{
  width:100%; height:300px; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, #f0f0f0, #e0e0e0);
  border-radius:8px; color:#999; font-size:1.1rem; font-weight:600;
}

.modal-content{
  padding:24px 28px; overflow-y:auto;
}

.specs-grid{
  display:grid; gap:12px; margin-bottom:24px;
  padding:16px; background:#f8f9fa; border-radius:10px; border:1px solid #e9ecef;
}
.spec-row{
  display:flex; gap:8px; font-size:.95rem; line-height:1.5;
}
.spec-row strong{ color:var(--primary-color); min-width:90px; }

.desc-block{
  margin-bottom:20px;
}
.desc-heading{
  font-size:1.1rem; font-weight:700; color:var(--text-color); 
  margin:0 0 10px; padding-bottom:6px; border-bottom:2px solid var(--accent-color);
}
.desc-text{
  margin:0; line-height:1.7; color:var(--muted); font-size:.95rem;
  text-align:justify;
}

@media (max-width: 768px){
  .modal-box{ max-height:95vh; }
  .modal-title{ font-size:1.35rem; padding:16px 50px 14px 20px; }
  .modal-body{
    grid-template-columns:1fr; gap:0;
  }
  .modal-media{
    border-right:0; border-bottom:1px solid #e9ecef; 
    max-height:40vh; padding:16px; position:static;
  }
  .modal-media img{
    max-height:35vh;
  }
  .modal-content{ padding:20px; }
  .specs-grid{ padding:14px; gap:10px; }
  .spec-row{ flex-direction:column; gap:2px; }
  .spec-row strong{ min-width:auto; }
}

.quote-faq-section{
  background:linear-gradient(180deg, var(--secondary) 0%, #fff5ef 100%);
  padding:4.25rem 0;
}
.quote-faq-container{
  display:flex;flex-wrap:wrap;gap:3rem;align-items:stretch;max-width:1200px;margin:0 auto;padding:0 1rem;
}
.quote-form,.faq-section{
  flex:1 1 360px;background:#ffffff;padding:2.2rem;border-radius:16px;border:1px solid rgba(0,0,0,.06);
  box-shadow:0 10px 20px rgba(0,0,0,.06), 0 2px 8px rgba(0,0,0,.04); position:relative;
}
.quote-form::before,.faq-section::before{
  content:"";position:absolute;left:0;right:0;top:0;height:3px;
  background:linear-gradient(90deg,var(--primary-color),var(--accent-color));
  border-top-left-radius:16px;border-top-right-radius:16px;
}
@media (min-width:992px){ .quote-form{ position:sticky; top:90px; } }
.quote-form form{ display:flex; flex-direction:column; gap:1rem; margin-top:1rem; }
.quote-form input,.quote-form textarea{
  width:100%; background:var(--secondary); border:1px solid #e6e8ee; padding:.9rem 1rem; border-radius:12px; color:var(--text-color); font-size:.95rem;
  transition:border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.quote-form input::placeholder,.quote-form textarea::placeholder{ color:#98a2b3; }
.quote-form input:focus,.quote-form textarea:focus{
  outline:none; border-color:var(--primary-color); box-shadow:0 0 0 3px rgba(229,90,42,.18); background:#fff;
}
.quote-form textarea{ resize:vertical; min-height:140px; }
.submit-btn{
  align-self:stretch; margin-top:.5rem; padding:.95rem 1.4rem; background:linear-gradient(135deg,var(--primary-color),var(--accent-color));
  color:#fff; border:none; border-radius:12px; font-weight:800; letter-spacing:.4px; text-transform:uppercase;
  box-shadow:0 8px 20px rgba(229,90,42,.25); transition: transform .2s ease, box-shadow .2s ease, filter .2s ease; cursor:pointer;
}
.submit-btn:hover{ transform:translateY(-2px); box-shadow:0 14px 28px rgba(229,90,42,.35); filter:brightness(1.03) }

@media (max-width: 768px) {
  .quote-faq-section {
    padding: 3rem 0;
  }
  
  .quote-faq-container {
    gap: 2rem;
    padding: 0 0.5rem;
  }
  
  .quote-form, .faq-section {
    padding: 1.5rem;
  }
}

.accordion-item{ border-bottom:1px solid #eef0f4; padding:.35rem 0; }
.accordion-item.active{ border-left:3px solid var(--primary-color); padding-left:.75rem; }
.accordion-title{
  appearance:none; background:transparent; border:none; color:var(--text-color); width:100%; text-align:left; padding:1rem 0; font-weight:700; font-size:1rem;
  position:relative; cursor:pointer; transition:color .2s ease;
}
.accordion-title:hover{ color:var(--primary-color); }
.accordion-title::after{
  content:''; position:absolute; right:0; top:50%; width:10px; height:10px;
  border-right:2px solid var(--primary-color); border-bottom:2px solid var(--primary-color);
  transform: translateY(-50%) rotate(-45deg); transition: transform .25s ease;
}
.accordion-item.active .accordion-title::after{ transform: translateY(-50%) rotate(45deg); }
.accordion-content{
  max-height:0; opacity:0; overflow:hidden; transform:translateY(-6px);
  transition:max-height .32s ease, opacity .25s ease, transform .25s ease; color:var(--muted); font-size:.95rem; padding-right:.5rem;
}
.accordion-item.active .accordion-content{ max-height:260px; opacity:1; transform:none; margin-bottom:1rem; }

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; font-size:1.4rem; } 
  .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:999;
}
#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) }


#pagination{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:.5rem;
  margin: 16px 0 36px;           
  flex-wrap: wrap;                 
}

#pagination button,
#pagination span{                 
  min-width: 40px;
  height: 40px;
  padding: 0 12px;
  border-radius: 10px;
  border:1px solid #e9e9e9;
  background:#fff;
  color:#1a1a1a;
  font-weight:700;
  letter-spacing:.2px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1;
  transition: transform .15s ease, box-shadow .15s ease, border-color .2s ease, background-color .2s ease, color .2s ease;
}

#pagination button:hover:not([disabled]),
#pagination button:focus-visible{
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(0,0,0,.10);
  border-color: rgba(229,90,42,.35);                
  outline: none;
}

#pagination button.active,
#pagination [aria-current="page"]{
  background: linear-gradient(135deg, var(--primary-color), var(--accent-color));
  color:#fff;
  border-color: transparent;
  box-shadow: 0 8px 20px rgba(229,90,42,.25);
  cursor: default;
}

#pagination button[disabled]{
  opacity:.55;
  cursor:not-allowed;
  transform:none;
  box-shadow:none;
}

#pagination span{
  border: none;
  background: transparent;
  color: #888;
  min-width: auto;
  padding: 0 6px;
}

@media (max-width:480px){
  #pagination{
    gap:.35rem;
    margin: 12px 0 28px;
  }
  #pagination button, #pagination span{
    min-width: 36px;
    height: 36px;
    padding: 0 10px;
    border-radius:8px;
    font-weight:700;
  }
}

@media (max-width:768px){
  .cta-wrapper{flex-direction:column;align-items:flex-start}
  .footer-content-wrapper{flex-direction:column;align-items:flex-start}
}