/* Kennedy Timepieces — brand utility classes.
   theme.json holds reusable tokens (colors, font families/sizes, layout width);
   this file holds the letter-spacing / uppercase / badge recipes that recur
   across the design but aren't first-class theme.json presets.

   NOTE ON !important: this site has the Pagelayer page-builder plugin active,
   which ships a global stylesheet setting `body.pagelayer-body p`,
   `body.pagelayer-body a`, and `body.pagelayer-body h2` colors directly. Those
   compound selectors out-specificity our plain single-class rules, so every
   color declaration that lands on a <p>, <a>, or heading below carries
   !important to guarantee it wins regardless of which page-builder plugins
   are active or how their styles are enqueued/cached. */

*, *::before, *::after { box-sizing: border-box; }

img { max-width: 100%; height: auto; display: block; }

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
	outline: 2px solid var(--wp--preset--color--kt-blue);
	outline-offset: 2px;
}

/* Generic inline text link (for bare <a> tags rendered by shortcodes/PHP that
   carry no other styling class), e.g. phone/email links in body copy. */
.kt-link { color: var(--wp--preset--color--kt-blue) !important; }
.kt-link:hover { color: var(--wp--preset--color--kt-blue-hover) !important; }

/* Eyebrow: small uppercase label above a headline, e.g. "PRE-OWNED LUXURY WATCHES · LOS ANGELES" */
.kt-eyebrow {
	display: block;
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--xs);
	letter-spacing: 0.32em;
	text-transform: uppercase;
	color: var(--wp--preset--color--kt-blue) !important;
}
.kt-eyebrow--on-blue { color: var(--wp--preset--color--kt-blue-light) !important; }
.kt-eyebrow--muted { color: var(--wp--preset--color--kt-taupe) !important; font-size: var(--wp--preset--font-size--xs); letter-spacing: 0.32em; }

/* Uppercase label: nav links, section labels, small headers ("Shop", "Company", "Contact") */
.kt-label {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--sm);
	letter-spacing: 0.18em;
	text-transform: uppercase;
}
.kt-label--wide { letter-spacing: 0.28em; font-size: var(--wp--preset--font-size--xs); }

/* Underlined text link used as a low-emphasis CTA, e.g. "View full catalog" */
.kt-text-link {
	display: inline-block;
	font-size: var(--wp--preset--font-size--sm);
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--wp--preset--color--kt-blue) !important;
	border-bottom: 1px solid var(--wp--preset--color--kt-blue);
	padding-bottom: 4px;
	text-decoration: none;
}
.kt-text-link:hover { color: var(--wp--preset--color--kt-blue-hover) !important; border-color: var(--wp--preset--color--kt-blue-hover); }
.kt-text-link[aria-disabled="true"] {
	color: var(--wp--preset--color--kt-muted) !important;
	border-color: var(--wp--preset--color--kt-muted);
	cursor: default;
	pointer-events: none;
}

/* Small pill badge over a photo, e.g. "First piece" */
.kt-badge {
	display: inline-block;
	padding: 6px 10px;
	background: var(--wp--preset--color--kt-blue);
	color: var(--wp--preset--color--white);
	font-size: 10px;
	letter-spacing: 0.24em;
	text-transform: uppercase;
}

/* Buttons: theme.json covers the default (solid blue) wp-block-button.
   These modifiers cover the outline and on-blue-background variants. */
.wp-block-button.is-style-outline .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--kt-ink);
	border: 1px solid var(--wp--preset--color--kt-ink);
}
.wp-block-button.is-style-outline .wp-block-button__link:hover {
	color: var(--wp--preset--color--kt-blue-hover);
	border-color: var(--wp--preset--color--kt-blue-hover);
}
.wp-block-button.is-style-on-blue .wp-block-button__link {
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--kt-blue);
}
.wp-block-button.is-style-on-blue .wp-block-button__link:hover {
	background: var(--wp--preset--color--kt-blue-pale);
	color: var(--wp--preset--color--kt-blue);
}
/* Minimum 44px tap target on every button, per spec */
.wp-block-button__link { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }

/* Photo-coming-soon placeholder tile (square catalog card with no photo yet) */
.kt-photo-placeholder {
	aspect-ratio: 1 / 1;
	background: var(--wp--preset--color--kt-navy);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: var(--wp--preset--font-size--xs);
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: var(--wp--preset--color--kt-navy-text);
	text-align: center;
	padding: var(--wp--preset--spacing--40);
}

/* Card brand label, e.g. "OMEGA" above the model name */
.kt-card-brand {
	font-size: var(--wp--preset--font-size--xs);
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: var(--wp--preset--color--kt-taupe) !important;
}

/* ---------- Header ---------- */
.kt-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--40);
	padding: 22px var(--wp--preset--spacing--gutter);
	background: var(--wp--preset--color--white);
	border-bottom: 1px solid var(--wp--preset--color--kt-line);
}
.kt-brand-logo { margin: 0; }
.kt-brand-logo img { display: block; height: 40px; width: auto; }
.kt-brand-logo--footer img { height: 34px; }

.kt-nav .wp-block-navigation__container { gap: 36px; }
.kt-nav .wp-block-navigation-item__label {
	font-size: var(--wp--preset--font-size--sm);
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--wp--preset--color--kt-ink);
}
.kt-nav a:hover .wp-block-navigation-item__label { color: var(--wp--preset--color--kt-blue-hover); }
.kt-nav .wp-block-navigation__responsive-container-open,
.kt-nav .wp-block-navigation__responsive-container-close {
	min-width: 44px;
	min-height: 44px;
}

/* ---------- Footer ---------- */
.kt-footer { padding: 72px var(--wp--preset--spacing--gutter) 40px; display: flex; flex-direction: column; gap: 56px; }
.kt-footer a { color: var(--wp--preset--color--white) !important; }
.kt-footer a:hover { color: var(--wp--preset--color--kt-blue-light) !important; }
.kt-footer-grid {
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr 1fr;
	gap: 48px;
}
.kt-footer__brand { display: flex; flex-direction: column; gap: 18px; }
.kt-footer__tagline { margin: 0; font-size: var(--wp--preset--font-size--base); font-weight: 300; line-height: 1.6; color: var(--wp--preset--color--kt-footer-muted) !important; max-width: 340px; }
.kt-footer__col { display: flex; flex-direction: column; gap: 12px; margin: 0; }
.kt-footer__col p { margin: 0; }
.kt-footer__col-label { color: var(--wp--preset--color--kt-footer-label) !important; font-size: var(--wp--preset--font-size--xs); letter-spacing: 0.28em; text-transform: uppercase; }
.kt-footer__link { font-size: var(--wp--preset--font-size--sm); letter-spacing: 0.12em; text-transform: uppercase; }
.kt-footer__contact { font-size: var(--wp--preset--font-size--base); font-weight: 300; }
.kt-footer__contact p { color: var(--wp--preset--color--kt-footer-text) !important; }
.kt-footer__bottom {
	display: flex;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--40);
	font-size: 12px;
	letter-spacing: 0.06em;
	border-top: 1px solid var(--wp--preset--color--kt-footer-line);
	padding-top: 24px;
}
.kt-footer__copyright, .kt-footer__legal-links { margin: 0; color: var(--wp--preset--color--kt-footer-label) !important; }

/* ---------- Layout grid utilities (generic 2/3/4-col sections; collapse rules in the media queries below) ---------- */
.kt-grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 56px; }
.kt-grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.kt-grid-4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }

/* ---------- Hero ---------- */
.kt-hero { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; min-height: 640px; }
.kt-hero__intro { display: flex; flex-direction: column; justify-content: center; gap: 28px; padding: 96px var(--wp--preset--spacing--gutter); }
.kt-hero__intro .kt-eyebrow { margin: 0; }
.kt-hero__subhead { max-width: 520px; }
.kt-hero__media.wp-block-cover { min-height: 640px; }
.kt-btn-row.wp-block-buttons { gap: 16px !important; margin-top: 8px; }

/* Shared "lead paragraph" recipe used under a headline */
.kt-lead { font-size: var(--wp--preset--font-size--lg); font-weight: 300; line-height: 1.6; color: var(--wp--preset--color--kt-muted) !important; }

/* Small muted meta line under a heading, e.g. a legal page's effective date */
.kt-meta-line { margin: -8px 0 0; font-size: var(--wp--preset--font-size--base); color: var(--wp--preset--color--kt-muted) !important; }

/* ---------- Trust strip ---------- */
.kt-trust-strip {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	background: var(--wp--preset--color--white);
	border-top: 1px solid var(--wp--preset--color--kt-line);
	border-bottom: 1px solid var(--wp--preset--color--kt-line);
}
.kt-trust-strip__item {
	padding: 28px 40px;
	border-right: 1px solid var(--wp--preset--color--kt-line);
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin: 0;
}
.kt-trust-strip__item:last-child { border-right: none; }
.kt-trust__label { margin: 0; font-size: var(--wp--preset--font-size--xs); letter-spacing: 0.24em; text-transform: uppercase; color: var(--wp--preset--color--kt-blue) !important; }
.kt-trust__desc { margin: 0; font-size: var(--wp--preset--font-size--base); font-weight: 300; color: var(--wp--preset--color--kt-muted) !important; }

/* ---------- Catalog preview / section header ---------- */
.kt-section { padding: 88px var(--wp--preset--spacing--gutter); display: flex; flex-direction: column; gap: 40px; }
.kt-section-header { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--wp--preset--spacing--40); flex-wrap: wrap; }
.kt-section-header__text { display: flex; flex-direction: column; gap: 10px; margin: 0; }
.kt-section-header__text .kt-eyebrow { margin: 0; }
.kt-section-header__text h2 { margin: 0; }

.kt-watch-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.kt-watch-card { display: flex; flex-direction: column; gap: 14px; }
.kt-watch-card__photo { aspect-ratio: 1 / 1; background: var(--wp--preset--color--kt-ink); position: relative; overflow: hidden; }
.kt-watch-card__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.kt-watch-card__badge { position: absolute; top: 14px; left: 14px; }
.kt-watch-card__meta { margin: 0; font-size: var(--wp--preset--font-size--base); font-weight: 300; color: var(--wp--preset--color--kt-muted) !important; }
.kt-watch-card__model { margin: 0; font-family: var(--wp--preset--font-family--heading); font-size: var(--wp--preset--font-size--lg); color: var(--wp--preset--color--kt-ink) !important; }
.kt-watch-card .kt-text-link { align-self: flex-start; }
.kt-empty-state { font-size: var(--wp--preset--font-size--lg); font-weight: 300; color: var(--wp--preset--color--kt-muted) !important; max-width: 640px; }

/* ---------- Kennedy Exchange ---------- */
.kt-exchange {
	background: var(--wp--preset--color--kt-blue);
	color: var(--wp--preset--color--white);
	padding: 96px var(--wp--preset--spacing--gutter);
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 72px;
}
.kt-exchange__intro { display: flex; flex-direction: column; gap: 22px; margin: 0; }
.kt-exchange__intro .kt-eyebrow { margin: 0; }
.kt-exchange__intro h2 { margin: 0; color: var(--wp--preset--color--white) !important; }
.kt-exchange__lead { margin: 0; font-size: var(--wp--preset--font-size--xl); font-weight: 300; line-height: 1.6; color: var(--wp--preset--color--kt-blue-pale) !important; max-width: 480px; }
.kt-exchange .wp-block-button { margin-top: 10px; align-self: flex-start; }
.kt-exchange__steps { display: flex; flex-direction: column; }
.kt-exchange__step { display: flex; gap: 24px; padding: 26px 0; border-top: 1px solid rgba(255, 255, 255, 0.25); margin: 0; }
.kt-exchange__step:last-child { border-bottom: 1px solid rgba(255, 255, 255, 0.25); }
.kt-exchange__num { font-family: var(--wp--preset--font-family--heading); font-size: var(--wp--preset--font-size--2xl); color: var(--wp--preset--color--kt-blue-light) !important; width: 40px; flex-shrink: 0; }
.kt-exchange__step-body { display: flex; flex-direction: column; gap: 6px; }
.kt-exchange__step-title { margin: 0; font-size: var(--wp--preset--font-size--md); letter-spacing: 0.06em; color: var(--wp--preset--color--white) !important; }
.kt-exchange__step-desc { margin: 0; font-size: var(--wp--preset--font-size--base); font-weight: 300; color: var(--wp--preset--color--kt-blue-pale) !important; line-height: 1.55; }

/* ---------- Brands strip ---------- */
.kt-brands {
	padding: 64px var(--wp--preset--spacing--gutter);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 26px;
	background: var(--wp--preset--color--white);
	border-bottom: 1px solid var(--wp--preset--color--kt-line);
}
.kt-brands__list {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 44px;
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--xl);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--wp--preset--color--kt-ink);
	margin: 0;
	padding: 0;
	list-style: none;
}

/* ---------- Page subhead (a strong lede under an H1, not a second heading level) ---------- */
.kt-page-subhead {
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--2xl);
	font-weight: 500;
	line-height: 1.25;
	color: var(--wp--preset--color--kt-ink) !important;
	margin: 0;
}

/* ---------- Numbered steps, light background (Sell or Trade page) ---------- */
.kt-steps { display: flex; flex-direction: column; margin: 0; }
.kt-steps__step { display: flex; gap: 24px; padding: 26px 0; border-top: 1px solid var(--wp--preset--color--kt-line); margin: 0; }
.kt-steps__step:last-child { border-bottom: 1px solid var(--wp--preset--color--kt-line); }
.kt-steps__num { font-family: var(--wp--preset--font-family--heading); font-size: var(--wp--preset--font-size--2xl); color: var(--wp--preset--color--kt-blue) !important; width: 44px; flex-shrink: 0; }
.kt-steps__body { display: flex; flex-direction: column; gap: 6px; }
.kt-steps__title { margin: 0; font-size: var(--wp--preset--font-size--md); letter-spacing: 0.06em; color: var(--wp--preset--color--kt-ink) !important; }
.kt-steps__desc { margin: 0; font-size: var(--wp--preset--font-size--base); font-weight: 300; color: var(--wp--preset--color--kt-muted) !important; line-height: 1.55; }

/* ---------- Q&A ---------- */
.kt-qa { display: flex; flex-direction: column; gap: 32px; }
.kt-qa__item { margin: 0; display: flex; flex-direction: column; gap: 8px; }
.kt-qa__question { margin: 0; font-size: var(--wp--preset--font-size--lg); }
.kt-qa__answer { margin: 0; font-size: var(--wp--preset--font-size--base); font-weight: 300; color: var(--wp--preset--color--kt-muted) !important; line-height: 1.6; }

/* ---------- Forms (Sell or Trade, Contact) ---------- */
.kt-form { display: flex; flex-direction: column; gap: 20px; max-width: 640px; }
.kt-form__row { display: flex; gap: 20px; flex-wrap: wrap; }
.kt-form__row .kt-form__field { flex: 1 1 220px; }
.kt-form__field { display: flex; flex-direction: column; gap: 6px; margin: 0; }
.kt-form label { font-size: var(--wp--preset--font-size--sm); letter-spacing: 0.06em; color: var(--wp--preset--color--kt-ink); }
.kt-form input[type="text"],
.kt-form input[type="email"],
.kt-form input[type="tel"],
.kt-form input[type="url"],
.kt-form textarea,
.kt-form select {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--md);
	padding: 12px 14px;
	min-height: 44px;
	border: 1px solid var(--wp--preset--color--kt-line);
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--kt-ink);
}
.kt-form textarea { min-height: 120px; }
.kt-form fieldset { border: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.kt-form legend { font-size: var(--wp--preset--font-size--sm); letter-spacing: 0.06em; padding: 0; margin: 0 0 4px; }
.kt-form fieldset label,
.kt-form__checks label {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: var(--wp--preset--font-size--md);
	letter-spacing: normal;
}
.kt-form__checks { display: flex; gap: 24px; margin: 0; }
.kt-form__field input[type="file"] { font-size: var(--wp--preset--font-size--base); }
.kt-form button[type="submit"] {
	align-self: flex-start;
	background: var(--wp--preset--color--kt-blue);
	color: var(--wp--preset--color--white);
	border: none;
	cursor: pointer;
	font-family: var(--wp--preset--font-family--body);
}
.kt-form button[type="submit"]:hover { background: var(--wp--preset--color--kt-blue-hover); }
.kt-form__note { margin: 0; font-size: var(--wp--preset--font-size--base); font-weight: 300; color: var(--wp--preset--color--kt-muted) !important; }
.kt-form__error { margin: 0; padding: 12px 16px; background: var(--wp--preset--color--kt-ivory); border: 1px solid var(--wp--preset--color--kt-blue); color: var(--wp--preset--color--kt-ink) !important; font-size: var(--wp--preset--font-size--base); }
.kt-form-success { padding: 24px; background: var(--wp--preset--color--kt-ivory); border: 1px solid var(--wp--preset--color--kt-line); max-width: 640px; }
.kt-form-success p { margin: 0; font-size: var(--wp--preset--font-size--lg); color: var(--wp--preset--color--kt-ink) !important; }
/* Honeypot: present in the DOM for bots, invisible to sighted users and hidden from assistive tech. */
.kt-form__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ---------- About ---------- */
.kt-about { align-items: start; gap: 56px; }
.kt-photo-slot { aspect-ratio: 3 / 4; background: var(--wp--preset--color--kt-line); overflow: hidden; }
.kt-photo-slot img { width: 100%; height: 100%; object-fit: cover; display: block; }
.kt-about__body { display: flex; flex-direction: column; gap: 20px; }
.kt-signature { margin: 10px 0 0; padding-top: 20px; border-top: 1px solid var(--wp--preset--color--kt-line); font-family: var(--wp--preset--font-family--heading); font-style: italic; font-size: var(--wp--preset--font-size--lg); color: var(--wp--preset--color--kt-ink) !important; line-height: 1.5; }

/* ---------- Contact ---------- */
.kt-contact-info { display: flex; flex-direction: column; gap: 20px; }
.kt-detail { margin: 0; display: flex; flex-direction: column; gap: 4px; font-size: var(--wp--preset--font-size--md); font-weight: 300; color: var(--wp--preset--color--kt-ink) !important; }
.kt-detail .kt-label { color: var(--wp--preset--color--kt-taupe) !important; }

/* Responsive: two-column sections stack under 900px; nav collapses to a menu button. */
@media (max-width: 900px) {
	.kt-grid-2 { grid-template-columns: 1fr !important; }
	.kt-grid-3 { grid-template-columns: 1fr !important; }
	.kt-grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
	.kt-hero { grid-template-columns: 1fr !important; }
	.kt-hero__intro { padding: 56px var(--wp--preset--spacing--gutter); }
	.kt-hero__media.wp-block-cover { min-height: 360px; }
	.kt-trust-strip { grid-template-columns: 1fr !important; }
	.kt-trust-strip__item { border-right: none; border-bottom: 1px solid var(--wp--preset--color--kt-line); }
	.kt-trust-strip__item:last-child { border-bottom: none; }
	.kt-watch-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
	.kt-exchange { grid-template-columns: 1fr !important; gap: 48px; }
	.kt-footer-grid { grid-template-columns: 1fr 1fr !important; }
	.kt-footer__bottom { flex-direction: column; gap: var(--wp--preset--spacing--20); }
	.kt-form__row { flex-direction: column; gap: 20px; }
}
@media (max-width: 560px) {
	.kt-grid-4 { grid-template-columns: 1fr !important; }
	.kt-watch-grid { grid-template-columns: 1fr !important; }
	.kt-footer-grid { grid-template-columns: 1fr !important; }
}