/* ==========================================================================
   Cyber City · the Spanish home (/es/, es/home.php, inc/es.php; plan C12, 21 Oct 2026)
   On top of local-shop.css (the same parts as the local page): the departments' rows with their icons and a small
   "En inglés" tag for a page that is in English, and lease-to-own's dark panel with its three steps.
   Same rules as every sheet of the theme: tokens only, classes start with ecc- (or is-).
   ========================================================================== */

/* ---- a department (es/department.php): the line that says the products' own pages are in English ---- */
.ecc-es-note { margin: 0; padding: var(--ecc-s-1) var(--ecc-s-4); color: var(--ecc-ink-2); }

.ecc-es__depts .ecc-ls__links { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 761px) { .ecc-es__depts .ecc-ls__links { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1181px) { .ecc-es__depts .ecc-ls__links { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.ecc-es__dicon { flex: none; color: var(--ecc-ink); }
.ecc-es__en { display: block; margin-top: calc(var(--ecc-s-1) / 2); color: var(--ecc-ink-2); font-weight: var(--ecc-fw-text); }

/* ---- lease-to-own: say, steps, the fine print ---- */
.ecc-es__lease { display: grid; gap: var(--ecc-s-5); }
.ecc-es__leasesay { display: grid; gap: var(--ecc-s-3); }
.ecc-es__leasesay .ecc-lead { margin: 0; max-width: 34em; }
.ecc-es__steps { display: grid; gap: var(--ecc-s-3); margin: 0; padding: 0; list-style: none; }
.ecc-es__steps li { display: flex; align-items: baseline; gap: var(--ecc-s-3); font-weight: var(--ecc-fw-medium); }
.ecc-es__steps .ecc-dot { flex: none; color: var(--ecc-lime); }
.ecc-es__leasefine { display: grid; gap: var(--ecc-s-2); }
.ecc-es__leasefine p { margin: 0; }
@media (min-width: 1181px) {
  .ecc-es__lease { grid-template-columns: minmax(0, 5fr) minmax(0, 4fr) minmax(0, 3fr); align-items: start; }
}