/*
Theme Name: Preservation Motorworks
Theme URI: https://preservationmotorworks.com
Author: Preservation Motorworks
Description: Custom one-page WordPress theme for a mobile classic, antique, and collector vehicle service business.
Version: 1.1.0
Requires at least: 6.4
Requires PHP: 8.0
Text Domain: preservation-motorworks
*/

:root{
  --pm-black:#070707;
  --pm-charcoal:#111214;
  --pm-gold:#c6a15b;
  --pm-gold-light:#e0c78e;
  --pm-silver:#d7d3cb;
  --pm-ivory:#f5f1e8;
  --pm-muted:#a8a39a;
  --pm-line:rgba(198,161,91,.32);
  --pm-shadow:0 18px 50px rgba(0,0,0,.35);
  --pm-max:1200px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--pm-black);
  color:var(--pm-ivory);
  font-family:Arial, Helvetica, sans-serif;
  line-height:1.6;
}
img{max-width:100%;height:auto}
a{color:inherit}
.pm-wrap{width:min(var(--pm-max),calc(100% - 40px));margin-inline:auto}

.site-header{
  position:fixed;
  inset:0 0 auto 0;
  z-index:1000;
  background:linear-gradient(to bottom,rgba(0,0,0,.88),rgba(0,0,0,.36),transparent);
  transition:.25s ease;
}
.site-header.is-scrolled{
  background:rgba(7,7,7,.95);
  box-shadow:0 10px 30px rgba(0,0,0,.28);
  backdrop-filter:blur(8px);
}
.header-inner{
  min-height:96px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none}
.brand img{max-height:72px;width:auto}
.brand-fallback{
  font-family:Georgia,serif;
  text-transform:uppercase;
  letter-spacing:.15em;
  color:var(--pm-gold-light);
  font-weight:700;
}
.main-nav ul{display:flex;gap:28px;list-style:none;margin:0;padding:0}
.main-nav a{
  text-decoration:none;
  color:var(--pm-silver);
  font-size:.9rem;
  text-transform:uppercase;
  letter-spacing:.12em;
  transition:.2s ease;
}
.main-nav a:hover,.main-nav a:focus{color:var(--pm-gold-light)}
.menu-toggle{
  display:none;
  background:transparent;
  border:1px solid var(--pm-line);
  color:var(--pm-gold-light);
  padding:10px 12px;
  border-radius:3px;
}

.hero{
  position:relative;
  min-height:100vh;
  display:grid;
  align-items:center;
  background-color:#0c0d0f;
  background-position:center center;
  background-size:cover;
  overflow:hidden;
}
.hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(0,0,0,.90) 0%,rgba(0,0,0,.72) 35%,rgba(0,0,0,.28) 64%,rgba(0,0,0,.15) 100%),
    linear-gradient(0deg,rgba(0,0,0,.50),transparent 38%);
}
.hero-content{
  position:relative;
  z-index:1;
  width:min(650px,100%);
  padding:150px 0 90px;
}
.eyebrow{
  color:var(--pm-gold-light);
  text-transform:uppercase;
  letter-spacing:.24em;
  font-size:.78rem;
  margin:0 0 16px;
}
.hero h1,.section-title{
  font-family:Georgia,"Times New Roman",serif;
  font-weight:500;
  line-height:1.05;
  margin:0;
}
.hero h1{
  font-size:clamp(3rem,7vw,6.6rem);
  text-shadow:0 5px 24px rgba(0,0,0,.6);
}
.hero-copy{
  color:var(--pm-silver);
  max-width:610px;
  font-size:clamp(1rem,1.5vw,1.22rem);
  margin:24px 0 30px;
}
.actions{display:flex;flex-wrap:wrap;gap:14px}
.button{
  display:inline-flex;
  justify-content:center;
  align-items:center;
  min-height:50px;
  padding:0 24px;
  border:1px solid var(--pm-gold);
  border-radius:2px;
  text-decoration:none;
  text-transform:uppercase;
  letter-spacing:.1em;
  font-size:.78rem;
  font-weight:700;
  transition:.2s ease;
}
.button-primary{background:var(--pm-gold);color:#080808}
.button-primary:hover{background:var(--pm-gold-light);border-color:var(--pm-gold-light)}
.button-secondary{background:rgba(0,0,0,.32);color:var(--pm-gold-light)}
.button-secondary:hover{background:var(--pm-gold);color:#080808}


.motto-band{
  padding:34px 0;
  background:#050505;
  border-top:1px solid var(--pm-line);
  border-bottom:1px solid var(--pm-line);
}
.motto-text{
  margin:0;
  text-align:center;
  color:var(--pm-gold-light);
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(1.35rem,3vw,2.35rem);
  font-style:italic;
  letter-spacing:.035em;
}

section{padding:100px 0}
.section-kicker{
  margin:0 0 10px;
  color:var(--pm-gold);
  text-transform:uppercase;
  letter-spacing:.22em;
  font-size:.74rem;
}
.section-title{
  font-size:clamp(2.2rem,4vw,4rem);
  color:var(--pm-ivory);
}
.section-lede{
  max-width:760px;
  color:var(--pm-muted);
  margin:18px 0 0;
}
.about{background:linear-gradient(135deg,#0b0c0e,#15171a)}
.about-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:70px;align-items:center}
.about-card{
  border:1px solid var(--pm-line);
  background:rgba(255,255,255,.025);
  padding:36px;
  box-shadow:var(--pm-shadow);
}
.about-list{display:grid;grid-template-columns:1fr 1fr;gap:14px 24px;margin:28px 0 0;padding:0;list-style:none}
.about-list li{position:relative;padding-left:18px;color:var(--pm-silver)}
.about-list li::before{content:"";position:absolute;left:0;top:.7em;width:7px;height:7px;background:var(--pm-gold);transform:rotate(45deg)}

.services{background:#090909}
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:44px}
.service-card{
  min-height:250px;
  padding:30px;
  border:1px solid var(--pm-line);
  background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.012));
  transition:.25s ease;
}
.service-card:hover{transform:translateY(-5px);border-color:var(--pm-gold)}
.service-number{color:var(--pm-gold);font-family:Georgia,serif;font-size:1.1rem}
.service-card h3{font-family:Georgia,serif;font-size:1.55rem;margin:52px 0 10px}
.service-card p{color:var(--pm-muted);margin:0}

.gallery{background:#111214}
.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:42px}
.gallery-item{aspect-ratio:4/3;overflow:hidden;background:#050505;border:1px solid rgba(255,255,255,.08)}
.gallery-item img{width:100%;height:100%;object-fit:cover;transition:.35s ease}
.gallery-item:hover img{transform:scale(1.04)}
.gallery-empty{display:grid;place-items:center;color:var(--pm-muted);text-align:center;padding:24px}

.contact{background:linear-gradient(135deg,#080808,#17191b)}
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:start}
.contact-details{margin-top:30px;display:grid;gap:16px}
.contact-details a{text-decoration:none;color:var(--pm-silver)}
.contact-details strong{display:block;color:var(--pm-gold-light);text-transform:uppercase;letter-spacing:.12em;font-size:.73rem}
.contact-form{
  border:1px solid var(--pm-line);
  background:rgba(255,255,255,.025);
  padding:34px;
}
.contact-form form{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.contact-form .full{grid-column:1/-1}
.contact-form input,.contact-form textarea{
  width:100%;
  background:#080808;
  color:var(--pm-ivory);
  border:1px solid rgba(255,255,255,.14);
  border-radius:0;
  padding:14px 15px;
  font:inherit;
}
.contact-form textarea{min-height:140px;resize:vertical}
.contact-form button{cursor:pointer}

.site-footer{
  padding:30px 0;
  background:#040404;
  border-top:1px solid var(--pm-line);
  color:var(--pm-muted);
  font-size:.88rem;
}
.footer-inner{display:flex;justify-content:space-between;gap:20px;align-items:center}

@media (max-width:900px){
  .menu-toggle{display:block}
  .main-nav{
    display:none;
    position:absolute;
    top:86px;
    right:20px;
    width:min(320px,calc(100% - 40px));
    background:#090909;
    border:1px solid var(--pm-line);
    padding:20px;
  }
  .main-nav.is-open{display:block}
  .main-nav ul{flex-direction:column;gap:16px}
  .about-grid,.contact-grid{grid-template-columns:1fr}
  .services-grid,.gallery-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:640px){
  .pm-wrap{width:min(100% - 26px,var(--pm-max))}
  .header-inner{min-height:80px}
  .brand img{max-height:32px}
	.custom-logo-link img,
img.custom-logo {
    width: auto !important;
    height: 105px !important;
    max-height: 105px !important;
    max-width: 300px !important;
    object-fit: contain !important;
}
	.site-header .brand img,
.header-inner .brand img{
    max-height:48px !important;
    height:48px !important;
    width:auto !important;
}
  .hero{
    background-image: url('https://preservationmotorworks.com/wp-content/uploads/2026/08/ChatGPT-Image-Aug-7-2026-11_51_22-PM.png') !important;
    background-position: center center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
}
  .hero::before{background:linear-gradient(90deg,rgba(0,0,0,.88),rgba(0,0,0,.48))}
  .hero-content{padding:125px 0 70px}
  section{padding:76px 0}
  .services-grid,.gallery-grid{grid-template-columns:1fr}
  .about-list{grid-template-columns:1fr}
  .contact-form form{grid-template-columns:1fr}
  .contact-form .full{grid-column:auto}
  .footer-inner{flex-direction:column;text-align:center}
}

/* Preservation Motorworks - WPForms styling */

.wpforms-container {
    color: #f5f1e8;
}

.wpforms-container .wpforms-field-label {
    color: #f5f1e8 !important;
    font-weight: 600;
}

.wpforms-container .wpforms-field-sublabel {
    color: #d9d2c3 !important;
}

.wpforms-container input[type="text"],
.wpforms-container input[type="email"],
.wpforms-container input[type="tel"],
.wpforms-container input[type="number"],
.wpforms-container input[type="url"],
.wpforms-container select,
.wpforms-container textarea {
    width: 100% !important;
    background: rgba(8, 10, 14, 0.88) !important;
    color: #ffffff !important;
    border: 1px solid rgba(198, 154, 72, 0.65) !important;
    border-radius: 4px !important;
    padding: 12px 14px !important;
    box-shadow: none !important;
}

.wpforms-container input::placeholder,
.wpforms-container textarea::placeholder {
    color: rgba(255, 255, 255, 0.55) !important;
}

.wpforms-container input:focus,
.wpforms-container textarea:focus,
.wpforms-container select:focus {
    border-color: #d5a447 !important;
    outline: none !important;
    box-shadow: 0 0 0 1px #d5a447 !important;
}

.wpforms-container .wpforms-submit-container {
    margin-top: 22px !important;
}

.wpforms-container button[type="submit"],
.wpforms-container .wpforms-submit {
    background: #d5a447 !important;
    color: #111111 !important;
    border: 1px solid #d5a447 !important;
    padding: 12px 28px !important;
    border-radius: 3px !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    cursor: pointer;
}

.wpforms-container button[type="submit"]:hover,
.wpforms-container .wpforms-submit:hover {
    background: #f0c46a !important;
    border-color: #f0c46a !important;
}

.wpforms-container .wpforms-error {
    color: #ffb3a7 !important;
}

.wpforms-container .wpforms-confirmation-container-full {
    background: rgba(8, 10, 14, 0.95) !important;
    color: #f5f1e8 !important;
    border: 1px solid #d5a447 !important;
}

/* =========================================================
   PRESERVATION MOTORWORKS - FINAL SERVICE REQUEST FORM
   ========================================================= */

.contact-form {
    width: 100% !important;
    max-width: 820px !important;
    padding: 28px !important;
    background: rgba(8, 10, 16, 0.82) !important;
    border: 1px solid #d5a447 !important;
    border-radius: 4px !important;
    box-sizing: border-box !important;
}

.contact-form .wpforms-container,
.contact-form .wpforms-form {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
}

/* Compact two-column form layout */
.contact-form .wpforms-field-container {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 16px 22px !important;
}

.contact-form .wpforms-field {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

/* Full-width sections */
.contact-form .wpforms-field-name,
.contact-form .wpforms-field-radio,
.contact-form .wpforms-field-checkbox,
.contact-form .wpforms-field-textarea {
    grid-column: 1 / -1 !important;
}

/* Labels */
.contact-form .wpforms-field-label {
    display: block !important;
    margin-bottom: 6px !important;
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
}

.contact-form .wpforms-required-label {
    color: #d5a447 !important;
}

/* Inputs */
.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form input[type="tel"],
.contact-form input[type="number"],
.contact-form select,
.contact-form textarea {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 42px !important;
    padding: 9px 11px !important;
    background: #11151d !important;
    color: #ffffff !important;
    border: 1px solid #d5a447 !important;
    border-radius: 3px !important;
    box-sizing: border-box !important;
}

/* First + Last name side by side */
.contact-form .wpforms-field-name .wpforms-field-row {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 18px !important;
}

.contact-form .wpforms-field-name .wpforms-field-row-block {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
}

/* Descriptions */
.contact-form .wpforms-field-description,
.contact-form .wpforms-field-sublabel {
    color: #bfc1c6 !important;
    font-size: 12px !important;
}

/* Running/driving choices across one row */
.contact-form .wpforms-field-radio ul {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px 24px !important;
}

/* Checkboxes in two columns */
.contact-form .wpforms-field-checkbox ul {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px 18px !important;
}

.contact-form .wpforms-field-radio li,
.contact-form .wpforms-field-checkbox li,
.contact-form .wpforms-field-radio label,
.contact-form .wpforms-field-checkbox label {
    color: #ffffff !important;
    font-size: 13px !important;
    line-height: 1.35 !important;
}

/* Description box */
.contact-form textarea {
    min-height: 110px !important;
}

/* Submit button */
.contact-form .wpforms-submit-container {
    width: 100% !important;
    padding-top: 20px !important;
    text-align: center !important;
    clear: both !important;
}

.contact-form button[type="submit"],
.contact-form .wpforms-submit {
    position: static !important;
    float: none !important;
    display: inline-block !important;
    width: auto !important;
    min-width: 240px !important;
    padding: 14px 28px !important;
    background: #d5a447 !important;
    color: #080a0e !important;
    border: 1px solid #e5bd69 !important;
    border-radius: 3px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 1.4px !important;
    text-transform: uppercase !important;
}

/* Confirmation */
.contact-form .wpforms-confirmation-container-full,
.contact-form .wpforms-confirmation-container-full p,
.contact-form .wpforms-confirmation-container-full div {
    color: #ffffff !important;
}

.contact-form .wpforms-confirmation-container-full {
    background: #0d1119 !important;
    border: 1px solid #d5a447 !important;
    padding: 24px !important;
    line-height: 1.7 !important;
}

/* Mobile */
@media (max-width: 700px) {
    .contact-form {
        padding: 20px 16px !important;
    }

    .contact-form .wpforms-field-container {
        grid-template-columns: 1fr !important;
    }

    .contact-form .wpforms-field {
        grid-column: 1 !important;
    }

    .contact-form .wpforms-field-name .wpforms-field-row {
        grid-template-columns: 1fr !important;
    }

    .contact-form .wpforms-field-radio ul,
    .contact-form .wpforms-field-checkbox ul {
        display: grid !important;
        grid-template-columns: 1fr !important;
    }

    .contact-form button[type="submit"],
    .contact-form .wpforms-submit {
        width: 100% !important;
    }
}

/* DESKTOP WPForms FIX - override original theme form grid */

.contact-form form.wpforms-form {
    display: block !important;
    grid-template-columns: none !important;
    width: 100% !important;
    max-width: 100% !important;
}

/* Let the actual field area use the entire box */
.contact-form .wpforms-field-container {
    width: 100% !important;
    max-width: 100% !important;
}

/* Make the contact form itself wider on desktop */
@media (min-width: 701px) {

    .contact-grid {
        grid-template-columns: minmax(280px, 0.8fr) minmax(600px, 1.5fr) !important;
        gap: 50px !important;
        align-items: start !important;
    }

    .contact-form {
        max-width: none !important;
        width: 100% !important;
    }

    /* Put vehicle-use choices into columns */
    .contact-form .wpforms-field-radio ul {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 8px 18px !important;
    }

    /* Keep running/driving choices on one row */
    .contact-form .wpforms-field-radio:first-of-type ul {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 10px 24px !important;
    }
}

/* FIX FIRST / LAST NAME ALIGNMENT */

.contact-form .wpforms-field-name .wpforms-field-row {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
    width: 100% !important;
    max-width: 100% !important;
}

.contact-form .wpforms-field-name .wpforms-field-row-block {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
}

.contact-form .wpforms-field-name input {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
}

.contact-form .wpforms-field-name .wpforms-field-sublabel {
    display: block !important;
    margin-top: 5px !important;
    text-align: left !important;
}

/* FINAL FIX - WPForms Name Field ID 8 */

.contact-form #wpforms-70-field_8-container .wpforms-field-row {
    display: flex !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 22px !important;
    margin: 0 !important;
}

.contact-form #wpforms-70-field_8-container .wpforms-field-row-block {
    flex: 1 1 0 !important;
    width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
}

.contact-form #wpforms-70-field_8-container input {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}

.contact-form #wpforms-70-field_8-container .wpforms-field-sublabel {
    display: block !important;
    width: 100% !important;
    margin: 5px 0 0 !important;
    text-align: left !important;
}

/* Stack first/last normally on phones */
@media (max-width: 700px) {
    .contact-form #wpforms-70-field_8-container .wpforms-field-row {
        display: block !important;
    }

    .contact-form #wpforms-70-field_8-container .wpforms-field-row-block {
        width: 100% !important;
        margin-bottom: 12px !important;
    }
}

/* ===== Preservation Motorworks Project Gallery Cards ===== */

.gallery-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}

.gallery-item {
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
    aspect-ratio: auto !important;
    overflow: visible !important;
    background: #0d1015;
    border: 1px solid #d5a447;
    text-decoration: none !important;
    transition: transform .25s ease, border-color .25s ease;
}

.gallery-item:hover {
    transform: translateY(-4px);
    border-color: #f0c66a;
}

.gallery-image {
    width: 100%;
    height: 260px;
    overflow: hidden;
}

.gallery-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block;
}

.gallery-info {
    padding: 20px;
    background: #0d1015;
}

.gallery-info h3 {
    margin: 0 0 10px;
    color: #f5f1e8;
    font-size: 22px;
    line-height: 1.2;
}

.gallery-meta {
    margin: 0 0 16px;
    color: #c9c5bc;
    font-size: 14px;
    line-height: 1.6;
}

.gallery-link {
    color: #d5a447;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

/* Mobile gallery */
@media (max-width: 640px) {
    .gallery-grid {
        grid-template-columns: 1fr !important;
    }

    .gallery-image {
        height: 230px;
    }
}

/* ==========================================
   PROJECT PAGE PHOTO GALLERIES
   Preservation Motorworks
   ========================================== */

/* Gold frame around project gallery images */
.single-post .wp-block-gallery .wp-block-image {
    border: 1px solid #d5a447 !important;
    background: #0d1015 !important;
    padding: 5px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

/* Images fill their frame cleanly */
.single-post .wp-block-gallery .wp-block-image img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
}

/* Space between gallery images */
.single-post .wp-block-gallery {
    gap: 18px !important;
}

/* MOBILE */
@media (max-width: 640px) {

    .single-post .wp-block-gallery {
        gap: 18px !important;
    }

    .single-post .wp-block-gallery .wp-block-image {
        border: 2px solid #d5a447 !important;
        padding: 4px !important;
        background: #0d1015 !important;
        border-radius: 2px !important;
    }

    .single-post .wp-block-gallery .wp-block-image img {
        width: 100% !important;
        height: auto !important;
        display: block !important;
    }
}