/*
Theme Name: Island Bound
Theme URI: https://islandboundsheepdog.com/
Description: Child theme of Twenty Twenty-Five for Island Bound Old English Sheepdogs. Navy, forest and brass palette taken from the logo, Fraunces headings, Source Sans 3 body text.
Author: Island Bound
Template: twentytwentyfive
Version: 1.0.0
Requires at least: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: island-bound
*/

/* Colours, fonts, sizes and layout widths live in theme.json.
   This file holds only what theme.json cannot express. */

:root {
	--ib-line: #d9dde2;
}

/* Remove the default gap between header, content and footer */
body .wp-site-blocks > * {
	margin-block-start: 0;
}

/* ---------- Header ---------- */
.ib-header {
	background: var(--wp--preset--color--white);
	border-bottom: 1px solid var(--ib-line);
	padding: 0.9rem clamp(1rem, 4vw, 2rem);
	width: 100%;
}
.ib-header .wp-block-site-logo img {
	height: auto;
}
.ib-nav .wp-block-navigation-item__content {
	color: var(--wp--preset--color--navy);
	font-weight: 600;
	text-decoration: none;
}
.ib-nav .wp-block-navigation-item:not(.ib-nav-cta) > .wp-block-navigation-item__content:hover {
	box-shadow: inset 0 -3px 0 var(--wp--preset--color--brass);
}
/* Give any menu item the class "ib-nav-cta" to turn it into the brass button */
.ib-nav .ib-nav-cta > .wp-block-navigation-item__content {
	background: var(--wp--preset--color--brass);
	border-radius: 8px;
	color: var(--wp--preset--color--white);
	padding: 0.5rem 1rem;
}

/* Six menu items do not fit in one row between 600px and ~1100px, so use the
   hamburger menu up to 1100px instead of WordPress's default 600px. */
@media (max-width: 1100px) {
	.ib-nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}
	.ib-nav .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}
}
/* Larger tap targets in the open mobile menu */
.ib-nav .is-menu-open .wp-block-navigation-item__content {
	padding-block: 0.6rem;
}

/* ---------- Hero ---------- */
/* To change the hero photo, change the url() below. */
.ib-hero {
	background-color: var(--wp--preset--color--deep-navy);
	background-image:
		linear-gradient(100deg, rgba(13, 27, 51, 0.88) 0%, rgba(13, 27, 51, 0.62) 55%, rgba(13, 27, 51, 0.25) 100%),
		url(/wp-content/uploads/2025/05/20250515_123227-scaled-e1747355750352-1280x720.jpg);
	background-position: center;
	background-size: cover;
	color: var(--wp--preset--color--white);
	padding-block: clamp(3.5rem, 10vw, 8rem);
}
.ib-hero h1 {
	color: var(--wp--preset--color--white);
	max-width: 17ch;
}
.ib-hero .ib-lede {
	color: var(--wp--preset--color--white);
	font-size: 1.25rem;
	max-width: 44ch;
}
.ib-eyebrow {
	color: var(--wp--preset--color--brass-tint);
	font-size: 0.82rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	margin-block-end: 1em;
	text-transform: uppercase;
}
.ib-eyebrow.ib-eyebrow-dark {
	color: var(--wp--preset--color--brass);
}
.ib-hero .is-style-outline .wp-block-button__link {
	background: transparent;
	border: 2px solid var(--wp--preset--color--white);
	color: var(--wp--preset--color--white);
}

/* ---------- Sections ---------- */
.ib-sec {
	padding-block: clamp(2.75rem, 7vw, 5.5rem);
}
.ib-tint {
	background: var(--wp--preset--color--mist);
}
.ib-intro {
	text-align: center;
}
.ib-intro .ib-big {
	font-size: 1.3rem;
	line-height: 1.5;
}
.ib-pillars {
	margin-block-start: 2.75rem;
}
.ib-pillars > .wp-block-column {
	border-top: 4px solid var(--wp--preset--color--brass);
	padding-top: 1rem;
}
.ib-pillars p {
	color: var(--wp--preset--color--slate);
}
.ib-more {
	font-weight: 700;
	margin-block-start: 2rem;
}

/* ---------- Dog cards ---------- */
.ib-dog {
	background: var(--wp--preset--color--white);
	border: 1px solid var(--ib-line);
	border-radius: 12px;
	height: 100%;
	padding: 1.25rem;
	text-align: center;
}
.ib-dog-initial {
	background: linear-gradient(145deg, #cdd5dd, #8d99a6);
	border-radius: 8px;
	color: var(--wp--preset--color--white);
	display: grid;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 3rem;
	font-weight: 600;
	height: 150px;
	margin: 0 0 0.9rem;
	place-items: center;
}
.ib-dog p:last-child {
	color: var(--wp--preset--color--slate);
	font-size: 0.98rem;
	margin-block-end: 0;
}

/* ---------- Litter status ---------- */
.ib-litter {
	background: var(--wp--preset--color--brass-tint);
	border-radius: 14px;
	color: #2b2217;
	padding: clamp(1.5rem, 5vw, 3rem);
}
.ib-litter h2 {
	margin-block-end: 0.3em;
}
.ib-litter p {
	max-width: 56ch;
}

/* ---------- Post cards ---------- */
.ib-card {
	background: var(--wp--preset--color--white);
	border: 1px solid var(--ib-line);
	border-radius: 12px;
	height: 100%;
	overflow: hidden;
}
.ib-card .wp-block-post-featured-image {
	margin: 0;
}
.ib-card .wp-block-post-featured-image img {
	border-radius: 0;
	display: block;
	width: 100%;
}
.ib-card-body {
	padding: 1.1rem 1.25rem 1.4rem;
}
.ib-card .wp-block-post-terms,
.ib-article .wp-block-post-terms {
	font-size: 0.82rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}
.ib-card .wp-block-post-terms a,
.ib-article .wp-block-post-terms a {
	color: var(--wp--preset--color--brass);
	text-decoration: none;
}
.ib-card .wp-block-post-title a {
	text-decoration: none;
}
.ib-card .wp-block-post-excerpt {
	color: var(--wp--preset--color--slate);
	font-size: 0.98rem;
}
.ib-card .wp-block-post-date,
.ib-article .wp-block-post-date {
	color: var(--wp--preset--color--slate);
	font-size: 0.9rem;
}

/* ---------- Contact strip ---------- */
.ib-contact {
	background: var(--wp--preset--color--navy);
	color: var(--wp--preset--color--white);
	padding-block: clamp(2.75rem, 7vw, 5rem);
}
.ib-contact h2,
.ib-contact h3 {
	color: var(--wp--preset--color--white);
}
.ib-contact a:not(.wp-block-button__link) {
	color: var(--wp--preset--color--white);
}
.ib-contact p {
	color: #e2e8f0;
}

/* ---------- Footer ---------- */
.ib-footer {
	background: var(--wp--preset--color--deep-navy);
	color: #e2e8f0;
	font-size: 0.96rem;
	padding: 3rem clamp(1rem, 4vw, 2rem) 1.4rem;
	width: 100%;
}
.ib-footer h4 {
	color: var(--wp--preset--color--white);
	font-size: 1.05rem;
}
.ib-footer a {
	color: #e2e8f0;
	text-decoration: none;
}
.ib-footer a:hover {
	text-decoration: underline;
}
.ib-footer .wp-block-social-link {
	color: var(--wp--preset--color--white);
}
.ib-footer .ib-legal {
	border-top: 1px solid rgba(255, 255, 255, 0.18);
	color: #c3cdd9;
	margin-block-start: 2rem;
	padding-top: 1rem;
}

/* ---------- Inner pages ---------- */
.ib-pagehead {
	background: var(--wp--preset--color--mist);
	padding-block: clamp(2.5rem, 6vw, 4.5rem) clamp(1.75rem, 4vw, 2.75rem);
}
.ib-pagehead h1 {
	margin: 0;
	max-width: 22ch;
}
.ib-prose {
	padding-block: 2rem 4rem;
}
.ib-prose .wp-block-post-featured-image img,
.ib-article .wp-block-post-featured-image img,
.ib-prose img {
	border-radius: 12px;
}
.ib-article {
	padding-block-start: clamp(2rem, 5vw, 3.5rem);
}
.ib-article h1 {
	margin-block: 0.3em;
	max-width: 20ch;
}
.ib-article .wp-block-post-featured-image {
	margin-block: 1.4rem 2rem;
}
.ib-postnav {
	border-top: 1px solid var(--ib-line);
	font-weight: 600;
	margin-block: 3rem 4rem;
	padding-top: 1.25rem;
}
.ib-postnav a {
	text-decoration: none;
}
.ib-callout {
	background: var(--wp--preset--color--brass-tint);
	border-radius: 10px;
	color: #2b2217;
	padding: 1.1rem 1.4rem;
}
.ib-journal {
	padding-block: 2.5rem 4rem;
}

/* ---------- Typography helpers ---------- */
/* A real heading that keeps the look of body text (used where an old page
   styled a plain paragraph as a title). */
.ib-plain-heading {
	color: inherit;
	font-family: var(--wp--preset--font-family--body);
	font-weight: 400;
	line-height: inherit;
}
.ib-lede-dark {
	color: var(--wp--preset--color--slate);
	font-size: 1.25rem;
	max-width: 44ch;
}
.ib-meta {
	color: var(--wp--preset--color--slate);
	font-size: 0.95rem;
	gap: 0.25rem 1.25rem;
}
.ib-search {
	margin-block-start: 1.25rem;
	max-width: 32rem;
}
.ib-more-journal {
	margin-block-start: 2rem;
}