.header-search{display:flex;align-items:center;flex:1 1 15rem;max-width:24rem;min-width:0;margin:0 .65rem;border:1px solid #d7e0d9;border-radius:999px;background:#f4f6f2;color:var(--ink)}
.header-search:focus-within{outline:2px solid var(--green-deep);outline-offset:2px}
.header-search input{display:block;width:100%;min-width:0;margin:0;padding:.55rem .2rem .55rem .85rem;border:0;border-radius:999px;background:transparent;color:var(--ink);font:400 .84rem/1.2 system-ui,sans-serif;outline:none;box-shadow:none}
.header-search button{display:grid;place-items:center;flex:0 0 2.25rem;width:2.25rem;height:2.25rem;padding:.4rem;border:0;border-radius:999px;background:transparent;color:var(--green-deep);cursor:pointer}
.header-search button:hover{background:#e5ece5}
.header-search button:focus-visible{outline:2px solid var(--green-deep);outline-offset:2px}
.header-search svg{width:18px;height:18px}
.site-nav{flex-shrink:0}
.related-sites-label{margin:.9rem 0 .6rem;font-size:.84rem;font-weight:800;color:var(--ink)}
.search-summary{margin:0 0 1.5rem;color:var(--muted)}
.search-results{display:grid;gap:1.5rem}
.search-result{padding:0 0 1.5rem;border-bottom:1px solid var(--line)}
.search-result h2{margin:.25rem 0 .65rem;font-size:1.35rem;line-height:1.2}
.search-result h2 a{color:var(--green-deep);text-decoration:none}
.search-result h2 a:hover{text-decoration:underline}
.search-result p{margin:0;font-size:1rem;line-height:1.65}
.search-result-category{font-size:.73rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.search-help{color:var(--muted)}
@media(max-width:980px){.header-search{margin:0 .55rem;max-width:28rem;flex-basis:12rem}.header-search input{font-size:1rem;padding-left:.65rem}.header-search button{flex-basis:2rem;width:2rem;height:2.25rem}.brand,.menu-toggle{flex-shrink:0}}

/* Slider: estilos originales del demo, sin rediseño. */
.studio-carousel {
  position: relative;
  z-index: 1;
  --ribbon-width: calc(100vw + 2rem);
  --ribbon-curve: clamp(3.8rem, 5.8vw, 6.7rem);
  width: calc(100vw + 2rem);
  margin: clamp(1.1rem, 2vw, 1.55rem) calc(50% - 50vw - 1rem) 0;
  line-height: 0;
}

.carousel-viewport {
  position: relative;
  display: block;
  overflow: hidden;
  height: clamp(18rem, 32vw, 29rem);
  padding: 0;
  background: transparent;
  box-shadow: none;
  line-height: 0;
  mask-image: none;
}

.carousel-viewport::before {
  position: absolute;
  left: -8%;
  z-index: 2;
  width: 116%;
  height: var(--ribbon-curve);
  pointer-events: none;
  content: "";
  background: var(--paper);
}

.carousel-viewport::before {
  top: calc(var(--ribbon-curve) * -0.64);
  border-radius: 0 0 50% 50% / 0 0 100% 100%;
}

.carousel-viewport::after {
  display: none;
}

.carousel-track {
  display: flex;
  width: max-content;
  height: 100%;
  animation: gallery-loop 58s linear infinite;
  transform: translate3d(0, 0, 0);
  animation-play-state: paused;
  will-change: auto;
}

.ribbon-picture,
.ribbon-image {
  display: block;
  height: 100%;
}

.ribbon-picture {
  flex: 0 0 var(--ribbon-width);
  width: var(--ribbon-width);
}

.ribbon-image {
  width: 100%;
  max-width: none;
  object-fit: cover;
  object-position: 50% 50%;
  user-select: none;
}

.studio-carousel:hover .carousel-track,
.studio-carousel:focus-within .carousel-track {
  animation-play-state: paused;
}

@keyframes gallery-loop {
  from {
    transform: translate3d(0, 0, 0);
  }

  to {
    transform: translate3d(calc(var(--ribbon-width) * -1), 0, 0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .carousel-track {
    animation: none;
    transform: translate3d(0, 0, 0);
  }
}

/* Retirar el límite estático añadido al desactivar el demo. */
.ribbon-picture { max-width: none; }
[data-motion-carousel][data-running="true"] .carousel-track { animation-play-state: running; will-change: transform; }
.carousel-toggle { position: static; display: block; min-height: 2.2rem; width: max-content; margin: .6rem 1rem 0 auto; padding: .4rem .7rem; border: 1px solid var(--line); border-radius: 999px; background: var(--paper); color: var(--muted); font: 650 .73rem/1.2 system-ui,sans-serif; cursor: pointer; }
.carousel-toggle:hover { color: var(--ink); }
.carousel-toggle[hidden] { display: none; }
@media (max-width:980px) {
  .studio-carousel { width: 100%; margin-right: 0; margin-left: 0; }
}
@media (max-width:640px) {
  .studio-carousel { margin-top: 1.25rem; --ribbon-width: calc(100vw + 18rem); --ribbon-curve: 3.9rem; }
  .carousel-viewport { height: 17rem; mask-image: none; }
}
@media (prefers-reduced-motion:reduce) {
  [data-motion-carousel] .carousel-track { animation: none; transform: translate3d(0,0,0); will-change: auto; }
  .carousel-toggle { display: none; }
}