/*
Theme Name: King Mobile Tire and Services LLC
Theme URI: https://kingmobiletire.com/
Author: CK
Author URI: https://kingmobiletire.com/
Description: A fast, modern WordPress theme for a mobile tire shop. Includes a one-page home layout, starter content, contact form handler, and customizable business info.
Version: 1.5.0
Requires at least: 5.9
Tested up to: 6.6
Requires PHP: 7.4
License: GPLv2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: king-mobile-tire and services
Tags: custom-logo, custom-menu, featured-images, one-column, two-columns, block-styles, wide-blocks
*/

:root{
  --kmt-bg:#0b1220;
  --kmt-surface:#0f1a33;
  --kmt-text:#eaf0ff;
  --kmt-muted:rgba(234,240,255,.72);
  --kmt-border:rgba(234,240,255,.14);
  --kmt-brand:#f5c518; /* gold */
  --kmt-brand-2:#2ee7ff; /* cyan accent */
  --kmt-danger:#ff4d4d;
  --kmt-radius:18px;
  --kmt-shadow: 0 10px 30px rgba(0,0,0,.35);
  --kmt-max: 1180px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth; overflow-x:hidden}
body{
  margin:0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  color:var(--kmt-text);
  background: radial-gradient(1200px 700px at 20% -10%, rgba(46,231,255,.18), transparent 60%),
              radial-gradient(900px 600px at 90% 10%, rgba(245,197,24,.15), transparent 55%),
              linear-gradient(180deg, #070b14, var(--kmt-bg) 35%, #070b14 100%);
  line-height:1.55;
  overflow-x:hidden;
}

a{color:inherit}
img{max-width:100%;height:auto}

.kmt-container{max-width:var(--kmt-max); width:100%; margin:0 auto; padding:0 20px}
.kmt-pill{display:inline-flex; gap:.5rem; align-items:center; padding:.45rem .8rem; border:1px solid var(--kmt-border); border-radius:999px; background:rgba(255,255,255,.04); color:var(--kmt-muted); font-weight:600; font-size:.9rem}
.kmt-btn{
  display:inline-flex; align-items:center; justify-content:center;
  gap:.55rem; padding:.9rem 1.1rem;
  border-radius:999px; border:1px solid transparent;
  text-decoration:none; font-weight:800;
  transition: transform .08s ease, background .2s ease, border-color .2s ease, opacity .2s ease;
  box-shadow: var(--kmt-shadow);
}
.kmt-btn:hover{transform: translateY(-1px)}
.kmt-btn:active{transform: translateY(0)}
.kmt-btn-primary{background:linear-gradient(135deg, var(--kmt-brand), #ffd96a); color:#1a1400}
.kmt-btn-ghost{background:rgba(255,255,255,.04); border-color: var(--kmt-border); color:var(--kmt-text); box-shadow:none}
.kmt-btn-link{background:transparent; box-shadow:none; border-color:transparent; padding:.25rem .15rem; opacity:.9}
.kmt-btn-link:hover{opacity:1; transform:none}

.kmt-site-header{
  position:sticky; top:0; z-index:50;
  backdrop-filter: blur(10px);
  background: rgba(7, 11, 20, .65);
  border-bottom:1px solid var(--kmt-border);
}
.kmt-header-inner{display:flex; align-items:center; justify-content:space-between; gap:18px; padding:14px 0}
.kmt-header-actions{display:flex; align-items:center; gap:18px}
.kmt-brand{display:flex; align-items:center; gap:.75rem}
.kmt-brand a{color:inherit; text-decoration:none}
.kmt-logo{
  width:42px;height:42px; border-radius:12px;
  background: radial-gradient(circle at 30% 30%, rgba(46,231,255,.55), transparent 45%),
              radial-gradient(circle at 70% 70%, rgba(245,197,24,.55), transparent 50%),
              rgba(255,255,255,.06);
  border:1px solid var(--kmt-border);
  display:grid; place-items:center;
}
.kmt-brand strong{display:block; font-size:1rem; line-height:1.15}
.kmt-brand span{display:block; font-size:.85rem; color:var(--kmt-muted)}

.kmt-nav{display:flex; align-items:center; gap:18px; position:relative}
.kmt-nav ul{list-style:none; display:flex; gap:16px; margin:0; padding:0; align-items:center}
.kmt-nav a{text-decoration:none; color:var(--kmt-muted); font-weight:700; padding:.4rem .55rem; border-radius:999px}
.kmt-nav a:hover{color:var(--kmt-text); background:rgba(255,255,255,.05)}
.kmt-header-cta{display:flex; gap:10px; align-items:center}

.kmt-hero{position:relative; padding:64px 0 38px}
.kmt-hero-grid{display:grid; grid-template-columns: 1.1fr .9fr; gap:28px; align-items:center}
.kmt-hero h1{font-size: clamp(2rem, 3.4vw, 3.2rem); line-height:1.08; margin:.35rem 0 1rem}
.kmt-hero p{color:var(--kmt-muted); margin:0 0 1.2rem; font-size:1.05rem}
.kmt-hero-card{
  border:1px solid var(--kmt-border);
  border-radius: var(--kmt-radius);
  background: rgba(255,255,255,.03);
  overflow:hidden;
  box-shadow: var(--kmt-shadow);
}
.kmt-hero-card img{display:block; width:100%}
.kmt-hero-card .kmt-hero-card-body{padding:14px 16px}
.kmt-hero-card .kmt-hero-card-body strong{display:block}
.kmt-hero-card .kmt-hero-card-body span{display:block; color:var(--kmt-muted); font-size:.95rem}

.kmt-section{padding:56px 0}
.kmt-section h2{font-size: clamp(1.4rem, 2.2vw, 2.1rem); margin:0 0 14px}
.kmt-section .kmt-sub{color:var(--kmt-muted); margin:0 0 24px}

.kmt-grid-3{display:grid; grid-template-columns: repeat(3, 1fr); gap:16px}
.kmt-grid-2{display:grid; grid-template-columns: repeat(2, 1fr); gap:16px}

.kmt-card{
  border:1px solid var(--kmt-border);
  border-radius: var(--kmt-radius);
  background: rgba(5,5,5,0.5);
  box-shadow: var(--kmt-shadow);
  padding:18px;
}
.kmt-card h3{margin:6px 0 8px; font-size:1.1rem}
.kmt-card p{margin:0; color:var(--kmt-muted)}
.kmt-icon{
  width:42px; height:42px; border-radius:14px;
  display:grid; place-items:center;
  background:rgba(245,197,24,.12);
  border:1px solid rgba(245,197,24,.25);
}

.kmt-badges{display:flex; flex-wrap:wrap; gap:10px}
.kmt-badge{padding:.45rem .75rem; border-radius:999px; border:1px solid var(--kmt-border); background:rgba(255,255,255,.03); color:var(--kmt-muted); font-weight:700; font-size:.92rem}

.kmt-pricing{
  display:grid; grid-template-columns: 1fr 1fr; gap:16px;
}
.kmt-price-item{display:flex; justify-content:space-between; gap:14px; padding:12px 14px; border:1px solid var(--kmt-border); border-radius:14px; background: rgba(0,0,0,.12)}
.kmt-price-item strong{font-weight:800}
.kmt-price-item span{color:var(--kmt-muted)}

.kmt-testimonials{display:grid; grid-template-columns: repeat(3, 1fr); gap:16px}
.kmt-quote{display:flex; flex-direction:column; gap:10px}
.kmt-quote p{margin:0; color:var(--kmt-muted)}
.kmt-quote .kmt-person{display:flex; gap:12px; align-items:center}
.kmt-quote img{width:44px;height:44px;border-radius:999px; border:1px solid var(--kmt-border)}
.kmt-quote strong{display:block}
.kmt-quote span{display:block; font-size:.9rem; color:var(--kmt-muted)}

.kmt-split{
  display:grid; grid-template-columns: 1fr 1fr; gap:18px; align-items:center;
}
.kmt-split img{border-radius: var(--kmt-radius); border:1px solid var(--kmt-border); box-shadow: var(--kmt-shadow)}

.kmt-form{display:grid; gap:12px}
.kmt-field{display:grid; gap:6px}
.kmt-field label{font-weight:800; font-size:.95rem}
.kmt-field input, .kmt-field textarea, .kmt-field select{
  width:100%;
  border-radius:14px;
  border:1px solid var(--kmt-border);
  background: rgba(255,255,255,.03);
  color:var(--kmt-text);
  padding:11px 12px;
  outline:none;
}
.kmt-field textarea{min-height:120px; resize:vertical}
.kmt-note{font-size:.92rem; color:var(--kmt-muted)}

.kmt-site-footer{
  border-top:1px solid var(--kmt-border);
  background: rgba(0,0,0,.25);
  padding:34px 0;
}
.kmt-footer-grid{display:grid; grid-template-columns: 1.2fr .8fr; gap:18px; align-items:start}
.kmt-footer-grid p{margin:.6rem 0 0; color:var(--kmt-muted)}
.kmt-footer-links a{display:inline-block; margin-right:12px; color:var(--kmt-muted); text-decoration:none}
.kmt-footer-links a:hover{color:var(--kmt-text)}

.kmt-alert{
  padding:12px 14px; border-radius:14px;
  border:1px solid rgba(46,231,255,.35);
  background: rgba(46,231,255,.08);
  color:var(--kmt-text);
}

.kmt-mobile-toggle{display:none}
@media (max-width: 920px){
  .kmt-hero-grid, .kmt-grid-3, .kmt-testimonials, .kmt-split, .kmt-pricing, .kmt-grid-2 {grid-template-columns:1fr}

  /* No Menu button on mobile; show links directly */
  .kmt-mobile-toggle{display:none !important}

  .kmt-nav ul{
    display:flex;
    flex-wrap:nowrap;
    overflow-x:auto;
    -webkit-overflow-scrolling: touch;
    gap:10px;
    padding:6px 2px;
    margin:0;
  }
  .kmt-nav ul::-webkit-scrollbar{height:6px}
  .kmt-nav ul::-webkit-scrollbar-thumb{background: rgba(255,255,255,.12); border-radius:999px}

  .kmt-nav a{
    white-space: nowrap;
    background: rgba(255,255,255,.03);
    border: 1px solid var(--kmt-border);
  }

  /* Remove dropdown styles that relied on the toggle */
  .kmt-nav.is-open ul{
    position: static;
    left:auto; right:auto; top:auto;
    border:none;
    background: transparent;
    backdrop-filter:none;
    padding:6px 2px;
    border-radius:0;
  }
}
.kmt-nav ul{display:none}
  .kmt-mobile-toggle{display:inline-flex}
  .kmt-nav.is-open ul{
    display:flex; flex-direction:column; gap:10px;
    position:absolute; left:20px; right:20px; top: calc(100% + 10px);
    padding:14px; border-radius:16px; border:1px solid var(--kmt-border);
    background: rgba(7,11,20,.92);
    backdrop-filter: blur(10px);
  }
}

/* Custom logo styling */
.kmt-logo-img{display:inline-flex; align-items:center}
.kmt-brand .custom-logo-link{display:inline-flex; align-items:center}
.kmt-brand .custom-logo{height:42px; width:auto; max-height:42px}
.kmt-brand-text{display:block}

/* Responsive improvements */
@media (max-width: 1100px){
  .kmt-header-inner{gap:12px}
  .kmt-header-cta{gap:8px}
  .kmt-btn{padding:.82rem 1rem}
  .kmt-hero{padding:54px 0 30px}
  .kmt-section{padding:50px 0}
}

@media (max-width: 720px){
  .kmt-hero{padding:44px 0 24px}
  .kmt-section{padding:44px 0}
  .kmt-card{padding:16px}
  .kmt-hero-card .kmt-hero-card-body{padding:12px 14px}
  .kmt-brand span{display:none}
  .kmt-header-cta .kmt-btn{padding:.72rem .9rem}
  .kmt-phone-text{display:inline}
}

@media (max-width: 520px){
  .kmt-header-inner{flex-wrap:wrap}
  .kmt-header-cta{width:100%; justify-content:space-between}
  .kmt-header-cta .kmt-btn{flex:1}
  .kmt-header-cta .kmt-btn + .kmt-btn{margin-left:10px}
  .kmt-hero p{font-size:1rem}
}

@media (max-width: 420px){
  .kmt-header-cta{flex-direction:column; align-items:stretch}
  .kmt-header-cta .kmt-btn + .kmt-btn{margin-left:0; margin-top:10px}
  .kmt-btn{width:100%}
}

/* Mobile header stack layout */
@media (max-width: 820px){
  .kmt-header-inner{
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }
  .kmt-brand{
    width: 100%;
  }
  .kmt-header-actions{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
  }
  .kmt-nav{flex: 0 0 auto}
  .kmt-header-cta{
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
  }
  .kmt-header-cta .kmt-btn{
    padding: .72rem .9rem;
  }
  .kmt-btn-primary{
    white-space: nowrap;
  }
  .kmt-btn.kmt-btn-ghost{
    white-space: nowrap;
  }
}

/* Extra small phones */
@media (max-width: 480px){
  .kmt-header-actions{
    flex-wrap: wrap;
  }
  .kmt-header-cta{
    width: 100%;
    justify-content: space-between;
  }
  .kmt-header-cta .kmt-btn{
    flex: 1 1 0;
  }
}

/* Disable menu toggle button */
.kmt-mobile-toggle{display:none !important}

html, body{overflow-x:hidden;}
