/* Tipografías alojadas en la propia web (sin Google Fonts: no se envían datos a terceros). Licencia OFL en assets/fonts. */
@font-face{font-family:'Montserrat';src:url('../assets/fonts/montserrat.woff') format('woff');font-weight:100 900;font-style:normal;font-display:swap;}
@font-face{font-family:'Bodoni Moda';src:url('../assets/fonts/bodoni-moda.woff') format('woff');font-weight:400 900;font-style:normal;font-display:swap;}
[hidden]{display:none !important;}

:root{
  --ink:#0D0D0D;
  --paper:#FFFFFF;
  --paper-dim:#F4F3F0;
  --line:#E4E1D9;
  --stone:#87837A;
  --accent:#E7392C;
  --night:#0D0D0D;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:'Montserrat',sans-serif;
  font-weight:400;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,.serif{
  font-family:'Montserrat',sans-serif;
  font-weight:800;
  letter-spacing:-0.03em;
  line-height:1.02;
}
a{color:inherit;text-decoration:none;}
img{display:block;max-width:100%;}
.wrap{
  max-width:1240px;
  margin:0 auto;
  padding:0 48px;
}
.label{
  font-size:12px;
  color:var(--stone);
  font-weight:500;
}

/* ---------- NAV (floating pill) ---------- */
header{
  position:fixed;
  top:0;left:0;right:0;
  z-index:100;
  padding:18px 24px 0;
  pointer-events:none;
}
.navbar{
  pointer-events:auto;
  max-width:980px;
  margin:0 auto;
  padding:14px 16px 14px 26px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:rgba(255,255,255,0.72);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border:1px solid var(--line);
  border-radius:999px;
  box-shadow:0 1px 2px rgba(13,13,13,0.03);
  transition:box-shadow .35s ease, background .35s ease;
}
header.scrolled .navbar{
  background:rgba(255,255,255,0.92);
  box-shadow:0 12px 32px rgba(13,13,13,0.08);
}
.nav-mark{flex-shrink:0;}
.nav-mark img{height:19px;width:auto;}
nav.links{display:flex;gap:30px;margin:0 auto;padding:0 24px;}
nav.links a{
  font-size:13px;
  letter-spacing:0.01em;
  color:var(--ink);
  padding-bottom:3px;
  border-bottom:1px solid transparent;
  transition:border-color .2s ease, color .2s ease;
}
nav.links a:hover, nav.links a.active{border-color:var(--accent);color:var(--accent);}
.nav-cta{
  font-size:12.5px;
  font-weight:600;
  color:var(--paper);
  background:var(--ink);
  padding:10px 20px;
  border-radius:999px;
  transition:background .2s ease, transform .2s ease;
  display:inline-block;
  white-space:nowrap;
}
.nav-cta:hover{background:var(--accent);transform:translateY(-1px);}
.nav-toggle{display:none;background:none;border:0;cursor:pointer;padding:6px;}
.lang-select{
  appearance:none;-webkit-appearance:none;
  border:1px solid var(--line);border-radius:999px;background:transparent;
  font-family:'Montserrat',sans-serif;font-size:12px;font-weight:600;letter-spacing:.06em;color:var(--ink);
  padding:7px 26px 7px 12px;margin:0 10px 0 0;cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);
  background-position:calc(100% - 13px) 50%,calc(100% - 9px) 50%;background-size:4px 4px;background-repeat:no-repeat;
}
.lang-select:hover{border-color:var(--ink);}
.nav-lang{display:none;}
.lang-select:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
.nav-toggle span{display:block;width:20px;height:1px;background:var(--ink);margin:5px 0;}

/* ---------- MARQUEE TICKER ---------- */
.marquee{
  overflow:hidden;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  padding:20px 0;
  background:var(--paper);
}
.marquee-track{
  display:flex;
  width:max-content;
  animation:marquee 32s linear infinite;
}
.marquee:hover .marquee-track{animation-play-state:paused;}
.marquee-track span{
  font-size:13px;
  font-weight:500;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--stone);
  white-space:nowrap;
  padding:0 22px;
  display:flex;
  align-items:center;
  gap:22px;
}
.marquee-track span::after{
  content:"·";
  color:var(--line);
}
@keyframes marquee{
  from{transform:translateX(0);}
  to{transform:translateX(-50%);}
}

/* ---------- SCROLL REVEAL ---------- */
.reveal{
  opacity:0;
  transform:translateY(22px);
  transition:opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1);
}
.reveal.is-visible{opacity:1;transform:translateY(0);}
.stagger > *:nth-child(1){transition-delay:.02s;}
.stagger > *:nth-child(2){transition-delay:.08s;}
.stagger > *:nth-child(3){transition-delay:.14s;}
.stagger > *:nth-child(4){transition-delay:.2s;}
.stagger > *:nth-child(5){transition-delay:.26s;}
.stagger > *:nth-child(6){transition-delay:.32s;}
.stagger > *:nth-child(7){transition-delay:.38s;}
.stagger > *:nth-child(8){transition-delay:.44s;}
.stagger > *:nth-child(9){transition-delay:.5s;}
.stagger > *:nth-child(10){transition-delay:.56s;}
.stagger > *:nth-child(n+11){transition-delay:.6s;}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1;transform:none;transition:none;}
}

/* ---------- HERO ---------- */
.hero{
  position:relative;
  min-height:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:128px 48px 44px;
  overflow:hidden;
}
.hero-inner{
  max-width:1240px;
  margin:0 auto;
  width:100%;
  position:relative;
}
.hero-brand{
  text-align:center;
}
.wordmark{
  font-family:'Bodoni Moda', serif;
  font-weight:400;
  font-size:clamp(38px, 8.2vw, 148px);
  line-height:1;
  letter-spacing:0.01em;
  color:var(--ink);
  white-space:nowrap;
  opacity:0;
  animation:riseIn .8s ease forwards;
  animation-delay:.1s;
}
.wordmark-sub{
  font-family:'Montserrat',sans-serif;
  font-weight:500;
  font-size:clamp(11px, 1.3vw, 16px);
  letter-spacing:0.38em;
  text-transform:uppercase;
  color:var(--stone);
  margin-top:clamp(6px, 1vw, 14px);
  opacity:0;
  animation:riseIn .8s ease forwards;
  animation-delay:.22s;
}
.hero-row{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  flex-wrap:wrap;
  gap:40px;
  margin-top:36px;
  padding-top:24px;
  border-top:1px solid var(--line);
  opacity:0;
  animation:riseIn .8s ease forwards;
  animation-delay:.36s;
}
.hero-sub{
  font-size:14px;
  color:var(--stone);
  font-weight:500;
}
.hero-tag{
  max-width:420px;
  font-size:17px;
  line-height:1.55;
  color:var(--ink);
}
.hero-actions{
  margin-top:28px;
  display:flex;
  gap:28px;
  flex-wrap:wrap;
  align-items:center;
  opacity:0;
  animation:riseIn .8s ease forwards;
  animation-delay:.5s;
}
.btn{
  display:inline-block;
  font-size:14px;
  font-weight:600;
  padding:16px 30px;
  border:1px solid var(--ink);
  color:var(--ink);
  background:none;
  cursor:pointer;
  font-family:'Montserrat',sans-serif;
  border-radius:999px;
  transition:background .2s ease, color .2s ease, border-color .2s ease, transform .15s ease;
  will-change:transform;
}
.btn:hover{background:var(--ink);color:var(--paper);}
.btn-solid{background:var(--ink);color:var(--paper);}
.btn-solid:hover{background:var(--accent);border-color:var(--accent);color:var(--paper);}
.btn-dark{border-color:var(--ink);color:var(--ink);}
.btn-text{
  font-size:14px;
  font-weight:600;
  color:var(--ink);
  border-bottom:1px solid var(--ink);
  padding-bottom:3px;
  transition:color .2s ease, border-color .2s ease;
}
.btn-text:hover{color:var(--accent);border-color:var(--accent);}

@keyframes riseIn{
  from{opacity:0; transform:translateY(14px);}
  to{opacity:1; transform:translateY(0);}
}

/* ---------- PAGE HEADER (book page) ---------- */
.page-header{
  padding:112px 0 0;
}
.page-header h1{
  font-size:clamp(20px,2.2vw,26px);
  letter-spacing:-0.02em;
  margin-bottom:6px;
}
.page-header p{
  color:var(--stone);
  max-width:620px;
  font-size:13px;
  line-height:1.5;
}
.book.book-index{padding:22px 0 100px;}
.book-index .filter-bar{margin-bottom:28px;}

/* ---------- INTRO STATEMENT ---------- */
.statement{
  padding:120px 0;
  border-bottom:1px solid var(--line);
}
.statement .wrap{
  display:grid;
  grid-template-columns:200px 1fr;
  gap:60px;
}
.stat-list{display:flex;flex-direction:column;gap:26px;}
.stat-item{padding-top:2px;}
.stat-item .num{
  font-family:'Montserrat',sans-serif;
  font-weight:800;
  font-size:34px;
  letter-spacing:-0.02em;
  color:var(--ink);
}
.stat-item .num::after{content:attr(data-suffix);}
.stat-item .lbl{
  font-size:12.5px;
  color:var(--stone);
  margin-top:2px;
}
.statement p.serif{
  font-size:clamp(28px, 3.6vw, 46px);
  line-height:1.22;
  font-weight:700;
  letter-spacing:-0.02em;
  max-width:840px;
}
.statement p.serif em{
  font-style:normal;
  color:var(--accent);
}

/* ---------- SERVICIOS ---------- */
.services{
  padding:120px 0;
  background:var(--paper);
}
.services .section-head,
.campaigns .section-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  margin-bottom:70px;
  flex-wrap:wrap;
  gap:20px;
}
.services .section-head h2,
.campaigns .section-head h2{
  font-size:clamp(32px,4.2vw,52px);
  color:var(--ink);
  max-width:600px;
}
.services .section-head p,
.campaigns .section-head p{
  max-width:340px;
  color:var(--stone);
  font-size:15px;
  padding-bottom:6px;
}
.services-index{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  border-top:1px solid var(--line);
  border-left:1px solid var(--line);
  counter-reset:svc;
}
.service-row{
  counter-increment:svc;
  position:relative;
  display:flex;
  flex-direction:column;
  gap:16px;
  padding:38px 32px 34px;
  border-right:1px solid var(--line);
  border-bottom:1px solid var(--line);
  transition:background .25s ease;
}
.service-row::before{
  content:counter(svc, decimal-leading-zero);
  font-family:'Montserrat',sans-serif;
  font-size:12px;
  font-weight:600;
  letter-spacing:0.06em;
  color:var(--stone);
}
.service-row:hover{background:var(--paper-dim);}
.service-row .name{
  font-family:'Montserrat',sans-serif;
  font-size:21px;
  font-weight:700;
  letter-spacing:-0.01em;
  color:var(--ink);
  transition:color .2s ease;
}
.service-row:hover .name{color:var(--accent);}
.service-row .desc{
  color:var(--stone);
  font-size:14px;
  line-height:1.5;
}
/* two featured cells break the grid rhythm on the flagship services */
.service-row.featured{
  grid-column:span 2;
  background:var(--ink);
}
.service-row.featured::before{color:rgba(255,255,255,.45);}
.service-row.featured .name{font-size:30px;color:var(--paper);}
.service-row.featured .desc{color:rgba(255,255,255,.62);max-width:420px;}
.service-row.featured:hover{background:var(--accent);}
.service-row.featured:hover .name{color:var(--paper);}
.service-row.featured:hover .desc{color:rgba(255,255,255,.85);}

/* ---------- BOOK / PORTFOLIO ---------- */
.book{
  padding:120px 0;
}
.book .section-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  margin-bottom:56px;
  flex-wrap:wrap;
  gap:20px;
}
.book .section-head h2{
  font-size:clamp(32px,4.2vw,52px);
  max-width:560px;
}
.book .section-head p{
  max-width:360px;
  color:var(--stone);
  font-size:15px;
  padding-bottom:6px;
}
.book-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:32px 24px;
}
.book-card{
  position:relative;
  display:flex;
  flex-direction:column;
  cursor:pointer;
  border:0;
  padding:0;
  text-align:left;
  background:none;
}
.book-card img{
  width:100%;
  aspect-ratio:3/4;
  object-fit:cover;
  background:var(--paper-dim);
  transition:transform .5s cubic-bezier(.16,1,.3,1), box-shadow .5s ease;
}
.book-card:hover img{transform:translateY(-6px) scale(1.015);box-shadow:0 24px 40px rgba(13,13,13,0.12);}
.book-card .meta{
  padding-top:14px;
}
.book-card .meta .cat{
  font-size:11px;
  color:var(--stone);
  font-weight:500;
}
.book-card .meta .cname{
  font-family:'Montserrat',sans-serif;
  font-size:18px;
  font-weight:700;
  letter-spacing:-0.01em;
  color:var(--ink);
  margin-top:2px;
}
.book-card:hover .meta .cname{color:var(--accent);}
.book-foot{
  margin-top:56px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:20px;
  padding-top:36px;
  border-top:1px solid var(--line);
}
.book-foot p{
  color:var(--stone);
  font-size:14px;
  max-width:460px;
}

/* ---------- FILTER BAR (book page) ---------- */
.filter-bar{
  display:flex;
  gap:32px;
  flex-wrap:wrap;
  margin-bottom:56px;
  border-bottom:1px solid var(--line);
  padding-bottom:0;
}
.filter-btn{
  font-size:13px;
  font-weight:500;
  padding:0 0 16px;
  border:none;
  border-bottom:2px solid transparent;
  background:transparent;
  color:var(--stone);
  cursor:pointer;
  transition:all .2s ease;
  font-family:'Montserrat',sans-serif;
  margin-bottom:-1px;
}
.filter-btn:hover{color:var(--ink);}
.filter-btn.active{color:var(--ink);border-color:var(--accent);}

.full-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:36px 24px;
}
.full-grid .book-card .stat{
  font-size:12px;
  color:var(--stone);
  margin-top:2px;
}
.empty-state{
  padding:80px 0;
  text-align:center;
  color:var(--stone);
  font-size:14px;
}

/* ---------- PROCESO ---------- */
.process{
  padding:120px 0;
  background:var(--paper-dim);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.process h2{
  font-size:clamp(32px,4.2vw,52px);
  max-width:560px;
  margin-bottom:70px;
}
.process-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:0;
}
.process-step{
  padding:0 26px 0 0;
  border-left:1px solid var(--line);
  padding-left:26px;
}
.process-step:first-child{border-left:none;padding-left:0;}
.process-step .num{
  font-family:'Montserrat',sans-serif;
  font-weight:800;
  font-size:15px;
  color:var(--accent);
  margin-bottom:18px;
}
.process-step h3{
  font-size:21px;
  margin-bottom:12px;
  font-weight:700;
  letter-spacing:-0.01em;
}
.process-step p{
  font-size:14px;
  color:var(--stone);
  line-height:1.6;
}

/* ---------- CONTACT ---------- */
.contact{
  padding:130px 0 110px;
}
.contact .wrap{
  display:grid;
  grid-template-columns:0.9fr 1.1fr;
  gap:90px;
}
.contact-intro h2{
  font-size:clamp(32px,4.2vw,54px);
  line-height:1.08;
  margin-bottom:26px;
}
.contact-intro p{
  color:var(--stone);
  font-size:15px;
  max-width:400px;
  margin-bottom:36px;
}
.contact-detail{
  margin-top:40px;
  padding-top:28px;
  border-top:1px solid var(--line);
}
.contact-detail dt{
  font-size:11px;
  color:var(--stone);
  margin-bottom:4px;
}
.contact-detail dd{
  font-family:'Montserrat',sans-serif;
  font-weight:700;
  font-size:18px;
  margin-bottom:22px;
}

form{display:flex;flex-direction:column;gap:24px;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.field{display:flex;flex-direction:column;gap:8px;}
.field label{
  font-size:12px;
  color:var(--stone);
  font-weight:500;
}
.field input,
.field select,
.field textarea{
  font-family:'Montserrat',sans-serif;
  font-size:15px;
  color:var(--ink);
  background:transparent;
  border:none;
  border-bottom:1px solid var(--line);
  padding:10px 2px;
  transition:border-color .2s ease;
}
.field input:focus,
.field select:focus,
.field textarea:focus{
  outline:none;
  border-color:var(--ink);
}
.field textarea{resize:vertical;min-height:90px;font-family:'Montserrat',sans-serif;}
.field.check{
  flex-direction:row;
  align-items:center;
  gap:10px;
}
.field.check label{font-size:13.5px;color:var(--ink);}
.field.check input{width:16px;height:16px;border:1px solid var(--line);}
.hp{position:absolute;left:-9999px;top:-9999px;opacity:0;height:0;width:0;}
.form-submit{
  display:flex;
  align-items:center;
  gap:18px;
  margin-top:8px;
}
.form-status{
  font-size:13px;
  color:var(--stone);
}
.form-status.ok{color:#2E6B34;}
.form-status.err{color:var(--accent);}
button.btn{
  background:var(--ink);
  color:var(--paper);
  border:1px solid var(--ink);
}
button.btn:hover{background:var(--accent);border-color:var(--accent);color:var(--paper);}

/* ---------- LIGHTBOX (model viewer, kept dark for photo viewing) ---------- */
.lightbox{
  position:fixed;
  inset:0;
  background:#0A0A0A;
  z-index:1000;
  display:none;
  flex-direction:column;
  color:#F5F5F3;
}
.lightbox.open{display:flex;}
.lb-top{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:20px;
  padding:22px 30px;
  flex-shrink:0;
}
.lb-title{font-family:'Montserrat',sans-serif;font-weight:700;font-size:19px;}
.lb-title .cat{
  display:block;
  font-family:'Montserrat',sans-serif;
  font-weight:400;
  font-size:12px;
  color:#9A968C;
  margin-top:2px;
}
.lb-title .lb-stats{color:#C9C5BB;margin-top:6px;max-width:62ch;line-height:1.5;}
.lb-close{
  background:none;border:1px solid #3A3A38;color:#F5F5F3;
  font-size:13px;font-weight:500;padding:8px 16px;cursor:pointer;white-space:nowrap;flex-shrink:0;
  font-family:'Montserrat',sans-serif;
}
.lb-close:hover{border-color:var(--accent);color:var(--accent);}
.lb-main{
  flex:1;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  min-height:0;
  overflow:hidden;
  padding:0 70px;
}
.lb-main img{
  max-height:100%;
  max-width:100%;
  object-fit:contain;
}
.lb-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  background:none;
  border:none;
  color:#F5F5F3;
  font-size:34px;
  cursor:pointer;
  padding:10px 14px;
  opacity:.7;
  transition:opacity .2s ease, color .2s ease;
}
.lb-arrow:hover{opacity:1;color:var(--accent);}
.lb-prev{left:12px;}
.lb-next{right:12px;}
.lb-count{
  text-align:center;
  font-size:12px;
  color:#9A968C;
  padding:14px 0 8px;
  letter-spacing:0.04em;
}
.lb-thumbs{
  display:flex;
  gap:8px;
  overflow-x:auto;
  padding:0 30px 26px;
  flex-shrink:0;
}
.lb-thumbs img{
  width:56px;
  height:74px;
  object-fit:cover;
  opacity:.5;
  cursor:pointer;
  border:1px solid transparent;
  transition:opacity .2s ease, border-color .2s ease;
  flex-shrink:0;
}
.lb-thumbs img.active{opacity:1;border-color:var(--accent);}
.lb-thumbs img:hover{opacity:.85;}


/* ---------- TALENTO (caras en movimiento) ---------- */
.eyebrow{
  font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--stone);margin-bottom:14px;
}
.talent{padding:24px 0 100px;}
.talent-head{
  display:flex;justify-content:space-between;align-items:flex-end;gap:24px;
  margin-bottom:28px;flex-wrap:wrap;
}
.talent-head{flex-direction:column;align-items:flex-start;gap:10px;}
.talent-head .eyebrow{margin:0;line-height:1.4;}
.talent-head .btn-text{font-size:12px;}
.faces{overflow:hidden;}
.talent-note{font-size:12.5px;line-height:1.5;color:var(--stone);margin-top:16px;max-width:none;}
.talent-note a{color:var(--ink);text-decoration:underline;text-underline-offset:2px;}
.talent-note a:hover{color:var(--accent);}
.talent-note.talent-note--top{margin-top:2px;font-size:11.5px;}
.talent-note--book{margin-top:32px;text-align:center;}
.faces-track{
  display:flex;gap:16px;width:max-content;
  padding:0 48px;
  animation:faces-drift 60s linear infinite;
}
.faces:hover .faces-track,.faces:focus-within .faces-track{animation-play-state:paused;}
@keyframes faces-drift{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.face{position:relative;display:block;width:clamp(180px,19vw,270px);flex-shrink:0;}
.face img{
  width:100%;aspect-ratio:3/4;object-fit:cover;background:var(--paper-dim);
  filter:grayscale(1);transition:filter .5s ease, transform .5s cubic-bezier(.16,1,.3,1);
}
.face:hover img{filter:grayscale(0);transform:translateY(-6px);}
.face-name{display:block;margin-top:12px;font-weight:700;font-size:15px;letter-spacing:-0.01em;}
.face:hover .face-name{color:var(--accent);}

/* ---------- CAMPAÑAS ---------- */
.campaigns{padding:100px 0;border-top:1px solid var(--line);}
.campaign-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:28px 20px;
}
.campaign{display:flex;flex-direction:column;min-width:0;}
.campaign-lead{grid-column:span 2;grid-row:span 2;}
.campaign-media{
  width:100%;aspect-ratio:4/5;object-fit:cover;background:var(--paper-dim);display:block;
}
.campaign-lead .campaign-media{aspect-ratio:auto;flex:1;min-height:420px;height:100%;}
.campaign{overflow:hidden;}
.campaign img.campaign-media{transition:transform .8s cubic-bezier(.16,1,.3,1);}
.campaign:hover img.campaign-media{transform:scale(1.03);}
.campaign-media.ph{
  display:flex;align-items:center;justify-content:center;
  border:1px dashed #CFCBC1;color:var(--stone);font-size:12px;letter-spacing:.08em;text-transform:uppercase;
}
.campaign-meta{padding-top:14px;}
.campaign-meta .cat{font-size:12px;color:var(--stone);}
.campaign-meta h3{font-size:18px;font-weight:700;letter-spacing:-0.01em;margin-top:2px;line-height:1.25;}

/* Dos campañas: foto grande + detalle, misma altura */
.campaign-grid--2{grid-template-columns:2fr 1fr;}
.campaign-grid--2 .campaign-lead{grid-column:auto;grid-row:auto;}
.campaign-grid--2 .campaign-media{aspect-ratio:auto;height:clamp(320px,38vw,560px);flex:none;min-height:0;}


/* Galería de campañas (columnas tipo mosaico, sin recortar fotos) */
.campaign-masonry{columns:3;column-gap:16px;}
.cm-item{break-inside:avoid;margin:0 0 16px;overflow:hidden;background:var(--paper-dim);}
.cm-item img{display:block;width:100%;height:auto;transition:transform .8s cubic-bezier(.16,1,.3,1);}
.cm-item:hover img{transform:scale(1.03);}
@media (max-width: 560px){
  .campaign-masonry{columns:2;column-gap:10px;}
  .cm-item{margin-bottom:10px;}
}

.campaigns-more{display:flex;justify-content:center;margin-top:36px;}
.campaigns.campaigns-all{border-top:0;padding:28px 0 100px;}

.service-row.featured.wide{grid-column:1 / -1;}

.human-check{max-width:260px;}
.human-check #humanQ{font-weight:700;color:var(--ink);}

/* ---------- CLIENTES ---------- */
.clients{padding:20px 0 100px;}
.clients .eyebrow{text-align:center;margin-bottom:34px;}
.client-logos{
  list-style:none;display:grid;grid-template-columns:repeat(5,1fr);gap:22px 28px;align-items:center;
  max-width:1080px;margin:0 auto;
}
.client-logos li{display:flex;align-items:center;justify-content:center;height:72px;}
.client-logos img{
  max-height:46px;max-width:170px;width:auto;height:auto;object-fit:contain;
  filter:grayscale(1);opacity:.6;transition:opacity .3s ease, filter .3s ease;
}
.client-logos img:hover{filter:none;opacity:1;}
.client-logos img[alt="Xti"]{max-height:38px;}
.client-logos img[alt="Pro-Keds"]{max-height:42px;}
.client-logos img[alt="Lois"],.client-logos img[alt="Dr. Witt"]{max-height:40px;}
.client-logos img[alt="Rocco Barocco"],.client-logos img[alt="Diverse"],.client-logos img[alt="Ysabel Mora"],.client-logos img[alt="D.Franklin"]{max-width:160px;}
.client-logos img[alt="Germaine de Capuccini"]{max-width:180px;}
.client-logos img[alt="Met Jeans"]{max-width:130px;}
.client-logos img[alt="Refresh"]{max-width:130px;}
.client-logos img[alt="Mercadona"]{max-width:180px;}
.client-logos li.ph{border:1px dashed #CFCBC1;color:var(--stone);font-size:11px;letter-spacing:.08em;text-transform:uppercase;}

@media (max-width: 880px){
  .campaign-grid{grid-template-columns:repeat(2,1fr);}
  .campaign-lead{grid-column:span 2;grid-row:auto;}
  .campaign-lead .campaign-media{aspect-ratio:4/3;min-height:0;}
  .client-logos{grid-template-columns:repeat(3,1fr);gap:24px 20px;}
}
@media (max-width: 560px){
  .page-header{padding-top:110px;}
  .book.book-index{padding-top:16px;}
  .nav-cta{font-size:11.5px;padding:9px 14px;}
  /* Móvil: hero compacto para que la cinta de caras se vea en la primera pantalla */
  .hero.hero{padding:114px 22px 14px;}
  .hero-row{gap:8px;margin-top:16px;padding-top:14px;}
  .hero-sub{font-size:12px;line-height:1.5;}
  .hero-tag{font-size:14px;line-height:1.5;}
  .hero-actions{margin-top:16px;gap:10px 20px;flex-wrap:nowrap;}
  .hero-actions .btn{font-size:13px;padding:12px 22px;}
  .hero-actions .btn-text{font-size:13px;}
  .talent{padding-top:6px;padding-bottom:64px;}
  .talent-head{margin-bottom:14px;gap:6px;}
  .talent-head .eyebrow{font-size:11px;}
  .talent-head .btn-text{font-size:11px;}
  .face{width:46vw;}
  .faces-track{padding:0 20px;gap:12px;}
  .face{width:62vw;}
  .campaigns{padding:72px 0;}
  .campaign-grid{gap:24px 12px;}
  .client-logos img{max-width:130px;max-height:38px;}
}
@media (prefers-reduced-motion: reduce){
  .faces{overflow-x:auto;}
  .faces-track{animation:none;}
}


/* ---------- TEXTOS LEGALES ---------- */
.legal{padding:120px 0 100px;}
.legal-wrap{max-width:820px;}
.legal-lang-note{display:none;font-size:13px;color:var(--stone);background:var(--paper-dim);padding:12px 16px;margin-bottom:24px;}
html:not([lang="es"]) .legal-lang-note{display:block;}
.legal-toc{display:flex;flex-wrap:wrap;gap:8px 24px;padding-bottom:20px;border-bottom:1px solid var(--line);margin-bottom:48px;}
.legal-toc a{font-size:13px;font-weight:600;border-bottom:1px solid transparent;}
.legal-toc a:hover{border-color:var(--accent);color:var(--accent);}
.legal-doc{padding-bottom:56px;margin-bottom:56px;border-bottom:1px solid var(--line);scroll-margin-top:110px;}
.legal-doc:last-child{border-bottom:0;margin-bottom:0;}
.legal-doc h1{font-size:clamp(26px,3vw,36px);margin-bottom:6px;}
.legal-doc h2{font-size:17px;font-weight:700;letter-spacing:-0.01em;margin:32px 0 10px;line-height:1.3;}
.legal-doc p,.legal-doc li{font-size:15px;color:#3A3935;max-width:68ch;}
.legal-doc p+p{margin-top:12px;}
.legal-doc ul{padding-left:20px;display:grid;gap:8px;margin-top:10px;}
.legal-date{font-size:12px !important;color:var(--stone) !important;margin-bottom:8px;}
.legal-table{overflow-x:auto;margin:16px 0;}
.legal-table table{border-collapse:collapse;width:100%;min-width:520px;font-size:14px;}
.legal-table th,.legal-table td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top;}
.legal-table th{font-size:12px;color:var(--stone);font-weight:600;}
.fill{background:#FFF1B8;padding:0 3px;}
.foot-legal{display:flex;gap:18px;flex-wrap:wrap;}
.foot-legal a{color:inherit;}
.foot-legal a:hover{color:var(--accent);}
.form-legal{font-size:11.5px;line-height:1.55;color:var(--stone);margin:6px 0 18px;max-width:62ch;}
.form-legal strong{font-weight:600;color:#5E5B53;}
.form-legal a,.field.check label a{text-decoration:underline;text-underline-offset:2px;}
.cookie-note{
  position:fixed;z-index:900;left:16px;bottom:16px;max-width:420px;
  background:var(--ink);color:#F5F5F3;padding:16px 18px;border-radius:14px;
  display:flex;gap:16px;align-items:center;box-shadow:0 12px 30px rgba(0,0,0,.18);
  font-size:12.5px;line-height:1.5;
}
.cookie-note a{color:#fff;text-decoration:underline;text-underline-offset:2px;}
.cookie-ok{
  flex-shrink:0;background:#fff;color:var(--ink);border:0;border-radius:999px;
  font-family:'Montserrat',sans-serif;font-weight:600;font-size:12px;padding:9px 16px;cursor:pointer;
}
.cookie-ok:hover{background:var(--accent);color:#fff;}
@media (max-width: 560px){
  .cookie-note{left:12px;right:12px;bottom:12px;max-width:none;}
  .legal{padding-top:110px;}
}

/* ---------- FOOTER ---------- */
footer{
  background:var(--paper);
  color:var(--ink);
  padding:70px 0 40px;
  border-top:1px solid var(--line);
}
footer .wrap{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  flex-wrap:wrap;
  gap:30px;
  padding-bottom:44px;
  border-bottom:1px solid var(--line);
}
footer .foot-mark img{height:20px;}
footer .foot-links{display:flex;gap:48px;flex-wrap:wrap;}
footer .foot-links div h4{
  font-size:11px;
  color:var(--stone);
  margin-bottom:16px;
  font-weight:600;
}
footer .foot-links div a,
footer .foot-links div p{
  display:block;
  font-size:14px;
  color:var(--ink);
  margin-bottom:10px;
  transition:color .2s ease;
}
footer .foot-links div a:hover{color:var(--accent);}
footer .foot-bottom{
  max-width:1240px;
  margin:0 auto;
  padding:26px 48px 0;
  display:flex;
  justify-content:space-between;
  font-size:12px;
  color:var(--stone);
  flex-wrap:wrap;
  gap:10px;
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 880px){
  nav.links{display:none;}
  /* Móvil/tablet: logo a la izquierda, botón centrado, menú a la derecha; idioma dentro del menú */
  .navbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;}
  .nav-mark{justify-self:start;}
  .nav-cta{justify-self:center;}
  .nav-toggle{justify-self:end;}
  .lang-select{display:none;}
  nav.links.mobile-open .nav-lang{
    display:flex;gap:6px;padding:12px 16px 8px;margin-top:6px;border-top:1px solid var(--line);
  }
  .nav-lang button{
    flex:1;font-family:'Montserrat',sans-serif;font-size:12px;font-weight:600;letter-spacing:.06em;
    background:none;border:1px solid var(--line);border-radius:999px;padding:9px 0;color:var(--ink);cursor:pointer;
  }
  .nav-lang button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--paper);}
  .nav-toggle{display:block;}
  .statement .wrap{grid-template-columns:1fr;gap:24px;}
  .services-index{grid-template-columns:repeat(2, 1fr);}
  .service-row.featured{grid-column:span 1;}
  .service-row.featured.wide{grid-column:1 / -1;}
  .services-index{grid-auto-flow:dense;}
  .book-grid, .full-grid{grid-template-columns:repeat(2, 1fr);}
  .process-grid{grid-template-columns:1fr 1fr;row-gap:44px;}
  .process-step{border-left:none;padding-left:0;}
  .contact .wrap{grid-template-columns:1fr;gap:56px;}
  .form-row{grid-template-columns:1fr;}
  footer .foot-bottom{flex-direction:column;}
  .lb-main{padding:0 44px;}
  .hero-row{flex-direction:column;align-items:flex-start;}
}
@media (max-width: 560px){
  .wrap{padding:0 22px;}
  .navbar{padding:18px 22px;}
  .book-grid, .full-grid{grid-template-columns:1fr 1fr;gap:20px 14px;}
  .process-grid{grid-template-columns:1fr;}
  .services-index{grid-template-columns:1fr;}
  .service-row.featured{grid-column:span 1;}
  .service-row .name{font-size:19px;}
  .service-row.featured .name{font-size:24px;}
  .hero{padding:130px 22px 70px;}
  .lb-arrow{font-size:26px;padding:8px;}
  .lb-main{padding:0 30px;}
}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important;}
  .hero h1,.hero-row,.hero-actions{opacity:1;}
}

::selection{background:var(--ink);color:var(--paper);}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}

/* Campañas con 2 fotos en móvil (al final para que no lo pisen otras reglas) */
@media (max-width: 560px){
  .campaigns .campaign-grid.campaign-grid--2{grid-template-columns:1fr;gap:28px;}
  .campaigns .campaign-grid--2 .campaign .campaign-media{height:auto;min-height:0;aspect-ratio:4/3;}
  .campaigns .campaign-grid--2 .campaign:not(.campaign-lead) .campaign-media{aspect-ratio:4/5;}
}

/* Ordenador y tablet: hero más compacto para que las caras del book se vean sin bajar */
@media (min-width: 561px){
  .hero.hero{padding:104px 48px 16px;}
  .wordmark{font-size:clamp(38px, 7.4vw, 118px);}
  .hero-row{margin-top:20px;padding-top:14px;gap:20px 40px;}
  .hero-sub{font-size:13px;}
  .hero-tag{font-size:15px;line-height:1.5;max-width:460px;}
  .hero-actions{margin-top:14px;}
  .hero-actions .btn{padding-top:13px;padding-bottom:13px;}
  .talent{padding-top:4px;}
  .talent-head{flex-direction:row;justify-content:flex-start;align-items:baseline;flex-wrap:wrap;gap:6px 22px;margin-bottom:14px;}
  .talent-note.talent-note--top{margin-top:0;}
  .face{width:clamp(160px,15.5vw,230px);}
}
@media (max-width: 560px){
  .client-logos{grid-template-columns:repeat(2,1fr);gap:18px 16px;}
  .client-logos li{height:60px;}
}


.client-logos img[alt="Suns Boards"]{max-height:62px;}
.client-logos img[alt="Kalk"]{max-height:34px;}
/* Logos: filas centradas (la última fila queda centrada aunque no esté completa) */
.client-logos{display:flex;flex-wrap:wrap;justify-content:center;}
.client-logos li{flex:0 0 calc((100% - 4*28px)/5);}
@media (max-width: 880px){ .client-logos li{flex-basis:calc((100% - 2*20px)/3);} }
@media (max-width: 560px){ .client-logos li{flex-basis:calc((100% - 16px)/2);} }
.client-logos li{min-width:0;}
.client-logos li img{max-width:min(100%, 180px);}
@media (max-width: 560px){ .client-logos img[alt="Germaine de Capuccini"],.client-logos img[alt="Ysabel Mora"]{max-width:100%;} }

/* ==========================================================================
   SERVICIOS Y PROCESO: tarjetas modernas con color y movimiento (31/10/2026)
   - Tarjetas separadas y redondeadas; al pasar el ratón, un foco de color
     sigue al cursor (variables --mx/--my desde main.js).
   - Las destacadas (Fotografía, Modelos, Producción con IA) llevan un
     degradado vivo animado (rojo Budek, naranja, coral, ciruela) con grano.
   ========================================================================== */
.services-index{gap:14px;border:0;}
.service-row{
  border:1px solid var(--line);border-radius:22px;background:#F7F5F1;
  overflow:hidden;isolation:isolate;padding:30px 28px 30px;min-height:190px;
  transition:transform .45s cubic-bezier(.16,1,.3,1), box-shadow .45s ease, border-color .3s ease;
}
.service-row::after{
  content:"";position:absolute;inset:0;z-index:-1;opacity:0;transition:opacity .35s ease;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%), rgba(231,57,44,.20), rgba(255,138,61,.12) 35%, transparent 65%);
}
.service-row:hover{background:#F7F5F1;transform:translateY(-6px);box-shadow:0 22px 44px -18px rgba(231,57,44,.35);border-color:rgba(231,57,44,.35);}
.service-row:hover::after{opacity:1;}
.service-row::before{
  font-size:40px;font-weight:800;letter-spacing:-0.04em;line-height:1;
  background:linear-gradient(120deg,#E7392C,#FF8A3D 60%,#F4B39A);
  -webkit-background-clip:text;background-clip:text;color:transparent;opacity:.9;
}
.service-row .name{margin-top:auto;}
/* Destacadas: degradado animado */
.service-row.featured{
  border:0;color:#fff;
  background:
    radial-gradient(60% 80% at 15% 20%, #FF8A3D 0%, transparent 60%),
    radial-gradient(55% 75% at 85% 30%, #E7392C 0%, transparent 62%),
    radial-gradient(70% 90% at 60% 95%, #5A2347 0%, transparent 65%),
    radial-gradient(50% 60% at 30% 85%, #F4B39A 0%, transparent 60%),
    #1A0F14;
  background-size:180% 180%;
  animation:svc-flow 14s ease-in-out infinite alternate;
}
.service-row.featured:nth-of-type(6){animation-duration:18s;animation-delay:-5s;}
.service-row.featured:last-child{animation-duration:16s;animation-delay:-9s;filter:hue-rotate(-18deg);}
.service-row.featured::after{
  opacity:.22;mix-blend-mode:overlay;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}
.service-row.featured::before{background:none;color:rgba(255,255,255,.75);-webkit-background-clip:border-box;background-clip:border-box;}
.service-row.featured .name{color:#fff;font-size:34px;}
.service-row.featured .desc{color:rgba(255,255,255,.82);}
.service-row.featured:hover{background:
    radial-gradient(60% 80% at 15% 20%, #FF8A3D 0%, transparent 60%),
    radial-gradient(55% 75% at 85% 30%, #E7392C 0%, transparent 62%),
    radial-gradient(70% 90% at 60% 95%, #5A2347 0%, transparent 65%),
    radial-gradient(50% 60% at 30% 85%, #F4B39A 0%, transparent 60%),
    #1A0F14;background-size:180% 180%;box-shadow:0 26px 50px -20px rgba(231,57,44,.55);}
.service-row.featured:hover::after{opacity:.22;}
.service-row.featured:hover .name{color:#fff;}
@keyframes svc-flow{
  0%{background-position:0% 0%}
  50%{background-position:100% 40%}
  100%{background-position:30% 100%}
}

/* Proceso: tarjetas con línea de color que se llena al aparecer */
.process{background:var(--paper);}
.process-grid{gap:14px;}
.process-step,.process-step:first-child{
  position:relative;border:1px solid var(--line);border-radius:22px;background:#F7F5F1;
  padding:30px 26px 30px;overflow:hidden;
  transition:transform .45s cubic-bezier(.16,1,.3,1), box-shadow .45s ease;
}
.process-step::before{
  content:"";position:absolute;left:0;top:0;height:4px;width:100%;
  background:linear-gradient(90deg,#E7392C,#FF8A3D,#F4B39A,#5A2347,#E7392C);background-size:300% 100%;
  transform:scaleX(0);transform-origin:left;transition:transform 1.1s cubic-bezier(.16,1,.3,1) .2s;
  animation:svc-line 6s linear infinite;
}
.process-step.is-visible::before{transform:scaleX(1);}
.process-step:hover{transform:translateY(-6px);box-shadow:0 22px 44px -18px rgba(231,57,44,.3);}
.process-step .num{
  font-size:44px;line-height:1;letter-spacing:-0.03em;
  background:linear-gradient(120deg,#E7392C,#FF8A3D 60%,#F4B39A);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
@keyframes svc-line{to{background-position:300% 0}}

@media (max-width: 880px){
  .process-grid{row-gap:14px;}
  .process-step,.process-step:first-child{padding:26px 22px;}
}
@media (max-width: 560px){
  .service-row{min-height:0;padding:24px 22px;}
  .service-row::before,.process-step .num{font-size:32px;}
  .service-row.featured .name{font-size:26px;}
}
@media (prefers-reduced-motion: reduce){
  .service-row.featured,.process-step::before{animation:none;}
}

/* Banner de cookies con consentimiento (Aceptar y Rechazar con el mismo peso visual, como pide la AEPD) */
.cookie-note{flex-direction:column;align-items:stretch;gap:12px;}
.cookie-actions{display:flex;gap:10px;}
.cookie-btn{
  flex:1;background:#fff;color:var(--ink);border:1px solid #fff;border-radius:999px;
  font-family:'Montserrat',sans-serif;font-weight:600;font-size:12.5px;padding:10px 16px;cursor:pointer;
  transition:background .2s ease,color .2s ease,border-color .2s ease;
}
.cookie-btn:hover{background:var(--accent);border-color:var(--accent);color:#fff;}
.foot-cookie-btn{background:none;border:0;padding:0;font:inherit;color:inherit;cursor:pointer;}
.foot-cookie-btn:hover{color:var(--accent);}

/* Móvil: "Book de talento" y "Ver el book completo" en la misma línea, menos hueco */
@media (max-width: 560px){
  .talent-head{flex-direction:row;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:4px 16px;margin-bottom:12px;}
  .talent-head .eyebrow{margin:0;}
  .talent-note.talent-note--top{flex-basis:100%;margin-top:0;}
  .hero-actions{margin-top:14px;}
  .talent{padding-top:10px;}
}

/* ==========================================================================
   MÓVIL COMPACTO (04/11/2026): menos huecos en blanco entre secciones
   ========================================================================== */
@media (max-width: 560px){
  .talent{padding-bottom:36px;}
  .campaigns,.services,.process{padding:44px 0;}
  .statement{padding:40px 0;}
  .contact{padding:48px 0 44px;}
  .services .section-head,.campaigns .section-head{margin-bottom:22px;gap:10px;}
  .services .section-head p,.campaigns .section-head p{font-size:14px;padding-bottom:0;}
  .campaigns-more{margin-top:22px;}
  .process h2{margin-bottom:22px;}
  /* Logos de clientes */
  .clients{padding:4px 0 36px;}
  .clients .eyebrow{margin-bottom:14px;}
  .client-logos{gap:8px 16px;}
  .client-logos li{height:52px;}
  /* Cifras en una fila de 3 */
  .statement .wrap{grid-template-columns:1fr;gap:22px;}
  .stat-list{flex-direction:row;justify-content:space-between;gap:12px;}
  .stat-item .num{font-size:30px;}
  .stat-item .lbl{font-size:11px;line-height:1.3;}
  .statement p.serif{font-size:24px;}
  /* Tarjetas de servicios y proceso */
  .services-index{gap:10px;}
  .service-row{gap:10px;padding:20px 20px 22px;}
  .service-row::before,.process-step .num{font-size:28px;}
  .process-grid{row-gap:10px;}
  .process-step,.process-step:first-child{padding:20px 20px 22px;}
  .process-step .num{margin-bottom:10px;}
  /* Contacto y formulario */
  .contact .wrap{gap:28px;}
  .contact-intro h2{margin-bottom:12px;}
  .contact-intro p{margin-bottom:0;}
  .contact-detail{margin-top:20px;padding-top:18px;}
  .contact-detail dd{font-size:16px;margin-bottom:12px;}
  form{gap:16px;}
  .form-row{gap:16px;}
  /* Pie */
  footer{padding:36px 0 28px;}
  footer .wrap{gap:22px;padding-bottom:24px;}
  footer .foot-links{gap:22px 32px;}
  footer .foot-links div h4{margin-bottom:8px;}
  footer .foot-links div a,footer .foot-links div p{margin-bottom:6px;}
}

/* Campañas en portada: título y fotos llevan a la página de todas las campañas */
.campaigns-title-link{color:inherit;transition:color .2s ease;}
.campaigns-title-link:hover{color:var(--accent);}
#campanas .cm-item{cursor:pointer;}
#campanas .cm-item img{transition:transform .6s cubic-bezier(.16,1,.3,1);}
#campanas .cm-item:hover img{transform:scale(1.03);}

/* "Ver el book completo": subrayado en rojo Budek */
.talent-head .btn-text{border-bottom-color:var(--accent);}

/* ==========================================================================
   CAMPAÑAS EN PORTADA CON MOVIMIENTO (04/11/2026)
   1) Entrada: cada foto se descubre de abajo arriba (cortinilla) con zoom de salida, escalonadas.
   2) Movimiento lento continuo tipo "Ken Burns" (acercamiento suave), distinto en cada foto.
   3) Cada pocos segundos una foto cambia por otra campaña con fundido (main.js).
   ========================================================================== */
#campanas .cm-item{position:relative;}
#campanas .cm-item.reveal{opacity:1;transform:none;transition:none;}
#campanas .cm-item.reveal::after{
  content:"";position:absolute;inset:0;background:var(--paper);z-index:1;pointer-events:none;
  transform-origin:top;transition:transform 1.1s cubic-bezier(.77,0,.18,1);transition-delay:inherit;
}
#campanas .cm-item.reveal.is-visible::after{transform:scaleY(0);}
#campanas .cm-item.reveal img{transform:scale(1.25);transition:transform 1.6s cubic-bezier(.16,1,.3,1), opacity .9s ease;}
#campanas .cm-item.reveal.is-visible img{transform:none;}
#campanas .cm-item:nth-child(2)::after{transition-delay:.08s;} #campanas .cm-item:nth-child(2) img{transition-delay:.08s,0s;}
#campanas .cm-item:nth-child(3)::after{transition-delay:.16s;} #campanas .cm-item:nth-child(3) img{transition-delay:.16s,0s;}
#campanas .cm-item:nth-child(4)::after{transition-delay:.24s;} #campanas .cm-item:nth-child(4) img{transition-delay:.24s,0s;}
#campanas .cm-item:nth-child(5)::after{transition-delay:.12s;} #campanas .cm-item:nth-child(5) img{transition-delay:.12s,0s;}
#campanas .cm-item:nth-child(6)::after{transition-delay:.2s;}  #campanas .cm-item:nth-child(6) img{transition-delay:.2s,0s;}
#campanas .cm-item:nth-child(7)::after{transition-delay:.28s;} #campanas .cm-item:nth-child(7) img{transition-delay:.28s,0s;}
#campanas .cm-item:nth-child(8)::after{transition-delay:.36s;} #campanas .cm-item:nth-child(8) img{transition-delay:.36s,0s;}
#campanas .cm-item img{animation:cm-drift 16s ease-in-out infinite alternate;}
#campanas .cm-item:nth-child(3n+2) img{animation-duration:19s;animation-direction:alternate-reverse;}
#campanas .cm-item:nth-child(3n) img{animation-duration:22s;}
@keyframes cm-drift{
  from{scale:1;translate:0 0;}
  to{scale:1.08;translate:-1.5% -1.5%;}
}
#campanas .cm-item.cm-fixed-ratio img{height:100%;object-fit:cover;}
#campanas .cm-item img.cm-fading{opacity:0;}
#campanas .cm-item:hover img{transform:scale(1.04);}
@media (prefers-reduced-motion: reduce){
  #campanas .cm-item.reveal::after{display:none;}
  #campanas .cm-item img{animation:none;transform:none!important;}
}
.service-row .name{line-height:1.2;margin:0;}

/* Huecos de la rejilla de campañas: "+" gris que pasa a rojo y lleva a todas las campañas */
#campanas .campaign-masonry{position:relative;}
.cm-plus{
  position:absolute;display:flex;align-items:center;justify-content:center;
  background:#F4F3F0;color:#B9B5AC;transition:background .3s ease,color .3s ease;
}
.cm-plus span{position:relative;width:44px;height:44px;transition:transform .45s cubic-bezier(.16,1,.3,1);}
.cm-plus span::before,.cm-plus span::after{content:"";position:absolute;background:currentColor;border-radius:2px;}
.cm-plus span::before{left:50%;top:0;width:2px;height:100%;transform:translateX(-50%);}
.cm-plus span::after{top:50%;left:0;height:2px;width:100%;transform:translateY(-50%);}
.cm-plus:hover,.cm-plus:focus-visible{color:var(--accent);background:#FBEDEB;}
.cm-plus:hover span{transform:rotate(90deg);}
@media (max-width: 560px){ .cm-plus span{width:32px;height:32px;} }
