/* ============================================================================
   FullCarro Blog · blog.css — primitivas de layout, header, footer, botones
   ============================================================================ */

*, *::before, *::after { box-sizing: border-box; }

.fc-container {
  max-width: var(--ancho-contenedor);
  margin: 0 auto;
  padding: 0 var(--esp-5);
}

/* Oculto a la vista pero presente para lectores de pantalla y buscadores. */
.fc-sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ── Header ──────────────────────────────────────────────────────────── */
.fc-header {
  background: var(--navy);
  height: var(--alto-cabecera);
  display: flex;
  align-items: center;
}
.fc-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.fc-header__logo {
  font-family: var(--fuente-display);
  font-weight: 700;
  font-size: var(--texto-lg);
  color: var(--blanco);
  text-decoration: none;
}
.fc-header__logo span { color: var(--acento); }
.fc-header__logo em { font-style: normal; font-weight: 400; opacity: .75; }
.fc-header__nav {
  display: none;
  gap: var(--esp-5);
}
.fc-header__nav a {
  color: rgba(255,255,255,.85);
  text-decoration: none;
  font-size: var(--texto-sm);
  transition: color 160ms var(--ease-out-fuerte);
}
.fc-header__nav a:hover { color: var(--acento); }
@media (min-width: 768px) {
  .fc-header__nav { display: flex; }
}

/* ── Footer ──────────────────────────────────────────────────────────── */
.fc-footer {
  background: var(--navy);
  color: rgba(255,255,255,.72);
  border-top: 3px solid var(--acento);
  padding: var(--esp-10) 0 0;
  margin-top: var(--esp-12);
  font-size: var(--texto-sm);
}
.fc-footer a { color: rgba(255,255,255,.85); text-decoration: none; }
.fc-footer__top {
  display: grid;
  grid-template-columns: 1.5fr 1.6fr .9fr 1fr;
  gap: var(--esp-8);
}
.fc-footer__marca { min-width: 0; }
.fc-footer__logo { font-family: var(--fuente-display); font-weight: 700; font-size: var(--texto-xl); color: var(--blanco); }
.fc-footer__logo span { color: var(--acento); }
.fc-footer__logo em { font-style: normal; font-weight: 400; opacity: .7; }
.fc-footer__tag { line-height: 1.55; margin: var(--esp-3) 0 0; max-width: 34ch; color: rgba(255,255,255,.66); }
.fc-footer__titulo { font-family: var(--fuente-display); font-size: var(--texto-sm); letter-spacing: .05em; text-transform: uppercase; color: var(--blanco); margin: 0 0 var(--esp-4); }
.fc-footer__lista { list-style: none; margin: 0; padding: 0; }
.fc-footer__lista li { margin-bottom: var(--esp-2); }
.fc-footer__lista a { color: rgba(255,255,255,.66); }
.fc-footer__lista a:hover { color: var(--acento); }
.fc-footer__lista--columnas { columns: 2; column-gap: var(--esp-6); }
.fc-footer__ediciones a { display: flex; align-items: center; gap: var(--esp-2); }
.fc-footer__bandera { flex: none; width: 20px; height: 14px; border-radius: 2px; object-fit: cover; box-shadow: 0 0 0 1px rgba(0,0,0,.15); }
.fc-footer__cod { flex: none; font-size: var(--texto-xs); color: var(--blanco); background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.16); border-radius: var(--radio-sm); padding: 2px 6px; letter-spacing: .05em; }
.fc-footer__inner {
  display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--esp-3);
  margin-top: var(--esp-8); padding-top: var(--esp-5); padding-bottom: var(--esp-8);
  border-top: 1px solid rgba(255,255,255,.12);
}
.fc-footer__nav { display: flex; flex-wrap: wrap; gap: var(--esp-5); }
.fc-footer__nav a { color: rgba(255,255,255,.66); }
.fc-footer__nav a:hover { color: var(--acento); }
@media (max-width: 820px) {
  .fc-footer__top { grid-template-columns: 1fr 1fr; }
  .fc-footer__marca { grid-column: 1 / 3; }
  .fc-footer__inner { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 480px) {
  .fc-footer__top { grid-template-columns: 1fr; }
  .fc-footer__marca { grid-column: auto; }
}

/* ── Botones y enlaces con feedback instantáneo ─────────────────────── */
.fc-boton {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--esp-2);
  padding: var(--esp-3) var(--esp-5);
  border-radius: var(--radio);
  border: none;
  background: var(--acento);
  color: var(--blanco);
  font-family: var(--fuente-cuerpo);
  font-weight: 600;
  font-size: var(--texto-base);
  cursor: pointer;
  text-decoration: none;
  transition: transform 160ms var(--ease-out-fuerte), background 160ms ease;
}
.fc-boton:hover { background: var(--acento-oscuro); }
.fc-boton:active { transform: scale(0.97); }

.fc-boton--fantasma {
  background: transparent;
  border: 1px solid var(--linea);
  color: var(--tinta);
}
.fc-boton--fantasma:hover { background: var(--gris-suave); }

@media (prefers-reduced-motion: reduce) {
  .fc-boton { transition: background 160ms ease; }
  .fc-boton:active { transform: none; }
}

/* ── Tarjeta base (reutilizada por el grid de índice/categoría) ────────*/
.fc-card {
  background: var(--blanco);
  border-radius: var(--radio-md);
  box-shadow: var(--sombra);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
  transition: transform 160ms ease, box-shadow 160ms ease;
}
@media (hover: hover) and (pointer: fine) {
  .fc-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--sombra-md);
  }
}
.fc-card__imagen { width: 100%; aspect-ratio: 16/9; object-fit: cover; background: var(--gris-suave); }
.fc-card__cuerpo { padding: var(--esp-4); display: flex; flex-direction: column; gap: var(--esp-2); flex: 1; }
.fc-card__categoria {
  display: inline-block;
  background: var(--acento-suave);
  color: var(--acento-oscuro);
  border: 1px solid var(--acento-suave-borde);
  font-size: var(--texto-xs);
  font-weight: 600;
  padding: 2px var(--esp-2);
  border-radius: var(--radio-full);
  width: fit-content;
}
.fc-card__titulo { font-family: var(--fuente-display); font-size: var(--texto-md); color: var(--navy); margin: 0; }
.fc-card__meta { font-size: var(--texto-xs); color: var(--gris); }

.fc-chip {
  padding: var(--esp-2) var(--esp-4);
  border-radius: var(--radio-full);
  background: rgba(255,255,255,.1);
  color: var(--blanco);
  text-decoration: none;
  font-size: var(--texto-sm);
  transition: background 160ms ease;
}
.fc-chip:hover { background: rgba(255,255,255,.2); }

/* ── Grid de tarjetas (índice y categoría) ──────────────────────────── */
.fc-seccion { padding: var(--esp-10) var(--esp-5); }
.fc-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--esp-5);
  /* Sin esto, una tarjeta sin imagen destacada se estira a la altura de sus
     vecinas y queda un bloque blanco vacío debajo del texto. */
  align-items: start;
}
@media (min-width: 768px) { .fc-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .fc-grid { grid-template-columns: repeat(3, 1fr); } }

/* ── Hero inmersivo del artículo ─────────────────────────────────────── */
.fc-hero { position: relative; display: flex; align-items: flex-end; min-height: 380px; background: var(--navy); overflow: hidden; }
.fc-hero__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.fc-hero::before { content: ""; position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(0deg, rgba(15,31,61,.94) 6%, rgba(15,31,61,.55) 52%, rgba(15,31,61,.12) 100%); }
.fc-hero--sin-imagen { min-height: 240px; }
.fc-hero--sin-imagen::before { background: linear-gradient(0deg, rgba(0,0,0,.22), transparent 60%); }
.fc-hero__in { position: relative; z-index: 2; width: 100%; max-width: var(--ancho-contenedor);
  margin: 0 auto; padding: var(--esp-6) var(--esp-5); color: #fff; }
.fc-hero__crumbs { font-size: var(--texto-xs); color: rgba(255,255,255,.82); margin-bottom: var(--esp-3); }
.fc-hero__crumbs a { color: rgba(255,255,255,.82); }
.fc-hero__crumbs a:hover { color: #fff; }
.fc-hero__cat { display: inline-block; background: var(--acento); color: #3a1e00; font-weight: 700;
  font-size: 11px; letter-spacing: .1em; text-transform: uppercase; padding: 6px 12px; border-radius: 20px; margin-bottom: var(--esp-4); }
.fc-hero h1 { color: #fff; font-size: clamp(28px, 3.8vw, 44px); line-height: 1.12; margin: 0 0 var(--esp-4);
  max-width: 22ch; text-shadow: 0 2px 14px rgba(0,0,0,.35); }
.fc-hero__meta { display: flex; gap: var(--esp-4); flex-wrap: wrap; align-items: center; font-size: var(--texto-sm); color: rgba(255,255,255,.9); }
.fc-hero__meta a { color: #fff; font-weight: 600; }
@media (max-width: 640px) {
  .fc-hero { min-height: 300px; }
  .fc-hero h1 { font-size: clamp(23px, 6.5vw, 32px); }
}

/* ── Artículo ────────────────────────────────────────────────────────── */
.fc-articulo { max-width: 780px; margin-inline: auto; padding: var(--esp-8) var(--esp-5); }

/* Layout de artículo con barra lateral derecha */
/* Columna de contenido al ancho del texto legible (680) + barra, el par centrado:
   así no queda un hueco entre el texto y la barra. align-items: stretch (default)
   estira la columna del aside a la altura del artículo → la barra sticky tiene
   recorrido para quedarse fija al bajar. */
.fc-post-layout--con-barra { display: grid; grid-template-columns: minmax(0, 680px) 320px; gap: var(--esp-8); justify-content: center; }
.fc-post-layout--con-barra .fc-articulo { max-width: none; margin-inline: 0; padding-inline: 0; }
/* El espacio bajo el hero va en el aside (no en el sticky), para que la barra
   se pegue arriba sin dejar un hueco al bajar (el header del blog no es fijo). */
.fc-sidebar { padding-top: var(--esp-8); }
.fc-sidebar__sticky { position: sticky; top: var(--esp-4); display: flex; flex-direction: column; gap: var(--esp-5); padding-bottom: var(--esp-8); }
.fc-sidebar .fcad-slot { margin: 0; }
.fc-side-w { background: var(--blanco); border: 1px solid var(--gris-suave); border-radius: var(--radio-md); box-shadow: var(--sombra); padding: var(--esp-5); }
.fc-side-w__titulo { font-size: var(--texto-md); margin: 0 0 var(--esp-3); }
/* Últimas noticias: grilla de cuadritos (imagen + título pequeño), 2 por fila */
.fc-side-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--esp-3); }
.fc-side-tile { text-decoration: none; display: block; }
.fc-side-tile__img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; display: block;
  border-radius: var(--radio-sm); background: var(--gris-suave); }
.fc-side-tile__t { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  font-size: 11.5px; font-weight: 600; line-height: 1.25; color: var(--tinta); margin-top: var(--esp-2); }
.fc-side-tile:hover .fc-side-tile__t { color: var(--acento-oscuro); }
/* Explora FullCarro: tarjetas hacia nuestros negocios */
.fc-promos { display: flex; flex-direction: column; gap: var(--esp-3); }
.fc-promo { display: block; border-radius: var(--radio-md); padding: var(--esp-4); text-decoration: none; border: 1px solid transparent; transition: transform .12s ease; }
.fc-promo:hover { transform: translateY(-2px); }
.fc-promo__k { display: block; font-size: 10px; letter-spacing: .1em; text-transform: uppercase; font-weight: 700; }
.fc-promo__t { display: block; font-size: 15px; font-weight: 700; line-height: 1.2; margin: var(--esp-1) 0 2px; }
.fc-promo__p { display: block; font-size: 12.5px; line-height: 1.4; margin-bottom: var(--esp-3); }
.fc-promo__btn { display: inline-block; font-size: 12.5px; font-weight: 700; padding: 6px 12px; border-radius: var(--radio-sm); }
.fc-promo--mk { background: var(--navy); }
.fc-promo--mk .fc-promo__k { color: var(--acento); }
.fc-promo--mk .fc-promo__t { color: #fff; }
.fc-promo--mk .fc-promo__p { color: #c6d4e6; }
.fc-promo--mk .fc-promo__btn { background: var(--acento); color: #3a1e00; }
.fc-promo--sell { background: var(--acento-suave); border-color: var(--acento-suave-borde); }
.fc-promo--sell .fc-promo__k { color: var(--acento-oscuro); }
.fc-promo--sell .fc-promo__t { color: var(--navy); }
.fc-promo--sell .fc-promo__p { color: var(--tinta); }
.fc-promo--sell .fc-promo__btn { background: var(--acento); color: #3a1e00; }
.fc-promo--ev { background: var(--exito-bg); border-color: var(--exito-borde); }
.fc-promo--ev .fc-promo__k, .fc-promo--ev .fc-promo__t { color: var(--exito-texto); }
.fc-promo--ev .fc-promo__p { color: var(--tinta); }
.fc-promo--ev .fc-promo__btn { background: var(--verde-info); color: #fff; }
@media (max-width: 960px) {
  .fc-post-layout--con-barra { display: block; }
  .fc-post-layout--con-barra .fc-articulo { max-width: 780px; margin-inline: auto; padding-inline: 0; }
  .fc-sidebar { padding-top: 0; }
  .fc-sidebar__sticky { position: static; padding: 0 0 var(--esp-8); }
}
.fc-breadcrumbs { font-size: var(--texto-xs); color: var(--gris); margin-bottom: var(--esp-4); }
.fc-breadcrumbs a { color: var(--gris); }
.fc-articulo__cabecera { margin-bottom: var(--esp-5); }
.fc-articulo__meta { display: flex; gap: var(--esp-3); font-size: var(--texto-sm); color: var(--gris); }
.fc-articulo__imagen { width: 100%; border-radius: var(--radio-md); margin: var(--esp-5) 0; }
.fc-articulo__cuerpo { font-size: var(--texto-md); line-height: 1.75; max-width: 680px; }
.fc-articulo__cuerpo h2 { margin-top: var(--esp-8); }
.fc-articulo__cuerpo h3 { margin-top: var(--esp-6); }
/* Tablas del contenido (WordPress): que scrolleen dentro y no desborden en móvil. */
.fc-articulo__cuerpo table { display: block; width: 100%; max-width: 100%; overflow-x: auto; }
/* Imágenes del contenido (WordPress: <figure class="wp-block-image"><img>): el
   HTML viejo trae fotos a resolución completa (hasta 2000px) sin reset. Sin esto
   se dibujan a tamaño intrínseco y desbordan la columna de 680px, generando
   scroll horizontal en toda la página. Escalar al ancho manteniendo proporción. */
.fc-articulo__cuerpo img,
.fc-articulo__cuerpo figure { max-width: 100%; height: auto; }
.fc-articulo__cuerpo figure { margin: var(--esp-5) 0; }
.fc-articulo__cuerpo img { display: block; border-radius: var(--radio-md); }
.fc-articulo__cuerpo figcaption { margin-top: var(--esp-2); font-size: var(--texto-sm); color: var(--gris); text-align: center; }

/* ── Ficha DTC (elemento distintivo) ────────────────────────────────── */
.fc-dtc-ficha {
  display: flex;
  align-items: center;
  gap: var(--esp-5);
  background: var(--navy);
  color: var(--blanco);
  border-radius: var(--radio-md);
  padding: var(--esp-5);
  margin: var(--esp-5) 0;
}
.fc-dtc-ficha__codigo { font-size: 36px; color: var(--acento); }
.fc-dtc-ficha__nombre { margin: 0; font-size: var(--texto-base); }

/* ── Tabla de contenidos (acordeón móvil / lista desktop) ───────────── */
.fc-toc {
  background: var(--gris-suave);
  border-radius: var(--radio);
  padding: var(--esp-4);
  margin: var(--esp-5) 0;
}
.fc-toc summary { font-weight: 600; cursor: pointer; }
.fc-toc ul { margin: var(--esp-3) 0 0; padding-left: var(--esp-5); }
.fc-toc__nivel-3 { margin-left: var(--esp-4); font-size: var(--texto-sm); }
@media (min-width: 1024px) {
  .fc-toc { position: sticky; top: var(--esp-5); float: right; width: 240px; margin-left: var(--esp-8); }
}

/* ── Rating ──────────────────────────────────────────────────────────── */
.fc-rating { margin: var(--esp-8) 0; padding: var(--esp-5); background: var(--gris-suave); border-radius: var(--radio-md); text-align: center; }
.fc-rating__form { display: flex; justify-content: center; gap: var(--esp-1); }
.fc-rating__estrella {
  background: none; border: none; font-size: 28px; color: var(--linea); cursor: pointer;
  transition: transform 150ms ease-out, color 150ms ease;
}
.fc-rating__estrella:hover, .fc-rating__estrella:active { color: var(--acento); transform: scale(1.15); }
.fc-rating__resumen { display: block; margin-top: var(--esp-2); font-size: var(--texto-sm); color: var(--gris); }

/* ── Comentarios ─────────────────────────────────────────────────────── */
.fc-comentarios { margin: var(--esp-8) 0; }
.fc-comentario { padding: var(--esp-3) 0; border-bottom: 1px solid var(--linea); }
.fc-comentario__autor { font-weight: 600; margin: 0; }
.fc-comentario__texto { margin: var(--esp-1) 0 0; color: var(--tinta); }

/* ── Relacionados y compartir ────────────────────────────────────────── */
.fc-relacionados { margin: var(--esp-8) 0; }
.fc-compartir { margin: var(--esp-8) 0; }
.fc-compartir__titulo { font-weight: 700; color: var(--tinta); margin: 0 0 var(--esp-3); }
/* Compartir: íconos redondos de marca (arriba junto al byline y al pie) */
.fc-share { display: flex; gap: var(--esp-3); flex-wrap: wrap; margin: var(--esp-4) 0 0; }
.fc-share__btn { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; transition: transform .12s ease, filter .12s ease; }
.fc-share__btn:hover { transform: translateY(-2px); filter: brightness(1.08); }
.fc-share__btn:focus-visible { outline: 2px solid var(--acento); outline-offset: 2px; }
.fc-share__btn svg { width: 18px; height: 18px; fill: #fff; display: block; }
.fc-share__btn--fb { background: #1877f2; }
.fc-share__btn--x { background: #000; }
.fc-share__btn--in { background: #0a66c2; }
.fc-share__btn--wa { background: #25d366; }
.fc-share__btn--mail { background: #ea4335; }
@media (prefers-reduced-motion: reduce) { .fc-share__btn { transition: none; } }

@media (prefers-reduced-motion: reduce) {
  .fc-rating__estrella { transition: color 150ms ease; }
  .fc-rating__estrella:hover, .fc-rating__estrella:active { transform: none; }
}

/* ── Pico y Placa ────────────────────────────────────────────────────────── */
.fc-pyp-festivo { background: var(--exito-bg); color: var(--exito, #1a7f4b); font-weight: 600; padding: var(--esp-4); border-radius: var(--radio-md); margin: 0 0 var(--esp-5); }
.fc-pyp-verificado { color: var(--exito, #1a7f4b); font-size: var(--texto-sm); font-weight: 600; margin: 0 0 var(--esp-5); }
.fc-pyp-disclaimer { color: var(--gris); font-size: var(--texto-sm); line-height: 1.5; margin: var(--esp-5) 0 0; padding-top: var(--esp-4); border-top: 1px solid var(--gris-suave); }
.fc-pyp-grid { display: grid; grid-template-columns: 1fr; gap: var(--esp-4); }
@media (min-width: 768px) { .fc-pyp-grid { grid-template-columns: repeat(2, 1fr); } }
.fc-pyp-card { background: var(--blanco); border-radius: var(--radio-md); box-shadow: var(--sombra); padding: var(--esp-5); }
.fc-pyp-card--libre { background: var(--exito-bg); }
.fc-pyp-card__cabecera { display: flex; align-items: center; gap: var(--esp-2); margin-bottom: var(--esp-3); }
.fc-pyp-card__cabecera h3 { margin: 0; font-size: var(--texto-base); }
.fc-pyp-card__placas { display: flex; flex-wrap: wrap; gap: var(--esp-2); margin: var(--esp-2) 0; }
.fc-pyp-placa {
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: var(--radio-sm);
  background: var(--peligro-bg); color: var(--peligro-texto);
  font-size: var(--texto-lg);
}
.fc-pyp__libre { color: var(--exito-texto); font-weight: 600; }
.fc-pyp-card__nota { font-size: var(--texto-xs); color: var(--gris); margin-top: var(--esp-2); }

/* ── Página estática ─────────────────────────────────────────────────── */
.fc-pagina-estatica { max-width: 780px; padding: var(--esp-8) var(--esp-5); }

/* ── Paginación de categorías ────────────────────────────────────────── */
.fc-paginacion {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--esp-4);
  margin-top: var(--esp-10);
  flex-wrap: wrap;
}
.fc-paginacion__cuenta { font-size: var(--texto-sm); color: var(--gris); }


/* ── Otras ciudades de pico y placa (malla temática) ─────────────────── */
.fc-pyp-otras { margin-top: var(--esp-10); padding-top: var(--esp-6); border-top: 1px solid var(--linea); }
.fc-pyp-otras h2 { font-size: var(--texto-lg); margin-bottom: var(--esp-4); }
.fc-pyp-otras__lista {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-wrap: wrap; gap: var(--esp-2);
  font-size: var(--texto-sm);
}
.fc-pyp-otras__lista a {
  display: inline-block;
  padding: var(--esp-2) var(--esp-3);
  background: var(--gris-suave);
  border-radius: var(--radio-full);
  color: var(--tinta);
  text-decoration: none;
}
.fc-pyp-otras__lista a:hover { background: var(--acento-suave); color: var(--acento-oscuro); }

/* ── Páginas de cuenta (registro, login, restablecer) ────────────────── */
.fc-cuenta {
  max-width: 460px;
  padding: var(--esp-10) var(--esp-5);
}
.fc-cuenta__intro { color: var(--gris); font-size: var(--texto-base); }
.fc-cuenta__pie { margin-top: var(--esp-5); font-size: var(--texto-sm); }

.fc-form { display: flex; flex-direction: column; gap: var(--esp-2); margin-top: var(--esp-5); }
.fc-form label { font-size: var(--texto-sm); font-weight: 600; color: var(--navy); margin-top: var(--esp-3); }
.fc-form input {
  padding: var(--esp-3) var(--esp-4);
  border: 1px solid var(--linea);
  border-radius: var(--radio);
  font-family: var(--fuente-cuerpo);
  font-size: var(--texto-md);
}
.fc-form input:focus { outline: 2px solid var(--acento); outline-offset: 1px; }
.fc-form .fc-boton { margin-top: var(--esp-5); }

.fc-alerta {
  background: var(--aviso-bg);
  color: var(--aviso-texto);
  border-radius: var(--radio);
  padding: var(--esp-3) var(--esp-4);
  font-size: var(--texto-sm);
  margin: var(--esp-4) 0;
}

/* ── Formulario de comentario al pie del artículo ────────────────────── */
.fc-comentar { display: flex; flex-direction: column; gap: var(--esp-2); margin-top: var(--esp-6); }
.fc-comentar__quien { font-size: var(--texto-sm); color: var(--gris); margin: 0; }
.fc-comentar__label { font-size: var(--texto-sm); font-weight: 600; color: var(--navy); }
.fc-comentar textarea {
  width: 100%;
  padding: var(--esp-3) var(--esp-4);
  border: 1px solid var(--linea);
  border-radius: var(--radio);
  font-family: var(--fuente-cuerpo);
  font-size: var(--texto-md);
  resize: vertical;
}
.fc-comentar textarea:focus { outline: 2px solid var(--acento); outline-offset: 1px; }
.fc-comentar .fc-boton { align-self: flex-start; }

/* ── Estado de cuenta en el header (comentarista) ────────────────────── */
.fc-header__cuenta {
  display: flex;
  align-items: center;
  gap: var(--esp-3);
  font-size: var(--texto-sm);
}
.fc-header__cuenta-nombre { color: rgba(255,255,255,.85); }
.fc-header__cuenta-entrar {
  color: rgba(255,255,255,.85);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px;          /* área de toque un poco mayor que el ícono */
  line-height: 0;
}
.fc-header__cuenta-entrar:hover { color: var(--acento); }
.fc-header__logout { margin: 0; }
.fc-header__logout-boton {
  background: none;
  border: none;
  color: rgba(255,255,255,.85);
  font-family: var(--fuente-cuerpo);
  font-size: var(--texto-sm);
  cursor: pointer;
  padding: 0;
  text-decoration: underline;
}
.fc-header__logout-boton:hover { color: var(--acento); }

/* ── Placa de edición de país ────────────────────────────────────────── */
.fc-placa-caja { position: relative; }
.fc-placa-caja > summary { list-style: none; cursor: pointer; }
.fc-placa-caja > summary::-webkit-details-marker { display: none; }

.fc-placa {
  display: inline-flex;
  align-items: center;
  height: 26px;
  border: 1.5px solid rgba(255,255,255,.5);
  border-radius: var(--radio-sm);
  overflow: hidden;
}
.fc-placa__codigo {
  background: #1b3a6b;
  color: var(--blanco);
  font-size: var(--texto-xs);
  padding: 0 7px;
  height: 100%;
  display: flex;
  align-items: center;
}
.fc-placa__nombre { color: var(--blanco); font-size: var(--texto-sm); padding: 0 8px; }
.fc-placa__flecha { color: rgba(255,255,255,.6); padding-right: 7px; font-size: 10px; }
.fc-placa-caja[open] .fc-placa { border-color: var(--acento); }

.fc-ediciones {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  z-index: var(--z-cabecera);
  min-width: 240px;
  background: var(--blanco);
  border: 1px solid var(--linea);
  border-radius: var(--radio-md);
  box-shadow: var(--sombra-md);
  padding: var(--esp-3);
}
.fc-ediciones__titulo {
  font-size: var(--texto-xs);
  color: var(--gris);
  letter-spacing: .06em;
  margin: 0 0 var(--esp-2);
  text-transform: uppercase;
}
.fc-ediciones__opcion {
  display: flex;
  align-items: center;
  gap: var(--esp-2);
  padding: var(--esp-2);
  border-radius: var(--radio-sm);
  text-decoration: none;
}
.fc-ediciones__opcion:hover { background: var(--gris-suave); }
.fc-ediciones__opcion.is-actual { background: var(--acento-suave); }
.fc-ediciones__codigo {
  font-size: var(--texto-xs);
  background: var(--gris-suave);
  color: var(--tinta);
  padding: 2px 6px;
  border-radius: 3px;
}
.fc-ediciones__nombre { flex: 1; font-size: var(--texto-sm); color: var(--navy); }
.fc-ediciones__cuenta { font-size: var(--texto-xs); color: var(--gris); }

.fc-placa__bandera,
.fc-ediciones__bandera {
  flex: none;
  border-radius: 2px;
  object-fit: cover;               /* proporciones distintas por país: recorta, no deforma */
  box-shadow: 0 0 0 1px rgba(0, 0, 0, .10);
}
.fc-placa__bandera { width: 20px; height: 14px; margin-right: 4px; }  /* .fc-placa no tiene gap: separa la bandera del código */
.fc-ediciones__bandera { width: 22px; height: 15px; }

/* ── Ajuste de integración: varios hijos en .fc-header__inner ──────────
   El logo, la placa, la navegación y la cuenta comparten la barra. Sin
   este gap quedaban pegados entre sí sin aire en pantallas angostas. */
.fc-header__inner { gap: var(--esp-2); }
.fc-placa-caja { flex-shrink: 0; }

/* ── Franja de última hora (solo si hay algo de menos de 48 h) ───────── */
.fc-ahora { background: #16294d; border-top: 1px solid rgba(255,255,255,.08); }
.fc-ahora__inner { display: flex; align-items: center; gap: var(--esp-3); padding: 7px var(--esp-5); }
.fc-ahora__sello {
  background: var(--acento);
  color: #3d2a10;
  font-size: 10px;
  letter-spacing: .08em;
  padding: 2px 7px;
  border-radius: 3px;
  flex-shrink: 0;
}
.fc-ahora__titular {
  color: rgba(255,255,255,.82);
  font-size: var(--texto-xs);
  text-decoration: none;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.fc-ahora__titular:hover { color: var(--acento); }

/* ── Hero del home: mosaico + ticker ─────────────────────────────────── */
.fc-mosaico-hero { padding: var(--esp-5) 0 var(--esp-8); }

.fc-ticker { display: flex; align-items: stretch; background: var(--blanco); border: 1px solid var(--linea); border-radius: var(--radio-md); overflow: hidden; margin-bottom: var(--esp-4); }
.fc-ticker__hoy { background: var(--acento); color: var(--navy); font-family: var(--fuente-display); font-weight: 700; letter-spacing: .03em; text-transform: uppercase; display: flex; align-items: center; padding: 0 var(--esp-5); flex: none; }
.fc-ticker__track { display: flex; align-items: center; gap: var(--esp-6); padding: var(--esp-3) var(--esp-4); overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; flex: 1; min-width: 0; }
.fc-ticker__track::-webkit-scrollbar { display: none; }
.fc-ticker__item { display: flex; align-items: center; gap: var(--esp-3); text-decoration: none; color: var(--tinta); scroll-snap-align: start; flex: 0 0 auto; max-width: 340px; }
.fc-ticker__item img { width: 46px; height: 40px; border-radius: var(--radio-sm); object-fit: cover; flex: none; }
.fc-ticker__item span { font-size: var(--texto-sm); font-weight: 500; line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.fc-ticker__nav { display: flex; align-items: center; gap: var(--esp-2); padding: 0 var(--esp-4); flex: none; }
.fc-ticker__nav button { width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--linea); background: var(--blanco); color: var(--tinta); cursor: pointer; font-size: 1.1rem; line-height: 1; }
.fc-ticker__nav button:hover { border-color: var(--acento); color: var(--acento); }

.fc-mosaico { display: grid; grid-template-columns: 1fr 1fr 1.3fr; grid-template-rows: 238px 238px; gap: var(--esp-3); }
.fc-mtile { position: relative; min-width: 0; border-radius: var(--radio-lg); overflow: hidden; text-decoration: none; background: var(--navy); }
.fc-mtile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.fc-mtile__grad { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(9,16,30,.9) 4%, rgba(9,16,30,.35) 46%, rgba(9,16,30,.05) 100%); }
.fc-mtile__c { position: relative; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; padding: var(--esp-4); }
.fc-mtile__eb { font-size: var(--texto-xs); letter-spacing: .1em; text-transform: uppercase; color: var(--acento); margin-bottom: var(--esp-1); }
.fc-mtile__titulo { color: var(--blanco); font-family: var(--fuente-display); font-weight: 700; font-size: var(--texto-md); line-height: 1.2; overflow-wrap: anywhere; }
.fc-mtile--destacado { grid-column: 3; grid-row: 1 / 3; border-radius: var(--radio-lg); }
.fc-mtile--destacado .fc-mtile__c { padding: var(--esp-6); }
.fc-mtile__titulo--grande { font-size: var(--texto-2xl); line-height: 1.14; }
.fc-mtile__btn { align-self: flex-start; margin-top: var(--esp-4); background: var(--acento); color: var(--navy); font-weight: 700; font-size: var(--texto-sm); padding: 10px 18px; border-radius: var(--radio); }

@media (max-width: 860px) {
  .fc-mosaico { grid-template-columns: 1fr 1fr; grid-template-rows: 160px 160px auto; }
  .fc-mtile--destacado { grid-column: 1 / 3; grid-row: 3; min-height: 260px; }
  /* En 2 columnas angostas el título se recorta: bájalo y límítalo a 3 líneas. */
  .fc-mtile:not(.fc-mtile--destacado) .fc-mtile__titulo {
    font-size: var(--texto-sm);
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
  }
  .fc-mtile__titulo--grande { font-size: var(--texto-xl); }
  .fc-ticker__item { max-width: none; flex: 0 0 80%; }
}

/* ── Página de autor ─────────────────────────────────────────────────── */
.fc-autor__cabecera { margin-bottom: var(--esp-8); }
.fc-autor__rol {
  font-size: var(--texto-xs);
  color: var(--gris);
  letter-spacing: .08em;
  text-transform: uppercase;
  margin: 0 0 var(--esp-1);
}
.fc-autor__cuenta { color: var(--gris); font-size: var(--texto-sm); margin: var(--esp-2) 0 0; }

/* ── Firma del artículo (autoría verificable + fecha real) ───────────── */
.fc-articulo__meta { flex-wrap: wrap; }
.fc-articulo__autor { color: var(--acento-oscuro); text-decoration: none; font-weight: 600; }
.fc-articulo__autor:hover { text-decoration: underline; }
.fc-articulo__actualizado {
  background: var(--gris-suave);
  color: var(--tinta);
  font-size: var(--texto-xs);
  padding: 2px var(--esp-2);
  border-radius: var(--radio-full);
}

/* ── Cabecera de bloque por categoría (home) ─────────────────────────── */
.fc-bloque__cab { display: flex; align-items: baseline; justify-content: space-between; gap: var(--esp-4); margin-bottom: var(--esp-4); }
.fc-bloque__titulo { margin: 0; }
.fc-bloque__vertodo { color: var(--acento); font-weight: 600; font-size: var(--texto-sm); text-decoration: none; white-space: nowrap; flex: none; }
.fc-bloque__vertodo:hover { text-decoration: underline; }

/* ── Carrusel de artículos relacionados ──────────────────────────────── */
.fc-carrusel {
  display: flex;
  gap: var(--esp-4);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding-bottom: var(--esp-3);
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}
.fc-carrusel__item {
  flex: 0 0 220px;
  scroll-snap-align: start;
}
@media (max-width: 620px) {
  .fc-carrusel__item { flex-basis: 72%; }
}

/* ── Hero de la categoría de códigos DTC ─────────────────────────────── */
.fc-dtc-hero {
  background: var(--navy);
  padding: var(--esp-8) 0;
  margin-bottom: var(--esp-6);
}
.fc-dtc-hero .fc-titulo-hero { color: var(--blanco); margin: 0; }
.fc-dtc-hero__sub {
  color: rgba(255,255,255,.75);
  font-size: var(--texto-base);
  max-width: 640px;
  margin: var(--esp-3) 0 var(--esp-5);
}
.fc-dtc-hero__buscar { display: flex; gap: var(--esp-2); max-width: 560px; flex-wrap: wrap; align-items: flex-start; }
.fc-dtc-buscar { position: relative; flex: 1 1 280px; }
.fc-dtc-buscar input {
  width: 100%;
  padding: var(--esp-3) var(--esp-4);
  border: 1px solid var(--linea);
  border-radius: var(--radio-sm);
  font-size: var(--texto-md);
}
.fc-dtc-buscar input:focus { outline: 2px solid var(--acento); outline-offset: 1px; }
.fc-dtc-resultados {
  position: absolute; top: calc(100% + 4px); left: 0; right: 0;
  margin: 0; padding: var(--esp-1); list-style: none;
  background: var(--blanco); color: var(--tinta);
  border: 1px solid var(--linea); border-radius: var(--radio-sm);
  box-shadow: 0 10px 30px rgba(0, 0, 0, .25);
  max-height: 320px; overflow-y: auto; z-index: 30; text-align: left;
}
.fc-dtc-resultados__item {
  padding: var(--esp-2) var(--esp-3); border-radius: var(--radio-sm);
  font-size: var(--texto-sm); line-height: 1.3; cursor: pointer;
}
.fc-dtc-resultados__item.is-activo,
.fc-dtc-resultados__item:hover { background: var(--gris-suave); }
.fc-dtc-hero__aviso { color: var(--acento); font-size: var(--texto-sm); margin: var(--esp-3) 0 0; }

/* ── Buscador del header (lupa + dropdown) ───────────────────────────── */
.fc-buscar { position: relative; }
.fc-buscar__lupa { display: inline-flex; align-items: center; justify-content: center; padding: 6px; color: rgba(255,255,255,.85); cursor: pointer; list-style: none; }
.fc-buscar__lupa::-webkit-details-marker { display: none; }
.fc-buscar__lupa:hover { color: var(--acento); }
.fc-buscar[open] .fc-buscar__lupa { color: var(--acento); }
.fc-buscar__form {
  position: absolute; top: calc(100% + 8px); right: 0; z-index: 40;
  display: flex; gap: var(--esp-2);
  background: var(--blanco); border: 1px solid var(--linea);
  border-radius: var(--radio-md); padding: var(--esp-3);
  box-shadow: 0 10px 30px rgba(16,31,61,.25); width: min(88vw, 360px);
}
.fc-buscar__input { flex: 1; min-width: 0; padding: var(--esp-3); border: 1px solid var(--linea); border-radius: var(--radio-sm); font-size: var(--texto-md); }
.fc-buscar__input:focus { outline: 2px solid var(--acento); outline-offset: 1px; }

/* Página de resultados */
.fc-buscar-pagina { display: flex; gap: var(--esp-2); max-width: 560px; margin-bottom: var(--esp-6); }
.fc-buscar-pagina__input { flex: 1; min-width: 0; padding: var(--esp-3) var(--esp-4); border: 1px solid var(--linea); border-radius: var(--radio-sm); font-size: var(--texto-md); }
.fc-buscar-pagina__input:focus { outline: 2px solid var(--acento); outline-offset: 1px; }
.fc-buscar-pagina__cuenta { color: var(--gris); font-size: var(--texto-sm); margin: 0 0 var(--esp-5); }
.fc-buscar-pagina__vacio { color: var(--tinta); }

/* ── Directorio de ciudades en el hub de pico y placa ────────────────── */
.fc-pyp-dir { margin: var(--esp-8) 0; }
.fc-pyp-dir__titulo { margin: 0 0 var(--esp-4); }
.fc-pyp-dir__filtro {
  width: 100%; max-width: 360px; padding: var(--esp-3) var(--esp-4);
  border: 1px solid var(--linea); border-radius: var(--radio-sm);
  font-size: var(--texto-md); margin-bottom: var(--esp-5);
}
.fc-pyp-dir__filtro:focus { outline: 2px solid var(--acento); outline-offset: 1px; }
.fc-pyp-dir__lista {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: var(--esp-2);
}
.fc-pyp-dir__item a {
  display: block; padding: var(--esp-2) var(--esp-3);
  background: var(--gris-suave); border-radius: var(--radio-sm);
  color: var(--navy); text-decoration: none; font-size: var(--texto-sm);
}
.fc-pyp-dir__item a:hover { background: var(--acento-suave); color: var(--acento-oscuro); }
.fc-pyp-dir__item--principal a {
  background: var(--acento-suave); color: var(--acento-oscuro); font-weight: 700;
  box-shadow: inset 3px 0 0 var(--acento);
}
.fc-pyp-dir__vacio { color: var(--gris); }

/* ── Publicidad (ad-server FullCarro) ─────────────────────────────── */
.fcad-slot { margin: 30px 0; text-align: center; }
.fcad-slot__label { display: block; font-size: 10px; text-transform: uppercase;
  letter-spacing: .06em; color: #8a8f98; margin-bottom: 6px; }
.fcad-slot__box img { max-width: 100%; height: auto; border-radius: 10px; display: block; margin: 0 auto; }
.fcad-slot--preview .fcad-slot__box { min-height: 120px; display: flex; align-items: center;
  justify-content: center; color: #8a8f98; font-size: 13px; border: 1px dashed #d0d3d8; border-radius: 10px;
  background: repeating-linear-gradient(45deg,#f6f7f8,#f6f7f8 10px,#f0f1f3 10px,#f0f1f3 20px); }

/* Fuentes de información al final del artículo (editables desde la consola) */
.fc-articulo__fuentes { margin-top: 34px; padding-top: 20px; border-top: 1px solid #e5e8ee; }
.fc-articulo__fuentes h2 { font-size: 1.15rem; margin: 0 0 10px; color: #0f1f3d; }
.fc-articulo__fuentes ul { margin: 0; padding-left: 20px; }
.fc-articulo__fuentes li { margin: 5px 0; color: #374b5c; }
.fc-articulo__fuentes a { color: #0f1f3d; text-decoration: underline; word-break: break-word; }

/* Tarjeta compacta de vehículo del marketplace embebida en el artículo */
.fc-veh-card { display: flex; align-items: center; gap: 14px; margin: 18px 0; padding: 10px;
  border: 1px solid #e5e8ee; border-radius: 12px; text-decoration: none; color: inherit;
  transition: box-shadow .15s ease, border-color .15s ease; }
.fc-veh-card:hover { box-shadow: 0 4px 16px rgba(16,21,31,.10); border-color: #cfd6e2; }
.fc-veh-card__img { width: 108px; height: 78px; object-fit: cover; border-radius: 8px; flex: none; }
.fc-veh-card__info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.fc-veh-card__title { font-weight: 600; color: #0f1f3d; line-height: 1.3; }
.fc-veh-card__price { font-weight: 700; color: #ff9540; }
.fc-veh-card__cta { flex: none; white-space: nowrap; font-weight: 600; color: #0f1f3d; }
@media (max-width: 520px) { .fc-veh-card__cta { display: none; } .fc-veh-card__img { width: 84px; height: 62px; } }

/* Estilo ECOMMERCE (vertical, tipo Amazon) — misma estructura fc-veh-card,
   restyleada por la clase del artículo. Horizontal es el estilo por defecto. */
.fc-cards--ecommerce .fc-veh-card { flex-direction: column; align-items: stretch; gap: 0;
  max-width: 340px; padding: 0; overflow: hidden; }
.fc-cards--ecommerce .fc-veh-card__img { width: 100%; height: 180px; border-radius: 0; }
.fc-cards--ecommerce .fc-veh-card__info { padding: 12px 14px 0; gap: 4px; }
.fc-cards--ecommerce .fc-veh-card__price { font-size: 1.2rem; }
.fc-cards--ecommerce .fc-veh-card__cta { margin: 10px 14px 14px; padding: 9px 12px;
  text-align: center; background: #0f1f3d; color: #fff; border-radius: 8px; }
.fc-cards--ecommerce .fc-veh-card:hover .fc-veh-card__cta { background: #1a2f52; }
