/*
Theme Name: Sea to Sky Healer
Theme URI: https://www.seatoskyhealer.com/
Author: Cyberlink Digital
Description: Standalone magazine theme for Sea to Sky Healer. Replaces the Genesis child theme and the Mintstone content blocks plugin. Homepage sections, ad spaces, recommended stories and contributor profiles are managed under "Healer Settings" (requires the Secure Custom Fields plugin).
Version: 1.0.20
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.1
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: s2sh
*/

/* ---------- Tokens ---------- */
:root {
	--green: #478c35;
	--green-dark: #36702a;
	--ink: #111;
	--text: #222;
	--muted: #5f5f5f;
	--line: #d5d5d5;
	--line-soft: #e7e7e7;
	--masthead: #f0f1f3;
	--topbar: #e8e5e5;
	--topbar-text: #6e6060;
	--panel: #ececec;
	--tint: #e9f2fb;
	--outer: #a5a5a5;
	--nav-text: #414141;
	--f-ui: "Titillium Web", "Helvetica Neue", Arial, sans-serif;
	--f-head: "Oswald", "Arial Narrow", sans-serif;
	--f-serif: "PT Serif", Georgia, serif;
	--f-nav: "Lora", Georgia, serif;
	--f-logo: "Alfa Slab One", "Rockwell Extra Bold", Rockwell, serif;
	--wrap: 1240px;
	--gutter: 32px;
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
	margin: 0;
	background: var(--outer);
	color: var(--text);
	font-family: var(--f-ui);
	font-size: 17px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}
img, svg, video, iframe { max-width: 100%; }
img { height: auto; display: block; }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--green); }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible {
	outline: 3px solid var(--green);
	outline-offset: 2px;
}
h1, h2, h3, h4 { margin: 0; line-height: 1.2; color: var(--ink); }
p { margin: 0 0 1em; }
.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	white-space: nowrap;
}
.skip-link:focus {
	clip: auto; clip-path: none;
	width: auto; height: auto;
	z-index: 1000; top: 8px; left: 8px;
	background: #fff; padding: 10px 16px;
	color: var(--ink);
}
.site { max-width: 1240px; margin: 0 auto; background: #fff; min-height: 100vh; box-shadow: 0 0 0 1px #9a9a9a; }
.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gutter); }
.button {
	display: inline-block; background: var(--green); color: #fff;
	padding: 10px 22px; font-weight: 600; border-radius: 3px;
}
.button:hover { background: var(--green-dark); color: #fff; }


/* Top banner strip (above the top menu). Space is reserved by aspect ratio so nothing jumps while loading. */
.top-banner { background: #f4f3f1; border-bottom: 1px solid #e3dfdf; }
.top-banner .wrap { position: relative; padding-top: 18px; padding-bottom: 12px; }
.top-banner .ad-label { position: absolute; top: 3px; right: var(--gutter); margin: 0; font-size: 10px; }
.top-banner .ad-pair__item a:focus-visible { outline: 3px solid var(--green); outline-offset: 2px; }
.top-banner__row { display: grid; gap: 16px; }
.top-banner__row--two { grid-template-columns: 1fr 1fr; }
.top-banner__row .ad-pair__item { aspect-ratio: 3 / 1; background: #ebe8e6; }
.top-banner__row--one .ad-pair__item { aspect-ratio: 6 / 1; }

/* Landscape banners (middle, bottom) and side ads. Space reserved by aspect ratio. */
.banner-ad { margin: 8px 0 36px; }
.banner-ad .ad-label, .side-ads-wrap .ad-label { display: block; text-align: right; font-size: 10px; margin: 0 0 4px; }
.banner-ad__img { aspect-ratio: 6 / 1; overflow: hidden; background: #f4f3f1; }
.banner-ad__img a, .banner-ad__img picture { display: block; width: 100%; height: 100%; }
.banner-ad .banner-ad__img img, .entry__content .banner-ad__img img { width: 100%; height: 100%; max-width: none; object-fit: cover; }
.entry__content .banner-ad a { text-decoration: none; }
.banner-ad--in-article { margin: 6px 0 30px; }
.bottom-ad { margin-top: 8px; }
.bottom-ad .banner-ad { margin: 0 0 8px; }
.post-list .banner-ad { margin: 0; }
.side-ads { display: flex; flex-direction: column; gap: 16px; }
.ad-pair__item { overflow: hidden; background: #f4f3f1; }
.side-ads .ad-pair__item { aspect-ratio: 6 / 5; }
.ad-pair__item a, .ad-pair__item picture { display: block; width: 100%; height: 100%; }
.ad-pair__item img { width: 100%; height: 100%; object-fit: cover; }
/* The following column only "follows" on screens tall enough to show it all. */
/* Ads stop following when they would not fit under the sticky header (set by menu.js); CSS fallback without JS. */
.aside-static .aside-follow { position: static; }
@media (max-height: 820px) { html:not(.js) .aside-follow { position: static; } }
@media (max-width: 700px) {
	.top-banner .wrap { padding-top: 16px; padding-bottom: 10px; }
	.top-banner__row--two, .side-ads--two { grid-template-columns: 1fr; }
	.top-banner__row--two .ad-pair__item:not(.is-current), .side-ads--two .ad-pair__item:not(.is-current) { display: none; }
	.top-banner__row--one .ad-pair__item.has-phone, .banner-ad.has-phone .banner-ad__img { aspect-ratio: 3 / 1; }
	.side-ads-wrap { display: block; max-width: 336px; margin: 0 auto; }
}

/* ---------- Top bar ---------- */
.top-bar { background: var(--topbar); border-bottom: 1px solid var(--line); }
.top-bar__menu { list-style: none; margin: 0; padding: 6px 0; display: flex; flex-wrap: wrap; }
.top-bar__menu li + li { border-left: 1px solid #c6b8b8; }
.top-bar__menu a {
	display: block; padding: 2px 14px; font-size: 19px; color: var(--topbar-text);
}
.top-bar__menu li:first-child a { padding-left: 0; }
.top-bar__menu a:hover { color: var(--green); }

/* ---------- Sticky header. Computers: only the main menu bar (Home, Features… + search)
   stays at the top; the logo area scrolls away (menu.js sets --mast-h to its height, so the
   header sticks with the logo area just above the screen). Phones and tablets: the logo +
   Menu bar stays (--mast-h is 0). Top ads and the About/Advertise row always scroll away. ---------- */
.site-header { position: sticky; top: calc(0px - var(--mast-h, 0px)); z-index: 900; background: #fff; }
.admin-bar .site-header { top: calc(32px - var(--mast-h, 0px)); }
.site-header.is-stuck { box-shadow: 0 2px 10px rgba(0, 0, 0, .08); }
html { scroll-padding-top: calc(var(--hdr-h, 0px) + 12px); }
.masthead .site-title { min-width: 0; }

/* ---------- Masthead ---------- */
.masthead { background: var(--masthead); border-bottom: 1px solid #c6b8b8; }
.masthead__inner {
	display: flex; align-items: center; justify-content: space-between;
	gap: 24px; padding-top: 34px; padding-bottom: 34px;
}
.site-title { margin: 0; line-height: 1; }
.site-title a { display: inline-block; color: #000; }
.site-logo { width: 420px; max-width: 100%; height: auto; }
.site-title__text {
	font-family: var(--f-logo); font-size: 64px; letter-spacing: -0.5px;
	color: #000; line-height: 1;
}
.site-title a:hover { color: #000; opacity: .85; }

.social { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.social__label { font-size: 14px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; color: #333; }
.social ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 10px; }
.social a {
	display: flex; align-items: center; justify-content: center;
	width: 52px; height: 52px; border-radius: 50%; background: #000; color: #fff;
	transition: background .15s;
}
.social a:hover { background: var(--green); color: #fff; }
.social svg { width: 26px; height: 26px; fill: currentColor; }
.social--menu { display: none; }

.menu-toggle { display: none; }

/* ---------- Main nav ---------- */
.nav-bar { border-bottom: 1px solid var(--line); box-shadow: 0 -4px 0 #fff, 0 -5px 0 var(--line); margin-top: 5px; }
.nav-bar__inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.main-nav__menu { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: nowrap; }
.main-nav__menu li { position: relative; }
.main-nav__menu li + li { border-left: 1px solid #cfcfcf; }
.main-nav__menu a {
	display: block; padding: 13px 11px 15px; white-space: nowrap;
	font-family: var(--f-nav); font-weight: 700; font-size: 23px; color: var(--nav-text);
	border-bottom: 5px solid transparent; line-height: 1.15;
}
.main-nav__menu li:first-child a { padding-left: 0; }
.main-nav__menu a:hover { color: var(--green); }
.main-nav__menu .current-menu-item > a,
.main-nav__menu .current-menu-ancestor > a,
.main-nav__menu .current-post-parent > a,
.main-nav__menu .current-category-ancestor > a { border-bottom-color: var(--green); }
.main-nav__menu li:first-child.current-menu-item > a { padding-left: 0; }

.search-form { position: relative; display: flex; align-items: center; min-width: 200px; }
.search-form__input {
	width: 100%; border: 1.5px solid #a5a0a0; border-radius: 40px;
	padding: 8px 46px 8px 22px; font: italic 600 17px var(--f-nav); color: var(--ink); background: #fff;
}
.search-form__input::placeholder { color: #333; opacity: 1; }
.search-form__submit {
	position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
	border: 0; background: none; padding: 6px; cursor: pointer; color: #555; display: flex;
}
.search-form__submit svg { width: 18px; height: 18px; fill: currentColor; }

/* ---------- Ad slots ---------- */
.ad-slot { text-align: center; margin: 28px auto; max-width: var(--wrap); padding: 0 var(--gutter); }
.ad-slot img { margin: 0 auto; }
.ad-label {
	display: block; font-size: 11px; letter-spacing: 1px; text-transform: uppercase;
	color: #888; margin-bottom: 4px;
}
.layout__aside .ad-slot { padding: 0; margin: 0; position: sticky; top: calc(var(--hdr-h, 0px) + 20px); }
.article-aside .ad-slot, .home-aside .ad-slot { position: static; margin-bottom: 0; }
.article-aside__inner { position: sticky; top: calc(var(--hdr-h, 0px) + 20px); display: flex; flex-direction: column; gap: 0; }
/* Article column: story list scrolls normally; newsletter + ad follow the reader to the end of the article. */
.aside-follow { position: sticky; top: calc(var(--hdr-h, 0px) + 20px); margin-top: 26px; padding-top: 22px; border-top: 1px solid var(--line-soft); display: flex; flex-direction: column; gap: 22px; }
.aside-follow > .ad-slot { margin: 0; padding: 0; }
/* Column separator: a thin rule with a short green accent at the top. */
.layout__aside { position: relative; padding-left: 32px; border-left: 1px solid var(--line); align-self: stretch; }
.layout__aside::before {
	content: ""; position: absolute; left: -2px; top: 0; width: 3px; height: 64px; background: var(--green); border-radius: 2px;
}
/* Blocks inside the column are separated by light rules. */
.article-aside__inner > * + * { margin-top: 22px; padding-top: 22px; border-top: 1px solid var(--line-soft); }
.aside-widget + .aside-widget { margin-top: 22px; }
.aside-widget img { margin: 0 auto; height: auto; }
.newsletter-box--aside { margin: 0; padding: 20px 18px; background: var(--tint); border-top: 3px solid var(--green); }
.article-aside__inner > .newsletter-box--aside { border-top: 3px solid var(--green); }
.newsletter-box--aside .newsletter-box__title { font-size: 22px; }
.newsletter-box--aside p { font-size: 15px; line-height: 1.5; }
/* Quiet section label ("More from the Healer", widget titles): no box, small grey capitals. */
.aside-block__title {
	font: 600 13px/1.2 var(--f-ui); text-transform: uppercase; letter-spacing: 1px; color: #666;
	display: block; margin: 0 0 10px;
}
/* Newsletter box sits first in the article column, above the story list. */
.article-aside > .newsletter-box--aside + .aside-block { margin-top: 26px; }
.mini-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.mini { display: flex; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--line-soft); }
.mini__media { flex: none; width: 84px; height: 64px; overflow: hidden; background: #ddd; }
.mini__media img { width: 100%; height: 100%; object-fit: cover; }
.mini__body { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.mini__cat { font: 600 12px var(--f-ui); text-transform: uppercase; letter-spacing: .4px; color: var(--green); }
.mini__title { font: 500 16px/1.25 var(--f-head); color: #000; }
.mini__title:hover { color: var(--green); }

/* ---------- Layout ---------- */
.site-content { padding: 32px 0 48px; }
.layout { display: block; }
.has-ad-sidebar .layout:not(.layout--archive) {
	display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 32px; align-items: start;
}

/* ---------- Labels ---------- */
.label { margin: 0 0 12px; }
.label a {
	display: inline-block; background: var(--green); color: #fff;
	font: 600 15px/1 var(--f-ui); text-transform: uppercase; letter-spacing: .4px;
	padding: 7px 10px 6px; border: 2px solid #c9dcc3; outline: 1px solid var(--green);
}
.label a:hover { background: var(--green-dark); color: #fff; }

/* ---------- Cards ---------- */
.card { display: flex; flex-direction: column; min-width: 0; }
.card__media { display: block; background: #ddd; overflow: hidden; aspect-ratio: 3 / 2; }
.card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.card__media:hover img { transform: scale(1.02); }
.card__media--video { aspect-ratio: auto; background: none; }
.card__media--video iframe { width: 100%; aspect-ratio: 16 / 9; height: auto; }
.card__media--empty { background: linear-gradient(135deg, #e9eee7, #d9e3d4); }
.card__body { padding-top: 12px; }
.card__title { font-family: var(--f-head); font-weight: 500; font-size: 20px; line-height: 1.25; color: #000; }
.card__title a:hover { color: var(--green); }
.card__excerpt { margin: 10px 0 0; font-size: 17px; line-height: 1.6; color: #222; }
.card__date { margin: 8px 0 0; font-size: 14px; color: var(--muted); text-transform: uppercase; letter-spacing: .3px; }

/* Hero (first story of a section) */
.card--hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px; align-items: center; }
.card--hero .card__media { aspect-ratio: 3 / 2; }
.card--hero > .label--top { display: none; }
.card__excerpt--hero {
	margin: 12px 0 0; font-size: 17px; line-height: 1.55;
	display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden;
}
/* One-line teaser + Read more on cards with photos */
.card__teaser--one { display: flex; align-items: baseline; gap: 6px; min-width: 0; }
.card__teaser--one .card__teaser-text { flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card__teaser--one .read-link { flex: none; }
.card .card__media { aspect-ratio: 16 / 10; }
.card__meta { margin: 16px 0 0; display: flex; flex-wrap: wrap; gap: 4px 14px; align-items: baseline; font-size: 15px; }
.card__meta .byline__name { font-size: 15px; }
.card__meta-date { color: var(--muted); text-transform: uppercase; letter-spacing: .3px; }
.card__more { margin: 18px 0 0; }
.card__more a { display: inline-flex; align-items: center; gap: 6px; color: var(--green); font-weight: 700; font-size: 17px; }
.card__more a:hover { color: var(--green-dark); text-decoration: underline; }
.card__more svg { width: 14px; height: 14px; fill: currentColor; }
.card--hero .card__body { padding-top: 0; }
.card--hero .card__title { font-weight: 600; font-size: 34px; line-height: 1.15; }
.home-section:not(.home-section--lead) .card--hero .card__title { font-size: 30px; }

/* Grids */
.card-grid {
	display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 28px 30px; margin-top: 28px; position: relative;
}
.card-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.card-grid--panel { background: var(--panel); padding: 24px 22px 18px; }
.card-grid--links-only .story-links { margin-top: 0; }
/* Even spacing around the text links: about 22px above the divider, 20px below it, 22px to "More …". */
.story-links + .read-more { margin-top: -6px; }
.read-more { grid-column: 1 / -1; margin: 0; text-align: right; }
.read-more a {
	color: var(--green); font-weight: 600; font-size: 16px;
	display: inline-flex; align-items: center; gap: 4px;
}
.read-more svg { width: 14px; height: 14px; fill: currentColor; }
.read-more a:hover { color: var(--green-dark); text-decoration: underline; }


/* Teasers and green-arrow story links */
.card__teaser { margin: 8px 0 0; font-size: 16px; line-height: 1.5; color: #333; }
.read-link { color: var(--green); font-weight: 600; white-space: nowrap; }
.read-link::after { content: " »"; }
.read-link:hover { color: var(--green-dark); text-decoration: underline; }
.story-links {
	grid-column: 1 / -1; list-style: none; margin: -6px 0 0; padding: 20px 0 0;
	border-top: 1px solid #cfcfcf; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px 0;
}
.story-link { display: flex; gap: 8px; padding: 0 18px; }
.story-link:first-child { padding-left: 0; }
.story-link + .story-link { border-left: 1px solid #cfcfcf; }
.story-link > svg { flex: none; width: 20px; height: 20px; fill: var(--green); margin-top: 3px; }
.story-link__title { font-family: var(--f-head); font-weight: 400; font-size: 19px; line-height: 1.25; color: #000; }
.story-link__title a:hover { color: var(--green); }
.story-link__teaser { margin: 6px 0 0; font-size: 15.5px; line-height: 1.5; color: #333; }

/* ---------- Homepage sections ---------- */
.home-section { margin-bottom: 36px; }
.home-section--tint { background: var(--tint); padding: 8px 24px 24px; }
.section-heading {
	display: flex; align-items: center; gap: 16px; margin: 6px 0 24px;
	font: 600 15px/1 var(--f-ui); text-transform: uppercase; letter-spacing: .4px;
}
.section-heading::before, .section-heading::after { content: ""; flex: 1; height: 1px; background: #a5a5a5; }
.section-heading a {
	background: var(--green); color: #fff; padding: 7px 10px 6px;
	border: 2px solid #c9dcc3; outline: 1px solid var(--green);
}
.section-heading a:hover { background: var(--green-dark); color: #fff; }
.home-section--tint .section-heading { margin-top: 16px; }

/* ---------- Article ---------- */
.entry { max-width: 760px; margin: 0 auto; }
.has-ad-sidebar .entry { margin: 0; max-width: none; }
.entry__title { font-family: var(--f-head); font-weight: 700; font-size: 44px; line-height: 1.2; color: #000; }
/* Article typography matches the original site: PT Serif 20px/1.5 body, Lora bold italic strap,
   Oswald headings, Titillium Web byline and captions. */
.entry__strap {
	margin: 14px 0 0; font: italic 700 24px/1.4 var(--f-nav); color: #000;
}
.entry__hero { margin: 20px 0 0; }
.entry__hero img { width: 100%; }
.entry__hero figcaption { margin-top: 8px; font: 400 18px/1.45 var(--f-ui); color: #000; }
.entry__meta {
	margin: 20px 0 22px; padding: 10px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line);
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px;
}
.byline { display: flex; flex-direction: column; gap: 1px; }
.card__meta .byline__name + .card__meta-date { margin-left: 0; }
.byline__name { font-family: var(--f-ui); font-weight: 600; font-size: 18px; text-transform: uppercase; color: #000; }
a.byline__name:hover { color: var(--green); }
.byline__date, .byline__updated { font-family: var(--f-ui); font-size: 18px; font-weight: 200; text-transform: uppercase; color: #000; }
.byline__updated { font-size: 14px; font-weight: 400; color: var(--muted); }

.entry__content { font-family: var(--f-serif); font-size: 20px; line-height: 1.5; color: #000; }
.entry__content > * + * { margin-top: 0; }
.entry__content p, .entry__content ul, .entry__content ol, .entry__content figure, .entry__content .wp-caption { margin: 0 0 30px; }
.entry__content a { color: #1c92f7; text-decoration: none; }
.entry__content a:hover { color: #1c92f7; text-decoration: underline; }
.entry__content h2, .entry__content h3, .entry__content h4 { font-family: var(--f-head); line-height: 1.2; margin: 0 0 20px; }
.entry__content h2 { font-size: 30px; font-weight: 700; }
.entry__content h3 { font-size: 20px; font-weight: 600; }
.entry__content h4 { font-size: 20px; font-weight: 600; margin-top: 40px; }
.entry__content blockquote { margin: 30px; font-style: italic; }
.entry__content blockquote::before { content: "\201C"; display: block; font-size: 30px; height: 0; position: relative; left: -20px; top: -10px; }
.entry__content blockquote p:last-child { margin-bottom: 0; }
.entry__content ul, .entry__content ol { padding-left: 1.3em; }
.entry__content img { max-width: 100%; height: auto; }
.entry__content figure { margin: 1.6em 0; }
.entry__content figcaption, .wp-caption-text, .wp-element-caption {
	font-family: var(--f-serif); font-size: 14px; font-weight: 600; line-height: 1.4; color: #000; margin: 6px 0 0; text-align: center;
}
.wp-caption { max-width: 100%; }
.alignleft, .entry__content .alignleft { float: left; margin: .35em 1.6em 1em 0; max-width: 50%; }
.alignright, .entry__content .alignright { float: right; margin: .35em 0 1em 1.6em; max-width: 50%; }
.aligncenter { margin-left: auto; margin-right: auto; }
.entry__content::after { content: ""; display: table; clear: both; }
.entry__content iframe { width: 100%; aspect-ratio: 16 / 9; height: auto; }
.single-highligted-text-container, .entry__content .highlight {
	background: var(--tint); padding: 18px 22px; border-left: 4px solid var(--green);
}

.entry__footer { margin-top: 36px; clear: both; }
.share-footer { margin: 30px 0; }
.share-footer__title, .comments__title {
	font: 700 22px var(--f-ui); text-transform: uppercase; letter-spacing: .5px; margin-bottom: 10px;
}
.share-footer__title { color: var(--green); }
.entry__tags { margin: 24px 0; font-size: 17px; }
.entry__tags-title { font-weight: 700; }
.entry__tags a { color: var(--green); }

.newsletter-box {
	margin: 36px 0; padding: 26px 28px; background: var(--tint); border-top: 4px solid var(--green);
}
.newsletter-box__title { font-family: var(--f-head); font-weight: 600; font-size: 26px; margin-bottom: 6px; }


/* Share buttons (built into the theme) */
.share { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
/* Small, quiet "Share to" cue before the buttons in the byline strip. */
.entry__share { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.entry__share-label { font: 400 14px/1 var(--f-ui); color: var(--muted); text-transform: uppercase; letter-spacing: .6px; }
.share-btn {
	width: 40px; height: 40px; border-radius: 50%; background: #000; color: #fff; border: 0; padding: 0;
	display: inline-flex; align-items: center; justify-content: center; cursor: pointer; transition: background-color .15s;
}
.share-btn:hover, .share-btn:focus-visible { background: var(--green); color: #fff; }
.share-btn svg { width: 20px; height: 20px; fill: currentColor; }
.share-btn--more svg { width: 22px; height: 22px; }
.share-btn svg.icon-stroke { width: 20px; height: 20px; }
.share { position: relative; }
.share__copied:empty { display: none; }
.share__copied {
	position: absolute; left: 0; top: calc(100% + 6px); background: var(--green); color: #fff;
	font: 600 13px var(--f-ui); padding: 4px 10px; border-radius: 3px; white-space: nowrap; z-index: 5;
}

.share-panel {
	position: fixed; inset: 0; z-index: 1000; background: rgba(17, 17, 17, .6);
	display: flex; align-items: center; justify-content: center; padding: 16px;
}
.share-panel[hidden] { display: none; }
.share-open, .share-open body { overflow: hidden; }
.share-panel__box {
	background: #fff; width: 100%; max-width: 640px; max-height: calc(100vh - 32px); overflow: auto;
	border-radius: 6px; box-shadow: 0 20px 50px rgba(0, 0, 0, .3); padding: 18px 20px 14px;
}
.share-panel__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.share-panel__head h2 { font: 700 20px var(--f-ui); text-transform: uppercase; letter-spacing: .5px; color: var(--green); }
.share-panel__close { border: 0; background: none; padding: 6px; cursor: pointer; color: #333; display: flex; }
.share-panel__close svg { width: 22px; height: 22px; fill: currentColor; }
.share-panel__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; }
.share-item {
	display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 4px; border: 0; background: none;
	font: 600 16px var(--f-ui); color: #111; text-align: left; cursor: pointer; width: 100%;
}
.share-item:hover, .share-item:focus-visible { background: #eef4ec; color: #111; }
.share-item[hidden] { display: none; }
.share-item__icon {
	flex: none; width: 34px; height: 34px; border-radius: 50%; background: #000; color: #fff;
	display: inline-flex; align-items: center; justify-content: center;
}
.share-item:hover .share-item__icon { background: var(--green); }
.share-item__icon svg { width: 18px; height: 18px; fill: currentColor; }
.share-item__icon svg.icon-stroke, .share-btn svg.icon-stroke { fill: none; }
.share-panel__status { margin: 8px 0 0; min-height: 1.4em; font-size: 15px; color: var(--green-dark); font-weight: 600; text-align: center; }
@media (hover: hover) and (pointer: fine) { .share-item--sms { display: none; } }
@media (max-width: 600px) { .share-panel__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .share-item { font-size: 15px; } }
.share-footer { margin: 28px 0; padding-top: 20px; border-top: 1px solid var(--line); }
.share-footer__title { margin-bottom: 12px; }

/* Author box */
.author-box {
	display: flex; gap: 22px; align-items: flex-start;
	margin: 36px 0; padding: 22px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line);
}
.author-box__photo { border-radius: 50%; flex: none; width: 96px; height: 96px; object-fit: cover; }
.author-box__name { font: 700 22px var(--f-ui); margin: 0 0 2px; color: #000; }
.author-box__role { margin: 0 0 8px; font-size: 16px; color: var(--muted); }
.author-box__bio { font-size: 17px; }
.author-box__bio p { margin: 0 0 .7em; }
.author-box__more { margin: 0; font-weight: 600; }
.author-box__more a { color: var(--green); }
.author-box--full { border-top: 0; padding-top: 0; margin-top: 0; }
.author-box--full .author-box__photo { width: 160px; height: 160px; }
.author-box--full .author-box__name { font: 600 44px/1.1 var(--f-head); margin-bottom: 6px; }
.author-box__links { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 18px; }
.author-box__links a { display: inline-flex; align-items: center; gap: 6px; color: var(--green); font-weight: 600; }
.author-box__links svg { width: 18px; height: 18px; fill: currentColor; }

/* Comments */
.comments { max-width: 760px; margin: 40px auto 0; }
.has-ad-sidebar .comments { margin-left: 0; max-width: none; }
.comments__title { font: 700 32px var(--f-ui); }
.comments__note { font-size: 16px; color: #333; }
.comment-list { list-style: none; padding: 0; margin: 20px 0; }
.comment-list .children { list-style: none; padding-left: 28px; }
.comment-body { padding: 16px 0; border-bottom: 1px solid var(--line-soft); }
.comment-author { font-weight: 700; display: flex; align-items: center; gap: 10px; }
.comment-author .avatar { border-radius: 50%; }
.comment-metadata { font-size: 14px; color: var(--muted); }
.comment-reply-title { font: 700 24px var(--f-ui); text-transform: uppercase; margin: 24px 0 8px; }
.comment-form label { display: block; font-weight: 600; margin-bottom: 4px; }
.comment-form input[type="text"], .comment-form input[type="email"], .comment-form input[type="url"], .comment-form textarea {
	width: 100%; border: 1px solid #ccc; border-radius: 12px; padding: 10px 14px; font: 18px var(--f-serif);
}
.comment-form input[type="text"], .comment-form input[type="email"], .comment-form input[type="url"] { max-width: 420px; }
.comment-form .submit {
	background: var(--green); color: #fff; border: 0; padding: 12px 26px; font: 600 17px var(--f-ui);
	border-radius: 3px; cursor: pointer;
}
.comment-form .submit:hover { background: var(--green-dark); }
.comment-form-cookies-consent label { display: inline; font-weight: 400; }

/* Recommended */
.recommended { background: #fff; padding: 20px 0 40px; border-top: 1px solid var(--line-soft); }
.recommended__title {
	font: 400 30px var(--f-logo); text-transform: uppercase; letter-spacing: .3px; color: #000;
	margin: 18px 0 4px;
}
.recommended__title svg { width: .85em; height: .85em; fill: var(--green); vertical-align: -0.08em; margin-left: 4px; }
.card--reco .label { margin: 4px 0 6px; }
.card--reco .label a {
	background: none; border: 0; outline: 0; padding: 0; color: var(--green); font-size: 16px;
}
.card--reco .label a:hover { text-decoration: underline; }
.card--reco .card__title { font-weight: 400; font-size: 21px; }

/* ---------- Archives ---------- */
.layout--archive .layout__main { max-width: 1000px; }
.archive-header { margin-bottom: 30px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.archive-header__title { font: 600 44px/1.1 var(--f-head); }
.archive-header__desc { margin-top: 10px; font-size: 18px; color: #333; }
.archive-header__sub { font: 600 15px var(--f-ui); text-transform: uppercase; letter-spacing: .5px; color: var(--muted); }
.archive-header .search-form { max-width: 420px; margin-top: 16px; }
.post-list { display: flex; flex-direction: column; gap: 30px; }
.card--list { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 26px; padding-bottom: 30px; border-bottom: 1px solid var(--line-soft); }
.card--list .card__body { padding-top: 0; }
.card--list .card__title { font-size: 26px; font-weight: 600; }
.card--page { display: block; }
.pagination { margin-top: 36px; }
.pagination .nav-links { display: flex; flex-wrap: wrap; gap: 6px; }
.pagination .page-numbers {
	display: inline-block; padding: 6px 13px; border: 1px solid var(--line); font-weight: 600;
}
.pagination .page-numbers.current { background: var(--green); border-color: var(--green); color: #fff; }

/* Pages */
.entry--page .entry__title { margin-bottom: 26px; }

/* ---------- Footer ---------- */
.site-footer { background: var(--masthead); }
.site-footer__top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px 40px; padding-top: 34px; padding-bottom: 30px; }
.site-footer .site-title__text { font-size: 34px; }
.site-footer .site-logo { width: 240px; }
.site-footer__contact { margin: 0; font-size: 19px; }
.site-footer__contact a { color: #1a69ea; }
.social--footer { flex-direction: row; gap: 12px; }
.social--footer a { width: 40px; height: 40px; }
.social--footer svg { width: 20px; height: 20px; }
.site-footer__bottom { background: var(--topbar); border-top: 1px solid #c6b8b8; padding: 14px 0; text-align: center; }
.footer-menu { list-style: none; margin: 0 0 6px; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; }
.footer-menu li + li { border-left: 1px solid #c6b8b8; }
.footer-menu a { padding: 0 12px; color: var(--topbar-text); font-size: 17px; }
.copyright { margin: 0; font-size: 16px; color: #333; }

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
	:root { --gutter: 24px; }
	.main-nav__menu a { font-size: 19px; padding: 12px 8px 14px; }
	.search-form { min-width: 160px; }
	.card-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.has-ad-sidebar .layout:not(.layout--archive) { grid-template-columns: minmax(0, 1fr) 270px; gap: 24px; }
	.layout__aside { padding-left: 24px; }
}

@media (max-width: 980px) and (min-width: 901px) {
	.main-nav__menu a { font-size: 17px; padding: 12px 7px 14px; }
	.search-form { min-width: 140px; }
}

@media (max-width: 900px) {
	.site { box-shadow: none; }
	.story-links { grid-template-columns: minmax(0, 1fr); gap: 14px; }
	.story-link, .story-link:first-child { padding: 0; }
	.story-link + .story-link { border-left: 0; border-top: 1px solid #d8d8d8; padding-top: 14px; }
	body { background: #fff; }
	:root { --gutter: 18px; }
	.top-bar__menu { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
	.top-bar__menu a { font-size: 16px; white-space: nowrap; padding: 2px 10px; }

	.masthead__inner { padding-top: 18px; padding-bottom: 18px; gap: 12px; }
	.site-title__text { font-size: clamp(30px, 8.4vw, 52px); }
	.site-logo { width: 240px; }
	.social--header { display: none; }

	.menu-toggle {
		display: inline-flex; flex-direction: column; align-items: center; gap: 4px; flex: none;
		background: none; border: 0; padding: 6px; cursor: pointer; color: #111;
		font: 600 12px var(--f-ui); text-transform: uppercase; letter-spacing: .5px;
	}
	.menu-toggle__bars, .menu-toggle__bars::before, .menu-toggle__bars::after {
		display: block; width: 28px; height: 3px; background: #111; border-radius: 2px; position: relative; content: "";
	}
	.menu-toggle__bars { margin: 8px 0 10px; }
	.menu-toggle__bars::before { position: absolute; top: -8px; }
	.menu-toggle__bars::after { position: absolute; top: 8px; }
	.menu-toggle[aria-expanded="true"] .menu-toggle__bars { background: transparent; }
	.menu-toggle[aria-expanded="true"] .menu-toggle__bars::before { top: 0; transform: rotate(45deg); }
	.menu-toggle[aria-expanded="true"] .menu-toggle__bars::after { top: 0; transform: rotate(-45deg); }

	.nav-bar { box-shadow: none; margin-top: 0; }
	.js .nav-bar { display: none; }
	.js .nav-bar.is-open { display: block; max-height: calc(100vh - var(--hdr-h, 0px)); max-height: calc(100dvh - var(--hdr-h, 0px)); overflow-y: auto; overscroll-behavior: contain; }
	.nav-bar__inner { flex-direction: column; align-items: stretch; padding-top: 8px; padding-bottom: 20px; gap: 16px; }
	.main-nav__menu { flex-direction: column; }
	.main-nav__menu li + li { border-left: 0; border-top: 1px solid var(--line-soft); }
	.main-nav__menu a, .main-nav__menu li:first-child a { padding: 12px 0; font-size: 24px; border-bottom: 0; }
	.main-nav__menu .current-menu-item > a { color: var(--green); }
	.search-form { min-width: 0; }
	.social--menu { display: flex; flex-direction: row; gap: 12px; }
	.social--menu a { width: 42px; height: 42px; }
	.social--menu svg { width: 21px; height: 21px; }

	.site-content { padding-top: 20px; }
	.has-ad-sidebar .layout:not(.layout--archive) { display: block; }
	.layout__aside { margin-top: 32px; }
	.layout__aside .ad-slot { position: static; }
	.layout__aside { padding-left: 0; border-left: 0; border-top: 1px solid var(--line); padding-top: 24px; }
	.layout__aside::before { left: 0; top: -2px; width: 64px; height: 3px; }
	.article-aside .aside-block { display: none; }
	.article-aside__inner, .aside-follow { position: static; gap: 22px; }
	.aside-follow { margin-top: 0; padding-top: 0; border-top: 0; }
	.article-aside__inner > * + * { margin-top: 0; padding-top: 0; border-top: 0; }

	/* Stories: photo first, headline below (as requested). */
	.card--hero { display: flex; flex-direction: column; align-items: stretch; gap: 0; }
	.card--hero .card__media { width: 100%; }
	/* Label sits above the photo here (not beside the title). */
	.card--hero > .label--top { display: block; }
	.card--hero .card__body > .label { display: none; }
	.card--hero .card__body { padding-top: 14px; }
	.card--hero .card__title, .home-section:not(.home-section--lead) .card--hero .card__title { font-size: 30px; }
	.card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 20px; }
	.card-grid--panel { padding: 18px 16px 14px; }
	.home-section--tint { padding: 4px 16px 18px; }

	.entry__title { font-size: 34px; }
	.entry__strap { font-size: 22px; }
	.entry__content { font-size: 20px; }
	.alignleft, .alignright, .entry__content .alignleft, .entry__content .alignright { float: none; margin: 1.2em 0; max-width: 100%; }
	.wp-caption.alignleft, .wp-caption.alignright { width: 100% !important; }
	.alignleft img, .alignright img { width: 100%; }

	.card--list { grid-template-columns: 200px minmax(0, 1fr); gap: 18px; }
	.card--list .card__title { font-size: 21px; }
	.card--list .card__excerpt { font-size: 16px; }
	.archive-header__title { font-size: 34px; }
	.author-box--full { flex-direction: column; }
	.author-box--full .author-box__name { font-size: 36px; }

	.site-footer__top { flex-direction: column; align-items: flex-start; }
}

@media (max-width: 600px) {
	body { font-size: 16px; }
	.card-grid, .card-grid--4 { grid-template-columns: minmax(0, 1fr); }
	.card-grid .card + .card { padding-top: 22px; border-top: 1px solid #d0d0d0; }
	.card-grid--4 .card + .card { border-top: 0; padding-top: 0; }
	.card__title { font-size: 24px; }
	.card--hero .card__title, .home-section:not(.home-section--lead) .card--hero .card__title { font-size: 28px; }
	.card--list { grid-template-columns: minmax(0, 1fr); }
	.read-more { text-align: center; }
	.entry__title { font-size: 28px; }
	.entry__meta { flex-direction: column; align-items: flex-start; }
	.recommended__title { font-size: 24px; }
	.author-box { flex-direction: column; }
	.footer-menu li + li { border-left: 0; }
	.footer-menu { gap: 4px 0; }
}

/* ---------- Cookie bar (fixed to the bottom, so the page never shifts) ---------- */
.consent-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 950; background: #fff; border-top: 1px solid var(--line); box-shadow: 0 -4px 16px rgba(0, 0, 0, .08); }
.consent-bar[hidden] { display: none; }
.consent-bar__inner { max-width: 1240px; margin: 0 auto; padding: 12px var(--gutter, 24px); display: flex; align-items: center; justify-content: space-between; gap: 12px 24px; flex-wrap: wrap; }
.consent-bar__text { margin: 0; font-size: 15px; line-height: 1.45; color: #222; flex: 1 1 420px; }
.consent-bar__text a { color: var(--green); text-decoration: underline; }
.consent-bar__actions { display: flex; gap: 10px; flex: none; }
.consent-btn { font: 600 15px/1 var(--f-ui); padding: 10px 20px; border: 2px solid #111; background: #fff; color: #111; border-radius: 3px; cursor: pointer; }
.consent-btn:hover, .consent-btn:focus-visible { background: #111; color: #fff; }
.cookie-settings { margin: 0 0 4px; }
.cookie-settings__btn { background: none; border: 0; padding: 0; font: inherit; font-size: 15px; color: var(--topbar-text); text-decoration: underline; cursor: pointer; }
/* Phones: compact bar, text beside small stacked buttons. */
@media (max-width: 600px) {
	.consent-bar__inner { padding: 10px var(--gutter, 18px); gap: 8px 12px; flex-wrap: nowrap; }
	.consent-bar__text { font-size: 13.5px; line-height: 1.35; flex: 1 1 auto; }
	.consent-bar__actions { flex-direction: column; gap: 6px; }
	.consent-btn { padding: 7px 12px; font-size: 13.5px; }
}

@media (max-width: 782px) { .admin-bar .site-header { top: calc(46px - var(--mast-h, 0px)); } }
@media (max-width: 600px) { .admin-bar .site-header { top: 0; } }

@media (prefers-reduced-motion: reduce) {
	* { transition: none !important; scroll-behavior: auto !important; }
}

/* Print */
@media print {
	.consent-bar, .cookie-settings, .top-bar, .nav-bar, .menu-toggle, .ad-slot, .comments, .recommended, .share-footer, .entry__share, .share-panel, .newsletter-box, .site-footer { display: none !important; }
	body, .site { background: #fff; }
}