/* ============================================
   WIRA AGENCY — SISTEMA DE DISEÑO + MOVIMIENTO
   Space Grotesk · Acento #FF6B2B · Atrevido
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap');

:root{
  --bg:#ffffff;--ink:#0a0a0a;--orange:#FF5A1F;--orange2:#FF6B2B;
  --g1:#7a7a7a;--g2:#b5b5b5;--line:#ededea;--line2:#e4e4e0;
  --black:#0a0a0a;--soft:#f6f5f2;
  --ease:cubic-bezier(.16,1,.3,1);
  --ease2:cubic-bezier(.7,0,.2,1);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'Space Grotesk',-apple-system,sans-serif;
  background:var(--bg);color:var(--ink);overflow-x:hidden;line-height:1.5;
  -webkit-font-smoothing:antialiased;cursor:none;
}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}
ul{list-style:none}

/* ---------- CURSOR CUSTOM ---------- */
.cursor{position:fixed;top:0;left:0;width:8px;height:8px;background:var(--orange);border-radius:50%;pointer-events:none;z-index:99999;transform:translate(-50%,-50%);transition:width .25s var(--ease),height .25s var(--ease),background .25s}
.cursor-ring{position:fixed;top:0;left:0;width:40px;height:40px;border:1px solid var(--ink);border-radius:50%;pointer-events:none;z-index:99998;transform:translate(-50%,-50%);transition:width .3s var(--ease),height .3s var(--ease),border-color .3s,opacity .3s}
.cursor.hover{width:0;height:0}
.cursor-ring.hover{width:64px;height:64px;border-color:var(--orange);background:rgba(255,90,31,.06)}
.cursor.dark{background:#fff}
@media(max-width:980px){body{cursor:auto}.cursor,.cursor-ring{display:none}}

/* ---------- NAV (logo centrado tipo Astra) ---------- */
.wn{height:80px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 40px;background:rgba(255,255,255,.9);backdrop-filter:blur(16px);position:fixed;top:0;left:0;right:0;z-index:1000;transition:transform .5s var(--ease),background .4s,border-color .4s;border-bottom:1px solid transparent}
.wn.scrolled{border-bottom:1px solid var(--line);height:68px}
.wn.hidden{transform:translateY(-100%)}
/* grupo central: enlaces + logo + enlaces, todo junto en el medio */
.wn-center{grid-column:2;display:flex;align-items:center;gap:36px;justify-self:center}
.wn-left,.wn-right{display:flex;align-items:center;gap:32px}
.wn-logo{font-size:25px;letter-spacing:.3em;font-weight:700;text-transform:uppercase;white-space:nowrap;padding:0 6px}
.wn-logo span{display:inline-block;transition:transform .4s var(--ease)}
/* acciones a la derecha del todo */
.wn-actions{grid-column:3;justify-self:end;display:flex;align-items:center;gap:22px}
.wn-link{font-size:13px;color:var(--g1);letter-spacing:.03em;transition:color .3s;position:relative;padding:4px 0;white-space:nowrap}
.wn-link::after{content:'';position:absolute;left:0;bottom:0;width:0;height:1.5px;background:var(--orange);transition:width .35s var(--ease)}
.wn-link:hover{color:var(--ink)}
.wn-link:hover::after,.wn-link.active::after{width:100%}
.wn-link.active{color:var(--ink)}
.wn-cta{font-size:12px;color:#fff;background:var(--orange);padding:11px 22px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;position:relative;overflow:hidden;transition:color .4s;white-space:nowrap;border-radius:40px}
.wn-cta span{position:relative;z-index:2}
.wn-cta::before{content:'';position:absolute;inset:0;background:var(--ink);transform:translateY(101%);transition:transform .4s var(--ease);z-index:1}
.wn-cta:hover::before{transform:translateY(0)}
.wn-social{display:flex;align-items:center;gap:13px}
.wn-social a{color:var(--g1);transition:color .3s,transform .3s var(--ease);display:flex}
.wn-social a:hover{color:var(--orange);transform:translateY(-2px)}
.wn-social svg{width:16px;height:16px;display:block}

/* ---------- TIPOGRAFÍA ---------- */
.eyebrow{font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--orange);font-weight:500;display:flex;align-items:center;gap:12px}
.eyebrow::before{content:'';width:30px;height:1px;background:var(--orange);display:block;flex-shrink:0;transform-origin:left;animation:lineGrow 1s var(--ease) forwards}
.eyebrow.center{justify-content:center}
@keyframes lineGrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}

h1,h2,h3{font-weight:300;letter-spacing:-.035em;line-height:1.02}
.display-xl{font-size:clamp(48px,7vw,108px);font-weight:300;letter-spacing:-.05em;line-height:.96}
.display-l{font-size:clamp(36px,5vw,72px);font-weight:300;letter-spacing:-.04em;line-height:1.0}
.display-m{font-size:clamp(28px,3.4vw,48px);font-weight:300;letter-spacing:-.03em}
em{font-style:italic;color:var(--orange);font-weight:300}
.lead{font-size:17px;color:var(--g1);font-weight:300;line-height:1.65}
.body{font-size:14px;color:var(--g1);font-weight:300;line-height:1.75}

/* ---------- BOTONES ---------- */
.btn{display:inline-block;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:16px 34px;position:relative;overflow:hidden;cursor:none;border:none}
.btn span{position:relative;z-index:2;transition:color .4s}
.btn::before{content:'';position:absolute;inset:0;z-index:1;transform:translateY(101%);transition:transform .45s var(--ease)}
.btn:hover::before{transform:translateY(0)}
.btn-dark{background:var(--ink);color:#fff}
.btn-dark::before{background:var(--orange)}
.btn-orange{background:var(--orange);color:#fff}
.btn-orange::before{background:var(--ink)}
.btn-white{background:#fff;color:var(--ink)}
.btn-white::before{background:var(--ink)}
.btn-white:hover span{color:#fff}
.link-underline{font-size:13px;color:var(--g1);position:relative;padding-bottom:3px;transition:color .3s}
.link-underline::after{content:'';position:absolute;left:0;bottom:0;width:100%;height:1px;background:var(--g2);transform-origin:right;transition:transform .4s var(--ease),background .3s}
.link-underline:hover{color:var(--ink)}
.link-underline:hover::after{transform-origin:left;background:var(--orange)}

/* ---------- SECCIONES ---------- */
.section{padding:140px 48px}
.section-soft{background:var(--soft)}
.container{max-width:1320px;margin:0 auto}
.section-head{margin-bottom:64px}

/* ---------- TICKER ---------- */
.ticker{background:var(--black);overflow:hidden;height:52px;display:flex;align-items:center}
.ticker-track{display:flex;white-space:nowrap;animation:tickerscroll 32s linear infinite;width:max-content}
.ticker:hover .ticker-track{animation-play-state:paused}
@keyframes tickerscroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.ticker-item{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:#fff;padding:0 32px;opacity:.55;transition:opacity .3s}
.ticker-item:hover{opacity:1;color:var(--orange)}
.ticker-dot{color:var(--orange);font-size:13px}

/* ---------- LOGOS ---------- */
.logos{padding:64px 0;border-bottom:1px solid var(--line);overflow:hidden}
.logos-label{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--g2);margin-bottom:40px;font-weight:500;padding:0 48px}
.logos-mask{overflow:hidden;width:100%;position:relative}
.logos-mask::before,.logos-mask::after{content:'';position:absolute;top:0;bottom:0;width:120px;z-index:2;pointer-events:none}
.logos-mask::before{left:0;background:linear-gradient(to right,var(--bg),transparent)}
.logos-mask::after{right:0;background:linear-gradient(to left,var(--bg),transparent)}
.logos-track{display:flex;align-items:center;gap:80px;white-space:nowrap;animation:logoscroll 30s linear infinite;width:max-content}
.logos:hover .logos-track{animation-play-state:paused}
@keyframes logoscroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.logo-img{height:30px;width:auto;flex-shrink:0;opacity:.8;transition:opacity .35s,transform .35s var(--ease)}
.logo-img:hover{opacity:1;transform:scale(1.08)}
.logo-txt{font-size:16px;letter-spacing:.05em;font-weight:600;color:#555;flex-shrink:0;transition:color .3s}
.logo-txt:hover{color:var(--orange)}

/* ---------- FOOTER ---------- */
.wf{padding:90px 48px 44px;border-top:1px solid var(--line);background:var(--ink);color:#fff}
.wf-big{font-size:clamp(48px,8vw,140px);font-weight:300;letter-spacing:-.05em;line-height:.9;margin-bottom:72px;color:#fff}
.wf-big em{color:var(--orange)}
.wf-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;margin-bottom:64px}
.wf-tagline{font-size:13px;color:#999;line-height:1.7;max-width:240px;font-weight:300}
.wf-col h4{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#666;margin-bottom:22px;font-weight:600}
.wf-col a{display:block;font-size:14px;color:#bbb;margin-bottom:14px;transition:color .3s,padding-left .3s var(--ease);font-weight:300}
.wf-col a:hover{color:#fff;padding-left:8px}
.wf-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:32px;border-top:1px solid #222;gap:24px;flex-wrap:wrap}
.wf-copy{font-size:12px;color:#666;font-weight:300}
.wf-legal{display:flex;gap:24px;flex-wrap:wrap;flex:1;justify-content:center}
.wf-legal a{font-size:12px;color:#888;font-weight:300;transition:color .3s}
.wf-legal a:hover{color:var(--orange)}
.wf-social{display:flex;gap:22px}
.wf-social a{font-size:12px;color:#888;letter-spacing:.04em;transition:color .3s}
.wf-social a:hover{color:var(--orange)}

/* ---------- CTA ---------- */
.cta-band{background:var(--orange);padding:130px 48px;text-align:center;position:relative;overflow:hidden}
.cta-band .pre{font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:rgba(255,255,255,.8);margin-bottom:28px}
.cta-band h2{font-size:clamp(38px,5.4vw,80px);font-weight:300;color:#fff;letter-spacing:-.04em;line-height:1.0;margin-bottom:46px}
.cta-band h2 em{font-style:italic;color:#fff}

/* ---------- REVEAL SYSTEM ---------- */
.reveal{opacity:0;transform:translateY(40px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal-d1{transition-delay:.08s}.reveal-d2{transition-delay:.16s}.reveal-d3{transition-delay:.24s}.reveal-d4{transition-delay:.32s}
/* line-by-line text reveal */
.tline{display:block;overflow:hidden}
.tline>span{display:block;transform:translateY(100%);transition:transform 1s var(--ease)}
.in .tline>span,.tline.in>span{transform:none}
.td1>span{transition-delay:.05s}.td2>span{transition-delay:.15s}.td3>span{transition-delay:.25s}.td4>span{transition-delay:.35s}
/* image clip reveal */
.clip-reveal{clip-path:inset(0 0 100% 0);transition:clip-path 1.1s var(--ease2)}
.clip-reveal.in{clip-path:inset(0 0 0 0)}

@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .reveal,.tline>span,.clip-reveal{opacity:1;transform:none;clip-path:none}
}

/* ---------- RESPONSIVE ---------- */
@media(max-width:980px){
  .wn{padding:0 20px;grid-template-columns:auto 1fr auto}.wn-center .wn-left,.wn-center .wn-right{display:none}.wn-actions{gap:14px}
  .wf-grid{grid-template-columns:1fr 1fr;gap:32px}
  .section{padding:80px 20px}.cta-band{padding:80px 20px}
  .logos-label{padding:0 20px}
}
@media(max-width:560px){
  .wf-grid{grid-template-columns:1fr}.wf-bottom{flex-direction:column;gap:16px;align-items:flex-start}.wf-legal{justify-content:flex-start;gap:16px}
}

/* ---------- NAV DOBLE CTA ---------- */
.wn-actions{display:flex;align-items:center;gap:12px}
.wn-staff{font-size:12px;color:var(--ink);padding:12px 22px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;border:1px solid var(--ink);position:relative;overflow:hidden;transition:color .4s}
.wn-staff span{position:relative;z-index:2}
.wn-staff::before{content:'';position:absolute;inset:0;background:var(--ink);transform:translateY(101%);transition:transform .4s var(--ease);z-index:1}
.wn-staff:hover{color:#fff}
.wn-staff:hover::before{transform:translateY(0)}
@media(max-width:1100px){.wn-staff{display:none}}

/* ---------- SERVICIOS ATREVIDO (sticky scroll) ---------- */
.svc2{background:var(--ink);color:#fff;padding:0}
.svc2-head{padding:120px 48px 80px;max-width:1320px;margin:0 auto}
.svc2-head .eyebrow{color:var(--orange)}
.svc2-head h2{color:#fff;margin-top:24px}
.svc2-head h2 em{color:var(--orange)}
.svc2-row{display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:1px solid #1e1e1e;position:relative;min-height:88vh}
.svc2-sticky{position:sticky;top:0;height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#0a0a0a}
.svc2-sticky img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.5;transition:opacity .6s,transform 1.2s var(--ease2)}
.svc2-sticky .bignum{position:relative;z-index:2;font-size:clamp(120px,18vw,280px);font-weight:300;color:rgba(255,255,255,.08);letter-spacing:-.04em;line-height:1}
.svc2-content{padding:120px 64px;display:flex;flex-direction:column;justify-content:center;border-left:1px solid #1e1e1e}
.svc2-cat{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--orange);font-weight:600;margin-bottom:24px}
.svc2-content h3{font-size:clamp(32px,4vw,56px);font-weight:300;color:#fff;letter-spacing:-.03em;margin-bottom:28px;line-height:1.02}
.svc2-content>p{font-size:16px;color:#999;line-height:1.7;font-weight:300;margin-bottom:36px;max-width:480px}
.svc2-tags{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:8px}
.svc2-tag{font-size:13px;color:#ccc;padding:9px 18px;border:1px solid #2a2a2a;border-radius:40px;transition:all .3s var(--ease);font-weight:300}
.svc2-tag:hover{border-color:var(--orange);color:#fff;background:rgba(255,90,31,.1)}
.svc2-row:nth-child(even) .svc2-sticky{order:2;border-left:1px solid #1e1e1e}
.svc2-row:nth-child(even) .svc2-content{border-left:none;border-right:1px solid #1e1e1e}

@media(max-width:980px){
  .svc2-head{padding:64px 20px 40px}
  .svc2-row{grid-template-columns:1fr;min-height:auto}
  .svc2-sticky{position:relative;height:50vh;min-height:300px;order:0!important}
  .svc2-content{padding:48px 20px;border-left:none!important;border-right:none!important}
  .svc2-row:nth-child(even) .svc2-sticky{order:0}
}

/* ---------- FORMULARIO DOBLE (tabs) ---------- */
.form-tabs{display:flex;gap:0;margin-bottom:48px;border-bottom:1px solid var(--line2)}
.form-tab{flex:1;padding:20px 0;font-size:14px;font-weight:600;letter-spacing:.04em;color:var(--g2);background:none;border:none;border-bottom:2px solid transparent;margin-bottom:-1px;cursor:none;transition:color .3s,border-color .3s;text-align:left}
.form-tab .ft-sub{display:block;font-size:11px;font-weight:300;color:var(--g2);margin-top:4px;letter-spacing:0;text-transform:none}
.form-tab.active{color:var(--ink);border-color:var(--orange)}
.form-tab.active .ft-sub{color:var(--g1)}
.form-panel{display:none}
.form-panel.active{display:block;animation:panelfade .5s var(--ease)}
@keyframes panelfade{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

/* STAFF BENEFITS */
.benefits{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:44px}
.benefit{padding:24px;background:#fff;border:1px solid var(--line);transition:transform .4s var(--ease),border-color .3s}
.benefit:hover{transform:translateY(-4px);border-color:var(--orange)}
.benefit .bn-ic{font-size:22px;margin-bottom:14px;color:var(--orange)}
.benefit h4{font-size:16px;font-weight:500;margin-bottom:8px;letter-spacing:-.01em}
.benefit p{font-size:13px;color:var(--g1);line-height:1.6;font-weight:300}
@media(max-width:680px){.benefits{grid-template-columns:1fr}}

/* ===== ACORDEÓN DE SERVICIOS (compartido home + servicios) ===== */
.acc{border-top:1px solid var(--line2)}
.acc-item{border-bottom:1px solid var(--line2);position:relative;overflow:hidden;transition:background .5s var(--ease)}
.acc-item.open{background:var(--ink)}
.acc-head{display:flex;align-items:center;gap:32px;padding:40px 48px;cursor:none;position:relative;z-index:3}
.acc-num{font-size:14px;font-weight:600;letter-spacing:.1em;color:var(--orange);flex-shrink:0;width:40px;transition:color .4s}
.acc-title{font-size:clamp(30px,4.6vw,64px);font-weight:300;letter-spacing:-.03em;line-height:1;flex:1;transition:transform .55s var(--ease),color .4s;color:var(--ink)}
.acc-plus{position:relative;width:28px;height:28px;flex-shrink:0;transition:transform .5s var(--ease)}
.acc-plus::before,.acc-plus::after{content:'';position:absolute;background:var(--ink);transition:background .4s}
.acc-plus::before{top:50%;left:0;width:100%;height:1.5px;transform:translateY(-50%)}
.acc-plus::after{left:50%;top:0;height:100%;width:1.5px;transform:translateX(-50%)}
.acc-item:hover .acc-title{transform:translateX(20px)}
.acc-item:hover .acc-num{color:var(--orange)}
.acc-item.open .acc-title{color:#fff}
.acc-item.open .acc-num{color:var(--orange)}
.acc-item.open .acc-plus{transform:rotate(135deg)}
.acc-item.open .acc-plus::before,.acc-item.open .acc-plus::after{background:#fff}
.acc-item.open:hover .acc-title{transform:none}
.acc-ghost{position:absolute;top:0;right:4%;font-size:clamp(200px,30vw,520px);font-weight:300;line-height:1;color:rgba(255,255,255,.04);z-index:1;pointer-events:none;opacity:0;transition:opacity .8s;user-select:none}
.acc-item.open .acc-ghost{opacity:1}
.acc-body{max-height:0;overflow:hidden;transition:max-height .7s var(--ease);position:relative;z-index:2}
.acc-body.show{max-height:1000px}
.acc-inner{display:grid;grid-template-columns:1.15fr 1fr;gap:64px;padding:8px 48px 72px;align-items:center}
.acc-media{aspect-ratio:3/2;overflow:hidden;background:#161616;position:relative}
.acc-media img{width:100%;height:100%;object-fit:cover;transform:scale(1.12);transition:transform 1.4s var(--ease2)}
.acc-item.open .acc-media img{transform:scale(1)}
.acc-text{display:flex;flex-direction:column;justify-content:center}
.acc-cat{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--orange);font-weight:600;margin-bottom:24px}
.acc-desc{font-size:19px;color:#e0e0e0;line-height:1.55;font-weight:300;margin-bottom:20px;letter-spacing:-.01em}
.acc-desc2{font-size:15px;color:#888;line-height:1.7;font-weight:300;margin-bottom:40px}
.acc-incl{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#666;font-weight:600;margin-bottom:8px}
.acc-list{display:grid;grid-template-columns:1fr 1fr;gap:0 40px}
.acc-list li{font-size:clamp(15px,1.15vw,18px);font-weight:300;color:#fff;padding:14px 0;border-bottom:1px solid #1c1c1c;display:flex;align-items:center;gap:13px;letter-spacing:-.01em;transition:color .3s,padding-left .3s var(--ease)}
.acc-list li::before{content:'';width:5px;height:5px;background:var(--orange);border-radius:50%;flex-shrink:0}
.acc-list li:hover{color:var(--orange);padding-left:8px}
.acc-cta{margin-top:36px}
.acc-cta a{font-size:13px;color:#fff;border-bottom:1px solid #333;padding-bottom:4px;transition:border-color .3s,color .3s}
.acc-cta a:hover{border-color:var(--orange);color:var(--orange)}
@media(max-width:980px){
  .acc-head{padding:26px 20px;gap:18px}.acc-num{width:auto}
  .acc-inner{grid-template-columns:1fr;padding:0 20px 40px;gap:28px}
  .acc-body.show{max-height:1600px}
  .acc-ghost{display:none}.acc-media{aspect-ratio:16/10}
  .acc-list{grid-template-columns:1fr}.acc-desc{font-size:17px}
}


/* ---------- MAPA MUNDIAL ---------- */
.mapsec{background:var(--ink);position:relative}
.map-wrap{max-width:1100px;margin:0 auto;position:relative}
.world-map{width:100%;height:auto;display:block;overflow:visible}
.mapdot-pulse{animation:mapdotpulse 2.6s ease-in-out infinite;transform-origin:center;transform-box:fill-box}
@keyframes mapdotpulse{0%,100%{opacity:1}50%{opacity:.4}}
.world-map text{opacity:0;animation:mapfadein .6s var(--ease) forwards;animation-delay:1.2s}
@keyframes mapfadein{to{opacity:1}}

/* ============================================
   PÁGINA DE SERVICIO INDIVIDUAL
   ============================================ */
.sv-hero{position:relative;min-height:min(88vh,840px);display:flex;align-items:flex-end;overflow:hidden;padding-bottom:7vh}
.sv-hero-bg{position:absolute;inset:0;z-index:1}
.sv-hero-bg img{width:100%;height:100%;object-fit:cover}
.sv-hero-bg::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,10,.35) 0%,rgba(10,10,10,.5) 50%,rgba(10,10,10,.92) 100%)}
.sv-hero-in{position:relative;z-index:2;padding:0 48px;max-width:1320px;margin:0 auto;width:100%}
.sv-breadcrumb{display:flex;align-items:center;gap:10px;font-size:12px;color:rgba(255,255,255,.6);margin-bottom:28px;letter-spacing:.04em}
.sv-breadcrumb a{transition:color .3s}.sv-breadcrumb a:hover{color:var(--orange)}
.sv-breadcrumb .sep{color:rgba(255,255,255,.3)}
.sv-hero h1{color:#fff;margin-bottom:24px;max-width:900px}
.sv-hero .sv-tagline{font-size:19px;color:rgba(255,255,255,.85);font-weight:300;max-width:560px;line-height:1.6}

.sv-intro{padding:120px 48px}
.sv-intro-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:80px;align-items:start;max-width:1320px;margin:0 auto}
.sv-intro-l .eyebrow{margin-bottom:20px}
.sv-intro-l h2{font-size:clamp(26px,3vw,40px);font-weight:300;letter-spacing:-.02em;line-height:1.1}
.sv-intro-r p{font-size:17px;color:var(--g1);line-height:1.75;font-weight:300;margin-bottom:24px}
.sv-intro-r p:last-child{margin-bottom:0}
.sv-intro-r strong{color:var(--ink);font-weight:500}

.sv-incl{padding:120px 48px;background:var(--ink);color:#fff}
.sv-incl-head{max-width:1320px;margin:0 auto 56px}
.sv-incl-head .eyebrow{margin-bottom:20px}
.sv-incl-head h2{color:#fff;font-size:clamp(28px,3.4vw,48px);font-weight:300;letter-spacing:-.03em}
.sv-incl-head h2 em{color:var(--orange)}
.sv-incl-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:0 64px;max-width:1320px;margin:0 auto}
.sv-incl-item{display:flex;gap:20px;padding:26px 0;border-top:1px solid #1f1f1f;align-items:flex-start}
.sv-incl-item .ic{font-size:13px;color:var(--orange);font-weight:600;flex-shrink:0;width:28px;padding-top:3px}
.sv-incl-item h4{font-size:19px;font-weight:400;margin-bottom:8px;letter-spacing:-.01em}
.sv-incl-item p{font-size:14px;color:#888;line-height:1.6;font-weight:300}

.sv-gallery{padding:120px 48px}
.sv-gallery-head{max-width:1320px;margin:0 auto 48px}
.sv-gallery-head .eyebrow{margin-bottom:20px}
.sv-gallery-head h2{font-size:clamp(28px,3.4vw,48px);font-weight:300;letter-spacing:-.03em}
.sv-gallery-head h2 em{color:var(--orange)}
.sv-gallery-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:6px;max-width:1320px;margin:0 auto}
.sv-gallery-grid .g-item{overflow:hidden;background:#ddd}
.sv-gallery-grid .g-item img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease2)}
.sv-gallery-grid .g-item:hover img{transform:scale(1.06)}
.g-a{grid-column:span 8;aspect-ratio:8/5}.g-b{grid-column:span 4;aspect-ratio:4/5}
.g-c{grid-column:span 4;aspect-ratio:4/4}.g-d{grid-column:span 4;aspect-ratio:4/4}.g-e{grid-column:span 4;aspect-ratio:4/4}

.sv-perfiles{padding:120px 48px;background:var(--soft)}
.sv-perfiles-head{max-width:1320px;margin:0 auto 48px;text-align:center}
.sv-perfiles-head .eyebrow{margin-bottom:20px;justify-content:center}
.sv-perfiles-head h2{font-size:clamp(28px,3.4vw,48px);font-weight:300;letter-spacing:-.03em}
.sv-perfiles-head h2 em{color:var(--orange)}
.sv-perfiles-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;max-width:1320px;margin:0 auto}
.perfil{background:#fff;border:1px solid var(--line);padding:32px;transition:transform .4s var(--ease),border-color .3s}
.perfil:hover{transform:translateY(-6px);border-color:var(--orange)}
.perfil .pf-ic{font-size:24px;color:var(--orange);margin-bottom:18px}
.perfil h4{font-size:18px;font-weight:500;margin-bottom:10px}
.perfil p{font-size:13px;color:var(--g1);line-height:1.65;font-weight:300}

.sv-related{padding:100px 48px;border-top:1px solid var(--line)}
.sv-related-head{max-width:1320px;margin:0 auto 40px}
.sv-related-head .eyebrow{margin-bottom:16px}
.sv-related-head h3{font-size:clamp(22px,2.4vw,32px);font-weight:300;letter-spacing:-.02em}
.sv-related-grid{display:flex;gap:16px;max-width:1320px;margin:0 auto;flex-wrap:wrap}
.sv-rel{flex:1;min-width:220px;padding:28px 32px;border:1px solid var(--line2);transition:all .3s var(--ease);display:flex;justify-content:space-between;align-items:center}
.sv-rel:hover{border-color:var(--ink);background:var(--ink);color:#fff}
.sv-rel span{font-size:18px;font-weight:400}
.sv-rel .arr{font-size:20px;color:var(--orange)}

@media(max-width:980px){
  .sv-hero{min-height:min(70vh,760px);padding-bottom:48px}.sv-hero-in{padding:0 20px}
  .sv-intro{padding:64px 20px}.sv-intro-grid{grid-template-columns:1fr;gap:32px}
  .sv-incl{padding:64px 20px}.sv-incl-grid{grid-template-columns:1fr;gap:0}
  .sv-gallery{padding:64px 20px}.sv-gallery-grid .g-item{grid-column:span 12!important;aspect-ratio:3/2!important}
  .sv-perfiles{padding:64px 20px}.sv-perfiles-grid{grid-template-columns:1fr 1fr;gap:16px}
  .sv-related{padding:56px 20px}.sv-rel{min-width:100%}
}
@media(max-width:560px){.sv-perfiles-grid{grid-template-columns:1fr}}

/* ---------- ACORDEÓN: ítems como enlaces ---------- */
.acc-list li a{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;color:inherit;transition:color .3s,padding-left .3s var(--ease)}
.acc-list li a:hover{color:var(--orange);padding-left:8px}
.acc-arrow{font-size:16px;color:#444;opacity:0;transform:translateX(-8px);transition:opacity .3s,transform .3s var(--ease),color .3s}
.acc-list li a:hover .acc-arrow{opacity:1;transform:translateX(0);color:var(--orange)}

/* ============================================
   BLOG
   ============================================ */
.blog-hero{padding:140px 48px 64px;max-width:1320px;margin:0 auto}
.blog-hero .eyebrow{margin-bottom:24px}
.blog-hero h1{max-width:900px;margin-bottom:24px}
.blog-hero .lead{max-width:560px}
.blog-feat{max-width:1320px;margin:0 auto 80px;padding:0 48px}
.blog-feat-card{display:grid;grid-template-columns:1.2fr 1fr;gap:0;background:var(--ink);overflow:hidden;cursor:none}
.blog-feat-img{overflow:hidden;aspect-ratio:16/11}
.blog-feat-img img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease2)}
.blog-feat-card:hover .blog-feat-img img{transform:scale(1.05)}
.blog-feat-txt{padding:64px;display:flex;flex-direction:column;justify-content:center}
.blog-tag{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--orange);font-weight:600;margin-bottom:20px}
.blog-feat-txt h2{font-size:clamp(26px,3vw,40px);font-weight:300;color:#fff;letter-spacing:-.03em;line-height:1.1;margin-bottom:20px}
.blog-feat-txt p{font-size:16px;color:#999;line-height:1.7;font-weight:300;margin-bottom:28px}
.blog-meta{font-size:12px;color:#666;letter-spacing:.04em}
.blog-grid-sec{padding:0 48px 120px;max-width:1320px;margin:0 auto}
.blog-filters{display:flex;gap:12px;margin-bottom:48px;flex-wrap:wrap}
.blog-filter{font-size:13px;color:var(--g1);padding:9px 20px;border:1px solid var(--line2);border-radius:40px;cursor:none;transition:all .3s var(--ease)}
.blog-filter.active,.blog-filter:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.blog-card{cursor:none;display:flex;flex-direction:column}
.blog-card-img{overflow:hidden;aspect-ratio:3/2;margin-bottom:22px;background:#ddd}
.blog-card-img img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease2)}
.blog-card:hover .blog-card-img img{transform:scale(1.06)}
.blog-card .blog-tag{margin-bottom:12px}
.blog-card h3{font-size:21px;font-weight:400;letter-spacing:-.01em;line-height:1.25;margin-bottom:12px;transition:color .3s}
.blog-card:hover h3{color:var(--orange)}
.blog-card p{font-size:14px;color:var(--g1);line-height:1.6;font-weight:300;margin-bottom:16px;flex:1}
@media(max-width:980px){
  .blog-hero{padding:96px 20px 40px}.blog-feat{padding:0 20px;margin-bottom:48px}
  .blog-feat-card{grid-template-columns:1fr}.blog-feat-txt{padding:36px 24px}
  .blog-grid-sec{padding:0 20px 64px}.blog-grid{grid-template-columns:1fr;gap:40px}
}
@media(max-width:680px){.blog-grid{grid-template-columns:1fr}}

/* ============================================
   PÁGINAS LEGALES
   ============================================ */
.legal-hero{padding:140px 48px 56px;max-width:900px;margin:0 auto}
.legal-hero .eyebrow{margin-bottom:24px}
.legal-hero h1{font-size:clamp(36px,5vw,64px);font-weight:300;letter-spacing:-.04em;line-height:1.02}
.legal-hero .updated{font-size:13px;color:var(--g2);margin-top:20px;font-weight:300}
.legal-body{max-width:900px;margin:0 auto;padding:0 48px 120px}
.legal-body h2{font-size:22px;font-weight:500;letter-spacing:-.01em;margin:48px 0 16px;color:var(--ink)}
.legal-body h2:first-child{margin-top:0}
.legal-body p{font-size:15px;color:var(--g1);line-height:1.8;font-weight:300;margin-bottom:16px}
.legal-body ul{margin:0 0 16px 0;padding-left:0}
.legal-body li{font-size:15px;color:var(--g1);line-height:1.8;font-weight:300;padding-left:24px;position:relative;margin-bottom:8px}
.legal-body li::before{content:'';position:absolute;left:0;top:13px;width:5px;height:5px;background:var(--orange);border-radius:50%}
.legal-body strong{color:var(--ink);font-weight:500}
.legal-body a{color:var(--orange);border-bottom:1px solid transparent;transition:border-color .3s}
.legal-body a:hover{border-color:var(--orange)}
.legal-table{width:100%;border-collapse:collapse;margin:16px 0 24px}
.legal-table th,.legal-table td{text-align:left;padding:12px 16px;border:1px solid var(--line2);font-size:14px;font-weight:300;color:var(--g1)}
.legal-table th{background:var(--soft);font-weight:500;color:var(--ink)}
@media(max-width:980px){
  .legal-hero{padding:96px 20px 40px}.legal-body{padding:0 20px 64px}
}

/* botón ghost (contorno) */
.btn-ghost{background:transparent;color:var(--ink);border:1px solid var(--ink)}
.btn-ghost::before{background:var(--ink)}
.btn-ghost:hover span{color:#fff}


/* ---------- MENÚ HAMBURGUESA MÓVIL ---------- */
.wn-burger{display:none;grid-column:1;justify-self:start;flex-direction:column;justify-content:center;gap:5px;width:40px;height:40px;background:none;border:none;cursor:pointer;padding:0;z-index:1002}
.wn-burger span{display:block;width:24px;height:2px;background:var(--ink);transition:transform .4s var(--ease),opacity .3s}
.wn-burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.wn-burger.open span:nth-child(2){opacity:0}
.wn-burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(max-width:980px){.wn-burger{display:flex}}
.mobile-menu{position:fixed;inset:0;background:var(--ink);z-index:1001;display:flex;flex-direction:column;justify-content:center;padding:40px;opacity:0;visibility:hidden;transition:opacity .5s var(--ease),visibility .5s}
.mobile-menu.open{opacity:1;visibility:visible}
.mobile-menu a{font-size:clamp(32px,9vw,52px);font-weight:500;color:#fff;letter-spacing:-.03em;padding:10px 0;transition:color .3s,transform .5s var(--ease),opacity .5s var(--ease);transform:translateY(20px);opacity:0}
.mobile-menu.open a{transform:none;opacity:1}
.mobile-menu.open a:nth-child(1){transition-delay:.1s}
.mobile-menu.open a:nth-child(2){transition-delay:.16s}
.mobile-menu.open a:nth-child(3){transition-delay:.22s}
.mobile-menu.open a:nth-child(4){transition-delay:.28s}
.mobile-menu.open a:nth-child(5){transition-delay:.34s}
.mobile-menu a em{color:var(--orange);font-style:normal}
.mobile-menu a:active{color:var(--orange)}
.mobile-menu-foot{position:absolute;bottom:40px;left:40px;right:40px;display:flex;gap:24px;align-items:center;opacity:0;transition:opacity .5s var(--ease) .4s}
.mobile-menu.open .mobile-menu-foot{opacity:1}
.mobile-menu-foot a{font-size:14px;color:var(--g2);font-weight:400;transform:none;opacity:1}
.mobile-menu-cta{padding:14px 28px;background:var(--orange);color:#fff!important;border-radius:40px;font-size:14px!important;font-weight:600!important}

/* ============================================
   CORRECCIÓN NAVBAR PÁGINAS INTERNAS WORDPRESS
      Hace que el header de Astra se vea igual al
         navbar custom de la homepage de Wira
         ============================================ */
         
         /* Ocultar barra de admin de WP al hacer scroll en móvil */
         .admin-bar .wn { top: 32px; }
         @media(max-width:782px){ .admin-bar .wn { top: 46px; } }
         
         /* Resetear header de Astra para que adopte el estilo de Wira */
         .ast-header-break-point .main-header-bar,
         #masthead,
         .site-header,
         .main-header-bar {
           background: rgba(255,255,255,0.9) !important;
             backdrop-filter: blur(16px) !important;
               -webkit-backdrop-filter: blur(16px) !important;
                 box-shadow: none !important;
                   border-bottom: 1px solid transparent !important;
                     transition: border-color 0.4s, background 0.4s !important;
                       position: fixed !important;
                         top: 0 !important;
                           left: 0 !important;
                             right: 0 !important;
                               z-index: 1000 !important;
                                 height: 80px !important;
                                   padding: 0 40px !important;
                                     display: flex !important;
                                       align-items: center !important;
                                       }
                                       
                                       /* Logo Astra igual al de la homepage */
                                       .ast-site-identity,
                                       .site-branding {
                                         font-size: 25px !important;
                                           letter-spacing: 0.3em !important;
                                             font-weight: 700 !important;
                                               text-transform: uppercase !important;
                                               }
                                               
                                               /* Forzar logo SVG/imagen a altura correcta */
                                               .custom-logo { height: 28px !important; width: auto !important; }
                                               
                                               /* Links de nav Astra igual al estilo Wira */
                                               .main-header-menu .menu-item > a,
                                               .ast-builder-menu .menu-item > a,
                                               #site-navigation .menu-item > a {
                                                 font-family: 'Space Grotesk', -apple-system, sans-serif !important;
                                                   font-size: 13px !important;
                                                     color: #7a7a7a !important;
                                                       letter-spacing: 0.03em !important;
                                                         font-weight: 400 !important;
                                                           padding: 4px 0 !important;
                                                             text-transform: none !important;
                                                             }
                                                             .main-header-menu .menu-item > a:hover,
                                                             .ast-builder-menu .menu-item > a:hover {
                                                               color: #0a0a0a !important;
                                                               }
                                                               
                                                               /* Botón Contáctanos en Astra igual al de Wira */
                                                               .ast-header-cta .ast-custom-button,
                                                               .ast-header-button-1 a,
                                                               .header-widget-area .menu-item > a.ast-button-menu-item {
                                                                 background: var(--orange, #FF5A1F) !important;
                                                                   color: #fff !important;
                                                                     border-radius: 40px !important;
                                                                       font-size: 12px !important;
                                                                         font-weight: 600 !important;
                                                                           letter-spacing: 0.05em !important;
                                                                             text-transform: uppercase !important;
                                                                               padding: 11px 22px !important;
                                                                                 border: none !important;
                                                                                 }
                                                                                 
                                                                                 /* Ocultar íconos de redes sociales en fila separada en páginas WP */
                                                                                 .ast-header-icon-wrap,
                                                                                 .header-widget-area .ast-social-icon-widget {
                                                                                   display: flex !important;
                                                                                     align-items: center !important;
                                                                                       gap: 13px !important;
                                                                                       }
                                                                                       
                                                                                       /* Icono de IG y LinkedIn de Astra alineados en línea */
                                                                                       .ast-masthead-custom-menu-items,
                                                                                       .site-header .widget_nav_menu {
                                                                                         margin: 0 !important;
                                                                                           padding: 0 !important;
                                                                                           }
                                                                                           
                                                                                           /* Espacio para el fixed header en contenido */
                                                                                           body:not(.wira-home) {
                                                                                             padding-top: 80px;
                                                                                             }
                                                                                             
                                                                                             /* Eliminar padding-top si ya lo maneja Astra */
                                                                                             .admin-bar body:not(.wira-home) { padding-top: 112px; }
                                                                                             
                                                                                             /* ============================================
                                                                                                CORRECCIÓN REVEAL - fallback sin JS
                                                                                                   Los elementos con .reveal que nunca reciben
                                                                                                      la clase .in son invisibles. Añadimos
                                                                                                         animación CSS pura como fallback.
                                                                                                         ============================================ */
                                                                                                         @media (prefers-reduced-motion: no-preference) {
                                                                                                           /* Después de 3 segundos, forzar visible todos los .reveal
                                                                                                                que no tengan clase .in (fallback por si el JS falla) */
                                                                                                                  .reveal:not(.in) {
                                                                                                                      animation: revealFallback 0.8s ease 3s forwards;
                                                                                                                        }
                                                                                                                        }
                                                                                                                        @keyframes revealFallback {
                                                                                                                          to { opacity: 1; transform: none; }
                                                                                                                          }

/* ===== Ajustes visuales 02-07-2026 ===== */
.cursor,.cursor-ring{display:none!important}
html,body{cursor:auto}
a,button,.btn{cursor:pointer}
.logos-track .logo-img{filter:grayscale(1) brightness(.4);opacity:.7}


/* ===== Ajustes visuales fase 2 (02-07-2026) ===== */
/* Captions del portafolio legibles + hover */
.work-item{position:relative}
.work-item::after{content:"";position:absolute;left:0;right:0;bottom:0;height:45%;background:linear-gradient(to top,rgba(10,10,10,.78),rgba(10,10,10,0));pointer-events:none;z-index:1;opacity:.85;transition:opacity .4s}
.work-item:hover::after{opacity:1}
.work-cap{z-index:2}
.work-item img{transition:transform .8s cubic-bezier(.16,1,.3,1)}
.work-item:hover img{transform:scale(1.045)}
/* Footer: rebajar el titular gigante para no duplicar el CTA */
.wf-big{font-size:clamp(44px,6.5vw,84px)!important;line-height:.95}
/* Ritmo de espaciados */
.intro{padding-top:120px!important;padding-bottom:120px!important}
.section{padding-top:120px!important}
.cta-band{padding-top:115px!important;padding-bottom:115px!important}
/* Boton cerrar del menu movil */
.mobile-menu-close{position:absolute;top:22px;right:22px;width:44px;height:44px;background:none;border:1px solid rgba(255,255,255,.3);border-radius:50%;color:#fff;font-size:18px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:5}
.mobile-menu-brand{position:absolute;top:32px;left:24px;color:#fff;font-weight:700;letter-spacing:.35em;font-size:15px;z-index:5}

/* ===== Selector de idioma (02-07-2026) ===== */
.wn-lang{display:flex;align-items:center;gap:6px;font-size:12px;letter-spacing:.12em;font-weight:600;margin-right:18px}
.wn-lang a{color:var(--g1,#9a9a9a);text-decoration:none;transition:color .25s}
.wn-lang a:hover{color:var(--ink,#111)}
.wn-lang-active{color:var(--orange,#ff5a1f)}
.wn-lang-sep{color:var(--g2,#ccc)}
.mobile-menu-lang{display:flex;gap:10px;margin-top:24px;font-size:14px;letter-spacing:.1em;font-weight:600}
.mobile-menu-lang a{color:#fff;opacity:.6;text-decoration:none}
.mobile-menu-lang .on{opacity:1;color:var(--orange,#ff5a1f)}

/* Cursor visible en toda la web (Sep 2026).
   El cursor personalizado esta desactivado con display:none!important,
   asi que cualquier cursor:none deja al visitante sin puntero. */
.blog-card, .blog-feat-card, .blog-filter, .form-tab, .acc-head,
a, button, [role="button"], label, summary { cursor: pointer; }
input, textarea, select { cursor: auto; }

/* Separacion del selector de idioma respecto al menu (Sep 2026) */
.wn-lang { margin-left: 26px; }

/* Cabecera movil: en pantallas pequenas la barra no cabia y el boton
   CONTACTANOS quedaba cortado fuera de pantalla (Sep 2026).
   Las redes ya estan dentro del menu hamburguesa, asi que se ocultan de la barra. */
@media (max-width: 860px){
  .wn-social { display: none !important; }
  .wn-lang { margin-left: 0 !important; }
  .wn-cta { padding-left: 16px; padding-right: 16px; font-size: 11px; }
}
/* Area tactil del selector de idioma */
.wn-lang a, .wn-lang-active { display: inline-block; padding: 8px 4px; }

/* iOS hace zoom automatico al tocar un campo con letra menor de 16px.
   Al volver del zoom la pagina queda descuadrada (Sep 2026). */
@media (max-width: 860px){
  input, select, textarea { font-size: 16px !important; }
}
/* WIRA related-as-cards 2026-09-18 */
section.sv-incl:has(.sv-incl-item a[href]) .sv-incl-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))!important;gap:20px!important}
section.sv-incl:has(.sv-incl-item a[href]) .sv-incl-item{padding:24px!important;border:1px solid color-mix(in srgb,currentColor 16%,transparent)!important;border-radius:16px!important;align-items:flex-start;transition:transform .35s cubic-bezier(.22,1,.36,1),border-color .35s ease,background .35s ease}
section.sv-incl:has(.sv-incl-item a[href]) .sv-incl-item:hover{transform:translateY(-5px);border-color:var(--orange)!important;background:color-mix(in srgb,var(--orange) 8%,transparent)!important}

/* Accessibility and motion preferences — 10 October 2026.
   Navigation keeps the brand accent; small text has sufficient contrast. */
.wn{background:#fff}
.wn .wn-link,.wn .wn-social a,.wn .wn-lang a{color:#595959}
.wn .wn-link:hover,.wn .wn-link.active,.wn .wn-lang a:hover{color:var(--ink)}
.wn .wn-lang-active{color:#b43c0a}
.wn .wn-lang-sep{color:#595959}
.wn .wn-cta{color:var(--ink)}
.wn .wn-cta:hover,.wn .wn-cta:focus-visible{color:#fff}
.wn .wn-cta:focus-visible::before{transform:translateY(0)}
.wn a:focus-visible,.wn button:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .hero-eyebrow,.hero-bottom,.hero-scroll,.reveal,.tline>span,.clip-reveal{opacity:1!important;transform:none!important;clip-path:none!important}
  .hero-title .ln>span,.hero-photo img,.hero-photo video,.hero-ghost{transform:none!important}
}