/* Vehicle autocomplete and an illustrated PPF guide. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.vehicle-picker{position:relative}
.vehicle-hint{font-size:.875rem;line-height:1.65;color:#5b6450;margin-top:10px}
.vehicle-suggestions{position:absolute;inset:calc(100% + 7px) 0 auto;z-index:10;border:1px solid #b7c3a2;border-radius:5px;background:#fff;box-shadow:0 14px 35px #10111325;overflow:hidden}
.vehicle-suggestions[hidden]{display:none}
.vehicle-results-label{padding:13px 15px;font-size:.8125rem;line-height:1.6;color:#596151;background:#f1f4e9;border-bottom:1px solid #17191b18}
#vehicle-options{position:relative;max-height:min(280px,35dvh);overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;list-style:none;margin:0;padding:0}
#vehicle-options [role="option"]{display:flex;flex-direction:column;gap:3px;min-height:64px;padding:11px 15px;border-bottom:1px solid #17191b10;cursor:pointer}
#vehicle-options [role="option"]:last-child{border-bottom:0}
#vehicle-options [role="option"]:hover,#vehicle-options [aria-selected="true"]{background:#edf6d5}
.vehicle-model{font-size:1rem;line-height:1.45;font-weight:500;overflow-wrap:anywhere}
.vehicle-brand{font-size:.8125rem;line-height:1.5;color:#596151}
#vehicle-more{width:100%;min-height:46px;padding:11px 14px;background:#f1f4e9;font-size:.875rem;color:#344522;border-top:1px solid #17191b20}
#vehicle-more:hover{background:#e3edcd}
#vehicle-more[hidden]{display:none}
#vehicle:focus{border-color:#637c28}

.ppf-guide-card{position:relative;display:block;width:100%;padding:0;aspect-ratio:1/1;text-align:left;overflow:hidden;border-radius:5px;background:#202124;color:#fff;isolation:isolate}
.ppf-guide-card>img{width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .5s ease;opacity:.9}
.ppf-guide-card:after{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(180deg,#08090b50,transparent 30%,#08090b44 50%,#08090bf5)}
.guide-card-label{position:absolute;top:25px;left:27px;z-index:1;font-size:.8125rem;line-height:1.6;letter-spacing:.08em;color:var(--lime)}
.guide-card-content{position:absolute;inset:auto 27px 25px;z-index:1;display:flex;flex-direction:column;align-items:flex-start}
.guide-card-content>strong{font-size:clamp(2.25rem,3.7vw,4rem);font-weight:500;line-height:1.05;letter-spacing:-.055em}
.guide-card-content>span:not(.guide-card-action){font-size:1rem;line-height:1.6;margin-top:15px;color:#e0e4d6}
.guide-card-action{display:flex;justify-content:space-between;align-items:center;gap:25px;width:100%;min-height:49px;margin-top:20px;padding-top:16px;border-top:1px solid #ffffff50;font-size:.9375rem;color:var(--lime)}
.ppf-guide-card:hover>img{transform:scale(1.035)}
.ppf-guide-card:hover .guide-card-action{border-color:var(--lime)}
.ppf-guide-card:focus-visible{outline:3px solid var(--lime);outline-offset:6px}

.ppf-guide-dialog{width:min(1080px,calc(100% - 40px));max-height:calc(100dvh - 40px);background:var(--paper);color:var(--ink)}
.guide-header{position:sticky;top:0;z-index:3;display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:70px;padding:13px 28px;background:var(--ink);color:var(--lime);border-bottom:1px solid #ffffff20}
.guide-header .eyebrow{font-size:.8125rem;letter-spacing:.08em}
.guide-header .dialog-close{position:static;flex:none;box-shadow:none;background:#ffffff14;color:#fff;border:1px solid #ffffff25}
.guide-header .dialog-close:focus-visible{outline-color:var(--lime)}
.guide-body{padding:36px clamp(22px,4vw,48px) 26px}
.guide-opening h2{font-size:clamp(2rem,3.6vw,3.8rem);line-height:1.08;letter-spacing:-.055em;margin-top:18px}
.guide-opening h2 span{color:#6c775d}
.guide-opening>p:last-child{font-size:1rem;line-height:1.75;color:#596151;max-width:610px;margin-top:20px}
.guide-protection{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:30px;margin-top:30px;align-items:start}
.guide-protection figure,.guide-finish-panel figure{margin:0;position:relative;overflow:hidden;border-radius:4px;background:#202124}
.guide-protection figure>img{width:100%;height:auto;aspect-ratio:1.08;object-fit:cover;object-position:40% center}
.guide-protection figcaption{position:absolute;inset:auto 0 0;font-size:.8125rem;line-height:1.6;padding:35px 20px 18px;color:#fff;background:linear-gradient(transparent,#101113e6)}
.guide-benefit-list article{display:flex;gap:15px;padding:17px 0;border-bottom:1px solid var(--line)}
.guide-benefit-list article:first-child{padding-top:4px}
.guide-benefit-list article>.icon{width:23px;height:23px;margin-top:3px;color:#566e26}
.guide-benefit-list h3{font-size:1.15rem;line-height:1.4;letter-spacing:-.025em}
.guide-benefit-list article p{font-size:1rem;line-height:1.65;color:#596151;margin-top:6px}
.guide-small-note{font-size:.875rem;line-height:1.7;color:#596151;margin-top:19px}
.guide-finishes{margin-top:42px;padding-top:30px;border-top:1px solid var(--line)}
.guide-finishes>h3{font-size:clamp(1.7rem,2.6vw,2.5rem);line-height:1.2;letter-spacing:-.045em;margin-top:15px}
.guide-finishes>p:not(.section-label):not(.guide-small-note){font-size:1rem;line-height:1.65;color:#596151;margin-top:10px}
.guide-tabs{display:grid;grid-template-columns:.85fr 1.3fr .85fr;gap:8px;margin-top:22px;margin-bottom:15px}
.guide-tabs button{min-height:48px;font-size:1rem;line-height:1.35;padding:12px 8px;border:1px solid #b5bca9;border-radius:3px;background:transparent;color:#4b5540}
.guide-tabs button[aria-selected="true"]{background:var(--ink);border-color:var(--ink);color:var(--lime)}
.guide-tabs button:hover:not([aria-selected="true"]){background:#e6ebdc}
.guide-finish-panel{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);background:#e8ecdf;border-radius:4px;overflow:hidden;min-height:300px}
.guide-finish-panel figure{border-radius:0;display:flex;flex-direction:column;justify-content:center}
.guide-finish-panel img{width:100%;height:auto;aspect-ratio:16/11;object-fit:contain}
.guide-finish-panel figcaption{font-size:.75rem;line-height:1.7;color:#e2e6d9;background:#202124;padding:8px 17px 13px}
.guide-finish-copy{padding:27px 26px}
.guide-finish-number{font-size:.75rem;letter-spacing:.07em;line-height:1.5;color:#596151}
.guide-finish-copy h4{font-size:1.8rem;line-height:1.12;letter-spacing:-.045em;font-weight:500;margin:19px 0 15px}
.guide-finish-copy>p{font-size:1rem;line-height:1.7;color:#596151}
.guide-best-for{margin-top:19px;padding-top:16px;border-top:1px solid #17191b25}
.guide-best-for strong{display:block;font-size:.9375rem;line-height:1.5;font-weight:600;color:var(--ink);margin-bottom:7px}
.guide-coverage{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:36px;margin-top:37px;padding-top:30px;border-top:1px solid var(--line)}
.guide-coverage h3{font-size:clamp(1.5rem,2.3vw,2.2rem);line-height:1.25;letter-spacing:-.04em;margin-top:16px}
.guide-coverage-options article+article{margin-top:20px;padding-top:19px;border-top:1px solid var(--line)}
.guide-coverage-options h4{font-size:1.125rem;line-height:1.5;font-weight:500;letter-spacing:-.02em;margin:0 0 7px}
.guide-coverage-options p{font-size:1rem;line-height:1.7;color:#596151}
.guide-ceramic-note{display:flex;align-items:flex-start;gap:16px;margin-top:30px;padding:20px;background:#e8ecdf;border-radius:4px}
.guide-ceramic-note .icon{margin-top:3px;color:#53672d}
.guide-ceramic-note p{font-size:1rem;line-height:1.7;color:#596151}
.guide-ceramic-note strong{font-weight:600;color:var(--ink)}
.guide-end{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-top:30px;padding-top:27px;border-top:1px solid var(--line)}
.guide-end h3{font-size:1.55rem;line-height:1.25;letter-spacing:-.04em}
.guide-end p{font-size:.9375rem;line-height:1.65;color:#596151;margin-top:8px}
.guide-end .button{width:auto;flex:none;min-height:54px;gap:24px}
.guide-sources{font-size:.75rem;line-height:1.8;color:#626b56;margin-top:24px}
.guide-sources a{text-decoration:underline;text-underline-offset:3px;display:inline-block;padding-block:8px}
@media(max-width:800px){
 .ppf-guide-card{max-width:560px;margin-inline:auto}
 .guide-card-content>strong{font-size:clamp(2.4rem,6.6vw,3.8rem)}
 .guide-protection{gap:23px}
 .guide-protection figure>img{aspect-ratio:.85}
 .guide-finish-copy{padding:23px 20px}
 .guide-finish-copy h4{font-size:1.6rem}
 .guide-end{align-items:stretch;flex-direction:column;gap:19px}
 .guide-end .button{width:100%;max-width:380px}
}
@media(max-width:600px){
 .ppf-guide-dialog{width:calc(100% - 20px);max-height:calc(100dvh - 20px)}
 .guide-header{min-height:64px;padding:10px 18px}
 .guide-header .eyebrow{font-size:.75rem}
 .guide-body{padding:25px 20px 22px}
 .guide-opening h2{font-size:clamp(1.8rem,6.6vw,2.4rem);line-height:1.15}
 .guide-protection{grid-template-columns:1fr;gap:24px;margin-top:24px}
 .guide-protection figure>img{aspect-ratio:1.35}
 .guide-benefit-list article{padding-block:16px}
 .guide-finishes{margin-top:29px;padding-top:25px}
 .guide-finishes>h3{font-size:1.8rem}
 .guide-tabs{gap:5px}
 .guide-tabs button{font-size:.875rem;padding:11px 5px;min-height:52px}
 .guide-finish-panel{grid-template-columns:1fr}
 .guide-finish-panel img{aspect-ratio:16/10}
 .guide-finish-copy{padding:23px 21px 26px}
 .guide-finish-copy h4{font-size:1.85rem;margin-top:14px}
 .guide-coverage{grid-template-columns:1fr;gap:24px;margin-top:29px;padding-top:25px}
 .guide-coverage h3{font-size:1.65rem}
 .guide-ceramic-note{padding:18px 16px;gap:12px}
 .guide-card-label{top:19px;left:20px;font-size:.75rem}
 .guide-card-content{inset:auto 20px 19px}
 .guide-card-content>strong{font-size:clamp(2rem,7vw,3rem)}
 .guide-card-content>span:not(.guide-card-action){font-size:.875rem;margin-top:11px}
 .guide-card-action{font-size:.875rem;margin-top:12px;padding-top:12px;min-height:43px}
 .vehicle-results-label{padding:11px 12px}
 #vehicle-options [role="option"]{padding-inline:12px}
}
@media(prefers-reduced-motion:reduce){.ppf-guide-card>img{transition:none}.ppf-guide-card:hover>img{transform:none}}