/*
Theme Name: MotorFinds
Theme URI: https://motorfinds.local
Author: MotorFinds
Description: Custom theme for MotorFinds.
Version: 0.1.0
Text Domain: motorfinds
*/

:root { --mf-navy:#082b62; --mf-amber:#f9ad18; --mf-ink:#101828; --mf-muted:#667085; --mf-surface:#fff; --mf-soft:#f4f7fb; --mf-line:#dce4ef; --mf-radius:18px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--mf-ink); background:var(--mf-surface); font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; font-size:16px; line-height:1.6; }
a { color:inherit; text-decoration:none; } a:hover { color:var(--mf-navy); } img { max-width:100%; height:auto; }
.screen-reader-text,.skip-link:not(:focus) { clip:rect(1px,1px,1px,1px); clip-path:inset(50%); height:1px; overflow:hidden; position:absolute; white-space:nowrap; width:1px; }
.skip-link:focus { background:#fff; left:1rem; padding:.5rem 1rem; position:fixed; top:1rem; z-index:100; }
.site-header { border-bottom:1px solid var(--mf-line); background:rgba(255,255,255,.96); position:sticky; top:0; z-index:20; }
.header-inner,.footer-inner,.footer-bottom { max-width:1180px; margin:auto; padding-left:28px; padding-right:28px; }.header-inner { min-height:76px; display:flex; align-items:center; gap:34px; }
.site-brand { display:block; width:184px; flex:0 0 auto; line-height:0; }.site-brand img { display:block; width:100%; height:auto; }
.primary-navigation { margin-left:auto; }.menu { display:flex; align-items:center; gap:26px; margin:0; padding:0; list-style:none; font-size:.93rem; font-weight:700; }.menu a { color:#344054; }.menu a:hover { color:var(--mf-navy); }
.header-cta,.button { display:inline-flex; align-items:center; justify-content:center; gap:.7rem; padding:.73rem 1.05rem; border-radius:999px; font-size:.9rem; font-weight:800; transition:transform .2s ease, background .2s ease; }.header-cta { background:var(--mf-navy); color:#fff; }.header-cta:hover,.button-primary:hover { background:#0b397c; color:#fff; transform:translateY(-1px); }.menu-toggle { display:none; }
.hero { max-width:1180px; min-height:570px; margin:auto; padding:84px 28px 68px; display:grid; grid-template-columns:1.1fr .9fr; align-items:center; gap:45px; overflow:hidden; }.eyebrow { margin:0 0 12px; color:#b26100; font-size:.73rem; font-weight:900; letter-spacing:.13em; text-transform:uppercase; }.hero h1,.archive-header h1,.entry-title,.not-found h1 { margin:0; letter-spacing:-.055em; line-height:1.03; }.hero h1 { max-width:650px; font-size:clamp(3.2rem,6.2vw,5.6rem); }.hero-lede { max-width:560px; margin:25px 0 31px; color:#475467; font-size:1.14rem; }.button-primary { background:var(--mf-amber); color:#1c1300; padding:1rem 1.3rem; }.button-dark { background:var(--mf-ink); color:#fff; border:0; }.button:disabled { cursor:not-allowed; opacity:.5; }
.hero-art { min-height:358px; position:relative; isolation:isolate; overflow:hidden; border-radius:30px; background:radial-gradient(circle at 84% 18%,rgba(86,151,255,.55),transparent 27%),linear-gradient(135deg,#061b41 0%,#0b3b84 55%,#09275a 100%); box-shadow:0 18px 45px rgba(8,43,98,.16); }.hero-art:before { content:""; position:absolute; z-index:-1; width:345px; height:345px; border:39px solid rgba(249,173,24,.95); border-radius:50%; right:-116px; top:-142px; }.hero-art:after { content:""; position:absolute; z-index:-1; width:210px; height:210px; border:1px solid rgba(255,255,255,.14); border-radius:50%; left:-110px; bottom:-108px; }.hero-glow { position:absolute; z-index:-1; width:240px; height:240px; right:52px; top:27px; border-radius:50%; background:rgba(124,181,255,.18); filter:blur(18px); }.hero-badge { position:absolute; top:27px; left:29px; display:grid; place-items:center; width:42px; height:42px; border:1px solid rgba(255,255,255,.26); border-radius:50%; color:#fff; background:rgba(7,35,78,.42); box-shadow:0 8px 16px rgba(0,0,0,.14); font-size:.67rem; font-weight:900; letter-spacing:.06em; }.car-shadow { position:absolute; z-index:-1; width:68%; height:30px; left:16%; bottom:47px; border-radius:50%; background:rgba(1,12,32,.42); filter:blur(11px); }.car-shape { width:72%; height:134px; position:absolute; left:14%; bottom:91px; border-radius:67px 103px 30px 34px; background:linear-gradient(180deg,#fdfefe 0%,#edf2f8 72%,#cfd8e5 73%); box-shadow:inset 0 2px 0 rgba(255,255,255,.85),inset 0 -15px 0 #c1ccd9,0 14px 19px rgba(1,20,53,.25); }.car-shape:before { content:""; position:absolute; width:51%; height:74px; left:22%; top:-60px; border:6px solid #ecf2f9; border-bottom:0; border-radius:87px 87px 8px 8px; background:linear-gradient(140deg,#9dbbdd,#dae8f7 58%,#83a8d2); box-shadow:inset 0 0 0 2px rgba(18,60,112,.16); }.car-window { position:absolute; z-index:1; width:40%; height:5px; left:30%; top:-22px; border-radius:99px; background:rgba(255,255,255,.75); }.car-grille { position:absolute; width:21%; height:17px; left:39%; bottom:16px; border-top:3px solid #697b91; border-bottom:3px solid #697b91; opacity:.82; }.car-light { position:absolute; z-index:1; width:30px; height:15px; top:38px; border-radius:50%; background:#ffd26a; box-shadow:0 0 14px rgba(255,208,96,.7); }.car-light-one { left:18px; }.car-light-two { right:18px; }.wheel { width:72px; height:72px; bottom:54px; position:absolute; border:15px solid #17243a; border-radius:50%; background:radial-gradient(circle,#e8eef5 0 25%,#a9b7c8 27% 49%,#34445a 51% 54%,#111c2e 56%); box-shadow:0 8px 10px rgba(0,0,0,.24); }.wheel-one { left:23%; }.wheel-two { right:20%; }.road-line { position:absolute; height:5px; bottom:32px; border-radius:8px; background:rgba(255,255,255,.5); box-shadow:0 0 11px rgba(255,255,255,.15); }.road-line-one { width:27%; left:4%; }.road-line-two { width:18%; right:5%; }
.hero-art { background:#082b62; }.hero-art:before,.hero-art:after { content:none; }.hero-art img { display:block; width:100%; height:100%; min-height:358px; object-fit:cover; object-position:58% center; }
.section-shell { max-width:1180px; margin:0 auto; padding:76px 28px; }.vehicle-finder { border-radius:28px; background:var(--mf-soft); }.vehicle-finder h2,.value-grid h2,.coming-soon h2 { margin:0; letter-spacing:-.04em; line-height:1.1; font-size:clamp(1.9rem,3vw,2.7rem); }.finder-form { display:grid; grid-template-columns:repeat(3,1fr) auto; gap:12px; margin-top:28px; }.finder-form label span { display:block; margin:0 0 6px; color:#475467; font-size:.75rem; font-weight:800; }.finder-form.motorfinds-selector label span { color:#d0ddf4; }.finder-form select { width:100%; padding:.9rem; border:1px solid var(--mf-line); border-radius:10px; background:#fff; color:#98a2b3; }.finder-form .button { align-self:end; padding:1rem 1.25rem; }.finder-note { margin:16px 0 0; color:var(--mf-muted); font-size:.82rem; }
.value-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }.value-grid article { padding:31px; border:1px solid var(--mf-line); border-radius:var(--mf-radius); }.value-grid h2 { font-size:1.45rem; }.value-grid p { color:#667085; }.number { display:block; margin-bottom:34px; color:var(--mf-amber); font-weight:900; font-size:1.2rem; }.coming-soon { margin-bottom:76px; border-radius:28px; background:var(--mf-navy); color:#fff; }.coming-soon .eyebrow { color:#ffd36d; }.coming-soon p:last-child { max-width:570px; color:#d0ddf4; }
.guides-section { margin-top:22px; background:#eef4fb; }.guides-shell { padding-top:80px; padding-bottom:84px; }.guides-heading { display:flex; align-items:end; justify-content:space-between; gap:32px; margin-bottom:34px; }.guides-heading h2 { margin:0; letter-spacing:-.045em; line-height:1.08; font-size:clamp(2rem,3.5vw,3rem); }.guides-heading p:not(.eyebrow) { max-width:570px; margin:14px 0 0; color:#526174; }.text-link,.guide-read-link { display:inline-flex; align-items:center; gap:.55rem; color:var(--mf-navy); font-size:.9rem; font-weight:900; white-space:nowrap; }.text-link:hover,.guide-read-link:hover { color:#b26100; }.guide-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; }.guide-card { overflow:hidden; border:1px solid #dce4ef; border-radius:16px; background:#fff; box-shadow:0 8px 28px rgba(18,52,95,.06); transition:transform .2s ease, box-shadow .2s ease; }.guide-card:hover { transform:translateY(-4px); box-shadow:0 15px 36px rgba(18,52,95,.14); }.guide-card-image { display:block; overflow:hidden; aspect-ratio:1.56; background:#0c3673; }.guide-card-image img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .35s ease; }.guide-card:hover .guide-card-image img { transform:scale(1.045); }.guide-card-placeholder { display:block; width:100%; height:100%; position:relative; overflow:hidden; background:linear-gradient(140deg,#0b2d62 0%,#16539f 60%,#f9ad18 170%); }.guide-card-placeholder:before { content:""; position:absolute; width:135px; height:135px; top:-55px; right:-32px; border:22px solid var(--mf-amber); border-radius:50%; opacity:.95; }.guide-card-placeholder:after { content:""; position:absolute; width:74%; height:44px; bottom:24%; left:13%; border-radius:28px 42px 12px 12px; background:#f4f7fb; box-shadow:inset 0 -11px 0 #cfdae8; }.guide-card-placeholder span { position:absolute; z-index:1; width:22px; height:22px; bottom:17%; left:25%; border:6px solid #172638; border-radius:50%; background:#aebccc; box-shadow:142px 0 0 #aebccc,142px 0 0 0 #172638; }.guide-card-copy { padding:18px 18px 20px; }.guide-card-copy h3 { margin:7px 0 9px; letter-spacing:-.03em; line-height:1.2; font-size:1.1rem; }.guide-card-copy h3 a:hover { color:var(--mf-navy); }.guide-card-copy > p:not(.post-meta) { margin:0 0 15px; color:var(--mf-muted); font-size:.88rem; }.guides-empty { display:flex; align-items:center; justify-content:space-between; gap:30px; padding:30px; border:1px solid #dce4ef; border-radius:18px; background:#fff; }.guides-empty p { max-width:620px; margin:0; color:var(--mf-muted); }
.content-shell { max-width:850px; margin:0 auto; padding:76px 28px; }.entry-title { font-size:clamp(2.6rem,5vw,4.4rem); }.entry-content { margin-top:30px; font-size:1.05rem; }.entry-content a { color:var(--mf-navy); text-decoration:underline; }.suggested-posts { margin-top:72px; padding-top:52px; border-top:1px solid var(--mf-line); }.suggested-posts-heading { margin-bottom:24px; }.suggested-posts-heading h2 { margin:0; letter-spacing:-.04em; line-height:1.1; font-size:clamp(1.8rem,3vw,2.4rem); }.suggested-posts-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }.suggested-post-card { overflow:hidden; border:1px solid var(--mf-line); border-radius:16px; background:#fff; box-shadow:0 8px 28px rgba(18,52,95,.06); }.suggested-post-image { display:block; overflow:hidden; aspect-ratio:1.56; background:#0c3673; }.suggested-post-image img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .35s ease; }.suggested-post-card:hover .suggested-post-image img { transform:scale(1.045); }.suggested-post-copy { padding:17px 17px 19px; }.suggested-post-copy h3 { margin:7px 0 15px; letter-spacing:-.03em; line-height:1.2; font-size:1.08rem; }.archive-shell { max-width:1180px; }.archive-header { max-width:720px; margin-bottom:45px; }.post-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }.post-card { padding:25px; border:1px solid var(--mf-line); border-radius:var(--mf-radius); }.post-card h2 { margin:.35rem 0 .7rem; letter-spacing:-.03em; line-height:1.2; font-size:1.35rem; }.post-card p { color:var(--mf-muted); }.post-image img,.featured-image img { width:100%; border-radius:12px; }.post-meta { margin:0; color:#8b97a7 !important; font-size:.78rem; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }.featured-image { margin-top:30px; }.not-found { min-height:55vh; }.site-footer { padding:48px 0 25px; color:#e8eef7; background:#08182e; }.footer-inner { display:flex; justify-content:space-between; gap:50px; }.footer-inner .site-brand { width:180px; filter:brightness(0) invert(1); }.footer-inner p { margin:.75rem 0 0; color:#aebcd0; }.footer-inner .menu a { color:#dce6f5; }.footer-bottom { display:flex; justify-content:space-between; gap:20px; margin-top:42px; padding-top:22px; border-top:1px solid #223652; color:#aebcd0; font-size:.8rem; }
@media (max-width:820px) { .header-inner { min-height:66px; gap:15px; }.site-brand { width:150px; }.menu-toggle { display:flex; flex-direction:column; justify-content:center; gap:4px; width:40px; height:40px; margin-left:auto; padding:8px; border:0; background:transparent; }.menu-toggle span:not(.screen-reader-text) { display:block; height:2px; width:100%; background:var(--mf-ink); }.primary-navigation { display:none; position:absolute; top:66px; left:0; right:0; margin:0; padding:18px 28px; border-bottom:1px solid var(--mf-line); background:#fff; }.primary-navigation.is-open { display:block; }.primary-navigation .menu { display:flex; align-items:flex-start; flex-direction:column; gap:16px; }.header-cta { display:none; }.hero { min-height:unset; grid-template-columns:1fr; padding-top:55px; }.hero-art { min-height:300px; }.finder-form,.value-grid,.post-grid,.guide-grid,.suggested-posts-grid { grid-template-columns:1fr; }.finder-form .button { width:100%; }.section-shell,.content-shell { padding-top:54px; padding-bottom:54px; }.guides-shell { padding-top:58px; padding-bottom:58px; }.guides-heading,.guides-empty { align-items:flex-start; flex-direction:column; gap:18px; }.value-grid { gap:14px; }.footer-inner,.footer-bottom { flex-direction:column; gap:18px; }.footer-inner .menu { flex-wrap:wrap; align-items:flex-start; gap:12px 18px; }.footer-bottom { margin-top:30px; }.hero h1 { font-size:clamp(3rem,15vw,4.4rem); } }

.finder-form.motorfinds-selector label span { color:#475467; }
.finder-form select { color:#344054; }
.motorfinds-selector__status { grid-column:1 / -1; margin:0; color:#475467; font-size:.82rem; }