/*
Theme Name: Yug Realty
Theme URI: https://yugrealty.com
Description: Mobile-first child theme of Twenty Twenty-Five for Yug Realty. Brand palette, fluid type and spacing scales, self-hosted Inter, and the header/footer template parts ship inside the theme. Teal is always Dwarka Expressway, ochre is always Southern Peripheral Road.
Author: Yug Realty
Template: twentytwentyfive
Version: 2.3.3
Requires at least: 6.9
Tested up to: 7.0
Requires PHP: 7.4
License: GPLv2 or later
Text Domain: yugrealty
*/

/* ===============================================================
   1. TYPE — figures and font loading
   =============================================================== */

/* Numbers align vertically down a column. */
table, th, td, .wp-block-table,
.rate, .price, .carpet-rate, .verified-date {
	font-variant-numeric: tabular-nums;
	font-feature-settings: "tnum" 1;
}

/* Metric-matched fallback so the swap to Inter causes no layout
   shift. size-adjust tuned to Inter's x-height. */
@font-face {
	font-family: "InterFallback";
	src: local("Segoe UI"), local("Helvetica Neue"), local("Arial");
	size-adjust: 107%;
	ascent-override: 90%;
	descent-override: 22%;
	line-gap-override: 0%;
}

/* ===============================================================
   2. NAVIGATION — mobile overlay and toggle
   The header group uses a constrained layout (contentSize 1200px).
   The overlay is a descendant and inherits that max-width; these
   rules restore full-bleed. theme.json cannot target the
   .is-menu-open pseudo-state.
   =============================================================== */

html body .wp-block-navigation__responsive-container.is-menu-open {
	position: fixed !important;
	inset: 0 !important;
	width: auto !important;
	height: auto !important;
	max-width: none !important;
	min-height: 100dvh;
	margin: 0 !important;
	border-radius: 0 !important;
	padding: var(--wp--preset--spacing--60) var(--wp--preset--spacing--40) var(--wp--preset--spacing--50) !important;
	overflow-y: auto;
	overscroll-behavior: contain;
	z-index: 200 !important;
	background-color: var(--wp--preset--color--ink) !important;
	transform: none !important;
}

html body .wp-block-navigation__responsive-container.is-menu-open
	.wp-block-navigation__responsive-container-content {
	width: 100% !important;
	max-width: none !important;
	align-items: flex-start !important;
	justify-content: flex-start !important;
	padding: var(--wp--preset--spacing--40) 0 0 0 !important;
	gap: var(--wp--preset--spacing--30);
}

html body .wp-block-navigation__responsive-container.is-menu-open
	.wp-block-navigation__responsive-container-content
	.wp-block-navigation__container {
	width: 100% !important;
	align-items: flex-start !important;
	--navigation-layout-justification-setting: flex-start;
	gap: var(--wp--preset--spacing--30) !important;
}

html body .wp-block-navigation__responsive-container.is-menu-open
	.wp-block-navigation-item__content {
	font-size: var(--wp--preset--font-size--x-large) !important;
	letter-spacing: -0.02em;
	padding: 0.35rem 0.5rem 0.35rem 0 !important;
}

/* Toggle: explicit size, real hit area. */
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	padding: 0;
}

.wp-block-navigation__responsive-container-close svg {
	width: 26px;
	height: 26px;
	fill: currentColor;
}

/* Header: the nav and its items sit on the same vertical centre as
   the wordmark, regardless of the nav container's own alignment. */
header.wp-block-group .wp-block-navigation,
header.wp-block-group .wp-block-navigation__container,
header.wp-block-group .wp-block-navigation-item {
	align-items: center;
}

/* Three-line hamburger: core ships a two-bar glyph, so the SVG is
   hidden and the icon drawn with a box-shadow stack. */
.wp-block-navigation__responsive-container-open svg { display: none; }

.wp-block-navigation__responsive-container-open::before {
	content: "";
	display: block;
	width: 24px;
	height: 2px;
	border-radius: 1px;
	background: currentColor;
	box-shadow: 0 8px 0 currentColor, 0 16px 0 currentColor;
	transform: translateY(-8px);
}

.wp-block-navigation__responsive-container-close {
	top: var(--wp--preset--spacing--30);
	right: var(--wp--preset--spacing--30);
}

/* ===============================================================
   3. TOUCH — tap targets (WCAG 2.5.8)
   =============================================================== */

.wp-block-navigation-item__content,
.wp-block-social-link-anchor,
.wp-block-button__link {
	min-height: 44px;
	display: inline-flex;
	align-items: center;
}

/* ===============================================================
   4. FOCUS — keyboard visibility
   =============================================================== */

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.wp-block-button__link:focus-visible {
	outline: 2px solid var(--wp--preset--color--dxp-teal);
	outline-offset: 2px;
	border-radius: 2px;
}

/* ===============================================================
   5. CORRIDOR KEYLINES
   Bright teal/ochre fail contrast as text on paper (2.04 / 2.14).
   They are structural markers. Use dxp-teal-deep / spr-ochre-deep
   for corridor names in text on light grounds.
   =============================================================== */

.corridor-dxp { border-left: 4px solid var(--wp--preset--color--dxp-teal); }
.corridor-spr { border-left: 4px solid var(--wp--preset--color--spr-ochre); }
.corridor-dxp, .corridor-spr { padding-left: var(--wp--preset--spacing--30); }

/* ===============================================================
   6. ACTION BAR
   Inline in the footer's right column on desktop. Below 782px it
   pins to the bottom of the viewport — a thumb reaches the bottom
   far more easily than the top corner.
   =============================================================== */

.yug-actionbar { margin-block: 0; }

@media (max-width: 781px) {
	.yug-actionbar {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 100;
		margin: 0;
		padding: 0.625rem 0.75rem calc(0.625rem + env(safe-area-inset-bottom));
		background: var(--wp--preset--color--ink);
		border-top: 1px solid rgba(233, 236, 232, 0.14);
	}

	.yug-actionbar .wp-block-buttons { width: 100%; gap: 0.5rem; }
	.yug-actionbar .wp-block-button { flex: 1 1 0; min-width: 0; }

	.yug-actionbar .wp-block-button__link {
		width: 100%;
		justify-content: center;
		padding-inline: 0.5rem;
		white-space: nowrap;
	}

	body { padding-bottom: 0; }

	/* The footer is the last element on every page, so it carries the
	   clearance for the fixed bar in ink — no paper strip. */
	footer.wp-block-group {
		padding-bottom: calc(var(--wp--preset--spacing--50) + 4.75rem) !important;
	}
}

@media (min-width: 782px) {
	.yug-actionbar .wp-block-buttons { gap: var(--wp--preset--spacing--20); }
}

/* ===============================================================
   7. CONTENT SAFETY — narrow screens
   =============================================================== */

h1, h2, h3, h4, p, td, th { overflow-wrap: break-word; }
.wp-block-table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
img { max-width: 100%; height: auto; }

/* ===============================================================
   8. MOTION
   =============================================================== */

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: 0.01ms !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* ---------------------------------------------------------------
   13. Equal-height cards
   Side-by-side corridor and method cards stretch to the tallest
   sibling, so a two-project card matches a four-project card.
   --------------------------------------------------------------- */
.wp-block-column > .corridor-dxp,
.wp-block-column > .corridor-spr,
.wp-block-column > .wp-block-group.has-white-background-color {
	height: 100%;
	box-sizing: border-box;
}

/* Site logo: crisp at header scale, no rounding. */
.wp-block-site-logo img { display: block; border-radius: 4px; }

/* =========================================================
   v2.3.4 — remove root gap above template parts
   Kills the paper hairline between header→hero and CTA→footer
   on templates. Touches only the gap above header/footer
   placements, nothing inside them.
   ========================================================= */
.wp-site-blocks > .wp-block-template-part {
	margin-block-start: 0;
}
.wp-site-blocks {
	padding-block-end: 0;
}
.wp-site-blocks > .wp-block-template-part:last-child {
	margin-block-end: 0;
}