
:root{
  --design-black:#080808;
  --design-paper:#f4f1ea;
  --design-lime:#c7ff00;
  --design-violet:#8f6cff;
  --design-ink:#111;
  --design-muted:#77736c;
  --design-line:rgba(255,255,255,.12);
}
.design-page{background:var(--design-black)}
.design-kicker{display:block;margin-bottom:24px;font:700 11px 'Space Mono',monospace;letter-spacing:.16em;text-transform:uppercase}
.design-hero{min-height:96vh;display:flex;align-items:flex-end;padding:150px 6vw 72px!important;background:var(--design-black);color:#fff;position:relative;overflow:hidden}
.design-hero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(to bottom,black,transparent 96%)}
.design-hero::after{content:"";position:absolute;width:640px;height:640px;right:-190px;top:30px;border-radius:50%;background:radial-gradient(circle,var(--design-violet),transparent 68%);opacity:.5;filter:blur(8px)}
.design-hero__inner{position:relative;z-index:2;width:min(1500px,100%);margin:0 auto}
.design-hero .design-kicker{color:var(--design-lime)}
.design-hero h1{margin:0;max-width:1400px;font:400 clamp(70px,9.6vw,165px)/.83 'Archivo Black',sans-serif;letter-spacing:-.075em;text-transform:uppercase}
.design-hero h1 em{color:var(--design-lime);font-style:normal}
.design-hero__bottom{margin-top:50px;display:grid;grid-template-columns:minmax(340px,720px) 1fr;gap:70px;align-items:end}
.design-hero__bottom p{margin:0;max-width:720px;color:rgba(255,255,255,.7);font-size:19px;line-height:1.65}
.design-hero__actions{display:flex;justify-content:flex-end;gap:12px;flex-wrap:wrap}
.design-marquee{background:var(--design-lime)}
.design-manifesto{min-height:92vh;display:flex;align-items:center;padding:120px 6vw!important;background:var(--design-paper);color:var(--design-ink)}
.design-manifesto__inner{width:min(1500px,100%);margin:0 auto}
.design-manifesto h2{max-width:1300px;margin:0;font:400 clamp(68px,8vw,145px)/.85 'Archivo Black',sans-serif;letter-spacing:-.07em;text-transform:uppercase}
.design-manifesto h2 span{color:transparent;-webkit-text-stroke:2px #111}
.design-manifesto h3{margin:18px 0 0;color:var(--design-violet);font:400 clamp(58px,7vw,120px)/.88 'Archivo Black',sans-serif;letter-spacing:-.065em;text-transform:uppercase}
.design-manifesto p{max-width:720px;margin:52px 0 0 auto;color:var(--design-muted);font-size:19px;line-height:1.7}
.design-services{padding:130px 6vw!important;background:var(--design-black);color:#fff}
.design-services__head{width:min(1500px,100%);margin:0 auto 80px}
.design-services__head .design-kicker{color:var(--design-lime)}
.design-services__head h2{margin:0;font:400 clamp(60px,7.6vw,130px)/.86 'Archivo Black',sans-serif;letter-spacing:-.065em;text-transform:uppercase}
.design-services__grid{width:min(1500px,100%);margin:0 auto;display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--design-line);border-left:1px solid var(--design-line)}
.design-service{min-height:480px;padding:42px;border-right:1px solid var(--design-line);border-bottom:1px solid var(--design-line);display:flex;flex-direction:column;background:#0d0d0d;transition:.35s ease}
.design-service:hover{background:#131313;transform:translateY(-4px)}
.design-service__num{color:rgba(255,255,255,.16);font:400 72px/1 'Archivo Black',sans-serif}
.design-service__label{margin-top:auto;margin-bottom:14px;color:var(--design-lime);font:700 11px 'Space Mono',monospace;letter-spacing:.15em}
.design-service h3{margin:0;max-width:560px;font:400 clamp(32px,3vw,54px)/.95 'Archivo Black',sans-serif;letter-spacing:-.045em}
.design-service p{max-width:560px;margin:20px 0 0;color:#9b9b9b;line-height:1.65}
.design-statement{min-height:95vh;display:flex;align-items:center;padding:110px 6vw!important;background:var(--design-violet);color:#fff}
.design-statement__inner{width:min(1500px,100%);margin:0 auto;display:flex;flex-direction:column;font:400 clamp(55px,7.8vw,135px)/.85 'Archivo Black',sans-serif;letter-spacing:-.068em;text-transform:uppercase}
.design-statement__inner strong{color:var(--design-lime);font-weight:400}
.design-process{padding:130px 6vw!important;background:var(--design-paper);color:var(--design-ink)}
.design-process__head{width:min(1500px,100%);margin:0 auto 70px}
.design-process__head h2{margin:0;font:400 clamp(55px,6.6vw,112px)/.88 'Archivo Black',sans-serif;letter-spacing:-.062em;text-transform:uppercase}
.design-process__list{width:min(1500px,100%);margin:0 auto;border-top:1px solid rgba(0,0,0,.14)}
.design-process__item{display:grid;grid-template-columns:90px .7fr 1.3fr;gap:30px;align-items:start;padding:30px 0;border-bottom:1px solid rgba(0,0,0,.14)}
.design-process__item span{font:700 11px 'Space Mono',monospace;color:#88847d}
.design-process__item strong{font:400 clamp(28px,3vw,50px)/1 'Archivo Black',sans-serif;letter-spacing:-.04em}
.design-process__item p{color:var(--design-muted);line-height:1.65}
.design-closing{min-height:92vh;display:flex;align-items:center;padding:120px 6vw!important;background:var(--design-black);color:#fff}
.design-closing__inner{width:min(1500px,100%);margin:0 auto}
.design-closing__inner .design-kicker{color:var(--design-lime)}
.design-closing h2{max-width:1350px;margin:0;font:400 clamp(68px,8vw,145px)/.85 'Archivo Black',sans-serif;letter-spacing:-.07em;text-transform:uppercase}
.design-closing h2 em{color:var(--design-lime);font-style:normal}
.design-closing p{max-width:670px;margin:40px 0;color:rgba(255,255,255,.63);font-size:18px;line-height:1.65}
@media(max-width:900px){
  .design-hero{min-height:auto;padding:135px 22px 65px!important}
  .design-hero h1{font-size:clamp(58px,14vw,90px)}
  .design-hero__bottom{grid-template-columns:1fr;gap:30px}
  .design-hero__actions{justify-content:flex-start}
  .design-manifesto,.design-services,.design-process,.design-closing{min-height:auto;padding:85px 22px!important}
  .design-manifesto p{margin-left:0}
  .design-services__grid{grid-template-columns:1fr}
  .design-service{min-height:390px;padding:30px}
  .design-statement{min-height:70vh;padding:80px 22px!important}
  .design-process__item{grid-template-columns:48px 1fr;gap:16px}
  .design-process__item p{grid-column:2}
  .design-manifesto h2,.design-closing h2{font-size:clamp(52px,13vw,82px)}
  .design-manifesto h3{font-size:clamp(45px,11vw,72px)}
}


/* ===== DOBLE CARRUSEL BRANDING ===== */
.branding-work{padding:120px 0 105px!important;background:#080808;color:#fff;overflow:hidden}.branding-work--two{background:#0d0d0d}.branding-work__head{width:min(1500px,90%);margin:0 auto 46px;display:flex;justify-content:space-between;align-items:flex-end;gap:30px}.branding-work__head .design-kicker{color:#c7ff00}.branding-work__head h2{margin:0;max-width:1050px;font:400 clamp(48px,6.3vw,108px)/.88 'Archivo Black',sans-serif;letter-spacing:-.06em;text-transform:uppercase}.branding-work__arrows{display:flex;gap:10px;flex:0 0 auto}.branding-work__arrow{width:56px;height:56px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.18);border-radius:50%;background:#111;color:#fff;font-size:21px;cursor:pointer;transition:.25s}.branding-work__arrow:hover{background:#c7ff00;color:#080808;border-color:#c7ff00;transform:translateY(-2px)}.branding-work__track{display:flex;gap:18px;overflow-x:auto;overflow-y:hidden;padding:0 5vw 16px;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;cursor:grab;user-select:none;overscroll-behavior-x:contain}.branding-work__track::-webkit-scrollbar{display:none}.branding-work__track.dragging{cursor:grabbing;scroll-snap-type:none;scroll-behavior:auto}.branding-work__item{flex:0 0 44vw;min-width:540px;scroll-snap-align:start;border-radius:24px;overflow:hidden;background:#151515;aspect-ratio:16/10}.branding-work__item img{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none;user-select:none;transition:transform .75s cubic-bezier(.2,.7,.2,1)}.branding-work__item:hover img{transform:scale(1.025)}.branding-work__controls{width:min(1500px,90%);margin:30px auto 0;display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;color:rgba(255,255,255,.7);font:700 11px 'Space Mono',monospace;letter-spacing:.08em}.branding-work__progress{height:2px;background:rgba(255,255,255,.14);overflow:hidden;position:relative}.branding-work__progress span{position:absolute;inset:0 auto 0 0;width:16.666%;background:#c7ff00;transition:width .3s ease}@media(max-width:900px){.branding-work{padding:82px 0 72px!important}.branding-work__head{width:calc(100% - 36px);align-items:flex-start}.branding-work__arrows{display:none}.branding-work__track{padding-left:18px;padding-right:18px;gap:12px}.branding-work__item{flex:0 0 84vw;min-width:0;border-radius:18px}.branding-work__controls{width:calc(100% - 36px)}}@media(prefers-reduced-motion:reduce){.branding-work__track{scroll-behavior:auto}.branding-work__item img{transition:none}}

/* =========================================================
   AJUSTE — TÍTULO DE SERVICIOS + PORTFOLIO PRIMERO
========================================================= */

.design-services{
  padding-bottom:52px !important;
}

.design-services__head{
  margin-bottom:0 !important;
}

/* =========================================================
   CAPACIDADES DE DISEÑO — LISTADO FINAL
========================================================= */

.design-capabilities{
  padding:120px 6vw !important;
  background:#f4f1ea;
  color:#111;
}

.design-capabilities__head{
  width:min(1500px,100%);
  margin:0 auto 70px;
}

.design-capabilities__head .design-kicker{
  color:#111;
}

.design-capabilities__head h2{
  margin:0;
  max-width:1200px;
  font:400 clamp(55px,6.5vw,110px)/.88 'Archivo Black',sans-serif;
  letter-spacing:-.06em;
  text-transform:uppercase;
}

.design-capabilities__list{
  width:min(1500px,100%);
  margin:0 auto;
  border-top:1px solid rgba(0,0,0,.15);
}

.design-capabilities__item{
  display:grid;
  grid-template-columns:70px .8fr 1.2fr;
  gap:30px;
  align-items:center;
  padding:30px 0;
  border-bottom:1px solid rgba(0,0,0,.15);
}

.design-capabilities__item span{
  font:700 11px 'Space Mono',monospace;
  color:#888;
}

.design-capabilities__item strong{
  font:400 clamp(27px,3vw,48px)/1 'Archivo Black',sans-serif;
  letter-spacing:-.04em;
}

.design-capabilities__item p{
  max-width:550px;
  margin:0;
  color:#77736c;
  line-height:1.6;
}

@media(max-width:800px){
  .design-services{
    padding-bottom:38px !important;
  }

  .design-capabilities{
    padding:80px 22px !important;
  }

  .design-capabilities__item{
    grid-template-columns:45px 1fr;
    gap:16px;
  }

  .design-capabilities__item p{
    grid-column:2;
  }
}


/* ===== COMPACTACION FINAL BRANDING ===== */
.design-services{padding-top:72px!important;padding-bottom:32px!important;min-height:0!important}
.design-services__head{margin-bottom:0!important}
.branding-work{padding-top:42px!important;padding-bottom:48px!important;min-height:0!important}
.branding-work__head{margin-bottom:28px!important}
.branding-work__controls{margin-top:20px!important;margin-bottom:0!important}
.design-statement{min-height:0!important;padding-top:78px!important;padding-bottom:78px!important}
.design-capabilities{min-height:0!important;padding-top:78px!important;padding-bottom:78px!important}
.design-capabilities__head{margin-bottom:46px!important}
.design-process{min-height:0!important;padding-top:78px!important;padding-bottom:78px!important}
.design-process__head{margin-bottom:46px!important}
.design-closing{min-height:0!important;padding-top:90px!important;padding-bottom:90px!important}
@media(max-width:900px){
 .design-services{padding-top:60px!important;padding-bottom:24px!important}
 .branding-work{padding-top:32px!important;padding-bottom:42px!important}
 .design-statement,.design-capabilities,.design-process{padding-top:64px!important;padding-bottom:64px!important}
 .design-closing{padding-top:72px!important;padding-bottom:72px!important}
}

/* MÁS AIRE EN EL PRIMER CARRUSEL */

.branding-work--one{
    padding-top: 95px !important;
}

.branding-work--one .branding-work__head{
    width: min(1500px, 88%);
}
}

.branding-work--one .branding-work__track{
    margin-top: 0;
}
