/* Creaciones: tinta azul sobre papel; se conservan los trazos originales. */
@media(min-width:901px){
  .creative{
    height:calc(100svh - 130px);
    min-height:0;
    padding-bottom:24px;
  }
  .creative .creation-doodle--01{left:-1px;bottom:-1px}
  .creative .creation-doodle--04{right:14px;bottom:10px}
}
.creative .creation-doodle{mix-blend-mode:multiply;opacity:.94}
.creative .cards{margin-inline:auto}
.creative .intro-copy{min-width:0}
.creation-project .case-hero{min-height:auto;padding-top:100px}
.creation-project .case-hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center}
.creation-project .case-hero-grid>*{min-width:0}
.creation-project .case-hero-media img{height:auto;object-fit:contain}
.creation-project .case-hero-copy h1{line-height:1.05}
.creation-project .case-title-line,.creation-project .case-title-highlight{line-height:1.05!important}
.creation-gallery{padding-top:50px}
.creation-pieces{width:min(1180px,100%);margin:auto;display:grid;gap:48px}
.creation-pieces img{display:block;width:100%;height:auto}
.creation-credit{width:min(1180px,100%);margin:24px auto 0;font-size:16px;line-height:1.5}
@media(max-width:900px){.creative{padding-bottom:50px;min-height:0}.creative .intro-row{gap:20px}.creative .shape{height:90px}.creative .title{font-size:clamp(32px,7vw,48px)}.creation-project .case-hero-grid{grid-template-columns:minmax(0,1fr)}.creation-project .case-hero{padding-top:80px}.creation-pieces{gap:28px}}
@media(max-width:480px){.creative .intro-row{display:block}.creative .shape{width:70px;height:70px;margin-bottom:20px}.creative .title{font-size:42px}}
.creative .creation-doodle--03{width:clamp(140px,8.5vw,170px);height:auto;right:0;top:0}
@media(min-width:901px){.creation-project .case-back{top:64px}}

/* Doodles inferiores: escala acorde al grupo superior derecho. */
.creative .creation-doodle--01{width:160px;height:160px}
.creative .creation-doodle--04{width:135px;height:135px}

/* Títulos bilingües de las tarjetas de Creaciones. */
.card-title-lang{display:none}
html[lang="es"] .card-title-lang--es,
html[lang="en"] .card-title-lang--en{display:inline}
/* Creaciones — adaptación mobile completa. */
@media(max-width:900px){
  body{overflow-x:hidden}
  .creative{
    min-height:calc(100svh - 90px);
    padding:30px 20px 96px;
    overflow:hidden;
  }
  .creative .intro-row{
    display:grid;
    grid-template-columns:1fr;
    gap:14px;
    margin:0 auto 42px;
  }
  .creative .shape{
    width:68px;
    height:68px;
    margin:0;
  }
  .creative .title{
    max-width:100%;
    margin:0 0 16px;
    padding:2px 10px 6px;
    font-size:clamp(40px,12vw,52px);
    line-height:.9;
  }
  .creative .intro-copy p{
    max-width:34rem;
    font-size:17px;
    line-height:1.28;
  }
  .creative .cards-wrap{
    display:block;
    width:auto;
    margin:0 -20px;
  }
  .creative .cards-viewport{
    overflow-x:auto;
    overflow-y:visible;
    padding:10px max(20px,calc((100vw - 280px)/2)) 30px;
    scroll-snap-type:x mandatory;
    scroll-padding-inline:max(20px,calc((100vw - 280px)/2));
    overscroll-behavior-inline:contain;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
  }
  .creative .cards-viewport::-webkit-scrollbar{display:none}
  .creative .cards{
    width:max-content;
    gap:18px;
    padding:0;
    overflow:visible;
  }
  .creative .card{
    width:min(280px,calc(100vw - 64px));
    min-height:0;
    padding:14px 14px 18px;
    scroll-snap-align:center;
    box-shadow:6px 7px 7px rgba(0,0,0,.28);
  }
  .creative .card img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover}
  .creative .card p{margin-top:12px;font-size:14px;line-height:1.25}
  .creative .arrow{display:none}

  .creative .creation-doodles{display:block;overflow:hidden}
  .creative .creation-doodle--01{width:92px;height:92px;left:-1px;bottom:-1px}
  .creative .creation-doodle--03{display:block;width:72px;height:auto;right:0;top:8px}
  .creative .creation-doodle--04{width:78px;height:78px;right:-15px;bottom:8px}
}

@media(max-width:480px){
  body:has(.creative) .topbar-inner{
    width:calc(100% - 28px);
    min-height:92px;
    padding:12px 0;
    gap:6px 10px;
  }
  body:has(.creative) .topbar-link{
    padding:5px 3px;
    font-size:15px;
  }
  .creative{padding-top:28px}
  .creative .intro-row{display:grid;gap:13px;margin-bottom:36px}
  .creative .shape{width:62px;height:62px;margin:0}
  .creative .title{font-size:clamp(38px,11.5vw,48px)}
  .creative .intro-copy p{font-size:16.5px;line-height:1.27}
}

@media(max-width:350px){
  body:has(.creative) .topbar-link{font-size:14px}
  .creative{padding-inline:16px}
  .creative .cards-wrap{margin-inline:-16px}
  .creative .title{font-size:36px}
}
/* Creaciones mobile: selector fuera del header y del doodle superior. */
@media(max-width:900px){
}
/* Creaciones mobile: adopta el componente global de navegación. */
@media(max-width:480px){
  body:has(.creative) .topbar-inner{
    width:100%;
    min-height:104px;
    padding:14px 20px;
    gap:0;
    grid-template-columns:auto 1fr auto;
  }
  body:has(.creative) .topbar-link{
    padding:0 20px;
    font-size:clamp(18px,5vw,22px);
  }
}
@media(max-width:350px){
  body:has(.creative) .topbar-link{font-size:18px}
}

/* Phone/tablet composition: title beside the icon, drawings below the content. */
@media(max-width:900px){
  .creative{min-height:calc(100svh - 104px);padding-bottom:90px}
  .creative .intro-row{display:grid;grid-template-columns:52px minmax(0,1fr);align-items:center;gap:14px 12px;margin-bottom:26px}
  .creative .shape{grid-column:1;grid-row:1;width:52px;height:52px;margin:0}
  .creative .intro-copy{display:contents}
  .creative .title{grid-column:2;grid-row:1;justify-self:start;min-width:0;max-width:100%;margin:0;padding:3px 8px 6px;font-size:clamp(28px,8.5vw,44px);line-height:.95}
  .creative .intro-copy p{grid-column:1/-1;grid-row:2;margin:0}
  .creative .creation-doodles{z-index:0;pointer-events:none}
  .creative .creation-doodle--03{width:72px;height:auto;top:auto;right:0;bottom:0;left:auto}
  .creative .creation-doodle--04{width:78px;height:78px;top:auto;right:auto;left:50%;bottom:0;transform:translateX(-50%)}
}