/* ===== FCMX — Sistema de diseño global (First Cash México) ===== */
:root{
  --fc-green:#0a5c36;      /* verde principal casa de empeño */
  --fc-green-d:#063d24;    /* verde oscuro (secciones, hover) */
  --fc-green-light:#e8f5ee;/* verde muy claro (fondos suaves) */
  --fc-gold:#f2b705;       /* dorado (CTA destacado) */
  --fc-gold-d:#c79500;     /* dorado oscuro (borde inferior botón) */
  --fc-ink:#024028;        /* texto de títulos */
  --fc-text:#181818;       /* texto cuerpo */
  --fc-muted:#5b6e64;      /* texto secundario */
  --fc-line:#d7e8df;       /* bordes suaves */
}
*{box-sizing:border-box}
body{font-family:'Poppins',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:#F3F4F8;font-weight:300;color:var(--fc-text);margin:0;line-height:1.6}
.wrap{max-width:1000px;margin:0 auto;padding:0 16px}
a{color:#0a7a47}

.demobar{background:#fff8e6;border-bottom:1px solid #f0d488;padding:9px 16px;font-size:.85rem;text-align:center;color:#5c4a12}
.demobar a{color:#8a6d00;font-weight:700;margin:0 7px;text-decoration:none}

.site-header{background:var(--fc-green);box-shadow:0 1px 12px rgb(0 0 0 / 30%);border-bottom:2px solid rgba(255,255,255,.35);padding:14px 0}
.site-header .wrap{display:flex;align-items:center;gap:14px}
.site-logo{color:#fff;font-weight:800;font-size:1.3rem;text-decoration:none;letter-spacing:-.02em}
.site-logo b{color:var(--fc-gold)}

h1{font-size:2.1rem;font-weight:800;color:var(--fc-ink);margin:1.2rem 0 1rem;line-height:1.25;border-bottom:2px solid var(--fc-green);padding-bottom:.3rem}
h2{border-left:6px solid var(--fc-green);border-top-right-radius:60px;border-bottom-right-radius:10px;border-top-left-radius:10px;border-bottom-left-radius:10px;padding:14px 20px;background-color:var(--fc-green-light);color:var(--fc-ink);font-size:1.55rem;font-weight:bold;margin:2.2rem 0 1rem}
h3{font-size:1.3rem;font-weight:700;color:var(--fc-ink);margin:1.5em 0 .8em;line-height:1.4}
.bc{font-size:.8rem;color:var(--fc-muted);margin:14px 0}
.bc a{color:var(--fc-green);text-decoration:none}
p{font-size:1.05rem;line-height:1.7}

.boton-sucursal{display:inline-block;background-color:var(--fc-green);color:#fff !important;font-weight:700;font-size:1rem;padding:.75rem 1.5rem;border:none;border-radius:6px;cursor:pointer;text-align:center;text-decoration:none;border-bottom:4px solid var(--fc-green-d);transition:transform .15s linear,background-color .2s ease}
.boton-sucursal:hover{transform:scale(1.05);background-color:#0c6e41}
.boton-oro{background-color:var(--fc-gold);color:#3d2f00 !important;border-bottom-color:var(--fc-gold-d)}
.boton-oro:hover{background-color:#ffc620}

.ctas{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center;margin:1.5rem 0 2rem}
.btn-center{text-align:center;margin:1.25rem 0 1.75rem}

.columna-cuadrada{display:flex;flex-wrap:wrap;border:2px solid var(--fc-green);border-radius:8px;background:#fff;box-shadow:0 4px 12px rgba(0,0,0,.08);margin-bottom:1.6rem;overflow:hidden}
.columna-cuadrada .info,.columna-cuadrada .mapa{flex:1 1 320px;padding:1.4rem 1.6rem}
.localtit,.mapatit{font-size:1.25rem;color:var(--fc-green);margin:0 0 1rem;display:flex;align-items:center;gap:.5rem;font-weight:700}
.listaflecha{list-style:none;margin:18px 0;padding:0 5px;line-height:1.6;font-size:1rem}
.listaflecha li{position:relative;margin-bottom:.55rem;padding-left:22px}
.listaflecha li::before{content:"\25BA";position:absolute;left:0;top:.32em;color:var(--fc-green);font-size:.8em}
.listaflecha li strong{color:#37474F;font-weight:700}
.pill-h{display:inline-block;font-size:.72rem;font-weight:800;padding:2px 9px;border-radius:20px;text-transform:uppercase;letter-spacing:.03em;margin-left:6px;vertical-align:middle;background:#fff0d6;color:#8a6d00}
.columna-cuadrada .mapa iframe{width:100%;aspect-ratio:4/3;min-height:300px;border:0;border-radius:10px;box-shadow:0 4px 12px rgba(0,0,0,.08)}

.fila-tarjetas{display:flex;flex-wrap:wrap;gap:1.5rem;margin:1.6rem 0}
.tarjeta-info{flex:1 1 300px;min-width:0;background:#fff;border:2px solid var(--fc-green);border-radius:10px;padding:0 1.5rem 1.5rem;box-shadow:0 4px 12px rgba(0,0,0,.06);text-align:center}
.tarjeta-info h3{font-size:1.2rem;color:var(--fc-green);margin:1.2rem 0 .8rem;font-weight:700}
.tarjeta-info p{font-size:1rem;text-align:left}
.tarjeta-info strong{color:var(--fc-green)}

.servicios-sec{background:var(--fc-green-d);border-radius:14px;padding:2rem 1.5rem;margin:1.5rem 0}
.servicios-sec h2{background:none;border:0;border-radius:0;padding:0;color:#fff;text-align:center;font-size:1.7rem;margin:0 0 .4rem}
.servicios-sec .sub{color:#cfe8db;text-align:center;margin:0 0 1.6rem}
.services-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.service-card{background:#fff;border-radius:12px;padding:1.4rem 1.1rem;text-align:center;display:flex;flex-direction:column;align-items:center;box-shadow:0 4px 12px rgba(0,0,0,.12)}
.service-card h3{font-size:1.05rem;color:var(--fc-ink);margin:0 0 .5rem}
.service-card p{font-size:.88rem;color:var(--fc-muted);line-height:1.45;flex:1;margin:0 0 1rem}
.service-card .boton-sucursal{width:100%;font-size:.9rem;padding:.6rem .8rem}

.cpg-ciudad-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem;margin:1rem 0 1.25rem}
.cpg-ciudad-card{display:block;text-decoration:none;padding:.7rem .9rem;border-radius:8px;background:#fff;border:1px solid var(--fc-line);border-left:3px solid var(--fc-green);color:var(--fc-ink);font-size:.9rem;font-weight:700;line-height:1.3;transition:transform .15s,box-shadow .15s;box-shadow:0 1px 3px rgba(0,0,0,.05)}
.cpg-ciudad-card:hover{transform:translateY(-2px);box-shadow:0 5px 14px rgba(10,92,54,.12);border-left-color:var(--fc-gold)}
.cpg-ciudad-sub{display:block;font-size:.72rem;font-weight:400;color:#7a9a89;margin-top:.15rem}

.faq h3{font-size:1.15rem;color:var(--fc-ink);margin:1.3rem 0 .3rem}
.faq p{margin:0 0 1rem}

footer{background:#000;color:#fff;margin-top:3rem;padding:24px 0;font-size:.85rem;text-align:center}
footer a{color:#9ec9b5}

@media(max-width:900px){.services-grid{grid-template-columns:repeat(2,1fr)}.cpg-ciudad-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:680px){.columna-cuadrada{flex-direction:column}.cpg-ciudad-grid{grid-template-columns:repeat(2,1fr)}.ctas{flex-direction:column;align-items:stretch}.ctas .boton-sucursal{width:100%}}
@media(max-width:480px){.services-grid{grid-template-columns:1fr}h1{font-size:1.6rem}h2{font-size:1.3rem}}

