/* =========================================================================
   YonkesCerca — Design system (§5 del brief)
   Concepto: "utilitario industrial honesto". Alto contraste, mobile-first.
   Paleta CERRADA (§5.1). Tipografía: Barlow Condensed (títulos) + Inter (cuerpo).
   ========================================================================= */

:root{
  --carbon:#23272E;      /* base oscura: header, footer, hero */
  --bg:#F7F8FA;          /* fondo general */
  --card:#FFFFFF;
  --amarillo:#FFC107;    /* acción/marca — SIEMPRE con texto negro */
  --azul:#2563EB;        /* confianza/enlaces */
  --texto:#1A1D21;       /* texto principal */
  --texto-2:#5A6169;     /* texto secundario */
  --verde:#16A34A;       /* abierto ahora */
  --rojo:#DC2626;        /* cerrado */
  --ambar:#F59E0B;       /* estrellas */
  --linea:#E4E7EC;
  --radio:8px;
  --sombra:0 1px 3px rgba(16,24,40,.08),0 1px 2px rgba(16,24,40,.06);
}

*{box-sizing:border-box}
html{lang:es}
body{
  margin:0;background:var(--bg);color:var(--texto);
  font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  font-size:17px;line-height:1.5;-webkit-font-smoothing:antialiased;
}
@media(max-width:600px){body{font-size:16px}}
a{color:var(--azul);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto}

h1,h2,h3,.font-title{
  font-family:"Barlow Condensed",Inter,system-ui,sans-serif;
  font-weight:700;line-height:1.12;letter-spacing:.2px;color:var(--texto);margin:0 0 .4em;
}
h1{font-size:2.1rem}h2{font-size:1.55rem}h3{font-size:1.2rem}

.contenedor{max-width:1080px;margin:0 auto;padding:0 18px}
.foco:focus-visible,a:focus-visible,button:focus-visible{outline:3px solid var(--azul);outline-offset:2px}

/* ---------- Header ---------- */
.yc-header{background:var(--carbon);color:#fff;position:sticky;top:0;z-index:40}
.yc-header .contenedor{display:flex;align-items:center;gap:16px;min-height:60px}
.yc-logo{font-family:"Barlow Condensed",sans-serif;font-weight:700;font-size:1.5rem;color:#fff;letter-spacing:.5px}
.yc-logo b{color:var(--amarillo)}
.yc-buscador{margin-left:auto;flex:1;max-width:420px}
.yc-buscador input{width:100%;padding:10px 14px;border-radius:var(--radio);border:0;font-size:1rem}

/* ---------- Botones ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:12px 18px;border-radius:var(--radio);font-weight:600;font-size:1rem;
  border:2px solid transparent;cursor:pointer;min-height:44px;line-height:1;transition:.15s}
.btn-amarillo{background:var(--amarillo);color:#111;border-color:var(--amarillo)}
.btn-amarillo:hover{filter:brightness(.95);text-decoration:none;color:#111}
.btn-azul{background:var(--azul);color:#fff}
.btn-azul:hover{filter:brightness(.95);text-decoration:none;color:#fff}
.btn-linea{background:#fff;color:var(--texto);border-color:var(--linea)}

/* ---------- Chips ---------- */
.chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;
  font-size:.82rem;font-weight:600;line-height:1}
.chip-abierto{background:rgba(22,163,74,.12);color:var(--verde)}
.chip-cerrado{background:rgba(220,38,38,.10);color:var(--rojo)}
.badge-destacado{background:var(--amarillo);color:#111;padding:3px 9px;border-radius:6px;
  font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.4px}

/* ---------- Estrellas ---------- */
.estrellas{color:var(--ambar);letter-spacing:1px;font-size:1rem}
.estrellas .num{color:var(--texto-2);font-family:Inter,sans-serif;font-size:.9rem;margin-left:6px}

/* ---------- Breadcrumbs ---------- */
.yc-breadcrumbs{font-size:.86rem;color:var(--texto-2);padding:14px 0 0}
.yc-breadcrumbs a{color:var(--texto-2)}

/* ---------- Ficha ---------- */
.yc-ficha{padding:8px 0 40px}
.yc-ficha h1{margin-top:.2em}
.yc-ficha__grid{display:grid;grid-template-columns:1.6fr 1fr;gap:28px;align-items:start}
@media(max-width:820px){.yc-ficha__grid{grid-template-columns:1fr}}
.yc-card{background:var(--card);border:1px solid var(--linea);border-radius:var(--radio);
  box-shadow:var(--sombra);padding:20px;margin-bottom:20px}
.yc-nap li{display:flex;gap:10px;padding:8px 0;border-bottom:1px solid var(--linea);list-style:none}
.yc-nap ul{margin:0;padding:0}
.yc-nap .ico{color:var(--azul);flex:0 0 22px;text-align:center}
.yc-horario{width:100%;border-collapse:collapse;font-size:.95rem}
.yc-horario th,.yc-horario td{text-align:left;padding:6px 4px;border-bottom:1px solid var(--linea)}
.yc-horario td:last-child{text-align:right;color:var(--texto-2)}

/* Reseñas */
.yonke-resenas{list-style:none;margin:0;padding:0}
.yonke-resena{border-bottom:1px solid var(--linea);padding:14px 0}
.yonke-resena__estrellas{color:var(--ambar)}
.yonke-resena__texto{margin:6px 0;font-style:italic;color:var(--texto)}
.yonke-resena__autor{color:var(--texto-2);font-size:.88rem;font-style:normal}

/* Mapa */
.yonke-mapa iframe{width:100%;border:0;border-radius:var(--radio);min-height:300px}

/* Botonera fija móvil (al alcance del pulgar) */
.yc-fija{position:fixed;left:0;right:0;bottom:0;z-index:50;display:none;gap:10px;
  padding:10px 14px;background:#fff;border-top:1px solid var(--linea)}
.yc-fija .btn{flex:1}
@media(max-width:820px){.yc-fija{display:flex}body{padding-bottom:72px}}

/* AdSense placeholder */
.yc-ad{background:#eef0f4;border:1px dashed #c7ccd6;border-radius:var(--radio);
  color:var(--texto-2);text-align:center;padding:22px;margin:20px 0;font-size:.85rem}

/* ---------- Imágenes destacadas (tamaño uniforme) ---------- */
.yc-foto{margin-bottom:20px;border-radius:var(--radio);overflow:hidden;box-shadow:var(--sombra);
  aspect-ratio:16/9;background:#e9ecf1}
.yc-foto img{width:100%;height:100%;object-fit:cover;display:block}
/* Placeholder cuando no hay imagen real (§5.3: nunca stock genérico) */
.yc-foto--vacia{display:flex;align-items:center;justify-content:center;color:#9aa0aa;font-size:2rem}

.yc-tarjeta__foto{aspect-ratio:16/10;border-radius:6px;overflow:hidden;background:#e9ecf1;margin:-16px -16px 4px}
.yc-tarjeta__foto img{width:100%;height:100%;object-fit:cover;display:block}
.yc-tarjeta__foto--vacia{display:flex;align-items:center;justify-content:center;color:#9aa0aa;font-size:1.6rem;aspect-ratio:16/10}

/* ---------- Tarjetas de listado (ciudad) ---------- */
.yc-inv{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.yc-tarjeta{background:var(--card);border:1px solid var(--linea);border-radius:var(--radio);
  box-shadow:var(--sombra);padding:16px;display:flex;flex-direction:column;gap:8px}
.yc-tarjeta h3{margin:0}
.yc-tarjeta__top{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.yc-tarjeta__acciones{display:flex;gap:8px;margin-top:auto;padding-top:8px}
.yc-tarjeta__acciones .btn{flex:1;padding:9px 12px;font-size:.92rem}

.yc-intro{font-size:1.05rem;color:var(--texto);max-width:70ch}
.yc-faq{margin:8px 0;border-bottom:1px solid var(--linea);padding-bottom:10px}
.yc-faq summary{font-weight:600;cursor:pointer;font-family:"Barlow Condensed",sans-serif;font-size:1.1rem}

/* ---------- Home / Hero ---------- */
.yc-hero{background:var(--carbon);color:#fff;padding:52px 0 44px}
.yc-hero h1{color:#fff;font-size:2.6rem;max-width:16ch}
@media(max-width:600px){.yc-hero h1{font-size:2rem}}
.yc-hero__sub{color:#c9ced6;font-size:1.15rem;max-width:60ch;margin:.4em 0 1.2em}
.yc-hero__buscador{display:flex;gap:10px;max-width:620px}
.yc-hero__buscador input{flex:1;padding:14px 16px;border:0;border-radius:var(--radio);font-size:1.05rem}
.yc-hero__buscador .btn{padding:14px 22px}
.yc-hero__meta{color:#9aa0aa;font-size:.9rem;margin-top:12px}

/* ---------- Footer ---------- */
.yc-footer{background:var(--carbon);color:#c9ced6;margin-top:40px;padding:28px 0;font-size:.9rem}
.yc-footer a{color:#fff}
