/* Home page (Home B, Cúpulas y tejas). Tokens only; line colours come from data. */
.home-page main { max-width:none; padding:0; }
.home-page .home-band { padding-left:var(--page-edge); padding-right:var(--page-edge); }
.home-page .home-hero-panel { padding-left:var(--page-edge); padding-right:var(--s-7); }

/* Hero: azul cúpula panel with the search, photo of the domes beside it. */
.home-hero { display:grid; grid-template-columns:minmax(0,3fr) minmax(0,2fr); min-height:calc(100dvh - var(--header-h) - var(--s-9)); border-bottom:var(--zocalo-h) solid var(--zocalo-band); }
.home-hero-panel { display:flex; flex-direction:column; gap:var(--s-5); padding-top:var(--s-8); padding-bottom:var(--s-7); background:var(--celeste); color:var(--ink-inverse); }
.home-page .home-hero h1 { margin:0; max-width:11ch; color:var(--ink-inverse); font:800 var(--t-display)/var(--lh-display) var(--display); letter-spacing:var(--track-display); }
.home-lede { margin:0; max-width:44ch; font:400 var(--t-sub)/var(--lh-body) var(--sans); }
.home-search { display:flex; flex-direction:column; gap:var(--s-2); max-width:calc(var(--s-9) * 7); margin:0; }
.home-search label { font:700 var(--t-dense)/var(--lh-dense) var(--sans); }
.home-search-row { display:flex; }
.home-search input { flex:1; min-width:0; min-height:calc(var(--hit) + var(--s-4)); padding:0 var(--s-4); border:0; border-radius:var(--radius); background:var(--lime); color:var(--ink); font:400 var(--t-sub)/1 var(--sans); }
.home-search input::placeholder { color:var(--ink-3); opacity:1; }
.home-search .g-button.primary { min-height:calc(var(--hit) + var(--s-4)); padding:0 var(--s-6); font-size:var(--t-sub); border-radius:var(--radius); }
.home-hero :focus-visible { outline-color:var(--ink-inverse); }
.home-status { margin:0; font:700 var(--t-dense)/var(--lh-dense) var(--sans); }
.home-status:empty { display:none; }
.home-results:empty { display:none; }
.home-results { max-width:calc(var(--s-9) * 7); max-height:calc(var(--s-9) * 4); overflow:auto; background:var(--lime-raised); color:var(--ink); padding:var(--s-3) var(--s-4); }
.home-results h2 { margin:var(--s-2) 0 var(--s-1); font:700 var(--t-label)/var(--lh-dense) var(--sans); text-transform:uppercase; letter-spacing:var(--track-label); color:var(--ochre); }
.home-results ul { list-style:none; margin:0; padding:0; }
.home-results a { display:flex; flex-direction:column; min-height:var(--hit); justify-content:center; padding:var(--s-2) 0; border-bottom:1px solid var(--rule); color:var(--ink); text-decoration:none; }
.home-results a strong { font:700 var(--t-body)/var(--lh-dense) var(--sans); }
.home-results a span { font:400 var(--t-dense)/var(--lh-dense) var(--sans); color:var(--ink-2); }
.home-results a:hover strong { text-decoration:underline; }
.home-bus-links { display:flex; flex-wrap:wrap; gap:0 var(--s-5); margin-top:auto; padding-top:var(--s-4); }
.home-bus-links a { display:inline-flex; align-items:center; min-height:var(--hit); color:var(--ink-inverse); font:700 var(--t-body)/1 var(--sans); text-underline-offset:6px; }
.home-bus-links a:hover { text-decoration-thickness:2px; }
.home-hero-photo { position:relative; margin:0; overflow:hidden; background:var(--stone-panel); }
.home-hero-photo img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 40%; display:block; }
.home-hero-photo figcaption { position:absolute; right:0; bottom:0; padding:var(--s-1) var(--s-2); background:var(--lime); color:var(--ink-2); font:400 var(--t-micro)/var(--lh-dense) var(--sans); }

/* Section heads shared by the bands. */
.home-band { padding-top:var(--s-8); padding-bottom:var(--s-8); }
.home-head { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:baseline; gap:var(--s-2) var(--s-5); margin-bottom:var(--s-5); }
.home-page .home-head h2 { margin:0; font:800 var(--t-title)/var(--lh-title) var(--display); letter-spacing:var(--track-display); }
.home-head a { display:inline-flex; align-items:center; min-height:var(--hit); color:var(--action); font:700 var(--t-body)/1 var(--sans); }

/* Line tiles: round, like the domes. The fill is the line's own colour. */
.home-line-tiles { list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:var(--s-3); }
.home-line { display:flex; align-items:center; justify-content:center; width:calc(var(--hit) + var(--s-4)); height:calc(var(--hit) + var(--s-4)); border-radius:50%; background:var(--line); color:var(--line-ink); font:900 var(--t-sub)/1 var(--sans); letter-spacing:-.02em; text-decoration:none; transition:transform var(--dur) var(--ease); }
.home-line:hover { transform:scale(1.08); }

/* Three doors. */
.home-doors { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); min-height:calc(var(--s-9) * 5); }
.home-door { position:relative; display:flex; flex-direction:column; justify-content:flex-end; gap:var(--s-4); overflow:hidden; padding:var(--s-6); color:var(--ink-inverse); text-decoration:none; }
.home-door-cajas { padding:0; background:var(--stone-panel); }
.home-door-cajas>img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; transition:transform var(--dur) var(--ease); }
.home-door-cajas .home-door-text { position:relative; max-width:calc(var(--s-9) * 4); padding:var(--s-5) var(--s-6) var(--s-6); background:var(--stone-panel); }
.home-door-parishes { background:var(--action); }
.home-door-games { background:var(--stone-panel); }
.home-door-art { flex:1; display:flex; align-items:center; justify-content:center; min-height:0; }
.home-door-art svg, .home-door-art img { display:block; width:100%; max-width:calc(var(--s-9) * 4); height:auto; max-height:calc(var(--s-9) * 3); }
.home-door-parishes .home-door-art { color:var(--ink-inverse); opacity:.85; }
.home-door-text { display:flex; flex-direction:column; gap:var(--s-2); }
.home-door-text strong { font:800 var(--t-title)/var(--lh-title) var(--display); letter-spacing:var(--track-display); }
.home-door-text span { font:400 var(--t-body)/var(--lh-dense) var(--sans); }
.home-door:hover .home-door-text strong { text-decoration:underline; text-decoration-thickness:3px; text-underline-offset:6px; }
.home-door:hover>img { transform:scale(1.03); }
.home-door:focus-visible { outline:3px solid var(--celeste); outline-offset:-6px; }

/* From the library, on a stone band. */
.home-library { background:var(--ochre-pale); }
.home-library .home-head a { color:var(--ink); }
.home-docs { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--s-6); }
.home-docs a { display:flex; flex-direction:column; gap:var(--s-3); color:var(--ink); text-decoration:none; }
.home-doc-thumb { display:block; aspect-ratio:4/5; padding:var(--s-2); background:var(--lime); overflow:hidden; }
.home-doc-thumb img { display:block; width:100%; height:100%; object-fit:cover; object-position:top; }
.home-doc-title { font:700 var(--t-body)/var(--lh-dense) var(--sans); }
.home-docs a:hover .home-doc-title { text-decoration:underline; }

@media (max-width:900px) {
 .home-hero { grid-template-columns:minmax(0,1fr); min-height:0; }
 .home-hero-photo { aspect-ratio:16/10; }
 .home-page .home-hero-panel { padding:var(--s-6) var(--gutter); }
 .home-doors { grid-template-columns:minmax(0,1fr); }
 .home-door { min-height:calc(var(--s-9) * 3); }
 .home-door-art svg, .home-door-art img { max-height:calc(var(--s-9) * 2); }
 .home-docs { grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s-5) var(--s-4); }
}
@media (max-width:600px) {
 .home-band { padding-top:var(--s-6); padding-bottom:var(--s-6); }
 .home-search .g-button.primary { padding:0 var(--s-4); }
 .home-line-tiles { gap:var(--s-2); }
 .home-line { width:calc(var(--hit) + var(--s-2)); height:calc(var(--hit) + var(--s-2)); font-size:var(--t-body); }
 .home-door { padding:var(--s-5); }
 .home-door-cajas .home-door-text { padding:var(--s-4) var(--s-5) var(--s-5); }
}
.home-page .home-results { margin:0; }
.home-results a span { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
@media (max-width:900px) { .home-hero-photo img { object-position:50% 25%; } }