:root{--bg:#080b0d;--white:#f8f5f0;--yellow:#ffc629;--red:#ff3447;--cyan:#19c7e7;--line:rgba(255,255,255,.38);--script:'Permanent Marker',cursive;--hand:'Caveat',cursive;--sans:'Montserrat',Arial,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:84px}body{margin:0;background:var(--bg);color:var(--white);font-family:var(--sans);font-weight:400}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}.site-header{height:62px;position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(24px,6.7vw,82px);background:rgba(7,10,12,.88);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.25)}.brand{position:relative;display:flex;flex-direction:column;font-family:var(--script);font-size:23px;line-height:.82;transform:rotate(-7deg);letter-spacing:-1.4px}.brand span:nth-child(2){padding-left:5px}.brand em{font-style:normal;color:var(--yellow)}.brand i{height:4px;width:94px;background:var(--yellow);transform:rotate(-12deg);border-radius:50%;margin:5px 0 0 5px}.main-nav{display:flex;gap:clamp(25px,4.5vw,52px);height:100%;align-items:center;text-transform:uppercase;letter-spacing:1.5px;font-size:12px}.main-nav a{height:100%;display:flex;align-items:center;position:relative}.main-nav a:after{content:"";height:3px;width:0;background:var(--yellow);position:absolute;bottom:11px;left:0;transition:width .2s}.main-nav a:hover:after,.main-nav a.active:after{width:100%}.menu-toggle{display:none;background:none;border:0;font-size:25px}.hero{height:min(600px,59vw);min-height:490px;position:relative;overflow:hidden;background:#080b0d}.hero-photo{position:absolute;inset:0;background-image:url('../images/banner-estudio-02.png');background-position:center 40%;background-size:cover}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#080b0d 0%,rgba(8,11,13,.97) 25%,rgba(8,11,13,.72) 40%,rgba(8,11,13,.06) 65%,rgba(8,11,13,.02) 100%),linear-gradient(0deg,rgba(8,11,13,.45),transparent 22%)}.hero-copy{position:relative;z-index:1;padding:clamp(58px,7vw,92px) 0 0 clamp(28px,5.6vw,76px);max-width:52%}.hero-title{margin:0;font-family:var(--script);font-weight:400;font-size:clamp(64px,9.4vw,126px);letter-spacing:-5px;line-height:.82;transform:rotate(-10deg);transform-origin:left center;display:flex;flex-direction:column;text-shadow:0 2px 0 rgba(255,255,255,.05)}.hero-title span:nth-child(2){padding-left:12px;margin-top:8px;white-space:nowrap}.hero-title b{font-weight:400;color:var(--yellow)}.hero-tags{display:flex;align-items:center;gap:13px;margin:28px 0 0 30px;font-size:14px;letter-spacing:2px}.hero-tags i{width:7px;height:7px;background:var(--red);border-radius:50%}.hero-tags .blue-dot{background:var(--cyan)}.tagline{font-family:var(--hand);font-size:clamp(24px,3vw,34px);line-height:1.02;letter-spacing:.2px;margin:24px 0 28px 30px;transform:rotate(-4deg);max-width:340px}.social-links{display:flex;gap:22px;margin-left:28px;align-items:center}.social-links a{width:74px;height:74px;display:block;transition:transform .2s}.social-links a:hover{transform:translateY(-5px) rotate(-3deg)}.social-links img{display:block;width:100%;height:100%;object-fit:contain}.feature-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:-2px clamp(22px,3.4vw,42px) 0;position:relative;z-index:3}.feature-card{height:clamp(270px,32vw,340px);min-height:260px;position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.4);border-radius:12px;background:#0b0d0f}.card-image,.card-overlay{position:absolute;inset:0}.art-image{background:url('../images/dibujo-ojo.png') center 45%/cover no-repeat;left:31%;}.mic-image{background:url('../images/microfono-luces.jpg') center center/cover no-repeat;left:0}.card-overlay{background:linear-gradient(90deg,rgba(6,9,11,.98) 0%,rgba(6,9,11,.93) 39%,rgba(6,9,11,.25) 75%,rgba(6,9,11,.04) 100%)}.standup-card .card-overlay{background:linear-gradient(90deg,rgba(6,9,11,.15),rgba(6,9,11,.06) 30%,rgba(6,9,11,.86) 100%)}.feature-content{position:absolute;z-index:2;top:26px;left:clamp(24px,4vw,44px);width:57%;max-width:260px}.standup-card .feature-content{left:auto;right:26px;width:48%}.brush-title{font-family:var(--script);font-weight:400;font-size:clamp(42px,5.2vw,66px);letter-spacing:-2px;line-height:1;margin:0 0 14px;transform:rotate(-10deg);transform-origin:left center;white-space:nowrap;display:table}.underline-yellow:after{content:"";display:block;height:5px;background:var(--yellow);width:90%;border-radius:100%;transform:rotate(-7deg);margin:-1px 0 0 3px}.eyebrow{font-size:12px;letter-spacing:3px;line-height:1.45;margin:16px 0}.feature-description{font-size:13px;line-height:1.48;margin:18px 0 20px;max-width:245px}.pill-link{display:inline-flex;align-items:center;justify-content:center;gap:17px;border:2px solid #f8f5f0;border-radius:30px;padding:10px 19px;text-transform:uppercase;letter-spacing:1.7px;font-size:11px;font-weight:600;white-space:nowrap;transition:background .2s,color .2s}.pill-link span{font-size:19px;line-height:10px}.pill-link:hover{background:var(--white);color:#080b0d}.projects{padding:30px clamp(28px,3.4vw,42px) 0}.section-heading{display:flex;align-items:center;gap:22px;margin-bottom:17px}.section-heading h2{font-size:14px;text-transform:uppercase;letter-spacing:3px;font-weight:500;white-space:nowrap;margin:0}.heading-line{height:1px;background:rgba(255,255,255,.55);flex:1}.text-link{background:none;border:0;text-transform:uppercase;letter-spacing:1.6px;font-size:12px;white-space:nowrap;cursor:pointer}.text-link span{font-size:20px;margin-left:6px}.gallery-wrap{position:relative}.gallery-track{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;padding:0 25px}.project-thumb{position:relative;border:0;padding:0;overflow:hidden;border-radius:8px;background:#191919;aspect-ratio:1/1;cursor:pointer}.project-thumb img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .3s}.project-thumb:hover img{transform:scale(1.05)}.project-thumb span{position:absolute;left:0;right:0;bottom:0;padding:24px 8px 9px;background:linear-gradient(transparent,rgba(0,0,0,.85));font-size:11px;opacity:0;transition:opacity .2s}.project-thumb:hover span,.project-thumb:focus-visible span{opacity:1}.gallery-arrow{position:absolute;z-index:3;top:50%;transform:translateY(-50%);width:36px;height:36px;border:1px solid rgba(255,255,255,.8);border-radius:50%;background:rgba(5,8,10,.72);font-size:28px;line-height:20px;cursor:pointer}.gallery-arrow.prev{left:-12px}.gallery-arrow.next{right:-12px}.carousel-dots{display:none;justify-content:center;gap:7px;padding-top:14px}.carousel-dots button{width:6px;height:6px;border:0;border-radius:50%;background:#626262;padding:0}.carousel-dots button.active{background:var(--yellow)}.site-footer{min-height:260px;margin-top:10px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:40px 20px 30px}.footer-brush{position:absolute;bottom:0;width:min(31vw,225px);height:auto;pointer-events:none}.brush-left{left:0}.brush-right{right:0}.footer-content{position:relative;z-index:1;text-align:center;width:min(620px,80%)}.footer-content h2{font-family:var(--hand);font-size:clamp(36px,5vw,56px);font-weight:500;margin:0 0 22px;transform:rotate(-3deg)}.footer-content h2:after{content:"";display:block;width:55%;height:6px;background:var(--yellow);border-radius:100%;margin:-1px auto 0;transform:rotate(-5deg)}.footer-details{display:flex;align-items:center;justify-content:center;gap:clamp(16px,3.2vw,42px);font-size:10px;text-transform:uppercase;letter-spacing:1.4px;white-space:nowrap}.footer-details a,.footer-details span{display:inline-flex;align-items:center;gap:9px}.contact-icon{font-size:25px;font-weight:300}.pin{font-size:28px}.heart{font-size:28px;color:#ff3447}.footer-rule{height:1px;background:rgba(255,255,255,.45);margin:19px auto 14px;width:82%}.copyright{font-size:9px;letter-spacing:2px;margin:0}.modal{position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;padding:24px}.modal.open{display:flex}.modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.82);backdrop-filter:blur(8px)}.modal-panel{position:relative;z-index:1;width:min(880px,95vw);max-height:90vh;background:#101416;border:1px solid rgba(255,255,255,.25);border-radius:14px;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(240px,.85fr);align-items:stretch;box-shadow:0 20px 80px #000}.modal-panel>img{width:100%;height:100%;max-height:78vh;min-height:360px;object-fit:contain;background:#080b0d}.modal-copy{padding:40px 32px;align-self:center}.modal-copy h2{font-family:var(--script);font-size:clamp(28px,4vw,46px);font-weight:400;margin:8px 0 18px;transform:rotate(-5deg);transform-origin:left}.modal-copy p{font-size:14px;line-height:1.7}.modal-count{font-size:10px!important;letter-spacing:2px;text-transform:uppercase;color:var(--yellow)}.modal-close{position:absolute;right:12px;top:8px;z-index:3;background:rgba(0,0,0,.7);border:1px solid #777;border-radius:50%;width:36px;height:36px;font-size:27px;cursor:pointer}.modal-nav{position:absolute;z-index:3;top:50%;transform:translateY(-50%);width:36px;height:42px;border:1px solid #777;border-radius:30px;background:rgba(0,0,0,.65);font-size:26px;cursor:pointer}.modal-prev{left:10px}.modal-next{right:10px}
@media(min-width:1400px){.hero{height:620px}.hero-copy{padding-top:90px}.feature-card{height:350px}.projects{padding-top:34px}}
@media(max-width:760px){.site-header{height:60px;padding:0 20px}.brand{font-size:20px}.brand i{width:80px}.menu-toggle{display:block;cursor:pointer}.main-nav{display:none;position:absolute;top:60px;left:0;right:0;height:auto;padding:18px 24px;background:rgba(7,10,12,.97);border-bottom:1px solid #333;flex-direction:column;align-items:flex-start;gap:20px}.main-nav.open{display:flex}.main-nav a{height:auto;padding:4px 0}.main-nav a:after{bottom:-5px}.hero{height:680px;min-height:0}.hero-photo{background-position:59% center}.hero-shade{background:linear-gradient(90deg,rgba(8,11,13,.98),rgba(8,11,13,.76) 30%,rgba(8,11,13,.08)),linear-gradient(0deg,#080b0d 0%,transparent 25%)}.hero-copy{max-width:90%;padding:65px 0 0 25px}.hero-title{font-size:clamp(60px,13vw,92px);letter-spacing:-3px}.hero-tags{margin:24px 0 0 14px;font-size:11px;gap:9px}.tagline{margin:18px 0 22px 15px;font-size:28px}.social-links{margin-left:10px;gap:12px}.social-links a{width:58px;height:58px}.feature-grid{grid-template-columns:1fr;margin:0 16px;gap:12px}.feature-card{height:290px;min-height:0}.feature-content{left:24px;top:25px;width:54%}.standup-card .feature-content{right:18px;width:48%}.brush-title{font-size:clamp(40px,9vw,56px)}.feature-description{font-size:12px}.projects{padding:28px 18px 0}.section-heading{gap:10px}.section-heading h2{font-size:11px;letter-spacing:2px}.text-link{font-size:10px;letter-spacing:1px}.gallery-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 22px 8px;gap:10px;scrollbar-width:none}.gallery-track::-webkit-scrollbar{display:none}.project-thumb{flex:0 0 43%;scroll-snap-align:start}.gallery-arrow{width:30px;height:30px;font-size:23px}.carousel-dots{display:flex}.site-footer{min-height:245px;margin-top:12px;padding:36px 16px 28px}.footer-brush{width:40vw;opacity:.95}.footer-content{width:100%}.footer-content h2{font-size:40px}.footer-details{gap:13px;flex-wrap:wrap;font-size:9px;letter-spacing:.9px}.contact-icon,.heart{font-size:21px}.footer-rule{margin-top:16px}.modal-panel{grid-template-columns:1fr;max-height:90vh;overflow:auto}.modal-panel>img{height:48vh;min-height:220px;max-height:48vh}.modal-copy{padding:20px 28px 28px}.modal-copy h2{font-size:32px}.modal-copy p{font-size:13px}.modal-nav{top:24vh}}
@media(max-width:420px){.hero{height:620px}.hero-copy{padding-top:62px}.hero-title{font-size:58px}.hero-tags{font-size:10px;letter-spacing:1.4px}.social-links a{width:51px;height:51px}.feature-card{height:270px}.feature-content{left:17px;top:22px}.standup-card .feature-content{right:10px}.brush-title{font-size:39px}.eyebrow{font-size:10px;letter-spacing:2px}.feature-description{font-size:11px}.pill-link{padding:8px 12px;font-size:9px;gap:10px}.footer-content h2{font-size:34px}.footer-details{gap:10px}.footer-details>span:last-child{width:100%;justify-content:center}}

/* Correcciones de layout: contenedor boxed y tarjetas sin desbordamientos */
body{background:#030506}
.site-shell{width:min(1100px,100%);margin-inline:auto;position:relative;background:var(--bg);box-shadow:0 0 60px rgba(0,0,0,.28)}
.site-header{padding-inline:clamp(22px,4.5%,56px)}
.hero{height:clamp(560px,56vw,620px);min-height:560px}
.hero-photo{background-position:center 38%;}
.hero-copy{padding-top:clamp(82px,8vw,95px);padding-left:clamp(34px,5.2%,58px);max-width:54%}
.hero-title{font-size:clamp(74px,8.2vw,108px)}
.hero-tags{margin-top:30px}
.feature-grid{margin:0 24px;gap:14px}
.feature-card{height:320px;min-height:320px}
.feature-content{top:28px;left:30px;width:53%;max-width:245px}
.standup-card .feature-content{left:auto;right:22px;top:34px;width:44%;max-width:220px}
.brush-title{font-size:clamp(42px,4.6vw,54px);letter-spacing:-1.8px;max-width:100%}
.standup-card .brush-title{font-size:clamp(35px,3.8vw,46px);letter-spacing:-1.4px;transform:rotate(-10deg) scaleX(.94);transform-origin:left center}
.feature-description{font-size:12px;line-height:1.5;margin:17px 0 18px;max-width:215px}
.standup-card .feature-description{margin-top:20px;max-width:205px}
.standup-card .card-overlay{background:linear-gradient(90deg,rgba(6,9,11,.05) 0%,rgba(6,9,11,.10) 40%,rgba(6,9,11,.80) 64%,rgba(6,9,11,.96) 100%)}
.standup-card .mic-image{background-position:42% center}
.pill-link{padding:9px 15px;gap:12px}
.projects{padding-inline:24px}
.site-footer{margin-top:10px}
@media(min-width:1101px){.hero{height:600px}.hero-title{font-size:95px}.hero-copy{padding-top:90px}.social-links a{width:66px;height:66px}}
@media(max-width:760px){.site-shell{width:100%}.hero{height:650px;min-height:0}.hero-copy{max-width:92%;padding:35px 0 0 25px}.hero-title{font-size:clamp(60px,13vw,88px)}.feature-grid{margin:0 16px;grid-template-columns:1fr}.feature-card{height:290px;min-height:290px}.feature-content{left:24px;top:25px;width:54%}.standup-card .feature-content{left:auto;right:18px;top:28px;width:47%;max-width:220px}.brush-title{font-size:clamp(40px,9vw,54px)}.standup-card .brush-title{font-size:clamp(34px,8vw,45px)}.projects{padding-inline:18px}}
@media(max-width:420px){.hero{height:610px}.hero-title{font-size:58px}.feature-card{height:270px;min-height:270px}.standup-card .feature-content{right:12px;width:48%}.standup-card .brush-title{font-size:35px}.feature-description{font-size:11px}.pill-link{padding:8px 12px;font-size:9px}}


/* ===== FIX DEFINITIVO: CARRUSEL EN UNA SOLA FILA ===== */
.gallery-wrap {
  position: relative;
  width: 100%;
  min-width: 0;
}

.gallery-track {
  --gallery-gap: 12px;
  display: grid !important;
  grid-template-columns: none !important;
  grid-template-rows: minmax(0, 1fr) !important;
  grid-auto-flow: column !important;
  grid-auto-columns: calc((100% - (4 * var(--gallery-gap))) / 5) !important;
  gap: var(--gallery-gap) !important;
  width: 100%;
  min-width: 0;
  padding: 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  overscroll-behavior-x: contain;
  /* Permite deslizar horizontalmente con el dedo en móviles; las flechas siguen funcionando. */
  touch-action: pan-x pan-y;
  scroll-behavior: smooth;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.gallery-track::-webkit-scrollbar { display: none; }

.gallery-track > .project-thumb {
  display: block;
  width: 100%;
  min-width: 0;
  max-width: none;
  aspect-ratio: 1 / 1;
  scroll-snap-align: start;
  scroll-snap-stop: always;
  margin: 0;
}

.gallery-track > .project-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gallery-arrow {
  position: absolute;
  z-index: 5;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 1px solid rgba(255,255,255,.85);
  border-radius: 50%;
  background: rgba(5,8,10,.92);
  color: #fff;
  font-size: 25px;
  line-height: 1;
  cursor: pointer;
}
.gallery-arrow.prev { left: -15px; }
.gallery-arrow.next { right: -15px; }
.gallery-arrow:disabled { opacity: .3; cursor: default; }

/* Los puntos indican las posiciones de desplazamiento, no cada imagen */
.carousel-dots { display: flex; justify-content: center; gap: 7px; padding-top: 12px; }
.carousel-dots:empty { display: none; }
.carousel-dots button { width: 6px; height: 6px; padding: 0; border: 0; border-radius: 50%; background: #626262; cursor: pointer; }
.carousel-dots button.active { background: var(--yellow); }

@media (max-width: 760px) {
  .gallery-track {
    --gallery-gap: 10px;
    grid-auto-columns: calc((100% - (2 * var(--gallery-gap))) / 3) !important;
  }
  .gallery-arrow.prev { left: -10px; }
  .gallery-arrow.next { right: -10px; }
}

@media (max-width: 480px) {
  .gallery-track {
    --gallery-gap: 10px;
    grid-auto-columns: calc((100% - var(--gallery-gap)) / 2) !important;
  }
  .gallery-arrow { width: 30px; height: 30px; font-size: 21px; }
}




/* Ajustes del banner en móviles */
@media (max-width: 600px) {
  .hero {
    /* Reduce la altura del banner */
    min-height: auto;
    height: auto;
    padding-bottom: 24px;
    background-position: 58% center;
  }

  .hero-content {
    /* Evita que el contenido reserve espacio vertical extra */
    min-height: 0;
    padding-top: 48px;
    padding-bottom: 0;
  }

  /* Título principal */
  .hero h1 {
    margin-bottom: 24px;
    font-size: clamp(2.5rem, 10vw, 3.5rem);
    line-height: 0.95;
  }

  /* Frase secundaria */
  .hero-kicker {
    margin-bottom: 24px;
  }

  .hero-content > p:not(.hero-kicker) {
    margin-top: 28px;
    margin-bottom: 18px;
    line-height: 1.4;
  }

  /* Iconos de redes sociales */
  .social-links {
    margin-top: 16px;
    margin-bottom: 0;
    gap: 18px;
  }

  .social-links img {
    width: 42px;
    height: 42px;
    object-fit: contain;
  }
}