/*
Theme Name: West Hollywood Human Rights Film Festival
Theme URI: https://hrff.gsdgroup.com
Author: GSD Group
Description: Festival website theme. Black, white and chartreuse. Pairs with the HRFF Registration plugin.
Version: 1.2.2
Requires at least: 6.5
Requires PHP: 7.4
License: GPLv2 or later
Text Domain: hrff
*/

/* ---------- Basics ---------- */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
:where(a, button, input, select, textarea):focus-visible { outline: 2px solid #0A0A0A; outline-offset: 3px; }
.has-ink-background-color :where(a, button, input):focus-visible,
.hrff-on-dark :where(a, button):focus-visible { outline-color: #DFFF00; }
img { max-width: 100%; height: auto; }

/* Small typewriter-style labels */
.hrff-eyebrow {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--label) !important;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	line-height: 1.5;
}

/* A chartreuse box with black text */
.hrff-badge {
	display: inline-block;
	background: var(--wp--preset--color--chartreuse);
	color: var(--wp--preset--color--ink) !important;
	padding: 6px 12px;
	font-family: var(--wp--preset--font-family--mono);
	font-size: 12px !important;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	line-height: 1.4;
}
p.hrff-badge { display: block; width: fit-content; }
.has-text-align-center.hrff-badge { margin-left: auto !important; margin-right: auto !important; }

/* Highlight inside text, e.g. "mean something" */
mark.hrff-mark, .hrff-statement mark {
	background: var(--wp--preset--color--chartreuse) !important;
	color: var(--wp--preset--color--ink) !important;
	padding: 0 0.12em;
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
}

/* Big serif statement */
.hrff-statement {
	font-family: var(--wp--preset--font-family--serif) !important;
	font-weight: 300;
	line-height: 1.06 !important;
	letter-spacing: -0.01em;
	text-transform: none !important;
}

/* Section heading with a rule above it */
.hrff-section-head {
	border-top: 1px solid currentColor;
	padding-top: 22px;
	gap: 16px 24px;
}
.hrff-section-head h2 { margin: 0; }

/* Buttons */
.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	color: inherit;
	border: 1px solid currentColor;
	padding: 15px 29px;
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover { background: var(--wp--preset--color--chartreuse); color: #0A0A0A; border-color: var(--wp--preset--color--chartreuse); }
.wp-block-button.is-style-ink > .wp-block-button__link { background: #0A0A0A; color: #FFFFFF; }
.wp-block-button.is-style-ink > .wp-block-button__link:hover { background: #FFFFFF; color: #0A0A0A; outline: 1px solid #0A0A0A; }
.wp-block-button__link { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; }

/* ---------- Header ---------- */
.hrff-header { background: #0A0A0A; color: #FFFFFF; position: relative; z-index: 20; }
.hrff-header a { color: #FFFFFF; text-decoration: none; }
.hrff-header a:hover { background: none; color: #DFFF00; }
body.home .hrff-header { position: absolute; left: 0; right: 0; top: 0; background: transparent; }
body.home.admin-bar .hrff-header { top: 32px; }
@media (max-width: 782px) { body.home.admin-bar .hrff-header { top: 46px; } }
.hrff-header .wp-block-navigation { font-family: var(--wp--preset--font-family--mono); font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; }
.hrff-header .wp-block-navigation-item__content { padding: 12px 0; }
.hrff-wordmark { text-align: center; line-height: 1.05; }
.hrff-wordmark a { display: inline-block; }
.hrff-wordmark .hrff-wordmark__top { display: block; font-family: var(--wp--preset--font-family--condensed); font-weight: 500; font-size: 15px; letter-spacing: 0.24em; text-transform: uppercase; }
.hrff-wordmark .hrff-wordmark__bottom { display: block; font-family: var(--wp--preset--font-family--serif); font-style: italic; font-size: 17px; }
.hrff-header .wp-block-button__link { padding: 12px 20px; font-size: 12px; min-height: 44px; }
.hrff-header .wp-block-navigation__responsive-container.is-menu-open { background: #0A0A0A !important; color: #FFFFFF !important; padding: 24px; }
.hrff-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-size: 20px; padding: 10px 0; }
@media (max-width: 720px) {
	.hrff-header__row { flex-wrap: nowrap !important; }
	.hrff-header__cta { display: none !important; }
	.hrff-wordmark { text-align: left; }
}

/* ---------- Hero ---------- */
.hrff-hero.wp-block-cover { align-items: flex-end; }
.hrff-hero .wp-block-cover__image-background { filter: grayscale(1) contrast(1.05); }
.hrff-hero h1 { margin: 0; line-height: 0.92; color: #FFFFFF; }
.hrff-hero__top { display: block; font-family: var(--wp--preset--font-family--condensed); font-weight: 500; font-size: var(--wp--preset--font-size--display); letter-spacing: 0.01em; text-transform: uppercase; }
.hrff-hero__bottom { display: block; margin-top: 6px; font-family: var(--wp--preset--font-family--serif); font-weight: 300; font-style: italic; text-transform: none; font-size: clamp(40px, 6.6vw, 100px); letter-spacing: -0.01em; }

/* ---------- Scrolling band ---------- */
.hrff-marquee { overflow: hidden; background: var(--wp--preset--color--chartreuse); color: #0A0A0A; }
.hrff-marquee__track { display: flex !important; flex-wrap: nowrap !important; width: max-content; gap: 0 !important; animation: hrff-marquee 40s linear infinite; }
.hrff-marquee__track > p {
	margin: 0 !important; padding: 22px 28px 22px 0; white-space: nowrap;
	font-family: var(--wp--preset--font-family--condensed); font-weight: 500; font-size: clamp(22px, 2.4vw, 30px); letter-spacing: 0.04em; text-transform: uppercase;
}
@keyframes hrff-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .hrff-marquee__track { animation: none; } }

/* ---------- Facts row ---------- */
.hrff-facts { border-top: 1px solid #0A0A0A; }
.hrff-fact { padding-top: 28px; }
.hrff-fact::before { content: ""; display: block; width: 28px; height: 8px; background: var(--wp--preset--color--chartreuse); margin-bottom: 18px; }
.hrff-fact__big { font-family: var(--wp--preset--font-family--condensed); font-weight: 500; font-size: 40px !important; line-height: 1.05 !important; text-transform: uppercase; margin: 0 !important; }
.hrff-fact p:not(.hrff-fact__big) { margin-top: 8px; font-weight: 300; font-size: 16px; color: #333333; }

/* ---------- Films ---------- */
.hrff-films { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(min(100%, 360px), 1fr)); gap: 44px 24px !important; }
.hrff-film { display: flex; flex-direction: column; gap: 12px !important; }
.hrff-film > * { margin: 0 !important; }
.hrff-film .wp-block-image { position: relative; margin: 0; }
.hrff-film .wp-block-image img { width: 100%; aspect-ratio: 2 / 3; object-fit: cover; display: block; background: #262626; }
.hrff-film h3 { font-size: 30px; line-height: 1.1; margin: 0; }
.hrff-film .hrff-film__meta { font-family: var(--wp--preset--font-family--mono); font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: #B3B3B3; }
.hrff-film .hrff-badge { align-self: flex-start; }
.hrff-film--placeholder .wp-block-image img { opacity: 0.35; }
.hrff-shorts-note { border: 1px solid #333333; padding: 26px 30px !important; }

/* ---------- Schedule ---------- */
.hrff-day-card { padding: clamp(28px, 4vw, 48px) clamp(22px, 4vw, 44px) !important; }
.hrff-schedule { list-style: none; margin: 0; padding: 0; }
.hrff-schedule li { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 16px; align-items: baseline; padding: 12px 0; border-top: 1px solid #CCCCCC; font-family: var(--wp--preset--font-family--serif); font-size: 24px; line-height: 1.15; }
.hrff-schedule li strong { font-family: var(--wp--preset--font-family--condensed); font-weight: 500; font-size: 18px; letter-spacing: 0.04em; }

/* ---------- Themes ---------- */
.hrff-themes { border-top: 1px solid #333333; }
.hrff-theme { border-bottom: 1px solid #333333; padding: 28px 28px 32px 0 !important; }
.hrff-theme h3 { font-family: var(--wp--preset--font-family--condensed); font-weight: 500; font-size: 26px; text-transform: uppercase; letter-spacing: 0.03em; }

/* ---------- Venues, people ---------- */
.hrff-photo img { width: 100%; object-fit: cover; display: block; background: #D9D9D9; }
.hrff-photo--landscape img { aspect-ratio: 4 / 3; }
.hrff-photo--portrait img { aspect-ratio: 4 / 5; }
.hrff-offset { padding-top: clamp(0px, 7vw, 96px); }
.hrff-partner { border: 1px solid #CCCCCC; background: #FFFFFF; min-height: 120px; display: flex !important; flex-direction: column; justify-content: center; align-items: center; padding: 16px !important; text-align: center; gap: 6px !important; }
.hrff-partner > * { margin: 0 !important; }
.hrff-partner img { max-height: 64px; width: auto; }
.hrff-dashed { border: 1px dashed #B3B3B3; padding: 28px 32px !important; }

/* ---------- Footer ---------- */
.hrff-footer { font-family: var(--wp--preset--font-family--mono); font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; }
.hrff-footer a { color: #B3B3B3; }
.hrff-footer a:hover { color: #0A0A0A; }

/* ---------- Page title banner ---------- */
.hrff-page-banner h1 { margin: 0; color: #FFFFFF; }

/* Grid helper used across sections */
.hrff-grid-2 { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(min(100%, 460px), 1fr)); gap: 48px clamp(24px, 5vw, 80px) !important; }
.hrff-grid-4 { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 0 24px !important; }
.hrff-grid-6 { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 16px !important; }
.hrff-grid-2 > *, .hrff-grid-4 > *, .hrff-grid-6 > * { margin: 0 !important; }

/* Additions */
.hrff-hero__pre { display: block; font-family: var(--wp--preset--font-family--serif); font-style: italic; font-weight: 400; text-transform: none; font-size: clamp(28px, 3.4vw, 48px); margin-bottom: 4px; }
.hrff-hero__lead { color: #E6E6E6; max-width: 640px; margin-left: auto !important; margin-right: auto !important; }
.hrff-hero .hrff-badge { margin-bottom: 20px; }
.hrff-serif-italic { font-family: var(--wp--preset--font-family--serif); font-style: italic; font-weight: 400; text-transform: none; font-size: 1.1em; }
.hrff-nav-request { display: none !important; }
.wp-block-navigation__responsive-container.is-menu-open .hrff-nav-request { display: flex !important; }
.hrff-on-dark .wp-block-button.is-style-outline > .wp-block-button__link { color: #FFFFFF; }
.hrff-founders { gap: 32px 24px !important; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)) !important; }
.hrff-founder > * + * { margin-top: 12px; }
.hrff-founder h3 { margin-top: 8px; }

/* Full-width sections sit flush against each other */
.wp-site-blocks > * + * { margin-block-start: 0; }
.wp-block-post-content > .alignfull { margin-block-start: 0 !important; margin-block-end: 0 !important; }
@media (max-width: 600px) { .hrff-films { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 14px !important; } .hrff-film h3 { font-size: 22px; } }
.hrff-films > * { margin: 0 !important; }
.hrff-header .wp-block-button__link, .hrff-header .wp-block-button__link:visited { color: #0A0A0A !important; }
.hrff-header .wp-block-button__link:hover { background: #FFFFFF !important; color: #0A0A0A !important; }
.hrff-footer .hrff-footer__legal { font-family: var(--wp--preset--font-family--sans); font-size: 13px; letter-spacing: 0; text-transform: none; line-height: 1.55; color: #B3B3B3; max-width: none; }
/* Footer: everything centered */
.hrff-footer .is-layout-flex { justify-content: center !important; column-gap: 40px; row-gap: 10px; }
.hrff-footer p, .hrff-footer .hrff-footer__legal { text-align: center; margin-left: auto; margin-right: auto; }
.hrff-footer .hrff-footer__legal { max-width: 760px !important; }

/* Day cards with a background image: black-and-white photo under a dark overlay, text on top */
.hrff-day-card[style*="background-image"] { position: relative; isolation: isolate; background-size: cover; background-position: center; }
.hrff-day-card[style*="background-image"]::before {
	content: ""; position: absolute; inset: 0; z-index: -1;
	background: rgba(10, 10, 10, 0.66);
	-webkit-backdrop-filter: grayscale(1); backdrop-filter: grayscale(1);
}
/* "Color photo" style: keep the background photo in color */
.hrff-day-card.is-style-photo-color[style*="background-image"]::before { -webkit-backdrop-filter: none; backdrop-filter: none; background: rgba(10, 10, 10, 0.6); }

/* Header logo above the center wordmark */
.hrff-wordmark .hrff-wordmark__logo { display: block; height: 72px; width: auto; margin: 0 auto 8px; }
.hrff-header .hrff-wordmark a:hover .hrff-wordmark__logo { opacity: .85; }
@media (max-width: 720px) {
	.hrff-wordmark a { display: inline-grid !important; grid-template-columns: auto auto; column-gap: 10px; align-items: center; text-align: left; }
	.hrff-wordmark .hrff-wordmark__logo { grid-row: 1 / span 2; height: 42px; margin: 0; }
	.hrff-wordmark .hrff-wordmark__top, .hrff-wordmark .hrff-wordmark__bottom { grid-column: 2; }
}

/* Request page: full horizontal logo replaces the text wordmark */
.hrff-wordmark--full .hrff-wordmark__top, .hrff-wordmark--full .hrff-wordmark__bottom { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.hrff-wordmark.hrff-wordmark--full .hrff-wordmark__logo { height: 76px; margin: 0 auto; }
@media (max-width: 720px) {
	.hrff-wordmark.hrff-wordmark--full a { display: inline-block !important; }
	.hrff-wordmark.hrff-wordmark--full .hrff-wordmark__logo { height: 46px; }
}

/* Home page: dove mark only (the hero carries the name) */
.hrff-wordmark--mark .hrff-wordmark__top, .hrff-wordmark--mark .hrff-wordmark__bottom { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.hrff-wordmark.hrff-wordmark--mark .hrff-wordmark__logo { height: 84px; margin: 0 auto; }
@media (max-width: 720px) {
	.hrff-wordmark.hrff-wordmark--mark a { display: inline-block !important; }
	.hrff-wordmark.hrff-wordmark--mark .hrff-wordmark__logo { height: 52px; }
}
@media (max-width: 720px) {
	.hrff-header__row { position: relative; }
	.hrff-wordmark.hrff-wordmark--mark, .hrff-wordmark.hrff-wordmark--full { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); margin: 0 !important; }
}
