/*
Theme Name: KMM Machine
Theme URI: https://killermarketingmachines.com
Author: Jack Turk
Description: Minimal noir theme for Killer Marketing Machines. On activation it creates a "KMM Home" page built from ordinary editable blocks and sets it as the homepage. Edit it in Pages > KMM Home.
Version: 2.1
Requires at least: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: kmm-machine
*/

/* ---------- Base ---------- */
html { scroll-behavior: smooth; }
body { margin: 0; background: #14110F; color: #EFE6D2; font-family: 'Libre Franklin', system-ui, sans-serif; font-size: 17px; line-height: 1.6; }
a { color: #D9B65E; }
a:hover { color: #EFE6D2; }
img { max-width: 100%; height: auto; }
[id] { scroll-margin-top: 16px; }

/* Classic themes wrap group contents in an extra inner container; make it transparent
   so the nav, footer and photo box lay out side by side exactly as designed. */
.wp-block-group[class*="kmm-"] > .wp-block-group__inner-container { display: contents; }

/* Neutralise default block spacing inside the homepage; spacing is set below. */
:where(.kmm-sec, .kmm-nav, .kmm-footer) :where(.is-layout-flow, .is-layout-constrained) > * { margin-block-start: 0; }
:where(.kmm-sec) p, :where(.kmm-sec) ul { margin: 0 0 16px; }
:where(.kmm-sec) :is(h1, h2, h3) { margin-top: 0; }

/* ---------- Sections ---------- */
.kmm-sec { margin: 0 !important; padding: 96px 0; }
.kmm-wrap { max-width: 1160px; margin: 0 auto !important; padding-left: 24px; padding-right: 24px; box-sizing: border-box; }
.kmm-dark { background: #14110F; color: #C9BEA8; }
.kmm-panel { background: #1A1613; color: #C9BEA8; border-top: 1px solid #3A322A; border-bottom: 1px solid #3A322A; }
.kmm-cream { background: #EFE6D2; color: #3D352D; }
.kmm-hero { padding: 88px 0 96px; }
.kmm-tight { padding: 72px 0; }
.kmm-center { text-align: center; }

/* ---------- Type ---------- */
.kmm-eyebrow { font-family: 'Courier Prime', monospace; font-size: 15px; letter-spacing: 0.14em; text-transform: uppercase; color: #D9B65E; margin: 0 0 16px; }
.kmm-h1 { font-family: 'Playfair Display', serif; font-weight: 800; font-size: 58px; line-height: 1.08; color: #F6EFE0; margin: 0 0 28px; }
.kmm-h2 { font-family: 'Playfair Display', serif; font-weight: 800; font-size: 44px; line-height: 1.12; color: #F6EFE0; margin: 0 0 20px; max-width: 860px; }
.kmm-h2.kmm-center { margin-left: auto; margin-right: auto; }
.kmm-h3 { font-family: 'Playfair Display', serif; font-weight: 600; font-size: 24px; line-height: 1.3; color: #F6EFE0; margin: 0 0 12px; }
.kmm-quoteh { font-style: italic; font-size: 26px; }
.kmm-h3-lg { font-size: 30px; }
.kmm-lead { font-size: 19px; color: #D8CDB8; max-width: 760px; margin: 0 0 20px; }
.kmm-hero .kmm-lead { font-size: 20px; max-width: 640px; }
.kmm-lead.kmm-center { margin-left: auto; margin-right: auto; }
.kmm-small { font-size: 15px; }
.kmm-muted { color: #A99E88; }
.kmm-note { font-size: 16px; color: #A99E88; margin: 28px 0 0; }
.kmm-caption { font-size: 14px; color: #A99E88; text-align: center; margin: 20px 0 0; }
.kmm-label { font-family: 'Courier Prime', monospace; font-size: 14px; letter-spacing: 0.06em; color: #D9B65E; margin: 0 0 10px; }
.kmm-big { font-family: 'Playfair Display', serif; font-weight: 800; font-size: 40px; line-height: 1; color: #D9B65E; margin: 0 0 10px; }
.kmm-stepname { font-family: 'Playfair Display', serif; font-size: 20px; color: #F6EFE0; }
.kmm-sec strong { color: #F6EFE0; }

.kmm-cream .kmm-eyebrow, .kmm-cream .kmm-label { color: #7A5A14; }
.kmm-cream .kmm-h2, .kmm-cream .kmm-h3, .kmm-cream strong { color: #1B1714; }
.kmm-cream a { color: #7A2620; }
.kmm-story { font-family: 'Playfair Display', serif; font-size: 26px; line-height: 1.4; color: #1B1714; margin: 0 0 18px; }
.kmm-story-punch { font-weight: 800; color: #7A2620; }
.kmm-principle { font-family: 'Playfair Display', serif; font-weight: 800; font-size: 46px; line-height: 1.15; color: #1B1714; margin: 0; }

/* ---------- Nav ---------- */
.kmm-nav { background: #14110F; border-bottom: 1px solid #3A322A; margin: 0 !important; }
.kmm-navrow { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; padding-top: 18px; padding-bottom: 18px; }
.kmm-navrow > *, .kmm-navlinks > * { margin: 0 !important; }
.kmm-logo a { text-decoration: none; color: #EFE6D2; font-family: 'Playfair Display', serif; font-weight: 800; font-size: 20px; letter-spacing: 0.04em; }
.kmm-navlinks { display: flex; flex-wrap: wrap; align-items: center; gap: 24px; }
.kmm-navlink { font-size: 15px; }
.kmm-navlink a { text-decoration: none; color: #B8AD98; }
.kmm-navlink a:hover { color: #EFE6D2; }

/* ---------- Buttons ---------- */
.kmm-actions { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; margin: 8px 0 16px; }
.kmm-actions.kmm-nav-actions { margin: 0; }
.kmm-btn .wp-block-button__link { background: #9E2B25; color: #F6EFE0; border-radius: 0; padding: 18px 28px; font-family: inherit; font-weight: 600; font-size: 18px; line-height: 1.3; min-height: 44px; box-sizing: border-box; display: inline-flex; align-items: center; text-decoration: none; }
.kmm-btn .wp-block-button__link:hover { background: #B8342C; color: #FFFFFF; }
.kmm-btn-sm .wp-block-button__link { padding: 12px 18px; font-size: 15px; }
.kmm-textlink .wp-block-button__link { background: none; color: #D9B65E; border-radius: 0; padding: 0; font-family: inherit; font-size: 16px; font-weight: 400; text-decoration: underline; }
.kmm-textlink .wp-block-button__link:hover { color: #EFE6D2; }
.kmm-cta-link { font-weight: 600; }

/* ---------- Columns ---------- */
.kmm-sec .wp-block-columns { gap: 24px; margin: 0 0 24px; }
.kmm-sec .kmm-hero-cols { align-items: center !important; gap: 56px; margin: 0; }
.kmm-sec .kmm-pred-cols { gap: 56px; margin: 0; }
.kmm-sec .kmm-build-cols { align-items: flex-start !important; gap: 48px; margin: 0; }
.kmm-sec .kmm-3, .kmm-sec .kmm-2 { margin-top: 32px; }
.kmm-ruled { border-top: 3px double #D9B65E; padding-top: 24px; }
.kmm-cream .kmm-ruled { border-top-color: #1B1714; }
.kmm-product { display: flex; flex-direction: column; }
.kmm-product .kmm-cta-link { margin-top: auto; }

/* ---------- Cards ---------- */
.kmm-card { border: 1px solid #3A322A; background: #1C1815; padding: 32px; height: 100%; box-sizing: border-box; color: #C9BEA8; }
.kmm-card > :last-child { margin-bottom: 0; }
.kmm-card-gold { border: 2px solid #D9B65E; background: #1F1A14; }
.kmm-card-dark { background: #14110F; }
.kmm-sec ul { color: #D8CDB8; font-size: 17px; padding-left: 20px; }
.kmm-sec ul li { margin: 0 0 8px; }
.kmm-card ul { margin: 0 0 20px; }
.kmm-ruletop { border-top: 1px solid #3A322A; padding-top: 20px; margin-top: 8px !important; }

/* ---------- Photo & placeholders ---------- */
.kmm-photo { width: 100%; max-width: 360px; aspect-ratio: 4 / 5; margin: 0 auto !important; border: 1px solid #5A4C33; outline: 1px solid #5A4C33; outline-offset: 8px; display: flex; align-items: center; justify-content: center; text-align: center; padding: 24px; box-sizing: border-box; background: #1C1815; font-family: 'Courier Prime', monospace; font-size: 15px; color: #A99E88; }
.kmm-photo p { margin: 0; }
.kmm-portrait { max-width: 360px; margin: 0 auto !important; }
.kmm-portrait img { display: block; width: 100%; height: auto; border: 1px solid #5A4C33; outline: 1px solid #5A4C33; outline-offset: 8px; }
.kmm-placeholder { margin-top: 32px !important; border: 1px dashed #5A4C33; padding: 40px 24px; text-align: center; font-family: 'Courier Prime', monospace; font-size: 15px; color: #A99E88; }
.kmm-placeholder p { margin: 0; }

/* ---------- Tag wall ---------- */
.kmm-sec ul.kmm-tags { list-style: none; padding: 0; margin: 0 0 24px; display: flex; flex-wrap: wrap; gap: 8px; font-family: 'Courier Prime', monospace; font-size: 15px; }
.kmm-sec ul.kmm-tags li { border: 1px solid #1B1714; padding: 6px 10px; margin: 0; color: #1B1714; }
.kmm-sec ul.kmm-tags li.kmm-tag-red { border-color: #7A2620; color: #7A2620; font-weight: 700; }

/* ---------- Before / after table ---------- */
.kmm-compare { margin: 40px 0 0; overflow-x: auto; }
.kmm-compare table { width: 100%; min-width: 520px; border-collapse: collapse; font-size: 17px; }
.kmm-compare thead { border: 0; }
.kmm-compare th, .kmm-compare td { border: 0; border-top: 1px solid #3A322A; padding: 16px 20px 16px 0; text-align: left; vertical-align: top; }
.kmm-compare th { border-top: 0; font-family: 'Courier Prime', monospace; font-size: 15px; font-weight: 700; letter-spacing: 0.1em; color: #A99E88; width: 50%; }
.kmm-compare th + th { color: #D9B65E; }
.kmm-compare td { color: #A99E88; }
.kmm-compare td + td { color: #F6EFE0; }
.kmm-compare tr:last-child td { border-bottom: 1px solid #3A322A; }

/* ---------- Staircase ---------- */
.kmm-sec .kmm-stairs { align-items: flex-end !important; gap: 12px; margin-top: 40px; }
.kmm-step { border: 1px solid #3A322A; border-top: 3px solid #5A4C33; background: #1C1815; padding: 20px; box-sizing: border-box; }
.kmm-step p { margin: 0 0 6px; }
.kmm-step p:last-child { margin: 0; }
.kmm-step-1 { min-height: 150px; }
.kmm-step-2 { min-height: 175px; border-top-color: #7A6538; }
.kmm-step-3 { min-height: 200px; border-top-color: #9A7F45; }
.kmm-step-4 { min-height: 225px; border-top-color: #B99A52; }
.kmm-step-5 { min-height: 250px; border: 2px solid #D9B65E; background: #1F1A14; }

/* ---------- Quotes ---------- */
.kmm-sec .kmm-kennedy { margin: 48px 0 56px; padding: 40px; border: 0; border-top: 3px double #D9B65E; border-bottom: 3px double #D9B65E; text-align: center; }
.kmm-sec .kmm-kennedy p { font-family: 'Playfair Display', serif; font-style: italic; font-size: 32px; line-height: 1.35; color: #F6EFE0; margin: 0 0 20px; }
.kmm-kennedy cite { display: block; font-family: 'Courier Prime', monospace; font-style: normal; font-size: 15px; letter-spacing: 0.1em; color: #D9B65E; }
.kmm-sec .kmm-testimonials { margin-top: 48px; }
.kmm-sec .kmm-testimonial { margin: 0; padding: 20px 0 0; border: 0; border-top: 1px solid #5A4C33; }
.kmm-sec .kmm-testimonial p { font-family: 'Playfair Display', serif; font-style: italic; font-size: 20px; line-height: 1.45; color: #EFE6D2; margin: 0 0 12px; }
.kmm-testimonial cite { display: block; font-style: normal; font-size: 15px; color: #A99E88; }
.kmm-testimonial cite strong { color: #EFE6D2; font-weight: 600; }

/* ---------- Footer ---------- */
.kmm-footer { background: #14110F; border-top: 1px solid #3A322A; margin: 0 !important; }
.kmm-footrow { display: flex; flex-wrap: wrap; gap: 24px; justify-content: space-between; align-items: center; padding-top: 40px; padding-bottom: 40px; font-size: 14px; color: #A99E88; }
.kmm-footrow > *, .kmm-foot-id > * { margin: 0 !important; }
.kmm-foot-name { font-family: 'Playfair Display', serif; font-size: 18px; color: #EFE6D2; }
.kmm-footrow a { color: #B8AD98; }

/* ---------- Phone ---------- */
@media (max-width: 781px) {
	.kmm-sec { padding: 64px 0; }
	.kmm-hero { padding: 56px 0 64px; }
	.kmm-h1 { font-size: 40px; }
	.kmm-h2 { font-size: 32px; }
	.kmm-story { font-size: 22px; }
	.kmm-principle { font-size: 32px; }
	.kmm-sec .kmm-kennedy { padding: 32px 0; }
	.kmm-sec .kmm-kennedy p { font-size: 24px; }
	.kmm-step { min-height: 0; }
}

/* ---------- Every other page (privacy, disclaimer, apply, etc.) ---------- */
.kmm-bar { border-bottom: 1px solid #3A322A; }
.kmm-bar a { display: block; max-width: 1160px; margin: 0 auto; padding: 18px 24px; text-decoration: none; color: #EFE6D2; font-family: 'Playfair Display', serif; font-weight: 800; font-size: 20px; letter-spacing: 0.04em; }
.kmm-page { max-width: 760px; margin: 0 auto; padding: 64px 24px 96px; }
.kmm-page h1, .kmm-page h2, .kmm-page h3 { font-family: 'Playfair Display', serif; color: #F6EFE0; line-height: 1.15; }
.kmm-page h1 { font-size: 44px; margin: 0 0 32px; }
.kmm-page input, .kmm-page textarea, .kmm-page select { font: inherit; padding: 10px 12px; }

/* Spacing fixes for the inner-container wrapper on live sites */
.kmm-navrow p, .kmm-navlinks p, .kmm-footrow p, .kmm-photo p, .kmm-placeholder p { margin: 0 !important; }
.kmm-foot-id p + p { margin-top: 2px !important; }
.kmm-card .wp-block-group__inner-container > :last-child, .kmm-card > :last-child { margin-bottom: 0; }
