/*
Theme Name: ISPACOM
Theme URI: https://ispacompany.es
Description: Tema a medida para ISPA Company — alquiler y venta de maquinaria de elevación, acceso y obra. Recreación del diseño «ISPA Company - Home» (Hero Split + Maquinaria Índice).
Author: Chilly Pills
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
Text Domain: ispacom
*/

/* ============================================================
   TOKENS
   ============================================================ */
:root{
  --ispa-dark:#222222;
  --ispa-dark-2:#1c1c1c;
  --ispa-dark-3:#1a1a1a;
  --ispa-dark-4:#181818;
  --ispa-yellow:#E9AE14;
  --ispa-gray:#666666;
  --ispa-card:#f0efe9;
  --ispa-max:1360px;
  --ispa-pad:48px;
  --ff-display:'Archivo',sans-serif;
  --ff-body:'Hanken Grotesk',sans-serif;
  --ff-mono:'IBM Plex Mono',monospace;
}

/* ============================================================
   BASE
   ============================================================ */
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--ispa-dark);
  color:var(--ispa-dark);
  font-family:var(--ff-body);
  -webkit-font-smoothing:antialiased;
}
::selection{background:var(--ispa-yellow);color:var(--ispa-dark);}
a{color:inherit;}
img{max-width:100%;}

.ispa-root{
  background:#ffffff;
  color:var(--ispa-dark);
  font-family:var(--ff-body);
  overflow-x:clip;
  position:relative;
}

@keyframes ispaMarquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.ispa-track::-webkit-scrollbar{display:none;}

/* fill an image into a [FOTO] placeholder box */
.ispa-fill{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;}

/* ============================================================
   HOVER STATES (porting design `style-hover`)
   ============================================================ */
[data-arrow]{transition:transform .4s cubic-bezier(.16,1,.3,1),color .3s;}

/* nav + phone */
.ispa-nav-a{transition:color .3s;}
.ispa-nav-a:hover{color:var(--ispa-yellow);}
.ispa-tel:hover{color:var(--ispa-yellow);}

/* primary yellow CTA */
.ispa-cta{transition:filter .3s;}
.ispa-cta:hover{filter:brightness(.9);}
.ispa-cta:hover [data-arrow]{transform:translateX(6px);}

/* ghost / underline CTA */
.ispa-cta-ghost{transition:color .3s,border-color .3s;}
.ispa-cta-ghost:hover{color:var(--ispa-yellow);border-color:var(--ispa-yellow)!important;}
.ispa-cta-ghost:hover [data-arrow]{transform:translateX(6px);}

/* contact big links */
.ispa-contact-a:hover{color:var(--ispa-yellow);}

/* footer links */
.ispa-foot-a{transition:color .3s;}
.ispa-foot-a:hover{color:#ffffff;}
.ispa-foot-legal{transition:color .3s;}
.ispa-foot-legal:hover{color:var(--ispa-yellow);}

/* carousel arrows */
.ispa-navbtn{transition:background .3s,color .3s,border-color .3s;}
.ispa-navbtn:hover{background:var(--ispa-yellow);border-color:var(--ispa-yellow);color:var(--ispa-dark);}

/* featured cards */
.ispa-feat{transition:transform .5s cubic-bezier(.16,1,.3,1);}
.ispa-feat:hover{transform:translateY(-6px);}
.ispa-feat:hover [data-featimg]{transform:scale(1.07);}
.ispa-feat:hover [data-arrow]{transform:translateX(6px);color:var(--ispa-dark);}

/* maquinaria índice rows */
.ispa-idx-row{transition:background-color .45s ease;}
.ispa-idx-row:hover{background-color:var(--ispa-dark)!important;}
.ispa-idx-row:hover [data-idxh3]{color:#ffffff;}
.ispa-idx-row:hover [data-idxmeta]{color:rgba(255,255,255,.6);}
.ispa-idx-row:hover [data-idxstat]{color:var(--ispa-yellow);}
.ispa-idx-row:hover [data-idxarrow]{color:#ffffff;transform:translateX(6px);}
.ispa-idx-row:hover [data-idxthumb]{opacity:1;transform:translateX(0) scale(1);}

/* ============================================================
   MOBILE NAV
   ============================================================ */
.ispa-burger{display:none;background:none;border:0;padding:8px;cursor:pointer;flex-direction:column;gap:5px;}
.ispa-burger span{display:block;width:24px;height:2px;background:#fff;transition:transform .3s,opacity .3s;}
.ispa-nav-open .ispa-burger span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.ispa-nav-open .ispa-burger span:nth-child(2){opacity:0;}
.ispa-nav-open .ispa-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* ============================================================
   RESPONSIVE (added on top of the desktop design)
   ============================================================ */
@media (max-width:1024px){
  .ispa-pad{padding-left:32px!important;padding-right:32px!important;}
  .ispa-grid-2,.ispa-grid-2-end{grid-template-columns:1fr!important;}
  .ispa-hero-split{grid-template-columns:1fr!important;}
  .ispa-hero-split .ispa-hero-media{min-height:48vh;border-left:0!important;border-top:1px solid var(--ispa-gray);}
  .ispa-sectores-grid{grid-template-columns:1fr!important;gap:0 0!important;}
  .ispa-stats-grid{grid-template-columns:repeat(2,1fr)!important;}
  .ispa-proceso-grid{grid-template-columns:1fr!important;}
  .ispa-proceso-grid .ispa-proceso-sticky{position:relative!important;top:auto!important;}
  .ispa-proyectos-grid{grid-template-columns:1fr!important;}
  .ispa-proyectos-grid > *{grid-column:auto!important;grid-row:auto!important;min-height:320px!important;}
  .ispa-footer-cols{grid-template-columns:repeat(2,1fr)!important;}
  .ispa-contact-grid{grid-template-columns:1fr!important;}
}
@media (max-width:860px){
  .ispa-pad{padding-left:22px!important;padding-right:22px!important;}
  .ispa-burger{display:flex;}
  .ispa-nav{
    position:fixed;top:0;right:0;bottom:0;width:min(80vw,320px);
    flex-direction:column;align-items:flex-start;justify-content:center;gap:28px!important;
    background:var(--ispa-dark);padding:40px;
    transform:translateX(100%);transition:transform .4s cubic-bezier(.16,1,.3,1);z-index:70;
  }
  .ispa-nav-open .ispa-nav{transform:translateX(0);}
  .ispa-header-tel{display:none;}
  .ispa-idx-row{grid-template-columns:40px 1fr auto!important;}
  .ispa-idx-row .ispa-idx-meta,.ispa-idx-row [data-idxarrow]{display:none;}
  .ispa-stats-grid{grid-template-columns:1fr!important;}
  .ispa-footer-cols{grid-template-columns:1fr!important;}
}

/* no-JS fallback: never hide content if the animation engine doesn't run */
.no-js [data-reveal]{opacity:1!important;transform:none!important;}
.no-js [data-reveal] > span{transform:none!important;}
.no-js [data-step]{opacity:1!important;}
.no-js [data-step-num]{color:var(--ispa-yellow)!important;}
.no-js [data-step-bar]{transform:scaleX(1)!important;}
.no-js [data-count-to]::after{content:none;}
