/* FrunkYea — dark, angular, stainless. Tokens live in theme.json; this file adds the details theme.json can't express. */

:root {
	--fy-base: var(--wp--preset--color--base, #0b0c0e);
	--fy-surface: var(--wp--preset--color--surface, #141619);
	--fy-surface-2: var(--wp--preset--color--surface-2, #1c1f24);
	--fy-line: var(--wp--preset--color--line, #2a2e35);
	--fy-text: var(--wp--preset--color--contrast, #f2f3f5);
	--fy-muted: var(--wp--preset--color--muted, #9aa1ab);
	--fy-accent: var(--wp--preset--color--accent, #d7ff3a);
	--fy-mono: var(--wp--preset--font-family--mono, ui-monospace, monospace);
	--fy-cut: 14px;
	--fy-header-h: 76px;

	/* Fleetwire embed theming (listing cards, buttons, calendar, gallery). */
	--fw-font: var(--wp--preset--font-family--display);
	--fw-surface: var(--fy-surface);
	--fw-surface-alt: var(--fy-surface-2);
	--fw-text: var(--fy-text);
	--fw-muted: var(--fy-muted);
	--fw-border: var(--fy-line);
	--fw-accent: var(--fy-accent);
	--fw-accent-hover: #f2f3f5;
	--fw-accent-soft: rgba(215, 255, 58, .14);
	--fw-accent-contrast: #0b0c0e;
	--fw-radius: 0px;
	--fw-radius-sm: 0px;
	--fw-shadow: none;
}

html { scroll-behavior: smooth; scroll-padding-top: calc(var(--fy-header-h) + 1rem); }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
::selection { background: var(--fy-accent); color: var(--fy-base); }
img { height: auto; }
.fy-main { overflow-x: clip; }

/* ---------- Type ---------- */

h1, h2, .fy-wide {
	font-variation-settings: "wdth" 125;
	font-stretch: 125%;
	text-transform: uppercase;
}
h1 { letter-spacing: -0.03em; }
h3, h4 { font-variation-settings: "wdth" 112; }

.fy-eyebrow,
.fy-eyebrow p,
.fy-eyebrow a,
.fy-eyebrow time {
	font-family: var(--fy-mono);
	font-size: 0.75rem !important;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--fy-muted);
	text-decoration: none;
	margin: 0;
}
p.fy-eyebrow::before,
.fy-eyebrow--tick::before {
	content: "";
	display: inline-block;
	width: 1.25rem;
	height: 2px;
	margin-right: 0.6rem;
	vertical-align: middle;
	background: var(--fy-accent);
}

.fy-lede { font-size: clamp(1.1rem, 1.6vw, 1.3rem); line-height: 1.55; color: var(--fy-muted); max-width: 40rem; }
.fy-accent { color: var(--fy-accent); }
.fy-muted { color: var(--fy-muted) !important; }

/* ---------- Buttons ---------- */

.wp-element-button,
.wp-block-button__link { transition: background-color .2s ease, color .2s ease, transform .2s ease; }
.wp-block-button:not(.is-style-outline) .wp-block-button__link { color: var(--fy-base) !important; text-decoration: none; }
.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover { background: var(--fy-text); }

.fy-btn-cut .wp-block-button__link,
.fy-btn-cut.wp-block-button .wp-element-button {
	clip-path: polygon(0 0, calc(100% - var(--fy-cut)) 0, 100% var(--fy-cut), 100% 100%, var(--fy-cut) 100%, 0 calc(100% - var(--fy-cut)));
	text-transform: uppercase;
}
.fy-btn-cut .wp-block-button__link::after { content: " →"; }

.wp-block-button.is-style-outline .wp-block-button__link {
	background: transparent;
	color: var(--fy-text);
	border: 1px solid rgba(242, 243, 245, .4);
	text-transform: uppercase;
}
.wp-block-button.is-style-outline .wp-block-button__link:hover { border-color: var(--fy-accent); color: var(--fy-accent); }

/* ---------- Header ---------- */

.fy-header {
	position: sticky;
	top: 0;
	z-index: 50;
	background: rgba(11, 12, 14, .72);
	-webkit-backdrop-filter: saturate(140%) blur(14px);
	backdrop-filter: saturate(140%) blur(14px);
	border-bottom: 1px solid rgba(255, 255, 255, .06);
}
.admin-bar .fy-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .fy-header { top: 46px; } }
.fy-header__bar { min-height: var(--fy-header-h); gap: 1.5rem; }
.fy-header__right { gap: 1.75rem; }
.fy-logo { display: inline-flex; line-height: 0; }
.fy-logo img { width: 168px; height: auto; }
.fy-nav { font-size: 0.85rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; }
.fy-nav .wp-block-navigation-item__content { text-decoration: none; color: var(--fy-text); opacity: .78; transition: opacity .2s, color .2s; }
.fy-nav .wp-block-navigation-item__content:hover { opacity: 1; color: var(--fy-accent); }
.fy-header__cta .wp-block-button__link { padding: 0.7rem 1.15rem; font-size: 0.8rem; }
.fy-nav .wp-block-navigation__responsive-container.is-menu-open { background: var(--fy-base); color: var(--fy-text); padding: 2rem; }
.fy-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-size: 1.6rem; opacity: 1; font-variation-settings: "wdth" 120; }
@media (max-width: 600px) {
	.fy-logo img { width: 132px; }
	.fy-header__right { gap: 1rem; }
	.fy-header__cta .wp-block-button__link { padding: .55rem .8rem; font-size: .72rem; }
}

/* ---------- Hero ---------- */

.fy-hero.wp-block-cover {
	min-height: calc(100svh - var(--fy-header-h)) !important;
	padding-bottom: var(--wp--preset--spacing--60);
	align-items: flex-end;
}
.fy-hero .wp-block-cover__background {
	background-color: transparent !important;
	background:
		linear-gradient(180deg, rgba(11, 12, 14, .55) 0%, rgba(11, 12, 14, 0) 22%, rgba(11, 12, 14, 0) 45%, rgba(11, 12, 14, .97) 100%),
		linear-gradient(90deg, rgba(11, 12, 14, .82) 0%, rgba(11, 12, 14, .35) 55%, rgba(11, 12, 14, .05) 100%) !important;
	opacity: 1 !important;
}
.fy-hero .wp-block-cover__image-background { object-position: 72% 60%; filter: saturate(.8) brightness(.82) contrast(1.08); }
.fy-hero h1 { font-size: min(9.5rem, 9.4vw) !important; line-height: .9; margin: 0.6rem 0 0; }
@media (max-width: 600px) { .fy-hero h1 { font-size: 9.6vw !important; } }
.fy-hero .fy-lede { color: rgba(242, 243, 245, .88); }
.fy-hero .fy-eyebrow, .fy-cta .fy-eyebrow, .fy-page-hero .fy-eyebrow { color: rgba(242, 243, 245, .85); }

/* Covers: left-align everything inside the wide container instead of centering each child. */
:is(.fy-hero, .fy-cta, .fy-page-hero) .wp-block-cover__inner-container > *,
:is(.fy-hero, .fy-cta, .fy-page-hero) .wp-block-cover__inner-container > .wp-block-group > * { margin-left: 0 !important; }
:is(.fy-hero, .fy-cta, .fy-page-hero).wp-block-cover.has-custom-content-position .wp-block-cover__inner-container {
	box-sizing: border-box;
	width: 100% !important;
	max-width: var(--wp--style--global--wide-size) !important;
	margin-inline: auto !important;
}
:is(.fy-hero, .fy-cta, .fy-page-hero).wp-block-cover { padding-inline: var(--wp--preset--spacing--40); }

.fy-page-hero.wp-block-cover { min-height: 62vh !important; align-items: flex-end; padding-bottom: var(--wp--preset--spacing--60); }
.fy-page-hero .wp-block-cover__background {
	background-color: transparent !important;
	background:
		linear-gradient(180deg, rgba(11, 12, 14, .5) 0%, rgba(11, 12, 14, 0) 25%, rgba(11, 12, 14, .2) 55%, rgba(11, 12, 14, .97) 100%),
		linear-gradient(90deg, rgba(11, 12, 14, .8) 0%, rgba(11, 12, 14, .3) 55%, rgba(11, 12, 14, 0) 100%) !important;
	opacity: 1 !important;
}
.fy-page-hero .wp-block-cover__image-background { filter: saturate(.8) brightness(.8) contrast(1.08); }
.fy-page-hero h1 { font-size: min(7rem, 7.5vw); line-height: .92; margin: .6rem 0 0; }
@media (max-width: 600px) { .fy-page-hero h1 { font-size: 9.6vw; } }
.fy-page-head { padding-top: var(--wp--preset--spacing--70); padding-bottom: var(--wp--preset--spacing--50); border-bottom: 1px solid var(--fy-line); }

/* ---------- Ticker ---------- */

.fy-ticker { overflow: hidden; border-block: 1px solid var(--fy-line); background: var(--fy-base); }
.fy-ticker__track {
	display: flex;
	width: max-content;
	gap: 3rem;
	padding: 1.1rem 0;
	animation: fy-ticker 38s linear infinite;
	font-family: var(--fy-mono);
	font-size: 0.8rem;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--fy-muted);
	white-space: nowrap;
}
.fy-ticker__track span::before { content: "◆"; color: var(--fy-accent); margin-right: 3rem; font-size: .6rem; vertical-align: middle; }
@keyframes fy-ticker { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .fy-ticker__track { animation: none; } }

/* ---------- Stats ---------- */

.fy-stats { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 !important; }
.fy-stat { border-left: 1px solid var(--fy-line); padding: 0.25rem 1.5rem 0.5rem; }
.fy-stat:first-child { border-left: 0; padding-left: 0; }
.fy-stat__value { font-size: clamp(2.2rem, 4.5vw, 3.6rem) !important; font-weight: 800; line-height: 1; font-variation-settings: "wdth" 125; margin: 0 0 .5rem !important; }
.fy-stat__label { color: var(--fy-muted); font-size: .9rem; margin: 0 !important; }
@media (max-width: 781px) {
	.fy-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 2rem !important; }
	.fy-stat:nth-child(3) { border-left: 0; padding-left: 0; }
}

/* ---------- Section scaffolding ---------- */

.fy-section { padding-block: var(--wp--preset--spacing--70); }
.fy-section--tight { padding-block: var(--wp--preset--spacing--60); }
.fy-section-head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 1.5rem; margin-bottom: var(--wp--preset--spacing--50) !important; }
.fy-section-head h2 { margin: .6rem 0 0; }
.fy-section > p, .fy-section > .wp-block-buttons { max-width: var(--wp--style--global--wide-size) !important; }
.fy-section-head > * { margin: 0 !important; }
.fy-section-head > .fy-lede { flex: 0 1 26rem; }
.fy-rule { border-top: 1px solid var(--fy-line); }

/* Angled photo frames */
.fy-frame img,
.fy-frame.wp-block-image img {
	clip-path: polygon(0 0, calc(100% - 28px) 0, 100% 28px, 100% 100%, 28px 100%, 0 calc(100% - 28px));
	width: 100%;
	object-fit: cover;
}
.fy-frame--tall img { aspect-ratio: 4 / 5; }
.fy-frame--wide img { aspect-ratio: 16 / 10; }
.fy-frame--square img { aspect-ratio: 1; }
.fy-caption, .wp-block-image figcaption { font-family: var(--fy-mono); font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--fy-muted); }

/* Bento grid for the wrap story */
.fy-bento { display: grid !important; grid-template-columns: 1.3fr 1fr; grid-template-rows: auto auto; gap: 1rem !important; }
.fy-bento > :first-child { grid-row: span 2; }
.fy-bento img { width: 100%; height: 100%; object-fit: cover; }
.fy-bento figure { margin: 0 !important; height: 100%; }
@media (max-width: 781px) { .fy-bento { grid-template-columns: 1fr 1fr; } .fy-bento > :first-child { grid-column: span 2; grid-row: auto; } }

/* Numbered features / steps */
.fy-steps { counter-reset: fy-step; }
.fy-step { counter-increment: fy-step; border-top: 1px solid var(--fy-line); padding-top: 1.5rem; position: relative; }
.fy-step::before {
	content: "0" counter(fy-step);
	display: block;
	font-family: var(--fy-mono);
	font-size: .8rem;
	letter-spacing: .14em;
	color: var(--fy-accent);
	margin-bottom: 1.25rem;
}
.fy-step::after { content: ""; position: absolute; top: -1px; left: 0; width: 3rem; height: 1px; background: var(--fy-accent); }
.fy-step h3 { margin: 0 0 .6rem; }
.fy-step p { color: var(--fy-muted); margin: 0; }

.fy-feature-list { list-style: none; padding: 0 !important; margin: 0; }
.fy-feature-list li { display: grid; grid-template-columns: 9.5rem 1fr; gap: 1.5rem; padding: 1.4rem 0; border-top: 1px solid var(--fy-line); color: var(--fy-muted); }
.fy-feature-list li:last-child { border-bottom: 1px solid var(--fy-line); }
.fy-feature-list strong { color: var(--fy-text); text-transform: uppercase; letter-spacing: .04em; font-variation-settings: "wdth" 115; }
@media (max-width: 600px) { .fy-feature-list li { grid-template-columns: 1fr; gap: .35rem; } }

/* Panels */
.fy-panel { background: var(--fy-surface); border: 1px solid var(--fy-line); padding: var(--wp--preset--spacing--50) !important; }
.fy-panel--accent { background: var(--fy-accent); color: var(--fy-base); border: 0; }
.fy-panel--accent :is(h2, h3, p, a) { color: var(--fy-base) !important; }

/* CTA band */
.fy-cta.wp-block-cover { min-height: 70vh !important; }
.fy-cta .wp-block-cover__background { background-color: transparent !important; background: linear-gradient(90deg, rgba(11,12,14,.95) 0%, rgba(11,12,14,.7) 50%, rgba(11,12,14,.2) 100%) !important; opacity: 1 !important; }
.fy-cta h2 { font-size: var(--wp--preset--font-size--xx-large); }

/* FAQ */
.fy-faq .wp-block-details { border-top: 1px solid var(--fy-line); padding: 1.35rem 0; }
.fy-faq .wp-block-details:last-child { border-bottom: 1px solid var(--fy-line); }
.fy-faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 1rem; font-size: 1.15rem; font-weight: 700; font-variation-settings: "wdth" 110; }
.fy-faq summary::-webkit-details-marker { display: none; }
.fy-faq summary::after { content: "+"; font-family: var(--fy-mono); color: var(--fy-accent); font-size: 1.3rem; line-height: 1; transition: transform .25s ease; }
.fy-faq details[open] summary::after { transform: rotate(45deg); }
.fy-faq .wp-block-details p { color: var(--fy-muted); margin-top: .9rem; max-width: 46rem; }

/* Spec sheet (vehicle pages) */
.fy-specs { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 0 !important; border-top: 1px solid var(--fy-line); }
.fy-spec { padding: 1.25rem 1.25rem 1.25rem 0; border-bottom: 1px solid var(--fy-line); }
.fy-spec p { margin: 0 !important; }
.fy-spec p:last-child { font-size: 1.4rem; font-weight: 800; font-variation-settings: "wdth" 120; margin-top: .3rem !important; }

/* ---------- Fleetwire embeds ---------- */

.fy-fleet .wp-block-column { display: flex; }
.fy-fleet .wp-block-column > * { flex: 1; }
.fy-main .fleetwire-component,
.fy-main .fleetwire-listing-card { color: var(--fy-text); }
.fy-main .fw-card {
	background: var(--fy-surface) !important;
	border: 1px solid var(--fy-line) !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	transition: border-color .25s ease, transform .25s ease;
	overflow: hidden;
}
.fy-main .fw-card:hover { border-color: rgba(215, 255, 58, .55) !important; transform: translateY(-3px); }
.fy-main .fw-card-image img,
.fy-main .fw-image__image { transition: transform .6s ease; }
.fy-main .fw-card:hover .fw-image__image { transform: scale(1.03); }
.fy-main .fleetwire-listing-title,
.fy-main .fw-product-name {
	color: var(--fy-text) !important;
	font-weight: 800 !important;
	text-transform: uppercase;
	letter-spacing: .01em;
	font-variation-settings: "wdth" 118;
}
.fy-main .fw-btn,
.fy-main .fw-date-filter-button {
	border-radius: 0 !important;
	text-transform: uppercase;
	font-weight: 700 !important;
	letter-spacing: .04em;
}
.fy-main .fleetwire-details__title { margin: 0 0 .25rem; font-size: clamp(1.4rem, 2.1vw, 2rem); line-height: 1.1; word-break: normal; overflow-wrap: normal; hyphens: none; }
.fy-main .fleetwire-details__title .fleetwire-listing-title { font-size: inherit !important; }
.fy-main :is(.fleetwire-listing-gallery, .fleetwire-component) :is(img, .fw-image, .fw-responsive) { border-radius: 0 !important; }
.fy-book { position: sticky; top: calc(var(--fy-header-h) + 1.5rem); }
.fy-book .fy-eyebrow { margin-top: 1.5rem !important; }
.fy-main .fleetwire-details__price { color: var(--fy-accent); font-family: var(--fy-mono); letter-spacing: .06em; }
.fy-main .fleetwire-details__specs { color: var(--fy-muted); font-family: var(--fy-mono); font-size: .8rem; letter-spacing: .12em; text-transform: uppercase; }
.fy-main .fleetwire-listing-description { color: var(--fy-muted); }

/* ---------- Footer ---------- */

.fy-footer { border-top: 1px solid var(--fy-line); }
.fy-footer .fy-logo img { width: 200px; margin-bottom: 1rem; }
.fy-footer__links { list-style: none; padding: 0 !important; margin: 1rem 0 0; display: grid; gap: .55rem; }
.fy-footer__links a { text-decoration: none; color: var(--fy-text); opacity: .8; }
.fy-footer__links a:hover { opacity: 1; color: var(--fy-accent); }
.fy-footer__links li { color: var(--fy-muted); }
.fy-footer__legal { margin-top: var(--wp--preset--spacing--60) !important; padding-top: 1.5rem; border-top: 1px solid var(--fy-line); }
.fy-powered { color: var(--fy-muted); }
.fy-powered a { color: var(--fy-text); text-decoration: none; border-bottom: 1px solid var(--fy-accent); }

/* ---------- Article ---------- */

.fy-article .wp-block-post-title { margin-top: 1rem; }
.fy-article .wp-block-post-content p { color: rgba(242, 243, 245, .86); }
.fy-article .wp-block-post-content :is(h2, h3) { text-transform: none; font-variation-settings: "wdth" 110; }

/* ---------- Journal ---------- */

.fy-posts { gap: 2.5rem 1.5rem !important; }
.fy-post-card .wp-block-post-featured-image img { clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 20px, 100% 100%, 0 100%); transition: transform .5s ease; }
.fy-post-card .wp-block-post-featured-image { overflow: hidden; margin-bottom: 1rem; }
.fy-post-card:hover .wp-block-post-featured-image img { transform: scale(1.03); }
.fy-post-card .wp-block-post-title { margin: .5rem 0; font-size: 1.25rem; }
.fy-post-card .wp-block-post-title a { text-decoration: none; }
.fy-post-card .wp-block-post-excerpt__more-link { display: none; }
.fy-fleet-links { gap: 2rem !important; margin-top: 2rem !important; }
.fy-fleet-links a { text-decoration: none; border-bottom: 1px solid var(--fy-accent); }
.fy-panel h3 a { text-decoration: none; }
.fy-panel--accent h3 a:hover { color: var(--fy-base) !important; opacity: .7; }

/* Long titles on text pages and posts read better at sentence size. */
.fy-article .wp-block-post-title { text-transform: none; font-variation-settings: "wdth" 110; font-size: clamp(2rem, 4.2vw, 3.4rem) !important; line-height: 1.05; }
.fy-article .wp-block-post-content { font-size: 1.05rem; }
.fy-panel h3 { white-space: nowrap; font-size: clamp(1.25rem, 2.2vw, 2rem) !important; text-transform: none; }
@media (max-width: 781px) { .fy-panel h3 { white-space: normal; } }
.fy-article .wp-block-post-content h1 { text-transform: none; font-variation-settings: "wdth" 110; font-size: clamp(1.6rem, 3vw, 2.4rem); }
.fy-panel:not(.fy-panel--accent) h3 { font-size: clamp(1.05rem, 1.5vw, 1.45rem) !important; }
