/*
Theme Name: GungeGirls Channel
Description: A dark, cinematic design for GungeGirls.com. Child theme of Ollie from the WordPress.org theme directory.
Template: ollie
Version: 2.0.0
Requires at least: 7.0
Requires PHP: 7.4
Text Domain: gungegirls-channel
License: GNU General Public License v2 or later
*/

/* ==================================================================
   Tokens
================================================================== */
:root {
	--gg-bg: var(--wp--preset--color--base);
	--gg-surface: var(--wp--preset--color--tertiary);
	--gg-raised: var(--wp--preset--color--surface);
	--gg-text: var(--wp--preset--color--main);
	--gg-muted: var(--wp--preset--color--main-accent);
	--gg-lime: var(--wp--preset--color--primary);
	--gg-pink: var(--wp--preset--color--primary-alt);
	--gg-custard: var(--wp--preset--color--custard);
	--gg-line: rgba(255, 255, 255, .085);
	--gg-line-strong: rgba(255, 255, 255, .16);
	--gg-display: var(--wp--preset--font-family--display);
	--gg-sans: var(--wp--preset--font-family--primary);
	--gg-wide: var(--wp--preset--font-family--expanded);
	--gg-bar-h: 72px;
	--gg-radius: 18px;
	--gg-ease: cubic-bezier(.2, .8, .2, 1);
	--gg-accent: var(--gg-lime);
	--gg-drop: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 32'%3E%3Cpath d='M13 1.5C13 1.5 2.2 14.3 2.2 20.6a10.8 10.8 0 0 0 21.6 0C23.8 14.3 13 1.5 13 1.5z' fill='%23B8FF3C'/%3E%3Cellipse cx='8.8' cy='20.2' rx='2.2' ry='3.6' fill='%23ffffff' opacity='.55'/%3E%3C/svg%3E");
	--gg-drop-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 32'%3E%3Cpath d='M13 1.5C13 1.5 2.2 14.3 2.2 20.6a10.8 10.8 0 0 0 21.6 0C23.8 14.3 13 1.5 13 1.5z'/%3E%3C/svg%3E");
	--gg-drip: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 32' preserveAspectRatio='none'%3E%3Cpath d='M0 0H300V7Q292.41 9.5 284.82 7C280.82 7 279.82 9 279.82 13V15.13A4.5 4.5 0 1 1 272.18 15.13V13C272.18 9 271.18 7 267.18 7Q258.85 9.5 250.53 7C246.53 7 245.53 9 245.53 13V21.08A6.5 6.5 0 1 1 234.47 21.08V13C234.47 9 233.47 7 229.47 7Q221.22 9.5 212.97 7C208.97 7 207.97 9 207.97 13V14.66A3.5 3.5 0 1 1 202.03 14.66V13C202.03 9 201.03 7 197.03 7Q188.35 9.5 179.68 7C175.68 7 174.68 9 174.68 13V17.6A5.5 5.5 0 1 1 165.32 17.6V13C165.32 9 164.32 7 160.32 7Q148.57 9.5 136.82 7C132.82 7 131.82 9 131.82 13V14.13A4.5 4.5 0 1 1 124.17 14.13V13C124.17 9 123.17 7 119.17 7Q112.56 9.5 105.95 7C101.95 7 100.95 9 100.95 13V19.31A7 7 0 1 1 89.05 19.31V13C89.05 9 88.05 7 84.05 7Q75.01 9.5 65.97 7C61.98 7 60.98 9 60.98 13V13.66A3.5 3.5 0 1 1 55.02 13.66V13C55.02 9 54.02 7 50.02 7Q43.85 9.5 37.67 7C33.67 7 32.67 9 32.67 13V15.6A5.5 5.5 0 1 1 23.32 15.6V13C23.32 9 22.32 7 18.32 7Q9.16 9.5 0 7Z'/%3E%3C/svg%3E");
	--gg-grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .6 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

html { color-scheme: dark; scroll-padding-top: calc(var(--gg-bar-h) + 16px); }
body { overflow-x: clip; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; }
::selection { background: var(--gg-lime); color: var(--gg-bg); }
:where(a, button, input, select, textarea, summary):focus-visible { outline: 2px solid var(--gg-lime); outline-offset: 3px; border-radius: 6px; }
img { height: auto; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }

/* Category colours: slime = lime, pies = pink, custard = yellow */
.gg-accent-slime { --gg-accent: var(--gg-lime); }
.gg-accent-pink { --gg-accent: var(--gg-pink); }
.gg-accent-custard { --gg-accent: var(--gg-custard); }
body.category-slimed, body.category-white-slime, body.category-strip-or-slime { --gg-accent: var(--gg-lime); }
body.category-pied-girls, body.category-pietargets { --gg-accent: var(--gg-pink); }
body.category-custard-corner, body.category-clothes-or-custard { --gg-accent: var(--gg-custard); }

/* ==================================================================
   Header: frosted bar that stays at the top
================================================================== */
.wp-site-blocks > .wp-block-template-part:first-child {
	position: sticky; top: var(--wp-admin--admin-bar--height, 0px); z-index: 100; margin-block-start: 0;
}
@media (max-width: 600px) { .wp-site-blocks > .wp-block-template-part:first-child { top: 0; } }
.wp-site-blocks > * + * { margin-block-start: 0; }

.gg-bar { position: relative; isolation: isolate; }
.gg-bar::before {
	content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
	background: rgba(11, 11, 14, .66); border-bottom: 1px solid var(--gg-line);
	-webkit-backdrop-filter: blur(18px) saturate(1.5); backdrop-filter: blur(18px) saturate(1.5);
}
.gg-bar__inner { min-height: var(--gg-bar-h); }

.wp-block-site-title { line-height: .9; letter-spacing: .005em; }
.wp-block-site-title a { display: inline-flex; align-items: center; color: var(--gg-text); text-decoration: none; }
.gg-drop { flex: none; width: .56em; height: .7em; margin-right: .22em; background: var(--gg-drop) center / contain no-repeat; transform-origin: 50% 90%; transition: transform .5s var(--gg-ease); }
.wp-block-site-title a:hover .gg-drop { transform: rotate(-12deg) scale(1.1); }
.gg-tld { color: var(--gg-lime); }
.gg-bar .wp-block-site-title { font-size: 1.95rem; }
.gg-bar .wp-block-site-title a:hover { color: var(--gg-text); }

/* Menu */
.gg-nav { font-size: .9rem; font-weight: 600; letter-spacing: .005em; }
.gg-nav .wp-block-navigation__container { gap: .15rem; }
.gg-nav .wp-block-navigation-item__content { padding: .55em .95em; border-radius: 999px; color: rgba(244, 241, 234, .82); transition: color .2s, background-color .2s; }
.gg-nav .wp-block-navigation-item__content:hover { color: var(--gg-text); background: rgba(255, 255, 255, .07); }
.gg-nav .current-menu-item > .wp-block-navigation-item__content { color: var(--gg-lime); }
.gg-nav .wp-block-navigation-item__content[href*="store"] { margin-left: .5rem; background: var(--gg-lime); color: var(--gg-bg); padding-left: 1.15em; padding-right: 1.15em; font-weight: 700; }
.gg-nav .wp-block-navigation-item__content[href*="store"]:hover { background: var(--gg-text); color: var(--gg-bg); }
.gg-nav .wp-block-navigation-submenu > .wp-block-navigation-item__content { padding-right: .3em; }
.gg-nav .wp-block-navigation__submenu-icon { margin: 0 .6em 0 0; }
.gg-nav .wp-block-navigation__submenu-container {
	background: var(--gg-raised) !important; color: var(--gg-text) !important; border: 1px solid var(--gg-line) !important; border-radius: 16px;
	padding: .4rem; min-width: 300px !important; margin-top: .5rem; box-shadow: 0 30px 60px -18px rgba(0, 0, 0, .7);
}
.gg-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content { border-radius: 10px; padding: .75em .9em; line-height: 1.3; }

/* Phone menu */
.gg-nav .wp-block-navigation__responsive-container-open { color: var(--gg-text); background: rgba(255, 255, 255, .08); border-radius: 999px; padding: .6rem; }
.gg-nav .wp-block-navigation__responsive-container.is-menu-open { background: var(--gg-bg) !important; color: var(--gg-text) !important; padding: 1.25rem clamp(1rem, 4vw, 2.5rem) 2rem; }
.gg-nav .wp-block-navigation__responsive-container.is-menu-open { overflow-x: hidden; }
.gg-nav .wp-block-navigation__responsive-container.is-menu-open::before { content: ""; position: absolute; inset: auto 0 0 0; height: 70%; background: radial-gradient(closest-side, rgba(184, 255, 60, .18), transparent); pointer-events: none; }
.gg-nav .wp-block-navigation__responsive-container-close { color: var(--gg-text); background: rgba(255, 255, 255, .08); border-radius: 999px; padding: .55rem; }
.gg-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 4rem; align-items: flex-start; }
.gg-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container,
.gg-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { align-items: flex-start; gap: .25rem; }
.gg-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	font-family: var(--gg-display); font-size: clamp(3rem, 14vw, 4.5rem); font-weight: 900; text-transform: uppercase; line-height: .95; padding: .05em .15em; margin: 0; color: var(--gg-text); background: none;
}
.gg-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover { color: var(--gg-lime); }
.gg-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content[href*="store"] { color: var(--gg-lime); background: none; }
.gg-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container { background: transparent !important; border: 0 !important; box-shadow: none; padding: 0 0 .5rem .2rem; min-width: 0 !important; margin: 0; }
.gg-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content { font-family: var(--gg-sans); font-size: 1.05rem; font-weight: 600; text-transform: none; color: var(--gg-muted); line-height: 1.4; }

/* ==================================================================
   Pills
================================================================== */
.gg-pills { display: flex; flex-wrap: wrap; align-items: center; margin: 0; font-family: var(--gg-wide); font-size: .58rem; font-weight: 750; letter-spacing: .11em; line-height: 1.5; text-transform: uppercase; }
.gg-pills .wp-block-post-terms__separator { font-size: 0; }
.gg-pills .wp-block-post-terms__separator::before { content: "·"; margin: 0 .45rem; font-size: .7rem; color: rgba(244, 241, 234, .35); }
.gg-pills a { --pill-fg: rgba(244, 241, 234, .7); color: var(--pill-fg); transition: color .2s; }
.gg-pills a:hover { color: var(--gg-text); }
.gg-pills a[href*="/category/slimed/"], .gg-pills a[href*="/category/white-slime/"], .gg-pills a[href*="/category/strip-or-slime/"] { --pill-fg: var(--gg-lime); }
.gg-pills a[href*="/category/pied-girls/"], .gg-pills a[href*="/category/pietargets/"] { --pill-fg: var(--gg-pink); }
.gg-pills a[href*="/category/custard-corner/"], .gg-pills a[href*="/category/clothes-or-custard/"] { --pill-fg: var(--gg-custard); }

/* Tags and date share one line under the title */
.gg-meta-row { gap: .3rem .9rem !important; align-items: center; margin-top: .5rem !important; }
.gg-meta-row .wp-block-post-date { font-size: .74rem; margin: 0; }

/* ==================================================================
   Homepage hero: the latest update, full screen
================================================================== */
.gg-front > .gg-hero:first-child { margin-top: calc(-1 * var(--gg-bar-h)) !important; }
.gg-hero .wp-block-post-template, .gg-hero .wp-block-post-template > li { margin: 0; padding: 0; list-style: none; }
.gg-hero__cover {
	min-height: clamp(600px, 94vh, 1040px) !important; align-items: flex-end !important; overflow: hidden;
	padding: calc(var(--gg-bar-h) + 2rem) var(--wp--style--root--padding-right) clamp(3rem, 9vh, 6.5rem) var(--wp--style--root--padding-left) !important;
}
.gg-hero__cover .wp-block-cover__image-background { object-position: 50% 28%; animation: gg-settle 2.4s var(--gg-ease) both;
	-webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 28%, #000 58%, transparent 94%); mask-image: linear-gradient(90deg, transparent 0%, #000 28%, #000 58%, transparent 94%); }
@keyframes gg-settle { from { transform: scale(1.08); filter: saturate(.6) brightness(.7); } to { transform: scale(1); filter: none; } }
.gg-hero__cover .wp-block-cover__background {
	opacity: 1 !important;
	background:
		linear-gradient(180deg, rgba(11, 11, 14, .6) 0%, rgba(11, 11, 14, 0) 18%, rgba(11, 11, 14, 0) 55%, rgba(11, 11, 14, .7) 84%, var(--gg-bg) 100%),
		linear-gradient(90deg, rgba(11, 11, 14, .8) 0%, rgba(11, 11, 14, .3) 30%, rgba(11, 11, 14, 0) 50%),
		linear-gradient(270deg, rgba(11, 11, 14, .75) 0%, rgba(11, 11, 14, 0) 22%) !important;
}
.gg-hero__cover::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: var(--gg-grain); opacity: .09; mix-blend-mode: overlay; }
.gg-hero__cover .wp-block-cover__inner-container { position: relative; z-index: 2; width: 100%; max-width: var(--wp--style--global--wide-size); margin-inline: auto; }
.gg-hero__content { max-width: 620px; }
.gg-hero__content > * { animation: gg-rise .9s var(--gg-ease) both; }
.gg-hero__content > :nth-child(2) { animation-delay: .08s; }
.gg-hero__content > :nth-child(3) { animation-delay: .16s; }
.gg-hero__content > :nth-child(4) { animation-delay: .24s; }
@keyframes gg-rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }

.gg-badge { margin: 0; }
.gg-badge a {
	display: inline-flex; align-items: center; gap: .5em; padding: .45em .7em; border-radius: 5px; rotate: -2deg;
	background: var(--gg-lime); color: var(--gg-bg); font-family: var(--gg-wide); font-size: .58rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase;
	box-shadow: 0 10px 30px -8px rgba(184, 255, 60, .55);
}
.gg-badge a::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; animation: gg-pulse 1.6s ease-out infinite; }
.gg-badge a:hover { color: var(--gg-bg); rotate: 0deg; }
@keyframes gg-pulse { 0% { box-shadow: 0 0 0 0 rgba(11, 11, 14, .6); } 100% { box-shadow: 0 0 0 8px rgba(11, 11, 14, 0); } }

.gg-hero__title { margin-top: 1rem !important; font-size: clamp(1.9rem, 4.4vw, 4.25rem) !important; line-height: .9 !important; text-wrap: balance; text-shadow: 0 6px 50px rgba(0, 0, 0, .4); }
.gg-hero__title a { color: var(--gg-text); }
.gg-hero__title a:hover { color: var(--gg-lime); }
.gg-hero__excerpt { max-width: 52ch; margin-top: 1rem !important; color: rgba(244, 241, 234, .82); font-size: .98rem; line-height: 1.6; text-shadow: 0 1px 12px rgba(0, 0, 0, .5); }
.gg-hero__excerpt .wp-block-post-excerpt__excerpt { margin: 0; }
.gg-hero__excerpt .wp-block-post-excerpt__more-text { margin-top: 1.35rem; }
.gg-hero__excerpt .wp-block-post-excerpt__more-link {
	display: inline-flex; align-items: center; gap: .7em; padding: .9em 1.6em .9em 1.3em; border-radius: 999px;
	background: var(--gg-lime); color: var(--gg-bg); font-weight: 750; font-size: .92rem; letter-spacing: .01em;
	box-shadow: 0 16px 40px -12px rgba(184, 255, 60, .6); transition: transform .25s var(--gg-ease), box-shadow .25s, background .2s;
}
.gg-hero__excerpt .wp-block-post-excerpt__more-link::before { content: ""; width: 0; height: 0; border-style: solid; border-width: .45em 0 .45em .72em; border-color: transparent transparent transparent currentColor; }
.gg-hero__excerpt .wp-block-post-excerpt__more-link:hover { color: var(--gg-bg); background: var(--gg-text); transform: translateY(-2px); box-shadow: 0 22px 48px -14px rgba(244, 241, 234, .45); }
.gg-hero .gg-pills { margin-top: .85rem !important; text-shadow: 0 1px 10px rgba(0, 0, 0, .6); }

/* ==================================================================
   Section headings
================================================================== */
.gg-head { margin-top: clamp(4.5rem, 9vw, 7.5rem) !important; margin-bottom: 1.75rem !important; padding-bottom: 1.1rem; gap: 1rem; border-bottom: 1px solid var(--gg-line); }
.gg-front > .gg-hero + .gg-head { margin-top: clamp(2rem, 4vw, 3.5rem) !important; }
.gg-head h2 { display: flex; align-items: center; gap: .32em; margin: 0; font-size: clamp(2.4rem, 5vw, 4.4rem); }
.gg-head h2::before { content: ""; flex: none; width: .4em; height: .5em; background: var(--gg-accent); -webkit-mask: var(--gg-drop-mask) center / contain no-repeat; mask: var(--gg-drop-mask) center / contain no-repeat; filter: drop-shadow(0 0 18px var(--gg-accent)); }
.gg-more { margin: 0 0 .35rem; }
.gg-more a { display: inline-flex; align-items: center; gap: .7em; font-size: .9rem; font-weight: 650; color: var(--gg-text); white-space: nowrap; }
.gg-more a::after {
	content: "→"; display: inline-grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: 50%;
	box-shadow: inset 0 0 0 1px var(--gg-line-strong); transition: background .2s, color .2s, transform .25s var(--gg-ease);
}
.gg-more a:hover { color: var(--gg-accent); }
.gg-more a:hover::after { background: var(--gg-accent); color: var(--gg-bg); box-shadow: none; transform: translateX(3px); }

/* ==================================================================
   Bento grid (Recent Updates)
================================================================== */
.gg-bento .wp-block-post-template {
	display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: clamp(190px, 16vw, 260px);
	gap: clamp(10px, 1.1vw, 16px); margin: 0; padding: 0; list-style: none;
}
.gg-bento .wp-block-post-template > li { margin: 0; min-width: 0; }
.gg-bento .wp-block-post-template > li:nth-child(1) { grid-column: span 2; grid-row: span 2; }
.gg-bento .wp-block-post-template > li:nth-child(6), .gg-bento .wp-block-post-template > li:nth-child(7) { grid-column: span 2; }

.gg-tile { position: relative; isolation: isolate; height: 100%; overflow: hidden; border-radius: var(--gg-radius); background: var(--gg-raised); transition: box-shadow .3s; }
.gg-tile:hover { box-shadow: 0 0 0 2px var(--gg-lime), 0 30px 60px -24px rgba(0, 0, 0, .8); }
.gg-tile .wp-block-post-featured-image { position: absolute; inset: 0; z-index: 0; height: 100% !important; margin: 0; }
.gg-tile .wp-block-post-featured-image a { display: block; height: 100%; }
.gg-tile .wp-block-post-featured-image img { width: 100%; height: 100% !important; object-fit: cover; transition: transform .9s var(--gg-ease); }
.gg-tile:hover .wp-block-post-featured-image img { transform: scale(1.05); }
.gg-tile::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(0deg, rgba(11, 11, 14, .88) 0%, rgba(11, 11, 14, .45) 24%, rgba(11, 11, 14, 0) 46%); }
.gg-tile__body { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; padding: clamp(12px, 1.2vw, 18px); pointer-events: none; text-shadow: 0 1px 10px rgba(0, 0, 0, .55); }
.gg-tile__body a { pointer-events: auto; }

.gg-tile .wp-block-post-title { margin: 0; font-size: clamp(.84rem, .9vw, .95rem); font-weight: 680; line-height: 1.25; text-wrap: balance; }
.gg-tile .wp-block-post-title a { color: var(--gg-text); }
.gg-tile:hover .wp-block-post-title a { color: var(--gg-lime); }
.gg-tile .wp-block-post-date { color: rgba(244, 241, 234, .62); }
.gg-bento li:nth-child(1) .wp-block-post-title { font-family: var(--gg-display); font-weight: 900; text-transform: uppercase; font-size: clamp(1.15rem, 1.8vw, 1.75rem); line-height: .88; }

/* ==================================================================
   Rails (swipe sideways)
================================================================== */
.gg-rail { position: relative; }
.gg-rail .wp-block-post-template {
	display: grid !important; grid-auto-flow: column; grid-template-columns: none !important; grid-auto-columns: calc((100% - 3 * 20px) / 4.3);
	gap: 20px; margin: 0; padding: 0 0 18px; list-style: none; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory;
	scrollbar-width: thin; scrollbar-color: rgba(255, 255, 255, .25) transparent;
	-webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 90px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 90px), transparent);
}
.gg-rail .wp-block-post-template > li { margin: 0; min-width: 0; scroll-snap-align: start; }
.gg-rail .wp-block-post-template::-webkit-scrollbar { height: 6px; }
.gg-rail .wp-block-post-template::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, .22); border-radius: 99px; }
.gg-rail .wp-block-post-template:hover::-webkit-scrollbar-thumb { background: var(--gg-accent, var(--gg-lime)); }

/* Cards (rails, lists) */
.gg-card { position: relative; display: flex; flex-direction: column; height: 100%; }
.gg-card .wp-block-post-featured-image { margin: 0; overflow: hidden; border-radius: 14px; background: var(--gg-raised); transition: box-shadow .3s, transform .4s var(--gg-ease); }
.gg-card .wp-block-post-featured-image img { transition: transform .8s var(--gg-ease); border-radius: 0; }
.gg-card:hover .wp-block-post-featured-image { box-shadow: 0 0 0 2px var(--gg-lime), 0 24px 50px -22px rgba(0, 0, 0, .9); transform: translateY(-4px); }
.gg-card:hover .wp-block-post-featured-image img { transform: scale(1.05); }
.gg-card .gg-meta-row { position: relative; z-index: 2; }
.gg-card .wp-block-post-title { margin: 1rem 0 0; font-size: 1.06rem; font-weight: 680; line-height: 1.28; letter-spacing: -.005em; }
.gg-card .wp-block-post-title a { color: var(--gg-text); }
.gg-card .wp-block-post-title a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.gg-card:hover .wp-block-post-title a { color: var(--gg-lime); }
.gg-card .wp-block-post-excerpt { margin: .6rem 0 0; color: var(--gg-muted); font-size: .92rem; line-height: 1.55; }
.gg-card .wp-block-post-excerpt__excerpt { margin: 0; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }


/* Posts with no picture at all */
.gg-noimg, .gg-card .gg-noimg, .gg-tile .gg-noimg { position: relative; display: grid; place-items: center; margin: 0; background: radial-gradient(90% 80% at 30% 20%, #1F2B0B 0%, var(--gg-raised) 70%); }
.gg-noimg::before { content: ""; position: absolute; inset: 0 0 auto; height: 28px; background: var(--gg-lime); opacity: .85; -webkit-mask: var(--gg-drip) 0 0 / 220px 28px round no-repeat; mask: var(--gg-drip) 0 0 / 220px 28px round no-repeat; }
.gg-noimg a { position: absolute; inset: 0; display: grid; place-items: center; color: var(--gg-text); }
.gg-noimg__mark { font-family: var(--gg-display); font-weight: 900; font-size: 1.7rem; text-transform: uppercase; letter-spacing: .01em; }
.gg-noimg__mark span { color: var(--gg-lime); }

/* ==================================================================
   Download Store band
================================================================== */
.gg-store { position: relative; margin-top: clamp(4.5rem, 9vw, 7.5rem) !important; }
.gg-store::after {
	content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 34px; margin-top: -1px; pointer-events: none; background: var(--gg-lime);
	-webkit-mask: var(--gg-drip) 0 0 / 300px 34px round no-repeat; mask: var(--gg-drip) 0 0 / 300px 34px round no-repeat;
}
.gg-marquee-wrap { margin-top: 0 !important; }
.gg-marquee { overflow: hidden; padding: clamp(1.5rem, 3.5vw, 2.75rem) 0 clamp(.5rem, 1.5vw, 1rem); border-bottom: 2px solid rgba(11, 11, 14, .9); }
.gg-marquee__track { display: flex; align-items: center; width: max-content; animation: gg-marquee 34s linear infinite; }
.gg-marquee__track span { font-family: var(--gg-display); font-size: clamp(4.5rem, 12vw, 11.5rem); font-weight: 900; line-height: .86; text-transform: uppercase; letter-spacing: -.005em; white-space: nowrap; color: var(--gg-bg); }
.gg-marquee__track span:nth-of-type(even) { color: transparent; -webkit-text-stroke: 2px var(--gg-bg); }
.gg-marquee__track i { flex: none; width: clamp(2.2rem, 5vw, 4.5rem); height: clamp(2.7rem, 6.2vw, 5.6rem); margin: 0 clamp(1rem, 2.4vw, 2.2rem); background: var(--gg-bg); -webkit-mask: var(--gg-drop-mask) center / contain no-repeat; mask: var(--gg-drop-mask) center / contain no-repeat; }
.gg-marquee:hover .gg-marquee__track { animation-play-state: paused; }
@keyframes gg-marquee { to { transform: translateX(-50%); } }
.gg-store__row { margin-top: clamp(1.75rem, 3vw, 2.5rem) !important; gap: 1.5rem 2rem; }
.gg-store__lead { margin: 0; max-width: 30ch; font-family: var(--gg-wide); font-size: clamp(1.2rem, 2vw, 1.65rem); font-weight: 750; line-height: 1.2; letter-spacing: -.01em; }
.gg-store__buttons { gap: .75rem; }
.gg-store .wp-block-button__link { font-size: 1rem; padding: 1.05em 1.9em; transition: transform .25s var(--gg-ease), background .2s, color .2s; }
.gg-store .gg-btn-dark .wp-block-button__link { background: var(--gg-bg); color: var(--gg-lime); }
.gg-store .gg-btn-line .wp-block-button__link { background: transparent; color: var(--gg-bg); box-shadow: inset 0 0 0 2px var(--gg-bg); }
.gg-store .wp-block-button__link:hover { transform: translateY(-2px); background: #000; color: var(--gg-text); box-shadow: none; }

/* ==================================================================
   Videos
================================================================== */
.wp-block-embed-youtube .wp-block-embed__wrapper { overflow: hidden; border-radius: var(--gg-radius); background: #000; box-shadow: 0 0 0 1px var(--gg-line), 0 40px 80px -30px rgba(0, 0, 0, .8); }

/* ==================================================================
   List pages: category, blog, search
================================================================== */
.gg-list, .gg-single, .gg-page { padding-top: clamp(1rem, 3vw, 2rem); }
.gg-pagehead { position: relative; isolation: isolate; padding: clamp(2.5rem, 7vw, 6rem) 0 clamp(1.5rem, 3vw, 2.5rem); margin-bottom: clamp(2rem, 4vw, 3rem) !important; border-bottom: 1px solid var(--gg-line); }
.gg-pagehead::before {
	content: ""; position: absolute; z-index: -1; left: -12%; top: -55%; width: min(70vw, 820px); aspect-ratio: 1; pointer-events: none;
	background: radial-gradient(closest-side, color-mix(in srgb, var(--gg-accent) 26%, transparent), transparent);
}
.gg-pagehead h1, .gg-pagehead .wp-block-query-title { margin: 0; font-size: clamp(3.6rem, 11.5vw, 10.5rem); line-height: .82; text-wrap: balance; }
.gg-pagehead .wp-block-term-description { max-width: 62ch; margin-top: 1.25rem; color: var(--gg-muted); font-size: 1.1rem; }
.gg-pagehead .wp-block-term-description p { margin: 0; }
.gg-pagehead .wp-block-search { max-width: 560px; margin-top: 1.75rem; }
.gg-grid .wp-block-post-template { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: clamp(2rem, 3.5vw, 3rem) clamp(1rem, 2vw, 1.75rem) !important; }
@media (max-width: 1000px) { .gg-grid .wp-block-post-template { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
@media (max-width: 600px) { .gg-grid .wp-block-post-template { grid-template-columns: minmax(0, 1fr) !important; } }

/* Form fields (Ollie hard-codes white backgrounds) */
input:not([type="submit"]):not([type="radio"]),
select,
textarea,
.wp-block-post-comments-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
.wp-block-post-comments-form textarea { background-color: rgba(255, 255, 255, .04); color: var(--gg-text); border-color: var(--gg-line-strong); box-shadow: none; }

/* Search fields */
.wp-block-search .wp-block-search__inside-wrapper { padding: 5px; border: 1px solid var(--gg-line-strong); border-radius: 999px; background: rgba(255, 255, 255, .04); }
.wp-block-search .wp-block-search__inside-wrapper:focus-within { border-color: var(--gg-lime); box-shadow: 0 0 0 4px rgba(184, 255, 60, .18); }
.wp-block-search .wp-block-search__inside-wrapper .wp-block-search__input { border: 0; background: transparent; box-shadow: none; border-radius: 999px; color: var(--gg-text); padding: .65em 1.1em; font-size: .95rem; }
.wp-block-search .wp-block-search__input:focus { outline: none; }
.wp-block-search .wp-block-search__input::placeholder { color: rgba(244, 241, 234, .45); }
.wp-block-search .wp-block-search__button { margin: 0; border-radius: 999px; background: var(--gg-lime); color: var(--gg-bg); padding: .6em 1.3em; }
.wp-block-search .wp-block-search__button.has-icon { padding: .5em .75em; }
.wp-block-search .wp-block-search__button svg { fill: currentColor; }

/* Page numbers */
.wp-block-query-pagination { margin-top: clamp(3rem, 6vw, 4.5rem); gap: .45rem; font-size: .9rem; font-weight: 650; }
.wp-block-query-pagination-numbers { display: flex; flex-wrap: wrap; justify-content: center; gap: .45rem; }
.wp-block-query-pagination a, .wp-block-query-pagination .page-numbers {
	display: inline-flex; align-items: center; justify-content: center; min-width: 2.85rem; height: 2.85rem; padding: 0 1.05rem;
	border-radius: 999px; color: var(--gg-text); background: var(--gg-surface); box-shadow: inset 0 0 0 1px var(--gg-line); transition: background .2s, color .2s;
}
.wp-block-query-pagination a:hover { background: var(--gg-lime); color: var(--gg-bg); }
.wp-block-query-pagination .page-numbers.current { background: var(--gg-text); color: var(--gg-bg); box-shadow: none; }
.wp-block-query-pagination .page-numbers.dots { background: none; box-shadow: none; min-width: 0; padding: 0 .25rem; }

/* ==================================================================
   Single posts and pages
================================================================== */
.gg-post-head { padding: clamp(2.5rem, 7vw, 6rem) 0 clamp(1.5rem, 3vw, 2.5rem); text-align: center; }
.gg-post-head .gg-pills { justify-content: center; margin-top: 1.4rem !important; font-size: .64rem; }
.gg-post-head .wp-block-post-title { max-width: 17ch; margin: 0 auto; font-size: clamp(3rem, 8vw, 7.75rem); line-height: .86; text-wrap: balance; }
.gg-meta { margin-top: .8rem !important; color: var(--gg-muted); font-size: .92rem; }
.gg-meta p { margin: 0; }
.gg-meta a { color: var(--gg-text); font-weight: 650; }
.gg-meta a:hover { color: var(--gg-lime); }
.gg-meta .wp-block-post-date { font-size: inherit; color: inherit; }
.gg-feature { margin-top: clamp(1rem, 3vw, 2rem) !important; }
.gg-feature img { border-radius: 24px; box-shadow: 0 0 0 1px var(--gg-line), 0 50px 100px -40px rgba(0, 0, 0, .9); }

.gg-content { margin-top: clamp(1.5rem, 4vw, 3rem) !important; font-size: 1.125rem; line-height: 1.78; color: rgba(244, 241, 234, .86); }
.gg-content > * + * { margin-block-start: 1.35em; }
.gg-content strong, .gg-content b { color: var(--gg-text); font-weight: 700; }
.gg-content a:not(.wp-element-button):not(.maxbutton) { color: var(--gg-lime); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; transition: color .2s; }
.gg-content a:not(.wp-element-button):not(.maxbutton):hover { color: var(--gg-text); }
.gg-content img { border-radius: 16px; }
.gg-content a:has(> img) { display: inline-block; border-radius: 16px; }
.gg-content h2, .gg-content h3 { margin-block-start: 2em; }
.gg-content h2 { font-size: clamp(2rem, 4vw, 3rem); }
.gg-content blockquote { margin-left: 0; padding: .3em 0 .3em 1.3em; border-left: 4px solid var(--gg-lime); font-size: 1.2em; color: var(--gg-text); }
.gg-content iframe, .gg-content video { max-width: 100%; border-radius: 16px; }
.gg-content .wp-caption, .gg-content figure { max-width: 100%; }
.gg-content .wp-caption-text, .gg-content figcaption { margin-top: .6em; color: var(--gg-muted); font-size: .85rem; text-align: center; }
.gg-content hr { border: 0; border-top: 1px solid var(--gg-line); }
.gg-content table { border-collapse: collapse; width: 100%; }
.gg-content td, .gg-content th { border: 1px solid var(--gg-line); padding: .6em .8em; }

.gg-tags { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: clamp(2rem, 4vw, 3rem) !important; }
.gg-tags .wp-block-post-terms__separator { display: none; }
.gg-tags a { display: inline-flex; padding: .5em 1em; border-radius: 999px; color: var(--gg-text); font-size: .82rem; font-weight: 600; box-shadow: inset 0 0 0 1px var(--gg-line-strong); transition: background .2s, color .2s; }
.gg-tags a::before { content: "#"; margin-right: .15em; color: var(--gg-lime); }
.gg-tags a:hover { background: var(--gg-text); color: var(--gg-bg); }

.gg-post-nav { gap: 1rem; margin-top: clamp(2.5rem, 5vw, 4rem) !important; }
.gg-post-nav > * { flex: 1 1 0; min-width: 0; }
.gg-post-nav a {
	display: flex; flex-direction: column; justify-content: center; gap: .45rem; height: 100%; padding: 1.3rem 1.5rem; border-radius: var(--gg-radius);
	background: var(--gg-surface); box-shadow: inset 0 0 0 1px var(--gg-line); color: var(--gg-text); transition: box-shadow .25s, transform .3s var(--gg-ease);
}
.gg-post-nav a:hover { color: var(--gg-text); box-shadow: inset 0 0 0 2px var(--gg-lime); transform: translateY(-3px); }
.gg-post-nav .post-navigation-link__label { font-family: var(--gg-wide); font-size: .66rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--gg-lime); }
.gg-post-nav .post-navigation-link__title { font-family: var(--gg-display); font-size: 1.75rem; font-weight: 900; line-height: .95; text-transform: uppercase; }
.gg-post-nav .post-navigation-link-next a { align-items: flex-end; text-align: right; }

/* ==================================================================
   Footer
================================================================== */
.gg-foot { position: relative; overflow: hidden; border-top: 1px solid var(--gg-line); background: radial-gradient(70% 55% at 50% 105%, rgba(184, 255, 60, .13), transparent 70%), var(--gg-bg); }
.gg-foot__cols { gap: clamp(2rem, 5vw, 5rem) !important; }
.gg-foot__tagline { margin: 0; font-family: var(--gg-wide); font-size: clamp(1.2rem, 1.8vw, 1.5rem); font-weight: 750; line-height: 1.2; color: var(--gg-text); }
.gg-foot__text { margin-top: .9rem; color: var(--gg-muted); max-width: 34ch; }
.gg-foot .wp-block-search { margin-top: 1.75rem; }
.gg-foot a { color: rgba(244, 241, 234, .76); transition: color .2s; }
.gg-foot a:hover { color: var(--gg-lime); }
.gg-footer-heading { margin: 0 0 1.2rem; font-family: var(--gg-wide) !important; font-size: .68rem !important; font-weight: 800 !important; letter-spacing: .18em !important; line-height: 1 !important; text-transform: uppercase !important; color: var(--gg-lime) !important; }
.gg-footer-heading:not(:first-child) { margin-top: 2.6rem; }
.gg-foot ul { list-style: none; margin: 0; padding: 0; }
.gg-foot li { margin: 0 0 .6em; color: rgba(244, 241, 234, .35); font-size: .95rem; line-height: 1.35; }
.gg-foot .wp-block-categories { columns: 2; column-gap: 1.75rem; }
.gg-foot .wp-block-categories li { break-inside: avoid; }
.gg-foot .wp-block-archives-dropdown select {
	-webkit-appearance: none; appearance: none; width: 100%; max-width: 300px; padding: .8em 2.8em .8em 1.15em; border-radius: 999px; border: 1px solid var(--gg-line-strong);
	background: rgba(255, 255, 255, .04) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23B8FF3C' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") right 1.15em center / 12px no-repeat;
	color: var(--gg-text); font: inherit; font-size: .92rem;
}
.gg-foot .wp-block-archives-dropdown select option { background: var(--gg-raised); color: var(--gg-text); }
.gg-social { gap: .5rem !important; margin-top: 1.5rem !important; }
.gg-social.is-style-logos-only .wp-social-link { padding: .55rem; border-radius: 999px; background: rgba(255, 255, 255, .06) !important; color: var(--gg-text) !important; transition: background .2s, color .2s, transform .25s var(--gg-ease); }
.gg-social.is-style-logos-only .wp-social-link:hover { background: var(--gg-lime) !important; color: var(--gg-bg) !important; transform: translateY(-2px); }
.gg-social .wp-social-link a { color: inherit !important; }

.gg-foot__mark { margin: clamp(3.5rem, 8vw, 6rem) 0 0 !important; text-align: center; font-size: min(14.6vw, 13.6rem) !important; line-height: .78 !important; letter-spacing: -.01em; white-space: nowrap; }
.gg-foot__mark a {
	display: inline-flex; color: transparent !important;
	background: linear-gradient(180deg, var(--gg-lime) 0%, rgba(184, 255, 60, .55) 45%, rgba(184, 255, 60, 0) 100%); -webkit-background-clip: text; background-clip: text;
	transition: filter .4s;
}
.gg-foot__mark a:hover { filter: drop-shadow(0 0 40px rgba(184, 255, 60, .35)); }
.gg-foot__mark .gg-drop { display: none; }
.gg-foot__mark .gg-tld { color: transparent; }
.gg-foot__bottom { margin-top: 1.5rem !important; padding-top: 1.25rem; border-top: 1px solid var(--gg-line); color: rgba(244, 241, 234, .45); font-size: .85rem; }
.gg-foot__bottom p { margin: 0; }

/* ==================================================================
   Motion and small screens
================================================================== */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation: none !important; transition: none !important; }
	.gg-marquee__track { transform: none; }
}

@media (max-width: 1100px) {
	.gg-rail .wp-block-post-template { grid-auto-columns: calc((100% - 2 * 20px) / 3.2); }
}
@media (max-width: 781px) {
	:root { --gg-bar-h: 64px; }
	.gg-bar .wp-block-site-title { font-size: 1.7rem; }
	.gg-hero__cover { min-height: 88svh !important; }
	.gg-hero__title { font-size: clamp(1.7rem, 7.4vw, 2.4rem) !important; }
	.gg-hero__excerpt { font-size: .94rem; }
	.gg-bento .wp-block-post-template { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.gg-bento li:nth-child(1) .wp-block-post-title { font-size: 1.3rem; }
	.gg-rail .wp-block-post-template { grid-auto-columns: 74%; gap: 14px; -webkit-mask-image: none; mask-image: none; }
	.gg-head { flex-wrap: nowrap !important; }
	.gg-head h2 { min-width: 0; font-size: clamp(2rem, 9.6vw, 3rem); }
	.gg-bento .wp-block-post-template { grid-auto-rows: 190px; }
	.gg-bento li:not(:first-child) .gg-pills { display: none; }
	.gg-bento li:not(:first-child) .wp-block-post-title { font-size: .84rem; }
	.gg-bento li:not(:first-child) .gg-meta-row .wp-block-post-date { font-size: .68rem; }
	.gg-foot__mark { font-size: 13.2vw !important; }
	.gg-more a { font-size: 0; gap: 0; }
	.gg-more a::after { font-size: 1rem; }
	.gg-store__lead { max-width: none; }
	.gg-post-nav { flex-direction: column; }
	.gg-foot .wp-block-categories { columns: 2; }
}
