/*
Theme Name: Zenki Premium
Theme URI: https://zenkimotors.com/
Description: Black-and-orange premium look for Zenki Motors, built as a child of Twenty Twenty-Five. Free to use: it relies only on WordPress core, the parent theme and the two fonts that ship with it (Manrope and Fira Sans).
Author: Prepared with Claude for Zenki Motors
Template: twentytwentyfive
Version: 1.0.0
Requires at least: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: zenki-premium
*/

/* ------------------------------------------------------------------
   1. Fonts - bundled with the parent theme, nothing loads from outside
   ------------------------------------------------------------------ */
@font-face { font-family: "Manrope"; src: url("../twentytwentyfive/assets/fonts/manrope/Manrope-VariableFont_wght.woff2") format("woff2"); font-weight: 200 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Fira Sans"; src: url("../twentytwentyfive/assets/fonts/fira-sans/FiraSans-Medium.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Fira Sans"; src: url("../twentytwentyfive/assets/fonts/fira-sans/FiraSans-SemiBold.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Fira Sans"; src: url("../twentytwentyfive/assets/fonts/fira-sans/FiraSans-Bold.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Fira Sans"; src: url("../twentytwentyfive/assets/fonts/fira-sans/FiraSans-ExtraBold.woff2") format("woff2"); font-weight: 800; font-style: normal; font-display: swap; }

/* ------------------------------------------------------------------
   2. Design tokens (taken from the Zenki logo: black + orange gradient)
   ------------------------------------------------------------------ */
:root {
	--zk-tarmac: #0f0e0d;
	--zk-graphite: #1e1b18;
	--zk-ink: #16130f;
	--zk-orange: #e8650f;
	--zk-amber: #fd9207;
	--zk-ember: #cc4609;
	--zk-paper: #f5f4f1;
	--zk-line: #e3e0db;
	--zk-stone: #5e5a55;
	--zk-sunrise: linear-gradient(100deg, #fd9207 0%, #e66211 55%, #cc4609 100%);
	--zk-radius: 8px;
	--zk-ease: cubic-bezier(.2, .7, .2, 1);
	--zk-display: "Fira Sans", "Noto Sans JP", "Hiragino Sans", "Yu Gothic", system-ui, sans-serif;
	--zk-text: "Manrope", "Noto Sans JP", "Hiragino Sans", "Yu Gothic", system-ui, sans-serif;
	--zk-pad: clamp(20px, 5vw, 64px);
	--zk-max: 1280px;
}

html { scroll-behavior: smooth; scroll-padding-top: 96px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; } }

body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
::selection { background: var(--zk-orange); color: var(--zk-tarmac); }
:where(a, button, input, select, textarea, summary):focus-visible { outline: 3px solid var(--zk-amber); outline-offset: 3px; }

/* ------------------------------------------------------------------
   3. Page shell - full width, no gaps between header / content / footer
   ------------------------------------------------------------------ */
.wp-site-blocks { padding-left: 0; padding-right: 0; overflow-x: clip; }
.wp-site-blocks > * + * { margin-block-start: 0; }
.zk-main { margin-block-start: 0 !important; }

/* Elementor pages are designed to be full width: let them be. */
.wp-block-post-content > .elementor,
.wp-block-post-content > .elementor-location-single { max-width: none !important; }
.wp-block-post-content.is-layout-constrained > .alignfull { max-width: none; }
.elementor-page .wp-block-post-content { padding-left: 0; padding-right: 0; }

/* The page title is kept for search engines and screen readers, but hidden
   on Elementor pages because each of them already carries its own heading. */
.elementor-page .zk-pagehead {
	position: absolute !important;
	width: 1px; height: 1px; padding: 0 !important; margin: -1px !important;
	overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0;
}
.zk-pagehead { background: var(--zk-tarmac); color: #fff; padding: clamp(48px, 7vw, 96px) var(--zk-pad); position: relative; }
.zk-pagehead::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--zk-sunrise); }
.zk-pagehead .wp-block-post-title { max-width: var(--zk-max); margin: 0 auto; color: #fff; }

/* Plain (non-Elementor) page content */
body:not(.elementor-page) .zk-content { padding: clamp(40px, 6vw, 80px) var(--zk-pad) clamp(64px, 9vw, 128px); }

/* ------------------------------------------------------------------
   4. Header
   ------------------------------------------------------------------ */
.wp-site-blocks > header.wp-block-template-part { position: sticky; top: 0; z-index: 999; }
.admin-bar .wp-site-blocks > header.wp-block-template-part { top: 32px; }
@media (max-width: 782px) { .admin-bar .wp-site-blocks > header.wp-block-template-part { top: 46px; } }

.zk-header {
	position: relative;
	background: rgba(15, 14, 13, .96);
	color: #fff;
	padding-left: var(--zk-pad); padding-right: var(--zk-pad);
	-webkit-backdrop-filter: saturate(140%) blur(10px);
	backdrop-filter: saturate(140%) blur(10px);
}
.zk-header::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--zk-sunrise); }
.zk-header__inner { max-width: var(--zk-max); margin-left: auto !important; margin-right: auto !important; min-height: 76px; gap: 24px; }
.zk-logo { display: block; line-height: 0; flex: 0 0 auto; }
.zk-logo img { display: block; width: clamp(118px, 11vw, 150px); height: auto; }

.zk-nav { flex: 1 1 auto; }
.zk-nav .wp-block-navigation__container { gap: clamp(14px, 1.8vw, 28px); }
.zk-nav .wp-block-navigation-item__content {
	position: relative; padding: .55rem .1rem;
	font-family: var(--zk-display); font-weight: 500; font-size: .98rem; letter-spacing: .005em;
	color: rgba(255, 255, 255, .8); text-decoration: none !important; transition: color .2s;
}
.zk-nav .wp-block-navigation-item__content::after {
	content: ""; position: absolute; left: .1rem; right: .1rem; bottom: 2px; height: 2px;
	background: var(--zk-sunrise); transform: scaleX(0); transform-origin: left; transition: transform .28s var(--zk-ease);
}
.zk-nav .wp-block-navigation-item__content:hover,
.zk-nav .wp-block-navigation-item__content[aria-current="page"] { color: #fff; }
.zk-nav .wp-block-navigation-item__content:hover::after,
.zk-nav .wp-block-navigation-item__content[aria-current="page"]::after { transform: scaleX(1); }

.zk-header__cta { flex: 0 0 auto; gap: 10px; flex-wrap: nowrap; }
.zk-header .wp-block-button__link { padding: .62rem 1.15rem; font-size: .95rem; }

/* Collapse to the menu button earlier than WordPress does (below 1080px) */
@media (max-width: 1079px) {
	.zk-nav .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; color: #fff; }
	.zk-nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
	.zk-header__cta { order: 2; margin-left: auto; }
	.zk-nav { order: 3; flex: 0 0 auto; margin-left: 0; }
	/* a blurred header would trap the full-screen menu inside the header bar */
	.zk-header { background: var(--zk-tarmac); -webkit-backdrop-filter: none; backdrop-filter: none; }
}
@media (min-width: 1080px) { .zk-nav .zk-nav-mobile-only { display: none; } }
@media (max-width: 480px) {
	.zk-header__inner { gap: 12px; min-height: 68px; }
	.zk-header .wp-block-button__link { padding: .5rem .85rem; font-size: .9rem; }
}
.zk-nav .wp-block-navigation__responsive-container-open,
.zk-nav .wp-block-navigation__responsive-container-close {
	background: transparent !important; color: #fff !important; box-shadow: none;
	border: 1px solid rgba(255, 255, 255, .3) !important; border-radius: 6px !important; padding: 8px !important;
}
.zk-nav .wp-block-navigation__responsive-container.is-menu-open { background: var(--zk-tarmac); padding: 28px var(--zk-pad); }
.zk-nav .is-menu-open .wp-block-navigation-item__content { font-size: 1.5rem; font-family: var(--zk-display); font-weight: 600; color: #fff; }

/* ------------------------------------------------------------------
   5. Footer
   ------------------------------------------------------------------ */
.zk-footer {
	position: relative; background: var(--zk-tarmac); color: rgba(255, 255, 255, .72);
	padding: clamp(56px, 7vw, 96px) var(--zk-pad) 28px;
}
.zk-footer::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px; background: var(--zk-sunrise); }
.zk-footer__grid, .zk-footer__base { max-width: var(--zk-max); margin-left: auto !important; margin-right: auto !important; }
.zk-footer__grid { display: grid !important; grid-template-columns: 1.7fr 1fr 1fr 1fr; gap: clamp(32px, 5vw, 72px); align-items: start; }
.zk-footer__grid > * { margin: 0 !important; }
.zk-footer .zk-logo img { width: 170px; }
.zk-footer__tag { font-family: var(--zk-display); font-weight: 600; font-size: 1.25rem; line-height: 1.3; color: #fff; margin: 1.25rem 0 .75rem; max-width: 22ch; }
.zk-footer__note { font-size: .95rem; max-width: 40ch; margin: 0; }
.zk-footer__title { font-family: var(--zk-display); font-size: 1rem !important; font-weight: 600; letter-spacing: .01em; color: #fff; margin: 0 0 1rem !important; }
.zk-footer a { color: rgba(255, 255, 255, .72); text-decoration: none !important; transition: color .2s; }
.zk-footer a:hover { color: var(--zk-amber); }
.zk-footer .wp-block-navigation { font-size: .95rem; }
.zk-footer .wp-block-navigation__container { gap: .6rem; }
.zk-footer .wp-block-navigation-item__content { padding: 0; }
.zk-footer__base { display: flex; flex-wrap: wrap; gap: 14px 32px; justify-content: space-between; align-items: center; margin-top: clamp(40px, 5vw, 72px) !important; padding-top: 24px; border-top: 1px solid rgba(255, 255, 255, .12); font-size: .875rem; }
.zk-footer__copy { margin: 0; }
.zk-footer__base .wp-block-navigation__container { gap: 1.5rem; }
/* keep the legal links clear of the floating chat bubble */
@media (min-width: 701px) { .zk-footer__base { padding-right: 104px; } }
@media (max-width: 700px) { .zk-footer { padding-bottom: 96px; } }
@media (max-width: 900px) { .zk-footer__grid { grid-template-columns: 1fr 1fr; } .zk-footer__brand { grid-column: 1 / -1; } }
@media (max-width: 520px) { .zk-footer__grid { grid-template-columns: 1fr; } }

/* ------------------------------------------------------------------
   6. Buttons and forms (WordPress, Elementor, Contact Form 7)
   ------------------------------------------------------------------ */
.wp-block-button__link,
.elementor-button,
.wpcf7 input[type="submit"],
.wpcf7 button[type="submit"],
.wpcf7 button#submit,
.elementor-field-type-submit .elementor-button {
	font-family: var(--zk-display) !important; font-weight: 600 !important; letter-spacing: .01em;
	background: var(--zk-sunrise) !important; color: var(--zk-tarmac) !important;
	border: 0 !important; border-radius: 6px !important; box-shadow: none;
	transition: transform .2s var(--zk-ease), box-shadow .2s var(--zk-ease), filter .2s;
}
.wp-block-button__link:hover, .elementor-button:hover, .wpcf7 input[type="submit"]:hover {
	transform: translateY(-2px); filter: brightness(1.06); box-shadow: 0 10px 24px -8px rgba(232, 101, 15, .55);
}
.elementor-button .elementor-button-text, .elementor-button-icon { color: inherit !important; fill: currentColor !important; }

.wpcf7 input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
.wpcf7 textarea, .wpcf7 select,
.elementor-field-textual, .elementor-select-wrapper select {
	font-family: var(--zk-text); font-size: 1rem; color: var(--zk-ink);
	background: #fff; border: 1px solid #cfcac3; border-radius: 6px; padding: .85rem 1rem; width: 100%;
	transition: border-color .2s, box-shadow .2s;
}
.wpcf7 input:focus, .wpcf7 textarea:focus, .wpcf7 select:focus, .elementor-field-textual:focus {
	outline: none; border-color: var(--zk-orange); box-shadow: 0 0 0 3px rgba(232, 101, 15, .22);
}
.wpcf7 label, .elementor-field-label { font-family: var(--zk-display); font-weight: 600; font-size: .95rem; }

/* ------------------------------------------------------------------
   7. Elementor content - typography and small refinements
   ------------------------------------------------------------------ */
.elementor-heading-title, .elementor-headline, .elementor-widget-heading .elementor-heading-title {
	font-family: var(--zk-display) !important; letter-spacing: -.015em;
}
.elementor-widget-text-editor, .elementor-widget-text-editor p { font-family: var(--zk-text); }
.elementor-widget-image img { border-radius: var(--zk-radius); }
.elementor-accordion-item, .elementor-toggle-item { border-color: var(--zk-line) !important; }
.elementor-tab-title, .elementor-toggle-title, .elementor-accordion-title { font-family: var(--zk-display); font-weight: 600; }
.elementor-tab-title.elementor-active, .elementor-toggle-title:hover, .elementor-accordion-title:hover { color: var(--zk-ember); }

/* ------------------------------------------------------------------
   8. Blog
   ------------------------------------------------------------------ */
.wp-block-post-title a { text-decoration: none; }
.wp-block-post-title a:hover { color: var(--zk-ember); }
.wp-block-post-date, .wp-block-post-terms { color: var(--zk-stone); font-size: .9rem; }
.wp-block-query .wp-block-post { padding-block: 1.5rem; border-bottom: 1px solid var(--zk-line); }
body:not(.elementor-page) .wp-block-post-content a:not(.wp-block-button__link) { color: var(--zk-ember); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .15em; }
body:not(.elementor-page) .wp-block-post-content a:not(.wp-block-button__link):hover { color: var(--zk-orange); }

/* ------------------------------------------------------------------
   9. Homepage refinements
   Nothing is removed from the page data. Where a Vehica listing widget
   is switched off, Elementor outputs an empty section; those are only
   collapsed while they are empty, so listings reappear untouched the
   moment Vehica is active again.
   ------------------------------------------------------------------ */
.elementor-element-36ff8e8:not(:has(.elementor-widget:not(.elementor-widget-spacer))),
.elementor-element-5741fb0c:not(:has(.elementor-widget:not(.elementor-widget-spacer))),
.elementor-element-3091e14c:not(:has(.elementor-widget:not(.elementor-widget-spacer))),
.elementor-element-5e044c7d:not(:has(.elementor-widget:not(.elementor-widget-spacer))),
.elementor-element-72dffa7d:not(:has(.elementor-widget:not(.elementor-widget-spacer))) { display: none !important; }

/* Hero: keep the first screen compact and the headline in proportion */
.vehica-hero-v1 .elementor-widget-spacer:first-child .elementor-spacer-inner { height: clamp(48px, 9vh, 110px) !important; }
.vehica-hero-v1 .elementor-widget-spacer:last-child .elementor-spacer-inner { height: clamp(40px, 8vh, 96px) !important; }
.vehica-hero-v1 .elementor-element-3a22795 .elementor-spacer-inner { height: 16px !important; }
.vehica-hero-v1 .elementor-element-d2fc1fe .elementor-heading-title { font-size: clamp(1.35rem, 2.8vw, 2.25rem) !important; line-height: 1.2 !important; }
.vehica-hero-v1 .elementor-widget-animated-headline .elementor-headline { font-size: clamp(2.1rem, 4.9vw, 4.25rem) !important; line-height: 1.08 !important; letter-spacing: -.025em; }
.vehica-hero-v1 .elementor-element-867c1a8 { max-width: 760px; margin-left: auto; margin-right: auto; }
.vehica-hero-v1 .elementor-element-867c1a8 p { font-size: clamp(1rem, 1.35vw, 1.15rem); line-height: 1.65; color: rgba(255, 255, 255, .9); }

/* "Why choose Zenki" cards */
.elementor-element-95cc260, .elementor-element-b4f03af, .elementor-element-5b0f337 {
	background: #fff; border: 1px solid var(--zk-line) !important; border-radius: 14px !important;
	box-shadow: inset 0 3px 0 var(--zk-orange); transition: border-color .25s, box-shadow .25s;
}
.elementor-element-95cc260:hover, .elementor-element-b4f03af:hover, .elementor-element-5b0f337:hover {
	border-color: rgba(232, 101, 15, .55) !important; box-shadow: inset 0 3px 0 var(--zk-orange), 0 22px 40px -28px rgba(15, 14, 13, .4);
}
.elementor-element-7bf8e30b .elementor-icon svg, .elementor-element-7bf8e30b .elementor-icon svg * { fill: var(--zk-orange) !important; }
.elementor-element-7bf8e30b .elementor-widget-text-editor { color: var(--zk-stone); }

/* Loan Calculator page: the original Vehica widget draws nothing while Vehica is off,
   so the spacers around it are trimmed (they return to normal if the widget renders). */
.elementor-element-ff5ae5e:not(:has(.elementor-widget-vehica_loan_calculator_general_widget)) .elementor-element-b2fdcac .elementor-spacer-inner,
.elementor-element-ff5ae5e:not(:has(.elementor-widget-vehica_loan_calculator_general_widget)) .elementor-element-1607bc3 .elementor-spacer-inner { height: 0 !important; }