/* ===== Brand: Yale Blue + Mustard Gold ===== */ :root{ --navy:#00356B; /* Yale Blue */ --gold:#E1AD01; /* Mustard Gold */ --panel:#072549; /* Deep navy card */ --shadow:0 10px 30px rgba(0,0,0,.35); --radius:18px; } /* Canvas */ #pmr{ --wp--style--block-gap:0; /* kill Gutenberg block gaps inside this region */ font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Inter,Roboto,Arial,sans-serif; background:linear-gradient(180deg,#04162c 0%,#081c36 100%); width:100vw; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); color:var(--gold); } #pmr *{box-sizing:border-box} #pmr .container{max-width:1100px;margin:0 auto;padding:0 20px} #pmr .grid{display:grid;gap:18px} #pmr .two-col{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));align-items:start} #pmr .section{padding:56px 0} /* Hide Blocksy header/footer & shop/cart/search if present */ header.site-header, footer.site-footer{display:none !重要} .ct-header-search, .ct-header-cart, .ct-cart, .ct-cart-trigger, header.site-header a[href*="/cart"], header.site-header a[href*="/shop"]{display:none !important} /* ===== BRAND: PREMER’S arc + MOBILE REPAIR LLC (tight, no overlap) ===== */ #pmr .brand-header{ --wp--style--block-gap:0; display:grid; row-gap:0; margin:0 !important; padding:0 !important; line-height:1 !important; text-align:center; } #pmr .brand-header > *{ margin:0 !important; padding:0 !important; } /* Arched PREMER’S SVG */ #pmr .brand-arc{ display:block; width:min(95vw,1000px); height:auto; margin:0 auto -40px !important; /* base pull-up */ line-height:0 !important; vertical-align:top !important; overflow:visible; } /* “MOBILE REPAIR LLC” directly under the arc */ #pmr .brand-sub{ margin:0 0 6px !important; /* tiny cushion above kicker */ line-height:1.05 !important; transform:translateY(-6px) !important; /* base tuck under arc */ color:var(--gold); font-weight:800; letter-spacing:.5px; } /* Progressive tightening on wider screens (keeps it tight but safe) */ @media (min-width:480px){ #pmr .brand-arc{ margin-bottom:-46px !important; } #pmr .brand-sub{ transform:translateY(-7px) !important; } } @media (min-width:768px){ #pmr .brand-arc{ margin-bottom:-52px !important; } #pmr .brand-sub{ transform:translateY(-9px) !important; } } @media (min-width:1024px){ #pmr .brand-arc{ margin-bottom:-60px !important; } #pmr .brand-sub{ transform:translateY(-10px) !important; } } /* ===== HERO (reduced gap under header, no overlap) ===== */ #pmr .hero{ text-align:center; padding:4px 0 48px !important; margin-top:4px !important; } #pmr .kicker{ color:var(--gold); font-weight:900; text-transform:uppercase; letter-spacing:.15em; margin-top:0 !important; } #pmr .tagline{ color:var(--gold); font-size:1.8rem; margin:8px 0 10px; } #pmr .lead{ color:var(--gold); max-width:820px; margin:0 auto; } /* CTAs */ #pmr .cta-row{ margin-top:18px; display:flex; gap:14px; justify-content:center; flex-wrap:wrap; } #pmr .btn{ padding:14px 18px; border-radius:14px; font-weight:900; cursor:pointer; text-decoration:none; } #pmr .btn-primary{ background:var(--gold); color:var(--navy); } #pmr .btn-secondary{ background:transparent; color:var(--gold); border:2px solid var(--gold); } #pmr .btn-primary:hover{ filter:brightness(0.95); } #pmr .btn-secondary:hover{ background:var(--gold); color:var(--navy); } /* Headings / Cards / Pills */ #pmr h2{ color:var(--gold); text-align:center; margin:0 0 18px; font-size:clamp(1.4rem,1.2vw + 1rem,2rem); } #pmr .card{ background:rgba(0,0,0,.3); border-radius:var(--radius); box-shadow:var(--shadow); } #pmr .card-pad{ padding:20px; } #pmr .pill{ display:inline-block; background:var(--gold); color:var(--navy); padding:6px 10px; border-radius:999px; font-size:.8rem; font-weight:900; margin-bottom:10px; } /* ===== SERVICES (NO bullets/dots) ===== */ #pmr .service-list{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:18px; text-align:center; } #pmr .service-list ul{ list-style:none; padding:0; margin:0; } #pmr .service-list li{ background:var(--panel); border:1px solid rgba(255,255,255,.12); border-radius:14px; padding:14px; position:relative; color:var(--gold); } #pmr .service-list li::before, #pmr .service-list li::after{ content:none; } /* ===== WORK WITH US ===== */ #pmr #work-with-us .work-list{ list-style:none; margin:0; padding:0; } #pmr #work-with-us .work-list li{ background:var(--panel); border:1px solid rgba(255,255,255,.12); border-radius:14px; padding:12px 14px 12px 44px; position:relative; color:var(--gold); margin-bottom:10px; } #pmr #work-with-us .work-list li::before{ content:"✓"; position:absolute; left:14px; top:10px; font-weight:900; color:var(--gold); } #pmr .work-actions{ display:flex; gap:12px; flex-wrap:wrap; margin:12px 0 10px; align-items:center; } #pmr .work-actions + .work-form{ margin-top:12px; } #pmr .work-form{ position:relative; clear:both; } #pmr .work-form label{ display:block; margin:8px 0 4px; color:var(--gold); } #pmr .work-form input, #pmr .work-form textarea{ width:100%; background:var(--navy); color:var(--gold); border:1px solid var(--gold); border-radius:10px; padding:10px; margin-bottom:12px; } #pmr .work-form input::placeholder, #pmr .work-form textarea::placeholder{ color:rgba(225,173,1,.7); } /* ===== BILLING / CONTACT (side-by-side on desktop) ===== */ #pmr #billing.section, #pmr #contact.section{ display:inline-block; width:49.5%; vertical-align:top; padding:32px 10px; } @media (max-width:900px){ #pmr #billing.section, #pmr #contact.section{ display:block; width:100%; padding:32px 0; } } /* Billing actions: center row; prevent overlap */ #pmr .billing-actions{ display:flex; justify-content:center; flex-wrap:wrap; gap:10px; margin-top:16px; } #pmr #billing p{ margin-bottom:10px; } #pmr .billing-notes{ margin-top:12px; } /* Footer */ .pmr-footer{ background:rgba(0,0,0,.18); border-top:1px solid rgba(255,255,255,.12); } .pmr-footer__inner{ max-width:1100px; margin:0 auto; padding:16px; display:flex; justify-content:center; align-items:center; gap:6px; text-align:center; } @media (max-width:700px){ .pmr-footer__inner{ flex-direction:column; } } /* ========================= APPENDED FIXES (keep behavior) ========================= */ /* FIX: Pay Invoice button overlap (force its own row + spacing) */ #pmr .billing-actions{ display:flex !important; width:100% !important; justify-content:center !important; align-items:center !important; flex-wrap:wrap !important; gap:12px !important; margin-top:16px !important; clear:both !important; } #pmr #billing p{ margin-bottom:12px !important; } #pmr .billing-notes{ margin-top:12px !important; } /* FIX: Ensure all inputs use navy/gold (not white) */ #pmr form input, #pmr form textarea, #pmr .work-form input, #pmr .work-form textarea{ background: var(--navy) !important; color: var(--gold) !important; border: 1px solid var(--gold) !important; border-radius: 10px !important; -webkit-appearance: none; appearance: none; } #pmr form input::placeholder, #pmr form textarea::placeholder, #pmr .work-form input::placeholder, #pmr .work-form textarea::placeholder{ color: rgba(225,173,1,.7) !important; } /* ========================= APPENDED — Move subline up a little more, and INCREASE gap to the kicker, and match "Get a Quote" bubble to "Tell Us About You" ========================= */ /* Move "MOBILE REPAIR LLC" up a LITTLE more (toward the arc) */ #pmr .brand-arc{ margin-bottom: -104px !important; /* more negative = subline higher */ } #pmr .brand-sub{ transform: translateY(-24px) !important; /* tucks further under arc */ } /* Increase the gap between subline and the kicker */ #pmr .brand-header + .hero{ margin-top: 14px !important; /* push kicker down a bit */ padding-top: 10px !important; } /* Ensure "Get a Quote" bubble matches "Tell Us About You" bubble */ #pmr #contact .pill{ display:inline-block !important; background:var(--gold) !important; color:var(--navy) !important; padding:6px 10px !important; border-radius:999px !important; font-size:.8rem !important; font-weight:900 !important;