/* ==========================================================================
   RCA Motorsport — Pages stylesheet
   Estilos por página. Convención: cada página prefija sus clases con su slug.
   Home: .home-{section}
   ========================================================================== */

/* ==========================================================================
   HOME — 1. Hero
   ========================================================================== */

.home-hero {
  padding-block: clamp(var(--rca-space-14), 8vw, var(--rca-space-32));
}

.home-hero__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-10);
  align-items: center;
}

.home-hero__copy { min-width: 0; display: flex; flex-direction: column; gap: var(--rca-space-4); align-items: flex-start; }

.home-hero__h1 {
  max-width: 18ch;
  margin: 0;
}

.home-hero__sub {
  max-width: 56ch;
  color: var(--rca-ink-secondary);
  font-size: var(--rca-fs-body-lg);
  margin: 0;
}

.home-hero__ctas {
  display: flex;
  flex-wrap: wrap;
  gap: var(--rca-space-3);
  margin-top: var(--rca-space-2);
}

.home-hero__meta {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--rca-space-4);
  color: var(--rca-ink-muted);
  letter-spacing: var(--rca-tracking-eyebrow);
  text-transform: uppercase;
}

.home-hero__meta li { margin: 0; }

.home-hero__stripe {
  display: block;
  margin-top: var(--rca-space-10);
}

/* Animación del signal stripe en la primera entrada (single shot). */
.home-hero__stripe--animated {
  width: 0 !important;
  animation: rca-hero-stripe-grow 1.2s var(--rca-ease-default) 0.4s forwards;
}

@keyframes rca-hero-stripe-grow {
  from { width: 0; }
  to   { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .home-hero__stripe--animated {
    width: 100% !important;
    animation: none;
  }
}

@media (min-width: 1024px) {
  .home-hero__grid {
    grid-template-columns: 1.05fr 1fr;
    gap: var(--rca-space-14);
  }
}

/* ==========================================================================
   HOME — 2. Trust strip
   ========================================================================== */

.home-trust__grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-8);
}

.home-trust__pillar {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  padding: var(--rca-space-6) 0;
  border-top: 1px solid var(--rca-border-subtle);
  position: relative;
}

.home-trust__pillar::before {
  content: '';
  position: absolute;
  top: -1px;
  left: 0;
  width: 56px;
  height: 2px;
  background-color: var(--rca-brand-secondary);
}

.home-trust__pillar-title {
  font-family: var(--rca-font-heading);
  font-weight: 700;
  font-size: var(--rca-fs-h4);
  margin: var(--rca-space-2) 0 0;
  color: var(--rca-ink-primary);
}

.home-trust__pillar-text {
  margin: 0;
  color: var(--rca-ink-secondary);
  max-width: 40ch;
}

@media (min-width: 768px) {
  .home-trust__grid {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--rca-space-10);
  }
}

/* ==========================================================================
   HOME — 3. Servicio héroe
   ========================================================================== */

.home-service-heroe__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-10);
  align-items: center;
}

.home-service-heroe__copy {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-4);
}

.home-service-heroe__cases {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  border-top: 1px solid var(--rca-border-subtle);
  padding-top: var(--rca-space-4);
}

.home-service-heroe__cases li {
  padding-left: var(--rca-space-4);
  position: relative;
  color: var(--rca-ink-secondary);
}

.home-service-heroe__cases li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.7em;
  width: 8px;
  height: 2px;
  background-color: var(--rca-brand-secondary);
}

.home-service-heroe__cases strong {
  color: var(--rca-ink-primary);
  font-weight: 600;
}

.home-service-heroe__ctas {
  margin-top: var(--rca-space-2);
}

@media (min-width: 1024px) {
  .home-service-heroe__grid {
    grid-template-columns: 1fr 1.05fr;
    gap: var(--rca-space-14);
  }
}

/* ==========================================================================
   HOME — 4. Servicios grid (6 cards)
   ========================================================================== */

.home-services__head {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  margin-bottom: var(--rca-space-10);
  max-width: 56ch;
}

.home-services__grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-4);
}

.home-services__card {
  background-color: var(--rca-bg-base);
  border: 1px solid var(--rca-border-subtle);
  border-radius: var(--rca-radius-md);
  transition: border-color var(--rca-dur-fast) var(--rca-ease-default),
              transform     var(--rca-dur-fast) var(--rca-ease-default);
}

.home-services__card:hover {
  border-color: var(--rca-brand-secondary);
  transform: translateY(-2px);
}

.home-services__card-link {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  padding: var(--rca-space-6);
  color: inherit;
  text-decoration: none;
  position: relative;
  min-height: 200px;
}

.home-services__card-link .rca-numeral {
  font-size: 2rem;
  margin-bottom: var(--rca-space-2);
}

.home-services__card-title {
  font-family: var(--rca-font-heading);
  font-weight: 700;
  font-size: var(--rca-fs-h4);
  margin: 0;
  color: var(--rca-ink-primary);
}

.home-services__card-desc {
  margin: 0;
  color: var(--rca-ink-secondary);
  font-size: var(--rca-fs-body-sm);
}

.home-services__card-arrow {
  align-self: flex-end;
  color: var(--rca-brand-secondary);
  font-size: 1.5rem;
  transition: transform var(--rca-dur-fast) var(--rca-ease-default);
}

.home-services__card:hover .home-services__card-arrow {
  transform: translateX(4px);
}

@media (min-width: 640px) {
  .home-services__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .home-services__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* ==========================================================================
   HOME — 5. Caso estrella
   ========================================================================== */

.home-case__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-10);
  align-items: start;
}

.home-case__copy {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-4);
}

.home-case__steps {
  list-style: none;
  margin: var(--rca-space-4) 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-5);
}

.home-case__steps li {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--rca-space-4);
  align-items: start;
  padding-block: var(--rca-space-4);
  border-top: 1px solid var(--rca-border-subtle);
}

.home-case__steps .rca-numeral {
  font-size: 2.25rem;
  line-height: 0.9;
}

.home-case__step-title {
  font-family: var(--rca-font-heading);
  font-weight: 600;
  font-size: var(--rca-fs-h4);
  margin: 0 0 var(--rca-space-1);
  color: var(--rca-ink-primary);
}

.home-case__step-text {
  margin: 0;
  color: var(--rca-ink-secondary);
}

.home-case__outcome {
  padding: var(--rca-space-4);
  background-color: var(--rca-bg-surface);
  border-left: 3px solid var(--rca-brand-primary);
  color: var(--rca-ink-primary);
  margin: var(--rca-space-2) 0 0;
}

@media (min-width: 1024px) {
  .home-case__grid {
    grid-template-columns: 0.9fr 1.1fr;
    gap: var(--rca-space-14);
  }
}

/* ==========================================================================
   HOME — 6. Marcas trabajadas
   ========================================================================== */

.home-brands__head {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  margin-bottom: var(--rca-space-8);
  max-width: 56ch;
}

.home-brands__slot { aspect-ratio: 16 / 9; }

.home-brands__list {
  list-style: none;
  margin: var(--rca-space-6) 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--rca-space-2) var(--rca-space-4);
  color: var(--rca-ink-muted);
  letter-spacing: var(--rca-tracking-eyebrow);
  text-transform: uppercase;
}

.home-brands__list li {
  position: relative;
  padding-right: var(--rca-space-4);
}

.home-brands__list li:not(:last-child)::after {
  content: '·';
  position: absolute;
  right: 0;
  color: var(--rca-border-default);
}

@media (min-width: 1024px) {
  .home-brands__slot { aspect-ratio: 21 / 6; }
}

/* ==========================================================================
   HOME — 7. Taller galería (mosaico)
   ========================================================================== */

.home-gallery__head {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  margin-bottom: var(--rca-space-10);
}

.home-gallery__mosaic {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-4);
}

.home-gallery__item { margin: 0; min-width: 0; }

.home-gallery__caption {
  margin-top: var(--rca-space-2);
  color: var(--rca-ink-muted);
  letter-spacing: var(--rca-tracking-eyebrow);
  text-transform: uppercase;
}

@media (min-width: 768px) {
  .home-gallery__mosaic {
    grid-template-columns: 2fr 1fr 1fr;
    grid-auto-rows: minmax(140px, auto);
    gap: var(--rca-space-3);
  }
  .home-gallery__item:nth-child(1) { grid-column: 1 / 2; grid-row: 1 / 3; }
  .home-gallery__item:nth-child(2) { grid-column: 2 / 3; grid-row: 1 / 2; }
  .home-gallery__item:nth-child(3) { grid-column: 3 / 4; grid-row: 1 / 2; }
  .home-gallery__item:nth-child(4) { grid-column: 2 / 3; grid-row: 2 / 3; }
  .home-gallery__item:nth-child(5) { grid-column: 3 / 4; grid-row: 2 / 3; }
  .home-gallery__item:nth-child(6) { grid-column: 1 / -1; grid-row: 3 / 4; }
}

/* ==========================================================================
   HOME — 8. Testimonios Google
   ========================================================================== */

.home-testimonials__head {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  margin-bottom: var(--rca-space-10);
}

.home-testimonials__badge {
  display: inline-flex;
  align-items: center;
  gap: var(--rca-space-2);
  color: var(--rca-ink-secondary);
  margin-top: var(--rca-space-2);
}

.home-testimonials__badge span[aria-hidden] {
  color: var(--rca-accent-warning);
  letter-spacing: 0.1em;
}

.home-testimonials__grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-5);
}

.home-testimonials__card {
  background-color: var(--rca-bg-elevated);
  border: 1px solid var(--rca-border-subtle);
  border-radius: var(--rca-radius-md);
  padding: var(--rca-space-5);
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-3);
}

.home-testimonials__head-card {
  display: grid;
  grid-template-columns: 44px 1fr auto;
  gap: var(--rca-space-3);
  align-items: center;
}

.home-testimonials__avatar {
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--rca-font-mono);
  font-weight: 500;
  font-size: var(--rca-fs-body-sm);
  background-color: var(--rca-brand-secondary);
  color: var(--rca-ink-on-brand);
  border-radius: var(--rca-radius-pill);
}

.home-testimonials__name {
  margin: 0;
  font-family: var(--rca-font-heading);
  font-weight: 600;
  font-size: var(--rca-fs-body);
  color: var(--rca-ink-primary);
}

.home-testimonials__date { margin: 0; }

.home-testimonials__stars {
  color: var(--rca-accent-warning);
  letter-spacing: 0.05em;
  font-size: var(--rca-fs-body-sm);
}

.home-testimonials__quote {
  margin: 0;
  color: var(--rca-ink-primary);
  border-left: 2px solid var(--rca-brand-secondary);
  padding-left: var(--rca-space-3);
  font-size: var(--rca-fs-body);
}

.home-testimonials__quote p { margin: 0; max-width: none; }

.home-testimonials__cta {
  margin: var(--rca-space-8) 0 0;
  text-align: center;
  color: var(--rca-ink-secondary);
  letter-spacing: var(--rca-tracking-eyebrow);
  text-transform: uppercase;
}

@media (min-width: 768px) {
  .home-testimonials__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1280px) {
  .home-testimonials__grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* ==========================================================================
   HOME — 9. Zona de servicio
   ========================================================================== */

.home-zone__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-10);
  align-items: center;
}

.home-zone__copy {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-4);
}

.home-zone__address {
  background-color: var(--rca-bg-surface);
  padding: var(--rca-space-4);
  border-left: 2px solid var(--rca-brand-secondary);
  font-style: normal;
  color: var(--rca-ink-primary);
  letter-spacing: 0;
}

.home-zone__parking {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  border-top: 1px solid var(--rca-border-subtle);
  padding-top: var(--rca-space-4);
  color: var(--rca-ink-secondary);
}

.home-zone__parking li {
  position: relative;
  padding-left: var(--rca-space-4);
}

.home-zone__parking li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.7em;
  width: 8px;
  height: 2px;
  background-color: var(--rca-brand-secondary);
}

.home-zone__parking strong {
  color: var(--rca-ink-primary);
  font-weight: 600;
}

.home-zone__ctas {
  display: flex;
  flex-wrap: wrap;
  gap: var(--rca-space-3);
}

@media (min-width: 1024px) {
  .home-zone__grid {
    grid-template-columns: 1fr 1.1fr;
    gap: var(--rca-space-14);
  }
}

/* ==========================================================================
   HOME — 10. Blog teaser
   ========================================================================== */

.home-blog__head {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  margin-bottom: var(--rca-space-10);
  position: relative;
}

.home-blog__head-link {
  align-self: flex-start;
  color: var(--rca-ink-secondary);
  text-decoration: none;
  border-bottom: 1px solid var(--rca-border-default);
  padding-bottom: 2px;
  letter-spacing: var(--rca-tracking-eyebrow);
  text-transform: uppercase;
  transition: color var(--rca-dur-fast) var(--rca-ease-default),
              border-color var(--rca-dur-fast) var(--rca-ease-default);
}

.home-blog__head-link:hover {
  color: var(--rca-brand-primary);
  border-bottom-color: var(--rca-brand-primary);
}

.home-blog__grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-5);
}

.home-blog__card {
  background-color: var(--rca-bg-elevated);
  border: 1px solid var(--rca-border-subtle);
  border-radius: var(--rca-radius-md);
  overflow: hidden;
  transition: border-color var(--rca-dur-fast) var(--rca-ease-default),
              transform     var(--rca-dur-fast) var(--rca-ease-default);
}

.home-blog__card:hover {
  border-color: var(--rca-brand-secondary);
  transform: translateY(-2px);
}

.home-blog__card-link {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  padding-bottom: var(--rca-space-5);
  color: inherit;
  text-decoration: none;
}

.home-blog__card-thumb {
  display: block;
  background-color: var(--rca-bg-subtle);
}

.home-blog__card-img {
  width: 100%;
  height: auto;
  display: block;
}

.home-blog__card-cat,
.home-blog__card-title,
.home-blog__card-meta {
  padding-inline: var(--rca-space-5);
}

.home-blog__card-cat {
  margin-top: var(--rca-space-4);
  color: var(--rca-brand-secondary);
  letter-spacing: var(--rca-tracking-eyebrow);
  text-transform: uppercase;
}

.home-blog__card-title {
  font-family: var(--rca-font-heading);
  font-weight: 700;
  font-size: var(--rca-fs-h4);
  margin: 0;
  color: var(--rca-ink-primary);
}

.home-blog__card-meta { margin: 0; }

@media (min-width: 768px) {
  .home-blog__grid { grid-template-columns: repeat(3, 1fr); }
}

/* ==========================================================================
   HOME — 11. CTA final
   ========================================================================== */

.home-cta-final__block {
  background-color: var(--rca-bg-subtle);
  border: 1px solid var(--rca-border-default);
  border-radius: var(--rca-radius-lg);
  padding: clamp(var(--rca-space-8), 6vw, var(--rca-space-18));
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-6);
}

.home-cta-final__stripe {
  position: absolute;
  top: var(--rca-space-6);
  left: var(--rca-space-6);
  width: 3px !important;
  height: 56px;
}

.home-cta-final__copy {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-3);
  max-width: 56ch;
  padding-top: var(--rca-space-8);
}

.home-cta-final__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--rca-space-3);
}

.home-cta-final__hours {
  list-style: none;
  margin: 0;
  padding: var(--rca-space-4) 0 0;
  border-top: 1px solid var(--rca-border-default);
  display: flex;
  flex-wrap: wrap;
  gap: var(--rca-space-4);
  color: var(--rca-ink-secondary);
  letter-spacing: var(--rca-tracking-eyebrow);
  text-transform: uppercase;
}

.home-cta-final__hours dd { margin: 0; }

@media (min-width: 1024px) {
  .home-cta-final__block {
    grid-template-columns: 1.2fr auto;
    grid-template-areas:
      "copy actions"
      "hours hours";
    align-items: center;
    gap: var(--rca-space-10) var(--rca-space-8);
  }
  .home-cta-final__copy    { grid-area: copy; }
  .home-cta-final__actions { grid-area: actions; }
  .home-cta-final__hours   { grid-area: hours; }
}

/* ==========================================================================
   SERVICIOS INDEX — 1. Hero
   ========================================================================== */

.servicios-hero { padding-block: clamp(var(--rca-space-14), 8vw, var(--rca-space-24)); }

.servicios-hero__h1 {
  max-width: 22ch;
  margin: var(--rca-space-3) 0 var(--rca-space-3);
}

.servicios-hero__sub {
  max-width: 56ch;
  color: var(--rca-ink-secondary);
  font-size: var(--rca-fs-body-lg);
  margin: 0 0 var(--rca-space-8);
}

.servicios-hero__toc {
  margin: 0;
}

.servicios-hero__toc ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--rca-space-3);
}

.servicios-hero__toc a {
  display: inline-block;
  padding: var(--rca-space-2) var(--rca-space-3);
  background-color: var(--rca-bg-surface);
  border: 1px solid var(--rca-border-subtle);
  border-radius: var(--rca-radius-pill);
  font-family: var(--rca-font-mono);
  font-size: var(--rca-fs-micro);
  text-transform: uppercase;
  letter-spacing: var(--rca-tracking-eyebrow);
  color: var(--rca-ink-secondary);
  text-decoration: none;
  transition: color var(--rca-dur-fast) var(--rca-ease-default),
              border-color var(--rca-dur-fast) var(--rca-ease-default);
}

.servicios-hero__toc a:hover {
  color: var(--rca-ink-primary);
  border-color: var(--rca-brand-secondary);
  text-decoration: none;
}

.servicios-hero__stripe {
  display: block;
  margin-top: var(--rca-space-10);
}

/* ==========================================================================
   SERVICIOS INDEX — 2. Héroe expandido
   ========================================================================== */

.servicios-heroe__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-10);
}

.servicios-heroe__copy {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-3);
}

.servicios-heroe__sub-h { margin-top: var(--rca-space-2); }

.servicios-heroe__chips {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--rca-space-2);
}

.servicios-heroe__cases {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  color: var(--rca-ink-secondary);
}

.servicios-heroe__cases li {
  position: relative;
  padding-left: var(--rca-space-4);
}

.servicios-heroe__cases li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.7em;
  width: 8px;
  height: 2px;
  background-color: var(--rca-brand-secondary);
}

.servicios-heroe__ctas {
  display: flex;
  flex-wrap: wrap;
  gap: var(--rca-space-3);
  margin-top: var(--rca-space-3);
}

@media (min-width: 1024px) {
  .servicios-heroe__grid {
    grid-template-columns: 1fr 1fr;
    gap: var(--rca-space-14);
    align-items: start;
  }
}

/* ==========================================================================
   SERVICIOS INDEX — 3. Grid resto (6 cards expandidas)
   ========================================================================== */

.servicios-grid__head {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  margin-bottom: var(--rca-space-10);
  max-width: 56ch;
}

.servicios-grid__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-4);
}

.servicios-grid__card {
  background-color: var(--rca-bg-elevated);
  border: 1px solid var(--rca-border-subtle);
  border-radius: var(--rca-radius-md);
  transition: border-color var(--rca-dur-fast) var(--rca-ease-default),
              transform var(--rca-dur-fast) var(--rca-ease-default);
}

.servicios-grid__card:hover {
  border-color: var(--rca-brand-secondary);
  transform: translateY(-2px);
}

.servicios-grid__card-link {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-3);
  padding: var(--rca-space-6);
  color: inherit;
  text-decoration: none;
  min-height: 280px;
  position: relative;
}

.servicios-grid__card-link .rca-numeral {
  font-size: 2rem;
  margin-bottom: var(--rca-space-2);
}

.servicios-grid__card-title {
  font-family: var(--rca-font-heading);
  font-weight: 700;
  font-size: var(--rca-fs-h4);
  margin: 0;
  color: var(--rca-ink-primary);
}

.servicios-grid__card-desc {
  margin: 0;
  color: var(--rca-ink-secondary);
  font-size: var(--rca-fs-body-sm);
}

.servicios-grid__card-when {
  margin-top: auto;
  padding-top: var(--rca-space-3);
  border-top: 1px solid var(--rca-border-subtle);
}

.servicios-grid__card-when p {
  margin: var(--rca-space-1) 0 0;
  color: var(--rca-ink-secondary);
  font-size: var(--rca-fs-body-sm);
}

.servicios-grid__card-arrow {
  position: absolute;
  top: var(--rca-space-6);
  right: var(--rca-space-6);
  color: var(--rca-brand-secondary);
  font-size: 1.5rem;
  transition: transform var(--rca-dur-fast) var(--rca-ease-default);
}

.servicios-grid__card:hover .servicios-grid__card-arrow {
  transform: translateX(4px);
}

@media (min-width: 768px) {
  .servicios-grid__list { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1280px) {
  .servicios-grid__list { grid-template-columns: repeat(3, 1fr); }
}

/* ==========================================================================
   SERVICIOS INDEX — 4. Marcas compatibles
   ========================================================================== */

.servicios-brands__head {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  margin-bottom: var(--rca-space-8);
  max-width: 56ch;
}

.servicios-brands__slot { aspect-ratio: 16 / 9; }

.servicios-brands__list {
  list-style: none;
  margin: var(--rca-space-6) 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--rca-space-2) var(--rca-space-4);
  color: var(--rca-ink-muted);
  letter-spacing: var(--rca-tracking-eyebrow);
  text-transform: uppercase;
}

@media (min-width: 1024px) {
  .servicios-brands__slot { aspect-ratio: 21 / 6; }
}

/* ==========================================================================
   SERVICIOS INDEX — 5. CTA presupuesto rápido
   ========================================================================== */

.servicios-cta__block {
  background-color: var(--rca-bg-subtle);
  border: 1px solid var(--rca-border-default);
  border-radius: var(--rca-radius-lg);
  padding: clamp(var(--rca-space-6), 5vw, var(--rca-space-14));
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-8);
}

.servicios-cta__copy {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-3);
  max-width: 56ch;
}

.servicios-cta__form {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-4);
}

.servicios-cta__field {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
}

.servicios-cta__field input,
.servicios-cta__field textarea {
  padding: var(--rca-space-3) var(--rca-space-3);
  border: 1px solid var(--rca-border-default);
  border-radius: var(--rca-radius-md);
  background-color: var(--rca-bg-elevated);
  font-family: var(--rca-font-body);
  font-size: var(--rca-fs-body);
  color: var(--rca-ink-primary);
  transition: border-color var(--rca-dur-fast) var(--rca-ease-default);
}

.servicios-cta__field input:focus,
.servicios-cta__field textarea:focus {
  outline: none;
  border-color: var(--rca-brand-secondary);
  box-shadow: var(--rca-focus-ring);
}

.servicios-cta__field textarea {
  resize: vertical;
  min-height: 96px;
}

.servicios-cta__row {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-4);
}

.servicios-cta__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--rca-space-3);
}

.servicios-cta__legal {
  margin: 0;
  letter-spacing: 0;
  text-transform: none;
  max-width: 56ch;
}

.servicios-cta__legal a {
  color: var(--rca-ink-secondary);
  border-bottom: 1px solid var(--rca-border-default);
  text-decoration: none;
}

.servicios-cta__legal a:hover {
  color: var(--rca-brand-primary);
  border-bottom-color: var(--rca-brand-primary);
}

@media (min-width: 640px) {
  .servicios-cta__row { grid-template-columns: 1fr 1fr; }
}

@media (min-width: 1024px) {
  .servicios-cta__block {
    grid-template-columns: 1fr 1.2fr;
    gap: var(--rca-space-14);
    align-items: start;
  }
}

/* ==========================================================================
   SERVICIO DETAIL — 1. Hero (breadcrumb + 2-col copy/media)
   ========================================================================== */

.servicio-detail-hero__breadcrumb {
  margin-bottom: var(--rca-space-6);
  color: var(--rca-ink-muted);
  letter-spacing: var(--rca-tracking-eyebrow);
  text-transform: uppercase;
}

.servicio-detail-hero__breadcrumb ol {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--rca-space-2);
  align-items: center;
}

.servicio-detail-hero__breadcrumb a {
  color: var(--rca-ink-muted);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  padding-bottom: 2px;
}

.servicio-detail-hero__breadcrumb a:hover {
  color: var(--rca-ink-primary);
  border-bottom-color: var(--rca-brand-secondary);
}

.servicio-detail-hero__breadcrumb [aria-current="page"] {
  color: var(--rca-ink-primary);
}

.servicio-detail-hero__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-10);
  align-items: center;
  margin-top: var(--rca-space-6);
}

.servicio-detail-hero__copy {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-4);
  align-items: flex-start;
}

.servicio-detail-hero__h1 { max-width: 22ch; }

.servicio-detail-hero__sub {
  max-width: 56ch;
  color: var(--rca-ink-secondary);
  font-size: var(--rca-fs-body-lg);
}

.servicio-detail-hero__ctas {
  display: flex;
  flex-wrap: wrap;
  gap: var(--rca-space-3);
}

@media (min-width: 1024px) {
  .servicio-detail-hero__grid {
    grid-template-columns: 1fr 1fr;
    gap: var(--rca-space-14);
  }
}

/* ==========================================================================
   SERVICIO DETAIL — 2. Cuándo lo necesitas
   ========================================================================== */

.servicio-detail-when__head {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  margin-bottom: var(--rca-space-8);
  max-width: 56ch;
}

.servicio-detail-when__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-3);
}

.servicio-detail-when__item {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--rca-space-3);
  padding: var(--rca-space-4);
  background-color: var(--rca-bg-elevated);
  border: 1px solid var(--rca-border-subtle);
  border-radius: var(--rca-radius-md);
  color: var(--rca-ink-primary);
}

.servicio-detail-when__mark {
  width: 12px;
  height: 12px;
  border: 2px solid var(--rca-brand-primary);
  border-radius: 2px;
  margin-top: 6px;
  flex-shrink: 0;
}

@media (min-width: 768px) {
  .servicio-detail-when__list { grid-template-columns: repeat(2, 1fr); }
}

/* ==========================================================================
   SERVICIO DETAIL — 3. Cómo lo hacemos (5 pasos)
   ========================================================================== */

.servicio-detail-how__head {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  margin-bottom: var(--rca-space-10);
  max-width: 56ch;
}

.servicio-detail-how__steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-3);
}

.servicio-detail-how__step {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--rca-space-4);
  align-items: start;
  padding-block: var(--rca-space-4);
  border-top: 1px solid var(--rca-border-subtle);
}

.servicio-detail-how__step:last-child {
  border-bottom: 1px solid var(--rca-border-subtle);
}

.servicio-detail-how__step .rca-numeral {
  font-size: 2rem;
  line-height: 0.9;
}

.servicio-detail-how__step-title {
  font-family: var(--rca-font-heading);
  font-weight: 600;
  font-size: var(--rca-fs-h4);
  margin: 0 0 var(--rca-space-1);
  color: var(--rca-ink-primary);
}

.servicio-detail-how__step-text { margin: 0; color: var(--rca-ink-secondary); }

/* ==========================================================================
   SERVICIO DETAIL — 4. Equipamiento (chips)
   ========================================================================== */

.servicio-detail-equipment__head {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  margin-bottom: var(--rca-space-6);
  max-width: 56ch;
}

.servicio-detail-equipment__chips {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--rca-space-2);
}

/* ==========================================================================
   SERVICIO DETAIL — 5. Marcas compatibles
   ========================================================================== */

.servicio-detail-brands__head {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  margin-bottom: var(--rca-space-6);
}

.servicio-detail-brands__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--rca-space-2) var(--rca-space-4);
  color: var(--rca-ink-muted);
  letter-spacing: var(--rca-tracking-eyebrow);
  text-transform: uppercase;
}

/* ==========================================================================
   SERVICIO DETAIL — 6. FAQs (accordion + schema)
   ========================================================================== */

.servicio-detail-faqs__head {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  margin-bottom: var(--rca-space-8);
  max-width: 56ch;
}

.servicio-detail-faqs__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
}

.servicio-detail-faqs__item {
  background-color: var(--rca-bg-elevated);
  border: 1px solid var(--rca-border-subtle);
  border-radius: var(--rca-radius-md);
  overflow: hidden;
}

.servicio-detail-faqs__item summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--rca-space-3);
  padding: var(--rca-space-4) var(--rca-space-5);
  cursor: pointer;
  list-style: none;
  user-select: none;
}

.servicio-detail-faqs__item summary::-webkit-details-marker { display: none; }
.servicio-detail-faqs__item summary::marker                  { content: ''; }

.servicio-detail-faqs__q {
  font-family: var(--rca-font-heading);
  font-weight: 600;
  font-size: var(--rca-fs-body-lg);
  margin: 0;
  color: var(--rca-ink-primary);
}

.servicio-detail-faqs__toggle {
  width: 12px;
  height: 12px;
  border-right: 2px solid var(--rca-brand-secondary);
  border-bottom: 2px solid var(--rca-brand-secondary);
  transform: rotate(45deg);
  transition: transform var(--rca-dur-default) var(--rca-ease-default);
  flex-shrink: 0;
}

.servicio-detail-faqs__item[open] .servicio-detail-faqs__toggle {
  transform: rotate(-135deg);
}

.servicio-detail-faqs__a {
  padding: 0 var(--rca-space-5) var(--rca-space-5);
  color: var(--rca-ink-secondary);
}

.servicio-detail-faqs__a p { margin: 0; }

/* ==========================================================================
   SERVICIO DETAIL — 7. CTA servicio
   ========================================================================== */

.servicio-detail-cta__block {
  background-color: var(--rca-bg-subtle);
  border: 1px solid var(--rca-border-default);
  border-radius: var(--rca-radius-lg);
  padding: clamp(var(--rca-space-8), 5vw, var(--rca-space-14));
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-6);
}

.servicio-detail-cta__stripe {
  position: absolute;
  top: var(--rca-space-6);
  left: var(--rca-space-6);
  width: 3px !important;
  height: 56px;
}

.servicio-detail-cta__copy {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-3);
  max-width: 56ch;
  padding-top: var(--rca-space-8);
}

.servicio-detail-cta__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--rca-space-3);
}

@media (min-width: 1024px) {
  .servicio-detail-cta__block {
    grid-template-columns: 1.2fr auto;
    align-items: center;
    gap: var(--rca-space-10) var(--rca-space-8);
  }
}

/* ==========================================================================
   SERVICIO DETAIL — 8. Servicios relacionados
   ========================================================================== */

.servicio-detail-related__head {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  margin-bottom: var(--rca-space-8);
  max-width: 56ch;
}

.servicio-detail-related__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-4);
}

.servicio-detail-related__card {
  background-color: var(--rca-bg-elevated);
  border: 1px solid var(--rca-border-subtle);
  border-radius: var(--rca-radius-md);
  transition: border-color var(--rca-dur-fast) var(--rca-ease-default),
              transform var(--rca-dur-fast) var(--rca-ease-default);
}

.servicio-detail-related__card:hover {
  border-color: var(--rca-brand-secondary);
  transform: translateY(-2px);
}

.servicio-detail-related__card-link {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  padding: var(--rca-space-5);
  color: inherit;
  text-decoration: none;
  position: relative;
  min-height: 200px;
}

.servicio-detail-related__card-title {
  font-family: var(--rca-font-heading);
  font-weight: 700;
  font-size: var(--rca-fs-h4);
  margin: 0;
  color: var(--rca-ink-primary);
}

.servicio-detail-related__card-desc {
  margin: 0;
  color: var(--rca-ink-secondary);
  font-size: var(--rca-fs-body-sm);
}

.servicio-detail-related__card-arrow {
  align-self: flex-end;
  color: var(--rca-brand-secondary);
  font-size: 1.5rem;
  transition: transform var(--rca-dur-fast) var(--rca-ease-default);
}

.servicio-detail-related__card:hover .servicio-detail-related__card-arrow {
  transform: translateX(4px);
}

@media (min-width: 768px) {
  .servicio-detail-related__list { grid-template-columns: repeat(3, 1fr); }
}

/* ==========================================================================
   EL TALLER — 1. Hero Roberto
   ========================================================================== */

.taller-hero__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-10);
  align-items: center;
}

.taller-hero__copy { display: flex; flex-direction: column; gap: var(--rca-space-4); }

.taller-hero__h1 { max-width: 22ch; }

.taller-hero__quote {
  margin: 0;
  padding: var(--rca-space-4) var(--rca-space-5);
  background-color: var(--rca-bg-surface);
  border-left: 3px solid var(--rca-brand-primary);
  border-radius: var(--rca-radius-md);
}

.taller-hero__quote p {
  margin: 0;
  font-family: var(--rca-font-heading);
  font-weight: 500;
  font-size: var(--rca-fs-body-lg);
  line-height: var(--rca-lh-relaxed);
  color: var(--rca-ink-primary);
}

.taller-hero__cite {
  display: block;
  margin-top: var(--rca-space-3);
  font-style: normal;
  color: var(--rca-ink-secondary);
  letter-spacing: var(--rca-tracking-eyebrow);
  text-transform: uppercase;
}

.taller-hero__stripe { display: block; margin-top: var(--rca-space-6); }

@media (min-width: 1024px) {
  .taller-hero__grid {
    grid-template-columns: 0.9fr 1.1fr;
    gap: var(--rca-space-14);
  }
}

/* ==========================================================================
   EL TALLER — 2. Historia
   ========================================================================== */

.taller-historia__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-8);
}

.taller-historia__head { max-width: 22ch; }

.taller-historia__body {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-4);
  max-width: 64ch;
}

@media (min-width: 1024px) {
  .taller-historia__grid {
    grid-template-columns: 0.8fr 1.2fr;
    gap: var(--rca-space-14);
    align-items: start;
  }
}

/* ==========================================================================
   EL TALLER — 3. Equipo
   ========================================================================== */

.taller-equipo__head {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  margin-bottom: var(--rca-space-10);
  max-width: 56ch;
}

.taller-equipo__grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-6);
}

.taller-equipo__card {
  background-color: var(--rca-bg-surface);
  border: 1px solid var(--rca-border-subtle);
  border-radius: var(--rca-radius-md);
  padding: var(--rca-space-4);
}

.taller-equipo__meta { padding: var(--rca-space-4) 0 0; }

.taller-equipo__name {
  font-family: var(--rca-font-heading);
  font-weight: 700;
  font-size: var(--rca-fs-h4);
  margin: 0;
  color: var(--rca-ink-primary);
}

.taller-equipo__role {
  margin: var(--rca-space-1) 0 0;
  color: var(--rca-ink-secondary);
  text-transform: uppercase;
  letter-spacing: var(--rca-tracking-eyebrow);
}

@media (min-width: 640px) {
  .taller-equipo__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1024px) {
  .taller-equipo__grid { grid-template-columns: repeat(3, 1fr); }
}

/* ==========================================================================
   EL TALLER — 4. Metodología
   ========================================================================== */

.taller-metodo__head {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  margin-bottom: var(--rca-space-10);
  max-width: 56ch;
}

.taller-metodo__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-6);
}

.taller-metodo__item {
  background-color: var(--rca-bg-elevated);
  border: 1px solid var(--rca-border-subtle);
  border-radius: var(--rca-radius-md);
  padding: var(--rca-space-6);
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
}

.taller-metodo__item .rca-numeral {
  font-size: 2.5rem;
  margin-bottom: var(--rca-space-2);
}

.taller-metodo__item-title {
  font-family: var(--rca-font-heading);
  font-weight: 700;
  font-size: var(--rca-fs-h4);
  margin: 0;
  color: var(--rca-ink-primary);
}

.taller-metodo__item-text {
  margin: 0;
  color: var(--rca-ink-secondary);
}

@media (min-width: 1024px) {
  .taller-metodo__list { grid-template-columns: repeat(3, 1fr); }
}

/* ==========================================================================
   EL TALLER — 5. Galería editorial
   ========================================================================== */

.taller-galeria__head {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  margin-bottom: var(--rca-space-10);
  max-width: 56ch;
}

.taller-galeria__mosaic {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-4);
}

.taller-galeria__item { margin: 0; min-width: 0; }

.taller-galeria__caption {
  margin-top: var(--rca-space-2);
  color: var(--rca-ink-muted);
  letter-spacing: var(--rca-tracking-eyebrow);
  text-transform: uppercase;
}

@media (min-width: 768px) {
  .taller-galeria__mosaic {
    grid-template-columns: 2fr 1fr 1fr;
    grid-auto-rows: minmax(180px, auto);
    gap: var(--rca-space-3);
  }
  .taller-galeria__item:nth-child(1) { grid-column: 1 / -1; }
  .taller-galeria__item:nth-child(2) { grid-column: 1 / 2; grid-row: 2 / 3; }
  .taller-galeria__item:nth-child(3) { grid-column: 2 / 4; grid-row: 2 / 3; }
  .taller-galeria__item:nth-child(4) { grid-column: 1 / 2; grid-row: 3 / 4; }
  .taller-galeria__item:nth-child(5) { grid-column: 2 / 3; grid-row: 3 / 4; }
  .taller-galeria__item:nth-child(6) { grid-column: 3 / 4; grid-row: 3 / 4; }
}

/* ==========================================================================
   EL TALLER — 6. Certificaciones
   ========================================================================== */

.taller-certs__head {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  margin-bottom: var(--rca-space-8);
  max-width: 56ch;
}

.taller-certs__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-3);
}

.taller-certs__item {
  background-color: var(--rca-bg-elevated);
  border: 1px solid var(--rca-border-subtle);
  border-radius: var(--rca-radius-md);
  padding: var(--rca-space-4);
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-1);
}

.taller-certs__name {
  font-family: var(--rca-font-heading);
  font-weight: 600;
  font-size: var(--rca-fs-body-lg);
  color: var(--rca-ink-primary);
}

.taller-certs__kind {
  color: var(--rca-ink-secondary);
  letter-spacing: var(--rca-tracking-eyebrow);
  text-transform: uppercase;
}

@media (min-width: 768px) {
  .taller-certs__list { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1024px) {
  .taller-certs__list { grid-template-columns: repeat(3, 1fr); }
}

/* ==========================================================================
   EL TALLER — 7. CTA visita
   ========================================================================== */

.taller-visit__block {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-10);
  align-items: center;
  background-color: var(--rca-bg-subtle);
  border: 1px solid var(--rca-border-default);
  border-radius: var(--rca-radius-lg);
  padding: clamp(var(--rca-space-8), 5vw, var(--rca-space-14));
}

.taller-visit__copy {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-3);
}

.taller-visit__address {
  background-color: var(--rca-bg-elevated);
  padding: var(--rca-space-4);
  border-left: 2px solid var(--rca-brand-secondary);
  font-style: normal;
  color: var(--rca-ink-primary);
  letter-spacing: 0;
}

.taller-visit__hours {
  list-style: none;
  margin: 0;
  padding: var(--rca-space-3) 0 0;
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-1);
  color: var(--rca-ink-secondary);
}

.taller-visit__hours dd { margin: 0; }

.taller-visit__ctas {
  display: flex;
  flex-wrap: wrap;
  gap: var(--rca-space-3);
  margin-top: var(--rca-space-2);
}

@media (min-width: 1024px) {
  .taller-visit__block { grid-template-columns: 1fr 1fr; }
}

/* ==========================================================================
   CONTACTO — 1. Hero con 3 canales
   ========================================================================== */

.contacto-hero__h1 {
  margin: var(--rca-space-3) 0 var(--rca-space-3);
  max-width: 16ch;
}

.contacto-hero__sub {
  max-width: 56ch;
  color: var(--rca-ink-secondary);
  font-size: var(--rca-fs-body-lg);
  margin: 0 0 var(--rca-space-8);
}

.contacto-hero__channels {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-4);
}

.contacto-hero__channel {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-1);
  padding: var(--rca-space-5);
  background-color: var(--rca-bg-elevated);
  border: 1px solid var(--rca-border-default);
  border-radius: var(--rca-radius-md);
  color: var(--rca-ink-primary);
  text-decoration: none;
  transition: border-color var(--rca-dur-fast) var(--rca-ease-default),
              transform var(--rca-dur-fast) var(--rca-ease-default);
}

.contacto-hero__channel:hover {
  border-color: var(--rca-brand-secondary);
  transform: translateY(-2px);
  text-decoration: none;
}

.contacto-hero__channel-value {
  font-family: var(--rca-font-display);
  font-weight: 700;
  font-size: 1.5rem;
  color: var(--rca-ink-primary);
}

.contacto-hero__channel-aside {
  color: var(--rca-ink-muted);
  letter-spacing: var(--rca-tracking-eyebrow);
  text-transform: uppercase;
}

.contacto-hero__cta {
  margin: var(--rca-space-8) 0 0;
  color: var(--rca-ink-muted);
  letter-spacing: var(--rca-tracking-eyebrow);
  text-transform: uppercase;
}

.contacto-hero__cta a {
  color: var(--rca-ink-primary);
  border-bottom: 1px solid var(--rca-border-default);
  padding-bottom: 2px;
  text-decoration: none;
}

@media (min-width: 768px) {
  .contacto-hero__channels { grid-template-columns: repeat(3, 1fr); }
}

/* ==========================================================================
   CONTACTO — 2. Form cita multistep
   ========================================================================== */

.contacto-form__head {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  margin-bottom: var(--rca-space-10);
  max-width: 56ch;
}

.contacto-form__form {
  background-color: var(--rca-bg-elevated);
  border: 1px solid var(--rca-border-default);
  border-radius: var(--rca-radius-lg);
  padding: clamp(var(--rca-space-6), 4vw, var(--rca-space-10));
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-6);
}

.contacto-form__hp {
  position: absolute;
  left: -9999px;
  top: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.contacto-form__progress {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--rca-space-2);
  border-bottom: 1px solid var(--rca-border-subtle);
  padding-bottom: var(--rca-space-4);
}

.contacto-form__progress-step {
  display: inline-flex;
  align-items: center;
  gap: var(--rca-space-2);
  padding: var(--rca-space-2) var(--rca-space-3);
  font-family: var(--rca-font-mono);
  font-size: var(--rca-fs-micro);
  letter-spacing: var(--rca-tracking-eyebrow);
  text-transform: uppercase;
  color: var(--rca-ink-muted);
  border-radius: var(--rca-radius-pill);
  border: 1px solid transparent;
}

.contacto-form__progress-step.is-active {
  color: var(--rca-ink-primary);
  background-color: var(--rca-bg-base);
  border-color: var(--rca-brand-secondary);
}

.contacto-form__progress-step span[aria-hidden] {
  color: var(--rca-brand-secondary);
  font-weight: 600;
}

.contacto-form__step {
  border: 0;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-4);
}

.contacto-form__form.is-js-stepped .contacto-form__step { display: none; }
.contacto-form__form.is-js-stepped .contacto-form__step.is-active { display: flex; }

.contacto-form__step legend {
  font-family: var(--rca-font-display);
  font-weight: 700;
  font-size: 1.5rem;
  color: var(--rca-ink-primary);
  padding: 0;
}

.contacto-form__field {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
}

.contacto-form__field input,
.contacto-form__field select,
.contacto-form__field textarea {
  padding: var(--rca-space-3);
  border: 1px solid var(--rca-border-default);
  border-radius: var(--rca-radius-md);
  background-color: var(--rca-bg-surface);
  font-family: var(--rca-font-body);
  font-size: var(--rca-fs-body);
  color: var(--rca-ink-primary);
  transition: border-color var(--rca-dur-fast) var(--rca-ease-default);
}

.contacto-form__field input:focus,
.contacto-form__field select:focus,
.contacto-form__field textarea:focus {
  outline: none;
  border-color: var(--rca-brand-secondary);
  box-shadow: var(--rca-focus-ring);
}

.contacto-form__field textarea {
  resize: vertical;
  min-height: 96px;
}

.contacto-form__field small {
  color: var(--rca-ink-muted);
}

.contacto-form__row {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-4);
}

.contacto-form__radio-group {
  border: 1px solid var(--rca-border-subtle);
  border-radius: var(--rca-radius-md);
  padding: var(--rca-space-4);
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
}

.contacto-form__radio-group legend {
  font-family: var(--rca-font-mono);
  font-size: var(--rca-fs-micro);
  font-weight: 500;
  letter-spacing: var(--rca-tracking-eyebrow);
  text-transform: uppercase;
  color: var(--rca-ink-secondary);
  padding: 0 var(--rca-space-2);
}

.contacto-form__radio-group label {
  display: inline-flex;
  align-items: center;
  gap: var(--rca-space-2);
  cursor: pointer;
  padding: var(--rca-space-2) 0;
}

.contacto-form__checkbox {
  display: flex;
  gap: var(--rca-space-3);
  align-items: flex-start;
  padding: var(--rca-space-3);
  background-color: var(--rca-bg-surface);
  border-radius: var(--rca-radius-md);
  border: 1px solid var(--rca-border-subtle);
  cursor: pointer;
}

.contacto-form__checkbox input {
  margin-top: 4px;
  flex-shrink: 0;
}

.contacto-form__checkbox span { font-size: var(--rca-fs-body-sm); }

.contacto-form__nav {
  display: flex;
  flex-wrap: wrap;
  gap: var(--rca-space-3);
  justify-content: flex-end;
  border-top: 1px solid var(--rca-border-subtle);
  padding-top: var(--rca-space-4);
}

.contacto-form__feedback {
  font-family: var(--rca-font-mono);
  font-size: var(--rca-fs-body-sm);
  padding: var(--rca-space-3) var(--rca-space-4);
  border-radius: var(--rca-radius-md);
  display: none;
}

.contacto-form__feedback.is-pending,
.contacto-form__feedback.is-success,
.contacto-form__feedback.is-error {
  display: block;
}

.contacto-form__feedback.is-pending {
  background-color: var(--rca-bg-subtle);
  color: var(--rca-ink-secondary);
}

.contacto-form__feedback.is-success {
  background-color: rgba(74, 124, 92, 0.12);
  color: #2D5A40;
  border-left: 3px solid var(--rca-accent-success);
}

.contacto-form__feedback.is-error {
  background-color: var(--rca-brand-primary-subtle);
  color: var(--rca-brand-primary-pressed);
  border-left: 3px solid var(--rca-brand-primary);
}

@media (min-width: 640px) {
  .contacto-form__row { grid-template-columns: repeat(2, 1fr); }
  .contacto-form__row:has(input[name="cita_year"]) { grid-template-columns: 1fr 1fr 0.6fr 0.8fr; }
}

/* ==========================================================================
   CONTACTO — 3. Qué pasa después
   ========================================================================== */

.contacto-after__head {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  margin-bottom: var(--rca-space-10);
  max-width: 56ch;
}

.contacto-after__steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-6);
}

.contacto-after__step {
  background-color: var(--rca-bg-elevated);
  border: 1px solid var(--rca-border-subtle);
  border-radius: var(--rca-radius-md);
  padding: var(--rca-space-6);
}

.contacto-after__step .rca-numeral { font-size: 2.5rem; }

.contacto-after__step-title {
  font-family: var(--rca-font-heading);
  font-weight: 700;
  font-size: var(--rca-fs-h4);
  margin: var(--rca-space-2) 0 var(--rca-space-1);
  color: var(--rca-ink-primary);
}

.contacto-after__step-text {
  margin: 0;
  color: var(--rca-ink-secondary);
}

@media (min-width: 1024px) {
  .contacto-after__steps { grid-template-columns: repeat(3, 1fr); }
}

/* ==========================================================================
   CONTACTO — 4. Info contacto (dl)
   ========================================================================== */

.contacto-info__head {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  margin-bottom: var(--rca-space-8);
}

.contacto-info__list {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-5);
  margin: 0;
}

.contacto-info__item {
  background-color: var(--rca-bg-elevated);
  border: 1px solid var(--rca-border-subtle);
  border-radius: var(--rca-radius-md);
  padding: var(--rca-space-4);
}

.contacto-info__item dt { margin-bottom: var(--rca-space-2); }
.contacto-info__item dd { margin: 0; color: var(--rca-ink-primary); }

.contacto-info__item address {
  font-style: normal;
  color: var(--rca-ink-primary);
  letter-spacing: 0;
}

@media (min-width: 640px) {
  .contacto-info__list { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1024px) {
  .contacto-info__list { grid-template-columns: repeat(3, 1fr); }
}

/* ==========================================================================
   CONTACTO — 5. FAQ accordion (reusa estilos del servicio-detail-faqs)
   ========================================================================== */

.contacto-faqs__head {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  margin-bottom: var(--rca-space-8);
}

.contacto-faqs__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
}

.contacto-faqs__item {
  background-color: var(--rca-bg-elevated);
  border: 1px solid var(--rca-border-subtle);
  border-radius: var(--rca-radius-md);
  overflow: hidden;
}

.contacto-faqs__item summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--rca-space-3);
  padding: var(--rca-space-4) var(--rca-space-5);
  cursor: pointer;
  list-style: none;
  user-select: none;
}

.contacto-faqs__item summary::-webkit-details-marker { display: none; }
.contacto-faqs__item summary::marker                  { content: ''; }

.contacto-faqs__q {
  font-family: var(--rca-font-heading);
  font-weight: 600;
  font-size: var(--rca-fs-body-lg);
  margin: 0;
  color: var(--rca-ink-primary);
}

.contacto-faqs__toggle {
  width: 12px;
  height: 12px;
  border-right: 2px solid var(--rca-brand-secondary);
  border-bottom: 2px solid var(--rca-brand-secondary);
  transform: rotate(45deg);
  transition: transform var(--rca-dur-default) var(--rca-ease-default);
  flex-shrink: 0;
}

.contacto-faqs__item[open] .contacto-faqs__toggle {
  transform: rotate(-135deg);
}

.contacto-faqs__a {
  padding: 0 var(--rca-space-5) var(--rca-space-5);
  color: var(--rca-ink-secondary);
}

.contacto-faqs__a p { margin: 0; }

/* ==========================================================================
   UBICACIÓN — 1. Hero
   ========================================================================== */

.ubicacion-hero__h1 {
  margin: var(--rca-space-3) 0 var(--rca-space-4);
  max-width: 20ch;
}

.ubicacion-hero__address {
  font-style: normal;
  font-family: var(--rca-font-display);
  font-weight: 700;
  font-size: clamp(1.25rem, 2vw + 0.5rem, 1.5rem);
  color: var(--rca-ink-primary);
  background-color: var(--rca-bg-surface);
  padding: var(--rca-space-4) var(--rca-space-5);
  border-left: 3px solid var(--rca-brand-primary);
  border-radius: var(--rca-radius-md);
  margin-bottom: var(--rca-space-4);
}

.ubicacion-hero__sub {
  max-width: 60ch;
  color: var(--rca-ink-secondary);
  font-size: var(--rca-fs-body-lg);
  margin: 0;
}

.ubicacion-hero__stripe { display: block; margin-top: var(--rca-space-8); }

/* ==========================================================================
   UBICACIÓN — 2. Mapa grande
   ========================================================================== */

.ubicacion-mapa__head {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  margin-bottom: var(--rca-space-6);
}

.ubicacion-mapa__frame { width: 100%; }

.ubicacion-mapa__cta {
  margin: var(--rca-space-4) 0 0;
  color: var(--rca-ink-secondary);
  letter-spacing: var(--rca-tracking-eyebrow);
  text-transform: uppercase;
}

.ubicacion-mapa__cta a {
  color: var(--rca-link-color);
  border-bottom: 1px solid var(--rca-border-default);
  padding-bottom: 2px;
  text-decoration: none;
}

.ubicacion-mapa__cta a:hover {
  color: var(--rca-link-color-hover);
  border-bottom-color: var(--rca-link-color-hover);
}

/* ==========================================================================
   UBICACIÓN — 3. Rutas (3 cards)
   ========================================================================== */

.ubicacion-rutas__head {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  margin-bottom: var(--rca-space-10);
  max-width: 56ch;
}

.ubicacion-rutas__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-5);
}

.ubicacion-rutas__card {
  background-color: var(--rca-bg-elevated);
  border: 1px solid var(--rca-border-subtle);
  border-radius: var(--rca-radius-md);
  padding: var(--rca-space-5);
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-3);
}

.ubicacion-rutas__card .rca-numeral { font-size: 2.25rem; margin-bottom: var(--rca-space-1); }

.ubicacion-rutas__card-title {
  font-family: var(--rca-font-heading);
  font-weight: 700;
  font-size: var(--rca-fs-h4);
  margin: 0;
  color: var(--rca-ink-primary);
}

.ubicacion-rutas__steps {
  list-style: decimal;
  padding-left: var(--rca-space-5);
  margin: 0;
  color: var(--rca-ink-secondary);
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
}

.ubicacion-rutas__time {
  color: var(--rca-ink-muted);
  letter-spacing: var(--rca-tracking-eyebrow);
  text-transform: uppercase;
  padding-top: var(--rca-space-3);
  border-top: 1px solid var(--rca-border-subtle);
  margin: 0;
}

.ubicacion-rutas__note {
  margin: var(--rca-space-8) 0 0;
}

@media (min-width: 1024px) {
  .ubicacion-rutas__list { grid-template-columns: repeat(3, 1fr); }
}

/* ==========================================================================
   UBICACIÓN — 4. Aparcamiento
   ========================================================================== */

.ubicacion-parking__head {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  margin-bottom: var(--rca-space-10);
  max-width: 56ch;
}

.ubicacion-parking__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-4);
}

.ubicacion-parking__item {
  background-color: var(--rca-bg-elevated);
  border: 1px solid var(--rca-border-subtle);
  border-radius: var(--rca-radius-md);
  padding: var(--rca-space-5);
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-3);
}

.ubicacion-parking__item--primary {
  border-color: var(--rca-brand-primary);
  border-width: 2px;
}

.ubicacion-parking__item-title {
  font-family: var(--rca-font-heading);
  font-weight: 700;
  font-size: var(--rca-fs-h4);
  margin: 0;
  color: var(--rca-ink-primary);
}

.ubicacion-parking__item p {
  margin: 0;
  color: var(--rca-ink-secondary);
}

.ubicacion-parking__item .rca-tech-badge {
  align-self: flex-start;
}

@media (min-width: 1024px) {
  .ubicacion-parking__list { grid-template-columns: repeat(3, 1fr); }
}

/* ==========================================================================
   UBICACIÓN — 5. Transporte público
   ========================================================================== */

.ubicacion-bus__head {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  margin-bottom: var(--rca-space-10);
  max-width: 56ch;
}

.ubicacion-bus__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-5);
}

.ubicacion-bus__item {
  background-color: var(--rca-bg-elevated);
  border: 1px solid var(--rca-border-subtle);
  border-radius: var(--rca-radius-md);
  padding: var(--rca-space-5);
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-3);
}

.ubicacion-bus__item-title {
  font-family: var(--rca-font-heading);
  font-weight: 700;
  font-size: var(--rca-fs-h4);
  margin: 0;
  color: var(--rca-ink-primary);
}

.ubicacion-bus__lines {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  font-family: var(--rca-font-mono);
}

.ubicacion-bus__lines strong {
  display: inline-block;
  background-color: var(--rca-brand-secondary);
  color: var(--rca-ink-on-brand);
  padding: 2px var(--rca-space-2);
  border-radius: var(--rca-radius-sm);
  margin-right: var(--rca-space-2);
  font-weight: 600;
  letter-spacing: var(--rca-tracking-eyebrow);
}

.ubicacion-bus__item p {
  margin: 0;
  color: var(--rca-ink-secondary);
}

@media (min-width: 1024px) {
  .ubicacion-bus__grid { grid-template-columns: repeat(3, 1fr); }
}

/* ==========================================================================
   UBICACIÓN — 6. Horario
   ========================================================================== */

.ubicacion-horario__head {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  margin-bottom: var(--rca-space-8);
}

.ubicacion-horario__list {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-4);
  margin: 0 0 var(--rca-space-6);
}

.ubicacion-horario__item {
  background-color: var(--rca-bg-surface);
  border: 1px solid var(--rca-border-subtle);
  border-radius: var(--rca-radius-md);
  padding: var(--rca-space-5);
}

.ubicacion-horario__item--muted { opacity: 0.7; }

.ubicacion-horario__time {
  font-family: var(--rca-font-display);
  font-weight: 700;
  font-size: 1.75rem;
  color: var(--rca-ink-primary);
  margin: var(--rca-space-2) 0;
}

.ubicacion-horario__item p { margin: 0; }

.ubicacion-horario__note {
  background-color: var(--rca-brand-primary-subtle);
  border-left: 3px solid var(--rca-brand-primary);
  padding: var(--rca-space-4) var(--rca-space-5);
  border-radius: var(--rca-radius-md);
}

.ubicacion-horario__note p {
  margin: 0;
  color: var(--rca-ink-primary);
}

@media (min-width: 768px) {
  .ubicacion-horario__list { grid-template-columns: repeat(3, 1fr); }
}

/* ==========================================================================
   UBICACIÓN — 7. CTA
   ========================================================================== */

.ubicacion-cta__block {
  background-color: var(--rca-bg-subtle);
  border: 1px solid var(--rca-border-default);
  border-radius: var(--rca-radius-lg);
  padding: clamp(var(--rca-space-8), 5vw, var(--rca-space-14));
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-6);
}

.ubicacion-cta__stripe {
  position: absolute;
  top: var(--rca-space-6);
  left: var(--rca-space-6);
  width: 3px !important;
  height: 56px;
}

.ubicacion-cta__copy {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-3);
  max-width: 56ch;
  padding-top: var(--rca-space-8);
}

.ubicacion-cta__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--rca-space-3);
}

@media (min-width: 1024px) {
  .ubicacion-cta__block {
    grid-template-columns: 1.2fr auto;
    align-items: center;
    gap: var(--rca-space-10) var(--rca-space-8);
  }
}

/* ==========================================================================
   BLOG INDEX — 1. Hero
   ========================================================================== */

.blog-hero__h1 {
  margin: var(--rca-space-3) 0 var(--rca-space-3);
  max-width: 18ch;
}

.blog-hero__sub {
  max-width: 56ch;
  color: var(--rca-ink-secondary);
  font-size: var(--rca-fs-body-lg);
  margin: 0;
}

.blog-hero__stripe { display: block; margin-top: var(--rca-space-8); }

/* ==========================================================================
   BLOG INDEX — 2. Categorías filtro (chips)
   ========================================================================== */

.blog-cats__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--rca-space-2);
}

.blog-cats__chip {
  display: inline-block;
  padding: var(--rca-space-2) var(--rca-space-3);
  background-color: var(--rca-bg-surface);
  border: 1px solid var(--rca-border-subtle);
  border-radius: var(--rca-radius-pill);
  font-family: var(--rca-font-mono);
  font-size: var(--rca-fs-micro);
  text-transform: uppercase;
  letter-spacing: var(--rca-tracking-eyebrow);
  color: var(--rca-ink-secondary);
  text-decoration: none;
  transition: color var(--rca-dur-fast) var(--rca-ease-default),
              border-color var(--rca-dur-fast) var(--rca-ease-default),
              background-color var(--rca-dur-fast) var(--rca-ease-default);
}

.blog-cats__chip:hover {
  color: var(--rca-ink-primary);
  border-color: var(--rca-brand-secondary);
  text-decoration: none;
}

.blog-cats__chip.is-active {
  color: var(--rca-ink-on-brand);
  background-color: var(--rca-brand-secondary);
  border-color: var(--rca-brand-secondary);
}

/* ==========================================================================
   BLOG INDEX — 3. Post destacado
   ========================================================================== */

.blog-featured__card {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-6);
  background-color: var(--rca-bg-elevated);
  border: 1px solid var(--rca-border-subtle);
  border-radius: var(--rca-radius-lg);
  overflow: hidden;
}

.blog-featured__media {
  background-color: var(--rca-bg-subtle);
}

.blog-featured__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.blog-featured__body {
  padding: var(--rca-space-6);
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-3);
  align-self: center;
}

.blog-featured__cat {
  color: var(--rca-brand-secondary);
  letter-spacing: var(--rca-tracking-eyebrow);
  text-transform: uppercase;
}

.blog-featured__title {
  font-family: var(--rca-font-display);
  font-weight: 800;
  font-size: clamp(1.625rem, 2.5vw + 1rem, 2rem);
  line-height: 1.15;
  margin: 0;
}

.blog-featured__title a {
  color: var(--rca-ink-primary);
  text-decoration: none;
}

.blog-featured__title a:hover {
  color: var(--rca-brand-primary);
}

.blog-featured__excerpt {
  color: var(--rca-ink-secondary);
}

.blog-featured__excerpt p { margin: 0; }

.blog-featured__meta { margin: 0; }

@media (min-width: 768px) {
  .blog-featured__card { grid-template-columns: 1.2fr 1fr; }
}

/* ==========================================================================
   BLOG INDEX — 4. Grid posts
   ========================================================================== */

.blog-grid__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-5);
}

.blog-grid__card {
  background-color: var(--rca-bg-elevated);
  border: 1px solid var(--rca-border-subtle);
  border-radius: var(--rca-radius-md);
  overflow: hidden;
  transition: border-color var(--rca-dur-fast) var(--rca-ease-default),
              transform var(--rca-dur-fast) var(--rca-ease-default);
}

.blog-grid__card:hover {
  border-color: var(--rca-brand-secondary);
  transform: translateY(-2px);
}

.blog-grid__card-link {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  padding-bottom: var(--rca-space-5);
  color: inherit;
  text-decoration: none;
}

.blog-grid__card-thumb { background-color: var(--rca-bg-subtle); }

.blog-grid__card-img {
  width: 100%;
  height: auto;
  display: block;
}

.blog-grid__card-cat,
.blog-grid__card-title,
.blog-grid__card-meta { padding-inline: var(--rca-space-5); }

.blog-grid__card-cat {
  margin-top: var(--rca-space-4);
  color: var(--rca-brand-secondary);
  letter-spacing: var(--rca-tracking-eyebrow);
  text-transform: uppercase;
}

.blog-grid__card-title {
  font-family: var(--rca-font-heading);
  font-weight: 700;
  font-size: var(--rca-fs-h4);
  margin: 0;
  color: var(--rca-ink-primary);
}

.blog-grid__card-meta { margin: 0; }

.blog-grid__empty {
  background-color: var(--rca-bg-surface);
  border: 1px dashed var(--rca-border-default);
  border-radius: var(--rca-radius-md);
  padding: clamp(var(--rca-space-8), 5vw, var(--rca-space-14));
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-3);
  align-items: flex-start;
}

@media (min-width: 768px) {
  .blog-grid__list { grid-template-columns: repeat(3, 1fr); }
}

/* ==========================================================================
   BLOG INDEX — 5. Paginación
   ========================================================================== */

.blog-pagination .nav-links {
  display: flex;
  flex-wrap: wrap;
  gap: var(--rca-space-2);
  justify-content: center;
}

.blog-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  padding: var(--rca-space-2) var(--rca-space-3);
  background-color: var(--rca-bg-surface);
  border: 1px solid var(--rca-border-subtle);
  border-radius: var(--rca-radius-md);
  font-family: var(--rca-font-mono);
  font-size: var(--rca-fs-body-sm);
  color: var(--rca-ink-secondary);
  text-decoration: none;
  transition: color var(--rca-dur-fast) var(--rca-ease-default),
              border-color var(--rca-dur-fast) var(--rca-ease-default),
              background-color var(--rca-dur-fast) var(--rca-ease-default);
}

.blog-pagination .page-numbers:hover {
  color: var(--rca-ink-primary);
  border-color: var(--rca-brand-secondary);
}

.blog-pagination .page-numbers.current {
  background-color: var(--rca-brand-secondary);
  border-color: var(--rca-brand-secondary);
  color: var(--rca-ink-on-brand);
}

.blog-pagination .page-numbers.dots {
  background: transparent;
  border-color: transparent;
}

/* ==========================================================================
   BLOG POST — 1. Hero
   ========================================================================== */

.blog-post-hero__breadcrumb {
  margin-bottom: var(--rca-space-6);
  color: var(--rca-ink-muted);
  letter-spacing: var(--rca-tracking-eyebrow);
  text-transform: uppercase;
}

.blog-post-hero__breadcrumb ol {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--rca-space-2);
  align-items: center;
}

.blog-post-hero__breadcrumb a {
  color: var(--rca-ink-muted);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  padding-bottom: 2px;
}

.blog-post-hero__breadcrumb a:hover {
  color: var(--rca-ink-primary);
  border-bottom-color: var(--rca-brand-secondary);
}

.blog-post-hero__cat {
  display: inline-block;
  color: var(--rca-brand-secondary);
  letter-spacing: var(--rca-tracking-eyebrow);
  text-transform: uppercase;
  margin-bottom: var(--rca-space-3);
}

.blog-post-hero__h1 {
  max-width: 22ch;
  margin: 0 0 var(--rca-space-4);
}

.blog-post-hero__meta {
  color: var(--rca-ink-muted);
  letter-spacing: var(--rca-tracking-eyebrow);
  text-transform: uppercase;
  margin: 0 0 var(--rca-space-8);
}

.blog-post-hero__media { width: 100%; }

.blog-post-hero__img {
  width: 100%;
  height: auto;
  display: block;
}

/* ==========================================================================
   BLOG POST — 2. TL;DR box
   ========================================================================== */

.blog-post-tldr__box {
  background-color: var(--rca-bg-surface);
  border-left: 3px solid var(--rca-brand-secondary);
  border-radius: var(--rca-radius-md);
  padding: var(--rca-space-5) var(--rca-space-6);
  max-width: 720px;
  margin: 0 auto;
}

.blog-post-tldr__title {
  margin: 0 0 var(--rca-space-2);
  color: var(--rca-brand-secondary);
  letter-spacing: var(--rca-tracking-eyebrow);
  text-transform: uppercase;
}

.blog-post-tldr__body p {
  margin: 0 0 var(--rca-space-2);
  color: var(--rca-ink-primary);
}

.blog-post-tldr__body p:last-child { margin-bottom: 0; }

/* ==========================================================================
   BLOG POST — 3+4. Contenido + TOC lateral
   ========================================================================== */

.blog-post-content__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-10);
}

.blog-post-content__toc { display: none; }

.blog-post-content__prose {
  max-width: 720px;
  margin: 0 auto;
  color: var(--rca-ink-primary);
  font-size: var(--rca-fs-body-lg);
  line-height: var(--rca-lh-relaxed);
}

.blog-post-content__prose > * + * { margin-top: var(--rca-space-4); }

.blog-post-content__prose h2 {
  font-family: var(--rca-font-display);
  font-weight: 800;
  font-size: 1.75rem;
  line-height: 1.2;
  margin-top: var(--rca-space-10) !important;
  margin-bottom: var(--rca-space-3);
  color: var(--rca-ink-primary);
  scroll-margin-top: var(--rca-space-18);
}

.blog-post-content__prose h3 {
  font-family: var(--rca-font-heading);
  font-weight: 700;
  font-size: 1.375rem;
  line-height: 1.25;
  margin-top: var(--rca-space-8) !important;
  margin-bottom: var(--rca-space-2);
  color: var(--rca-ink-primary);
  scroll-margin-top: var(--rca-space-18);
}

.blog-post-content__prose p,
.blog-post-content__prose ul,
.blog-post-content__prose ol,
.blog-post-content__prose blockquote {
  max-width: none;
}

.blog-post-content__prose ul,
.blog-post-content__prose ol {
  padding-left: var(--rca-space-6);
}

.blog-post-content__prose ul li,
.blog-post-content__prose ol li {
  margin-bottom: var(--rca-space-2);
}

.blog-post-content__prose blockquote {
  border-left: 3px solid var(--rca-brand-primary);
  padding: var(--rca-space-3) var(--rca-space-5);
  background-color: var(--rca-bg-surface);
  border-radius: 0 var(--rca-radius-md) var(--rca-radius-md) 0;
  font-style: italic;
  color: var(--rca-ink-primary);
}

.blog-post-content__prose blockquote p:last-child { margin-bottom: 0; }

.blog-post-content__prose code,
.blog-post-content__prose pre {
  font-family: var(--rca-font-mono);
  font-size: 0.875rem;
}

.blog-post-content__prose code {
  background-color: var(--rca-bg-subtle);
  padding: 2px var(--rca-space-2);
  border-radius: var(--rca-radius-sm);
  color: var(--rca-brand-primary);
}

.blog-post-content__prose pre {
  background-color: var(--rca-bg-inverse);
  color: var(--rca-ink-inverse);
  padding: var(--rca-space-4);
  border-radius: var(--rca-radius-md);
  overflow-x: auto;
  border-left: 3px solid var(--rca-brand-secondary);
}

.blog-post-content__prose pre code {
  background: transparent;
  color: inherit;
  padding: 0;
}

.blog-post-content__prose a {
  color: var(--rca-link-color);
  text-decoration: underline;
  text-decoration-color: var(--rca-border-default);
}

.blog-post-content__prose a:hover {
  color: var(--rca-link-color-hover);
  text-decoration-color: var(--rca-link-color-hover);
}

.blog-post-content__prose img {
  border-radius: var(--rca-radius-md);
  margin: var(--rca-space-6) 0;
}

.blog-post-content__prose figure { margin: var(--rca-space-6) 0; }
.blog-post-content__prose figcaption {
  font-family: var(--rca-font-mono);
  font-size: var(--rca-fs-micro);
  color: var(--rca-ink-muted);
  margin-top: var(--rca-space-2);
  text-align: center;
}

.blog-post-content__toc-sticky {
  position: sticky;
  top: calc(var(--rca-nav-height-mobile) + var(--rca-space-4));
  padding: var(--rca-space-4) var(--rca-space-5);
  background-color: var(--rca-bg-surface);
  border: 1px solid var(--rca-border-subtle);
  border-radius: var(--rca-radius-md);
}

.blog-post-content__toc-list {
  list-style: none;
  padding: 0;
  margin: var(--rca-space-3) 0 0;
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
}

.blog-post-content__toc-item--lvl3 { padding-left: var(--rca-space-3); }

.blog-post-content__toc-item a {
  display: block;
  color: var(--rca-ink-secondary);
  text-decoration: none;
  font-size: var(--rca-fs-body-sm);
  padding-block: 2px;
  border-left: 2px solid transparent;
  padding-left: var(--rca-space-2);
  transition: color var(--rca-dur-fast) var(--rca-ease-default),
              border-color var(--rca-dur-fast) var(--rca-ease-default);
}

.blog-post-content__toc-item a:hover {
  color: var(--rca-ink-primary);
  border-left-color: var(--rca-brand-secondary);
}

@media (min-width: 1024px) {
  .blog-post-content__grid {
    grid-template-columns: 220px 1fr;
    gap: var(--rca-space-10);
    align-items: start;
  }

  .blog-post-content__toc {
    display: block;
  }

  .blog-post-content__toc-sticky {
    top: calc(var(--rca-nav-height-desktop) + var(--rca-space-4));
  }

  .blog-post-content__prose { margin: 0; }
}

/* ==========================================================================
   BLOG POST — 5. Autor box
   ========================================================================== */

.blog-post-author__box {
  display: grid;
  grid-template-columns: 96px 1fr;
  gap: var(--rca-space-5);
  align-items: start;
  max-width: 720px;
  margin: 0 auto;
  padding: var(--rca-space-5);
  background-color: var(--rca-bg-elevated);
  border: 1px solid var(--rca-border-subtle);
  border-radius: var(--rca-radius-md);
}

.blog-post-author__img {
  width: 96px;
  height: 96px;
  border-radius: var(--rca-radius-pill);
}

.blog-post-author__name {
  font-family: var(--rca-font-heading);
  font-weight: 700;
  font-size: var(--rca-fs-h4);
  margin: var(--rca-space-1) 0 var(--rca-space-2);
  color: var(--rca-ink-primary);
}

.blog-post-author__bio {
  margin: 0;
  color: var(--rca-ink-secondary);
}

/* ==========================================================================
   BLOG POST — 6. CTA servicio relacionado
   ========================================================================== */

.blog-post-cta__block {
  background-color: var(--rca-bg-subtle);
  border: 1px solid var(--rca-border-default);
  border-radius: var(--rca-radius-lg);
  padding: clamp(var(--rca-space-8), 5vw, var(--rca-space-14));
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-6);
}

.blog-post-cta__stripe {
  position: absolute;
  top: var(--rca-space-6);
  left: var(--rca-space-6);
  width: 3px !important;
  height: 56px;
}

.blog-post-cta__copy {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-3);
  max-width: 56ch;
  padding-top: var(--rca-space-8);
}

.blog-post-cta__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--rca-space-3);
}

@media (min-width: 1024px) {
  .blog-post-cta__block {
    grid-template-columns: 1.2fr auto;
    align-items: center;
    gap: var(--rca-space-10) var(--rca-space-8);
  }
}

/* ==========================================================================
   BLOG POST — 7. Posts relacionados
   ========================================================================== */

.blog-post-related__head {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  margin-bottom: var(--rca-space-8);
  max-width: 56ch;
}

.blog-post-related__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-5);
}

.blog-post-related__card {
  background-color: var(--rca-bg-elevated);
  border: 1px solid var(--rca-border-subtle);
  border-radius: var(--rca-radius-md);
  overflow: hidden;
  transition: border-color var(--rca-dur-fast) var(--rca-ease-default),
              transform var(--rca-dur-fast) var(--rca-ease-default);
}

.blog-post-related__card:hover {
  border-color: var(--rca-brand-secondary);
  transform: translateY(-2px);
}

.blog-post-related__card-link {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
  padding-bottom: var(--rca-space-5);
  color: inherit;
  text-decoration: none;
}

.blog-post-related__card-thumb { background-color: var(--rca-bg-subtle); }
.blog-post-related__card-img   { width: 100%; height: auto; display: block; }

.blog-post-related__card-cat,
.blog-post-related__card-title,
.blog-post-related__card-meta { padding-inline: var(--rca-space-5); }

.blog-post-related__card-cat {
  margin-top: var(--rca-space-4);
  color: var(--rca-brand-secondary);
  letter-spacing: var(--rca-tracking-eyebrow);
  text-transform: uppercase;
}

.blog-post-related__card-title {
  font-family: var(--rca-font-heading);
  font-weight: 700;
  font-size: var(--rca-fs-h4);
  margin: 0;
  color: var(--rca-ink-primary);
}

.blog-post-related__card-meta { margin: 0; }

@media (min-width: 768px) {
  .blog-post-related__list { grid-template-columns: repeat(3, 1fr); }
}

/* ==========================================================================
   FAQ — 1. Hero + buscador
   ========================================================================== */

.faq-hero__h1 {
  margin: var(--rca-space-3) 0 var(--rca-space-3);
  max-width: 20ch;
}

.faq-hero__sub {
  max-width: 60ch;
  color: var(--rca-ink-secondary);
  font-size: var(--rca-fs-body-lg);
  margin: 0 0 var(--rca-space-6);
}

.faq-hero__search input {
  width: 100%;
  max-width: 560px;
  padding: var(--rca-space-3) var(--rca-space-4);
  border: 2px solid var(--rca-border-default);
  border-radius: var(--rca-radius-md);
  background-color: var(--rca-bg-surface);
  font-family: var(--rca-font-body);
  font-size: var(--rca-fs-body-lg);
  color: var(--rca-ink-primary);
  transition: border-color var(--rca-dur-fast) var(--rca-ease-default);
}

.faq-hero__search input:focus {
  outline: none;
  border-color: var(--rca-brand-secondary);
  box-shadow: var(--rca-focus-ring);
}

/* ==========================================================================
   FAQ — 2+3. Categorías sidebar + lista accordion
   ========================================================================== */

.faq-main__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-10);
}

.faq-main__cats { display: none; }

.faq-main__cats-head { margin: 0 0 var(--rca-space-3); color: var(--rca-ink-muted); }

.faq-main__cats-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-1);
}

.faq-main__cats-link {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--rca-space-2) var(--rca-space-3);
  border-left: 2px solid transparent;
  color: var(--rca-ink-secondary);
  text-decoration: none;
  font-size: var(--rca-fs-body-sm);
  transition: color var(--rca-dur-fast) var(--rca-ease-default),
              border-color var(--rca-dur-fast) var(--rca-ease-default),
              background-color var(--rca-dur-fast) var(--rca-ease-default);
}

.faq-main__cats-link:hover {
  color: var(--rca-ink-primary);
  border-left-color: var(--rca-brand-secondary);
  background-color: var(--rca-bg-surface);
}

.faq-main__group {
  margin-bottom: var(--rca-space-10);
  scroll-margin-top: calc(var(--rca-nav-height-desktop) + var(--rca-space-4));
}

.faq-main__group-head {
  margin-bottom: var(--rca-space-4);
  padding-bottom: var(--rca-space-3);
  border-bottom: 1px solid var(--rca-border-default);
}

.faq-main__group-title {
  font-family: var(--rca-font-display);
  font-weight: 800;
  font-size: 1.5rem;
  margin: var(--rca-space-1) 0 0;
  color: var(--rca-ink-primary);
}

.faq-main__items {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-2);
}

.faq-main__item {
  background-color: var(--rca-bg-elevated);
  border: 1px solid var(--rca-border-subtle);
  border-radius: var(--rca-radius-md);
  overflow: hidden;
}

.faq-main__item summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--rca-space-3);
  padding: var(--rca-space-4) var(--rca-space-5);
  cursor: pointer;
  list-style: none;
  user-select: none;
}

.faq-main__item summary::-webkit-details-marker { display: none; }
.faq-main__item summary::marker                  { content: ''; }

.faq-main__q {
  font-family: var(--rca-font-heading);
  font-weight: 600;
  font-size: var(--rca-fs-body-lg);
  margin: 0;
  color: var(--rca-ink-primary);
}

.faq-main__toggle {
  width: 12px;
  height: 12px;
  border-right: 2px solid var(--rca-brand-secondary);
  border-bottom: 2px solid var(--rca-brand-secondary);
  transform: rotate(45deg);
  transition: transform var(--rca-dur-default) var(--rca-ease-default);
  flex-shrink: 0;
}

.faq-main__item[open] .faq-main__toggle { transform: rotate(-135deg); }

.faq-main__a {
  padding: 0 var(--rca-space-5) var(--rca-space-5);
  color: var(--rca-ink-secondary);
}

.faq-main__a p { margin: 0; }

.faq-main__no-results {
  background-color: var(--rca-bg-surface);
  border: 1px dashed var(--rca-border-default);
  border-radius: var(--rca-radius-md);
  padding: clamp(var(--rca-space-6), 4vw, var(--rca-space-10));
  margin-top: var(--rca-space-6);
}

@media (min-width: 1024px) {
  .faq-main__grid {
    grid-template-columns: 240px 1fr;
    gap: var(--rca-space-10);
    align-items: start;
  }

  .faq-main__cats {
    display: block;
    position: sticky;
    top: calc(var(--rca-nav-height-desktop) + var(--rca-space-4));
  }
}

/* ==========================================================================
   FAQ — 4. No encontraste
   ========================================================================== */

.faq-none__block {
  background-color: var(--rca-bg-elevated);
  border: 1px solid var(--rca-border-default);
  border-radius: var(--rca-radius-lg);
  padding: clamp(var(--rca-space-8), 5vw, var(--rca-space-14));
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--rca-space-6);
}

.faq-none__stripe {
  position: absolute;
  top: var(--rca-space-6);
  left: var(--rca-space-6);
  width: 3px !important;
  height: 56px;
}

.faq-none__copy {
  display: flex;
  flex-direction: column;
  gap: var(--rca-space-3);
  max-width: 56ch;
  padding-top: var(--rca-space-8);
}

.faq-none__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--rca-space-3);
}

@media (min-width: 1024px) {
  .faq-none__block {
    grid-template-columns: 1.2fr auto;
    align-items: center;
    gap: var(--rca-space-10) var(--rca-space-8);
  }
}
