:root{
  
  --primary:      #0ea5e9;   
  --primary-600:  #0284c7;   
  --accent:       #22d3ee;   
  --ink:          #0b0f19;   
  --muted:        #64748b;   
  --paper:        #ffffff;   
  --dark:         #0f172a;   

  
  --radius: 16px;
  --shadow: 0 10px 30px rgba(2,132,199,.18);
  --t-fast: .18s;
  --t-med:  .28s;

  
  --z-overlay: 1200;  
  --z-drawer:  1300;  
  --z-toggle:  1400;  
}


*{ box-sizing: border-box }
html, body{ height:100% }
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Inter, Roboto, Arial, sans-serif;
  color: var(--ink);
  background: var(--paper);
  line-height: 1.6;
}
img{ max-width:100%; height:auto; display:block }
a{ color:inherit; text-decoration:none }
:focus-visible{ outline: 2px solid #78c8ff; outline-offset: 2px }  


.container{ width:min(1120px, 92%); margin-inline:auto }
.muted{ color:var(--muted) }
.center{ display:flex; gap:.6rem; flex-wrap:wrap; justify-content:center }
.invert{ color:#e5f4ff }
.h2-like{ font-size: clamp(24px, 3.6vw, 34px); margin:.2rem 0 }


.topbar{
  font-size:14px;
  color:var(--muted);
  background:#f8fafc;
  border-bottom:1px solid #e6eef6;
}
.topbar-inner{
  display:flex; gap:10px; align-items:center; justify-content:space-between;
  padding:.35rem 0; flex-wrap:wrap;
}
.tb-item{ display:flex; align-items:center; gap:.4rem; white-space:nowrap }
.tb-item i{ color:var(--primary); font-size:14px }
.tb-right{ display:flex; gap:.4rem; align-items:center }
.tb-social{
  display:grid; place-items:center;
  width:28px; height:28px; border-radius:8px;
  color:#0b4664; background:#eaf6ff;
}
.tb-social:hover{ background:#dff1ff }


.btn{
  display:inline-block; padding:.9rem 1.1rem;
  border-radius: calc(var(--radius) - 6px);
  font-weight:700; border:1px solid transparent;
  transition: transform var(--t-fast) ease, filter var(--t-fast) ease;
  box-shadow: var(--shadow);
}
.btn:hover{ transform: translateY(-1px) }
.btn:active{ transform: translateY(0) }
.btn-sm{ padding:.55rem .8rem; font-weight:600; box-shadow:none }
.btn-primary{ background: linear-gradient(180deg, var(--primary), var(--primary-600)); color:#fff }
.btn-outline{ background:transparent; color:var(--primary); border-color:var(--primary); box-shadow:none }
.btn-outline-light{ background:transparent; color:#e5f4ff; border-color:#78c8ff; box-shadow:none }

.btn-whatsapp{ background: linear-gradient(180deg, #25D366, #1ebe5d); color:#fff; border-color: transparent }
.btn-whatsapp:hover{ filter: brightness(1.03) }


.btn i{ margin-right:.4rem }


#cta-final .cta-actions .btn{
  font-size: .95rem;
  padding: .48rem .8rem;
  line-height: 1.2;
  box-shadow: none;
}


.site-header{
  position: sticky; top:0; z-index:80;              
  background: rgba(255,255,255,.9);
  backdrop-filter: blur(8px);
  border-bottom:1px solid rgba(2,132,199,.12);
}
.header-inner{
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:.7rem 0;
  flex-wrap:wrap;
}
.brand{ display:flex; align-items:center; gap:.6rem }
.brand-logo{ display:block; width:150px; height:auto; object-fit:contain }


.nav{ display:flex; align-items:center; gap:1rem; margin-left:auto; flex-wrap:wrap }
.site-search{ position:relative; flex:1 1 280px; max-width:420px; min-width:220px; display:flex; }
.site-search__field{ width:100%; display:flex; align-items:center; gap:.4rem; background:#fff; border:1px solid rgba(2,132,199,.18); border-radius:999px; padding:.25rem .35rem .25rem .85rem; box-shadow:0 10px 24px rgba(15,23,42,.08); transition:border-color var(--t-fast) ease, box-shadow var(--t-fast) ease; }
.site-search__field:focus-within{ border-color:var(--primary); box-shadow:0 14px 34px rgba(14,165,233,.18); }
.site-search input{ flex:1; border:0; background:transparent; font-size:.95rem; padding:.45rem .4rem; color:var(--ink); }
.site-search input::placeholder{ color:var(--muted); }
.site-search input:focus{ outline:none; }
.site-search button{ border:0; background:var(--primary); color:#fff; width:38px; height:38px; border-radius:999px; display:grid; place-items:center; cursor:pointer; transition:background var(--t-fast) ease, transform var(--t-fast) ease; flex:0 0 38px; }
.site-search button:hover{ background:var(--primary-600); transform:translateY(-1px); }
.site-search button:active{ transform:translateY(0); }
.nav a{ font-weight:600 }
.nav a:not(.nav-contact):hover,
.nav a.active{ color:var(--primary) }

  
  .nav-contact{
    background:#fff;
    color:var(--primary-600);
    border:2px solid var(--primary-600);
    border-radius: calc(var(--radius) - 6px);
    box-shadow:none;
    font-weight:700;
    transition: color var(--t-fast) ease, background var(--t-fast) ease, transform var(--t-fast) ease;
  }

  .nav-contact:hover,
  .nav-contact:focus-visible{
    background:var(--primary-600);
    color:#fff;
    transform: translateY(-1px);
  }

  .nav .nav-contact{
    display:inline-flex;
    align-items:center;
    gap:.35rem;
  }

  .drawer-menu .nav-contact{
    display:block;
    margin-top:1rem;
    padding:.85rem 1rem;
    text-align:center;
    background:var(--primary-600);
    color:#fff;
    border:2px solid var(--primary-600);
    border-radius: calc(var(--radius) - 6px);
  }

  .drawer-menu .nav-contact:hover,
  .drawer-menu .nav-contact:focus-visible{
    filter: brightness(1.05);
  }

.nav-toggle{
  display:none; width:40px; height:40px; border:0; background:transparent; cursor:pointer;
  position:relative; margin-left:auto;
}
.nav-toggle .bar{
  position:absolute; left:8px; right:8px; height:2px; background: var(--ink);
  transition: transform var(--t-med) ease, opacity var(--t-med) ease, top var(--t-med) ease;
}
.nav-toggle .bar:nth-child(1){ top:12px }
.nav-toggle .bar:nth-child(2){ top:19px }
.nav-toggle .bar:nth-child(3){ top:26px }

.nav-toggle[aria-expanded="true"] .bar:nth-child(1){ top:19px; transform: rotate(45deg) }
.nav-toggle[aria-expanded="true"] .bar:nth-child(2){ opacity:0 }
.nav-toggle[aria-expanded="true"] .bar:nth-child(3){ top:19px; transform: rotate(-45deg) }

body.menu-open .nav-toggle .bar{ background:#fff }


.search-results{ background:#fff; border-bottom:1px solid rgba(2,132,199,.12); box-shadow:0 20px 38px rgba(15,23,42,.12); position:relative; z-index:70; }
.search-results[hidden]{ display:none !important; }
.search-results__inner{ padding:1.1rem 0 1.5rem; display:grid; gap:.9rem; }
.search-results__header{ display:flex; align-items:center; justify-content:space-between; gap:.8rem; }
.search-results__title{ font-weight:700; font-size:1rem; }
.search-results__close{ border:0; background:transparent; color:var(--muted); font-size:1.2rem; cursor:pointer; display:grid; place-items:center; transition:color var(--t-fast) ease; }
.search-results__close:hover{ color:var(--primary-600); }
.search-results__summary{ font-size:.9rem; color:var(--muted); margin:0; }
.search-results__empty{ font-size:.9rem; color:var(--muted); margin:0; }
.search-results__list{ list-style:none; margin:0; padding:0; display:grid; gap:.6rem; max-height:320px; overflow-y:auto; }
.search-results__item{ border-radius:14px; background:#f8fafc; transition:background var(--t-fast) ease, transform var(--t-fast) ease; }
.search-results__item a{ display:grid; gap:.25rem; padding:.75rem .9rem; }
.search-results__item a:focus-visible{ outline:2px solid var(--primary-600); outline-offset:2px; border-radius:12px; }
.search-results__item-title{ font-weight:600; }
.search-results__item-desc{ font-size:.9rem; color:var(--muted); }
.search-results__item:hover{ background:#e8f4ff; transform:translateY(-1px); }

.nav-overlay{
  position:fixed; inset:0;
  z-index: var(--z-overlay);
  background: rgba(7,14,28,.45);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  opacity:0; pointer-events:none;
  transition: opacity var(--t-med) ease;
}
.nav-overlay.show{ opacity:1; pointer-events:auto }


.nav-drawer{
  position:fixed; top:0; right:0; height:100%;
  width:50vw; max-width:500px; min-width:290px;
  z-index: var(--z-drawer);
  background:#fff; border-left:1px solid #e6eef6;
  box-shadow: -24px 0 48px rgba(0,0,0,.25);
  transform: translateX(105%); transition: transform var(--t-med) ease;
  display:flex; flex-direction:column; padding:16px; will-change: transform;
  position:fixed;
}
.nav-drawer.show{ transform: translateX(0) }


.drawer-menu{ display:grid; gap:.6rem; margin-top:16px }
.drawer-menu a{ font-weight:700; padding:.6rem 0 }
.drawer-menu a:not(.nav-contact):hover,
.drawer-menu a.active{ color:var(--primary) }


.drawer-close{
  position:absolute; top:10px; right:12px;
  width:40px; height:40px; display:grid; place-items:center;
  border:0; background:transparent; color:#0b0f19; cursor:pointer;
  font-size:24px;
}
.drawer-close:focus-visible{ outline:2px solid #78c8ff; outline-offset:2px }


.drawer-bottom{ margin-top:auto; padding-top:12px }
.drawer-cta{ display:block; text-align:center }


body.menu-open{
  overflow:hidden; height:100vh;
  touch-action:none; overscroll-behavior:none;
}

body.menu-open .site-header{ pointer-events:none; background:transparent; box-shadow:none }
body.menu-open .site-header .nav-toggle{ pointer-events:auto }


@media (max-width: 680px){
  .site-search__field{ box-shadow:0 12px 22px rgba(15,23,42,.08); }
  .search-results__inner{ padding:.9rem 0 1.2rem; }
  .search-results__list{ max-height:240px; }
}
body.menu-open .nav-toggle{
  position:fixed; top:14px; right:calc(16px + env(safe-area-inset-right));
  z-index: var(--z-toggle);
}


@media (max-width: 960px){
  header .nav{ display:none !important; }  
  .nav-toggle{ display:block; margin-left:auto }
  .site-search{ order:3; flex:1 1 100%; max-width:none; min-width:0; }
}

@media (min-width: 961px){
  .nav-toggle{ display:none !important; }
  .nav-overlay, .nav-drawer{ display:none !important; }
}



.hero{
  position:relative;
  overflow:hidden;
  z-index:10;
  background: url("imgs/hero-piscina.png") center center / cover no-repeat;
  color:#ffffff;
  padding:0;
  min-height: 90vh; 

}
.hero::before{
  content:"";
  position:absolute;
  inset:0;
  background: rgba(0,0,0,.45); 
  z-index:1;
}
.hero .container{
  position:relative;
  z-index:2;
  display:flex; 
  flex-direction:column; 
  align-items:center; 
  justify-content:center;
  min-height: 90vh; 
  text-align:center;

}

.hero h1{
  font-size: clamp(32px, 5.2vw, 56px);
  line-height:1.1;
  margin:0 0 .6rem;
  color:#fff;
}
.hero .lead{ 
  color:#f0f8ff; 
  max-width:820px; 
  margin:0 auto 0;
}
.hero-cta{ 
  display:flex; 
  justify-content:center; 
  gap:.8rem; 
  flex-wrap:wrap;
  margin-bottom: 1.5rem;
}


.waves{ position:absolute; left:0; right:0; bottom:-1px; height:80px }
.wave{ position:absolute; left:-10%; right:-10%; height:60px; border-radius:50%; filter: blur(14px); opacity:.6 }
.wave1{ background: linear-gradient(90deg,#22d3ee33,#0ea5e933,#22d3ee33); animation: waveMove 9s linear infinite }
.wave2{ background: linear-gradient(90deg,#0ea5e933,#22d3ee33,#0ea5e933); animation: waveMove 12s linear infinite reverse }
@keyframes waveMove{ 0%{ transform: translateX(-6%) } 100%{ transform: translateX(6%) } }


.stats{
  list-style:none;
  padding:0;
  margin:0 auto 16px; 
  display:flex; gap:10px; justify-content:center; flex-wrap:nowrap;
}
.stats.stats-outside{
  margin:16px auto 24px;
  width: min(1120px, 92%); 
}
.stats li{
  background:#0a2534; border:1px solid #114a63;
  color:#d7f3ff; border-radius:12px;
  padding: clamp(8px, 2.2vw, 12px) clamp(8px, 2.6vw, 12px);
  min-width: 88px; flex:1 1 88px;
  display:grid; place-items:center; gap:4px;
}
.stats strong{ font-size: clamp(1.05rem, 4vw, 1.4rem) }
.stats span{ font-size: clamp(.72rem, 2.8vw, .9rem) }


.section{ padding:56px 0 }
.section-muted{ background:#f8fafc }
.section-contrast{ background: var(--dark) }
.section-head{ text-align:center; margin-bottom:18px }
.section-head h2{ font-size: clamp(26px, 3.6vw, 36px); margin:0 0 .2rem }


.grid{ display:grid; gap:16px; grid-template-columns: repeat(12, 1fr) }
.card{
  grid-column: span 12;
  display:flex; gap:12px; align-items:flex-start;
  background:#fff; border:1px solid #e6eef6;
  border-radius: var(--radius); padding:18px; box-shadow: var(--shadow);
  transition: transform var(--t-fast) ease;
}
.card:hover{ transform: translateY(-2px) }
.ic{
  width:44px; height:44px; flex:0 0 44px;
  display:grid; place-items:center;
  border-radius:12px; background:#f0f9ff; color:var(--primary);
}
.ic i{ font-size:20px }
.card h3{ margin:.2rem 0 .2rem; font-size:1.15rem }
.card p{ margin:0; color:var(--muted) }
@media (min-width:720px){ .card{ grid-column: span 6 } }
@media (min-width:1024px){ .card{ grid-column: span 4 } }


.gallery{
  display:grid; gap:16px; grid-template-columns: repeat(12,1fr); margin-top:10px;
}


.gallery .ph{
  grid-column: span 12;
  height:180px; border-radius: var(--radius);
  
  background: var(--img, linear-gradient(135deg, #e2f3ff, #c9eaff));
  background-size: cover; background-position: center;
  border:1px dashed #94c7e9;
  position:relative; overflow:hidden;
}

.gallery .ph.has-img{ border: none; }

.gallery .ph figcaption{
  position:absolute; left:0; right:0; bottom:0;
  background: rgba(255,255,255,.9);
  padding:.45rem .6rem; font-weight:700; color:#0b4664;
}


.gallery a.gallery-link{ grid-column: span 12; display:block; text-decoration:none; color:inherit; }

@media (min-width:720px){
  .gallery .ph{ grid-column: span 6 }
  .gallery a.gallery-link{ grid-column: span 6 }
}
@media (min-width:1024px){
  .gallery .ph{ grid-column: span 4 }
  .gallery a.gallery-link{ grid-column: span 4 }
}


.gallery-grid{
  column-count: 2;
  column-gap: 0;
}
@media (min-width:720px){ .gallery-grid{ column-count: 3 } }
@media (min-width:1024px){ .gallery-grid{ column-count: 4 } }
.gallery-grid .g-item{
  display:block; break-inside: avoid; -webkit-column-break-inside: avoid; margin:0;
  position:relative; overflow:hidden; border-radius:0; background:transparent; border:0; box-shadow:none;
}
.gallery-grid .g-item img{
  display:block; width:100%; height:auto; object-fit:cover; margin:0;
  transform: scale(1); transition: transform var(--t-med) ease;
}
.gallery-grid .g-item:hover img{ transform: scale(1.03) }


.lightbox[hidden]{ display:none }
.lightbox{
  position:fixed; inset:0; z-index:1600; 
  display:grid; place-items:center; padding:20px; pointer-events:auto;
}
.lightbox .lb-backdrop{
  position:absolute; inset:0; background: rgba(2,14,28,.82); backdrop-filter: blur(4px);
  z-index:0;
}
.lightbox .lb-stage{
  position:relative; z-index:1; margin:0; max-width:92vw; max-height:90vh;
  display:grid; place-items:center;
}
.lightbox .lb-image{
  max-width:92vw; max-height:80vh; object-fit:contain; cursor: zoom-in;
  transition: transform .25s ease;
}
.lightbox.zoomed .lb-image{ cursor: zoom-out; }
.lightbox .lb-close{
  position:fixed; top:12px; right:12px; z-index:2;
  width:44px; height:44px; display:grid; place-items:center;
  border:0; border-radius:10px; background: rgba(255,255,255,.12); color:#fff; cursor:pointer;
  backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
}
.lightbox .lb-close:hover{ background: rgba(255,255,255,.22) }

.lb-nav .lb-arrow{
  position:fixed; top:50%; transform: translateY(-50%);
  z-index:6; width:46px; height:46px; border-radius:50%; border:1px solid rgba(255,255,255,.35);
  display:grid; place-items:center; background: rgba(10,37,52,.35); color:#fff; cursor:pointer;
  backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
}
.lb-nav .lb-prev{ left:12px }
.lb-nav .lb-next{ right:12px }
.lb-nav .lb-arrow:hover{ background: rgba(10,37,52,.5) }


.lb-thumbs{
  position:absolute; left:0; right:0; bottom:8px; z-index:10; display:flex; gap:6px;
  padding:8px 12px; overflow-x:auto; align-items:center; justify-content:flex-start;
  background: rgba(2,14,28,.55); border-top:1px solid rgba(255,255,255,.18);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  min-height: 72px; 
}
.lb-thumbs::-webkit-scrollbar{ height:8px }
.lb-thumbs::-webkit-scrollbar-thumb{ background: rgba(255,255,255,.25); border-radius:4px }
.lb-thumb{
  width:72px; height:56px; padding:0; border:2px solid transparent; border-radius:8px; overflow:hidden; background:transparent; cursor:pointer;
  display:block; flex:0 0 auto; 
  background-size: cover; background-position: center; background-repeat: no-repeat;
}
.lb-thumb:focus{ outline: none; }
.lb-thumb:focus-visible{ outline: 2px solid #78c8ff; outline-offset: 2px; }
.lb-thumb img{ width:100%; height:100%; object-fit:cover; display:block; opacity:1 }
.lb-thumb[aria-current="true"]{ border-color:#78c8ff }


body.lightbox-open{ overflow:hidden; height:100vh }


.grid-four .bullet{
  grid-column: span 12;
  border:1px solid rgba(120,200,255,.25);
  border-radius: var(--radius);
  padding:16px; background: rgba(255,255,255,.04);
}
@media (min-width:720px){ .grid-four .bullet{ grid-column: span 6 } }
@media (min-width:1024px){ .grid-four .bullet{ grid-column: span 3 } }


.section-contrast .grid.grid-four + .center{ margin-top:20px }


.quote{
  grid-column: span 12;
  background:#fff; border:1px solid #e6eef6;
  border-radius: var(--radius); padding:18px; box-shadow: var(--shadow);
  position:relative;
}
.quote::before{
  content:"“"; position:absolute; font-size:42px; color:#b9e5ff;
  left:12px; top:-10px;
}
.quote cite{ display:block; margin-top:.4rem; color:#0b4664; font-weight:700 }


.steps{ list-style:none; display:grid; gap:10px; padding:0; margin:0 }
.steps li{
  background:#fff; border:1px solid #e6eef6;
  border-radius:12px; padding:12px 14px; box-shadow: var(--shadow);
}


.cta{
  display:grid; gap:12px; grid-template-columns:1fr;
  background:#eef9ff; border:1px solid #9bd8ff;
  border-radius: var(--radius); padding:16px;
}
.cta-actions{ display:flex; gap:.6rem; flex-wrap:wrap; align-items:center; align-self:end }
@media (min-width:900px){ .cta{ grid-template-columns: 1fr auto } }

.cta-strip{
  margin-top:16px; display:flex; align-items:center; justify-content:space-between; gap:10px;
  background:#f0f9ff; border:1px solid #cfe9fb;
  border-radius: var(--radius); padding:12px;
}
.cta-strip p{ margin:0; color:#0b4664 }


.site-footer{ padding:28px 0; background: var(--dark); color:#cbd5e1 }

.footer-inner{
  display:grid; gap:16px;
  grid-template-columns: 1fr;
  align-items:start;
  justify-items:center; 
}
@media (min-width:720px){
  .footer-inner{ grid-template-columns: repeat(2, 1fr); justify-items:start }
}
@media (min-width:1024px){
  .footer-inner{ grid-template-columns: 1.2fr 1fr 1fr 1fr }
}

.footer-col{ min-width:0; text-align:center }
.footer-brand .brand{ justify-content:center }
@media (min-width:720px){
  .footer-col{ text-align:left }
  .footer-brand .brand{ justify-content:flex-start }
}
.footer-brand .brand-logo{ width:160px; height:auto }
.footer-title{ margin:.2rem 0 .4rem; font-size:1rem; color:#e5f4ff }
.footer-list{ list-style:none; margin:0; padding:0; display:grid; gap:.35rem }
.footer-list a{ color:#cbd5e1 }
.footer-list a:hover{ color:#fff }


.footer-social{ display:flex; gap:.5rem }
.footer-social a{ width:34px; height:34px; border-radius:10px; display:grid; place-items:center; background:#0a2534; color:#e5f4ff; border:1px solid #114a63 }
.footer-social a:hover{ background:#0e3348 }


.footer-legal{
  grid-column: 1 / -1;
  display:block;
  margin-top:12px;
  color:#9fb6c9;
  text-align:center;
  justify-self:center; 
  width:100%;          
}


.wa-float{
  position:fixed; right:16px; bottom:16px; z-index:60;
  width:54px; height:54px; border-radius:16px;
  display:grid; place-items:center;
  background:#25d366; color:#fff;
  box-shadow:0 12px 24px rgba(0,0,0,.18);
  transition: transform var(--t-fast) ease, opacity var(--t-fast) ease;
}
.wa-float i{ font-size:24px }
.wa-float:hover{ transform: translateY(-2px) }

body.menu-open .wa-float{ opacity:0; pointer-events:none }


.reveal{ opacity:0; transform: translateY(14px); transition: opacity .5s ease, transform .5s ease }
.reveal.is-visible{ opacity:1; transform: translateY(0) }



.breadcrumbs{ 
  
  position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
  clip: rect(0 0 0 0); clip-path: inset(50%); white-space:nowrap; border:0;
}
.breadcrumbs a{ text-decoration:none }


.svc-catalog{
  display:grid; gap:14px;
  grid-template-columns: repeat(1, 1fr);
}
@media (min-width:720px){ .svc-catalog{ grid-template-columns: repeat(2, 1fr) } }
@media (min-width:1024px){ .svc-catalog{ grid-template-columns: repeat(4, 1fr) } }
.svc-tile{
  background: radial-gradient(120% 120% at 100% 0%, #e0f7ff 0%, #c7ecff 40%, #bfe6ff 60%, #e9f7ff 100%);
  border:1px solid #b3e1ff; border-radius: var(--radius);
  padding:16px; min-height:150px; display:grid; align-content:flex-start; gap:6px;
  box-shadow: var(--shadow); transition: transform var(--t-fast) ease;
}
.svc-tile:hover{ transform: translateY(-2px) }
.svc-tile i{ font-size:22px; color:var(--primary) }
.svc-tile h3{ margin:.2rem 0 0; font-size:1.1rem }
.svc-tile p{ margin:0; color:var(--muted) }


.svc-panel{
  background:#fff; border:1px solid #e6eef6; border-radius: var(--radius);
  padding:18px; box-shadow: var(--shadow); margin-bottom:14px;
}
.svc-panel header{ display:flex; align-items:center; gap:.6rem; margin:-2px 0 .4rem }
.svc-panel header i{ font-size:20px; color:var(--primary) }
.svc-panel h2{ font-size:1.3rem; margin:.1rem 0 }
.svc-panel ul{ margin:.2rem 0 .8rem 1.2rem }
.svc-panel li{ margin:.2rem 0 }
.svc-actions{ display:flex; gap:.6rem; flex-wrap:wrap }


.plan-grid{ display:grid; gap:14px; grid-template-columns: repeat(1,1fr) }
@media (min-width:900px){ .plan-grid{ grid-template-columns: repeat(3,1fr) } }
.plan{
  background:#fff; border:1px solid #e6eef6; border-radius: var(--radius);
  padding:18px; box-shadow: var(--shadow); text-align:center;
}
.plan.highlight{ border-color:#9bd8ff; box-shadow: 0 12px 30px rgba(2,132,199,.20) }
.plan h3{ margin:.2rem 0 .4rem }
.plan ul{ list-style:none; padding:0; margin:0 0 .8rem; display:grid; gap:.35rem; color:var(--muted) }


.faq details{ border:1px solid #e6eef6; border-radius:12px; padding:10px 12px; background:#fff; box-shadow: var(--shadow); margin-bottom:10px }
.faq summary{ cursor:pointer; font-weight:700; outline:none }
.faq summary::-webkit-details-marker{ display:none }
.faq details[open]{ border-color:#bfe6ff }


.form-card{
  background:#fff; border:1px solid #e6eef6; border-radius: var(--radius);
  padding:18px; box-shadow: var(--shadow);
}
.form-grid{
  display:grid; gap:12px; grid-template-columns: 1fr;
}
@media (min-width:900px){ .form-grid{ grid-template-columns: 1fr 1fr } }
.field{ display:grid; gap:6px }
.field.full{ grid-column: 1 / -1 }
.field label{ font-weight:700 }
.field input, .field select, .field textarea{
  width:100%; padding:10px 12px; border:1px solid #cfe1ef; border-radius:10px;
  background:#f9fdff; font: inherit; color: inherit;
}
.field textarea{ min-height:120px; resize:vertical }
.form-actions{ display:flex; gap:.6rem; flex-wrap:wrap; align-items:center; margin-top:6px }
.muted-small{ color:var(--muted); font-size:.9rem }


.contact-quick{ display:grid; gap:12px; grid-template-columns:1fr }
@media (min-width:900px){ .contact-quick{ grid-template-columns: repeat(3, 1fr) } }
.contact-card{ background:#fff; border:1px solid #e6eef6; border-radius: var(--radius); padding:16px; box-shadow: var(--shadow); display:grid; gap:6px }
.contact-card i{ color:var(--primary) }


.map-embed{ border:1px solid #cfe1ef; border-radius: var(--radius); overflow:hidden; box-shadow: var(--shadow) }

.hero--services-pro{
  background: linear-gradient(135deg,#0f172a 0%,#0ea5e9 100%);
}
.hero--services-pro::before{
  background: linear-gradient(160deg,rgba(15,23,42,.85) 10%,rgba(14,165,233,.35) 90%);
}


.modern-hero .hero-inner{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:3rem;
  align-items:center;
  justify-content:start;
}
.modern-hero .hero-content{
  text-align:left;
  position:relative;
  z-index:3;
}
.modern-hero .hero-visual{
  position:relative;
  z-index:3;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.modern-hero .hero-visual img{
  width:100%;
  max-width:450px;
  border-radius:24px;
  box-shadow:0 24px 48px rgba(0,0,0,.25);
  transition: transform var(--t-med) ease;
}
.modern-hero .hero-visual img:hover{
  transform:scale(1.02);
}
.modern-hero .hero-badge{
  margin-top:1.5rem;
  background: rgba(255,255,255,.95);
  color:#0ea5e9;
  font-weight:700;
  padding:.6rem 1.4rem;
  border-radius:60px;
  font-size:.85rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  box-shadow:0 8px 20px rgba(14,165,233,.2);
  border:1px solid rgba(14,165,233,.3);
}

@media (max-width:960px){
  .modern-hero .hero-inner{
    grid-template-columns:1fr;
    gap:2rem;
    text-align:center;
  }
  .modern-hero .hero-content{ text-align:center; }
  .modern-hero .hero-visual{
    order:-1;
  }
  .modern-hero .hero-pillars{ justify-content:center; }
  .modern-hero .hero-cta{ justify-content:center; }
  .modern-hero .hero-visual img{
    max-width:300px;
  }
}
.hero--services-pro .hero-inner{
  align-items:flex-start;
  text-align:left;
  min-height:70vh;
  padding-top:clamp(4rem,10vw,8rem);
  padding-bottom:clamp(3rem,9vw,6rem);
}
.hero-kicker{
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  font-size:.85rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#e0f2ff;
  background:rgba(255,255,255,.12);
  border-radius:999px;
  padding:.45rem .85rem;
  margin-bottom:1rem;
}
.hero-pillars{
  display:grid;
  gap:.6rem;
  margin:1.4rem 0;
  padding:0;
  list-style:none;
}
.hero-pillars li{
  display:flex;
  align-items:flex-start;
  gap:.6rem;
  color:#e5f6ff;
}
.hero-pillars i{
  font-size:1.1rem;
  color:#22d3ee;
  margin-top:.15rem;
}

.metrics-bar{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:1.2rem;
}
.metric{
  background:#fff;
  border:1px solid #e6eef6;
  border-radius:16px;
  padding:1.4rem;
  text-align:center;
  box-shadow:var(--shadow);
}
.metric-value{
  display:block;
  font-weight:700;
  font-size:clamp(1.8rem,4vw,2.6rem);
  color:var(--primary-600);
}
.metric-label{
  display:block;
  color:var(--muted);
  font-weight:600;
}

.section-expertise{
  position:relative;
  padding-top:4rem;
  background: linear-gradient(160deg,#f3f9ff 0%,#ffffff 35%,#eef6ff 100%);
  overflow:hidden;
  z-index:0;
}
.section-expertise::after{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(120% 80% at 50% -10%, rgba(14,165,233,.22) 0%, rgba(14,165,233,0) 65%);
  opacity:.85;
  pointer-events:none;
  z-index:0;
}
.section-expertise .container{
  position:relative;
  z-index:1;
}

.service-matrix{
  display:grid;
  gap:1.4rem;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
}
.service-card{
  position:relative;
  z-index:0;
  isolation:isolate;
  background: linear-gradient(180deg,rgba(255,255,255,.96) 0%, rgba(238,246,255,.96) 100%);
  border:1px solid rgba(14,165,233,.18);
  border-radius:22px;
  padding:1.8rem;
  display:flex;
  flex-direction:column;
  gap:1rem;
  box-shadow:0 18px 45px rgba(14,165,233,.12);
  overflow:hidden;
  transition: transform var(--t-fast) ease, box-shadow var(--t-fast) ease, border-color var(--t-fast) ease;
}
.service-card::before{
  content:"";
  position:absolute;
  inset:-10% -10% 60% -10%;
  background: linear-gradient(135deg, rgba(14,165,233,.18), rgba(34,211,238,.08));
  border-radius:40%;
  opacity:0;
  transition: opacity var(--t-fast) ease;
  pointer-events:none;
  z-index:-1;
}
.service-card:hover{
  transform:translateY(-8px);
  border-color:rgba(14,165,233,.32);
  box-shadow:0 24px 55px rgba(14,165,233,.18);
}
.service-card:hover::before{ opacity:1; }
.service-card h3{
  margin:0;
  font-size:1.22rem;
  font-weight:700;
  letter-spacing:-.01em;
  color:var(--dark);
}
.service-card p{
  margin:0;
  color:#1f2933;
  font-weight:600;
  line-height:1.65;
}
.service-card ul{
  margin:0;
  padding:0;
  list-style:none;
  display:grid;
  gap:.55rem;
  color:var(--ink);
}
.service-card ul li{
  position:relative;
  padding-left:1.35rem;
  font-weight:500;
}
.service-card ul li::before{
  content:"";
  position:absolute;
  left:0;
  top:.45rem;
  width:8px;
  height:8px;
  border-radius:50%;
  background: linear-gradient(135deg,var(--primary),var(--accent));
  box-shadow:0 0 0 3px rgba(14,165,233,.12);
}
.service-card__cta{
  margin-top:auto;
  font-weight:700;
  color:var(--primary-600);
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  letter-spacing:.01em;
  transition: color var(--t-fast) ease, gap var(--t-fast) ease;
}
.service-card__cta::after{
  content:"\f061";
  font-family:"Font Awesome 6 Free";
  font-weight:900;
  font-size:.9rem;
}
.service-card__cta:hover{
  color:var(--primary);
  gap:.5rem;
}

.benefits-grid{
  display:grid;
  gap:1.2rem;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
}
.benefit-card{
  background:#0f172a;
  color:#e7f6ff;
  border-radius:20px;
  padding:1.4rem;
  display:grid;
  gap:.6rem;
  box-shadow:0 16px 40px rgba(15,23,42,.35);
}
.benefit-card i{ font-size:1.6rem; color:#22d3ee; }
.benefit-card h3{ margin:0; font-size:1.1rem; }
.benefit-card p{ margin:0; color:#d0ecff; }

.case-grid{
  display:grid;
  gap:1.4rem;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
}
.case-card{
  background:#fff;
  border:1px solid #e6eef6;
  border-radius:18px;
  padding:1.6rem;
  box-shadow:var(--shadow);
  display:flex;
  flex-direction:column;
  gap:.9rem;
}
.case-icon{
  width:44px; height:44px; flex:0 0 44px;
  display:grid; place-items:center;
  border-radius:12px; background:#f0f9ff; color:var(--primary);
}
.case-icon i{ font-size:20px; }
.case-card h3{ margin:0; }
.case-card p{ margin:0; color:var(--muted); font-weight:600; }
.case-card ul{
  margin:0;
  padding-left:1.1rem;
  display:grid;
  gap:.4rem;
  color:var(--ink);
  list-style:none;
}
.case-card ul i{ color:var(--accent); margin-right:.35rem; }
.case-card__cta{
  margin-top:auto;
  font-weight:700;
  color:var(--primary-600);
  display:inline-flex;
  align-items:center;
  gap:.35rem;
}
.case-card__cta:hover{ color:var(--primary); }
.case-card__cta::after{
  content:"\f061";
  font-family:"Font Awesome 6 Free";
  font-weight:900;
  font-size:.9rem;
}

.coverage-grid{
  display:grid;
  gap:2rem;
  align-items:center;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
}
.coverage-points{
  list-style:none;
  margin:1.2rem 0;
  padding:0;
  display:grid;
  gap:.8rem;
}
.coverage-points li{
  display:flex;
  gap:.65rem;
  color:var(--muted);
  align-items:flex-start;
}
.coverage-points i{ color:var(--primary-600); margin-top:.25rem; }
.coverage-media{
  min-height:260px;
  border:2px dashed rgba(14,165,233,.4);
  border-radius:24px;
  background: linear-gradient(135deg,rgba(14,165,233,.12),rgba(2,132,199,.08));
}

.sector-cards{
  position:relative;
  display:grid;
  gap:1.6rem;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
}
.sector-card{
  position:relative;
  z-index:0;
  background: linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(240,248,255,.98) 100%);
  border:1px solid rgba(14,165,233,.18);
  border-radius:24px;
  padding:2rem 1.8rem 1.8rem;
  box-shadow:0 20px 48px rgba(15,23,42,.08);
  display:flex;
  flex-direction:column;
  gap:1rem;
  min-height:100%;
  overflow:hidden;
  isolation:isolate;
  transition: transform var(--t-fast) ease, box-shadow var(--t-fast) ease, border-color var(--t-fast) ease;
}
.sector-card::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(135deg, rgba(14,165,233,.22), rgba(2,132,199,.08));
  opacity:.55;
  transform:translateY(-55%);
  transition: transform var(--t-fast) ease, opacity var(--t-fast) ease;
  pointer-events:none;
  z-index:-1;
}
.sector-card:hover{
  transform:translateY(-10px);
  border-color:rgba(14,165,233,.32);
  box-shadow:0 26px 60px rgba(14,165,233,.18);
}
.sector-card:hover::before{
  transform:translateY(-35%);
  opacity:.75;
}
.sector-card__icon{
  width:54px;
  height:54px;
  border-radius:18px;
  background: linear-gradient(135deg,var(--primary),var(--primary-600));
  color:#fff;
  display:grid;
  place-items:center;
  font-size:1.3rem;
  box-shadow:0 12px 30px rgba(14,165,233,.28);
}
.sector-card h3{
  margin:0;
  font-size:1.26rem;
  letter-spacing:-.01em;
  color:var(--dark);
}
.sector-card p{
  margin:0;
  color:#1f3342;
  line-height:1.65;
  font-weight:600;
}
.sector-card ul{
  margin:0;
  padding:0;
  list-style:none;
  display:grid;
  gap:.55rem;
  color:var(--muted);
}
.sector-card ul li{
  position:relative;
  padding-left:1.4rem;
  font-weight:500;
}
.sector-card ul li::before{
  content:"";
  position:absolute;
  left:0;
  top:.42rem;
  width:9px;
  height:9px;
  border-radius:50%;
  background: linear-gradient(135deg,var(--primary),var(--accent));
  box-shadow:0 0 0 3px rgba(14,165,233,.14);
}

.process-steps{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:1rem;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
}
.process-steps li{
  background:#fff;
  border:1px solid #e6eef6;
  border-radius:18px;
  padding:1.4rem;
  display:flex;
  gap:1rem;
  align-items:flex-start;
  box-shadow:var(--shadow);
}
.step-number{
  width:40px;
  height:40px;
  border-radius:50%;
  background:var(--primary-600);
  color:#fff;
  display:grid;
  place-items:center;
  font-weight:700;
}
.process-steps h3{ margin:.1rem 0; font-size:1.1rem; }
.process-steps p{ margin:0; color:var(--muted); }

.process-timeline{
  list-style:none;
  margin:0;
  padding:0;
  --timeline-color: var(--primary);
  --timeline-bg: #f0f9ff;
  display:grid;
  grid-template-columns: repeat(5, 1fr);
  gap:1.2rem;
  align-items:stretch;
}
@media (max-width: 900px){
  .process-timeline{
    grid-template-columns: 1fr;
    --connector-height: 2rem;
  }
}
.process-timeline li{
  background:#fff;
  border:1px solid #e6eef6;
  border-radius: var(--radius);
  padding:1.2rem;
  box-shadow: var(--shadow);
  display:flex;
  flex-direction:column;
  gap:.8rem;
  min-height:200px;
  height:100%; 
}
@media (max-width: 900px){
  .process-timeline li::after{
    display:none;
  }
  .process-timeline li:not(:last-child)::after{
    content:'';
    position:absolute;
    left:calc(48px/2);
    top:calc(100% + 0.5rem);
    transform:translateX(-50%);
    width:2px;
    height:var(--connector-height);
    background: linear-gradient(to bottom, var(--primary), transparent);
  }
}
.step-icon{
  width:48px;
  height:48px;
  border-radius:50%;
  background: linear-gradient(135deg, var(--primary), var(--primary-600));
  color:#fff;
  display:grid;
  place-items:center;
}
.step-icon i{ font-size:20px; }
.step-content h3{ margin:0; font-size:1.1rem; }
.step-content p{ margin:0; color:var(--muted); }

.faq details{
  border:1px solid #e6eef6;
  border-radius:14px;
  padding:1rem 1.2rem;
  background:#fff;
  box-shadow:var(--shadow);
}
.faq summary{
  font-weight:700;
  cursor:pointer;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq details + details{ margin-top:1rem; }

.cta-banner{
  background: linear-gradient(135deg,#0ea5e9,#0284c7);
  color:#fff;
}
.cta-banner__inner{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  align-items:center;
  gap:1.2rem;
}
.cta-banner__actions{ display:flex; gap:.8rem; flex-wrap:wrap; }
.cta-banner .btn-outline{ border-color:#fff; color:#fff; }
.cta-banner .btn-outline:hover{ background:#fff; color:var(--primary-600); }

@media (max-width:760px){
  .benefit-strip__inner{grid-template-columns:1fr;}
  .spotlight-hero{padding:1.6rem;}
  .recommendation-scroll{grid-template-columns:1fr;}
  .mega-hero__inner{grid-template-columns:1fr;}
  .mega-hero__highlights{grid-template-columns:1fr;}
  .product-gallery{grid-template-columns:1fr;}
  .feature-banners{grid-template-columns:1fr;}
  .catalog-card__actions .btn{flex:1 1 100%;}
  .quote-panel{padding:1.3rem;}
  .mega-search{max-width:none;width:100%;}
}
.quote-panel{ padding:1.3rem; }
  .product-media{ height:140px; }






.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
.mega-header{background:#fff;box-shadow:0 6px 20px rgba(15,23,42,.08);}
.mega-nav{flex:1;display:flex;justify-content:flex-end;align-items:center;gap:1rem;}
.mega-nav__inner{display:flex;flex-direction:column;gap:1.2rem;}
.mega-brand{display:flex;align-items:center;gap:1rem;}
.mega-brand__home{font-weight:700;color:var(--primary-600);}
.mega-search{display:flex;flex:1;background:#f1f5f9;border-radius:999px;border:1px solid rgba(148,163,184,.4);padding:.35rem .5rem;max-width:480px;}
.mega-search input{flex:1;border:0;background:transparent;font-family:inherit;}
.mega-search input:focus{outline:none;}
.mega-search button{background:var(--primary-600);color:#fff;border:0;border-radius:999px;width:38px;height:38px;display:grid;place-items:center;cursor:pointer;}
.mega-actions{display:flex;align-items:center;gap:.6rem;}
.mega-action{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:#e2f2ff;color:var(--primary-600);}
.mega-action:hover{background:#d3ecff;}
.mega-links{display:flex;gap:2rem;}
.mega-col{display:grid;gap:.45rem;}
.mega-title{font-weight:700;text-transform:uppercase;font-size:.75rem;color:var(--primary-600);}
.mega-col a{color:var(--ink);font-weight:600;}
.mega-col a:hover{color:var(--primary-600);}
.mega-col--cta{background:#e6f6ff;border-radius:20px;padding:1rem 1.1rem;max-width:260px;box-shadow:0 12px 30px rgba(14,165,233,.18);}
.mega-col--cta p{margin:0 0 .8rem;color:#0f3851;font-weight:600;}
.mega-contact{display:inline-flex;align-items:center;gap:.4rem;color:var(--primary-600);font-weight:700;}

.mega-hero{background:linear-gradient(135deg,#0f172a 0%,#0ea5e9 60%,#22d3ee 100%);color:#fff;padding:clamp(4rem,9vw,7rem) 0 clamp(3rem,8vw,6rem);position:relative;overflow:hidden;}
.mega-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,23,42,.75),rgba(14,165,233,.2));mix-blend-mode:soft-light;}
.mega-hero__inner{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,320px);gap:2.4rem;align-items:start;}
.mega-hero__copy{display:grid;gap:1.2rem;}
.mega-hero__copy h1{margin:0;font-size:clamp(2.2rem,4.5vw,3.4rem);line-height:1.1;}
.mega-hero__copy .lead{max-width:640px;color:#e6f6ff;font-weight:600;}
.mega-hero__highlights{display:grid;gap:1rem;}
.mega-hero__highlights article{background:rgba(255,255,255,.08);border:1px solid rgba(148,205,255,.35);border-radius:20px;padding:1.2rem;display:grid;gap:.4rem;}
.mega-hero__highlights h2{margin:0;font-size:1rem;color:#e6f6ff;}
.mega-hero__highlights p{margin:0;color:#bedffd;font-weight:600;}

.quick-categories__inner{display:grid;gap:1.2rem;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));}
.quick-card{background:#fff;border:1px solid #e6eef6;border-radius:18px;padding:1.2rem;display:grid;gap:.6rem;box-shadow:var(--shadow);}
.quick-card i{font-size:1.6rem;color:var(--primary-600);}
.quick-card h3{margin:0;font-size:1.1rem;}
.quick-card p{margin:0;color:var(--muted);}

.catalog-shell{background:#f5f9ff;}
.catalog-shell__layout{display:grid;gap:2rem;grid-template-columns:minmax(0,1fr) minmax(280px,330px);align-items:start;}
.catalog-main{display:grid;gap:2rem;}
.catalog-head{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1.2rem;align-items:flex-end;}
.catalog-tabs{display:flex;flex-wrap:wrap;gap:.6rem;}
.catalog-tab{border:1px solid rgba(148,163,184,.4);background:#fff;color:var(--muted);padding:.45rem .9rem;border-radius:999px;font-weight:600;cursor:pointer;}
.catalog-tab.is-active{background:var(--primary-600);color:#fff;border-color:var(--primary-600);}
.product-gallery{display:grid;gap:1.4rem;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));}
.catalog-card{background:#fff;border:1px solid #dbe8f4;border-radius:22px;padding:1.5rem;display:grid;gap:1rem;box-shadow:var(--shadow);}
.catalog-card__media{position:relative;height:200px;border-radius:18px;overflow:hidden;background:linear-gradient(135deg,rgba(14,165,233,.18),rgba(2,132,199,.12));display:flex;align-items:flex-end;justify-content:flex-end;}
.catalog-card__media img{width:100%;height:100%;object-fit:cover;transition:transform var(--t-med) ease;}
.catalog-card:hover .catalog-card__media img{transform:scale(1.05);}


.catalog-badge{display:inline-flex;align-items:center;gap:.35rem;padding:.25rem .7rem;border-radius:999px;background:rgba(14,165,233,.15);color:var(--primary-600);font-weight:700;font-size:.8rem;}
.catalog-card__body h3{margin:.4rem 0 0;font-size:1.25rem;}
.catalog-card__body p{margin:0;color:var(--muted);font-weight:600;}
.catalog-card__body ul{margin:.6rem 0 0;padding-left:1.2rem;color:var(--ink);display:grid;gap:.35rem;}
.catalog-card__actions{display:flex;flex-wrap:wrap;gap:.6rem;}
.catalog-card__actions .btn{flex:1 1 180px;text-align:center;}
.catalog-card__actions .btn-outline{border-color:var(--primary-600);color:var(--primary-600);}
.catalog-card__actions .btn-outline:hover{background:var(--primary-600);color:#fff;}

.feature-banners{display:grid;gap:1.2rem;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));}
.feature-banner{background:#0f172a;color:#e8f7ff;border-radius:20px;padding:1.6rem;display:flex;align-items:center;justify-content:space-between;gap:1.2rem;box-shadow:0 18px 40px rgba(15,23,42,.35);}
.feature-banner h3{margin:0;font-size:1.2rem;}
.feature-banner p{margin:0;color:#d9f2ff;max-width:320px;}
.feature-banner--whatsapp{background:linear-gradient(135deg,#0ea5e9,#22d3ee);color:#fff;}
.feature-banner--whatsapp p{color:#f0fbff;}

.quote-panel{position:sticky;top:calc(100px + env(safe-area-inset-top));background:#0f172a;color:#e6f6ff;border-radius:24px;padding:1.6rem;box-shadow:0 24px 50px rgba(15,23,42,.35);display:flex;flex-direction:column;gap:1rem;}
.quote-header{display:flex;justify-content:space-between;align-items:center;gap:1rem;}
.quote-header h2{margin:0;font-size:1.15rem;}
.quote-count{font-size:.95rem;color:#bde6ff;}
.quote-feedback{min-height:1.2rem;margin:0;color:#bde6ff;}
.quote-empty{margin:0;color:#8dbede;}
.quote-list{list-style:none;margin:0;padding:0;display:grid;gap:.6rem;max-height:320px;overflow:auto;}
.quote-item{background:rgba(255,255,255,.08);border:1px solid rgba(173,216,255,.25);border-radius:16px;padding:.75rem 1rem;display:flex;justify-content:space-between;align-items:center;gap:1rem;}
.quote-item span{flex:1;}
.quote-remove{background:transparent;border:1px solid rgba(255,255,255,.35);color:#fff;border-radius:999px;padding:.25rem .7rem;cursor:pointer;font-size:.85rem;}
.quote-remove:hover{background:rgba(255,255,255,.2);}
.quote-actions{display:flex;flex-direction:column;gap:.6rem;}
.quote-actions .btn{width:100%;}
.quote-actions .btn[disabled]{opacity:.45;cursor:not-allowed;}
.quote-benefits{display:grid;gap:.4rem;font-size:.85rem;color:#cbe9ff;}
.quote-benefits i{color:#22d3ee;margin-right:.4rem;}

.insight-grid .insight-rows{display:grid;gap:1.2rem;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));}
.insight-grid article{background:#fff;border:1px solid #dbe8f4;border-radius:20px;padding:1.4rem;box-shadow:var(--shadow);display:grid;gap:.6rem;}
.insight-grid h3{margin:0;font-size:1.1rem;}
.insight-grid p{margin:0;color:var(--muted);}

.section-info{background:#f2f8ff;}
.cotiza-grid{display:grid;gap:1.6rem;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));}
.info-card{background:#fff;border:1px solid #d5e9f9;border-radius:20px;padding:1.6rem;box-shadow:var(--shadow);display:grid;gap:.8rem;}
.info-steps{margin:0;padding-left:1.2rem;display:grid;gap:.4rem;color:var(--muted);}

.mega-hero__visual{position:relative;border-radius:32px;overflow:hidden;min-height:280px;display:flex;align-items:flex-end;justify-content:center;padding:1.5rem;background:linear-gradient(135deg,rgba(255,255,255,.12),rgba(14,165,233,.28));box-shadow:0 24px 60px rgba(15,23,42,.45);}
.mega-hero__visual img{width:100%;height:100%;object-fit:cover;transform:scale(1.02);}
.hero-slider-dots{position:relative;z-index:1;display:flex;gap:.6rem;margin-top:2rem;}
.hero-dot{width:12px;height:12px;border-radius:999px;border:2px solid rgba(255,255,255,.5);background:transparent;cursor:pointer;transition:all var(--t-fast) ease;}
.hero-dot.is-active{width:34px;background:#fff;border-color:#fff;}

.benefit-strip{background:#f1f7ff;border-bottom:1px solid #dbe8f4;}
.benefit-strip__inner{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;padding:1.6rem 0;}
.benefit-item{display:flex;gap:.8rem;align-items:flex-start;background:#fff;border:1px solid #e1ecf6;border-radius:18px;padding:1rem;box-shadow:var(--shadow);}
.benefit-item i{font-size:1.6rem;color:var(--primary-600);margin-top:.1rem;}
.benefit-item h3{margin:0;font-size:1rem;}
.benefit-item p{margin:.2rem 0 0;color:var(--muted);font-weight:600;}

.quick-card__media{width:100%;height:140px;border-radius:14px;overflow:hidden;}
.quick-card__media img{width:100%;height:100%;object-fit:cover;transition:transform var(--t-med) ease;}
.quick-card:hover .quick-card__media img{transform:scale(1.05);}

.catalog-label{position:absolute;top:16px;left:16px;padding:.35rem .9rem;border-radius:999px;background:rgba(15,23,42,.75);color:#fff;font-weight:700;font-size:.75rem;letter-spacing:.02em;text-transform:uppercase;}
.catalog-label--new{background:rgba(34,211,238,.9);color:#0f172a;}
.catalog-label--hot{background:rgba(255,159,67,.9);color:#fff;}
.catalog-label--save{background:rgba(34,197,94,.85);}
.catalog-label--pro{background:rgba(2,132,199,.9);}
.catalog-label--rgb{background:rgba(129,140,248,.85);}
.catalog-label--eco{background:rgba(16,185,129,.85);}
.catalog-label--shield{background:rgba(15,23,42,.85);}

.catalog-meta{display:flex;justify-content:space-between;align-items:center;margin-top:.9rem;font-weight:700;color:var(--muted);}
.catalog-price{color:var(--primary-600);font-size:1rem;}
.catalog-sku{font-size:.85rem;color:rgba(15,23,42,.6);}

.catalog-insights{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));}
.catalog-insight{background:#fff;border:1px solid #dbe8f4;border-radius:18px;padding:1.4rem;box-shadow:var(--shadow);display:grid;gap:.6rem;}
.catalog-insight h3{margin:0;font-size:1.1rem;}
.catalog-insight p{margin:0;color:var(--muted);}

.product-spotlight{background:#0f172a;color:#e6f6ff;}
.product-spotlight__inner{display:grid;gap:1.8rem;}
.spotlight-hero{display:grid;gap:1.6rem;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));align-items:center;background:linear-gradient(135deg,rgba(15,23,42,.95),rgba(14,165,233,.35));border-radius:24px;padding:2rem;box-shadow:0 24px 50px rgba(15,23,42,.45);}
.spotlight-hero__copy h2{margin:0;font-size:clamp(1.8rem,3vw,2.4rem);}
.spotlight-hero__copy p{margin:.6rem 0 1.4rem;max-width:520px;color:#cbe9ff;}
.spotlight-hero__media img{width:100%;border-radius:20px;box-shadow:0 20px 40px rgba(8,15,30,.4);}
.spotlight-cta{display:flex;gap:.8rem;flex-wrap:wrap;}
.spotlight-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.2rem;}
.spotlight-card{background:#fff;color:var(--ink);border:1px solid #dbe8f4;border-radius:20px;padding:1.4rem;box-shadow:var(--shadow);display:grid;gap:.6rem;}
.spotlight-card h3{margin:0;font-size:1.05rem;}
.spotlight-card p{margin:0;color:var(--muted);}

.trending-shelf{background:#fff;}
.trending-head{display:flex;justify-content:space-between;align-items:center;gap:1rem;}
.trending-filters{display:flex;flex-wrap:wrap;gap:.6rem;}
.trending-filter{border:1px solid #d1e3f2;background:#fff;color:var(--muted);padding:.35rem .8rem;border-radius:999px;font-weight:600;cursor:pointer;}
.trending-filter.is-active{background:var(--primary-600);color:#fff;border-color:var(--primary-600);}
.trending-grid{display:grid;gap:1.2rem;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));}
.trend-card{background:#fff;border:1px solid #dbe8f4;border-radius:20px;box-shadow:var(--shadow);display:grid;overflow:hidden;}
.trend-card__media{height:180px;overflow:hidden;}
.trend-card__media img{width:100%;height:100%;object-fit:cover;transition:transform var(--t-med) ease;}
.trend-card:hover .trend-card__media img{transform:scale(1.05);}
.trend-card__body{padding:1.2rem;display:grid;gap:.55rem;}
.trend-tag{display:inline-flex;align-items:center;padding:.25rem .7rem;border-radius:999px;background:rgba(14,165,233,.15);color:var(--primary-600);font-weight:700;font-size:.8rem;}
.trend-tag--accent{background:rgba(34,211,238,.2);color:#0f172a;}
.trend-tag--dark{background:#0f172a;color:#e0f3ff;}
.trend-card__meta{display:flex;justify-content:space-between;align-items:center;gap:.6rem;}
.trend-price{color:var(--primary-600);font-weight:700;}

.top-categories__grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));}
.top-category{background:#fff;border:1px solid #dbe8f4;border-radius:20px;padding:1.3rem;box-shadow:var(--shadow);display:grid;gap:.5rem;}
.top-category i{font-size:1.6rem;color:var(--primary-600);}
.top-category h3{margin:0;}
.top-category p{margin:0;color:var(--muted);}

.recommendation-scroll{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));}
.recommendation-card{background:#fff;border:1px solid #dbe8f4;border-radius:18px;padding:1rem;box-shadow:var(--shadow);display:grid;gap:.7rem;text-align:center;}
.recommendation-card__media{height:140px;border-radius:14px;overflow:hidden;}
.recommendation-card__media img{width:100%;height:100%;object-fit:cover;}
.recommendation-price{color:var(--primary-600);font-weight:700;}
@media (max-width:1200px){
  .mega-links{flex-direction:column;gap:1.4rem;}
  .mega-col--cta{max-width:none;}
}
@media (max-width:1024px){
  .spotlight-hero{grid-template-columns:1fr;}
  .trending-head{flex-direction:column;align-items:flex-start;}
  .mega-nav__inner{position:fixed;top:0;right:0;bottom:0;width:min(320px,85vw);background:#fff;padding:1.6rem;box-shadow:-24px 0 48px rgba(15,23,42,.25);transform:translateX(105%);transition:transform var(--t-med) ease;overflow:auto;z-index:1200;}
  body.menu-open .mega-nav__inner{transform:translateX(0);}
  .mega-brand{flex-direction:column;align-items:flex-start;}
  .mega-links{flex-direction:column;}
  .mega-actions{display:none;}
  .catalog-shell__layout{grid-template-columns:1fr;}
  .quote-panel{position:relative;top:auto;}
}
@media (max-width:760px){
  .benefit-strip__inner{grid-template-columns:1fr;}
  .spotlight-hero{padding:1.6rem;}
  .recommendation-scroll{grid-template-columns:1fr;}
  .mega-hero__inner{grid-template-columns:1fr;}
  .mega-hero__highlights{grid-template-columns:1fr;}
  .product-gallery{grid-template-columns:1fr;}
  .feature-banners{grid-template-columns:1fr;}
  .catalog-card__actions .btn{flex:1 1 100%;}
  .quote-panel{padding:1.3rem;}
  .mega-search{max-width:none;width:100%;}
}







.product-megamenu{ background:#fff; border-bottom:1px solid rgba(15,23,42,.08); box-shadow:0 14px 30px rgba(15,23,42,.08); position:relative; z-index:60; padding-bottom:0; }
.product-megamenu .container{ position:relative; }
.product-megamenu__list{ list-style:none; margin:0; padding:.75rem 0; display:flex; flex-wrap:wrap; gap:.5rem; justify-content:space-between; align-items:stretch; overflow:visible; }
.product-megamenu__item{ position:static; flex:1 1 160px; min-width:150px; }
.product-megamenu__toggle{ width:100%; border:1px solid transparent; background:transparent; font-weight:700; font-size:.9rem; line-height:1.25; padding:.55rem 1rem; border-radius:999px; cursor:pointer; color:var(--ink); display:flex; align-items:center; justify-content:center; gap:.35rem; text-align:center; white-space:normal; min-height:2.75rem; transition:background var(--t-fast) ease, color var(--t-fast) ease, box-shadow var(--t-fast) ease; }
.product-megamenu__toggle:hover,
.product-megamenu__toggle:focus-visible,
.product-megamenu__item.is-open > .product-megamenu__toggle{ background:rgba(14,165,233,.15); color:var(--primary-600); box-shadow:0 10px 22px rgba(14,165,233,.18); outline:none; }
.product-megamenu__panel{ position:absolute; top:100%; left:50%; transform:translateX(-50%); width:100%; max-width:100%; padding:2.2rem 2.4rem; border-radius:28px; background:#fff; box-shadow:0 40px 80px rgba(15,23,42,.18); border:1px solid rgba(14,165,233,.16); box-sizing:border-box; display:none; }
.product-megamenu__item--left > .product-megamenu__panel,
.product-megamenu__item--right > .product-megamenu__panel{ left:50%; right:auto; transform:translateX(-50%); }
.product-megamenu__panel[hidden]{ display:none !important; }
.product-megamenu__item.is-open > .product-megamenu__panel{ display:block; }
.product-megamenu__columns{ display:grid; gap:1.6rem; grid-template-columns:repeat(3, minmax(190px,1fr)); }
.product-megamenu__column{ display:grid; gap:.6rem; }
.product-megamenu__title{ text-transform:uppercase; font-size:.78rem; letter-spacing:.08em; font-weight:700; color:var(--muted); }
.product-megamenu__links{ list-style:none; margin:0; padding:0; display:grid; gap:.45rem; }
.product-megamenu__links > li > a{ font-weight:600; color:var(--ink); transition:color var(--t-fast) ease; }
.product-megamenu__links > li > a:hover{ color:var(--primary-600); }
.product-megamenu__sublinks{ list-style:none; margin:.35rem 0 0; padding:0 0 0 1.1rem; display:grid; gap:.3rem; }
.product-megamenu__sublinks a{ font-size:.85rem; font-weight:500; color:var(--muted); }
.product-megamenu__sublinks a:hover{ color:var(--primary-600); }

@media (max-width: 1200px){
  .product-megamenu__columns{ grid-template-columns:repeat(2, minmax(180px,1fr)); }
}

@media (max-width: 1023px){
  .product-megamenu{ box-shadow:none; padding-bottom:0; }
  .product-megamenu__list{ gap:.6rem; justify-content:flex-start; }
  .product-megamenu__item{ position:relative; flex:1 1 100%; min-width:0; }
  .product-megamenu__toggle{ justify-content:flex-start; padding:.55rem 1rem; white-space:normal; }
  .product-megamenu__panel{
    position:static;
    left:auto;
    right:auto;
    transform:none;
    width:100%;
    max-width:calc(100vw - clamp(2rem, 6vw, 3rem));
    margin-top:.4rem;
    margin-inline:auto;
    padding:1.35rem clamp(1rem, 5vw, 1.4rem);
    border-radius:20px;
    box-shadow:none;
  }
  .product-megamenu__item--left > .product-megamenu__panel,
  .product-megamenu__item--right > .product-megamenu__panel{
    left:auto;
    right:auto;
    transform:none;
  }
  .product-megamenu__columns{ grid-template-columns:repeat(auto-fit, minmax(min(220px, 100%),1fr)); gap:1rem; }
  .product-megamenu__links,
  .product-megamenu__sublinks{ overflow-wrap:anywhere; }
}

@media (max-width: 768px){
  .product-megamenu .container{ width:100%; padding-inline:clamp(1rem, 5vw, 1.5rem); }
  .product-megamenu__panel{
    max-width:calc(100vw - clamp(2rem, 6vw, 3rem));
    margin-inline:auto;
    left:auto;
    right:auto;
    transform:none;
  }
  .product-megamenu__item--left > .product-megamenu__panel,
  .product-megamenu__item--right > .product-megamenu__panel{
    transform:none;
  }
  .product-megamenu__columns{ grid-template-columns:repeat(auto-fit, minmax(min(220px, 100%),1fr)); }
}

@media (max-width: 640px){
  .product-megamenu__panel{
    padding:1.25rem 1rem;
    margin-inline:0;
    max-width:100%;
  }
  .product-megamenu__columns{ grid-template-columns:1fr; }
  .product-megamenu__links{ gap:.35rem; }
  .product-megamenu__sublinks{ padding-left:.85rem; }
}
.storefront-toolbar{display:none;}
.storefront-overlay{display:none;}

@media (max-width:960px){
  .storefront-toolbar{
    --toolbar-height:56px;
    position:sticky;
    top:calc(var(--hero-offset,120px));
    z-index:130;
    display:flex;
    align-items:center;
    gap:.75rem;
    padding:.6rem 1rem;
    background:rgba(255,255,255,.94);
    border-bottom:1px solid rgba(15,23,42,.08);
    backdrop-filter:blur(8px);
    margin-bottom:.2rem;
  }
  .toolbar-btn{
    display:flex;align-items:center;gap:.45rem;
    border:1px solid #cbdceb;
    background:#fff;
    color:var(--ink);
    padding:.5rem .9rem;
    border-radius:999px;
    font-weight:600;
    box-shadow:0 6px 16px rgba(15,23,42,.08);
  }
  .toolbar-btn i{color:var(--primary-600);}
  .toolbar-sort{margin-left:auto;flex:1;display:flex;justify-content:flex-end;}
  .toolbar-sort select{width:100%;max-width:220px;}
  .storefront-products__controls{display:none;}
  .storefront-overlay{
    position:fixed;inset:0;
    background:rgba(15,23,42,.35);
    backdrop-filter:blur(2px);
    z-index:140;
    display:none;
  }
  body.filters-open .storefront-overlay,
  body.mega-open .storefront-overlay{display:block;}
  body.filters-open,
  body.mega-open{overflow:hidden;}
  .filter-sidebar{
    position:absolute;
    top:calc(var(--hero-offset,120px) + var(--toolbar-height,56px));
    bottom:0;
    left:0;
    width:min(320px,85%);
    max-width:360px;
    padding:1.2rem 1rem;
    background:#fff;
    box-shadow:0 25px 55px rgba(15,23,42,.25);
    transform:translateX(-105%);
    transition:transform .3s ease;
    z-index:150;
    overflow:auto;
    pointer-events:none;
  }
  body.filters-open .filter-sidebar{transform:translateX(0);pointer-events:auto;}
  .storefront-overview__grid{grid-template-columns:1fr;}
  .storefront-products{padding:1rem;}
  .product-megamenu{
    position:fixed;
    top:calc(var(--hero-offset,120px) + var(--toolbar-height,56px));
    left:0;right:0;bottom:0;
    background:#fff;
    transform:translateX(-105%);
    transition:transform .3s ease;
    z-index:150;
    overflow:auto;
    padding-bottom:2rem;
    pointer-events:none;
  }
  body.mega-open .product-megamenu{transform:translateX(0);pointer-events:auto;}
  .storefront{--store-gap:.2rem;gap:.2rem;}
  .storefront>section:not(.store-hero){padding-block:.75rem;}
  .storefront>section:first-of-type{padding-top:0;}
  .storefront-overview{padding-top:var(--toolbar-height);padding-bottom:1rem;}
}
.storefront{
  --store-gap:clamp(.8rem,2vw,1.2rem);
  gap:var(--store-gap);
  background:#f5f9ff;
  display:grid;
}
.storefront>section:not(.store-hero){padding-block:clamp(.6rem,1.5vw,1rem);}
.store-hero{
  position:relative;
  --hero-bottom-pad:clamp(.3rem,1vw,.6rem);
  padding-block:0 var(--hero-bottom-pad);
  background:linear-gradient(180deg,rgba(15,23,42,1) 0%,rgba(15,23,42,.92) 22%,rgba(14,165,233,.08) 100%);
  min-height:clamp(320px, 45vh, 480px);
  display:flex;
  align-items:center;
  margin-bottom:calc(-1 * (var(--store-gap,0px) + var(--hero-bottom-pad)));
  padding-bottom:var(--hero-bottom-pad);
}

.store-hero__inner{
  width:100%;
  display:flex;
  align-items:stretch;
  justify-content:center;
}

.store-hero__main{
  position:relative;
  width:100%;
  background:#0f172a;
  border-radius:32px;
  overflow:hidden;
  padding:clamp(2.4rem,5vw,3.6rem);
  color:#e6f6ff;
  min-height:clamp(520px,70vh,760px);
  box-shadow:0 30px 60px rgba(15,23,42,.35);
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.hero-slider__track{position:relative;flex:1 1 auto;min-height:clamp(480px,60vh,680px);transition:height .45s ease;}
.hero-slide{
  position:absolute;
  inset:0;
  display:grid;
  grid-template-columns:minmax(0,.95fr) minmax(260px,1fr);
  gap:clamp(1.4rem,4vw,2.6rem);
  align-items:center;
  opacity:0;
  transform:translateX(8%);
  pointer-events:none;
  transition:opacity .5s ease,transform .6s ease;
}
.hero-slide.is-active{opacity:1;transform:translateX(0);pointer-events:auto;}
.hero-slide__copy{display:grid;gap:1.1rem;align-content:start;max-width:540px;}
.hero-slide__copy h1,
.hero-slide__copy h2{margin:0;font-size:clamp(2rem,4vw,3rem);line-height:1.1;}
.slide-actions{display:flex;flex-wrap:wrap;gap:.9rem;}
.slide-benefits{margin:0;padding-left:1.1rem;display:grid;gap:.35rem;color:#cbe9ff;font-weight:600;}
.hero-slide__media{margin:0;align-self:center;display:flex;align-items:center;justify-content:center;}
.hero-slide__media img{width:100%;max-height:clamp(320px,55vh,560px);border-radius:28px;box-shadow:0 24px 40px rgba(8,17,31,.45);object-fit:cover;}
.hero-slider__dots{position:absolute;left:0;right:0;bottom:clamp(1rem,3vw,2.6rem);display:flex;justify-content:center;gap:.5rem;}
.hero-slider__dots button{
  width:12px;height:12px;border-radius:999px;
  border:0;background:rgba(230,246,255,.45);
  text-indent:-9999px;overflow:hidden;
  cursor:pointer;transition:all var(--t-fast) ease;
}
.hero-slider__dots button.is-active{background:#fff;width:32px;}
.store-hero__aside{display:grid;gap:1.4rem;grid-template-columns:1fr;}
.hero-widget{
  position:relative;
  background:#fff;
  border:1px solid #dbe8f4;
  border-radius:24px;
  padding:1.6rem;
  display:grid;
  gap:1.1rem;
  box-shadow:var(--shadow);
  color:var(--ink);
}
.hero-widget img{width:100%;border-radius:18px;object-fit:cover;}
.hero-widget__tag{
  display:inline-flex;
  align-items:center;
  padding:.25rem .8rem;
  border-radius:999px;
  background:rgba(14,165,233,.12);
  color:var(--primary-600);
  font-size:.75rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.05em;
}
.hero-widget__cta{display:inline-flex;align-items:center;gap:.4rem;font-weight:700;color:var(--primary-600);}
.hero-widget__cta:hover{color:var(--primary);}
.hero-widget--accent{background:linear-gradient(135deg,rgba(14,165,233,.12),rgba(34,211,238,.22));border-color:rgba(14,165,233,.25);}
.hero-widget--accent .hero-widget__tag{background:rgba(255,255,255,.65);color:#0f172a;}
.storefront-overview{padding-top:clamp(.4rem,1vw,.8rem);padding-bottom:clamp(.6rem,1.5vw,1rem);}
.storefront{gap:clamp(.8rem,3vw,1.6rem);}
.storefront-overview__grid{display:grid;gap:clamp(1.6rem,4vw,2.6rem);align-items:start;}
.filter-sidebar{background:#fff;border:1px solid #dbe8f4;border-radius:24px;padding:1.8rem 1.5rem;box-shadow:var(--shadow);display:grid;gap:1.6rem;}
.filter-sidebar__title{margin:0;font-size:1.15rem;font-weight:700;color:var(--ink);}
.filter-sidebar__form{display:grid;gap:1.4rem;}
.filter-sidebar__group{display:grid;gap:.6rem;}
.filter-sidebar__group legend{margin:0;font-size:.95rem;font-weight:700;color:var(--ink);}
.filter-sidebar__list{margin:0;padding:0;list-style:none;display:grid;gap:.45rem;}
.filter-sidebar__check{display:flex;align-items:center;gap:.6rem;color:var(--muted);font-weight:600;}
.filter-sidebar__check input{width:18px;height:18px;border-radius:4px;border:1px solid #aac7e0;accent-color:var(--primary);}
.filter-sidebar__action{display:flex;gap:.75rem;flex-wrap:wrap;}
.filter-sidebar__action .btn{flex:1;}
.storefront-products{background:#fff;border:1px solid #dbe8f4;border-radius:28px;padding:clamp(.8rem,2vw,1.2rem);box-shadow:0 35px 60px rgba(15,23,42,.08);display:grid;gap:1.2rem;}
.storefront-products__head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;}
.storefront-products__title{margin:0;font-size:1.5rem;}
.storefront-products__meta{color:var(--muted);font-weight:600;}
.storefront-products__controls{display:flex;align-items:center;gap:.8rem;}
.storefront-products__sort{padding:.55rem 1.4rem;border:1px solid #cbdceb;border-radius:999px;background:#f8fbff;font-weight:600;color:var(--ink);}
.storefront-products__sort:focus{outline:2px solid var(--primary);outline-offset:2px;}
.storefront-products__grid{min-height:300px;border:1px dashed rgba(2,132,199,.25);border-radius:24px;padding:2.4rem;display:grid;place-items:center;text-align:center;color:var(--muted);font-weight:600;}
.storefront-products__placeholder strong{display:block;color:var(--primary-600);margin-bottom:.35rem;}

@media (min-width:961px){
  .storefront-overview__grid{grid-template-columns:minmax(220px,280px) minmax(0,1fr);}
  .filter-sidebar{position:sticky;top:calc(var(--hero-offset,120px) + 1.5rem);}
}

.product-showcase{padding-block:0;}
.product-showcase .container{
  background:#fff;
  border-radius:30px;
  padding:clamp(2.2rem,5vw,3rem);
  box-shadow:0 25px 50px rgba(15,23,42,.09);
  display:grid;
  gap:2rem;
}
.product-tabs{display:flex;flex-wrap:wrap;gap:.8rem;}
.product-tab{
  border:1px solid #cbdceb;
  background:#f8fbff;
  color:var(--muted);
  padding:.55rem 1.3rem;
  border-radius:999px;
  font-weight:700;
  cursor:pointer;
  transition:all var(--t-fast) ease;
}
.product-tab.is-active{background:linear-gradient(135deg,var(--primary),var(--primary-600));color:#fff;border-color:transparent;box-shadow:0 12px 24px rgba(14,165,233,.35);}
.product-panels{display:grid;gap:1.6rem;}
.product-panel[hidden]{display:none;}
.product-grid{display:grid;gap:1.4rem;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));}
.product-card{
  background:#fff;
  border:1px solid #dbe8f4;
  border-radius:26px;
  padding:1.4rem;
  display:grid;
  gap:1rem;
  box-shadow:var(--shadow);
  position:relative;
}
.product-card__media{
  position:relative;
  height:210px;
  border-radius:20px;
  overflow:hidden;
  background:linear-gradient(135deg,rgba(14,165,233,.2),rgba(2,132,199,.12));
  display:flex;
  align-items:center;
  justify-content:center;
}
.product-card__media img{width:100%;height:100%;object-fit:cover;transition:transform var(--t-med) ease;}
.product-card:hover .product-card__media img{transform:scale(1.05);}
.product-tag{
  position:absolute;
  top:16px;
  left:16px;
  padding:.3rem .9rem;
  border-radius:999px;
  background:rgba(15,23,42,.78);
  color:#fff;
  font-size:.75rem;
  font-weight:700;
  letter-spacing:.05em;
  text-transform:uppercase;
}
.product-tag--accent{background:rgba(34,211,238,.85);color:#0f172a;}
.product-tag--dark{background:rgba(2,132,199,.85);}
.product-card__category{font-weight:700;color:var(--primary-600);text-transform:uppercase;font-size:.75rem;letter-spacing:.05em;}
.product-card__title{margin:.25rem 0;font-size:1.2rem;}
.rating{display:flex;align-items:center;gap:.25rem;color:#ffb400;font-size:.9rem;}
.rating__value{margin-left:.35rem;font-weight:700;color:var(--muted);}
.product-card__excerpt{margin:.4rem 0;color:var(--muted);}
.product-card__price{display:flex;flex-direction:column;gap:.15rem;font-weight:700;color:var(--primary-600);}
.price-note{font-size:.85rem;color:var(--muted);font-weight:600;}
.product-card__actions{display:flex;align-items:center;gap:.8rem;flex-wrap:wrap;}
.product-card__actions .btn{flex:1 1 auto;}
.product-card__wishlist{
  border:1px solid #d1e3f5;
  background:#f8fbff;
  color:var(--primary-600);
  border-radius:999px;
  padding:.55rem .8rem;
  cursor:pointer;
  transition:all var(--t-fast) ease;
}
.product-card__wishlist:hover{background:var(--primary-600);color:#fff;border-color:var(--primary-600);}
.banner-strip{padding-block:clamp(2.2rem,5vw,3rem);}
.banner-strip__grid{display:grid;gap:1.4rem;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));}
.banner-card{
  background:linear-gradient(135deg,#0f172a,#1e2b47);
  color:#e6f6ff;
  border-radius:26px;
  padding:2rem;
  display:grid;
  gap:1rem;
  box-shadow:0 30px 60px rgba(15,23,42,.3);
}
.banner-card h3{margin:0;font-size:1.4rem;}
.banner-card p{margin:0;color:#cbe9ff;max-width:340px;}
.banner-card__cta{display:inline-flex;align-items:center;gap:.5rem;font-weight:700;color:#fff;}
.banner-card__cta:hover{color:var(--accent);}
.banner-card--light{background:linear-gradient(135deg,rgba(14,165,233,.18),#fff);color:var(--ink);border:1px solid #cbe3f6;box-shadow:var(--shadow);}
.banner-card--light .banner-card__cta{color:var(--primary-600);}
.feature-split{padding-block:clamp(2.8rem,6vw,4rem);}
.feature-split__inner{display:grid;gap:2rem;grid-template-columns:minmax(0,1.4fr) minmax(240px,1fr);align-items:stretch;}
.feature-showcase{
  background:#fff;
  border-radius:28px;
  border:1px solid #dbe8f4;
  padding:clamp(2rem,5vw,2.6rem);
  box-shadow:var(--shadow);
  display:grid;
  gap:1.6rem;
}
.feature-showcase__copy{display:grid;gap:1.2rem;}
.feature-showcase__list{margin:0;padding-left:1.2rem;display:grid;gap:.5rem;color:var(--muted);font-weight:600;}
.feature-showcase__list i{color:var(--primary-600);margin-right:.4rem;}
.feature-showcase__media{margin:0;}
.feature-showcase__media img{width:100%;border-radius:24px;object-fit:cover;box-shadow:0 24px 40px rgba(8,15,30,.25);}
.feature-showcase__actions{display:flex;flex-wrap:wrap;gap:.8rem;}
.feature-list{
  background:#fff;
  border:1px solid #dbe8f4;
  border-radius:26px;
  padding:2rem;
  box-shadow:var(--shadow);
  display:grid;
  gap:1.2rem;
  align-content:start;
}
.feature-list ul{margin:0;display:grid;gap:.8rem;padding:0;list-style:none;}
.feature-list li{display:flex;justify-content:space-between;gap:.8rem;font-weight:600;color:var(--ink);}
.deal-zone__grid{display:grid;gap:1.4rem;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));}
.deal-card{
  background:#fff;
  border:1px solid #dbe8f4;
  border-radius:22px;
  padding:1.6rem;
  display:grid;
  gap:.8rem;
  box-shadow:var(--shadow);
}
.deal-card h3{margin:0;font-size:1.2rem;}
.deal-card p{margin:0;color:var(--muted);}
.deal-tag{display:inline-flex;align-items:center;padding:.25rem .75rem;border-radius:999px;background:rgba(14,165,233,.15);color:var(--primary-600);font-weight:700;font-size:.75rem;letter-spacing:.05em;text-transform:uppercase;}
.deal-card--accent{background:linear-gradient(135deg,var(--primary),var(--primary-600));color:#fff;border-color:transparent;}
.deal-card--accent .service-card__cta{color:#e6f6ff;}
.best-sellers{padding-block:clamp(2.4rem,6vw,4rem);}
.best-sellers__grid{display:grid;gap:1.2rem;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));}
.product-card--compact{gap:1rem;padding:1.2rem;}
.product-card--compact .product-card__media{height:160px;}
.product-card--compact .product-card__actions{justify-content:flex-start;}
.brand-strip{background:#fff;padding-block:2rem;}
.brand-strip__inner{display:flex;gap:1.4rem;flex-wrap:wrap;justify-content:center;font-weight:700;color:var(--primary-600);}
.brand-strip__inner span{padding:.5rem 1.2rem;border-radius:999px;background:rgba(14,165,233,.12);}
.newsletter{background:linear-gradient(135deg,rgba(14,165,233,.18),rgba(2,132,199,.08));padding-block:clamp(2.8rem,6vw,4.6rem);}
.newsletter__inner{display:flex;gap:2rem;align-items:center;justify-content:space-between;flex-wrap:wrap;}
.newsletter__inner h2{margin:0;max-width:520px;}
.newsletter__form{display:flex;gap:.8rem;flex-wrap:wrap;align-items:center;}
.newsletter__form input{min-width:260px;padding:.8rem 1rem;border-radius:14px;border:1px solid #dbe8f4;font-size:1rem;}
.newsletter__form input:focus{outline:2px solid var(--primary-600);outline-offset:2px;}
@media (max-width:1200px){
  .hero-slide{grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
}

@media (max-width:960px){
  .storefront{gap:.2rem;}
  .storefront>section:first-of-type{padding-top:0;}
  .hero-slide{grid-template-columns:1fr;}
  .hero-slide__media{order:-1;}
  .hero-slider__arrow--prev{left:.5rem;}
  .hero-slider__arrow--next{right:.5rem;}
  .product-showcase .container{padding:2rem;}
  .feature-split__inner{grid-template-columns:1fr;}
  .feature-list{order:-1;}
  .storefront-overview__grid{grid-template-columns:1fr;}
  .filter-sidebar{padding:1.1rem .9rem;}
  .filter-sidebar__action .btn{flex:1 1 45%;}
  .storefront-products{padding:1rem;}
}
@media (max-width:720px){
  .store-hero__main{min-height:auto;}
  .hero-slider__track{min-height:auto;}
  .hero-slide__copy{max-width:100%;}
  .hero-slide__media img{max-height:clamp(220px,60vw,360px);}
  .filter-sidebar{padding:.9rem;}
  .filter-sidebar__action .btn{flex:1 1 48%;}
  .storefront-products{padding:.9rem;}
  .storefront>section:first-of-type{padding-top:0;}
  .newsletter__inner{flex-direction:column;align-items:flex-start;}
  .newsletter__form{width:100%;}
  .newsletter__form input{flex:1 1 auto;width:100%;}
  .hero-slider__dots{bottom:.75rem;}
}
@media (max-width:560px){
  .storefront>section{padding-block:2.2rem;}
  .hero-slider__track{min-height:360px;}
  .hero-slide__copy h1,
  .hero-slide__copy h2{font-size:clamp(1.8rem,8vw,2.4rem);}
  .store-hero__main{padding:2rem;}
  .product-grid{grid-template-columns:1fr;}
  .feature-list ul li{flex-direction:column;align-items:flex-start;}
  .best-sellers__grid{grid-template-columns:1fr;}
}