/* ══════════════════════════════════════
   TOKENS — MODO OSCURO (default)
══════════════════════════════════════ */
:root {
  --pink:        #EC4899;
  --orange:      #F97316;
  --lime:        #639c08;
  --violet:      #6D28D9;
  --textGris:    #595959;

  /* dark mode vars */
  --bg:          #111827;
  --bg2:         #1F2937;
  --bg3:         #111;
  --surface:     #111827;
  --text:        #FFFFFF;
  --text-muted:  rgba(255,255,255,.55);
  --text-faint:  rgba(255,255,255,.35);
  --border:      rgba(255,255,255,.08);
  --border-soft: rgba(255,255,255,.1);
  --input-bg:    rgba(255,255,255,.05);
  --input-border:rgba(255,255,255,.1);
  --card-bg:     #111827;
  --footer-bg:   #0a0a0a;
  --footer-border:rgba(255,255,255,.06);
  --footer-link: rgba(255,255,255,.55);
  --nav-stuck:   rgba(10,10,10,.94);
  --nav-border:  rgba(255,255,255,.07);
  --mmenu-bg:    #111827;
  --proc-n-col:  rgba(255,255,255,.1);
  --svc-bg:      #111;
  --proj-bg:     #111;
}

/* ══════════════════════════════════════
   TOKENS — MODO CLARO
══════════════════════════════════════ */
body.light {
  --bg:          #F8F7F4;
  --bg2:         #EDEAE4;
  --bg3:         #E5E2DC;
  --surface:     #F8F7F4;
  --text:        #0F0F0F;
  --text-muted:  rgba(15,15,15,.6);
  --text-faint:  rgba(15,15,15,.4);
  --border:      rgba(0,0,0,.07);
  --border-soft: rgba(0,0,0,.1);
  --input-bg:    rgba(0,0,0,.04);
  --input-border:rgba(0,0,0,.15);
  --card-bg:     #EDEAE4;
  --footer-bg:   #0F0F0F;
  --footer-border:rgba(255,255,255,.06);
  --footer-link: rgba(255,255,255,.55);
  --nav-stuck:   rgba(248,247,244,.96);
  --nav-border:  rgba(0,0,0,.08);
  --mmenu-bg:    #F8F7F4;
  --proc-n-col:  rgba(0,0,0,.1);
  --svc-bg:      #EDEAE4;
  --proj-bg:     #EDEAE4;
}

/* ══════════════════════════════════════
   RESET
══════════════════════════════════════ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'Montserrat',sans-serif;
  background:var(--bg);
  color:var(--text);
  overflow-x:hidden;
  cursor:none;
  transition:background .4s, color .4s;
}

/* ══════════════════════════════════════
   DARK/LIGHT TOGGLE BUTTON
══════════════════════════════════════ */
.theme-toggle {
  position: fixed;
  bottom: 104px;
  right: 30px;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  border: none;
  cursor: pointer;
  z-index: 998;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg2);
  box-shadow: 0 4px 20px rgba(0,0,0,.25);
  transition: background .3s, transform .3s, box-shadow .3s;
  outline: none;
}
.theme-toggle:hover {
  transform: scale(1.1);
  box-shadow: 0 6px 28px rgba(0,0,0,.35);
}
.theme-toggle .ico-dark,
.theme-toggle .ico-light { 
  width: 22px; height: 22px;
  position: absolute;
  transition: opacity .3s, transform .3s;
}
/* dark mode: show moon, hide sun */
.theme-toggle .ico-dark  { opacity:1; transform:rotate(0deg); }
.theme-toggle .ico-light { opacity:0; transform:rotate(90deg); }
/* light mode: show sun, hide moon */
body.light .theme-toggle .ico-dark  { opacity:0; transform:rotate(-90deg); }
body.light .theme-toggle .ico-light { opacity:1; transform:rotate(0deg); }

/* ══════════════════════════════════════
   CURSOR
══════════════════════════════════════ */
.cur{position:fixed;width:14px;height:14px;background:var(--lime);border-radius:50%;pointer-events:none;z-index:9999;transform:translate(-50%,-50%);transition:background .2s,transform .15s}
.cur-ring{position:fixed;width:44px;height:44px;border:2px solid rgba(163,230,53,.45);border-radius:50%;pointer-events:none;z-index:9998;transform:translate(-50%,-50%);transition:width .3s,height .3s,border-color .3s}
@media(hover:none){.cur,.cur-ring{display:none}body{cursor:auto}}

/* ══════════════════════════════════════
   NAV
══════════════════════════════════════ */
nav{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  display:flex;align-items:center;justify-content:space-between;
  padding:20px 48px;
  transition:background .4s,padding .3s,backdrop-filter .4s;
}
nav.stuck{
  background:var(--nav-stuck);
  backdrop-filter:blur(16px);
  padding:14px 48px;
  border-bottom:1px solid var(--nav-border);
}
.nav-logo{
  font-size:24px;font-weight:900;letter-spacing:-.03em;
  color:var(--text);text-decoration:none;
  display:flex;align-items:center;gap:3px;
}
.nav-ul{display:flex;gap:36px;list-style:none}
.nav-ul a{
  color:var(--text-muted);text-decoration:none;
  font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  transition:color .2s;
}
.nav-ul a:hover{color:var(--text)}
.nav-btn{
  background:var(--lime);color: var(--text);
  padding:11px 26px;border-radius:100px;
  font-size:12px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;
  text-decoration:none;transition:background .2s,transform .2s;
  white-space:nowrap;
}
.nav-btn:hover{background:var(--lime);transform:scale(1.04)}
.burger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:4px}
.burger span{display:block;width:22px;height:2px;background:var(--text);border-radius:2px;transition:all .3s}
.nav-logo-img{width:250px;}

/* ══════════════════════════════════════
   MOBILE MENU
══════════════════════════════════════ */
.mmenu{
  display:none;position:fixed;inset:0;
  background:var(--mmenu-bg);z-index:990;
  flex-direction:column;align-items:center;justify-content:center;gap:24px;
  transition:background .4s;
}
.mmenu.open{display:flex}
.mmenu a{font-size:clamp(32px,8vw,52px);font-weight:900;color:var(--text);text-decoration:none;letter-spacing:-.02em;transition:color .2s}
.mmenu a:hover{color:var(--lime)}
.mmenu-close{position:absolute;top:24px;right:24px;background:none;border:none;color:var(--text);font-size:36px;cursor:pointer;line-height:1}

/* ══════════════════════════════════════
   HERO
══════════════════════════════════════ */
#home{
  min-height:100svh;
  background:var(--bg);
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:clamp(80px,12vw,140px) clamp(20px,6vw,80px) clamp(40px,6vw,80px);
  position:relative;overflow:hidden;
  transition:background .4s;
}
.blob-hero{position:absolute;border-radius:50%;filter:blur(0);pointer-events:none;}
.bh1{
  width:clamp(200px,35vw,420px);height:clamp(200px,35vw,420px);
  background:radial-gradient(circle at 35% 35%,#a855f7,#6D28D9 40%,#3b0764);
  top:8%;right:-5%;border-radius:50%;
  box-shadow:0 30px 80px rgba(0,0,0,.5);
  animation:float1 7s ease-in-out infinite;opacity:.5;
}
.bh2{
  width:clamp(100px,16vw,200px);height:clamp(100px,16vw,200px);
  background:radial-gradient(circle at 30% 30%,#f472b6,#EC4899 50%,#9d174d);
  bottom:12%;right:4%;
  box-shadow:0 20px 50px rgba(0,0,0,.4);
  animation:float2 5s ease-in-out infinite;opacity:.4;
}
/* light mode blobs — más suaves */
body.light .bh1{opacity:.25;}
body.light .bh2{opacity:.2;}
@keyframes float1{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-24px) rotate(4deg)}}
@keyframes float2{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}

.hero-tag{
  font-family:'DM Mono',monospace;font-size:clamp(10px,1.5vw,13px);
  color:var(--lime);letter-spacing:.2em;text-transform:uppercase;
  margin-bottom:clamp(16px,3vw,28px);
  display:flex;align-items:center;gap:10px;
  opacity:0;animation:up .7s ease .2s forwards;
}
.hero-tag::before{content:'';display:block;width:30px;height:2px;background:var(--lime)}
.hero-h1{
  font-size:clamp(52px,11vw,148px);font-weight:900;line-height:.88;
  letter-spacing:-.04em;color:var(--text);
  margin-bottom:clamp(24px,4vw,48px);
}
.hl{display:block;overflow:hidden}
.hw{display:inline-block;opacity:0;transform:translateY(110%)}
.hw.a{animation:up2 .9s cubic-bezier(.16,1,.3,1) .3s forwards}
.hw.b{animation:up2 .9s cubic-bezier(.16,1,.3,1) .45s forwards}
.hw.c{animation:up2 .9s cubic-bezier(.16,1,.3,1) .6s forwards;color:var(--pink)}
.hw.d{animation:up2 .9s cubic-bezier(.16,1,.3,1) .75s forwards}
.hw.e{animation:up2 .9s cubic-bezier(.16,1,.3,1) .9s forwards;color:var(--lime)}
.hw.f{animation:up2 .9s cubic-bezier(.16,1,.3,1) 1.05s forwards}
@keyframes up2{to{opacity:1;transform:translateY(0)}}
@keyframes up{to{opacity:1;transform:translateY(0)}}

.hero-bottom{
  display:flex;align-items:flex-end;justify-content:space-between;gap:24px;
  flex-wrap:wrap;opacity:0;animation:up .8s ease 1.2s forwards;
}
.hero-sub{max-width:min(460px,100%);font-size:clamp(14px,1.8vw,18px);line-height:1.65;color:var(--text-muted);font-weight:500;}
.hero-sub strong{color:var(--text);font-weight:900}
.hero-locs{margin-top:14px;display:flex;gap:16px;flex-wrap:wrap}
.hero-loc{font-family:'DM Mono',monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-faint);display:flex;align-items:center;gap:5px;}
.hero-loc::before{content:'◎';font-size:8px}
.hero-ctas{display:flex;gap:12px;flex-wrap:wrap;flex-shrink:0}

/* ══════════════════════════════════════
   BUTTONS
══════════════════════════════════════ */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:16px 32px;border-radius:100px;
  font-size:13px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;
  text-decoration:none;border:none;cursor:none;
  transition:transform .2s,box-shadow .2s;
  position:relative;overflow:hidden;
}
.btn:hover{transform:translateY(-3px)}
.btn-dark{background:var(--text);color:var(--bg)}
.btn-dark:hover{box-shadow:0 16px 48px rgba(0,0,0,.3)}
.btn-outline{background:transparent;color:var(--text);border:2px solid var(--border-soft)}
.btn-outline:hover{background:var(--text);color:var(--bg)}
.btn .arr{transition:transform .25s}
.btn:hover .arr{transform:translateX(4px)}
.btn-lime{background:var(--lime);color:#111}
.btn-lime:hover{box-shadow:0 16px 48px rgba(163,230,53,.35)}

/* ══════════════════════════════════════
   MARQUEE
══════════════════════════════════════ */
.marquee{overflow:hidden;background:var(--violet);padding:16px 0;white-space:nowrap}
.marquee-inner{display:inline-flex;animation:mq 24s linear infinite}
.mq-item{font-size:12px;font-weight:900;letter-spacing:.15em;text-transform:uppercase;padding:0 32px;color:rgba(255,255,255,.85);display:inline-flex;align-items:center;gap:32px;}
.mq-item::after{content:'✦';color:var(--lime);font-size:9px}
@keyframes mq{to{transform:translateX(-50%)}}


@keyframes mq1{to{transform:translateX(-50%)}}
.marquee2{overflow:hidden;background: black;padding:16px 0;white-space:nowrap;transition:background .4s;}
.marquee-inner2{display:inline-flex;animation:mq1 24s linear infinite}
.mq-logo{width:250px;}
.mq-item2{font-size:12px;font-weight:900;letter-spacing:.15em;text-transform:uppercase;padding:0 32px;color:rgba(255,255,255,.85);display:inline-flex;align-items:center;gap:32px;}
.mq-item2::after{content:'✦';color: black;font-size:9px}
/* ══════════════════════════════════════
   SECTION UTILITIES
══════════════════════════════════════ */
.sp{padding:clamp(60px,10vw,120px) clamp(20px,6vw,80px)}
.slabel{font-family:'DM Mono',monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;display:flex;align-items:center;gap:10px;margin-bottom:16px;}
.slabel::before{content:'';display:block;width:28px;height:2px}
.slabel-lime{color:var(--lime)}
.slabel-lime::before{background:var(--lime)}
.stitle{font-size:clamp(36px,6vw,80px);font-weight:900;line-height:.95;letter-spacing:-.03em;}
.stitle em{font-style:normal}
.rv{opacity:0;transform:translateY(36px);transition:opacity .75s,transform .75s}
.rv.on{opacity:1;transform:translateY(0)}
.rv.d1{transition-delay:.1s}.rv.d2{transition-delay:.2s}
.rv.d3{transition-delay:.3s}.rv.d4{transition-delay:.4s}

/* ══════════════════════════════════════
   QUIÉNES
══════════════════════════════════════ */
#quienes{background:var(--bg2);color:var(--text);transition:background .4s,color .4s;}
.quienes-inner{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,80px);align-items:start;margin-top:clamp(40px,6vw,64px);}
.q-text{font-size:clamp(15px,1.8vw,18px);line-height:1.75;color:var(--text-muted)}
.q-text p+p{margin-top:18px}
.q-text strong{color:var(--text);font-weight:900}
.mvv{display:flex;flex-direction:column;gap:2px}
.mvv-card{background:var(--card-bg);padding:clamp(20px,3vw,32px);border-left:4px solid var(--lime);transition:border-color .3s,background .4s;}
.mvv-card:nth-child(2){border-color:var(--pink)}
.mvv-card:nth-child(3){border-color:var(--violet)}
.mvv-card:hover{border-color:var(--lime)}
.mvv-lbl{font-family:'DM Mono',monospace;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--text-faint);margin-bottom:8px}
.mvv-name{font-size:clamp(16px,1.8vw,20px);font-weight:900;margin-bottom:8px;color:var(--text)}
.mvv-desc{font-size:14px;line-height:1.65;color:var(--text-muted)}

/* ══════════════════════════════════════
   SERVICIOS
══════════════════════════════════════ */
#servicios{background:var(--bg);transition:background .4s;}
.svc-header{margin-bottom:clamp(40px,6vw,64px)}
.svc-title em{color:var(--orange)}
.svc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(380px,100%),1fr));gap:3px;}
.svc-card{background:var(--svc-bg);padding:clamp(28px,4vw,48px) clamp(20px,3vw,40px);position:relative;overflow:hidden;cursor:none;transition:background .35s;}
.svc-card::after{content:'';position:absolute;inset:0;opacity:0;transition:opacity .4s;}
.svc-card.cp::after{background:linear-gradient(135deg,var(--pink),transparent 60%)}
.svc-card.co::after{background:linear-gradient(135deg,var(--orange),transparent 60%)}
.svc-card.cv::after{background:linear-gradient(135deg,var(--violet),transparent 60%)}
.svc-card.cl::after{background:linear-gradient(135deg,#1a6600,transparent 60%)}
.svc-card:hover::after{opacity:.2}
.svc-num{font-family:'DM Mono',monospace;font-size:11px;color:var(--text-faint);letter-spacing:.15em;margin-bottom:20px;display:block}
.svc-ico{font-size:clamp(32px,4vw,44px);margin-bottom:16px;display:block;transition:transform .4s cubic-bezier(.16,1,.3,1)}
.svc-card:hover .svc-ico{transform:scale(1.1) rotate(-6deg)}
.svc-name{font-size:clamp(18px,2.2vw,24px);font-weight:900;letter-spacing:-.01em;margin-bottom:10px;position:relative;z-index:1;color:var(--text)}
.svc-desc{font-size:14px;line-height:1.65;color:var(--text-muted);margin-bottom:20px;position:relative;z-index:1}
.svc-tags{display:flex;flex-wrap:wrap;gap:6px;position:relative;z-index:1}
.svc-tag{font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;padding:5px 12px;border-radius:100px;border:1px solid var(--border-soft);color:var(--text-muted);transition:all .2s;}
.svc-card:hover .svc-tag{border-color:var(--text);color:var(--text)}
.svc-arr{position:absolute;bottom:24px;right:24px;font-size:20px;opacity:0;transform:translateX(-8px);transition:all .3s;color:var(--lime)}
.svc-card:hover .svc-arr{opacity:1;transform:translateX(0)}

/* light mode service cards */
body.light .svc-card{border:1px solid var(--border);}

/* ══════════════════════════════════════
   NOSOTROS
══════════════════════════════════════ */
#nosotros{background:var(--bg2);color:var(--text);transition:background .4s,color .4s;}
.nos-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,8vw,100px);align-items:start;margin-top:clamp(40px,6vw,64px);}
.nos-sticky{position:sticky;top:100px}
.nos-big{font-size:clamp(48px,7vw,88px);font-weight:900;line-height:.9;letter-spacing:-.04em;color:var(--text);margin-bottom:clamp(20px,3vw,36px);}
.nos-big .hl-violet{display:inline-block;background:var(--violet);color:#fff;padding:2px 16px;}
.nos-sub{font-size:clamp(14px,1.6vw,17px);line-height:1.8;color:var(--text-muted)}
.nos-sub2{font-size:clamp(16px,2vw,20px);line-height:1.8;color:var(--violet);}
.pillar{padding:clamp(24px,3vw,36px) 0;border-top:1px solid var(--border-soft)}
.pillar:last-child{border-bottom:1px solid var(--border-soft)}
.p-num{font-family:'DM Mono',monospace;font-size:10px;color:var(--text-faint);letter-spacing:.15em;margin-bottom:8px}
.p-name{font-size:clamp(20px,2.5vw,28px);font-weight:900;letter-spacing:-.01em;margin-bottom:10px;color:var(--text)}
.p-ico{float:right;font-size:24px;margin-top:-2px}
.p-desc{font-size:14px;line-height:1.7;color:var(--text-muted)}


/* ══════════════════════════════════════
   TEAM HERO BANNER
══════════════════════════════════════ */
.team-hero {
  position: relative;
  margin-top: 56px;
  border-radius: 20px;
  overflow: hidden;
  height: 650px;        /* más alto */
  max-width: 1000px;     /* más angosto */
  margin-left: auto;
  margin-right: auto;
}
@media(max-width: 768px) { .team-hero { height: 480px; } }

.team-hero-img {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center 20%;
  display: block;
  transition: transform .8s ease;
}
.team-hero:hover .team-hero-img {
  transform: scale(1.03);
}

.team-hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(
    to top,
    rgba(0,0,0,.82) 0%,
    rgba(0,0,0,.45) 45%,
    rgba(0,0,0,.1)  100%
  );
}

.team-hero-content {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  padding: 48px 52px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 40px;
  flex-wrap: wrap;
}
@media(max-width: 680px) {
  .team-hero-content { padding: 36px 28px; flex-direction: column; align-items: flex-start; }
}

.team-hero-desc {
  font-size: 18px; line-height: 1.65;
  color: rgba(255,255,255,.88);
  max-width: 520px;
  font-weight: 500;
}

.team-banner-content {
  background: var(--card-bg);
  padding: 56px 48px;
  display: flex; flex-direction: column;
  justify-content: center; gap: 32px;
  border-left: 1px solid var(--border);
}
@media(max-width: 860px) {
  .team-banner-content { padding: 40px 32px; border-left: none; border-top: 1px solid var(--border); }
}

.team-banner-desc {
  font-size: 17px; line-height: 1.75;
  color: var(--text-muted);
}

/* ══════════════════════════════════════
   PROYECTOS
══════════════════════════════════════ */
#proyectos{background:var(--bg);transition:background .4s;}
.proj-header{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:clamp(32px,5vw,56px);}
.proj-sub{max-width:280px;font-size:14px;line-height:1.7;color:var(--text-muted)}
.proj-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:10px;}
.pc{border-radius:6px;overflow:hidden;position:relative;cursor:none;background:var(--proj-bg)}
.pc:nth-child(1){grid-column:span 7}
.pc:nth-child(2){grid-column:span 5}
.pc:nth-child(3){grid-column:span 5}
.pc:nth-child(4){grid-column:span 7}
.pc-img{width:100%;aspect-ratio:16/10;display:flex;align-items:center;justify-content:center;font-size:clamp(40px,6vw,72px);transition:transform .7s cubic-bezier(.16,1,.3,1);}
.pc:hover .pc-img{transform:scale(1.05)}
.pi1{background:linear-gradient(135deg,#2d0066,var(--violet))}
.pi2{background:linear-gradient(135deg,#660020,var(--pink))}
.pi3{background:linear-gradient(135deg,#4d1900,var(--orange))}
.pi4{background:linear-gradient(135deg,#1a3300,#447700,var(--lime))}
.pc-ov{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.95) 0%,transparent 55%);display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(16px,2.5vw,28px);transform:translateY(30%);transition:transform .5s cubic-bezier(.16,1,.3,1);}
.pc:hover .pc-ov{transform:translateY(0)}
.pc-cat{font-family:'DM Mono',monospace;font-size:10px;color:var(--lime);letter-spacing:.18em;text-transform:uppercase;margin-bottom:6px;opacity:0;transition:opacity .3s .1s}
.pc:hover .pc-cat{opacity:1}
.pc-name{font-size:clamp(16px,2vw,22px);font-weight:900;line-height:1.1;margin-bottom:8px;color:#fff}
.pc-link{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--lime);text-decoration:none;display:flex;align-items:center;gap:6px;opacity:0;transition:opacity .3s .15s}
.pc:hover .pc-link{opacity:1}

/* ══════════════════════════════════════
   PROCESO
══════════════════════════════════════ */
#proceso{background:var(--bg);color:var(--text);transition:background .4s,color .4s;}
.proc-steps{margin-top:clamp(40px,6vw,64px)}
.proc-step{display:grid;grid-template-columns:clamp(48px,6vw,80px) 1fr 1fr;gap:clamp(16px,3vw,48px);align-items:start;padding:clamp(24px,4vw,44px) 0;border-top:1px solid var(--border);cursor:none;}
.proc-step:last-child{border-bottom:1px solid var(--border)}
.proc-n{font-family:'DM Mono',monospace;font-size:clamp(32px,5vw,48px);font-weight:400;color:var(--proc-n-col);line-height:1;transition:color .3s}
.proc-step:hover .proc-n{color:var(--lime)}
.proc-name{font-size:clamp(26px,3vw,32px);font-weight:900;letter-spacing:-.02em;margin-bottom:6px;color:var(--text)}
.proc-tag{font-family:'DM Mono',monospace;font-size:13px;color:var(--lime);letter-spacing:.15em;text-transform:uppercase}
.proc-desc{font-size:18px;line-height:1.7;color:var(--text-muted);padding-top:6px}

/* ══════════════════════════════════════
   CTA BANNER
══════════════════════════════════════ */
.cta-banner{
  background:linear-gradient(135deg, var(--violet) 0%, var(--pink) 50%, var(--orange) 100%);
  padding:clamp(60px,10vw,120px) clamp(20px,6vw,80px);
  text-align:center;position:relative;overflow:hidden;
}
.cta-banner::before{content:'TRIA';position:absolute;font-size:clamp(120px,30vw,400px);font-weight:900;color:rgba(0,0,0,.06);top:50%;left:50%;transform:translate(-50%,-50%);letter-spacing:-.05em;user-select:none;pointer-events:none;white-space:nowrap;}
.cta-banner h2{font-size:clamp(36px,8vw,96px);font-weight:900;letter-spacing:-.03em;line-height:.9;color:#fff;margin-bottom:clamp(16px,3vw,32px);position:relative;}
.cta-banner p{font-size:clamp(15px,2vw,18px);opacity:.85;margin-bottom:clamp(28px,4vw,48px);color:rgba(255,255,255,.85);position:relative}

.cta-banner2{
  background: var(--bg);
  padding:clamp(60px,10vw,120px) clamp(20px,6vw,80px);
  text-align:center;position:relative;overflow:hidden;
}

.cta-banner2 h2{font-size: 50px;font-weight:800;letter-spacing:-.03em;line-height:.9;color:var(--text);margin-bottom:clamp(16px,3vw,32px);position:relative;}
.cta-banner2 p{font-size:clamp(15px,2vw,18px);opacity:.85;margin-bottom:clamp(28px,4vw,48px);color: var(--text);position:relative}

.cta-banner3{
  background: black;
  padding: 30px ;
  text-align:center;position:relative;overflow:hidden;
}

.cta-banner3 h2{font-size: 50px;font-weight:800;letter-spacing:-.03em;line-height:.9;color: white;margin-bottom:clamp(16px,3vw,32px);position:relative;}



/* ══════════════════════════════════════
   CONTACTO
══════════════════════════════════════ */
#contacto{background:var(--bg2);transition:background .4s;}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,8vw,100px);align-items:start;margin-top:clamp(40px,6vw,64px);}
.contact-big{font-size:clamp(40px,6vw,80px);font-weight:900;line-height:.92;letter-spacing:-.03em;margin-bottom:clamp(20px,3vw,36px);color:var(--text)}
.contact-big em{font-style:normal;color:var(--pink)}
.cd{margin-top:clamp(32px,5vw,48px)}
.cd-item{margin-bottom:24px}
.cd-lbl{font-family:'DM Mono',monospace;font-size:10px;color:var(--text-faint);letter-spacing:.18em;text-transform:uppercase;margin-bottom:4px}
.cd-val{font-size:clamp(15px,1.8vw,18px);font-weight:600;color:var(--text);text-decoration:none;display:block;transition:color .2s}
.cd-val:hover{color:var(--lime)}
.cform{display:flex;flex-direction:column;gap:16px}
.fg{display:flex;flex-direction:column;gap:6px}
.fl{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-faint)}
.fi,.fta,.fs{
  background:var(--input-bg);border:1px solid var(--input-border);
  border-radius:8px;color: var(--textGris);
  font-family:'Montserrat',sans-serif;font-size:15px;
  padding:clamp(12px,2vw,16px) clamp(14px,2vw,18px);
  transition:border-color .2s,background .2s,color .2s;outline:none;width:100%;cursor:none;
}

.fi:focus,.fta:focus,.fs:focus{border-color:var(--lime);background:rgba(163,230,53,.06)}
.fs{appearance:none}
.fta{resize:vertical;min-height:120px;line-height:1.6}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fsub{margin-top:8px;align-self:flex-start}

/* ══════════════════════════════════════
   FOOTER — siempre oscuro
══════════════════════════════════════ */
footer{
  background:var(--footer-bg);
  border-top:1px solid var(--footer-border);
  padding:clamp(40px,6vw,60px) clamp(20px,6vw,80px) clamp(24px,4vw,40px);
}
.footer-logo-img{width:350px;}
.ft{display:flex;justify-content:space-between;align-items:flex-start;gap:40px;margin-bottom:48px;flex-wrap:wrap}
.fl-tag{font-size:13px;color:#888;margin-bottom:16px}
.fl-offices{display:flex;flex-direction:column;gap:5px}
.fl-office{font-size:11px;color:rgba(255,255,255,.3);font-family:'DM Mono',monospace;display:flex;align-items:center;gap:7px}
.fl-office::before{content:'◎';color:var(--lime);font-size:8px}
.f-links{display:flex;gap:clamp(32px,5vw,72px);flex-wrap:wrap}
.f-col-t{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#888;margin-bottom:16px}
.f-col a{display:block;font-size:14px;color:rgba(255,255,255,.55);text-decoration:none;margin-bottom:10px;transition:color .2s}
.f-col a:hover{color:#fff}
.fb{display:flex;justify-content:space-between;align-items:center;padding-top:24px;border-top:1px solid var(--footer-border);flex-wrap:wrap;gap:16px}
.fb-copy{font-size:12px;color:#888}
.fb-soc{display:flex;gap:20px}
.fb-s{font-size:12px;color:rgba(255,255,255,.35);text-decoration:none;font-weight:600;transition:color .2s}
.fb-s:hover{color:var(--lime)}

/* ══════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════ */
@media(max-width:900px){
  nav{padding:16px 24px}
  nav.stuck{padding:12px 24px}
  .nav-ul,.nav-btn{display:none}
  .burger{display:flex}
  #home{padding:80px 20px 40px}
  .sp{padding:clamp(48px,8vw,80px) 20px}
  .nav-logo-img{width:150px}
  .quienes-inner{grid-template-columns:1fr}
  .nos-grid{grid-template-columns:1fr}
  .nos-sticky{position:static}
  .contact-grid{grid-template-columns:1fr}
  .proj-grid{grid-template-columns:1fr}
  .pc:nth-child(n){grid-column:span 12}
  .proc-step{grid-template-columns:1fr;gap:10px}
  .proc-n{font-size:28px}
  .hero-bottom{flex-direction:column;align-items:flex-start}
  .hero-ctas{width:100%}
  .btn{width:100%;justify-content:center;padding:16px 24px}
  .frow{grid-template-columns:1fr}
  .ft{flex-direction:column}
  .f-links{gap:32px}
  .cta-banner{padding:60px 20px}
  footer{padding:48px 20px 32px}
  .team-grid{grid-template-columns:1fr}
  .bh1{width:160px;height:160px;top:6%;right:-10px}
  .bh2{width:90px;height:90px;bottom:10%;right:6px}
  .theme-toggle{bottom:104px;right:16px;width:46px;height:46px}
  .footer-logo-img{width:200px}
}
@media(max-width:480px){
  .nav-logo-img{width:140px}
  .hero-h1{font-size:clamp(44px,13vw,68px)}
  .stitle{font-size:clamp(30px,8vw,48px)}
  .nos-big{font-size:clamp(40px,10vw,56px)}
  .contact-big{font-size:clamp(36px,9vw,52px)}
}
::selection{background:var(--lime);color:#111}

/* contact intro text — adapts to theme */
.contact-intro-text { color: var(--text-muted); }

/* light mode: logo in nav needs to be visible on light bg */
body.light .nav-logo-img { filter: invert(1); }

/* light mode: service card hover text contrast */
body.light .svc-card:hover .svc-name,
body.light .svc-card:hover .svc-desc { color: var(--text); }

/* light mode: mvv card text */
body.light .mvv-card { color: var(--text); }