/*
Theme Name: Casas del Norte
Template: twentytwentyfive
Description: Agency look (colours, font, header, footer, home) on top of Twenty Twenty-Five. Property pages come from the Agency Core plugin.
Version: 0.3.0
Requires at least: 6.7
Requires PHP: 8.1
Author: Alexis
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: casasdelnorte
*/

/* Colours, font and sizes are in theme.json. Here: layout details that theme.json cannot express. */

:root {
	--cdn-radius: 12px;
	--cdn-shadow: 0 1px 2px rgba(16, 40, 34, .06), 0 6px 20px rgba(16, 40, 34, .08);
	--cdn-line: var(--wp--preset--color--accent-6, #d5dbdf);
}
:where(a:focus-visible, button:focus-visible) { outline: 3px solid var(--wp--preset--color--brand); outline-offset: 2px; }

/* no white gap between header, page and footer (TT5 adds the block gap there) */
.wp-site-blocks > main,
.wp-site-blocks > footer,
.wp-site-blocks > .wp-block-group { margin-block-start: 0; }

/* ---------- header: one line, sticky, hamburger below 1024px ---------- */
.wp-site-blocks > header.wp-block-template-part {
	position: sticky;
	top: 0;
	z-index: 90;
}
.admin-bar .wp-site-blocks > header.wp-block-template-part { top: 32px; }
@media (max-width: 782px) {
	.admin-bar .wp-site-blocks > header.wp-block-template-part { top: 0; position: relative; }
}
.cdn-header {
	border-bottom: 1px solid var(--cdn-line);
	box-shadow: 0 2px 12px rgba(16, 40, 34, .05);
}
.cdn-header__bar { gap: 1rem; }
.cdn-header .wp-block-site-logo { flex-shrink: 1; min-width: 120px; }
.cdn-header .wp-block-site-logo img { max-height: 46px; width: auto; height: auto; }
.cdn-header__right { flex-shrink: 0; }
.cdn-nav { flex-shrink: 0; }
.cdn-nav .wp-block-navigation-item__content { white-space: nowrap; padding: .5rem 0; }
.cdn-nav .wp-block-navigation-item__content:hover { color: var(--wp--preset--color--brand); }
.cdn-nav .current-menu-item > .wp-block-navigation-item__content { color: var(--wp--preset--color--brand); }

/* below 1200px the six links, the language and the phone do not fit next to the logo: show the menu button instead */
@media (max-width: 1199px) {
	.cdn-nav .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.cdn-nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
	.cdn-header .wp-block-site-logo img { max-height: 38px; }
}
.cdn-nav .wp-block-navigation__responsive-container-open {
	width: 44px;
	height: 44px;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--cdn-line);
	border-radius: 10px;
}
.cdn-nav .wp-block-navigation__responsive-container.is-menu-open {
	padding: 1.25rem 1.5rem;
	background: var(--wp--preset--color--base);
}
.cdn-nav .is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 3.5rem; }
.cdn-nav .is-menu-open .wp-block-navigation-item__content { font-size: 1.375rem; padding: .5rem 0; }

/* language switcher: small pill, no bullets */
.cdn-lang, .cdn-header ul:has(> .lang-item) { display: flex; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.cdn-header .lang-item a {
	display: inline-flex;
	align-items: center;
	min-height: 36px;
	padding: .25rem .75rem;
	font-size: .8125rem;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--wp--preset--color--text);
	border: 1px solid var(--cdn-line);
	border-radius: 999px;
	white-space: nowrap;
}
.cdn-header .lang-item a:hover { border-color: var(--wp--preset--color--brand); color: var(--wp--preset--color--brand); }
/* phones: "EN" / "ES" instead of the full name (screen readers still read "English") */
@media (max-width: 599px) {
	.cdn-header__right { gap: .5rem !important; }
	.cdn-header .lang-item a { padding: .25rem .7rem; font-size: 0; letter-spacing: 0; }
	.cdn-header .lang-item-en a::after { content: "EN"; font-size: .8125rem; letter-spacing: .04em; }
	.cdn-header .lang-item-es a::after { content: "ES"; font-size: .8125rem; letter-spacing: .04em; }
}

/* ---------- home: hero ---------- */
.cdn-hero.wp-block-cover { min-height: 0 !important; }
@media (min-width: 782px) {
	.cdn-hero.wp-block-cover { min-height: 520px !important; }
}
.cdn-hero .wp-block-cover__inner-container > * { margin-block: 0; }
.cdn-hero .cdn-hero__eyebrow {
	font-size: .8125rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: #e3f4b8;
}
.cdn-hero .cdn-hero__title {
	margin-top: .5rem;
	font-size: clamp(2rem, 5.5vw, 3.5rem);
	letter-spacing: -.01em;
	text-shadow: 0 2px 16px rgba(0, 0, 0, .18);
}
.cdn-hero .cdn-hero__lead { margin-top: .75rem; opacity: .95; }
.cdn-hero .agency-search { max-width: 1040px; margin: 2rem auto 0; box-shadow: 0 12px 40px rgba(0, 0, 0, .22); }

/* quick links by type: white outline chips; one swipeable row on phones */
.cdn-chips { margin-top: 1.25rem !important; gap: .5rem; }
.cdn-chips .wp-block-button__link {
	padding: .45rem 1rem;
	font-size: .875rem;
	font-weight: 600;
	color: #fff;
	background: rgba(255, 255, 255, .08);
	border: 1px solid rgba(255, 255, 255, .55);
	border-radius: 999px;
	white-space: nowrap;
}
.cdn-chips .wp-block-button__link:hover { background: #fff; color: var(--wp--preset--color--brand-dark); }
@media (max-width: 699px) {
	.cdn-chips.wp-block-buttons {
		flex-wrap: nowrap;
		justify-content: flex-start;
		overflow-x: auto;
		scrollbar-width: none;
		padding-bottom: .25rem;
	}
	.cdn-chips::-webkit-scrollbar { display: none; }
}

/* ---------- home: sections ---------- */
.cdn-eyebrow {
	margin: 0;
	font-size: .8125rem;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--brand);
}
.cdn-section__head { margin-bottom: 1.75rem; gap: .5rem 1rem; }
.cdn-more { margin: 0; }
.cdn-more a { font-weight: 600; text-decoration: none; }
.cdn-more a:hover { text-decoration: underline; }
.cdn-sell { border-radius: 20px; }
.cdn-sell h2 { margin-bottom: .5rem; }

/* ---------- footer ---------- */
.cdn-footer { margin-top: 0; }
.cdn-footer .cdn-footer__title {
	margin: 0 0 .75rem;
	font-size: .8125rem;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: inherit;
	opacity: .7;
}
.cdn-footer .cdn-footer__muted { opacity: .75; }
.cdn-footer .cdn-footer__links { margin: 0; padding: 0; list-style: none; }
.cdn-footer .cdn-footer__links li { margin: 0 0 .5rem; }
.cdn-footer a { text-decoration: none; }
.cdn-footer a:hover { text-decoration: underline; }
.cdn-footer .cdn-footer__sep { border: 0; border-top: 1px solid rgba(255, 255, 255, .15); opacity: 1; }
.cdn-nav .is-menu-open .wp-block-navigation__responsive-container-content,
.cdn-nav .is-menu-open .wp-block-navigation__container { align-items: flex-start; }
.cdn-nav .is-menu-open .wp-block-navigation-item { width: 100%; border-bottom: 1px solid var(--cdn-line); }
.cdn-nav .is-menu-open .wp-block-navigation-item__content { color: var(--wp--preset--color--text); }

/* ---------- home: mission and reviews (2026-11-13) ---------- */
.cdn-mission .cdn-mission__lead { max-width: 60rem; margin-left: 0; font-size: 1.0625rem; }
.cdn-mission__item {
	padding: 1.25rem 1.25rem 1.5rem;
	background: var(--wp--preset--color--base);
	border-radius: var(--cdn-radius);
	border-top: 4px solid var(--wp--preset--color--brand);
	box-shadow: var(--cdn-shadow);
}
.cdn-mission__item h3 { margin: 0 0 .5rem; font-size: 1.125rem; }
.cdn-mission__item p { margin: 0; font-size: .9375rem; }
@media (min-width: 600px) and (max-width: 1023px) {
	.cdn-mission__grid.wp-block-columns { flex-wrap: wrap !important; }
	.cdn-mission__grid.wp-block-columns > .wp-block-column { flex-basis: calc(50% - 1rem) !important; flex-grow: 1; }
}

/* reviews: one swipe row on phones, 2 or 3 columns of different heights on bigger screens */
.cdn-reviews { margin-top: 1.75rem; }
.cdn-reviews > .cdn-review {
	margin: 0 0 1.25rem;
	padding: 1.25rem 1.25rem 1.25rem 1.5rem;
	background: var(--wp--preset--color--muted);
	border: 0;
	border-left: 4px solid var(--wp--preset--color--highlight);
	border-radius: var(--cdn-radius);
	break-inside: avoid;
}
.cdn-review p { margin: 0 0 .75rem; font-size: .9375rem; font-style: normal; }
.cdn-review cite { font-size: .8125rem; font-style: normal; color: var(--wp--preset--color--accent-4, #5d6d7e); }
@media (min-width: 700px) { .cdn-reviews { column-count: 2; column-gap: 1.25rem; } }
@media (min-width: 1100px) { .cdn-reviews { column-count: 3; } }
@media (max-width: 699px) {
	.cdn-reviews {
		display: flex;
		gap: 1rem;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
		margin-right: calc(-1 * var(--wp--preset--spacing--30));
		padding-right: var(--wp--preset--spacing--30);
	}
	.cdn-reviews::-webkit-scrollbar { display: none; }
	.cdn-reviews > .cdn-review { flex: 0 0 85%; margin: 0; scroll-snap-align: start; }
}

/* ---------- text pages: tables (cookie policy) and contact ---------- */
.cdn-table table { font-size: .875rem; }
.cdn-table th { text-align: left; background: var(--wp--preset--color--muted); }
.cdn-table td, .cdn-table th { padding: .6rem .7rem; vertical-align: top; word-break: break-word; }
@media (max-width: 699px) {
	.cdn-table { overflow-x: auto; }
	.cdn-table table { min-width: 640px; }
}
.cdn-contact h3 { margin-top: 0; }

/* ---------- header menu: submenu (Pisos) ---------- */
.cdn-nav .wp-block-navigation__submenu-container {
	min-width: 180px;
	padding: .35rem 0;
	border: 1px solid var(--cdn-line);
	border-radius: 10px;
	box-shadow: var(--cdn-shadow);
}
.cdn-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content { padding: .5rem 1rem; }
.cdn-nav .is-menu-open .wp-block-navigation__submenu-container { border: 0; box-shadow: none; padding: 0 0 .5rem 1rem; }
.cdn-nav .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item { border-bottom: 0; }
.cdn-nav .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content { font-size: 1.0625rem; padding: .35rem 0; }