/*
Theme Name: Duck on a Rock
Theme URI: https://duckonarocksports.com/
Author: Duck on a Rock Sports
Description: A loud, personality-first block theme for Duck on a Rock Sports: big headlines, The Crew ribbon, The Feed, Trending, Buddy's Locks, merch drops and a Shopify-ready Duck Shop.
Version: 1.0.1
Requires at least: 6.6
Tested up to: 6.8
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: duck-on-a-rock
*/

:root {
	--doar-ink: #0A0A0A;
	--doar-accent: #C2410C;
	--doar-peach: #F5B08C;
	--doar-paper: #F2EFE8;
	--doar-navy: #1F2A44;
	--doar-anton: Anton, Impact, "Arial Narrow Bold", sans-serif;
}

/* ---------- Accessibility helpers ---------- */
.screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important; }
.screen-reader-text:focus { background: #fff; clip: auto !important; clip-path: none; color: #0A0A0A; display: block; font-size: 14px; height: auto; left: 5px; padding: 15px 23px 14px; top: 5px; width: auto; z-index: 100000; }
:where(a, button, input):focus-visible { outline: 3px solid var(--doar-accent); outline-offset: 2px; }

/* ---------- Header ---------- */
.doar-topbar { background: var(--doar-ink); color: #fff; padding: 10px 24px; margin-top: 0; }
.doar-topbar__inner { max-width: 1320px; margin: 0 auto; gap: 12px 24px; align-items: center; }
.doar-brand { gap: 12px; align-items: center; }
.doar-logo { margin: 0; }
.doar-logo a, .doar-logo img { display: block; }
.doar-logo img { display: block; }
.doar-wordmark { margin: 0; font-family: var(--doar-anton); font-size: 34px; line-height: 1; text-transform: uppercase; letter-spacing: .5px; }
.doar-wordmark a { color: #fff; text-decoration: none; }
.doar-wordmark a:hover { color: var(--doar-peach); }
.doar-wordmark--small { font-size: 24px; }
.doar-navwrap { gap: 4px 8px; align-items: center; }
.doar-nav { gap: 2px 4px; }
.doar-nav .wp-block-navigation-item__content { color: #fff; font-weight: 900; font-size: 15px; letter-spacing: .5px; padding: 12px 10px; text-decoration: none; }
.doar-nav .wp-block-navigation-item__content:hover { color: var(--doar-peach); }
.doar-nav .doar-nav-shop .wp-block-navigation-item__content { color: var(--doar-peach); }
.doar-nav .wp-block-navigation__responsive-container-open,
.doar-nav .wp-block-navigation__responsive-container-close { color: #fff; }
.doar-nav .wp-block-navigation__responsive-container.is-menu-open { background: var(--doar-ink); color: #fff; padding: 32px 24px; }
.doar-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-size: 24px; }
.doar-search .wp-block-search__button { background: transparent; color: #fff; border: 0; padding: 10px; min-width: 44px; min-height: 44px; }
.doar-search .wp-block-search__button svg { fill: currentColor; width: 24px; height: 24px; }
.doar-search .wp-block-search__input { border: 0; }
.doar-cta .wp-block-button__link { padding: 12px 18px; }

/* The Crew ribbon */
.doar-crew { background: var(--doar-accent); color: #fff; padding: 12px 24px; margin-top: 0 !important; }
.doar-crew__row { max-width: 1320px; margin: 0 auto; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 28px; }
.doar-crew__label { font-family: var(--doar-anton); font-size: 20px; }
.doar-crew__person { display: flex; align-items: center; gap: 10px; color: #fff; font-weight: 800; font-size: 15px; text-decoration: none; }
.doar-crew__person:hover { color: var(--doar-ink); }
.doar-crew__person img { border-radius: 50%; border: 3px solid var(--doar-ink); width: 40px; height: 40px; }

/* ---------- Layout ---------- */
.doar-main { padding-top: 32px; padding-bottom: 0; }
.doar-main > * + * { margin-top: 0; }
.doar-section-title { font-size: 44px; border-bottom: 6px solid var(--doar-ink); padding-bottom: 8px; margin: 0 0 8px; }
.doar-section-title--bare { border: 0; padding: 0; margin: 0; }
.doar-split { margin-top: 40px !important; gap: 40px; }
@media (min-width: 782px) {
	.doar-split__main { flex-basis: 68% !important; }
	.doar-split__side { flex-basis: 32% !important; }
}

/* Category kicker: show only the first category */
.doar-kicker { margin: 0; font-size: 13px; }
.doar-kicker a { display: inline-block; font-weight: 900; letter-spacing: 1px; text-transform: uppercase; text-decoration: none; }
.doar-kicker a ~ a, .doar-kicker .wp-block-post-terms__separator { display: none; }
.doar-hero .doar-kicker a, .doar-single > .doar-kicker a { background: var(--doar-accent); color: #fff; padding: 6px 12px; }
.doar-card .doar-kicker a { color: var(--doar-accent); }

/* Byline */
.doar-byline { gap: 6px 14px; align-items: center; font-weight: 700; font-size: 14px; }
.doar-byline > * { margin: 0 !important; }
.doar-byline .wp-block-post-author { align-items: center; }
.doar-byline .wp-block-post-author__avatar { margin-right: 8px; }
.doar-byline .wp-block-post-author__avatar img { border-radius: 50%; display: block; }
.doar-byline .wp-block-post-author__name { margin: 0; font-weight: 700; }

/* ---------- Top story ---------- */
.doar-hero .wp-block-post-template { list-style: none; margin: 0; padding: 0; }
.doar-hero .wp-block-post { position: relative; min-height: 560px; background: var(--doar-navy); display: flex; flex-direction: column; justify-content: flex-end; overflow: hidden; }
.doar-hero__img { position: absolute; inset: 0; margin: 0 !important; height: 100%; }
.doar-hero__img a, .doar-hero__img img { display: block; width: 100%; height: 100% !important; object-fit: cover; }
.doar-hero__img::after { content: ""; position: absolute; inset: 0; background: rgba(10, 10, 10, .5); pointer-events: none; }
.doar-hero__body { position: relative; z-index: 1; padding: 36px; color: #fff; margin: 0 !important; pointer-events: none; }
.doar-hero__body a { pointer-events: auto; }
.doar-hero__title { font-size: clamp(40px, 7vw, 84px); line-height: .98; margin: 14px 0; max-width: 1000px; }
.doar-hero__title a, .doar-hero .doar-byline, .doar-hero .doar-byline a { color: #fff; text-decoration: none; }

/* ---------- Merch drop banner ---------- */
.doar-drop { background: var(--doar-ink); color: #fff; padding: 18px 24px; margin-top: 24px !important; gap: 12px 24px; align-items: center; }
.doar-drop__left { gap: 12px 16px; align-items: center; }
.doar-drop p { margin: 0; }
.doar-drop__tag { background: var(--doar-accent); font-weight: 900; font-size: 13px; letter-spacing: 1px; padding: 6px 10px; }
.doar-drop__text { font-family: var(--doar-anton); font-size: 30px; line-height: 1; text-transform: uppercase; }
.doar-drop__link a { color: var(--doar-peach); font-weight: 900; font-size: 15px; text-decoration: none; }
.doar-drop__link a:hover { color: #fff; }

/* ---------- The Feed ---------- */
.doar-feed .wp-block-post-template { list-style: none; margin: 0; padding: 0; }
.doar-feed .wp-block-post-template > li { border-bottom: 2px solid var(--doar-ink); padding: 24px 0; margin: 0; }
.doar-card { gap: 20px; align-items: flex-start; }
.doar-card__media { flex: 0 0 300px; max-width: 100%; aspect-ratio: 16 / 10; background: #E07A3F; position: relative; overflow: hidden; }
li:nth-child(4n+2) .doar-card__media { background: #1F4A3C; }
li:nth-child(4n+3) .doar-card__media { background: #2F5DA8; }
li:nth-child(4n) .doar-card__media { background: #1E7A5A; }
.doar-card__media .wp-block-post-featured-image { margin: 0; height: 100%; }
.doar-card__media .wp-block-post-featured-image a, .doar-card__media img { display: block; width: 100%; height: 100% !important; object-fit: cover; }
.doar-card__body { flex: 1 1 280px; min-width: 0; }
.doar-card__body > * { margin-top: 0; margin-bottom: 10px; }
.doar-card__title { font-size: 36px; line-height: 1.02; }
.doar-card__title a { color: inherit; text-decoration: none; }
.doar-card__title a:hover { color: var(--doar-accent); }

/* Excerpts */
.doar-card__excerpt p { margin: 0; font-size: 16px; line-height: 1.45; color: #3A3A3A; }
.doar-card__excerpt .wp-block-post-excerpt__more-text { display: none; }
.doar-more .doar-card__excerpt { display: none; }
.doar-hero__excerpt { margin: 0 0 16px; max-width: 760px; }
.doar-hero__excerpt p { margin: 0; font-size: 19px; line-height: 1.45; color: #F2EFE8; }

/* Podcast posts get a play button on their image */
.category-podcast .doar-card__media::before, .category-episodes .doar-card__media::before {
	content: ""; position: absolute; z-index: 1; right: 16px; top: 16px; width: 48px; height: 48px; border-radius: 50%; background: #fff; pointer-events: none;
}
.category-podcast .doar-card__media::after, .category-episodes .doar-card__media::after {
	content: ""; position: absolute; z-index: 2; right: 32px; top: 32px; border-style: solid; border-width: 8px 0 8px 13px; border-color: transparent transparent transparent var(--doar-ink); pointer-events: none;
}

/* Load more */
.doar-loadmore { margin-top: 24px; gap: 10px; }
.doar-loadmore a, .doar-loadmore .page-numbers { background: var(--doar-ink); color: #fff; font-weight: 900; font-size: 16px; padding: 14px 24px; text-decoration: none; display: inline-block; }
.doar-loadmore .page-numbers.current { background: var(--doar-accent); }
.doar-loadmore a:hover { background: var(--doar-accent); color: #fff; }

/* ---------- Sidebar ---------- */
.doar-split__side > * + * { margin-top: 32px; }
.doar-boxhead { background: var(--doar-ink); color: #fff; font-size: 32px; padding: 10px 16px; margin: 0; }
.doar-trending .wp-block-post-template { list-style: none; margin: 0; padding: 0; counter-reset: doar-trend; }
.doar-trending .wp-block-post-template > li { counter-increment: doar-trend; display: flex; gap: 14px; align-items: baseline; padding: 16px 0; border-bottom: 2px solid var(--doar-ink); margin: 0; }
.doar-trending .wp-block-post-template > li::before { content: counter(doar-trend); font-family: var(--doar-anton); font-size: 34px; line-height: 1; color: var(--doar-accent); }
.doar-trending .wp-block-post-title { font-family: inherit; text-transform: none; font-size: 17px; font-weight: 800; line-height: 1.3; margin: 0; }
.doar-trending .wp-block-post-title a { text-decoration: none; }

.doar-locks { background: var(--doar-accent); color: #fff; padding: 24px; }
.doar-locks > * { margin-top: 0; margin-bottom: 12px; }
.doar-locks__title { font-size: 34px; color: #fff; }
.doar-btn-ink .wp-block-button__link { background: var(--doar-ink); color: #fff; }
.doar-btn-ink .wp-block-button__link:hover { background: #fff; color: var(--doar-ink); }

.doar-signup { border: 4px solid var(--doar-ink); padding: 24px; }
.doar-signup > * { margin-top: 0; margin-bottom: 12px; }
.doar-signup__title { font-size: 30px; }

/* ---------- The Duck Shop ---------- */
.doar-shop { margin-top: 64px !important; }
.doar-shop__head { border-bottom: 6px solid var(--doar-ink); padding-bottom: 8px; margin-bottom: 24px; align-items: flex-end; }
.doar-shop__all { margin: 0; }
.doar-shop__all a { color: var(--doar-accent); font-weight: 900; font-size: 15px; text-decoration: none; }
.doar-buybutton-slot { background: var(--doar-paper); border: 3px dashed var(--doar-ink); padding: 32px; }
.doar-shop .shopify-buy-frame { max-width: 100% !important; }

/* ---------- Column tiles ---------- */
.doar-tiles-wrap { margin-top: 64px !important; }
.doar-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; margin-top: 20px; }
.doar-tile { min-height: 140px; padding: 20px; box-sizing: border-box; display: flex; align-items: flex-end; font-family: var(--doar-anton); font-size: 26px; line-height: 1.05; text-transform: uppercase; text-decoration: none; }
.doar-tile:hover { outline: 4px solid var(--doar-ink); outline-offset: -4px; }

/* ---------- Single posts and pages ---------- */
.doar-single > .doar-kicker { margin-bottom: 14px; }
.doar-single-title { line-height: 1; margin: 0 0 16px; }
.doar-single-image { margin-top: 24px; margin-bottom: 24px; }
.doar-tags { font-size: 14px; font-weight: 700; }
.doar-authorbox { border-top: 4px solid var(--doar-ink); border-bottom: 4px solid var(--doar-ink); padding: 20px 0; margin-top: 40px; }
.doar-authorbox .wp-block-post-author__avatar img { border-radius: 50%; }
.doar-authorbox .wp-block-post-author__name { font-weight: 900; font-size: 18px; margin: 0 0 4px; }
.doar-authorbox .wp-block-post-author__bio { font-size: 15px; margin: 0; }
.doar-after-post { margin-top: 48px !important; }
.doar-after-post > .doar-section-title { margin-top: 48px; }
.doar-more .wp-block-post-template { list-style: none; padding: 0; gap: 24px; }
.doar-more .doar-card { flex-direction: column; }
.doar-more .doar-card__media { flex: none; width: 100%; }
.doar-more .doar-card__body { flex: none; width: 100%; }
.doar-more .doar-card__title { font-size: 26px; }
.doar-after-post .doar-signup { margin-top: 40px; }
.doar-archive-head { margin-bottom: 8px; }

/* ---------- Footer ---------- */
.doar-footer { background: var(--doar-ink); color: #fff; padding: 36px 24px 28px; margin-top: 64px !important; }
.doar-footer__inner { max-width: 1320px; margin: 0 auto; gap: 20px; align-items: center; }
.doar-social { gap: 14px; }
.doar-social .wp-social-link, .doar-social .wp-social-link a { color: #fff !important; background: none !important; }
.doar-social .wp-social-link svg { fill: currentColor; width: 24px; height: 24px; }
.doar-social .wp-social-link a:hover { color: var(--doar-peach) !important; }
.doar-copyright { max-width: 1320px; margin: 20px auto 0; font-size: 13px; color: #BDBDBD; }

/* ---------- Small screens ---------- */
@media (max-width: 600px) {
	.doar-hero__excerpt p { font-size: 16px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
	.doar-card__excerpt p { font-size: 15px; }
	.doar-wordmark { font-size: 26px; }
	.doar-hero .wp-block-post { min-height: 420px; }
	.doar-hero__body { padding: 20px; }
	.doar-card__title { font-size: 28px; }
	.doar-drop__text { font-size: 22px; }
	.doar-section-title { font-size: 36px; }
	.doar-topbar, .doar-crew, .doar-footer { padding-left: 16px; padding-right: 16px; }
	.doar-card__media { flex-basis: 100%; }
	.doar-crew__row { gap: 8px 18px; }
}