/* ── RESET ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:#f7ffe0;
  color:#0a0a0a;
  font-family:'Montserrat',sans-serif;
  overflow-x:hidden;
}

/* ── CURSOR (solo desktop) ── */
@media(hover:hover){
  body{cursor:none;}
  #cursor{position:fixed;width:10px;height:10px;border-radius:50%;background:#0a0a0a;pointer-events:none;z-index:9999;transform:translate(-50%,-50%);mix-blend-mode:difference;transition:width .25s,height .25s;}
  #cursor.grow{width:48px;height:48px;}
  #cursor-ring{position:fixed;width:38px;height:38px;border-radius:50%;border:1px solid rgba(10,10,10,.2);pointer-events:none;z-index:9998;transform:translate(-50%,-50%);}
}

/* ── LOADER ── */
#loader{
  position:fixed;inset:0;background:#0a0a0a;z-index:9000;
  display:flex;align-items:center;justify-content:center;
  padding:0 40px;
  transition:opacity .7s ease,transform .8s ease;
}
#loader.done{opacity:0;pointer-events:none;transform:translateY(-100%);}
#loader-logo{
  width:min(55%, 640px);
  margin:0 auto;
  opacity:0;transform:translateY(20px);
  transition:opacity .6s ease,transform .6s ease;
  display:block;
}
#loader-logo svg{width:100%;height:auto;display:block;}

/* ── WRAPPER ── */
.wrapper{max-width:1440px;margin:0 auto;}

/* ── HEADER ── */
header{padding:32px 60px 0;}
.header-logo{display:block;width:100%;text-decoration:none;}
.header-logo svg{display:block;width:100%;height:auto;}
.header-line{width:100%;height:1.5px;background:#0a0a0a;margin-top:8px;}
.header-nav{
  display:flex;justify-content:flex-end;align-items:center;
  gap:48px;padding:20px 0;list-style:none;
}
.header-nav a{
  font-family:'Montserrat',sans-serif;font-weight:600;font-size:12px;
  color:#0a0a0a;text-decoration:none;letter-spacing:.04em;text-transform:uppercase;
  position:relative;
}
.header-nav a::after{
  content:'';position:absolute;bottom:-2px;left:0;
  width:0;height:1px;background:#0a0a0a;
  transition:width .3s ease;
}
.header-nav a:hover::after{width:100%;}

/* hamburger — hidden on desktop */
.menu-toggle{display:none;}

/* ── HERO ── */
.hero{padding:100px 60px 160px;}
.hero h1{
  font-family:'Syne',sans-serif;font-weight:500;
  font-size:clamp(40px,5.5vw,72px);
  line-height:1.06;letter-spacing:-.02em;
  margin-bottom:56px;
}
.hero-btns{display:flex;gap:24px;align-items:center;flex-wrap:wrap;}
.btn-yellow{
  display:inline-flex;align-items:center;gap:8px;
  background:#f7b407;color:#0a0a0a;
  font-family:'Syne',sans-serif;font-weight:600;font-size:16px;
  padding:12px 24px;border-radius:24px;text-decoration:none;
  transition:opacity .2s;white-space:nowrap;
}
.btn-yellow:hover{opacity:.82;}
.btn-outline{
  display:inline-flex;align-items:center;gap:8px;
  background:transparent;color:#0a0a0a;
  font-family:'Syne',sans-serif;font-weight:600;font-size:16px;
  padding:12px 24px;border-radius:24px;text-decoration:none;
  border:1.5px solid #0a0a0a;
  transition:background .2s,color .2s;white-space:nowrap;
}
.btn-outline:hover{background:#0a0a0a;color:#f7ffe0;}

/* ── TAGLINE ── */
.tagline{padding:120px 60px;text-align:center;}
.tagline h2{
  font-family:'Syne',sans-serif;font-weight:500;
  font-size:clamp(32px,4.5vw,64px);
  line-height:1.1;letter-spacing:-.02em;margin-bottom:24px;
}
.tagline p{
  font-family:'Montserrat',sans-serif;font-weight:400;
  font-size:clamp(18px,1.8vw,24px);line-height:1.6;
}

/* ── SPLIT SECTIONS (servicios / proceso / equipo) ── */
.split-section{
  padding:100px 0;
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:start;
  gap:0;
}
.split-left{
  padding:0 40px 0 60px;
  position:sticky;top:60px;
}
.split-left h2{
  font-family:'Syne',sans-serif;font-weight:600;
  font-size:clamp(28px,3.2vw,48px);
  line-height:1.1;letter-spacing:-.02em;
}
.split-right{
  padding:0 60px 0 0;
  display:flex;flex-direction:column;gap:56px;
}

/* items */
.item h3{
  font-family:'Syne',sans-serif;font-weight:500;
  font-size:clamp(22px,2.2vw,36px);
  line-height:1.2;margin-bottom:14px;
}
.item p{
  font-family:'Montserrat',sans-serif;font-weight:400;
  font-size:clamp(16px,1.5vw,22px);
  line-height:1.6;max-width:560px;
}

/* ── TEAM ── */
.team-photo{
  width:100%;aspect-ratio:588/766;
  background:#f7ffe0;
  border:1.5px solid #0a0a0a;
  border-radius:4px;
  margin-bottom:28px;
  overflow:hidden;
  position:relative;
  display:flex;
  align-items:flex-end;
  justify-content:center;
}
.team-illustration{
  width:auto;
  height:90%;
  max-height:90%;
  display:block;
  object-fit:contain;
  position:absolute;
  bottom:0;
  left:50%;
  transform:translateX(-50%);
}
.team-photo img{width:100%;height:100%;object-fit:cover;}
.team-name{
  font-family:'Syne',sans-serif;font-weight:500;
  font-size:clamp(24px,2.5vw,36px);margin-bottom:10px;
}
.team-role{
  font-family:'Montserrat',sans-serif;font-weight:400;
  font-size:15px;opacity:.55;margin-bottom:24px;
}
.team-bio{
  font-family:'Montserrat',sans-serif;font-weight:400;
  font-size:clamp(15px,1.4vw,20px);line-height:1.65;
}

/* ── SECCIÓN NEGRA ── */
.dark-section{
  background:#0a0a0a;
  width:100vw;
  position:relative;
  left:50%;margin-left:-50vw;
  overflow:hidden;
}

/* MARQUEE */
.marquee-wrap{overflow:hidden;padding:60px 0 0;}
.marquee-track{display:flex;width:max-content;animation:mq 22s linear infinite;}
.mq-item{
  font-family:'Syne',sans-serif;font-weight:800;
  font-size:clamp(80px,14vw,200px);
  color:#fff;white-space:nowrap;padding-right:60px;
  letter-spacing:-.04em;line-height:1;opacity:.15;
  user-select:none;
}
@keyframes mq{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* CONTACTO */
.contacto-inner{
  max-width:1440px;margin:0 auto;
  padding:80px 60px 0;
}
.contacto-inner h2{
  font-family:'Syne',sans-serif;font-weight:600;
  font-size:clamp(28px,3.5vw,48px);
  color:#fff;line-height:1.2;letter-spacing:-.02em;margin-bottom:20px;
}
.contacto-email{
  font-family:'Syne',sans-serif;font-weight:600;
  font-size:clamp(22px,3vw,48px);
  color:#f7b407;text-decoration:underline;
  text-underline-offset:6px;letter-spacing:-.02em;
  display:inline-block;transition:opacity .2s;
}
.contacto-email:hover{opacity:.65;}

/* FOOTER */
.footer-inner{
  max-width:1440px;margin:0 auto;
  padding:60px 60px 48px;
}
.footer-line{width:100%;height:1px;background:rgba(255,255,255,.12);margin-bottom:28px;}
.footer-bottom{
  display:flex;justify-content:space-between;
  align-items:flex-start;flex-wrap:wrap;gap:20px;
}
.footer-desc{
  font-family:'Montserrat',sans-serif;font-weight:400;
  font-size:clamp(14px,1.4vw,20px);
  color:#fff;line-height:1.6;max-width:520px;opacity:.55;
}
.footer-links{display:flex;gap:28px;flex-wrap:wrap;}
.footer-links a{
  font-family:'Montserrat',sans-serif;font-size:14px;
  color:#fff;opacity:.35;text-decoration:none;
  transition:opacity .2s;
}
.footer-links a:hover{opacity:.8;}

/* ── ANIMATIONS ── */
.split-line{overflow:hidden;display:block;}
.split-inner{
  display:block;transform:translateY(110%);
  transition:transform .9s cubic-bezier(.16,1,.3,1);
}
.split-inner.up{transform:translateY(0);}
.fu{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s ease;}
.fu.up{opacity:1;transform:translateY(0);}
.d1{transition-delay:.1s}.d2{transition-delay:.2s}.d3{transition-delay:.28s}
.d4{transition-delay:.36s}.d5{transition-delay:.44s}.d6{transition-delay:.52s}

/* ── TABLET (max 900px) ── */
@media(max-width:900px){
  header{padding:24px 32px 0;}
  .hero{padding:72px 32px 100px;}
  .tagline{padding:80px 32px;}
  .split-section{grid-template-columns:1fr;padding:72px 0;}
  .split-left{
    position:static;
    padding:0 32px 48px;
  }
  .split-right{padding:0 32px;gap:48px;}
  .item p{max-width:100%;}
  .contacto-inner{padding:60px 32px 0;}
  .footer-inner{padding:48px 32px 40px;}
}

/* ── MOBILE (max 600px) ── */
@media(max-width:600px){
  /* HEADER */
  header{padding:20px 24px 0;}
  .header-nav{display:none;flex-direction:column;gap:0;padding:0;}
  .header-nav.open{
    display:flex;position:fixed;inset:0;background:#f7ffe0;
    justify-content:center;align-items:center;gap:40px;
    z-index:200;
  }
  .header-nav.open a{font-size:24px;}
  .menu-toggle{
    display:flex;flex-direction:column;gap:5px;
    background:none;border:none;cursor:pointer;
    padding:4px;z-index:300;position:relative;
  }
  .menu-toggle span{
    display:block;width:24px;height:2px;
    background:#0a0a0a;transition:transform .3s,opacity .3s;
  }
  .menu-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  .menu-toggle.open span:nth-child(2){opacity:0;}
  .menu-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
  .header-nav-wrap{
    display:flex;justify-content:space-between;
    align-items:center;padding:16px 0;
  }

  /* HERO */
  .hero{padding:56px 24px 80px;}
  .hero h1{font-size:clamp(34px,9vw,48px);margin-bottom:40px;}
  .hero-btns{flex-direction:column;align-items:flex-start;gap:16px;}
  .btn-yellow,.btn-outline{font-size:15px;padding:11px 20px;}

  /* TAGLINE */
  .tagline{padding:64px 24px;}
  .tagline h2{font-size:clamp(26px,7vw,36px);}
  .tagline p{font-size:16px;}

  /* SPLIT */
  .split-section{padding:56px 0;}
  .split-left{padding:0 24px 40px;}
  .split-right{padding:0 24px;gap:40px;}

  /* CONTACTO / FOOTER */
  .contacto-inner{padding:48px 24px 0;}
  .footer-inner{padding:40px 24px 36px;}
  .footer-bottom{flex-direction:column;gap:16px;}

  /* MARQUEE más pequeño en móvil */
  .marquee-wrap{padding:40px 0 0;}
}