/*
Theme Name:   Playoffs Wiki Child
Theme URI:    https://playoffswiki.com/
Description:  Child theme of Kadence for Playoffs Wiki: brand colours from the logo, a condensed sports heading font served from the theme, and a cleaner header, cards, buttons and footer. Plugin pages (Playoffs Wiki Hub) keep their own styles.
Author:       Playoffs Wiki
Template:     kadence
Version:      1.2.0
Requires at least: 6.2
Requires PHP: 7.4
License:      GPL-2.0-or-later
License URI:  https://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  playoffswiki-child
*/

/* ---------------------------------------------------------------- brand */
/* Colours taken from the logo: navy "Playoffs", blue "Wiki", amber dot. */
:root {
	--pwc-navy: #152c4f;
	--pwc-navy-deep: #0e1d36;
	--pwc-blue: #2b6cb0;
	--pwc-blue-dark: #215387;
	--pwc-amber: #f6ad37;
	--pwc-ink: #0f172a;
	--pwc-text: #334155;
	--pwc-muted: #64748b;
	--pwc-line: #e5e9f0;
	--pwc-soft: #f6f8fb;
	--pwc-radius: 14px;
	--pwc-shadow: 0 1px 2px rgba(15, 23, 42, .05), 0 8px 24px -16px rgba(15, 23, 42, .25);
	--pwc-head: "Barlow Condensed", "Arial Narrow", "Roboto Condensed", system-ui, sans-serif;

	/* Kadence global palette, matched to the brand. This file loads after the Customizer palette, so change colours here. */
	--global-palette1: #2b6cb0;
	--global-palette2: #215387;
	--global-palette3: #152c4f;
	--global-palette4: #1e293b;
	--global-palette5: #475569;
	--global-palette6: #64748b;
	--global-palette7: #e8eef6;
	--global-palette8: #f6f8fb;
	--global-palette9: #ffffff;
}

/* ---------------------------------------------------------------- fonts (served from the theme, no Google request) */
@font-face {
	font-family: "Barlow Condensed";
	font-style: normal;
	font-weight: 600 700;
	font-display: swap;
	src: url("assets/fonts/barlow-condensed-700.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ---------------------------------------------------------------- base */
body {
	color: var(--pwc-text);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}
::selection { background: rgba(246, 173, 55, .35); color: var(--pwc-ink); }

h1, h2, h3, h4,
.entry-title, .site-title, .widget-title, .wp-block-heading {
	font-family: var(--pwc-head);
	font-weight: 700;
	letter-spacing: .005em;
	color: var(--pwc-navy);
	line-height: 1.12;
}
h1, .entry-title { font-size: clamp(2rem, 1.4rem + 2.4vw, 3rem); }
h2 { font-size: clamp(1.6rem, 1.25rem + 1.3vw, 2.1rem); }
h3 { font-size: clamp(1.3rem, 1.15rem + .6vw, 1.55rem); }
h4 { font-size: 1.2rem; font-weight: 600; }

a { color: var(--pwc-blue); text-underline-offset: .18em; text-decoration-thickness: 1px; }
a:hover { color: var(--pwc-blue-dark); }

:focus-visible { outline: 3px solid var(--pwc-amber); outline-offset: 2px; border-radius: 4px; }

/* ---------------------------------------------------------------- header */
#masthead .site-main-header-wrap .site-header-row-container-inner,
#masthead .site-header-upper-wrap .site-header-row-container-inner {
	background: #fff;
}
#masthead {
	box-shadow: 0 1px 0 var(--pwc-line), 0 10px 30px -24px rgba(15, 23, 42, .35);
	position: relative;
	z-index: 20;
}
#masthead::after { /* thin brand stripe under the header */
	content: "";
	display: block;
	height: 3px;
	background: linear-gradient(90deg, var(--pwc-navy) 0%, var(--pwc-blue) 60%, var(--pwc-amber) 100%);
}
.header-navigation .header-menu-container > ul > li > a,
.main-navigation .primary-menu-container > ul > li.menu-item > a {
	font-family: var(--pwc-head);
	font-weight: 700;
	font-size: 1.16rem;
	letter-spacing: .035em;
	text-transform: uppercase;
	color: var(--pwc-navy);
	position: relative;
}
.header-navigation .header-menu-container > ul > li > a::after,
.main-navigation .primary-menu-container > ul > li.menu-item > a::after {
	content: "";
	position: absolute;
	left: 50%;
	right: 50%;
	bottom: .35em;
	height: 3px;
	border-radius: 3px;
	background: var(--pwc-amber);
	transition: left .18s ease, right .18s ease;
}
.header-navigation .header-menu-container > ul > li > a:hover::after,
.header-navigation .header-menu-container > ul > li.current-menu-item > a::after,
.header-navigation .header-menu-container > ul > li.current-menu-ancestor > a::after,
.main-navigation .primary-menu-container > ul > li.current-menu-item > a::after {
	left: .9em;
	right: .9em;
}
.header-navigation .header-menu-container > ul > li > a:hover,
.header-navigation .header-menu-container > ul > li.current-menu-item > a,
.header-navigation .header-menu-container > ul > li.current-menu-ancestor > a,
.main-navigation .primary-menu-container > ul > li.current-menu-item > a { color: var(--pwc-blue); }
.custom-logo { height: auto; }

/* the Customizer sets its own current-item colour with a stronger selector */
#masthead .header-navigation .header-menu-container ul li.current-menu-item > a,
#masthead .header-navigation .header-menu-container ul li.current-menu-ancestor > a { color: var(--pwc-blue) !important; }

/* mobile drawer */
.mobile-navigation ul li > a, .mobile-navigation ul li .drawer-nav-drop-wrap > a {
	font-family: var(--pwc-head);
	font-weight: 700;
	font-size: 1.15rem;
	letter-spacing: .03em;
	text-transform: uppercase;
}
#mobile-drawer .drawer-inner { background: var(--pwc-navy); }

/* ---------------------------------------------------------------- content */
.content-style-boxed .content-bg,
.content-style-boxed .entry.single-entry,
.loop-entry.content-bg,
.entry.loop-entry {
	border-radius: var(--pwc-radius);
	box-shadow: var(--pwc-shadow);
	border: 1px solid var(--pwc-line);
	overflow: hidden;
}
.entry-content > p, .entry-content > ul, .entry-content > ol { line-height: 1.72; }
.entry-content blockquote, .wp-block-quote {
	border-left: 4px solid var(--pwc-amber);
	background: var(--pwc-soft);
	border-radius: 0 10px 10px 0;
	padding: 14px 18px;
	color: var(--pwc-ink);
}

/* blog and archive cards */
.loop-entry .entry-title { font-size: clamp(1.35rem, 1.2rem + .5vw, 1.6rem); line-height: 1.15; }
.loop-entry .entry-title a { color: var(--pwc-navy); text-decoration: none; }
.loop-entry .entry-title a:hover { color: var(--pwc-blue); }
.loop-entry .post-thumbnail-inner img { transition: transform .35s ease; }
.loop-entry:hover .post-thumbnail-inner img { transform: scale(1.03); }
.entry-meta, .entry-taxonomies { font-size: .85rem; color: var(--pwc-muted); }
.entry-taxonomies a, .category-links a {
	background: rgba(43, 108, 176, .1);
	color: var(--pwc-blue-dark) !important;
	border-radius: 999px;
	padding: 2px 10px;
	font-weight: 600;
	text-decoration: none;
}

/* buttons (Kadence, Gutenberg and plain .button) */
.button, button.button, input[type="submit"],
.wp-block-button__link, .kb-button, .entry-content .wp-block-button .wp-block-button__link {
	border-radius: 10px;
	font-weight: 700;
	letter-spacing: .01em;
	transition: background-color .15s ease, transform .15s ease, box-shadow .15s ease;
}
.button:hover, .wp-block-button__link:hover, .kb-button:hover, input[type="submit"]:hover {
	transform: translateY(-1px);
	box-shadow: 0 8px 18px -10px rgba(21, 44, 79, .6);
}

/* tables in normal posts (plugin tables keep their own look) */
.entry-content .wp-block-table table, .entry-content > table {
	border-collapse: separate;
	border-spacing: 0;
	border: 1px solid var(--pwc-line);
	border-radius: 12px;
	overflow: hidden;
	width: 100%;
}
.entry-content .wp-block-table th, .entry-content > table th {
	background: var(--pwc-navy);
	color: #fff;
	font-weight: 700;
	text-align: left;
}
.entry-content .wp-block-table td, .entry-content .wp-block-table th,
.entry-content > table td, .entry-content > table th { padding: 10px 12px; border: 0; border-bottom: 1px solid var(--pwc-line); }
.entry-content .wp-block-table tr:nth-child(even) td, .entry-content > table tr:nth-child(even) td { background: var(--pwc-soft); }

/* ---------------------------------------------------------------- footer */
#colophon .site-footer-wrap,
#colophon .site-middle-footer-wrap .site-footer-row-container-inner,
#colophon .site-bottom-footer-wrap .site-footer-row-container-inner,
#colophon .site-top-footer-wrap .site-footer-row-container-inner {
	background: var(--pwc-navy-deep);
	color: #cbd5e1;
}
#colophon::before {
	content: "";
	display: block;
	height: 3px;
	background: linear-gradient(90deg, var(--pwc-amber), var(--pwc-blue) 45%, var(--pwc-navy) 100%);
}
#colophon a,
#colophon .footer-navigation .footer-menu-container ul li a { color: #e2e8f0 !important; text-decoration: none; }
#colophon a:hover,
#colophon .footer-navigation .footer-menu-container ul li a:hover { color: var(--pwc-amber) !important; }
#colophon .widget-title, #colophon h2, #colophon h3, #colophon h4 { color: #fff; }
#colophon .footer-navigation a, #colophon .footer-menu-container a {
	font-family: var(--pwc-head);
	font-weight: 600;
	font-size: 1.02rem;
	letter-spacing: .03em;
	text-transform: uppercase;
}
.site-bottom-footer-inner-wrap { border-top: 1px solid rgba(255, 255, 255, .08); }

/* ---------------------------------------------------------------- small screens */
@media (max-width: 767px) {
	.content-style-boxed .content-bg, .content-style-boxed .entry.single-entry { border-radius: 12px; }
	h1, .entry-title { line-height: 1.08; }
}

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

/* ================================================================ homepage (front-page.php) */
.pwh { display: block; }
.pwh-inner { max-width: 1180px; margin: 0 auto; padding: 0 20px; }
.pwh-section { padding: 46px 0; }
.pwh-section + .pwh-section { padding-top: 0; }
.pwh-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin: 0 0 18px; }
.pwh-head h2 { margin: 0; font-size: clamp(1.6rem, 1.3rem + 1.2vw, 2.2rem); }
.pwh-head p { margin: 0; color: var(--pwc-muted); font-size: .95rem; }
.pwh-more { font-family: var(--pwc-head); font-weight: 700; font-size: 1.05rem; letter-spacing: .02em; text-decoration: none; white-space: nowrap; }
.pwh-tag { display: inline-block; font-family: var(--pwc-head); font-weight: 700; font-size: .8rem; letter-spacing: .06em; text-transform: uppercase; color: var(--pwc-blue-dark); background: rgba(43, 108, 176, .1); border-radius: 999px; padding: 3px 10px; }
.pwh-live { display: inline-block; font: 700 .72rem/1 var(--pwc-head); letter-spacing: .08em; color: #fff; background: #dc2626; border-radius: 6px; padding: 5px 8px; animation: pwh-pulse 1.6s infinite; }
@keyframes pwh-pulse { 50% { opacity: .55; } }

/* hero */
.pwh-hero { background: radial-gradient(1200px 500px at 10% -10%, rgba(43, 108, 176, .55), transparent 60%), linear-gradient(135deg, #0e1d36 0%, #152c4f 55%, #1b3a6b 100%); color: #fff; padding: 56px 0 50px; position: relative; overflow: hidden; }
.pwh-hero::after { content: ""; position: absolute; inset: auto 0 0 0; height: 4px; background: linear-gradient(90deg, var(--pwc-amber), var(--pwc-blue) 50%, transparent); }
.pwh-hero::before { content: ""; position: absolute; right: -40px; top: -30px; width: 520px; height: 420px; opacity: .07; pointer-events: none; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 520 420' fill='none' stroke='%23fff' stroke-width='6' stroke-linecap='round'%3E%3Cpath d='M20 40h120M20 110h120M140 40v70M140 75h120M20 190h120M20 260h120M140 190v70M140 225h120M260 75v150M260 150h130M20 330h120M20 400h120M140 330v70M140 365h120'/%3E%3Ccircle cx='410' cy='150' r='22' fill='%23f6ad37' stroke='none'/%3E%3C/svg%3E") no-repeat right top / contain; }
.pwh-hero > .pwh-inner { position: relative; }
.pwh-hero-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 40px; align-items: center; }
.pwh-kicker { margin: 0 0 10px; font: 700 .9rem/1 var(--pwc-head); letter-spacing: .12em; text-transform: uppercase; color: var(--pwc-amber); }
.pwh-hero h1 { margin: 0 0 14px; color: #fff; font-size: clamp(2.6rem, 1.8rem + 3.4vw, 4.4rem); line-height: .98; letter-spacing: .005em; }
.pwh-hero h1 span { color: #9cc3ef; }
.pwh-lede { margin: 0 0 24px; max-width: 560px; font-size: 1.08rem; line-height: 1.6; color: #d7e1ef; }
.pwh-hero-cta { display: flex; gap: 12px; flex-wrap: wrap; }
.pwh-btn { display: inline-block; font-family: var(--pwc-head); font-weight: 700; font-size: 1.1rem; letter-spacing: .03em; text-transform: uppercase; text-decoration: none; padding: 12px 20px; border-radius: 10px; transition: transform .15s ease, background .15s ease; }
.pwh-btn:hover { transform: translateY(-1px); }
.pwh-btn-primary { background: var(--pwc-amber); color: #152c4f !important; }
.pwh-btn-primary:hover { background: #ffc15c; }
.pwh-btn-ghost { border: 1px solid rgba(255, 255, 255, .35); color: #fff !important; }
.pwh-btn-ghost:hover { background: rgba(255, 255, 255, .08); }
.pwh-status { display: grid; gap: 6px; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .12); border-radius: 16px; padding: 10px; backdrop-filter: blur(6px); }
.pwh-status-row { display: grid; grid-template-columns: 52px 1fr 10px; align-items: center; gap: 12px; padding: 9px 12px; border-radius: 10px; color: #fff; text-decoration: none; transition: background .15s ease; }
.pwh-status-row:hover { background: rgba(255, 255, 255, .1); color: #fff; }
.pwh-status-row b { font-family: var(--pwc-head); font-weight: 700; font-size: 1.05rem; letter-spacing: .04em; }
.pwh-status-row span { font-size: .93rem; color: #d7e1ef; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pwh-status-row i { width: 9px; height: 9px; border-radius: 50%; background: #64748b; }
.pwh-status-row.is-live i { background: #ef4444; box-shadow: 0 0 0 4px rgba(239, 68, 68, .25); animation: pwh-pulse 1.6s infinite; }
.pwh-status-row.is-soon i { background: var(--pwc-amber); }
.pwh-status-row.is-season i { background: #60a5fa; }

/* next games */
.pwh-next { margin-top: -22px; position: relative; z-index: 2; }
.pwh-games { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.pwh-game { display: flex; flex-direction: column; gap: 10px; background: #fff; border: 1px solid var(--pwc-line); border-radius: var(--pwc-radius); box-shadow: var(--pwc-shadow); padding: 14px 16px; color: inherit; text-decoration: none; transition: transform .15s ease, box-shadow .15s ease; }
.pwh-game:hover { transform: translateY(-2px); box-shadow: 0 16px 30px -18px rgba(21, 44, 79, .45); }
.pwh-game.is-live { border-color: #fca5a5; }
.pwh-game-top { display: flex; justify-content: space-between; align-items: center; }
.pwh-game-teams { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; }
.pwh-game-teams > span { display: flex; align-items: center; gap: 8px; min-width: 0; }
.pwh-game-teams > span:last-child { justify-content: flex-end; }
.pwh-game-teams b { font-family: var(--pwc-head); font-weight: 700; font-size: 1.2rem; color: var(--pwc-navy); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pwh-game-teams em { font-style: normal; font-weight: 800; font-size: 1.3rem; color: var(--pwc-ink); }
.pwh-game-teams .pw-logo, .pwh-game-teams img { width: 28px; height: 28px; object-fit: contain; flex: 0 0 28px; }
.pwh-at { font-size: .78rem; color: var(--pwc-muted); text-transform: uppercase; letter-spacing: .08em; }
.pwh-game-when { display: flex; justify-content: space-between; gap: 8px; font-size: .85rem; color: var(--pwc-muted); border-top: 1px dashed var(--pwc-line); padding-top: 8px; }
.pwh-game-when time { font-weight: 600; color: var(--pwc-navy); }

/* round in progress (plugin cards inside) */
.pwh-plugin { background: #fff; border: 1px solid var(--pwc-line); border-radius: var(--pwc-radius); padding: 18px 18px 6px; box-shadow: var(--pwc-shadow); }
.pwh-plugin .pw-legend { margin-bottom: 10px; }

/* league hubs */
.pwh-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.pwh-card { background: #fff; border: 1px solid var(--pwc-line); border-radius: var(--pwc-radius); box-shadow: var(--pwc-shadow); overflow: hidden; display: flex; flex-direction: column; transition: transform .15s ease, box-shadow .15s ease; }
.pwh-card:hover { transform: translateY(-2px); box-shadow: 0 16px 30px -18px rgba(21, 44, 79, .45); }
.pwh-card-top { display: block; padding: 18px 18px 14px; color: inherit; text-decoration: none; flex: 1; border-top: 4px solid var(--pwc-blue); }
.pwh-card.is-live .pwh-card-top { border-top-color: #ef4444; }
.pwh-card.is-soon .pwh-card-top { border-top-color: var(--pwc-amber); }
.pwh-badge { display: inline-block; font: 700 .78rem/1 var(--pwc-head); letter-spacing: .08em; color: #fff; background: var(--pwc-navy); border-radius: 6px; padding: 5px 8px; margin-bottom: 10px; }
.pwh-card h3 { margin: 0 0 6px; font-size: 1.35rem; line-height: 1.1; }
.pwh-card p { margin: 0; font-size: .9rem; color: var(--pwc-muted); }
.pwh-card.is-live p { color: #b91c1c; font-weight: 600; }
.pwh-card-links { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--pwc-line); background: var(--pwc-soft); }
.pwh-card-links a { text-align: center; padding: 10px 4px; font: 700 .82rem/1 var(--pwc-head); letter-spacing: .05em; text-transform: uppercase; color: var(--pwc-navy); text-decoration: none; }
.pwh-card-links a + a { border-left: 1px solid var(--pwc-line); }
.pwh-card-links a:hover { background: #fff; color: var(--pwc-blue); }

/* calendar */
.pwh-timeline { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.pwh-timeline a { display: grid; grid-template-columns: 58px 1fr; gap: 12px; align-items: center; background: #fff; border: 1px solid var(--pwc-line); border-radius: 12px; padding: 10px 12px; color: inherit; text-decoration: none; }
.pwh-timeline a:hover { border-color: var(--pwc-blue); }
.pwh-timeline time { display: flex; flex-direction: column; align-items: center; justify-content: center; background: var(--pwc-navy); color: #fff; border-radius: 10px; padding: 6px 0; }
.pwh-timeline time b { font: 700 1.5rem/1 var(--pwc-head); }
.pwh-timeline time small { font: 700 .68rem/1 var(--pwc-head); letter-spacing: .08em; text-transform: uppercase; color: var(--pwc-amber); margin-top: 2px; }
.pwh-timeline li.is-now time { background: #b91c1c; }
.pwh-timeline span { font-weight: 600; color: var(--pwc-ink); font-size: .95rem; }
.pwh-timeline span em { font-style: normal; font: 700 .72rem/1 var(--pwc-head); letter-spacing: .06em; color: var(--pwc-blue); margin-right: 8px; }
.pwh-timeline span small { font-weight: 400; color: var(--pwc-muted); white-space: nowrap; }

/* posts */
.pwh-postgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.pwh-post { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--pwc-line); border-radius: var(--pwc-radius); overflow: hidden; box-shadow: var(--pwc-shadow); color: inherit; text-decoration: none; transition: transform .15s ease, box-shadow .15s ease; }
.pwh-post:hover { transform: translateY(-2px); box-shadow: 0 16px 30px -18px rgba(21, 44, 79, .45); }
.pwh-post-img img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.pwh-post-body { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 8px; }
.pwh-post h3 { margin: 0; font-size: 1.25rem; line-height: 1.15; }
.pwh-post p { margin: 0; font-size: .92rem; color: var(--pwc-text); line-height: 1.55; }
.pwh-post small { color: var(--pwc-muted); font-size: .8rem; }

/* trust */
.pwh-trust ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.pwh-trust li { background: var(--pwc-soft); border: 1px solid var(--pwc-line); border-radius: 12px; padding: 16px 18px; }
.pwh-trust b { display: block; font-family: var(--pwc-head); font-size: 1.15rem; color: var(--pwc-navy); margin-bottom: 4px; }
.pwh-trust span { font-size: .9rem; color: var(--pwc-text); }

@media (max-width: 1024px) {
	.pwh-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.pwh-hero-grid { grid-template-columns: 1fr; gap: 28px; }
}
@media (max-width: 767px) {
	.pwh-section { padding: 34px 0; }
	.pwh-hero { padding: 40px 0 36px; }
	.pwh-games, .pwh-postgrid, .pwh-timeline, .pwh-trust ul { grid-template-columns: 1fr; }
	.pwh-head { flex-direction: column; align-items: flex-start; gap: 4px; }
	.pwh-status-row span { white-space: normal; }
}
@media (max-width: 480px) {
	.pwh-grid { grid-template-columns: 1fr; }
}