/* Fast Parts – styles. Light mode only. Fonts are self-hosted. */
@font-face{font-family:'Barlow Semi Condensed';font-style:italic;font-weight:800;font-display:swap;src:url('../fonts/barlow-semi-condensed-800-italic.woff2') format('woff2')}
@font-face{font-family:'Barlow Semi Condensed';font-style:italic;font-weight:700;font-display:swap;src:url('../fonts/barlow-semi-condensed-700-italic.woff2') format('woff2')}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:200 900;font-display:swap;src:url('../fonts/source-sans-3-var.woff2') format('woff2')}

:root{
  color-scheme:light;
  --navy:#031A78;--red:#E1162C;--sky:#8CD3F0;--ink:#1B2030;--off:#F4F6FA;
  --line:#D9E0EC;--muted:#4A5266;--foot:#E9EEF7;--star:#B45309;
  --head:'Barlow Semi Condensed','Source Sans 3',Arial,sans-serif;
  --body:'Source Sans 3',Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--off);color:var(--ink);font-family:var(--body);font-size:18px;line-height:1.55}
img{max-width:100%}
a{color:var(--navy)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--navy);outline-offset:2px}
.skip{position:absolute;left:-999px;top:8px;background:#fff;color:var(--navy);padding:10px 16px;border-radius:8px;z-index:10;font-weight:700}
.skip:focus{left:8px}
.wrap{max-width:1200px;margin:0 auto;padding-left:24px;padding-right:24px}

/* utility bar */
.util{background:var(--navy);color:#fff;font-size:15px}
.util .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 24px;padding-top:10px;padding-bottom:10px}
.util p{margin:0}

/* header */
.site-header{background:#fff;border-bottom:1px solid var(--line)}
.head-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 32px;padding-top:16px;padding-bottom:8px}
.brand{flex:0 1 420px;min-width:0;display:flex;flex-direction:column;align-items:stretch}
.logo{display:block;min-width:0}
.logo img{display:block;width:100%;max-width:420px;height:auto}
.call-row,.actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;width:max-content;max-width:100%}
.call{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;background:var(--red);color:#fff;text-decoration:none;padding:8px 18px;border-radius:10px;min-height:52px;line-height:1.25}
.call b{font-size:16px}.call span{font-size:15px}
.call:hover{background:#C20F24}
.call.light{background:#fff;color:var(--navy);padding:10px 24px;min-height:56px}
.call.light b{font-size:18px}.call.light span{font-size:16px}
.call.light:hover{background:#E9EEF7}
.call.red-lg{padding:10px 24px;min-height:56px}.call.red-lg b{font-size:18px}.call.red-lg span{font-size:16px}
nav.main{display:flex;flex-wrap:wrap;justify-content:center;gap:0 clamp(14px,2.5vw,26px);font-weight:600;font-size:18px;margin-top:4px}
nav.main a{color:var(--navy);text-decoration:none;padding:10px 0 9px;border-bottom:3px solid transparent}
nav.main a:hover{border-bottom-color:var(--sky)}
nav.main a[aria-current="page"]{border-bottom-color:var(--red)}

/* type */
h1,h2{font-family:var(--head);font-style:italic;font-weight:800;color:var(--navy);line-height:1.1;margin:0}
h1{font-size:clamp(44px,6vw,72px);line-height:1.02;margin-bottom:20px}
h2{font-size:clamp(32px,4.5vw,40px);margin-bottom:12px}
h3{margin:0 0 8px;font-size:24px;color:var(--navy);line-height:1.2}
p{margin:0 0 16px}
.eyebrow{margin:0 0 12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:15px;color:var(--sky)}
.lead{font-size:20px;max-width:560px}

/* hero (navy with soft-blue flag) */
.hero{background:var(--navy);color:#fff;position:relative;overflow:hidden;display:flex;align-items:center;min-height:600px}
.hero::before{content:"";position:absolute;inset:0;background:url('../images/fast-parts-flag.svg') right top/auto min(100%,600px) no-repeat;opacity:.62}
.hero .wrap{width:100%;position:relative;display:flex;flex-wrap:wrap;gap:40px;align-items:center;padding-top:64px;padding-bottom:64px}
.hero h1{color:#fff}
.hero .txt{flex:1 1 420px;min-width:0}
.hero .pic{flex:1 1 360px;min-width:0}
.hero .pic img{display:block;width:100%;height:auto;max-height:380px;object-fit:cover;border-radius:14px}
.hero .actions{gap:12px;margin:32px 0 20px}
.hero a.text-link{color:var(--sky);font-weight:600;font-size:18px}
.hero.small .wrap{padding-top:48px;padding-bottom:48px}

/* sections and cards */
section.block{padding-top:56px;padding-bottom:24px}
section.block.last{padding-bottom:72px}
.sub{max-width:640px;margin-bottom:28px}
.cards{display:flex;flex-wrap:wrap;gap:20px}
.card{flex:1 1 300px;min-width:0;background:#fff;border:1px solid var(--line);border-radius:14px;padding:28px}
.card.wide{flex-basis:480px}
.card{display:flex;flex-direction:column;align-items:flex-start}
.card .icon{display:block;width:32px;height:32px;margin-bottom:6px;color:var(--navy)}
.card p:last-child{margin-bottom:0}
.more{color:var(--red);font-weight:700;margin-top:auto}
.more:hover{color:#C20F24}
.steps{counter-reset:s;list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:20px}
.steps li{counter-increment:s;flex:1 1 280px;min-width:0;background:#fff;border:1px solid var(--line);border-radius:14px;padding:28px}
.steps li::before{content:counter(s);display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:var(--navy);color:#fff;font-weight:700;margin-bottom:12px}
.shop{display:flex;flex-wrap:wrap;gap:24px}
.shop>div{flex:1 1 220px;min-width:0}
.tel{color:var(--navy);font-weight:700;font-size:22px;text-decoration:none}
.btn{display:inline-flex;align-items:center;justify-content:center;background:var(--red);color:#fff;border:0;border-radius:10px;min-height:52px;padding:0 32px;font:inherit;font-weight:700;font-size:18px;cursor:pointer;text-decoration:none}
.btn:hover{background:#C20F24}
.btn.ghost{background:#fff;color:var(--navy);border:2px solid var(--navy)}
.btn.ghost:hover{background:#E9EEF7}
table.hours{border-collapse:collapse;width:100%;max-width:420px}
table.hours th,table.hours td{text-align:left;padding:10px 0;border-bottom:1px solid var(--line)}
table.hours th{font-weight:600}

/* reviews */
figure.review{flex:1 1 300px;min-width:0;margin:0;background:#fff;border:1px solid var(--line);border-radius:14px;padding:28px}
.stars{color:var(--star);font-size:22px;letter-spacing:2px}
figure.review blockquote{margin:12px 0 16px;font-size:22px;font-weight:600;color:var(--navy)}
figure.review figcaption{font-size:16px;color:var(--muted)}
.note{font-size:15px;color:var(--muted)}

/* forms */
.formcard{background:#fff;border:1px solid var(--line);border-radius:14px;padding:40px;display:flex;flex-wrap:wrap;gap:40px}
.formcard>div{flex:1 1 300px;min-width:0}
.formcard form{flex:1 1 420px;min-width:0;display:flex;flex-direction:column;gap:18px}
.row{display:flex;flex-wrap:wrap;gap:18px}
.row>div{flex:1 1 200px;min-width:0}
label{display:block;font-weight:600;margin-bottom:6px}
input,select,textarea{width:100%;border:1px solid #6B7589;border-radius:8px;padding:0 12px;font:inherit;background:#fff;color:var(--ink)}
input,select{height:48px}
textarea{padding:10px 12px}
.hp{position:absolute;left:-5000px}
.msg{display:none;padding:14px 16px;border-radius:10px;font-weight:600}
.msg.ok{display:block;background:#E8F5EC;color:#14532D;border:1px solid #14532D}
.msg.err{display:block;background:#FDECEC;color:#7F1D1D;border:1px solid #7F1D1D}
.formcard img{display:block;width:100%;max-width:440px;height:auto;border-radius:12px;margin-top:28px}

/* CTA band, footer */
.band{background:var(--navy);color:#fff;text-align:center}
.band .wrap{padding-top:56px;padding-bottom:56px}
.band h2{color:#fff}
.band .actions{gap:12px;margin:24px auto 0}
footer.site{background:#fff;border-top:1px solid var(--line);margin-top:0}
footer.site .cols{display:flex;flex-wrap:wrap;gap:32px 48px;padding-top:48px;padding-bottom:24px;font-size:16px}
footer.site .cols>div{flex:1 1 200px;min-width:0}
footer.site h3{font-size:18px}
footer.site .fbrand{max-width:300px;text-align:center}
footer.site .logo-f{display:block;width:100%;max-width:300px;height:auto;margin:0 0 8px}
footer.site .fbrand p{margin:0}
footer.site .legal{border-top:1px solid #C9D3E6;display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;padding-top:16px;padding-bottom:32px;font-size:15px;color:#3C4457}
.prose{max-width:760px}
.prose h2{font-size:32px;margin-top:40px}
.prose h3{margin-top:24px}
.todo{background:#FFF4CC;padding:0 4px;border-radius:3px}

.credit{padding-bottom:32px}
.credit a{display:inline-flex;align-items:center;gap:8px;color:var(--navy);font-weight:600;font-size:16px;text-decoration:none}
.credit a:hover span{text-decoration:underline}
.credit .fac{flex:none}

/* cookie control */
.cc{position:fixed;left:0;right:0;bottom:0;z-index:20;padding:12px 12px calc(12px + env(safe-area-inset-bottom,0px));pointer-events:none;font-size:15px;line-height:1.5}
.cc-in{pointer-events:auto;max-width:760px;margin:0 auto;background:#fff;border:2px solid var(--navy);border-radius:18px;padding:18px 20px;box-shadow:0 8px 30px rgba(3,26,120,.25)}
.cc h2{font-size:22px;margin-bottom:6px}
.cc p{margin:0 0 12px}
.cc-b{display:flex;flex-wrap:wrap;gap:10px}
.cc .btn{min-height:0;padding:10px 20px;font-size:16px;border-radius:999px}
.cc .btn.ghost{border-width:2px}
.legal a[data-cookie-settings]{cursor:pointer}

.sr{position:absolute;left:-9999px}
.tint{background:#E3EAF6;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:32px;padding-bottom:40px}
.shop .btns,.btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:4px}
.card .btns .btn{min-height:52px;padding:0 22px}
.linkbtn{background:none;border:0;padding:0;font:inherit;color:var(--navy);text-decoration:underline;cursor:pointer}
.carousel{position:relative}
.track{list-style:none;margin:0;padding:4px 2px 12px;display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch}
.track:focus-visible{outline:3px solid var(--navy);outline-offset:2px}
.slide{flex:0 0 min(340px,84%);scroll-snap-align:start;display:flex}
.slide figure.review{flex:1 1 auto;width:100%}
.car-btns{display:flex;gap:12px;margin-top:12px}
.car-btns .btn{min-height:48px;padding:0 24px;font-size:22px}
.car-btns .btn[disabled]{opacity:.4;cursor:default}
@media (prefers-reduced-motion:reduce){.track{scroll-behavior:auto}}
.call.light{padding:10px 14px}
.linkbtn{text-align:left}

/* round 2 */
.wide-sub{max-width:none}
em{font-style:italic}
.card.wide .shop{flex:1;display:flex}
.shopin{display:flex;flex-direction:column;flex:1 1 auto}
.shopin .btns{margin-top:auto}
.shopin p{margin-bottom:20px}
select{appearance:none;-webkit-appearance:none;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1.5l6 6 6-6' fill='none' stroke='%231B2030' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 18px center;padding-right:46px}
.fcol{display:flex;flex-direction:column}
.fcol .addr{flex:1 1 auto;margin-bottom:8px}
.fcol .ph{margin:0}
.carousel{position:relative}
.car-arrow{position:absolute;top:50%;transform:translateY(-62%);z-index:2;width:48px;height:48px;border-radius:50%;border:2px solid var(--navy);background:#fff;color:var(--navy);font-size:30px;line-height:1;padding:0 0 4px;cursor:pointer;box-shadow:0 2px 8px rgba(3,26,120,.2)}
.car-arrow:hover{background:#E9EEF7}
.car-prev{left:-14px}.car-next{right:-14px}
.car-arrow[disabled]{opacity:.35;cursor:default}
@media (max-width:640px){.car-prev{left:-6px}.car-next{right:-6px}}

/* mobile optimisations */
@media (max-width:640px){
  .util p:last-child{display:none}
  .head-top .call-row{display:none}
  .formcard>div>img{display:none}
  footer.site .fbrand{margin-left:auto;margin-right:auto}
}

@media (max-width:640px){
  .util .sep{display:none}
  .util .closed{display:block}
  .track{padding-left:11%;padding-right:11%;scroll-padding:0 11%}
  .slide{flex:0 0 100%;scroll-snap-align:center}
  .car-arrow{width:36px;height:36px;font-size:24px;padding:0 0 3px}
  .car-prev{left:0}.car-next{right:0}
}

/* alternating section bands */
.sec .block{padding-top:56px;padding-bottom:56px}
.sec-b{background:#E3EAF6;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}

/* scroll reveal (added by js/main.js; harmless without it) */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

@media (max-width:900px){.hero .pic{display:none}}

.code404{font:italic 800 clamp(110px,22vw,200px)/.9 'Barlow Semi Condensed',sans-serif;color:var(--red);margin:0 0 8px;letter-spacing:-.01em}

/* about page */
.split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px;align-items:center}
.split.flip{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.split.flip .tile{order:2}
.tile{background:var(--navy);color:#fff;border-radius:14px;min-height:260px;padding:32px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:14px;position:relative;overflow:hidden}
.tile::before{content:"";position:absolute;inset:0;background:url('../images/fast-parts-flag.svg') right top/auto 140% no-repeat;opacity:.5}
.tile>*{position:relative}
.tile .icon{width:72px;height:72px;color:var(--sky);stroke-width:1.4}
.tile .tn{font:italic 800 clamp(88px,12vw,132px)/.9 var(--head);color:#fff}
.tile .tl{font:italic 700 24px/1.2 var(--head);color:var(--sky)}
.band .stats{display:flex;flex-wrap:wrap;justify-content:center;gap:16px 56px;margin:32px 0 28px}
.band .stats>div{display:flex;flex-direction:column;align-items:center;min-width:150px}
.band .sn{font:italic 800 76px/1 var(--head);color:#fff}
.band .sl{font-size:18px;color:var(--sky);font-weight:600;max-width:170px;line-height:1.25;margin-top:4px}
@media (max-width:800px){.split,.split.flip{grid-template-columns:minmax(0,1fr);gap:24px}.split.flip .tile{order:0}.tile{min-height:200px}.band .sn{font-size:60px}}

/* about page v2 */
.about-est{position:relative;overflow:hidden}
.about-est .bignum{position:absolute;right:max(16px,3vw);top:50%;transform:translateY(-50%);font:italic 800 clamp(120px,24vw,320px)/1 var(--head);color:#E3EAF6;pointer-events:none;user-select:none}
.about-est .prose{position:relative;max-width:720px}
.about-est .eyebrow{color:#B8101F}
.about-est .lead{font-size:22px;color:var(--ink)}
.two{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:56px;align-items:center}
.pull{margin:0;background:#fff;border:1px solid var(--line);border-left:6px solid var(--red);border-radius:14px;padding:32px}
.pull blockquote{margin:0 0 16px;font:italic 700 clamp(26px,3vw,34px)/1.2 var(--head);color:var(--navy)}
.pull figcaption{font-size:16px;color:var(--ink)}
.pull .stars{font-size:18px;margin-right:6px}
@media (max-width:800px){.two{grid-template-columns:minmax(0,1fr);gap:24px}.about-est{padding-bottom:96px}.about-est .bignum{top:auto;bottom:-12px;transform:none}}

/* cookie settings view */
.cc[hidden],.cc [hidden]{display:none}
.cc-opt{display:flex;gap:12px;align-items:flex-start;margin:0 0 12px;cursor:pointer}
.cc-opt input{width:22px;height:22px;margin:2px 0 0;accent-color:var(--navy);flex:0 0 auto}
.cc-opt input:focus-visible,.cc a:focus-visible{outline:3px solid var(--red);outline-offset:2px}

/* cookie table */
.cktable{border-collapse:collapse;width:100%;font-size:16px}
.cktable th,.cktable td{text-align:left;vertical-align:top;padding:10px 12px 10px 0;border-bottom:1px solid var(--line)}
.cktable th{font-weight:600}
@media (max-width:760px){
.cktable thead{position:absolute;left:-9999px}
.cktable,.cktable tbody,.cktable tr,.cktable td{display:block;width:100%}
.cktable tr{border:1px solid var(--line);border-radius:14px;padding:12px 16px;margin:0 0 14px;background:#fff}
.cktable td{border:0;padding:4px 0}
.cktable td::before{content:attr(data-label);display:block;font-weight:600;font-size:14px;color:var(--navy)}
}
