/*
Theme Name: Mike's Auto Glass
Theme URI: https://mikesautoglass.ca/
Author: Mike's Auto Glass
Description: Custom theme for Mike's Auto Glass in Regina. Works with Elementor and the Elementor Header & Footer Builder plugin, so the global header and footer you edit in Elementor appear on every page, blog post, archive and search page. Includes Mike's styled blog, single post, archive, search and 404 templates.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mikes-auto-glass
*/

/* ---------- Tokens ---------- */
:root {
	--mt-ink: #241f1b; --mt-cream: #f6f1e9; --mt-paper: #fbf7ef; --mt-sand: #efe6d6; --mt-line: #e6dac4; --mt-line2: #ece1cd;
	--mt-rust: #c8472f; --mt-rust-dk: #9c3220; --mt-navy: #2f4a63; --mt-navy-dk: #233a4f; --mt-gold: #e0a32e; --mt-gold-dk: #b07e1c;
	--mt-olive: #6f7f4e; --mt-body: #5e5447; --mt-muted: #7a6e5c; --mt-text: #3f382f; --mt-frame: #d9cbb1;
	--mt-head: 'Baloo 2', system-ui, sans-serif; --mt-sans: 'Hanken Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif; --mt-script: 'Pacifico', cursive;
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; background: var(--mt-cream); color: var(--mt-ink); font-family: var(--mt-sans); font-size: 16px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
img { max-width: 100%; height: auto; }
a { color: var(--mt-rust); }
h1, h2, h3, h4 { font-family: var(--mt-head); font-weight: 800; color: var(--mt-ink); line-height: 1.1; }
:focus-visible { outline: 3px solid var(--mt-gold); outline-offset: 3px; }
.screen-reader-text { border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important; }
.skip-link:focus { clip: auto; clip-path: none; height: auto; width: auto; left: 12px; top: 12px; z-index: 1000; background: #fff; color: var(--mt-ink); padding: 10px 16px; border-radius: 8px; }
.bhf-hidden { display: none; }
.mt-wrap { max-width: 1180px; margin: 0 auto; padding: 0 32px; }
.mt-center { text-align: center; }
.mt-h2 { font-size: 36px; letter-spacing: -.01em; margin: 0 0 28px; }
.mt-h3 { font-size: 24px; margin: 0 0 16px; }
.mt-script { font: 400 22px/1.2 var(--mt-script); color: var(--mt-gold); display: inline-block; transform: rotate(-1.5deg); margin-bottom: 10px; }
.mt-center.mt-script { display: block; }

/* ---------- Buttons ---------- */
.mt-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 15px 26px; border-radius: 34px; font: 700 17px/1 var(--mt-head); text-decoration: none; border: 0; cursor: pointer; transition: filter .15s, transform .15s; white-space: nowrap; }
.mt-btn:hover { filter: brightness(1.06); }
.mt-btn:active { transform: translateY(2px); }
.mt-btn--rust { background: var(--mt-rust); color: #fff; box-shadow: 0 4px 0 var(--mt-rust-dk); }
.mt-btn--cream { background: var(--mt-paper); color: var(--mt-navy); box-shadow: 0 4px 0 #cdbfa6; }
.mt-btn--creamrust { background: var(--mt-paper); color: var(--mt-rust); box-shadow: 0 4px 0 #d9b9a8; }
.mt-btn--gold { background: var(--mt-gold); color: var(--mt-ink); box-shadow: 0 4px 0 var(--mt-gold-dk); }
.mt-btn--dark { background: var(--mt-ink); color: #fff; box-shadow: 0 4px 0 rgba(0,0,0,.35); }
.mt-btn--ghost { background: transparent; color: #fff; }
.mt-btn--sm { padding: 11px 18px; font-size: 15px; box-shadow: 0 3px 0 var(--mt-rust-dk); }
.mt-btn--block { display: flex; width: 100%; }
.mt-btns { display: flex; flex-wrap: wrap; gap: 14px; }
.mt-btns--center { justify-content: center; }

/* ---------- Check lists ---------- */
.mt-checks { list-style: none; margin: 0 0 18px; padding: 0; display: grid; gap: 9px; }
.mt-checks li { position: relative; padding-left: 26px; font-weight: 500; color: var(--mt-text); }
.mt-checks li::before { content: "✔"; position: absolute; left: 0; color: var(--mt-olive); font-weight: 800; }
.mt-checks--light li { color: #e6ecf2; }
.mt-checks--light li::before { color: var(--mt-gold); }

/* ---------- Backup header (only used if the Elementor global header is missing) ---------- */
.mt-announce { background: var(--mt-ink); color: #e7dcc9; text-align: center; padding: 9px 16px; font: 600 13px/1.3 var(--mt-sans); }
.mt-announce span { color: var(--mt-gold); }
.mt-header { position: sticky; top: 0; z-index: 99; background: rgba(246,241,233,.94); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border-bottom: 2px solid var(--mt-line); }
.admin-bar .mt-header { top: 32px; }
.mt-header-inner { max-width: 1180px; margin: 0 auto; padding: 12px 32px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.mt-logo { display: flex; align-items: baseline; gap: 8px; text-decoration: none; flex-shrink: 0; }
.mt-logo-img { max-height: 56px; width: auto; }
.mt-logo--light .mag-logo-word { color: var(--mt-gold); }
.mt-logo--light .mag-logo-sub { color: var(--mt-cream); }
.mt-menu { list-style: none; margin: 0; padding: 0; display: flex; gap: 4px; }
.mt-menu a { display: block; padding: 9px 11px; border-radius: 20px; font: 600 15px/1 var(--mt-sans); color: #4a4138; text-decoration: none; }
.mt-menu a:hover, .mt-menu .current-menu-item > a { background: var(--mt-sand); color: var(--mt-rust); }
.mt-header-actions { display: flex; align-items: center; gap: 12px; }
.mt-menu-btn { display: none; width: 42px; height: 42px; border-radius: 12px; background: var(--mt-sand); border: 0; cursor: pointer; flex-direction: column; align-items: center; justify-content: center; gap: 5px; }
.mt-menu-btn span { display: block; width: 20px; height: 2.5px; border-radius: 2px; background: var(--mt-ink); }
.mt-mobile-nav { display: none; padding: 10px 18px 18px; background: var(--mt-paper); border-top: 2px solid var(--mt-line); }
.mt-mobile-nav.is-open { display: block; }
.mt-mobile-nav .mt-menu { flex-direction: column; margin-bottom: 14px; }
.mt-mobile-nav .mt-menu a { font: 700 18px/1 var(--mt-head); padding: 13px 6px; border-radius: 0; border-bottom: 1px solid var(--mt-line2); }

/* ---------- Banner ---------- */
.mt-banner { max-width: 1920px; margin: 0 auto; padding: 6px 12px 0; }
.mt-banner-frame { position: relative; overflow: hidden; border-radius: 14px; border: 7px solid var(--mt-frame); background: var(--mt-navy-dk) url('https://mikesautoglass.ca/wp-content/uploads/2026/09/hero_mural.png') center 48% / cover no-repeat; }
.mt-banner-frame::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(23,36,50,.95) 0%, rgba(23,36,50,.82) 50%, rgba(23,36,50,.55) 100%); }
.mt-banner-inner { position: relative; z-index: 1; max-width: 1180px; margin: 0 auto; padding: 58px 40px 54px; }
.mt-banner-title { margin: 0; font-size: 50px; line-height: 1.02; letter-spacing: -.015em; color: var(--mt-paper); max-width: 22ch; }
.mt-banner-sub { margin: 14px 0 0; font-size: 17px; color: #d8e0ea; max-width: 60ch; }
.mt-banner-meta { margin: 14px 0 0; font: 600 14px/1.4 var(--mt-sans); color: #aebccb; }
.mt-crumbs { font: 600 13px/1.4 var(--mt-sans); color: #aebccb; margin-bottom: 16px; }
.mt-crumbs a { color: #e7dcc9; text-decoration: none; }
.mt-crumbs a:hover { color: var(--mt-gold); }

/* ---------- Single post ---------- */
.mt-single { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 48px; padding-top: 44px; padding-bottom: 20px; align-items: start; }
.mt-article { min-width: 0; }
.mt-page { padding-top: 44px; padding-bottom: 40px; }
.mt-article--full { max-width: 820px; margin: 0 auto; }
.mt-feature-img { margin: 0 0 30px; border-radius: 16px; overflow: hidden; box-shadow: 0 8px 26px rgba(40,30,18,.14); }
.mt-feature-img img { display: block; width: 100%; }
.mt-aside { position: sticky; top: 100px; }
.mt-side-card { background: var(--mt-navy); color: #fff; border-radius: 16px; padding: 26px 24px; box-shadow: 0 10px 30px rgba(40,30,18,.15); }
.mt-side-card h3 { color: var(--mt-paper); font-size: 24px; margin: 0 0 16px; }
.mt-side-card .mt-script { font-size: 20px; }
.mt-side-call { display: block; text-align: center; margin-top: 14px; color: #e7dcc9; font-weight: 700; text-decoration: none; }

/* ---------- Post body (prose) ---------- */
.mt-prose { font-size: 17.5px; line-height: 1.75; color: var(--mt-body); }
.mt-prose > *:first-child { margin-top: 0; }
.mt-prose p { margin: 0 0 1.2em; }
.mt-prose h2 { font-size: 30px; margin: 1.6em 0 .55em; letter-spacing: -.01em; }
.mt-prose h3 { font-size: 23px; margin: 1.4em 0 .5em; }
.mt-prose h4 { font-size: 19px; margin: 1.2em 0 .4em; }
.mt-prose strong { color: var(--mt-ink); }
.mt-prose a { color: var(--mt-rust); font-weight: 600; text-decoration-thickness: 2px; text-underline-offset: 3px; }
.mt-prose a:hover { color: var(--mt-rust-dk); }
.mt-prose ul, .mt-prose ol { margin: 0 0 1.3em; padding-left: 1.4em; }
.mt-prose li { margin-bottom: .45em; }
.mt-prose ul li::marker { color: var(--mt-rust); }
.mt-prose ol li::marker { color: var(--mt-rust); font-weight: 800; font-family: var(--mt-head); }
.mt-prose blockquote { margin: 1.6em 0; padding: 18px 24px; background: var(--mt-paper); border-left: 5px solid var(--mt-gold); border-radius: 0 12px 12px 0; font-style: italic; color: var(--mt-text); }
.mt-prose figure { margin: 1.6em 0; }
.mt-prose img { border-radius: 12px; }
.mt-prose figcaption { font-size: 14px; color: var(--mt-muted); margin-top: 8px; text-align: center; }
.mt-prose hr { border: 0; border-top: 2px dashed var(--mt-line); margin: 2em 0; }
.mt-prose table, .mt-prose .wp-block-table table { width: 100%; border-collapse: separate; border-spacing: 0; margin: 0 0 1.5em; font-size: 15.5px; line-height: 1.5; background: var(--mt-paper); border: 2px solid var(--mt-line); border-radius: 14px; overflow: hidden; }
.mt-prose .wp-block-table { margin: 0 0 1.5em; overflow-x: auto; }
.mt-prose .wp-block-table table { margin: 0; }
.mt-prose th { background: var(--mt-navy); color: #fff; font: 700 15px/1.3 var(--mt-head); text-align: left; padding: 12px 16px; }
.mt-prose td { padding: 12px 16px; border-top: 1px solid var(--mt-line2); color: var(--mt-text); vertical-align: top; }
.mt-prose tr:nth-child(even) td { background: #f7f0e3; }
.mt-prose .wp-block-button__link { background: var(--mt-rust); color: #fff; border-radius: 34px; padding: 14px 24px; font: 700 16px/1 var(--mt-head); text-decoration: none; box-shadow: 0 4px 0 var(--mt-rust-dk); }
.mt-prose .alignwide { max-width: none; }
.mt-page-links { margin: 1.5em 0; font-weight: 700; }

/* ---------- CTA ---------- */
.mt-cta { position: relative; overflow: hidden; margin: 44px 0 10px; padding: 46px 32px; text-align: center; border-radius: 18px; background: radial-gradient(120% 160% at 80% 0%, #d65a40 0%, #c8472f 48%, #a8381f 100%); box-shadow: 0 14px 40px rgba(168,56,31,.3); }
.mt-cta::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 9px; background: repeating-linear-gradient(90deg, var(--mt-gold) 0 24px, var(--mt-rust) 24px 48px); }
.mt-cta h2 { margin: 0 0 10px; font-size: 36px; color: var(--mt-paper); letter-spacing: -.01em; }
.mt-cta p { margin: 0 0 8px; color: #ffe6d8; font-size: 17px; }
.mt-cta .mt-cta-note { font-weight: 700; font-size: 14px; margin-bottom: 22px; }
.mt-cta-wrap { padding-bottom: 56px; }

/* ---------- Post nav ---------- */
.mt-postnav { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 36px 0; }
.mt-postnav a { display: block; height: 100%; padding: 18px 20px; background: var(--mt-paper); border: 2px solid var(--mt-line); border-radius: 14px; box-shadow: 0 3px 0 var(--mt-line2); text-decoration: none; color: var(--mt-ink); font: 700 17px/1.3 var(--mt-head); }
.mt-postnav a span { display: block; font: 700 12px/1 var(--mt-sans); letter-spacing: .08em; text-transform: uppercase; color: var(--mt-rust); margin-bottom: 8px; }
.mt-postnav div:last-child a { text-align: right; }

/* ---------- Cards / listing ---------- */
.mt-listing { padding-top: 44px; padding-bottom: 20px; }
.mt-related { padding: 30px 0 60px; }
.mt-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.mt-card { display: flex; flex-direction: column; background: var(--mt-paper); border: 2px solid var(--mt-line); border-radius: 16px; overflow: hidden; box-shadow: 0 5px 0 #ddd0b8; transition: transform .15s ease; }
.mt-card:hover { transform: translateY(-3px); }
.mt-card-img { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: var(--mt-sand); }
.mt-card-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mt-card-placeholder { display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; background: var(--mt-navy) url('https://mikesautoglass.ca/wp-content/uploads/2026/09/hero_mural.png') center / cover; }
.mt-card-placeholder .mag-logo-word { color: var(--mt-gold); font-size: 40px; text-shadow: 0 3px 14px rgba(0,0,0,.6); }
.mt-card-body { display: flex; flex-direction: column; gap: 10px; padding: 20px 22px 22px; flex: 1; }
.mt-pill { align-self: flex-start; font: 700 11px/1 var(--mt-sans); letter-spacing: .1em; text-transform: uppercase; color: #385a72; background: #dfe7ee; padding: 7px 11px; border-radius: 20px; }
.mt-card-title { margin: 0; font-size: 21px; line-height: 1.15; }
.mt-card-title a { color: var(--mt-ink); text-decoration: none; }
.mt-card-title a:hover { color: var(--mt-rust); }
.mt-card-excerpt { font-size: 15px; line-height: 1.55; color: var(--mt-body); }
.mt-card-excerpt p { margin: 0; }
.mt-card-meta { margin-top: auto; padding-top: 10px; display: flex; justify-content: space-between; align-items: center; gap: 10px; font: 600 13px/1.3 var(--mt-sans); color: var(--mt-muted); }
.mt-card-more { color: var(--mt-rust); text-decoration: none; font-weight: 700; white-space: nowrap; }
.mt-pagination { margin: 40px 0 0; }
.mt-pagination .nav-links { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; }
.mt-pagination .page-numbers { display: inline-flex; min-width: 44px; height: 44px; padding: 0 14px; align-items: center; justify-content: center; border-radius: 22px; background: var(--mt-paper); border: 2px solid var(--mt-line); color: var(--mt-ink); text-decoration: none; font: 700 15px/1 var(--mt-head); }
.mt-pagination .page-numbers.current { background: var(--mt-rust); border-color: var(--mt-rust); color: #fff; }
.mt-empty { text-align: center; padding-top: 40px; padding-bottom: 50px; }
.mt-empty p { color: var(--mt-body); }
.mt-empty .mt-btns { margin-bottom: 28px; }

/* ---------- Search ---------- */
.mt-search { display: flex; gap: 10px; max-width: 520px; margin: 18px auto 0; }
.mt-search input[type="search"] { flex: 1; min-width: 0; padding: 12px 18px; border-radius: 30px; border: 2px solid var(--mt-line); background: #fff; font: 500 15px/1 var(--mt-sans); color: var(--mt-ink); }
.mt-search input[type="search"]:focus { outline: none; border-color: var(--mt-gold); }

/* ---------- Comments ---------- */
.mt-comments { margin-top: 40px; }
.mt-comment-list { list-style: none; padding: 0; }
.mt-comment-list .comment-body { background: var(--mt-paper); border: 2px solid var(--mt-line); border-radius: 14px; padding: 18px 20px; margin-bottom: 14px; }
.comment-form input[type="text"], .comment-form input[type="email"], .comment-form input[type="url"], .comment-form textarea { width: 100%; padding: 12px 14px; border: 2px solid var(--mt-line); border-radius: 12px; font: inherit; background: #fff; }
.comment-form .submit { background: var(--mt-rust); color: #fff; border: 0; padding: 14px 24px; border-radius: 30px; font: 700 16px/1 var(--mt-head); cursor: pointer; box-shadow: 0 4px 0 var(--mt-rust-dk); }

/* ---------- Backup footer ---------- */
.mt-footer { background: var(--mt-ink); color: #a59a86; }
.mt-footer-grid { max-width: 1180px; margin: 0 auto; padding: 50px 32px 30px; display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 36px; }
.mt-footer h4 { color: var(--mt-cream); font-size: 14px; letter-spacing: .06em; text-transform: uppercase; margin: 0 0 12px; }
.mt-footer p { margin: 12px 0 0; font-size: 14.5px; line-height: 1.7; }
.mt-footer a { color: var(--mt-gold); text-decoration: none; }
.mt-footer-bottom { border-top: 1px solid #3a332b; padding: 18px 32px; text-align: center; font-size: 12.5px; color: #6f6657; }
.mt-footer-bottom a { color: #a59a86; }

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
	.mt-single { grid-template-columns: 1fr; }
	.mt-aside { position: static; max-width: 760px; }
	.mt-nav { display: none; }
	.mt-menu-btn { display: flex; }
}
@media (max-width: 860px) {
	.mt-wrap { padding: 0 18px; }
	.mt-grid { grid-template-columns: 1fr; }
	.mt-banner { padding: 12px 12px 0; }
	.mt-banner-inner { padding: 40px 20px 38px; }
	.mt-banner-title { font-size: 34px; }
	.mt-h2 { font-size: 29px; }
	.mt-prose { font-size: 16.5px; }
	.mt-prose h2 { font-size: 26px; }
	.mt-prose h3 { font-size: 21px; }
	.mt-cta { padding: 40px 20px; }
	.mt-cta h2 { font-size: 29px; }
	.mt-postnav { grid-template-columns: 1fr; }
	.mt-postnav div:last-child a { text-align: left; }
	.mt-footer-grid { grid-template-columns: 1fr; }
	.mt-header-inner { padding: 9px 14px; }
	.mt-btn--sm { padding: 8px 12px; font-size: 12.5px; }
}
@media (max-width: 782px) { .admin-bar .mt-header { top: 46px; } }
@media (max-width: 420px) { .mt-banner-title { font-size: 29px; } .mt-btn { white-space: normal; text-align: center; } }