/*
Theme Name: Mr Mechanic Grand Opening
Theme URI: https://mrmechanicltd.ca
Author: ChatGPT for Mr. Mechanic
Description: High-converting WordPress theme for Mr. Mechanic with home page, services, prices, appointment booking form, and contact sections.
Version: 1.0.0
License: GPL-2.0+
Text Domain: mr-mechanic-grand-opening
*/
:root{--yellow:#ffc214;--black:#050505;--dark:#111;--white:#f7f7f7;--muted:#b8b8b8}*{box-sizing:border-box}body{margin:0;background:var(--black);color:var(--white);font-family:Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}.container{width:min(1180px,92vw);margin:auto}.topbar{background:#000;border-bottom:1px solid #282828;color:var(--yellow);font-weight:800;font-size:14px}.topbar .container{display:flex;gap:18px;justify-content:space-between;padding:10px 0;flex-wrap:wrap}.nav{position:sticky;top:0;z-index:99;background:rgba(5,5,5,.92);backdrop-filter:blur(12px);border-bottom:1px solid #202020}.nav .container{display:flex;align-items:center;justify-content:space-between;padding:14px 0}.brand{font-size:30px;font-weight:1000;font-style:italic;letter-spacing:.5px}.brand span{background:var(--yellow);color:#000;padding:8px 12px;border-radius:8px;margin-right:8px}.menu{display:flex;gap:22px;font-weight:800;text-transform:uppercase;font-size:13px}.btn{display:inline-block;background:var(--yellow);color:#000;padding:14px 22px;border-radius:999px;font-weight:1000;text-transform:uppercase;box-shadow:0 0 22px rgba(255,194,20,.28);border:0;cursor:pointer}.btn.alt{background:#fff;color:#000}.hero{position:relative;min-height:760px;background:linear-gradient(90deg,#050505 0%,rgba(0,0,0,.78) 46%,rgba(0,0,0,.45)),url('assets/shop-brand.jpg') center/cover no-repeat;display:grid;align-items:center;border-bottom:4px solid var(--yellow)}.badge{display:inline-block;color:#000;background:var(--yellow);font-weight:1000;padding:9px 14px;border-radius:8px;text-transform:uppercase;letter-spacing:1px}.hero h1{font-size:clamp(48px,8vw,104px);line-height:.88;margin:18px 0 12px;text-transform:uppercase;font-style:italic}.hero h1 em{color:var(--yellow);font-style:italic}.hero p{font-size:22px;color:#e8e8e8;max-width:640px;line-height:1.45}.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}.price-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:38px}.price-card{background:rgba(0,0,0,.74);border:1px solid #343434;border-left:5px solid var(--yellow);padding:18px;border-radius:16px}.price-card b{display:block;font-size:19px}.price-card span{color:var(--yellow);font-size:26px;font-weight:1000}.section{padding:82px 0}.section h2{font-size:clamp(34px,5vw,62px);line-height:.95;text-transform:uppercase;font-style:italic;margin:0 0 16px}.yellow{color:var(--yellow)}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.service{background:linear-gradient(180deg,#171717,#090909);border:1px solid #2b2b2b;border-radius:20px;padding:26px;min-height:190px}.service .icon{font-size:34px}.service h3{font-size:25px;margin:15px 0 8px}.service p,.muted{color:var(--muted);line-height:1.55}.booking{background:linear-gradient(135deg,#101010,#000);border-top:1px solid #292929;border-bottom:1px solid #292929}.booking-wrap{display:grid;grid-template-columns:1fr 1fr;gap:35px;align-items:start}.form{background:#fff;color:#111;border-radius:24px;padding:28px;box-shadow:0 20px 60px rgba(0,0,0,.45)}.form label{display:block;font-weight:800;margin:12px 0 6px}.form input,.form select,.form textarea{width:100%;padding:14px;border:1px solid #ddd;border-radius:12px;font-size:16px}.form button{width:100%;margin-top:18px}.contact-card{background:#141414;border:1px solid #2c2c2c;border-radius:24px;padding:28px}.contact-row{border-bottom:1px solid #2c2c2c;padding:17px 0;font-size:19px}.footer{background:#000;border-top:4px solid var(--yellow);padding:35px 0;color:#ddd}.notice{background:var(--yellow);color:#000;padding:12px;font-weight:900;text-align:center}.brand img{display:block;width:260px;max-width:42vw;height:auto}.footer-logo-wrap{text-align:center}.footer-logo{width:320px;max-width:88vw;height:auto;margin:0 auto 12px;display:block}
@media(max-width:850px){.menu{display:none}.hero{min-height:720px}.price-strip,.grid,.booking-wrap{grid-template-columns:1fr}.hero h1{font-size:56px}}