/* Copia de brand/brand-certisur.css sin comentarios, generada por scripts/sync-brand.sh: no editar acá. */
.cs-carousel { position: relative; }
.cs-carousel__viewport { overflow: hidden; border-radius: var(--cs-r-tarjeta); }
.cs-carousel__track { display: flex; transition: transform .6s var(--cs-ease); }
.cs-slide { flex: 0 0 100%; min-height: 380px; padding: var(--cs-s-7); display: grid; grid-template-columns: .9fr 1.1fr; gap: var(--cs-s-6); align-items: center; background: var(--cs-noche-2); color: #fff; }
.cs-slide h3 { color: #fff; font-size: var(--cs-t-2xl); }
.cs-slide p { color: var(--cs-noche-texto); margin-top: var(--cs-s-3); }
.cs-slide .cs-btn { margin-top: var(--cs-s-5); }
.cs-slide__list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--cs-s-2); }
.cs-slide__list a {
  display: flex; justify-content: space-between; align-items: center; gap: var(--cs-s-3);
  padding: var(--cs-s-4) var(--cs-s-5); border-radius: var(--cs-r-campo);
  background: rgba(255, 255, 255, .04); border: 1px solid var(--cs-noche-linea);
  color: #fff; text-decoration: none; font-weight: 600;
}
.cs-slide__list a:hover { border-color: var(--cs-noche-link); }
.cs-slide__list small { color: var(--cs-noche-texto); font-weight: 400; font-size: var(--cs-t-xs); }
.cs-carousel__controls { display: flex; align-items: center; gap: var(--cs-s-4); margin-top: var(--cs-s-4); }
.cs-carousel__tabs { display: flex; gap: var(--cs-s-2); flex: 1; min-width: 0; }
.cs-carousel__tab {
  flex: 1; min-width: 0; text-align: left; background: none; border: 0; border-top: 3px solid var(--cs-linea);
  padding: var(--cs-s-3) 0 0; font: 600 var(--cs-t-sm)/1.3 var(--cs-font); color: var(--cs-tinta-suave); cursor: pointer; position: relative;
}
.cs-carousel__tab[aria-selected="true"] { color: var(--cs-institucional); }
.cs-carousel__tab::before { content: ""; position: absolute; top: -3px; left: 0; height: 3px; width: 0; background: var(--cs-accion); }
.cs-carousel__tab[aria-selected="true"]::before { width: 100%; }
.cs-carousel[data-playing] .cs-carousel__tab[aria-selected="true"]::before { animation: cs-progress var(--cs-interval, 7s) linear; }
.cs-carousel__arrows { display: flex; gap: var(--cs-s-2); }
.cs-icon-btn { width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--cs-linea); background: var(--cs-superficie); color: var(--cs-institucional); display: grid; place-items: center; cursor: pointer; }
.cs-icon-btn:hover { border-color: var(--cs-institucional); }
.cs-icon-btn svg { width: 18px; height: 18px; }
@keyframes cs-progress { from { width: 0; } to { width: 100%; } }
.cs-recursos { display: grid; grid-template-columns: 16rem 1fr; gap: var(--cs-s-7); align-items: start; }
.cs-recursos__nav { position: sticky; top: calc(var(--cs-tope) + var(--cs-s-4)); display: grid; gap: 2px; }
.cs-recursos__nav a {
  display: flex; justify-content: space-between; padding: .7rem .9rem; border-radius: var(--cs-r-campo);
  color: var(--cs-tinta); font-weight: 600; font-size: var(--cs-t-sm); text-decoration: none;
}
.cs-recursos__nav a span { color: var(--cs-tinta-suave); font-weight: 400; font-variant-numeric: tabular-nums; }
.cs-recursos__nav a:hover { background: var(--cs-superficie); }
.cs-recursos__nav a[aria-current="true"] { background: var(--cs-institucional); color: #fff; }
.cs-recursos__nav a[aria-current="true"] span { color: #C9D4E8; }
.cs-recursos__vacio { padding: var(--cs-s-7); border: 1px dashed #C8D3E2; border-radius: var(--cs-r-tarjeta); text-align: center; color: var(--cs-tinta-suave); }
@media (max-width: 991px) {
  .cs-recursos { grid-template-columns: 1fr; gap: var(--cs-s-5); }
  .cs-recursos__nav { position: static; display: flex; overflow-x: auto; gap: var(--cs-s-2); padding-bottom: var(--cs-s-2); scrollbar-width: thin; }
  .cs-recursos__nav a { flex: none; border: 1px solid var(--cs-linea); background: var(--cs-superficie); gap: var(--cs-s-2); }
}
@media (max-width: 991px) {
  .cs-slide { grid-template-columns: 1fr; align-content: start; }
}
@media (max-width: 767px) {
  .cs-slide { padding: var(--cs-s-5); min-height: 0; }
  .cs-slide__list a { flex-direction: column; align-items: flex-start; gap: 2px; }
  .cs-carousel__arrows { display: none; }
}
.cs-discovery { display: grid; grid-template-columns: 1fr minmax(0, 30rem); gap: var(--cs-s-8); align-items: center; }
.cs-pasos { list-style: none; margin: var(--cs-s-6) 0 0; padding: 0; display: grid; gap: var(--cs-s-4); max-width: var(--cs-medida); }
.cs-pasos li { padding-left: var(--cs-s-5); border-left: 2px solid var(--cs-linea); color: var(--cs-tinta-suave); }
.cs-pasos strong { color: var(--cs-institucional); }
.cs-ciclo {
  background: var(--cs-superficie); border: 1px solid var(--cs-linea); border-radius: var(--cs-r-tarjeta);
  padding: var(--cs-s-6);
}
.cs-ciclo[hidden] { display: none; }
.cs-ciclo__eyebrow { display: flex; align-items: center; gap: var(--cs-s-2); font-size: var(--cs-t-sm); color: var(--cs-tinta-suave); }
.cs-ciclo__title { margin-top: var(--cs-s-3); font-size: var(--cs-t-2xl); font-weight: 700; letter-spacing: -0.02em; line-height: 1.15; color: var(--cs-institucional); }
.cs-ciclo__sub { margin-top: var(--cs-s-1); color: var(--cs-tinta-suave); }
.cs-ciclo__meter { position: relative; margin-top: var(--cs-s-6); height: 10px; border-radius: var(--cs-r-pill); background: var(--cs-linea); }
.cs-ciclo__fill { position: absolute; inset: 0 auto 0 0; border-radius: inherit; background: var(--cs-institucional); }
.cs-ciclo__renew { position: absolute; top: 50%; width: 18px; height: 18px; margin: -9px 0 0 -9px; border-radius: 50%; background: var(--cs-sello); border: 3px solid var(--cs-superficie); box-shadow: 0 0 0 1px var(--cs-sello); }
.cs-ciclo__scale { display: flex; justify-content: space-between; gap: var(--cs-s-3); margin-top: var(--cs-s-3); font-size: var(--cs-t-xs); color: var(--cs-tinta-suave); }
.cs-ciclo__scale b { color: var(--cs-tinta); }
.cs-ciclo__left { font-weight: 700; color: var(--cs-institucional); font-variant-numeric: tabular-nums; }
.cs-ciclo__note { display: flex; gap: var(--cs-s-2); align-items: baseline; margin-top: var(--cs-s-5); padding-top: var(--cs-s-4); border-top: 1px solid var(--cs-linea); font-size: var(--cs-t-sm); color: var(--cs-tinta-suave); }
.cs-ciclo__dot { flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--cs-sello); transform: translateY(1px); }
.cs-ciclo__btn { margin-top: var(--cs-s-5); width: 100%; }
@media (max-width: 991px) {
  .cs-discovery { grid-template-columns: 1fr; gap: var(--cs-s-7); }
}