/*
Theme Name: 5 Bird Dwellings
Template: alt-creative
Author: Alt Creative
Author URI: https://altcreative.com
Description: Child theme for 5 Bird Dwellings. Brand lives in assets/css/brand.css; fonts are enqueued in functions.php. Requires the alt-creative parent. Carries a snapshot of the section library in livecanvas/.
Version: 0.1.0
Requires at least: 6.0
Requires PHP: 7.4
License: Proprietary
Text Domain: five-birds-dwellings
*/

/* Per-site odds and ends only. The brand is assets/css/brand.css, loaded before
   this file by the parent. Keep the two separate so brand.css can be regenerated
   from the client's brand doc without touching anything else. */

/* Flourish separator (svgsep) — the thin decorative rule the original places
   above and below hero/section text. Reproduced from the old theme's measured
   rule: full width, capped at 560x50, centred. The SVG's own fill is #eee, so
   it reads on dark bands. */
/* Centred BLOCK image. A DEFINITE width (560px) with margin:0 auto centres it
   cleanly — the earlier width:100%+max-width combo broke auto-centering, and
   inline-block sat it on the text baseline so its box crowded the adjacent
   text. A plain block has no baseline leading, so the flourish's own vertical
   margins apply exactly as set. max-width:100% keeps it from overflowing narrow
   columns. */
.svgsep { text-align: center; }
.svgsep img {
	display: block;
	width: 560px;
	max-width: 100%;
	height: auto;
	margin: 0 auto;
}

/* Original picostrap utility classes carried on the WP Bakery markup. These do
   not exist in the alt-creative theme, so without them the emitted el_class
   values are silent no-ops (RETHEME §5a). Reproduced from the measured CSS. */
.bg-sm { padding-top: 25px;  padding-bottom: 25px; }
.bg-md { padding-top: 50px;  padding-bottom: 50px; }
.bg-lg { padding-top: 75px;  padding-bottom: 75px; }
.bg-xl { padding-top: 100px; padding-bottom: 100px; }

.bg-gradient-light-white {
	background: linear-gradient(180deg, rgba(246, 246, 246, 0.85), rgba(255, 255, 255, 0.85));
	/* The original made this band a full-width stretch_row; the converter left
	   it on a contained row, so it read as a floating grey box. Break it out to
	   the full viewport width so it's a background strip, not a box. The content
	   inside stays where it is. --bs-gutter-x:0 cancels the .row negative
	   gutters so the full-bleed margins win. */
	--bs-gutter-x: 0;
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

/* Decorative section icon (svgimg / svgimg-125). Original: 100px; the -125
   variant had no rule of its own but the intent is a larger 125px mark. */
.svgimg img     { width: 100px; height: auto; }
.svgimg-125 img { width: 125px; height: auto; }

.ls-2         { letter-spacing: 2px; }
.text-justify { text-align: justify; }

/* Match the original 1170px content width (picostrap --co-container). Bootstrap's
   default container is wider, which made the inner-page images larger than live. */
@media (min-width: 1200px) {
	.container { max-width: 1170px; }
}

/* Image + text rows (intros, Locations neighbourhoods) — widen the gutter so the
   copy isn't tight against the photo. */
@media (min-width: 992px) {
	.alt-media-row { --bs-gutter-x: 4.5rem; }
}

/* Locations page only: its two-column neighbourhood rows are TOP-aligned, even
   the one the original set content_placement="middle" — long copy reads wrong
   centred against the photo (Lindsey). page-id is stable sandbox↔production. */
body.page-id-1916 .row.align-items-center { align-items: flex-start !important; }

/* vc_box_shadow_border — a 6px white mat + soft drop shadow on the intro photos
   (About sign, Sources art, Giving Back interior, Contact). box-sizing:border-box
   keeps the framed image from growing. */
.alt-img-framed {
	padding: 6px;
	background: #ffffff;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
}

/* Blog hero: a dark wash over the garden background image, and the tertiary
   accent the H1 uses (a light blue, only on that page). Measured from original. */
.background-overlay-dark { background: #000000cc; }
.text-tertiary          { color: #98c7d1 !important; }

/* The nav uses fairplex-narrow, UPPERCASE, ~19px, with 12px padding per item
   (the item spacing) and slight tracking — measured on the original. */
.navbar-nav .nav-link {
	font-family: "fairplex-narrow", Georgia, serif;
	font-size: 19px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	padding: 12px !important;
	color: #222222;   /* keep the header nav dark, not the sage link colour */
}
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.active { color: #79aa91; }