@font-face {
  font-family: 'Instrument Sans';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(/vendor/fonts/instrument-sans-var-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(/vendor/fonts/ibm-plex-sans-var-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(/vendor/fonts/ibm-plex-sans-var-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/vendor/fonts/ibm-plex-mono-400-normal-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/vendor/fonts/ibm-plex-mono-600-normal-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/vendor/fonts/ibm-plex-mono-400-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/vendor/fonts/ibm-plex-mono-600-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(/vendor/fonts/manrope-var-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(/vendor/fonts/manrope-var-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400 500;
  font-display: swap;
  src: url(/vendor/fonts/jetbrains-mono-var-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400 500;
  font-display: swap;
  src: url(/vendor/fonts/jetbrains-mono-var-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: 'Onest';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(/vendor/fonts/onest-var-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Onest';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(/vendor/fonts/onest-var-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

:root {
  color-scheme: light; 
  
  --ink-900:#0E1B19;    
  --ink-700:#2A3B38;    
  --ink-500:#5B6B68;    
  --brand-800:#03453D;  
  --brand-700:#045D52;  
  --brand-600:#007A6C;  
  --brand-100:#D3EBE7;  
  --brand-50:#EEF7F5;   
  --danger-600:#B3261E; 
  --danger-50:#FBEDEC;  
  --warn-700:#8A4B00;   
  --warn-50:#FDF3E7;    
  --ok-700:#1A6B34;     
  --ok-50:#EBF5EE;      
  --star-500:#E8A33C;   
  --plate-blue:#0057B8;   
  --plate-yellow:#FFD700; 
  --bg:#FFFFFF;         
  --bg-alt:#F5F8F7;     
  --surface:#FFFFFF;    
  --line:#E3EAE8;       
  --line-strong:#6D8C87; 
  
  --warm-50:#FBF8F6;    
  --warm-100:#EDEAE6;   
  --warm-200:#E9E5E0;   
  --warm-300:#E7E3DE;   
  --warm-400:#E5E1DC;   
  
  --ctl-disabled-fg:var(--ink-500);
  --ctl-disabled-bg:var(--bg-alt);
  --ctl-disabled-border:var(--line-strong);
  --focus-ring-color:var(--brand-600); 
  
  --font-head:'Instrument Sans','IBM Plex Sans',system-ui,sans-serif;
  --font-body:'Instrument Sans','IBM Plex Sans',system-ui,sans-serif;
  --font-mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  
  --step--2:.75rem; 
  --step--1:clamp(.875rem, .85rem + .12vw, .9375rem);
  --step-0:clamp(1rem, .97rem + .15vw, 1.0625rem);
  --step-1:clamp(1.125rem, 1.07rem + .28vw, 1.25rem);
  --step-2:clamp(1.375rem, 1.28rem + .47vw, 1.625rem);
  --step-3:clamp(1.625rem, 1.45rem + .88vw, 2.125rem);
  --step-4:clamp(2rem, 1.66rem + 1.7vw, 3rem);
  --hero:clamp(2.125rem, 1.5rem + 2.5vw, 3.75rem); 
  
  --fs-200:.875rem; --fs-300:1rem; --fs-400:1.125rem; --fs-500:1.375rem;
  --fs-600:clamp(1.75rem,3vw,2.125rem); --fs-700:clamp(2rem,4.5vw,2.75rem);
  --lh-tight:1.15; --lh-body:1.6;
  --space-1:.25rem; --space-2:.5rem; --space-3:.75rem; --space-4:1rem; --space-5:1.5rem;
  --space-6:2rem; --space-7:3rem; --space-8:4rem;
  --space-section:clamp(3rem, 2rem + 5vw, 6rem);
  --space-flow:var(--space-5);
  --layout-max:72rem; --layout-narrow:46rem; --layout-wide:90rem;
  
  --space-hero-gap:4.5rem;   
  --hero-pad-inline:5rem;    
  --gutter:clamp(1rem, 1rem + 2vw, 2.5rem);
  --measure:36.5625rem; --measure-head:15rem; 

  --bp-sm:30rem; --bp-md:48rem; --bp-lg:64rem; --bp-xl:80rem; --bp-2xl:100rem;
  --header-h:64px; 
  
  --control-h-sm:2.25rem; --control-h-md:2.75rem; --control-h-lg:3.25rem;
  
  --control-h-xl:4rem;
  --control-pad-inline-sm:var(--space-3); --control-pad-inline-md:var(--space-4); --control-pad-inline-lg:var(--space-5);
  --control-gap:var(--space-3); --control-gap-min:.5rem;
  --control-radius:var(--r-ctl);
  --control-border:1px;
  --r-ctl:8px; --r-card:16px; --r-pill:999px;

  --r-field:14px; --r-case:22px; --r-chip:12px;
  --shadow-card:0 4px 16px rgb(14 27 25 / .08);
  
  --shadow-case:0 2px 4px rgb(0 0 0 / .03), 0 30px 60px -30px rgb(3 69 61 / .28);
  --lift:-2px; 
  --dur-1:160ms; --dur-2:240ms; --ease:cubic-bezier(.2,.7,.3,1);

  --f10-bg:#f5f8f7;          
  --f10-surface:#ffffff;     
  --f10-surface-2:#f7faf9;   
  --f10-brand:#0e5347;       
  --f10-brand-hover:#14705f; 
  --f10-brand-tint:#e6f1ee;  
  --f10-brand-tint-2:#f0f6f4;
  --f10-brand-soft:#b7d3cb;  
  --f10-ink:#101614;         
  --f10-muted:#5c6a64;       
  --f10-line:#e2eae7;        
  --f10-line-2:#e7edeb;      
  --f10-line-3:#dbe4e1;      
  --f10-line-4:#eef2f1;      
  --f10-line-5:#d3e4de;      
  --f10-line-6:#dbe8e3;      
  --f10-line-7:#cfe0db;      
  --f10-chip-bg:#f2f5f4;     
  --f10-edge:#c4ded6;        
  --f10-danger:#b23b3b;      
  --f10-warn-bg:#fdf9ef;     
  --f10-warn-line:#f2e0b4;   
  --f10-warn-ink:#8a6410;    
  --f10-warn-icon:#b8860b;   
  --f10-bad-bg:#fdf6f5;      
  --f10-bad-line:#f4cdca;    
  --f10-bad-ink:#a4322f;     
  --f10-good-bg:#f2f8f6;     
  
  --f10-font-sans:'Manrope',system-ui,sans-serif;
  --f10-font-mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  
  --f10-band:1200px;         
  --f10-r-lg:20px;           
  --f10-r-md:16px;           
  --f10-r-sm:12px;           
  --f10-r-pill:999px;
  
  --f10-shadow-cta:0 6px 18px rgb(14 83 71 / .14);
  
  --f10-compact-bp:719.98px;

  --f11-bg:#fafaf8;          
  --f11-surface:#ffffff;     
  --f11-surface-2:#fbfbf9;   
  --f11-surface-3:#f2f7f4;   
  --f11-surface-4:#f6f8f7;   
  --f11-brand:#0c4a3e;       
  --f11-brand-hover:#093a31; 
  --f11-brand-mid:#1f6b49;   
  --f11-brand-tint:#eef5f2;  
  --f11-brand-tint-2:#eaf3ee;
  --f11-accent:#2f8f62;      
  --f11-ink:#131417;         
  --f11-muted:#565a62;       
  --f11-meta:#6b6f76;        
  --f11-danger:#a32c22;      
  --f11-danger-bg:#fbf0ef;   
  --f11-line:#e7e7e2;        
  --f11-line-2:#efeeea;      
  --f11-line-3:#f1f0ec;      
  --f11-line-4:#e0dfd9;      
  --f11-line-5:#e3e3df;      
  --f11-line-6:#d9ded9;      
  --f11-dot-idle:#d6d5ce;    

  --f11-font-sans:'Onest',system-ui,sans-serif;
  --f11-font-mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;

  --f11-band:1280px;
  --f11-aside:396px;
  --f11-row-h:88px;          
  --f11-row-h-c:150px;       
  --f11-r-lg:20px;           
  --f11-r-md:18px;           
  --f11-r-cta:14px;
  --f11-r-chip:6px;
  --f11-r-pill:999px;

  --f11-shadow:0 2px 4px rgb(0 0 0 / .03), 0 26px 54px -34px rgb(12 74 62 / .26);
  --f11-shadow-c:0 2px 4px rgb(0 0 0 / .03), 0 20px 40px -28px rgb(12 74 62 / .26);

  --f11-compact-bp:719.98px;

  --f12-ink:#131417;         
  --f12-ink-muted:#565A62;   
  --f12-ink-faint:#6B6F76;   
  
  --f12-paper:#FAFAF8;       
  --f12-surface:#FFFFFF;     
  
  --f12-line:#E7E7E2;        
  --f12-line-soft:#EFEEEA;   
  --f12-well:#E9E9E4;        
  
  --f12-green:#0C4A3E;       
  --f12-green-ink:#093A31;   
  --f12-green-soft:#456257;  
  
  --f12-mint-50:#EEF5F2;     
  --f12-mint-100:#DFEDE6;    
  --f12-mint-200:#D5E4DD;    
  --f12-mint-400:#9BC4B1;    
  
  --f12-honey-50:#FBEFD8;    
  --f12-honey-200:#E8CB94;   
  --f12-honey-400:#C69A4B;   
  --f12-honey-ink:#7A4E08;   

  --f12-danger:#C8352A;         
  --f12-danger-ink:#A32C22;     
  --f12-danger-50:#FBF0EF;      
  --f12-danger-100:#F6D6D2;     
  --f12-danger-200:#E4B8B3;     
  
  --f12-ok:#2F8F62;             
  
  --f12-line-media:#E0DFD9;     
  --f12-line-dash:#C6C5BE;      
  --f12-scroll-ground:#ECECE7;  
  --f12-well-dark:#2A2C31;      
  --f12-hover-mint:#F5FAF8;     
  --f12-divider-mint:#EFF4F2;   
  --f12-honey-icon:#8A5A0B;     
  
  --f12-off-icon-bg:#F4F3F1;    
  --f12-off-icon-fg:#A9ADB2;    
  --f12-off-mark-bd:#DCD8D4;    
  
  --f12-chip-ink:#EFEEEA;       
  
  --f12-mint-500:#7FB29B;       
  --f12-ink-body:#2B3A34;       
  
  --f12-on-dark:rgba(238,245,242,.82);   
  --f12-on-dark-aa:rgba(255,255,255,.72);
  
  --f12-shadow-hero:0 30px 70px -40px rgba(12,74,62,.55); 
  --f12-shadow-card:0 1px 2px rgba(0,0,0,.03);            
  --f12-shadow-lift:0 18px 34px -22px rgba(12,74,62,.28); 
  
  --f12-r-6:6px;             
  --f12-r-7:7px;             
  --f12-r-8:8px;             
  --f12-r-9:9px;             
  --f12-r-10:10px;           
  --f12-r-11:11px;           
  --f12-r-12:12px;           
  --f12-r-14:14px;           
  --f12-r-16:16px;           
  --f12-r-18:18px;           
  --f12-r-20:20px;           
  --f12-r-22:22px;           
  --f12-r-pill:999px;        
  
  --f12-r-lg:var(--f12-r-22);   
  --f12-r-md:var(--f12-r-18);   
  --f12-r-sm:var(--f12-r-16);   
  --f12-r-xs:var(--f12-r-14);   
  --f12-r-chip:var(--f12-r-11); 
  
  --f12-font-sans:'Manrope', system-ui, sans-serif; 
  --f12-font-mono:var(--font-mono);                 

  --f18-chip-idle:#F0F0EC;   
  --f18-row-hover:#F4F4F1;   
  --f18-count-on-accent:#AAC0BB; 

  --f19-ink-body:#3B3F47;    
  --f19-ink-2:#464A52;       
  --f19-danger-ink:#7E2A22;  
  --f19-panel:#F3F6F4;       
  --f19-line-2:#EAE9E4;      
  --f19-line-3:#DCDBD5;      
  --f19-line-4:#E8E7E2;      
  --f19-mint-line:#CFE2DA;   
}

.index-v2,
.index-v2 *,
.index-v2 *::before,
.index-v2 *::after {
  box-sizing: border-box;
}

@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}

html {
  
  scrollbar-gutter: stable;
  -webkit-text-size-adjust: 100%; 
  text-size-adjust: 100%;
}

.index-v2 {
  margin: 0;
  padding: 0;
  min-block-size: 100dvh; 
  font-family: var(--font-body);
  font-size: var(--step-0);
  line-height: var(--lh-body);
  color: var(--ink-700);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
}

.index-v2 img,
.index-v2 svg,
.index-v2 video,
.index-v2 canvas,
.index-v2 iframe {
  max-inline-size: 100%;
  block-size: auto;
}
.index-v2 img,
.index-v2 svg,
.index-v2 video {
  display: block;
}

.index-v2 h1,
.index-v2 h2,
.index-v2 h3,
.index-v2 h4,
.index-v2 h5,
.index-v2 h6 {
  margin: 0 0 var(--space-4);
  font-family: var(--font-head);
  color: var(--ink-900);
  line-height: var(--lh-tight);
  font-weight: 700;
  text-wrap: balance;
}

.index-v2 h1 { font-size: var(--step-4); }
.index-v2 h2 { font-size: var(--step-3); }
.index-v2 h3 { font-size: var(--step-2); }
.index-v2 h4 { font-size: var(--step-1); }
.index-v2 h5 { font-size: var(--step-0); }
.index-v2 h6 { font-size: var(--step--1); }

.index-v2 p {
  margin: 0 0 var(--space-4);
  text-wrap: pretty;
}
.index-v2 p:last-child { margin-block-end: 0; } 

.u-measure-head { max-inline-size: var(--measure-head); }

.index-v2 a {
  color: var(--brand-700);
  text-decoration: none;
  transition: color var(--dur-1) var(--ease);
}

.index-v2 a:visited { color: var(--brand-700); }
@media (hover: hover) {
  .index-v2 a:hover { color: var(--brand-600); }
  
  .index-v2 .skip-link:hover { color: var(--bg); }
}

.index-v2 .skip-link:visited { color: var(--bg); }

.index-v2 ul,
.index-v2 ol { margin: 0; padding: 0; list-style: none; }

.index-v2 input,
.index-v2 button,
.index-v2 select,
.index-v2 optgroup,
.index-v2 textarea {
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}
.index-v2 button,
.index-v2 select { text-transform: none; }

.index-v2 button:focus:not(:focus-visible) { outline: 0; }

.index-v2 button {
  cursor: pointer;
}

.index-v2 [hidden] { display: none !important; }

.index-v2 iframe { border: 0; }

.l-container {
  inline-size: 100%; 
  max-inline-size: var(--layout-max);
  margin-inline: auto;
  padding-inline: max(var(--gutter), env(safe-area-inset-left), env(safe-area-inset-right));
}
.l-container--narrow { max-inline-size: var(--layout-narrow); }
.l-container--wide   { max-inline-size: var(--layout-wide); }

.l-bleed-grid {
  display: grid;
  grid-template-columns:
    [full-start] minmax(var(--gutter), 1fr)
    [content-start] min(100% - (var(--gutter) * 2), var(--layout-max)) [content-end]
    minmax(var(--gutter), 1fr) [full-end];
}
.l-bleed-grid > *          { grid-column: content; }
.l-bleed-grid > .is-bleed  { grid-column: full; }

.l-grid { display: grid; gap: var(--space-5); }
.l-grid--auto {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr));
}

.l-flex { display: flex; gap: var(--space-5); }

.l-grid > *,
.l-flex > *,
.c-field-row > * { min-inline-size: 0; }

.l-flow > * + * { margin-block-start: var(--space-flow); }

.index-v2 [id] {
  scroll-margin-block-start: calc(var(--header-h, 64px) + var(--space-4));
}

.section-v2 {
  padding-block: var(--space-section);
}

.section-v2--alt {
  background: var(--bg-alt);
}

.section-v2 + .section-v2.is-grouped {
  padding-block-start: calc(var(--space-section) / 2); 
}

@media (pointer: coarse) { :root { --control-h-sm: var(--control-h-md); } }

.c-control {
  box-sizing: border-box;
  font: inherit; 
  line-height: var(--lh-tight);
  border: var(--control-border) solid transparent;
  border-radius: var(--control-radius);
  padding-block: var(--space-2);
  transition: background var(--dur-1) var(--ease), border-color var(--dur-1) var(--ease), color var(--dur-1) var(--ease), transform var(--dur-1) var(--ease);
}
.c-control--sm { min-block-size: var(--control-h-sm); padding-inline: var(--control-pad-inline-sm); }
.c-control--md { min-block-size: var(--control-h-md); padding-inline: var(--control-pad-inline-md); }
.c-control--lg { min-block-size: var(--control-h-lg); padding-inline: var(--control-pad-inline-lg); }

.c-control--xl { min-block-size: var(--control-h-xl); padding-inline: var(--control-pad-inline-lg); }

.c-btn {
  display: inline-flex; align-items: center; justify-content: center;
  gap: var(--space-2);
  font-family: var(--font-head); font-weight: 600; text-align: center;
  cursor: pointer;
}
.c-btn--primary   { color: var(--bg); background: var(--brand-700); border-color: var(--brand-700); }
.c-btn--secondary { color: var(--brand-700); background: var(--bg); border-color: var(--line-strong); }
.c-btn--ghost     { color: var(--brand-700); background: transparent; border-color: var(--line-strong); }
@media (hover: hover) {
  .c-btn--primary:hover { color: var(--bg); background: var(--brand-800); border-color: var(--brand-800); }
  .c-btn--secondary:hover,
  .c-btn--ghost:hover { color: var(--brand-700); background: var(--brand-50); border-color: var(--brand-600); }
}

.c-btn:active { transform: translateY(1px); }

.index-v2 a.c-btn--primary,
.index-v2 a.c-btn--primary:visited { color: var(--bg); }
@media (hover: hover) {
  .index-v2 a.c-btn--primary:hover { color: var(--bg); }
}

.c-input, .c-select, .c-textarea {
  -webkit-appearance: none; appearance: none;
  font-size: max(1rem, var(--step-0));
  color: var(--ink-900);
  background-color: var(--surface);
  border-color: var(--line-strong);
}
.c-input::-webkit-search-decoration,
.c-input::-webkit-search-cancel-button,
.c-input::-webkit-inner-spin-button,
.c-input::-webkit-outer-spin-button { -webkit-appearance: none; appearance: none; }
.c-select {
  background-image: linear-gradient(45deg, transparent 49%, currentColor 51%), linear-gradient(135deg, currentColor 49%, transparent 51%);
  background-position: calc(100% - var(--space-4)) 50%, calc(100% - var(--space-2)) 50%;
  background-size: var(--space-2) var(--space-2);
  background-repeat: no-repeat;
}
.c-textarea { resize: vertical; block-size: auto; }

.c-field-row { display: flex; flex-wrap: wrap; gap: var(--control-gap); align-items: stretch; }
.c-field-row > .c-input { flex: 1 1 16rem; min-inline-size: 0; }
.c-field-row > .c-btn   { flex: 1 1 auto; }

.c-actions { display: flex; flex-wrap: wrap; gap: var(--control-gap); }
.c-actions > * { flex: 1 1 12rem; }

.c-field-error {
  min-block-size: calc(var(--step--1) * var(--lh-body));
  font-size: var(--step--1); line-height: var(--lh-body);
  color: var(--danger-600);
}

.c-input:-webkit-autofill, .c-input:-webkit-autofill:hover, .c-input:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--ink-900);
  -webkit-box-shadow: inset 0 0 0 62.5rem var(--surface);
  caret-color: var(--ink-900);
}

.c-btn:disabled,
.c-btn[aria-disabled="true"],
.c-input:disabled,
.c-select:disabled,
.c-textarea:disabled {
  color: var(--ctl-disabled-fg);
  background-color: var(--ctl-disabled-bg);
  border-color: var(--ctl-disabled-border);
  cursor: not-allowed;
}

:focus-visible {
  outline: 3px solid var(--focus-ring-color, var(--brand-600));
  outline-offset: 2px;
}

.footer-v2, .f5-cta { --focus-ring-color: var(--brand-100); }

.index-v2 ::placeholder { color: var(--ink-500); opacity: 1; }
.index-v2 input,
.index-v2 select,
.index-v2 textarea { caret-color: var(--ink-900); }
.index-v2 ::selection,
.index-v2::selection { background: var(--brand-100); color: var(--ink-900); } 

.skip-link {
  position: absolute;
  
  inset-block-start: 0;
  inset-inline-start: var(--space-4);
  transform: translateY(-120%);
  z-index: 1200;
  padding: var(--space-3) var(--space-4);
  font-family: var(--font-head);
  font-weight: 600;
  color: var(--bg);
  background: var(--brand-700);
  border-radius: 0 0 var(--r-ctl) var(--r-ctl);
  transition: transform var(--dur-2) var(--ease);
}
.skip-link:focus,
.skip-link:focus-visible {
  color: var(--bg);
  transform: translateY(0);
}

.index-v2 .sr-only-v2 {
  position: absolute !important;
  inline-size: 1px; block-size: 1px; 
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (forced-colors: active) {
  .index-v2 button,
  .index-v2 input,
  .index-v2 select,
  .index-v2 textarea,
  .index-v2 .c-control,
  .index-v2 .c-btn,
  .index-v2 .skip-link {
    border: 1px solid;
  }
}

@media print {
  .index-v2 .skip-link,
  .index-v2 .header-v2__burger,
  .index-v2 .header-v2__cta,
  .index-v2 .sticky-cta-v2 { display: none !important; } 
  .index-v2 .header-v2 { position: static; box-shadow: none; }
  
  .index-v2 .footer-v2 { background: none; color: var(--ink-700); }
  .index-v2 .footer-v2__blurb,
  .index-v2 .footer-v2__copyright { color: var(--ink-700); }
  
  .index-v2 a.footer-v2__link,
  .index-v2 a.footer-v2__link:visited { color: var(--ink-700); }
  .index-v2 .footer-v2__brand-word,
  .index-v2 .footer-v2__heading { color: var(--ink-900); }
  
  .index-v2 a.footer-v2__brand-name,
  .index-v2 a.footer-v2__brand-name:visited { color: var(--ink-900); }
  
  .index-v2 a.footer-v2__social,
  .index-v2 a.footer-v2__social:visited { color: var(--ink-700); border-color: currentColor; }
  .index-v2 .footer-v2__grid { grid-template-columns: 1fr; }
  
  .index-v2 .findings__card--danger,
  .index-v2 .findings__card--warn,
  .index-v2 .findings__badge--danger,
  .index-v2 .findings__badge--warn { border: 1px solid; }
}

.header-v2 {
  position: relative; 
  z-index: 1000;
  background: var(--bg);
  border-block-end: 1px solid var(--line);
  transition: box-shadow var(--dur-1) var(--ease);
}

.header-v2.is-stuck {
  box-shadow: var(--shadow-card);
}

.header-v2__inner {
  display: flex;
  
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  min-block-size: var(--space-8); 
}

.header-v2__brand {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
  flex-shrink: 0;
  color: var(--ink-900);
}
@media (hover: hover) and (pointer: fine) {
  .header-v2__brand:hover { color: var(--ink-900); }
}

.header-v2__logo-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  inline-size: calc(var(--space-6) + var(--space-2));
  block-size: calc(var(--space-6) + var(--space-2));
  background: var(--brand-600);
  border-radius: var(--r-ctl);
  flex-shrink: 0;
}
.header-v2__logo-chip img {
  inline-size: var(--space-5);
  block-size: var(--space-5);
}

.header-v2__wordmark {
  font-family: var(--font-head);
  font-weight: 700;
  font-size: var(--step-2);
  color: var(--ink-900);
  white-space: nowrap;
}

.header-v2__nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-4);
  flex: 1;
  justify-content: flex-end;
}

.header-v2__nav-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-4);
}

.header-v2__nav-link {
  font-family: var(--font-head);
  font-weight: 600; 
  font-size: var(--step--1);
  color: var(--ink-700);
}
@media (hover: hover) and (pointer: fine) {
  .header-v2__nav-link:hover { color: var(--brand-700); }
}

@media (min-width: 48rem) and (pointer: fine) {
  .header-v2__nav-link {
    display: inline-flex;
    align-items: center;
    padding-block: var(--space-2);
    margin-block: calc(var(--space-2) * -1);
  }
}

.header-v2__nav-aside {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-5);
}

.header-v2__cta { flex-shrink: 0; }

.header-v2__burger {
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-1);
  inline-size: var(--control-h-md); 
  block-size: var(--control-h-md);
  padding: 0;
  background: transparent;
  border: 1px solid var(--line-strong);
  border-radius: var(--r-ctl);
  flex-shrink: 0;
  transition: background var(--dur-1) var(--ease);
}
@media (hover: hover) and (pointer: fine) {
  .header-v2__burger:hover {
    background: var(--brand-50);
  }
}
.header-v2__burger:active {
  transform: translateY(1px);
}
.header-v2__burger-bar {
  display: block;
  inline-size: 50%;
  block-size: 2px;
  background: var(--ink-900);
  border-radius: var(--r-pill);
  transition: transform var(--dur-2) var(--ease),
              opacity var(--dur-1) var(--ease);
}

.header-v2__burger[aria-expanded="true"] .header-v2__burger-bar:nth-child(1) {
  transform: translateY(calc(var(--space-1) + 2px)) rotate(45deg);
}
.header-v2__burger[aria-expanded="true"] .header-v2__burger-bar:nth-child(2) {
  opacity: 0;
}
.header-v2__burger[aria-expanded="true"] .header-v2__burger-bar:nth-child(3) {
  transform: translateY(calc((var(--space-1) + 2px) * -1)) rotate(-45deg);
}

@media (max-width: 47.999rem) {
  
  .header-v2__nav {
    flex: 1 0 100%;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0;
    padding-block-end: var(--space-4);
  }

  .header-v2__nav-list {
    flex-direction: column;
    align-items: stretch;
    
    row-gap: var(--control-gap-min);
  }

  .header-v2__nav-link {
    display: block;
    padding-block: var(--space-3);
    padding-inline: var(--space-2);
    font-size: var(--step-1);
    border-block-end: 1px solid var(--line);
  }

  .header-v2__nav-aside {
    flex-direction: column;
    align-items: stretch;
    gap: var(--space-3);
    margin-block-start: var(--space-4);
  }

  .header-v2__cta { inline-size: 100%; }

  .js .header-v2__burger { display: flex; }

  .js .header-v2__nav {
    display: none;
    position: absolute;
    
    inset-block-start: var(--header-h);
    inset-inline: 0;
    
    padding-inline: max(var(--gutter), env(safe-area-inset-left), env(safe-area-inset-right));
    padding-block-start: var(--space-4);
    padding-block-end: calc(var(--space-4) + env(safe-area-inset-bottom));
    background: var(--bg);
    border-block-end: 1px solid var(--line);
    box-shadow: var(--shadow-card);
    
    max-block-size: calc(100vh - var(--header-h));
    max-block-size: calc(100svh - var(--header-h));
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .js .header-v2__nav.is-open { display: flex; }
}

@media (min-width: 64rem) {
  .header-v2 {
    position: sticky;
    inset-block-start: 0;
  }
  .header-v2__nav { gap: var(--space-6); }
  .header-v2__nav-list { gap: var(--space-5); }
}

@media (pointer: coarse) {
  .header-v2__nav-link {
    display: flex;
    align-items: center;
    min-block-size: var(--control-h-md);
  }
  
}

.hero-v2 {
  overflow: visible;
}

@media (min-width: 80rem) {
  .hero-v2 {
    max-inline-size: var(--layout-wide);
    padding-inline: var(--hero-pad-inline);
  }
}

.hero-v2__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-4); 
}

@media (min-width: 64rem) and (max-width: 79.999rem) {
  .hero-v2__grid {
    
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    gap: var(--space-6); 
    align-items: center;
  }
}

@media (min-width: 80rem) {
  .hero-v2__grid {
    
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
    
    gap: var(--space-hero-gap);
    align-items: center;
  }
}

.hero-v2__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding-block: var(--space-2); 
  padding-inline: var(--space-3) var(--space-4);
  font-family: var(--font-mono);
  font-size: var(--step--2);
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--danger-600);
  background: var(--danger-50);
  border-radius: var(--r-pill);
  
}

.hero-v2__eyebrow-dot {
  flex: 0 0 auto;
  inline-size: 0.5em;
  block-size: 0.5em;
  border-radius: var(--r-pill);
  background: currentColor;
}

.index-v2 h1.hero-v2__title {
  margin: 0 0 var(--space-4); 
  font-family: var(--font-head);
  font-weight: 700;
  font-size: var(--hero); 
  line-height: 1.03; 
  color: var(--ink-900);
  letter-spacing: -0.032em; 
}

.hero-v2__subline {
  margin-block: var(--space-4) 0;
  
  max-inline-size: 29em;
  font-family: var(--font-body);
  font-size: var(--fs-400);
  line-height: var(--lh-body);
  color: var(--ink-500);
}
.hero-v2__subline--mobile { display: block; }
.hero-v2__subline--full { display: none; }
@media (min-width: 48rem) {
  .hero-v2__subline--mobile { display: none; }
  .hero-v2__subline--full { display: block; }
}

.hero-v2__form {
  margin-block-start: var(--space-6);
}

.hero-v2__form.is-highlighted {
  border-radius: var(--r-ctl);
  
  outline: 3px solid var(--focus-ring-color, var(--brand-600));
  outline-offset: 2px;
  transition: outline-color var(--dur-2) var(--ease);
}

.hero-v2__label {
  display: block;
  margin-block-end: var(--space-2);
  
  font-family: var(--font-mono);
  font-weight: 600;
  font-size: var(--step--2);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-700);
}

.hero-v2__field-wrap {
  container-type: inline-size;
  container-name: hero-form;
}

.hero-v2__field {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: var(--space-3);
}

@media (max-width: 47.999rem) {
  .hero-v2__input,
  .hero-v2__submit {
    --control-h-xl: var(--control-h-lg);
  }
}

.hero-v2__input {
  flex: 1 1 100%; 
  min-inline-size: 0;
  
  padding-inline: var(--space-4);
  
  letter-spacing: clamp(0em, -0.15em + 0.9vw, 0.1em);
  text-transform: uppercase;
  
  border-radius: var(--r-field);
}
.hero-v2__input::placeholder {
  color: var(--ink-500); 
  text-transform: none;
  letter-spacing: normal; 
}

@media (hover: hover) and (pointer: fine) {
  .hero-v2__input:hover {
    border-color: var(--brand-600);
  }
}
.hero-v2__input[aria-invalid="true"] {
  border-color: var(--danger-600);
}

.hero-v2__submit {
  position: relative;
  flex: 1 1 100%; 
  
  min-inline-size: 18ch; 
  
  padding-inline: var(--space-6);
  font-size: var(--fs-400); 
  border-radius: var(--r-field); 
}

.hero-v2__submit-label {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
}
.hero-v2__submit.is-loading .hero-v2__submit-label {
  visibility: hidden; 
}

.hero-v2__spinner {
  display: none;
  position: absolute;
  inset: 0;
  margin: auto;
  inline-size: var(--space-4);
  block-size: var(--space-4);
  border: 2px solid var(--brand-100);
  border-block-start-color: var(--surface);
  border-radius: var(--r-pill);
  animation: hero-v2-spin calc(var(--dur-2) * 3) linear infinite;
}
.hero-v2__submit.is-loading .hero-v2__spinner {
  display: block;
}

@keyframes hero-v2-spin {
  to { transform: rotate(360deg); }
}

@container hero-form (min-inline-size: 26rem) {
  .hero-v2__input {
    flex: 1 1 auto;
    min-inline-size: 0;
  }
  .hero-v2__submit {
    flex: 0 0 auto;
  }
}

.hero-v2__error {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-1) var(--space-3);
  margin-block: var(--space-2) 0;
  min-block-size: calc(var(--step--1) * var(--lh-body));
  font-family: var(--font-body);
  font-size: var(--step--1);
  line-height: var(--lh-body);
  color: var(--danger-600);
  overflow-wrap: anywhere;
}

.hero-v2__retry {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding-block: 0;
  padding-inline: var(--space-2);
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--step--1);
  line-height: var(--lh-body);
  color: var(--brand-700);
  background: none;
  border: 0;
  border-radius: var(--r-ctl);
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}
.hero-v2__retry::before {
  content: "";
  position: absolute;
  inset-inline: 0;
  inset-block-start: 50%;
  block-size: var(--control-h-md);
  translate: 0 -50%;
}
@media (hover: hover) and (pointer: fine) {
  .hero-v2__retry:hover {
    color: var(--brand-800);
  }
}
.hero-v2__retry:active {
  transform: translateY(1px);
}

.hero-v2__free {
  display: flex;
  align-items: baseline;
  gap: var(--space-2);
  margin-block: var(--space-3) 0;
  font-family: var(--font-body);
  font-size: var(--fs-200);
  line-height: var(--lh-body);
  color: var(--ink-500);
}
.hero-v2__free .bi {
  flex: 0 0 auto;
  color: var(--brand-600);
}

.hero-v2__vin-helper {
  margin-block-start: var(--space-4);
  font-size: var(--fs-200); 
  background: var(--surface);
  border: 1px solid var(--line-strong);
  border-radius: var(--r-field);
  interpolate-size: allow-keywords; 
}

.hero-v2__vin-helper summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  list-style: none;
  min-block-size: var(--control-h-md);
  padding-block: var(--space-3);
  padding-inline: var(--space-4);
  font-weight: 600;
  color: var(--brand-700);
  border-start-start-radius: var(--r-field);
  border-start-end-radius: var(--r-field);
  cursor: pointer;
}
.hero-v2__vin-helper summary::-webkit-details-marker { display: none; }
.hero-v2__vin-helper summary::marker { content: ""; }
@media (hover: hover) and (pointer: fine) {
  .hero-v2__vin-helper summary:hover {
    color: var(--brand-800);
    background-color: var(--bg-alt);
  }
}
.hero-v2__vin-helper summary:active { transform: translateY(1px); }

.hero-v2__vin-helper-marker {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  inline-size: var(--space-5);
  block-size: var(--space-5);
  font-size: var(--step--1);
  line-height: 1;
  color: var(--brand-700);
  background: var(--brand-50);
  border-radius: var(--r-pill);
  transition: transform var(--dur-1) var(--ease);
}
.hero-v2__vin-helper[open] .hero-v2__vin-helper-marker {
  transform: rotate(45deg);
}

.hero-v2__vin-helper ul {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-4);
  margin: 0;
  padding-block: var(--space-1) var(--space-4);
  padding-inline: var(--space-4);
  list-style: none;
  background: var(--bg-alt);
  border-block-start: 1px solid var(--warm-100); 
}
@media (min-width: 64rem) {
  .hero-v2__vin-helper ul {
    grid-template-columns: 1fr 1fr;
    column-gap: var(--space-5);
  }
}
.hero-v2__vin-helper li {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  padding-block-start: var(--space-3);
}
.hero-v2__vin-helper-where { 
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--fs-200);
  color: var(--ink-900);
}
.hero-v2__vin-helper-how { 
  font-family: var(--font-mono);
  font-size: var(--step--2);
  line-height: var(--lh-body);
  color: var(--ink-500);
}

.hero-v2__vin-helper::details-content {
  block-size: 0;
  overflow-y: clip;
  transition: block-size var(--dur-2) var(--ease);
}
.hero-v2__vin-helper[open]::details-content {
  block-size: auto;
}

.hero-v2__stats {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2) 0;
  margin-block: var(--space-6) 0;
  padding: 0;
  list-style: none;
}

.hero-v2__stat {
  display: inline-flex;
  align-items: baseline;
  gap: var(--space-1);
  padding-inline-end: var(--space-4);
}
.hero-v2__stat:not(:first-child) { 
  padding-inline-start: var(--space-4);
  border-inline-start: 1px solid var(--warm-400);
}
.hero-v2__stat-value {
  font-family: var(--font-mono);
  font-weight: 600;
  font-size: var(--fs-400);
  letter-spacing: -0.02em; 
  color: var(--ink-900);
}
.hero-v2__stat-label {
  font-family: var(--font-body);
  font-size: var(--fs-200);
  color: var(--ink-500);
}

@media (min-width: 64rem) {
  .hero-v2__stat {
    padding-inline-end: var(--space-1);
  }
  .hero-v2__stat:not(:first-child) {
    padding-inline-start: var(--space-1);
  }
  .hero-v2__stat:last-child {
    padding-inline-end: 0;
  }
  .hero-v2__stat-label {
    font-size: var(--step--2);
  }
}

.hero-v2__counter {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin-block: var(--space-4) 0;
  min-block-size: calc(var(--step--1) * var(--lh-body));
  font-family: var(--font-body);
  font-size: var(--fs-200);
  color: var(--ink-700);
  visibility: hidden;
  opacity: 0;
  transition: opacity var(--dur-2) var(--ease);
}
.hero-v2__counter.is-visible {
  visibility: visible;
  opacity: 1;
}
.hero-v2__counter-icon {
  flex: 0 0 auto;
  color: var(--brand-600);
}
.hero-v2__counter-text {
  font-weight: 600;
}

.hero-v2__demo-wrap {
  position: relative;
}

.hero-v2__demo {
  position: relative;
  margin: 0;
  
  padding: 22px; 
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-case);
  box-shadow: var(--shadow-case);
}

.hero-v2__demo-head {
  display: flex;
  flex-wrap: wrap;
  align-items: start;
  gap: var(--space-2) var(--space-3);
}
.hero-v2__demo-eyebrow {
  flex: 1 1 100%;
  
  font-family: var(--font-mono);
  font-weight: 600;
  font-size: var(--step--2);
  letter-spacing: 0.16em; 
  text-transform: uppercase;
  color: var(--ink-500);
}
.hero-v2__demo-id {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: var(--space-1);
  min-inline-size: 0;
  overflow-wrap: anywhere; 
}
.hero-v2__demo-car {
  font-family: var(--font-head);
  font-weight: 700;
  font-size: var(--fs-400);
  color: var(--ink-900);
}
.hero-v2__demo-vin {
  
  font-family: var(--font-mono);
  font-size: var(--step--2);
  color: var(--ink-500);
}

.hero-v2__badge {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: var(--space-1);
  margin-inline-start: auto;
  padding-block: var(--space-2); 
  padding-inline: var(--space-3);
  font-family: var(--font-head);
  font-weight: 600;
  font-size: var(--step--2);
  border-radius: var(--r-pill);
  white-space: nowrap;
}
.hero-v2__badge--danger {
  color: var(--danger-600);
  background: var(--danger-50);
  border: 1px solid var(--danger-600);
}

.hero-v2__tabs { 
  display: none;
  flex-wrap: wrap; 
  gap: var(--space-1);
  
  margin-block: 18px 16px; 
  padding: 5px; 
  background: var(--bg-alt);
  border: 1px solid var(--line);
  border-radius: var(--r-pill);
}

.js .hero-v2__tabs { 
  display: flex;
}

.index-v2 button.hero-v2__tab { 
  display: inline-flex;
  
  flex: 1 1 0;
  min-inline-size: 0;
  align-items: center;
  justify-content: center;
  
  min-block-size: var(--control-h-sm);
  margin: 0; 
  
  padding-block: 13px; 
  padding-inline: 10px; 
  font-family: var(--font-head);
  font-weight: 600;
  font-size: 15.5px; 
  
  line-height: 16px; 
  letter-spacing: -0.01em; 
  color: var(--ink-500);
  background: none;
  border: var(--control-border) solid transparent;
  border-radius: var(--r-pill);
  cursor: pointer;
  transition: color var(--dur-1) var(--ease),
              background-color var(--dur-1) var(--ease),
              border-color var(--dur-1) var(--ease);
}

.index-v2 button.hero-v2__tab[aria-selected="true"] {
  color: var(--brand-700);
  background: var(--surface);
  border-color: var(--brand-600); 
}

@media (hover: hover) and (pointer: fine) {
  .index-v2 button.hero-v2__tab:not([aria-selected="true"]):hover {
    color: var(--brand-700);
    background-color: var(--brand-50);
  }
}

.hero-v2__tab-label--wide {
  display: none;
}
.hero-v2__tab-label--narrow {
  display: block;
}
@media (min-width: 48rem) {
  .hero-v2__tab-label--wide {
    display: block;
  }
  .hero-v2__tab-label--narrow {
    display: none;
  }
}

.hero-v2__panels {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}

.hero-v2__panel {
  grid-area: 1 / 1; 
  min-inline-size: 0;
}

.index-v2 .hero-v2__panel[hidden] {
  
  display: block !important;
  visibility: hidden;
}

.index-v2 svg.hero-v2__odo-chart {
  display: block;
  inline-size: 100%;
  max-inline-size: calc(var(--layout-narrow) / 2);
  block-size: auto;
  margin-inline: auto;
}

@media (min-width: 80rem) {
  .index-v2 svg.hero-v2__odo-chart {
    max-inline-size: none;
  }
}

.hero-v2__odo-grid { 
  fill: none;
  stroke: var(--line); 
  stroke-width: 1;
  shape-rendering: crispEdges;
}

.hero-v2__odo-axis { 
  fill: none;
  stroke: var(--line-strong);
  stroke-width: 1;
  shape-rendering: crispEdges;
}

.hero-v2__odo-label { 
  fill: var(--ink-500);
  font-family: var(--font-body);
}

.hero-v2__odo-hatch { 
  stroke: var(--danger-600);
  stroke-width: 1;
}
.hero-v2__odo-wedge {
  stroke: none;
}

.hero-v2__odo-line {
  fill: none;
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.hero-v2__odo-line--real { 
  stroke: var(--ok-700);
}

.hero-v2__odo-line--fake { 
  stroke: var(--danger-600);
  stroke-dasharray: 5 4;
}

.hero-v2__odo-mark { 
  fill: none;
  stroke: var(--warn-700);
  stroke-width: 1;
  stroke-dasharray: 2 2;
}

.hero-v2__odo-crash { 
  fill: var(--warn-700);
}

.hero-v2__odo-cap--real { 
  fill: var(--ok-700);
}
.hero-v2__odo-cap--fake { 
  fill: none;
  stroke: var(--danger-600);
  stroke-width: 1.8;
}
.hero-v2__odo-gap { 
  fill: none;
  stroke: var(--ink-500); 
  stroke-width: 1;
  stroke-dasharray: 3 2;
}

.hero-v2__odo-delta-num { 
  fill: var(--danger-600);
  font-family: var(--font-head);
  font-weight: 700;
}

.hero-v2__odo-legend {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2) var(--space-4);
  margin-block: var(--space-4) 0;
  padding: 0;
  list-style: none;
}
.hero-v2__odo-key { 
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-family: var(--font-body);
  font-size: var(--step--2);
  line-height: 1.3;
  color: var(--ink-700);
}

.hero-v2__odo-key--real::before,
.hero-v2__odo-key--fake::before {
  content: "";
  flex: 0 0 auto;
  inline-size: var(--space-4);
  block-size: var(--space-1);
  border-radius: var(--r-pill);
}
.hero-v2__odo-key--real::before {
  background: var(--ok-700);
}
.hero-v2__odo-key--fake::before {
  background: repeating-linear-gradient(90deg, var(--danger-600) 0 var(--space-1), transparent var(--space-1) var(--space-2));
  border-radius: 0;
}

.hero-v2__odo-key--crash svg.icon { 
  flex: 0 0 auto;
  color: var(--warn-700);
}

.hero-v2__odo-delta {
  margin-block: var(--space-3) 0;
}

.hero-v2__odo-note { 
  margin-block: var(--space-3) 0;
  font-family: var(--font-body);
  font-size: var(--step--2);
  line-height: var(--lh-body);
  color: var(--ink-500);
}

.hero-v2__compare {
  --pos: 75%; 
  position: relative;
  margin-block-start: var(--space-5);
  inline-size: 100%;
  max-inline-size: calc(var(--layout-narrow) / 2); 
  margin-inline: auto;
  aspect-ratio: 640 / 400; 
  background: var(--bg-alt);
  border: 1px solid var(--line);
  border-radius: var(--r-ctl);
  
}

@media (min-width: 80rem) {
  .hero-v2__compare {
    max-inline-size: none;
  }
}

.hero-v2__compare-media {
  position: absolute;
  inset: 0;
  overflow: hidden;
  border-radius: inherit;
}

.hero-v2__compare-img {
  position: absolute;
  inset: 0;
  display: block;
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
  user-select: none;
  -webkit-user-drag: none;
  pointer-events: none;
}

.hero-v2__compare-img--before {
  clip-path: inset(0 calc(100% - var(--pos)) 0 0);
}

.hero-v2__compare-chip {
  position: absolute;
  inset-block-start: var(--space-3);
  z-index: 2;
  display: inline-flex;
  align-items: center;
  max-inline-size: calc(50% - var(--space-3));
  padding-block: var(--space-1);
  padding-inline: var(--space-2);
  font-family: var(--font-head);
  font-weight: 600;
  font-size: var(--step--2);
  line-height: 1.2;
  border-radius: var(--r-pill);
  pointer-events: none;
}
.hero-v2__compare-chip--before {
  inset-inline-start: var(--space-3);
  color: var(--danger-600);
  background: var(--danger-50);
  border: 1px solid var(--danger-600);
}
.hero-v2__compare-chip--after {
  inset-inline-end: var(--space-3);
  color: var(--ok-700);
  background: var(--ok-50);
  border: 1px solid var(--ok-700);
}

.hero-v2__compare-divider {
  position: absolute;
  inset-block: 0;
  inset-inline-start: var(--pos);
  z-index: 3;
  inline-size: 1px;
  margin-inline-start: -1px;
  background: var(--surface);
}
.hero-v2__compare-handle {
  position: absolute;
  inset-block-start: 50%;
  inset-inline-start: var(--pos);
  z-index: 4;
  display: flex;
  align-items: center;
  justify-content: center;
  
  inline-size: var(--control-h-sm);
  block-size: var(--control-h-sm);
  transform: translate(-50%, -50%);
  color: var(--brand-700);
  background: var(--surface);
  border: 1px solid var(--brand-600);
  border-radius: var(--r-pill);
  box-shadow: var(--shadow-card);
  transition: box-shadow var(--dur-1) var(--ease),
              border-color var(--dur-1) var(--ease);
  pointer-events: none;
}
.hero-v2__compare-handle .bi {
  font-size: var(--step--2);
  line-height: 1;
}

.hero-v2__compare-range {
  position: absolute;
  inset: 0;
  z-index: 5;
  inline-size: 100%;
  block-size: 100%;
  margin: 0;
  padding: 0;
  background: transparent;
  opacity: 0;
  cursor: ew-resize;
  -webkit-appearance: none;
  appearance: none;
  touch-action: pan-y;
}
.hero-v2__compare-range:focus { outline: none; }
.hero-v2__compare-range::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  inline-size: var(--control-h-md);
  block-size: var(--control-h-md);
}
.hero-v2__compare-range::-moz-range-thumb {
  inline-size: var(--control-h-md);
  block-size: var(--control-h-md);
  border: 0;
  background: transparent;
}
.hero-v2__compare-range::-moz-range-track { background: transparent; }

.hero-v2__compare:has(.hero-v2__compare-range:focus-visible) .hero-v2__compare-handle {
  
  outline: 3px solid var(--focus-ring-color, var(--brand-600));
  outline-offset: 2px;
  border-color: var(--brand-700);
}

.hero-v2__compare.is-nudging .hero-v2__compare-handle,
.hero-v2__compare.is-nudging .hero-v2__compare-divider {
  animation: hero-v2-nudge calc(var(--dur-2) * 3) var(--ease) 1;
}
@keyframes hero-v2-nudge {
  0%, 100% { translate: 0 0; }
  30%      { translate: var(--space-2) 0; }
  70%      { translate: calc(var(--space-2) * -1) 0; }
}

.hero-v2__compare-hint {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  margin-block: var(--space-3) 0;
  font-family: var(--font-body);
  font-size: var(--step--2);
  color: var(--ink-500);
}
.hero-v2__compare-hint .bi { color: var(--brand-600); }

.hero-v2__tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin-block: var(--space-5) 0;
  padding: 0;
  list-style: none;
}
.hero-v2__pill {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  padding-block: var(--space-1);
  padding-inline: var(--space-3);
  font-family: var(--font-head);
  font-weight: 600;
  font-size: var(--step--2);
  line-height: 1.3;
  border-radius: var(--r-pill);
}
.hero-v2__pill .bi {
  flex: 0 0 auto;
  font-size: 1em;
}
.hero-v2__pill--danger {
  color: var(--danger-600);
  background: var(--danger-50);
  border: 1px solid var(--danger-600);
}
.hero-v2__pill--warn {
  color: var(--warn-700);
  background: var(--warn-50);
  border: 1px solid var(--warn-700);
}
.hero-v2__pill--brand {
  color: var(--brand-700);
  background: var(--brand-100);
  border: 1px solid var(--brand-600);
}

.hero-v2__compare-punch {
  margin-block: 18px 0; 
  padding-block-start: 16px; 
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 15px; 
  line-height: var(--lh-body);
  color: var(--ink-900);
}

@media (prefers-reduced-motion: reduce) {
  
  .hero-v2__spinner,
  .hero-v2__counter,
  .hero-v2__compare-handle,
  .hero-v2__compare-divider,
  .hero-v2__tab,
  .hero-v2__vin-helper-marker {
    
    animation: none !important;
    transition: none !important;
  }
  
  .hero-v2__vin-helper::details-content {
    
    transition: none !important;
  }
}

.hero-v2__compare-img {
  
  object-position: 50% 0%;
}
.hero-v2__compare-img--before {
  clip-path: inset(0 0 0 var(--pos));
}

.hero-v2__compare {
  border-radius: var(--r-card);
}
.hero-v2__compare-divider {
  inline-size: 2px; 
  background: var(--brand-800); 
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--surface), transparent 65%); 
}
.hero-v2__compare-handle {
  box-shadow: 0 6px 18px color-mix(in srgb, var(--brand-800), transparent 60%); 
}
.hero-v2__compare-handle .bi {
  font-size: 14px; 
}

.hero-v2__compare-chip {
  transition: opacity var(--dur-1) var(--ease);
  inset-block-start: 14px; 
  padding-block: 6px; 
  padding-inline: 12px; 
  font-family: var(--font-mono);
  font-size: 11px; 
}
.hero-v2__compare-chip--after {
  inset-inline-start: 14px; 
  inset-inline-end: auto;
}
.hero-v2__compare-chip--before {
  inset-inline-start: auto;
  inset-inline-end: 14px; 
}

.hero-v2__compare-chip[data-shown="false"] {
  opacity: 0;
}

.hero-v2__compare-markers {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
}

.hero-v2__compare-marker {
  --f8-marker-r: calc(var(--space-4) / 2); 
  position: absolute;
  inset-inline-start: calc(var(--f8-x) - var(--f8-marker-r));
  inset-block-start: calc(var(--f8-y) - var(--f8-marker-r));
  display: flex;
  align-items: center;
  justify-content: center;
  inline-size: calc(var(--f8-marker-r) * 2);
  block-size: calc(var(--f8-marker-r) * 2);
  font-family: var(--font-mono);
  line-height: 1;
  border-radius: var(--r-pill);
  opacity: 0;
  transition: opacity var(--dur-1) var(--ease), box-shadow var(--dur-1) var(--ease);
}
.hero-v2__compare-marker[data-shown="true"] {
  opacity: 1;
}

.hero-v2__compare-marker--damage {
  --f8-marker-r: 10px; 
  font-size: 11px; 
  color: var(--danger-600);
  background: var(--danger-50);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--danger-600), transparent 86%); 
}

.hero-v2__compare-marker--ok {
  --f8-marker-r: 9.5px; 
  font-size: 10px; 
  color: var(--ok-700);
  background: var(--ok-50);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ok-700), transparent 78%); 
}

.hero-v2__compare-marker--damage[data-active="true"] {
  box-shadow: 0 0 0 6px color-mix(in srgb, var(--danger-600), transparent 78%); 
}
.hero-v2__compare-marker--ok[data-active="true"] {
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--ok-700), transparent 78%); 
}

.hero-v2__compare-caption {
  position: absolute;
  inset-inline: var(--space-3);
  inset-block-end: var(--space-3);
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  column-gap: var(--space-2);
  padding-block: var(--space-2);
  padding-inline: var(--space-3);
  background: var(--ink-900);
  border-radius: var(--r-chip);
  opacity: 0;
  transition: opacity var(--dur-1) var(--ease);
}
.hero-v2__compare-caption[data-shown="true"] {
  opacity: 1;
}

.hero-v2__compare-caption-badge {
  grid-row: 1 / span 2;
  display: flex;
  align-items: center;
  justify-content: center;
  inline-size: 22px; 
  block-size: 22px; 
  font-family: var(--font-mono);
  font-size: 11px; 
  line-height: 1;
  border-radius: var(--r-pill);
}
.hero-v2__compare-caption[data-kind="damage"] .hero-v2__compare-caption-badge {
  color: var(--danger-600);
  background: var(--danger-50);
}
.hero-v2__compare-caption[data-kind="ok"] .hero-v2__compare-caption-badge {
  color: var(--ok-700);
  background: var(--ok-50);
}

.hero-v2__compare-caption[data-kind="damage"] .hero-v2__compare-caption-badge .icon {
  display: none;
}
.hero-v2__compare-caption[data-kind="ok"] .hero-v2__compare-caption-num {
  display: none;
}

.hero-v2__compare-caption-title { 
  min-inline-size: 0;
  font-family: var(--font-head);
  font-weight: 600;
  font-size: 14px; 
  line-height: 1.25;
  color: var(--bg);
}
.hero-v2__compare-caption-sub { 
  min-inline-size: 0;
  font-family: var(--font-mono);
  font-size: 11.5px; 
  line-height: 1.35;
  color: var(--brand-100);
}

.hero-v2__compare-hint {
  justify-content: space-between;
  gap: var(--space-2) var(--space-3);
  margin-block-start: 14px; 
  font-family: var(--font-mono);
  font-size: 12.5px; 
}
.hero-v2__compare-drag { 
  min-inline-size: 0;
  color: var(--brand-800);
}
.hero-v2__compare-count { 
  min-inline-size: 0;
  color: var(--ok-700);
}
.hero-v2__compare-count[data-alarm="true"] { 
  color: var(--danger-600);
}

@media (min-width: 48rem) {
  .hero-v2__compare-count {
    margin-inline-start: auto;
  }
}

.hero-v2__compare-alt--wide {
  display: none;
}
.hero-v2__compare-alt--narrow {
  display: inline;
}
@media (min-width: 48rem) {
  .hero-v2__compare-alt--wide {
    display: inline;
  }
  .hero-v2__compare-alt--narrow {
    display: none;
  }
}

.hero-v2__compare-notes {
  --f8-note-dim: .65;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-4);
  margin-block-start: 14px; 
  padding-block-start: 14px; 
  border-block-start: 1px solid var(--warm-100); 
}
.hero-v2__compare-col {
  min-inline-size: 0;
}
.hero-v2__compare-col--found {
  padding-block-start: 14px; 
  border-block-start: 1px solid var(--warm-100); 
}
@media (min-width: 48rem) {
  .hero-v2__compare-notes {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: var(--space-5);
  }
  .hero-v2__compare-col--found {
    padding-block-start: 0;
    border-block-start: 0;
    padding-inline-start: var(--space-5);
    border-inline-start: 1px solid var(--warm-100); 
  }
}

.hero-v2__compare-col-head {
  margin: 0 0 var(--space-3);
  font-family: var(--font-mono);
  font-size: 10.5px; 
  line-height: 1.2;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.hero-v2__compare-col-head--ok { 
  color: var(--ok-700);
}
.hero-v2__compare-col-head--found { 
  color: var(--danger-600);
}

.hero-v2__compare-list {
  display: flex;
  flex-direction: column;
  gap: 9px; 
  margin: 0;
  padding: 0;
  list-style: none;
}

.hero-v2__compare-note {
  display: flex;
  align-items: flex-start;
  gap: var(--space-2);
  opacity: var(--f8-note-dim);
  transition: opacity var(--dur-2) var(--ease);
}
.hero-v2__compare-note[data-shown="true"] {
  opacity: 1;
}

.hero-v2__compare-note-badge {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  inline-size: 15px; 
  block-size: 15px; 
  margin-block-start: var(--space-1);
  font-family: var(--font-mono);
  font-size: var(--step--2);
  line-height: 1;
  border-radius: var(--r-pill);
  transition: color var(--dur-2) var(--ease);
}
.hero-v2__compare-note--ok .hero-v2__compare-note-badge {
  color: var(--ok-700);
  background: var(--ok-50);
}
.hero-v2__compare-note--damage .hero-v2__compare-note-badge {
  color: var(--danger-600);
  background: var(--danger-50);
}

.hero-v2__compare-note:not([data-shown="true"]) .hero-v2__compare-note-badge {
  color: var(--ink-900);
}

.hero-v2__compare-note-body {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  min-inline-size: 0;
}
.hero-v2__compare-note-title { 
  font-family: var(--font-head);
  font-weight: 600;
  font-size: 13.5px; 
  line-height: 1.25;
  color: var(--ink-900);
}
.hero-v2__compare-note-sub { 
  font-family: var(--font-mono);
  font-size: 11.5px; 
  line-height: 1.35;
  color: var(--ink-900);
}

@media (prefers-reduced-motion: reduce) {
  .hero-v2__compare-chip,
  .hero-v2__compare-marker,
  .hero-v2__compare-caption,
  .hero-v2__compare-note,
  .hero-v2__compare-note-badge {
    transition: none;
  }
}

.hero-v2__panel--odo {
  --odo-area-o: .14;   
  --odo-hatch-o: .45;  
  --odo-thresh-o: .6;  
  --odo-dim-o: .62;    
}

.hero-v2__odo-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 22px; 
  padding-inline: 2px;
  padding-block-end: var(--space-4);
}
.hero-v2__odo-figures {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--space-3);
  min-inline-size: 0;
}
.hero-v2__odo-figure {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.hero-v2__odo-figure-label { 
  font-family: var(--font-mono);
  font-size: 10.5px; 
  letter-spacing: .14em; 
  text-transform: uppercase;
  color: var(--ink-500);
}
.hero-v2__odo-figure--real .hero-v2__odo-figure-label { 
  color: var(--danger-600);
}

.hero-v2__odo-figure-value { 
  font-family: var(--font-mono);
  font-size: 25px; 
  font-weight: 600;
  letter-spacing: -.02em; 
  color: var(--ink-500);
}
.hero-v2__odo-figure-value--strike {
  text-decoration: line-through;
  text-decoration-thickness: 1px;
}
.hero-v2__odo-figure--real .hero-v2__odo-figure-value { 
  color: var(--danger-600);
}
.hero-v2__odo-reveal {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
}

.hero-v2__odo-figure-arrow { 
  flex: 0 0 auto;
  font-size: 19px; 
  color: var(--ink-500);
  padding-block-end: 4px;
}

.hero-v2__odo-status {
  margin-inline-start: auto;
  padding-block: var(--space-2);
  padding-inline: 14px; 
  font-family: var(--font-mono); 
  font-size: var(--step--2);
}

.hero-v2__odo-status--clean { 
  color: var(--ok-700);
  background: var(--ok-50);
  border: 1px solid var(--ok-700);
}

.hero-v2__odo-chart-wrap {
  position: relative;
  border: 1px solid var(--line);
  
  border-radius: var(--r-card);
  background: var(--surface);
  overflow: hidden;
  margin-inline: auto;
}

@media (max-width: 79.999rem) {
  .hero-v2__odo-chart-wrap {
    max-inline-size: calc(var(--layout-narrow) / 2);
  }
}
svg.hero-v2__odo-chart { display: block; }

.hero-v2__odo-grid { 
  fill: none;
  stroke: var(--line);
  stroke-width: 1;
  shape-rendering: crispEdges;
}
.hero-v2__odo-axis { 
  fill: none;
  stroke: var(--line-strong);
  stroke-width: 1;
  shape-rendering: crispEdges;
}
.hero-v2__odo-label { 
  fill: var(--ink-500);
  font-family: var(--font-mono);
}

.hero-v2__odo-area { 
  stroke: none;
  fill-opacity: var(--odo-area-o);
}
.hero-v2__odo-area--doc { fill: var(--ok-700); } 
.hero-v2__odo-area--real { fill: var(--danger-600); } 

.hero-v2__odo-line {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.hero-v2__odo-line--fake { 
  stroke: var(--ok-700);
  stroke-width: 2.5;
  
  stroke-dasharray: none;
}
.hero-v2__odo-line--real { 
  stroke: var(--danger-600);
  stroke-width: 3;
}
.hero-v2__odo-erase { 
  fill: var(--surface);
  stroke: none;
}
.hero-v2__odo-echo { 
  fill: none;
  stroke: var(--ink-500);
  stroke-width: 2;
  stroke-dasharray: 6 4;
}
.hero-v2__odo-hatch-line { 
  stroke: var(--danger-600);
  stroke-width: 1;
  stroke-opacity: var(--odo-hatch-o);
}
.hero-v2__odo-hatch-fill { stroke: none; }
.hero-v2__odo-thresh { 
  fill: none;
  stroke: var(--danger-600);
  stroke-width: 1;
  stroke-dasharray: 3 3;
  stroke-opacity: var(--odo-thresh-o);
}

.hero-v2__odo-dot { 
  fill: var(--surface);
  stroke-width: 1.6;
}
.hero-v2__odo-dot--doc { stroke: var(--ok-700); } 
.hero-v2__odo-dot--real { stroke: var(--danger-600); } 

.hero-v2__odo-diamond--service { fill: var(--ok-700); } 
.hero-v2__odo-diamond--critical { fill: var(--danger-600); } 

.hero-v2__odo-wedge-note {
  opacity: 0;
  transition: opacity var(--dur-1) var(--ease);
}
.hero-v2__odo-wedge-note.is-shown { opacity: 1; }
.hero-v2__odo-wedge-bg { fill: var(--surface); } 
.hero-v2__odo-wedge-text { 
  fill: var(--danger-600);
  font-family: var(--font-mono);
  font-weight: 600;
}

.hero-v2__odo-divider {
  position: absolute;
  inset-block: 0;
  inset-inline-start: var(--odo-pos);
  z-index: 3;
  inline-size: 2px; 
  margin-inline-start: -1px;
  background: var(--brand-800); 
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--surface), transparent 65%); 
  pointer-events: none;
}

.hero-v2__odo-handle {
  position: absolute;
  inset-block-start: 50%;
  inset-inline-start: var(--odo-pos);
  z-index: 4;
  display: flex;
  align-items: center;
  justify-content: center;
  inline-size: var(--control-h-sm);
  block-size: var(--control-h-sm);
  transform: translate(-50%, -50%);
  color: var(--brand-700);
  background: var(--surface);
  border: 1px solid var(--brand-600);
  border-radius: var(--r-pill);
  box-shadow: 0 6px 18px color-mix(in srgb, var(--brand-800), transparent 65%); 
  transition: box-shadow var(--dur-1) var(--ease), border-color var(--dur-1) var(--ease);
  pointer-events: none;
}
.hero-v2__odo-handle .icon { font-size: 14px; } 

.hero-v2__odo-range {
  position: absolute;
  inset: 0;
  z-index: 5;
  inline-size: 100%;
  block-size: 100%;
  margin: 0;
  padding: 0;
  background: transparent;
  opacity: 0;
  cursor: ew-resize;
  -webkit-appearance: none;
  appearance: none;
  touch-action: pan-y;
}

.hero-v2__odo-range:focus { outline: none; }
.hero-v2__odo-range::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  inline-size: var(--control-h-md);
  block-size: var(--control-h-md);
}
.hero-v2__odo-range::-moz-range-thumb {
  inline-size: var(--control-h-md);
  block-size: var(--control-h-md);
  border: 0;
  background: transparent;
}
.hero-v2__odo-range::-moz-range-track { background: transparent; }

.hero-v2__odo-chart-wrap:has(.hero-v2__odo-range:focus-visible) .hero-v2__odo-handle {
  outline: 3px solid var(--focus-ring-color, var(--brand-600));
  outline-offset: 2px;
  border-color: var(--brand-700);
}

.hero-v2__odo-legend {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2) 22px; 
  margin-block: var(--space-3) 0; 
  padding: 0;
  list-style: none;
}
.hero-v2__odo-key { 
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-family: var(--font-mono);
  font-size: 11.5px; 
  line-height: 1.3;
  color: var(--ink-700);
}

.hero-v2__odo-key--doc::before,
.hero-v2__odo-key--real::before {
  content: "";
  flex: 0 0 auto;
  inline-size: 20px; 
  block-size: 3px;
  border-radius: 2px; 
}
.hero-v2__odo-key--doc::before { background: var(--ok-700); }
.hero-v2__odo-key--real::before { background: var(--danger-600); }
.hero-v2__odo-key--service::before,
.hero-v2__odo-key--critical::before {
  content: "";
  flex: 0 0 auto;
  inline-size: 9px;
  block-size: 9px;
  transform: rotate(45deg);
}
.hero-v2__odo-key--service::before {
  background: var(--ok-700);
  border-radius: 1px;
}
.hero-v2__odo-key--critical::before { background: var(--danger-600); }

.hero-v2__odo-records {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-5);
  
  margin-block-start: 14px; 
  padding-block-start: 14px; 
  border-block-start: 1px solid var(--warm-100);
}
.hero-v2__odo-col {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  min-inline-size: 0;
}
.hero-v2__odo-col--critical {
  border-inline-start: 1px solid var(--warm-100);
  padding-inline-start: var(--space-5);
}

.hero-v2__odo-col-title { 
  font-family: var(--font-mono);
  font-size: 10.5px; 
  letter-spacing: .14em; 
  text-transform: uppercase;
}
.hero-v2__odo-col--service .hero-v2__odo-col-title { color: var(--ok-700); } 
.hero-v2__odo-col--critical .hero-v2__odo-col-title { color: var(--danger-600); } 

.hero-v2__odo-col ul {
  display: flex;
  flex-direction: column;
  gap: 9px; 
  margin: 0;
  padding: 0;
  list-style: none;
}
.hero-v2__odo-record {
  display: flex;
  align-items: flex-start;
  gap: var(--space-2);
  opacity: var(--odo-dim-o);
  transition: opacity var(--dur-1) var(--ease);
}
.hero-v2__odo-record.is-shown { opacity: 1; }

.hero-v2__odo-record-year { 
  flex: 0 0 auto;
  font-family: var(--font-mono);
  font-size: 11px; 
  color: var(--ink-900);
  border-radius: 5px;
  padding-block: 3px; 
  padding-inline: 7px; 
  transition: color var(--dur-1) var(--ease), background-color var(--dur-1) var(--ease);
}
.hero-v2__odo-record.is-shown.hero-v2__odo-record--service .hero-v2__odo-record-year { 
  color: var(--ok-700);
  background: var(--ok-50);
}
.hero-v2__odo-record.is-shown.hero-v2__odo-record--critical .hero-v2__odo-record-year { 
  color: var(--danger-600);
  background: var(--danger-50);
}

.hero-v2__odo-record-text { 
  font-family: var(--font-body);
  font-size: 13px; 
  line-height: 1.4; 
  color: var(--ink-900);
}

.hero-v2__odo-drag-hint { 
  margin-block-start: 14px; 
  font-family: var(--font-mono);
  font-size: 12.5px; 
  color: var(--brand-800); 
}

@media (max-width: 29.999rem) {
  .hero-v2__odo-records {
    grid-template-columns: 1fr;
  }
  .hero-v2__odo-col--critical {
    border-inline-start: none;
    padding-inline-start: 0;
    border-block-start: 1px solid var(--warm-100);
    padding-block-start: var(--space-4);
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-v2__odo-record,
  .hero-v2__odo-record-year,
  .hero-v2__odo-wedge-note,
  .hero-v2__odo-handle {
    
    transition: none !important;
  }
}

.f2-ticker {
  background: var(--warn-50);
  border-block: 1px solid var(--line);
  
  transition: background-color var(--dur-1) var(--ease);
}

.f2-ticker__link {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  inline-size: 100%; 
  
  max-inline-size: 1200px; 
  margin-inline: auto;
  
  min-block-size: var(--control-h-md);
  padding: var(--space-2) var(--space-4);
  color: var(--ink-700);
  transition: transform var(--dur-1) var(--ease);
}

.f2-ticker__link:active {
  transform: translateY(1px);
}

.f2-ticker__chip {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  flex-shrink: 0;
  padding: var(--space-1) var(--space-3);
  font-family: var(--font-head);
  font-weight: 600;
  font-size: var(--step--2);
  line-height: 1.2;
  color: var(--bg);
  background: var(--brand-600);
  border-radius: var(--r-pill);
  white-space: nowrap;
  transition: background var(--dur-1) var(--ease);
}
.f2-ticker__chip-arrow {
  transition: transform var(--dur-1) var(--ease);
}

@media (hover: hover) {
  .f2-ticker:hover {
    
    background-color: #F6E9D9; 
    background-color: color-mix(in srgb, var(--warn-50), var(--warn-700) 6%);
  }
  .f2-ticker:hover .f2-ticker__link {
    color: var(--ink-700);
  }
  .f2-ticker:hover .f2-ticker__chip {
    background: var(--brand-700);
  }
  .f2-ticker:hover .f2-ticker__chip-arrow {
    transform: translateX(2px);
  }
}

.f2-ticker__viewport {
  position: relative;
  flex: 1 1 auto;
  min-inline-size: 0;    
  overflow: hidden;
  
  -webkit-mask-image: linear-gradient(
    to right,
    transparent 0,
    black var(--space-5),
    black calc(100% - var(--space-6)),
    transparent 100%
  );
  mask-image: linear-gradient(
    to right,
    transparent 0,
    black var(--space-5),
    black calc(100% - var(--space-6)),
    transparent 100%
  );
}

.f2-ticker__track {
  display: flex;
  inline-size: max-content; 
  will-change: transform;
  animation: f2-marquee 36s linear infinite;
}

.f2-ticker:focus-within .f2-ticker__track {
  animation-play-state: paused;
}

@media (hover: hover) {
  .f2-ticker:hover .f2-ticker__track {
    animation-play-state: paused;
  }
}

.f2-ticker.is-offscreen .f2-ticker__track {
  animation-play-state: paused;
}

.f2-ticker__list {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.f2-ticker__item {
  display: inline-flex;
  align-items: center;
  font-size: var(--fs-200);
  line-height: 1.2;
  color: var(--ink-700);
  white-space: nowrap;
}

.f2-ticker__item::after {
  content: "•";
  margin-inline: var(--space-5);
  color: #C9A77F; 
  color: color-mix(in srgb, var(--warn-50), var(--warn-700) 45%);
}

@keyframes f2-marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }   
}

@media (prefers-reduced-motion: reduce) {
  .f2-ticker__track {
    animation: none;
    transform: none;
  }
  
  .f2-ticker__list--dup {
    display: none;
  }
  
  .f2-ticker__viewport {
    -webkit-mask-image: linear-gradient(
      to right,
      black calc(100% - var(--space-6)),
      transparent 100%
    );
    mask-image: linear-gradient(
      to right,
      black calc(100% - var(--space-6)),
      transparent 100%
    );
  }
}

@media (max-width: 29.999rem) {
  .f2-ticker__link {
    gap: var(--space-2);
  }
  .f2-ticker__item::after {
    margin-inline: var(--space-4);
  }
}

.f4-sources__lead {
  margin: 0 0 var(--space-5);
  
  text-align: start; 
  font-family: var(--font-head);
  font-weight: 600; 
  font-size: var(--fs-200);
  letter-spacing: .01em;
  color: var(--ink-500);
}

.f4-sources__marquee {
  overflow: hidden;
  
  -webkit-mask-image: linear-gradient(
    to right, transparent 0, rgb(0 0 0) var(--space-8),
    rgb(0 0 0) calc(100% - var(--space-8)), transparent 100%);
          mask-image: linear-gradient(
    to right, transparent 0, rgb(0 0 0) var(--space-8),
    rgb(0 0 0) calc(100% - var(--space-8)), transparent 100%);
}

.f4-sources__track {
  display: flex;
  inline-size: max-content; 
  animation: f4-marquee 45s linear infinite;
}

.f4-sources__marquee:focus-within .f4-sources__track {
  animation-play-state: paused;
}

@media (hover: hover) {
  .f4-sources__marquee:hover .f4-sources__track {
    animation-play-state: paused;
  }
}

.f4-sources__marquee.is-offscreen .f4-sources__track {
  animation-play-state: paused;
}

.f4-sources__group {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  gap: var(--space-7);
  padding-inline: var(--space-5);
}

.f4-sources__item {
  display: flex;
  align-items: center;
  justify-content: center;
}

.index-v2 img.f4-sources__logo {
  inline-size: auto; 
  block-size: 40px; 
  max-inline-size: 140px; 
  object-fit: contain;
  filter: grayscale(1);
  opacity: .65;
  transition: filter var(--dur-2) var(--ease),
              opacity var(--dur-2) var(--ease);
}

.index-v2 img.f4-sources__logo--compact {
  block-size: 36px; 
}

.index-v2 img.f4-sources__logo:focus-visible {
  filter: grayscale(0);
  opacity: 1;
}

@media (hover: hover) {
  .index-v2 img.f4-sources__logo:hover {
    filter: grayscale(0);
    opacity: 1;
  }
}

@keyframes f4-marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
  .f4-sources__marquee {
    -webkit-mask-image: none;
            mask-image: none;
  }
  .f4-sources__track {
    inline-size: auto; 
    animation: none;
    justify-content: center;
  }
  .f4-sources__group {
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--space-6);
  }
  .f4-sources__group--clone { display: none; }
  
  .index-v2 img.f4-sources__logo { opacity: 1; filter: grayscale(1); }
}

svg.icon {
  display: inline-block;
  inline-size: 1em;
  block-size: 1em;
  fill: currentColor;
  vertical-align: -.125em;
}

.f5-cta {
  position: relative;
  isolation: isolate;      
  
  overflow: clip;
  overflow-clip-margin: 5px;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-6);
  padding: var(--space-7);
  background: var(--brand-700);
  border-radius: var(--r-card);
}

.f5-cta::before,
.f5-cta::after {
  content: "";
  position: absolute;
  z-index: -1;
  border-radius: var(--r-pill);
  pointer-events: none;
}
.f5-cta::before {
  inline-size: 26rem; 
  block-size: 26rem; 
  
  top: -9rem;
  right: -7rem;
   background: radial-gradient(circle at center, rgb(0 122 108 / .55) 0%, rgb(0 122 108 / 0) 70%);
  background: radial-gradient(circle at center,
              color-mix(in srgb, var(--brand-600), transparent 45%) 0%,
              transparent 70%);
}
.f5-cta::after {
  inline-size: 22rem; 
  block-size: 22rem; 
  
  bottom: -10rem;
  left: -8rem;
   background: radial-gradient(circle at center, rgb(3 69 61 / .65) 0%, rgb(3 69 61 / 0) 70%);
  background: radial-gradient(circle at center,
              color-mix(in srgb, var(--brand-800), transparent 35%) 0%,
              transparent 70%);
}

.f5-cta__lead {
  
  max-inline-size: 28.75rem;
}

.index-v2 h2.f5-cta__title {
  margin: 0 0 var(--space-3);
  color: var(--bg);
}

.f5-cta__text {
  margin: 0;
  color: var(--brand-50);
  font-size: var(--fs-400);
}

.f5-cta__action {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-5);
  
  container-type: inline-size;
}

.f5-cta__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-6);
  font-family: var(--font-head);
  font-weight: 600;
  font-size: var(--fs-400);
  color: var(--brand-700);
  background: var(--bg);
  border: 1px solid var(--bg);
  border-radius: var(--r-ctl);
  transition: background var(--dur-1) var(--ease),
              color var(--dur-1) var(--ease),
              transform var(--dur-1) var(--ease);
}

@media (hover: hover) {
  .f5-cta__btn:hover {
    color: var(--brand-700);
    background: var(--brand-50);
    border-color: var(--brand-50);
  }
}

.f5-cta__btn:active { transform: translateY(1px); }

@container (max-width: 26.25rem) {
  .f5-cta__action { align-self: stretch; }
  .f5-cta__btn { inline-size: 100%; }
}

.f5-cta__reassure {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3) var(--space-5);
}

.f5-cta__reassure-item {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  color: var(--brand-50);
  font-size: var(--fs-200);
  line-height: 1.4;
}
.f5-cta__reassure-item i {
  flex-shrink: 0;
  color: var(--brand-100);
  font-size: var(--fs-300);
  line-height: 1;
}

@media (min-width: 64rem) {
  .f5-cta {
    grid-template-columns: 1.35fr 1fr;
    align-items: center;
    gap: var(--space-7);
  }
  .f5-cta__action {
    align-items: flex-end;
    text-align: end; 
  }
}

@media (max-width: 29.999rem) {
  .f5-cta { padding: var(--space-6) var(--space-4); }
}

.f6-reviews__head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-5);
  margin-block-end: var(--space-7);
}
.f6-reviews__heading {
  
  max-inline-size: 37.5rem;
}

.index-v2 h2.f6-reviews__title {
  
  margin-block-end: var(--space-4);
}
.f6-reviews__subtitle {
  color: var(--ink-500);
  font-size: var(--fs-400);
  margin: 0;
}

.f6-reviews__rating {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-2) var(--space-3);
  padding: var(--space-4) var(--space-5);
  background: var(--brand-50);
  border: 1px solid var(--brand-100);
  border-radius: var(--r-card);
}
.f6-reviews__score {
  font-family: var(--font-head);
  font-weight: 700;
  font-size: var(--fs-700);
  line-height: 1;
  color: var(--ink-900);
}
.f6-reviews__stars {
  display: inline-flex;
  gap: var(--space-1);
  color: var(--star-500);
  font-size: var(--fs-400);
}
.f6-reviews__count {
  flex-basis: 100%;
  color: var(--ink-500);
  font-size: var(--fs-200);
}

.f6-reviews__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-5);
  align-items: stretch;
}

.f6-review {
  display: flex;
}
.f6-review__figure {
  display: flex;
  flex-direction: column;
  inline-size: 100%; 
  block-size: 100%; 
  margin: 0;
  padding: var(--space-5);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-card);
  box-shadow: var(--shadow-card);
  transition: border-color var(--dur-2) var(--ease),
              transform var(--dur-2) var(--ease);
}

@media (hover: hover) {
  .f6-review__figure:hover {
    transform: translateY(calc(2 * var(--lift)));
    border-color: var(--brand-100);
  }
}

.f6-review__quote {
  margin: 0 0 var(--space-5);
  flex: 1 1 auto;
}
.f6-review__stars {
  display: inline-flex;
  gap: var(--space-1);
  margin-block-end: var(--space-3);
  color: var(--star-500);
  font-size: var(--fs-200);
}

.f6-review__star--muted {
  color: var(--line);
}

.f6-review__recommends {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  margin: 0 0 var(--space-3);
  padding: var(--space-1) var(--space-2);
  font-size: var(--step--2);
  color: var(--ok-700);
  background: var(--ok-50);
  border-radius: var(--r-pill);
}
.f6-review__recommends .bi {
  font-size: var(--fs-200);
  line-height: 1;
}
.f6-review__message {
  margin: 0;
  color: var(--ink-700);
  font-size: var(--fs-200);
  line-height: var(--lh-body);
}

.f6-review__author {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding-block-start: var(--space-4);
  border-block-start: 1px solid var(--line);
}
.f6-review__avatar {
  
  inline-size: 48px; 
  block-size: 48px; 
  flex-shrink: 0;
  border-radius: var(--r-pill);
  object-fit: cover;
  background: var(--brand-50);
}
.f6-review__avatar--initials {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-head);
  font-weight: 700;
  font-size: var(--fs-400);
  color: var(--brand-700);
  background: var(--brand-100);
}
.f6-review__meta {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  min-inline-size: 0; 
}
.f6-review__name {
  font-family: var(--font-head);
  font-weight: 600;
  color: var(--ink-900);
}
.f6-review__role {
  font-size: var(--step--2);
  color: var(--ink-500);
}

@media (max-width: 63.999rem) {
  .f6-reviews__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 29.999rem) {
  .f6-reviews__grid {
    grid-template-columns: 1fr;
  }
  .f6-reviews__head {
    align-items: flex-start;
  }
}

.sticky-cta-v2 {
  display: none;
}

@media (max-width: 63.999rem) {
  .sticky-cta-v2 {
    display: block;
    position: fixed;
    inset-inline-start: 0;
    inset-inline-end: 0;
    inset-block-end: 0;
    z-index: 900; 

    padding: var(--space-3);
    
    padding-block-end: max(var(--space-4), env(safe-area-inset-bottom));

    background: var(--surface);
    border-block-start: 1px solid var(--line);
    
    box-shadow: 0 -4px 16px rgb(14 27 25 / .08);

    transform: translateY(100%);
    visibility: hidden;
    transition:
      transform var(--dur-2) var(--ease),
      visibility var(--dur-2) var(--ease);
  }

  .sticky-cta-v2.is-visible {
    transform: translateY(0);
    visibility: visible;
  }

  body.has-sticky-cta-v2 {
    padding-block-end: calc(
      var(--control-h-lg) + var(--space-3) + max(var(--space-4), env(safe-area-inset-bottom)) + 1px
    );
  }
}

.sticky-cta-v2__btn {
  inline-size: 100%; 
}

.footer-v2 {
  background: var(--ink-900);
  color: var(--brand-100);
  padding-block: var(--space-8) var(--space-6);
}

.footer-v2__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-6);
}
@media (min-width: 48rem) {
  .footer-v2__grid { grid-template-columns: 1fr 1fr; }
  .footer-v2__col--brand { grid-column: 1 / -1; }
}
@media (min-width: 64rem) {
  .footer-v2__grid { grid-template-columns: 1.4fr 1fr 1fr 1fr; }
  .footer-v2__col--brand { grid-column: auto; }
}

.index-v2 a.footer-v2__brand-name {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
  margin-block-end: var(--space-4);
  color: var(--bg);
}

.index-v2 a.footer-v2__brand-name:visited { color: var(--bg); }
@media (hover: hover) {
  
  .index-v2 a.footer-v2__brand-name:hover { color: var(--bg); }
}
.footer-v2__brand-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  
  inline-size: calc(var(--space-6) + var(--space-2));
  block-size: calc(var(--space-6) + var(--space-2));
  background: var(--brand-600);
  border-radius: var(--r-ctl);
  flex-shrink: 0;
}

.footer-v2__brand-chip img { inline-size: var(--space-5); block-size: var(--space-5); }
.footer-v2__brand-word {
  font-family: var(--font-head);
  font-weight: 700;
  font-size: var(--step-2);
  color: var(--bg);
}

.footer-v2__blurb {
  color: var(--brand-100);
  font-size: var(--step--1);
  
  max-inline-size: 17rem;
  overflow-wrap: anywhere; 
}

.footer-v2__socials {
  display: flex;
  flex-wrap: wrap; 
  gap: var(--space-3);
  margin-block-start: var(--space-5); 
}

.index-v2 a.footer-v2__social {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  inline-size: var(--control-h-md); block-size: var(--control-h-md);
  color: var(--brand-100);
  
  border: 1px solid var(--brand-100);
  border-radius: var(--r-pill);
  font-size: var(--step-1);
  transition: background var(--dur-1) var(--ease),
              border-color var(--dur-1) var(--ease),
              color var(--dur-1) var(--ease);
}

.index-v2 a.footer-v2__social:visited { color: var(--brand-100); }
@media (hover: hover) {
  
  .index-v2 a.footer-v2__social:hover {
    color: var(--bg);
    background: var(--brand-600);
    border-color: var(--brand-600);
  }
}

.index-v2 h2.footer-v2__heading {
  font-family: var(--font-head);
  font-weight: 600;
  font-size: var(--step-0);
  color: var(--bg);
  margin-block-end: var(--space-4);
}

.footer-v2__links li { margin-block-end: var(--space-3); }

.index-v2 a.footer-v2__link {
  display: inline-block;
  
  padding-block: var(--space-2);
  margin-block: calc(var(--space-1) - var(--space-2));
  color: var(--brand-100);
  font-size: var(--step--1);
  overflow-wrap: anywhere; 
}

.index-v2 a.footer-v2__link:visited { color: var(--brand-100); }
@media (hover: hover) {
  
  .index-v2 a.footer-v2__link:hover {
    color: var(--bg);
    text-decoration: underline;
  }
}

.footer-v2__bottom {
  margin-block-start: var(--space-7);
  padding-block-start: var(--space-5);
  
  border-block-start: 1px solid rgb(255 255 255 / .15);
  text-align: center;
}
.footer-v2__copyright {
  color: var(--brand-100);
  font-size: var(--step--2);
}

@media print {
  .index-v2 .footer-v2 a.footer-v2__link,
  .index-v2 .footer-v2 a.footer-v2__link:visited { color: var(--ink-700); }
  .index-v2 .footer-v2 a.footer-v2__brand-name,
  .index-v2 .footer-v2 a.footer-v2__brand-name:visited { color: var(--ink-900); }
  .index-v2 .footer-v2 a.footer-v2__social,
  .index-v2 .footer-v2 a.footer-v2__social:visited { color: var(--ink-700); border-color: currentColor; }
  .index-v2 .footer-v2 h2.footer-v2__heading { color: var(--ink-900); }
}

.f10 {
  container-type: inline-size;
  container-name: f10;
  background: var(--f10-bg);
  color: var(--f10-ink);
  font-family: var(--f10-font-sans);
}

.f10__inner {
  
  --f10-pad-inline: clamp(16px, 4vw, 32px);
  --f10-pad-top: clamp(56px, 8vw, 96px);
  --f10-pad-bottom: clamp(64px, 9vw, 104px);
  --f10-stack: clamp(36px, 6vw, 56px);

  inline-size: 100%;
  max-inline-size: calc(
    var(--f10-band) + 2 * max(
      var(--f10-pad-inline),
      env(safe-area-inset-left),
      env(safe-area-inset-right)
    )
  );
  margin-inline: auto;
  padding-inline: max(
    var(--f10-pad-inline),
    env(safe-area-inset-left),
    env(safe-area-inset-right)
  );
  padding-block: var(--f10-pad-top) var(--f10-pad-bottom);
  display: flex;
  flex-direction: column;
  gap: var(--f10-stack);
}

@supports (container-type: inline-size) {
  .f10__inner {
    --f10-pad-inline: clamp(16px, 4cqw, 32px);
    --f10-pad-top: clamp(56px, 8cqw, 96px);
    --f10-pad-bottom: clamp(64px, 9cqw, 104px);
    --f10-stack: clamp(36px, 6cqw, 56px);
  }
}

@container f10 (min-width: 720px) {
  .f10 .f10-only-compact {
    
    display: none !important;
  }
}
@container f10 (max-width: 719.98px) {
  .f10 .f10-only-roomy {
    
    display: none !important;
  }
}

@supports not (container-type: inline-size) {
  @media (min-width: 720px) {
    .f10 .f10-only-compact {
      
      display: none !important;
    }
  }
  @media (max-width: 719.98px) {
    .f10 .f10-only-roomy {
      
      display: none !important;
    }
  }
}

.js:not(.f10-steps-ready) .f10-steps__panel ~ .f10-steps__panel {
  display: none;
}

.f10 :focus-visible {
  outline: 3px solid var(--f10-brand);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  .f10,
  .f10 *,
  .f10 *::before,
  .f10 *::after {
    
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

.f10-head {
  display: flex;
  flex-direction: column;
  gap: 26px;
}

.f10-head__eyebrow {
  display: flex;
  align-items: center;
  gap: 14px;
}

.f10-head__pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--f10-brand);
  background: var(--f10-brand-tint);
  border-radius: var(--f10-r-pill);
  padding: 7px 14px;
}

.f10-head__pill::before {
  content: "";
  flex: 0 0 auto;
  inline-size: 6px;
  block-size: 6px;
  border-radius: 50%;
  background: var(--f10-brand);
}

.f10-head__hairline {
  flex: 1;
  block-size: 1px;
  background: var(--f10-line);
}

.f10-head__badge {
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--f10-muted);
}

.f10-head__row {
  display: flex;
  flex-wrap: wrap;
  gap: 32px 64px;
  align-items: flex-start;
}

.f10-head__left {
  flex: 1 1 420px;
  min-inline-size: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  
  gap: 20px clamp(18px, 3vw, 28px);
}

.index-v2 p.f10-head__numeral {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  
  padding-inline-end: clamp(18px, 3vw, 28px);
  border-inline-end: 1px solid var(--f10-line);
  
  margin: 0;
}

.f10-head__count {
  font-family: var(--f10-font-mono);
  
  font-size: clamp(64px, 11vw, 96px);
  font-weight: 500;
  line-height: 0.84;
  letter-spacing: -0.06em;
  color: var(--f10-brand);
}

.f10-head__count-label {
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--f10-muted);
}

.index-v2 h2.f10-head__title {
  margin: 0;
  flex: 1 1 220px;
  align-self: center;
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-inline-size: 0;
  font-family: var(--f10-font-sans);
  
}

.f10-head__title-line {
  
  font-size: clamp(34px, 5.4vw, 50px);
  line-height: 1.02;
  font-weight: 800;
  letter-spacing: -0.032em;
  color: var(--f10-ink);
  text-wrap: balance;
}

.f10-head__tagline {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  font-size: 19px;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: -0.012em;
  color: var(--f10-brand);
}

.f10-head__tagline::before {
  content: "";
  flex: 0 0 auto;
  inline-size: 24px;
  block-size: 2px;
  background: var(--f10-brand);
}

.index-v2 p.f10-head__lede {
  flex: 1 1 320px;
  min-inline-size: 0;
  margin: 8px 0 0;
  font-size: 18px;
  line-height: 1.65;
  color: var(--f10-muted);
  text-wrap: pretty;
}

@supports (container-type: inline-size) {
  .f10-head__left {
    gap: 20px clamp(18px, 3cqw, 28px);
  }
  .index-v2 p.f10-head__numeral {
    padding-inline-end: clamp(18px, 3cqw, 28px);
  }
  .f10-head__count {
    font-size: clamp(64px, 11cqw, 96px);
  }
  .f10-head__title-line {
    font-size: clamp(34px, 5.4cqw, 50px);
  }
}

.f10-steps {
  background: var(--f10-surface);
  border: 1px solid var(--f10-line);
  border-radius: var(--f10-r-lg);
  overflow: hidden;
}

.f10-steps__tabs {
  display: none;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1px;
  border-block-end: 1px solid var(--f10-line);
  background: var(--f10-line-4);
}

.js .f10-steps__tabs {
  display: grid;
}

.f10-steps__tab {
  min-inline-size: 0;
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 18px clamp(15px, 3.5vw, 20px);
  margin: 0;
  background: var(--f10-surface);
  border: 0;
  font: inherit;
  text-align: start;
  cursor: pointer;
  transition: background-color 150ms ease;
}

@supports (container-type: inline-size) {
  .f10-steps__tab {
    padding: 18px clamp(15px, 3.5cqw, 20px);
  }
}

@media (hover: hover) {
  .f10-steps__tab:hover {
    background-color: var(--f10-surface-2);
  }
}

.f10-steps__tab:focus-visible {
  outline-offset: -3px;
}

.f10-steps__tab-num {
  flex: 0 0 auto;
  inline-size: 38px;
  block-size: 38px;
  box-sizing: border-box;
  border-radius: 50%;
  background: var(--f10-surface);
  color: var(--f10-muted);
  border: 2px solid var(--f10-line-3);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--f10-font-mono);
  font-size: 13px;
}

.f10-steps__tab[aria-selected="true"] .f10-steps__tab-num {
  background: var(--f10-brand);
  color: var(--f10-surface);
  border: 0;
  box-shadow: 0 0 0 5px var(--f10-brand-tint);
}

.f10-steps__tab-text {
  min-inline-size: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.f10-steps__tab-eyebrow {
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--f10-muted);
}

.f10-steps__tab-title {
  font-size: 15px;
  line-height: 1.25;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--f10-ink);
}

.f10-steps__panel {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: clamp(22px, 4vw, 32px) 44px;
  padding: clamp(24px, 5vw, 36px) clamp(18px, 4vw, 34px) clamp(26px, 5vw, 38px);
}

@supports (container-type: inline-size) {
  .f10-steps__panel {
    gap: clamp(22px, 4cqw, 32px) 44px;
    padding: clamp(24px, 5cqw, 36px) clamp(18px, 4cqw, 34px) clamp(26px, 5cqw, 38px);
  }
}

.f10-steps__panel:focus-visible {
  outline-offset: -3px;
}

.f10-steps__lead {
  flex: 1 1 300px;
  min-inline-size: 0;
  max-inline-size: 440px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.f10-steps__badge {
  align-self: flex-start;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  border-radius: var(--f10-r-pill);
  padding: 5px 12px;
}

.f10-steps__badge--muted {
  color: var(--f10-muted);
  background: var(--f10-chip-bg);
}

.f10-steps__badge--brand {
  color: var(--f10-brand);
  background: var(--f10-brand-tint);
}

.f10-steps__badge--solid {
  color: var(--f10-surface);
  background: var(--f10-brand);
}

.index-v2 h3.f10-steps__title {
  margin: 0;
  font-family: var(--f10-font-sans);
  font-size: 30px;
  line-height: 1.15;
  font-weight: 800;
  letter-spacing: -0.025em;
  color: var(--f10-ink);
  text-wrap: wrap;
}

.index-v2 h3.f10-steps__title--go {
  color: var(--f10-brand);
}

.index-v2 p.f10-steps__text {
  margin: 0;
  font-size: 15px;
  line-height: 1.65;
  color: var(--f10-muted);
  text-wrap: pretty;
}

.f10-steps__chips {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-block-start: 4px;
}

.f10-steps__chips--inline {
  flex: 1 1 100%;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 16px;
}

.f10-steps__chips-label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--f10-muted);
}

.f10-steps__chips--inline .f10-steps__chips-label {
  flex: 0 0 auto;
}

.f10-steps__chips-icon {
  flex: 0 0 auto;
  color: var(--f10-brand);
}

.f10-steps__chip-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.f10-steps__chips--inline .f10-steps__chip-list {
  align-items: center;
}

.f10-steps__chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  font-weight: 700;
  color: var(--f10-brand);
  background: var(--f10-brand-tint-2);
  border-radius: var(--f10-r-pill);
  padding: 6px 12px;
}

.f10-steps__chips--inline .f10-steps__chip {
  white-space: nowrap;
}

.f10-steps__chip-dot {
  flex: 0 0 auto;
  inline-size: 5px;
  block-size: 5px;
  border-radius: 50%;
  background: var(--f10-brand);
}

.f10-steps__chip--pay {
  gap: 0;
  color: var(--f10-muted);
  background: var(--f10-chip-bg);
  white-space: nowrap;
}

.f10-steps__data {
  flex: 2 1 380px;
  min-inline-size: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.f10-steps__data-label {
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--f10-muted);
}

.f10-steps__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(258px, 100%), 1fr));
  gap: 1px;
  background: var(--f10-line-2);
  border: 1px solid var(--f10-line-2);
  border-radius: var(--f10-r-sm);
  overflow: hidden;
}

.f10-steps__grid--tight {
  grid-template-columns: repeat(auto-fit, minmax(min(250px, 100%), 1fr));
}

.f10-steps__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 13px 16px;
  background: var(--f10-surface);
}

.f10-steps__key {
  min-inline-size: 0;
  font-size: 14px;
  line-height: 1.4;
  color: var(--f10-muted);
}

.f10-steps__value {
  flex: 0 0 auto;
  font-size: 14px;
  font-weight: 800;
  text-align: end;
  color: var(--f10-ink);
}

.f10-steps__value--good {
  color: var(--f10-brand);
}

.f10-steps__value--bad {
  color: var(--f10-danger);
}

.f10-steps__scenarios {
  flex: 1 1 100%;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding-block-start: 4px;
}

.f10-steps__scenarios-label {
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--f10-muted);
}

.f10-steps__scenario-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(230px, 100%), 1fr));
  gap: 12px;
}

.f10-steps__scenario {
  display: flex;
  flex-direction: column;
  gap: 9px;
  padding: 18px 18px 20px;
  border-width: 1px;
  border-style: solid;
  border-radius: var(--f10-r-sm);
}

.f10-steps__scenario--warn {
  background: var(--f10-warn-bg);
  border-color: var(--f10-warn-line);
}

.f10-steps__scenario--bad {
  background: var(--f10-bad-bg);
  border-color: var(--f10-bad-line);
}

.f10-steps__scenario--good {
  background: var(--f10-good-bg);
  border-color: var(--f10-edge);
}

.f10-steps__scenario-head {
  display: flex;
  align-items: center;
  gap: 10px;
}

.f10-steps__scenario-icon {
  flex: 0 0 auto;
  inline-size: 30px;
  block-size: 30px;
  box-sizing: border-box;
  border-radius: 50%;
  background: var(--f10-surface);
  border-width: 1px;
  border-style: solid;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.f10-steps__scenario--warn .f10-steps__scenario-icon {
  border-color: var(--f10-warn-line);
  color: var(--f10-warn-icon);
}

.f10-steps__scenario--bad .f10-steps__scenario-icon {
  border-color: var(--f10-bad-line);
  color: var(--f10-danger);
}

.f10-steps__scenario--good .f10-steps__scenario-icon {
  border-color: var(--f10-edge);
  color: var(--f10-brand);
}

.f10-steps__scenario-title {
  font-size: 15px;
  font-weight: 800;
  letter-spacing: -0.01em;
}

.f10-steps__scenario--warn .f10-steps__scenario-title {
  color: var(--f10-warn-ink);
}

.f10-steps__scenario--bad .f10-steps__scenario-title {
  color: var(--f10-bad-ink);
}

.f10-steps__scenario--good .f10-steps__scenario-title {
  color: var(--f10-brand);
}

.index-v2 p.f10-steps__scenario-text {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
  color: var(--f10-muted);
  text-wrap: pretty;
}

.f10-steps__next-row {
  flex: 1 1 100%;
  display: flex;
  justify-content: flex-end;
  padding-block-start: 4px;
}

.f10-steps__next {
  flex: 1 1 auto;
  max-inline-size: 340px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  min-block-size: 50px;
  padding: 12px 16px;
  margin: 0;
  background: var(--f10-surface);
  border: 1px solid var(--f10-edge);
  border-radius: var(--f10-r-pill);
  font: inherit;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--f10-brand);
  cursor: pointer;
  transition: border-color 150ms ease, background-color 150ms ease;
}

.index-v2 button.f10-steps__next {
  font-size: 15px;
}

.f10-steps__next-label {
  min-inline-size: 0;
  text-align: center;
}

.f10-steps__next-disc {
  flex: 0 0 auto;
  inline-size: 34px;
  block-size: 34px;
  border-radius: 50%;
  background: var(--f10-brand);
  color: var(--f10-surface);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.index-v2 svg.f10-steps__next-arrow {
  flex: 0 0 auto;
  inline-size: 17px;
  block-size: 14px;
}

.index-v2 a.f10-steps__next--go,
.index-v2 a.f10-steps__next--go:visited {
  background: var(--f10-brand);
  border-color: var(--f10-brand);
  color: var(--f10-surface);
  transition: background-color 150ms ease;
}

.f10-steps__next--go .f10-steps__next-disc {
  background: var(--f10-surface);
  color: var(--f10-brand);
}

@media (hover: hover) {
  .f10-steps__next:hover {
    border-color: var(--f10-brand);
    background-color: var(--f10-surface-2);
  }

  .index-v2 a.f10-steps__next--go:hover {
    border-color: var(--f10-brand-hover);
    background-color: var(--f10-brand-hover);
    color: var(--f10-surface);
  }
}

.f10-steps__progress {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px clamp(18px, 4vw, 34px);
  background: var(--f10-surface-2);
  border-block-start: 1px solid var(--f10-line);
}

@supports (container-type: inline-size) {
  .f10-steps__progress {
    padding: 14px clamp(18px, 4cqw, 34px);
  }
}

.f10-steps__progress-label {
  flex: 0 0 auto;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--f10-muted);
}

.f10-steps__track {
  flex: 1;
  min-inline-size: 0;
  block-size: 4px;
  border-radius: var(--f10-r-pill);
  background: var(--f10-line);
  overflow: hidden;
}

.f10-steps__fill {
  block-size: 100%;
  inline-size: 25%;
  border-radius: var(--f10-r-pill);
  background: var(--f10-brand);
  transition: inline-size 320ms cubic-bezier(0.4, 0, 0.2, 1);
}

@media (prefers-reduced-motion: reduce) {
  .f10-steps__fill {
    transition-property: none;
  }
}

@container f10 (max-width: 719.98px) {
  .f10-steps__row {
    flex-wrap: wrap;
  }

  .f10-steps__value {
    margin-inline-start: auto;
  }
}

.f10-stats {
  background: var(--f10-surface);
  border: 1px solid var(--f10-line);
  border-radius: var(--f10-r-md);
  overflow: hidden;
}

.f10-stats__grid {
  margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(168px, 1fr));
  gap: 0;
  background: var(--f10-surface-2);
  overflow: hidden;
  border-block-end: 1px solid var(--f10-line);
}

.f10-stats__tile {
  position: relative;
  min-inline-size: 0;
  padding: 24px clamp(18px, 4vw, 26px) 26px;
  background: var(--f10-surface-2);
  box-shadow: 1px 0 0 var(--f10-line-2), 0 1px 0 var(--f10-line-2);
  display: flex;
  flex-direction: column;
  gap: 12px;
  transition: background 180ms ease, box-shadow 180ms ease;
}
@supports (container-type: inline-size) {
  .f10-stats__tile {
    padding-inline: clamp(18px, 4cqw, 26px);
  }
}

@media (hover: hover) {
  .f10-stats__tile:hover {
    background: var(--f10-surface);
    box-shadow:
      inset 0 3px 0 var(--f10-brand),
      inset 0 0 0 1px var(--f10-line-6),
      1px 0 0 var(--f10-line-2),
      0 1px 0 var(--f10-line-2);
  }
}

.f10-stats__tile-head {
  display: flex;
  align-items: center;
  gap: 8px;
}

.f10-stats__rule {
  inline-size: 16px;
  block-size: 2px;
  background: var(--f10-brand-soft);
}
.f10-stats__rule--brand {
  background: var(--f10-brand);
}

.f10-stats__label {
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--f10-muted);
}

.f10-stats__value {
  display: flex;
  align-items: baseline;
  gap: 2px;
  font-size: 38px;
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.f10-stats__value--gap-md {
  gap: 4px;
}
.f10-stats__value--gap-lg {
  gap: 6px;
}

.f10-stats__suffix {
  font-size: 26px;
  color: var(--f10-brand);
}

.f10-stats__suffix--star {
  font-size: 22px;
}

.f10-stats__desc {
  margin: 0;
  font-size: 14px;
  line-height: 1.4;
  color: var(--f10-muted);
}

.f10-stats__cta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 24px 28px;
  padding: clamp(24px, 5vw, 32px) clamp(18px, 4vw, 32px) clamp(26px, 5vw, 34px);
  background: var(--f10-brand-tint);
  border-block-start: 1px solid var(--f10-line-5);
}
@supports (container-type: inline-size) {
  .f10-stats__cta {
    padding: clamp(24px, 5cqw, 32px) clamp(18px, 4cqw, 32px) clamp(26px, 5cqw, 34px);
  }
}

.f10-stats__cta-lead {
  flex: 1 1 380px;
  min-inline-size: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-inline-size: 33.75rem;
}

.f10-stats__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  align-self: flex-start;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--f10-muted);
}

.f10-stats__dot {
  flex: 0 0 auto;
  inline-size: 6px;
  block-size: 6px;
  border-radius: 50%;
  background: var(--f10-brand);
}

.index-v2 p.f10-stats__cta-title {
  margin: 0;
  font-size: 26px;
  line-height: 1.2;
  font-weight: 800;
  letter-spacing: -0.025em;
  color: var(--f10-ink);
  text-wrap: pretty;
}

.index-v2 p.f10-stats__cta-text {
  margin: 0;
  font-size: 15px;
  line-height: 1.55;
  color: var(--f10-muted);
  text-wrap: pretty;
}

.index-v2 a.f10-stats__cta-link {
  flex: 1 1 260px;
  max-inline-size: 340px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 9px 9px 9px 22px;
  background: var(--f10-surface);
  border: 1px solid var(--f10-edge);
  border-radius: var(--f10-r-pill);
  transition: border-color 160ms ease, box-shadow 160ms ease;
}
@media (hover: hover) {
  
  .index-v2 a.f10-stats__cta-link:hover {
    border-color: var(--f10-brand);
    box-shadow: var(--f10-shadow-cta);
  }
}

.f10-stats__cta-link-label {
  font-size: 17px;
  font-weight: 800;
  letter-spacing: -0.015em;
  color: var(--f10-brand);
}

.f10-stats__cta-link-disc {
  flex: 0 0 auto;
  inline-size: 44px;
  block-size: 44px;
  border-radius: 50%;
  background: var(--f10-brand);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  
  color: var(--f10-surface);
}

.f10-stats__support {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 18px;
  padding: 16px clamp(18px, 4vw, 32px) 18px;
  background: var(--f10-surface);
  border-block-start: 1px solid var(--f10-line-2);
}
@supports (container-type: inline-size) {
  .f10-stats__support {
    padding-inline: clamp(18px, 4cqw, 32px);
  }
}

.f10-stats__support-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--f10-brand);
  background: var(--f10-brand-tint);
  border-radius: var(--f10-r-pill);
  padding: 6px 13px;
}

.f10-stats__support-text {
  flex: 1 1 260px;
  min-inline-size: 0;
  font-size: 14px;
  line-height: 1.55;
  color: var(--f10-muted);
  text-wrap: pretty;
}

.index-v2 a.f10-stats__support-email,
.index-v2 a.f10-stats__support-email:visited {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-block-size: 44px;
  padding: 12px 16px;
  font-size: 14px;
  font-weight: 800;
  color: var(--f10-brand);
  background: var(--f10-surface);
  border: 1px solid var(--f10-line-7);
  border-radius: var(--f10-r-pill);
  transition: background 150ms ease, border-color 150ms ease;
}
@media (hover: hover) {
  
  .index-v2 a.f10-stats__support-email:hover {
    background: var(--f10-brand-tint);
    border-color: var(--f10-brand);
  }
}
.f10-stats__support-email svg {
  flex: 0 0 auto;
  color: var(--f10-brand);
}

.f11 {
  container-type: inline-size;
  container-name: f11;
  background: var(--f11-bg);
  color: var(--f11-ink);
  font-family: var(--f11-font-sans);
}

.f11__inner {
  --f11-pad-inline: 80px;
  --f11-pad-top: 72px;
  --f11-pad-bottom: 84px;
  max-inline-size: calc(var(--f11-band) + 2 * var(--f11-pad-inline));
  margin-inline: auto;
  padding: var(--f11-pad-top) var(--f11-pad-inline) var(--f11-pad-bottom);
}

.f11__body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--f11-aside);
  gap: 40px;
  align-items: start;
}

@container f11 (max-width: 1349.98px) {
  .f11__body {
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
  }
}

@container f11 (max-width: 719.98px) {
  .f11__inner {
    --f11-pad-inline: 20px;
    --f11-pad-top: 34px;
    --f11-pad-bottom: 40px;
  }
  .f11__body { gap: 18px; }
}

.f11-compact { display: none; }

@container f11 (max-width: 719.98px) {
  .f11-wide { display: none; }
  .f11-compact { display: inline; }
}

.f11 :focus-visible {
  outline: 3px solid var(--f11-brand);
  outline-offset: 2px;
  border-radius: 3px;
}

@media (prefers-reduced-motion: reduce) {
  .f11 *,
  .f11 *::before,
  .f11 *::after {
    
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
}

.f11-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: flex-end;
  gap: 48px;
  padding-block-end: 30px;
}

.f11-head__copy {
  display: flex;
  flex-direction: column;
  gap: 16px;
  
  max-inline-size: 44rem;
}

.f11-head .f11-head__live {
  display: inline-flex;
  align-self: flex-start;
  align-items: center;
  gap: 9px;
  margin: 0;
  padding: 7px 15px 7px 11px;
  border-radius: var(--f11-r-pill);
  background: var(--f11-brand-tint);
  color: var(--f11-brand-mid);
  font-family: var(--f11-font-mono);
  font-size: 12px;
}

.f11-pulse {
  display: block;
  flex: none;
  inline-size: 7px;
  block-size: 7px;
  border-radius: 50%;
  background: var(--f11-accent);
  animation: f11-pulse 1.9s ease-in-out infinite;
}

@keyframes f11-pulse {
  0%   { box-shadow: 0 0 0 0 color-mix(in srgb, var(--f11-accent) 45%, transparent); }
  70%  { box-shadow: 0 0 0 7px color-mix(in srgb, var(--f11-accent) 0%, transparent); }
  100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--f11-accent) 0%, transparent); }
}

.f11-head .f11-head__title {
  margin: 0;
  font-family: var(--f11-font-sans);
  font-size: 44px;
  line-height: 1.06;
  letter-spacing: -.03em;
  font-weight: 700;
  text-wrap: balance;
  color: var(--f11-ink);
}

.f11-head .f11-head__lead {
  margin: 0;
  max-inline-size: 34rem;
  font-size: 18px;
  line-height: 1.55;
  color: var(--f11-muted);
  text-wrap: pretty;
}

.f11-stats {
  display: flex;
  align-items: stretch;
  gap: 0;
  flex: none;
  margin: 0;
  padding: 0;
  list-style: none;
}

.f11-stats__item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding-inline-end: 26px;
}

.f11-stats__item + .f11-stats__item {
  padding-inline: 26px 0;
  border-inline-start: 1px solid var(--f11-line-4);
}

.f11-stats__value {
  font-family: var(--f11-font-mono);
  font-size: 30px;
  font-weight: 600;
  letter-spacing: -.03em;
  line-height: 1;
  color: var(--f11-ink);
}

.f11-stats__value--brand { color: var(--f11-brand); }

.f11-stats__label {
  font-size: 13.5px;
  color: var(--f11-meta);
}

@container f11 (max-width: 719.98px) {
  .f11-head {
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
    padding-block-end: 0;
  }

  .f11-head__copy {
    gap: 18px;
    max-inline-size: none;
  }

  .f11-head .f11-head__live {
    gap: 8px;
    padding: 6px 13px 6px 10px;
    font-size: 11.5px;
  }

  .f11-head__live .f11-pulse {
    inline-size: 6px;
    block-size: 6px;
  }

  .f11-head .f11-head__title {
    font-size: 30px;
    line-height: 1.08;
  }

  .f11-head .f11-head__lead {
    max-inline-size: none;
    font-size: 15.5px;
    line-height: 1.5;
  }

  .f11-head .f11-stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    padding-block: 16px;
    border-block: 1px solid var(--f11-line-5);
  }

  .f11-stats__item,
  .f11-stats__item + .f11-stats__item {
    gap: 3px;
    padding: 0;
    border-inline-start: 0;
  }

  .f11-stats__value { font-size: 24px; }
  .f11-stats__label { font-size: 12.5px; }
}

.f11-feed {
  --f11-chips-dim: .85;
  container-type: inline-size;
  container-name: f11feed;
  background: var(--f11-surface);
  border: 1px solid var(--f11-line);
  border-radius: var(--f11-r-lg);
  overflow: hidden;
  box-shadow: var(--f11-shadow);
}

.f11-feed .f11-feed__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.f11-feed__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 15px 22px;
  border-block-end: 1px solid var(--f11-line-2);
}

.f11-feed__live {
  display: flex;
  align-items: center;
  gap: 9px;
  font-family: var(--f11-font-mono);
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--f11-brand-mid);
}

.f11-feed__auto {
  font-family: var(--f11-font-mono);
  font-size: 11.5px;
  color: var(--f11-meta);
}

.f11-row {
  display: block;
  overflow: hidden;
  max-block-size: var(--f11-row-h);
  opacity: 1;
}

.f11-feed .f11-row {
  color: var(--f11-ink);
  text-decoration: none;
  transition:
    max-block-size .38s cubic-bezier(.22, .61, .36, 1),
    opacity .32s ease;
}

.f11-feed .f11-row:visited { color: var(--f11-ink); }

@media (hover: hover) {
  .f11-feed .f11-row:hover { color: var(--f11-ink); }
}

.f11-row--collapsed {
  max-block-size: 0;
  opacity: 0;
}

.f11-feed--expanded {
  --f11-stagger: 12ms;
}

.f11-feed--expanded .f11-row {
  transition-delay: min(calc(var(--f11-row-i, 0) * var(--f11-stagger)), var(--dur-2));
}

@media (prefers-reduced-motion: reduce) {
  .f11-feed--expanded .f11-row { transition-delay: 0s; }
}

.f11-row__inner {
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr) 104px 172px 86px;
  grid-template-areas: "when id city find go";
  align-items: center;
  gap: 16px;
  padding: 15px 22px;
  border-block-start: 1px solid var(--f11-line-3);
  position: relative;
  transition:
    background-color .7s ease,
    transform .46s cubic-bezier(.22, .61, .36, 1);
}

.f11-row--entering .f11-row__inner { transform: translateY(-12px); }

.f11-row:focus-visible .f11-row__inner { background: var(--f11-surface-4); }

@media (hover: hover) {
  .f11-row:hover .f11-row__inner { background: var(--f11-surface-4); }
}

.f11-row--newest .f11-row__inner { background: var(--f11-surface-3); }

.f11-row__when {
  grid-area: when;
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: var(--f11-font-mono);
  font-size: 12px;
  white-space: nowrap;
  color: var(--f11-meta);
}

.f11-row--newest .f11-row__when { color: var(--f11-brand-mid); }

.f11-row__dot {
  display: block;
  flex: none;
  inline-size: 6px;
  block-size: 6px;
  border-radius: 50%;
  background: var(--f11-dot-idle);
}

.f11-row--newest .f11-row__dot {
  background: var(--f11-accent);
  animation: f11-pulse 1.9s ease-in-out infinite;
}

.f11-row__id {
  grid-area: id;
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-inline-size: 0;
}

.f11-row__name {
  font-size: 15px;
  font-weight: 600;
  letter-spacing: -.01em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.f11-row__vin {
  font-family: var(--f11-font-mono);
  font-size: 12px;
  letter-spacing: .05em;
  color: var(--f11-meta);
}

.f11-row__city {
  grid-area: city;
  font-family: var(--f11-font-mono);
  font-size: 12px;
  color: var(--f11-meta);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.f11-row__find {
  grid-area: find;
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-inline-size: 0;
}

.f11-row__chips {
  display: flex;
  gap: 5px;
  min-inline-size: 0;
  overflow: hidden;
  filter: blur(3.6px);
  opacity: var(--f11-chips-dim);
  user-select: none;
  pointer-events: none;
  mask-image: linear-gradient(to right, rgb(0 0 0) 74%, transparent 100%);
  -webkit-mask-image: linear-gradient(to right, rgb(0 0 0) 74%, transparent 100%);
}

.f11-chip {
  background: var(--f11-danger-bg);
  color: var(--f11-danger);
  border-radius: var(--f11-r-chip);
  padding: 3px 8px;
  font-family: var(--f11-font-mono);
  font-size: 11px;
  white-space: nowrap;
}

.f11-row__cap {
  font-family: var(--f11-font-mono);
  font-size: 10.5px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--f11-danger);
}

.f11-row__go {
  grid-area: go;
  font-family: var(--f11-font-mono);
  font-size: 12.5px;
  color: var(--f11-brand);
  white-space: nowrap;
  text-align: end;
}

.f11-feed .f11-row__go-icon {
  display: inline-block;
  inline-size: 1em;
  block-size: 1em;
  margin-inline-end: var(--space-1);
  fill: currentColor;
  vertical-align: -.125em;
}

.f11-row__sweep {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(
    90deg,
    transparent 0%,
    color-mix(in srgb, var(--f11-accent) 24%, transparent) 46%,
    transparent 100%
  );
  animation: f11-sweep 1s cubic-bezier(.32, .72, .36, 1) 1 forwards;
}

@keyframes f11-sweep {
  0%   { transform: translateX(-105%); opacity: 0; }
  14%  { opacity: 1; }
  100% { transform: translateX(105%); opacity: 0; }
}

.f11-feed__foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 22px;
  border-block-start: 1px solid var(--f11-line-2);
  background: var(--f11-surface-2);
}

.f11-feed .f11-feed__toggle {
  appearance: none;
  border: 1px solid var(--f11-line-6);
  background: var(--f11-surface);
  border-radius: var(--f11-r-pill);
  padding: 9px 18px;
  font-family: var(--f11-font-mono);
  font-size: 12px;
  color: var(--f11-brand);
  cursor: pointer;
}

@media (hover: hover) {
  .f11-feed .f11-feed__toggle:hover {
    background: var(--f11-brand-tint);
    border-color: var(--f11-brand);
  }
}

.f11-feed__note {
  font-family: var(--f11-font-mono);
  font-size: 11.5px;
  color: var(--f11-meta);
}

@container f11feed (max-width: 749.98px) {
  
  .f11-row { max-block-size: var(--f11-row-h-c); }
  .f11-row--collapsed { max-block-size: 0; }

  .f11-row__inner {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "when city"
      "id   id"
      "find go";
    gap: 8px 10px;
  }

  .f11-row__city { text-align: end; }
  .f11-row__find { flex-direction: row; align-items: center; }
  .f11-row__chips { mask-image: none; -webkit-mask-image: none; }

  .f11-feed .f11-row__cap {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }
}

@container f11 (max-width: 719.98px) {
  .f11-feed {
    border-radius: var(--f11-r-md);
    box-shadow: var(--f11-shadow-c);
  }

  .f11-feed__head { padding: 13px 16px; gap: 12px; }
  .f11-feed__live { gap: 8px; font-size: 11px; }
  .f11-feed__auto { display: none; }

  .f11-row__inner { padding: 14px 16px; }

  .f11-row__when { font-size: 11.5px; }
  .f11-row__id { gap: 2px; }
  .f11-row__city { font-size: 11.5px; }
  .f11-row__vin { font-size: 11.5px; letter-spacing: .04em; }

  .f11-row__chips { filter: blur(3.4px); }
  .f11-chip { font-size: 10.5px; }
  .f11-row__go { font-size: 12px; }

  .f11-feed__foot { padding: 13px 16px; }
  
  .f11-feed .f11-feed__toggle { inline-size: 100%; padding: 11px 16px; }
  .f11-feed__note { display: none; }
}

.f11-aside {
  display: flex;
  flex-direction: column;
  gap: 14px;
  background: var(--f11-surface);
  border: 1px solid var(--f11-line);
  border-radius: var(--f11-r-lg);
  padding: 24px;
  box-shadow: var(--f11-shadow);
}

@container f11 (min-width: 1350px) {
  .f11-aside {
    position: sticky;
    inset-block-start: 80px;
  }
}

.f11-aside__eyebrow {
  font-family: var(--f11-font-mono);
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--f11-meta);
}

.f11-aside .f11-aside__title {
  margin: 0;
  font-size: 23px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: -.02em;
  text-wrap: balance;
  color: var(--f11-ink);
}

.f11-aside .f11-aside__text {
  margin: 0;
  font-size: 14.5px;
  line-height: 1.5;
  color: var(--f11-muted);
  text-wrap: pretty;
}

.f11-aside__cta-wrap {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-block-start: 4px;
}

.f11-aside .f11-aside__cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  block-size: 56px;
  border-radius: var(--f11-r-cta);
  background: var(--f11-brand);
  color: var(--f11-surface);
  font-size: 16.5px;
  font-weight: 600;
  text-decoration: none;
}

.f11-aside .f11-aside__cta:visited { color: var(--f11-surface); }

.f11-aside__cta:focus-visible {
  background: var(--f11-brand-hover);
  color: var(--f11-surface);
}

@media (hover: hover) {
  .f11-aside .f11-aside__cta:hover {
    background: var(--f11-brand-hover);
    color: var(--f11-surface);
  }
}

.f11-aside__cta-arrow {
  font-family: var(--f11-font-mono);
  font-size: 15px;
}

.f11-aside__note {
  font-family: var(--f11-font-mono);
  font-size: 12px;
  line-height: 1.45;
  color: var(--f11-meta);
  text-align: center;
}

.f11-aside .f11-aside__list {
  list-style: none;
  margin: 0;
  padding: 16px 0 0;
  border-block-start: 1px solid var(--f11-line-2);
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.f11-aside__item {
  display: flex;
  align-items: flex-start;
  gap: 9px;
}

.f11-aside__tick {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  inline-size: 15px;
  block-size: 15px;
  border-radius: 50%;
  background: var(--f11-brand-tint-2);
  color: var(--f11-accent);
  font-size: 9px;
  margin-block-start: 2px;
}

.f11-aside__item-text {
  font-size: 13.5px;
  line-height: 1.4;
  color: var(--f11-muted);
}

.f11-aside .f11-aside__trust {
  list-style: none;
  margin: 0;
  padding: 15px 0 0;
  border-block-start: 1px solid var(--f11-line-2);
  display: flex;
  flex-wrap: wrap;
  gap: 6px 18px;
  font-family: var(--f11-font-mono);
  font-size: 11.5px;
  color: var(--f11-meta);
}

@container f11 (max-width: 719.98px) {
  .f11-aside {
    gap: 12px;
    border-radius: var(--f11-r-md);
    padding: 18px;
    box-shadow: var(--f11-shadow-c);
  }

  .f11-aside .f11-aside__eyebrow,
  .f11-aside .f11-aside__text,
  .f11-aside .f11-aside__trust { display: none; }

  .f11-aside .f11-aside__title { font-size: 20px; }
  .f11-aside__cta-wrap { margin-block-start: 0; gap: 10px; }
  .f11-aside .f11-aside__cta { block-size: 54px; gap: 9px; }
  .f11-aside__note { font-size: 11.5px; }

  .f11-aside .f11-aside__list { padding-block-start: 14px; gap: 8px; }
  .f11-aside__item-text { font-size: 13px; }
}

.f12 {
  padding-block: 26px 28px;
  background: var(--f12-paper);
  color: var(--f12-ink);
  font-family: var(--f12-font-sans);
}

.f12__inner {
  max-inline-size: calc(460px + 2 * 16px);
  margin-inline: auto;
  padding-inline: 16px;
  display: flex;
  flex-direction: column;
  gap: 28px;
}

@media (min-width: 48rem) {
  .f12 {
    padding-block: clamp(56px, 7vw, 96px);
  }
  .f12__inner {
    max-inline-size: calc(1200px + 2 * clamp(16px, 3vw, 28px));
    padding-inline: clamp(16px, 3vw, 28px);
    gap: clamp(30px, 3.4vw, 46px);
  }
}

.f12 .f12__head {
  display: flex;
  flex-direction: column;
  gap: 14px;
  max-inline-size: 740px;
}

.f12 .f12__eyebrow {
  font-weight: 600;
  font-size: 12px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--f12-green);
}

.f12 .f12__title {
  margin: 0;
  font-family: var(--f12-font-sans);
  font-size: 27px;
  line-height: 1.1;
  font-weight: 700;
  letter-spacing: -0.03em;
  color: var(--f12-ink);
  text-wrap: balance;
}

.f12 .f12__lead {
  margin: 0;
  font-size: 15px;
  line-height: 1.55;
  color: var(--f12-ink-muted);
  text-wrap: pretty;
}

@media (min-width: 48rem) {
  .f12 .f12__title {
    font-size: clamp(30px, 4vw, 46px);
    line-height: 1.06;
  }
  .f12 .f12__lead {
    font-size: clamp(16px, 1.3vw, 18px);
  }
}

.f12 .f12__disclaimer {
  margin: 0;
  max-inline-size: 800px;
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--f12-ink-muted);
  text-wrap: pretty;
}

.f12-part {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.f12-part__head {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: clamp(12px, 1.4vw, 18px);
  padding-block-start: 14px;
  border-block-start: 3px solid var(--f12-green);
}

.f12-part__num {
  flex: 0 0 auto;
  inline-size: 42px;
  block-size: 42px;
  
  border-radius: var(--f12-r-chip);
  background: var(--f12-green);
  color: var(--f12-surface);
  display: grid;
  place-items: center;
  font-family: var(--f12-font-mono);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: -0.02em;
}

.f12-part__titles {
  flex: 1 1 260px;
  min-inline-size: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.f12-part__eyebrow {
  font-weight: 700;
  font-size: 10.5px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--f12-green);
}

.f12 .f12-part__title {
  margin: 0;
  font-family: var(--f12-font-sans);
  font-size: clamp(21px, 2vw, 27px);
  line-height: 1.15;
  font-weight: 700;
  letter-spacing: -0.025em;
  color: var(--f12-ink);
  text-wrap: balance;
}

.f12-part__meta {
  flex: 1 1 100%;
  font-size: 12px;
  line-height: 1.4;
  color: var(--f12-green-soft);
  text-align: start;
}

@media (min-width: 48rem) {
  .f12-part__meta {
    flex: 0 1 auto;
    font-size: 12.5px;
    text-align: end;
  }
}

.f12-on-dark {
  background: var(--f12-green);
  color: var(--f12-on-dark);
}

.f12 :focus-visible {
  outline: 3px solid var(--f12-green);
  outline-offset: 2px;
}

.f12 .f12-on-dark :focus-visible {
  outline-color: var(--f12-surface);
}

@keyframes f12-fade {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes f12-rise {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: none; }
}

.f12-anim-fade { animation: f12-fade .16s ease; }
.f12-anim-rise { animation: f12-rise .22s ease; }

@media (prefers-reduced-motion: reduce) {
  .f12 *,
  .f12 *::before,
  .f12 *::after {
    
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }

  .f12 .f12-anim-fade,
  .f12 .f12-anim-rise {
    
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

.f12-hero {
  position: relative;
  overflow: hidden;
  border-radius: var(--f12-r-lg);
  box-shadow: var(--f12-shadow-hero);
}

.f12-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    radial-gradient(circle, color-mix(in srgb, var(--f12-ok) 50%, transparent) 0%, transparent 68%),
    repeating-linear-gradient(
      115deg,
      color-mix(in srgb, var(--f12-surface) 5%, transparent) 0 1px,
      transparent 1px 22px
    );
  background-repeat: no-repeat, repeat;
  background-size: 420px 420px, auto;
  background-position: calc(100% + 140px) -140px, 0 0;
}

.f12-hero__grid {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
  align-items: start;
  padding-block: clamp(18px, 2vw, 26px) clamp(24px, 2.8vw, 34px);
  padding-inline: clamp(22px, 2.8vw, 38px);
}

.f12-hero__lede,
.f12-hero__proof {
  min-inline-size: 0;
  display: flex;
  flex-direction: column;
}

.f12-hero__lede { gap: clamp(16px, 1.8vw, 22px); }
.f12-hero__proof { gap: 16px; }

.f12 .f12-hero__title { 
  margin: 0;
  font-family: var(--f12-font-sans);
  font-size: 30px;
  font-weight: 700;
  line-height: 1.06;
  letter-spacing: -0.03em;
  color: var(--f12-surface);
}

.f12 .f12-hero__sub { 
  margin: 0;
  max-inline-size: 420px;
  font-size: clamp(14.5px, 1.2vw, 16px);
  line-height: 1.5;
  color: var(--f12-on-dark);
  text-wrap: pretty;
}

.f12 .f12-hero__plate {
  margin: 0;
  display: inline-flex;
  align-items: stretch;
  align-self: flex-start;
  max-inline-size: 100%;
  padding: 2px;
  border-radius: var(--f12-r-10);
  background: var(--f12-surface);
}

.f12-hero__plate-label {
  display: grid;
  place-items: center;
  padding-inline: clamp(8px, 2vw, 11px);
  border-start-start-radius: var(--f12-r-10);
  border-end-start-radius: var(--f12-r-10);
  font-family: var(--f12-font-mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.16em;
  background: var(--f12-green);
  color: var(--f12-surface);
}

.f12-hero__plate-vin {
  padding-block: 11px;
  padding-inline: clamp(8px, 2vw, 16px);
  font-family: var(--f12-font-mono);
  font-size: clamp(13px, 3.4vw, 18px);
  font-weight: 600;
  letter-spacing: clamp(0.04em, 0.5vw, 0.16em);
  white-space: nowrap;
  background: var(--f12-surface);
  color: var(--f12-ink);
}

.f12-hero__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.f12-hero__chip { 
  padding-block: 7px;
  padding-inline: 11px;
  border-radius: var(--f12-r-pill);
  font-size: 12.5px;
  font-weight: 500;
  background: color-mix(in srgb, var(--f12-surface) 10%, transparent);
  color: var(--f12-chip-ink);
}

.f12-hero__triptych {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}

.f12-hero__tile {
  position: relative;
  display: block;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border-radius: var(--f12-r-12);
}

.f12-hero__tile--ok {
  border: 1px solid color-mix(in srgb, var(--f12-surface) 24%, transparent);
}

.f12-hero__tile--bad { 
  border: 2px solid var(--f12-danger);
}

.f12 .f12-hero__tile-img {
  position: absolute;
  inset: 0;
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
}

.f12-hero__tint {
  position: absolute;
  inset: 0;
}

.f12-hero__tint--ok { background: color-mix(in srgb, var(--f12-ok) 30%, transparent); }
.f12-hero__tint--bad { background: color-mix(in srgb, var(--f12-danger) 32%, transparent); }

.f12-hero__badge {
  position: absolute;
  inset-inline-end: 6px;
  inset-block-end: 6px;
  display: grid;
  place-items: center;
  inline-size: 22px;
  block-size: 22px;
  border-radius: 50%;
}

.f12-hero__badge--ok { background: var(--f12-ok); }

.f12-hero__badge--bad {
  background: var(--f12-danger);
  color: var(--f12-surface);
  font-family: var(--f12-font-mono);
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
}

.f12-hero__check { 
  stroke: var(--f12-surface);
}

.f12 .f12-hero__caption { 
  margin: 0;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--f12-on-dark-aa);
}

.f12-hero__stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-block-start: 1px solid color-mix(in srgb, var(--f12-surface) 18%, transparent);
}

.f12-hero__stat {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-inline-size: 0;
  padding-block-start: 14px;
  padding-inline-end: clamp(4px, 1.6vw, 12px);
}

.f12-hero__stat + .f12-hero__stat {
  padding-inline-start: clamp(4px, 1.6vw, 12px);
  border-inline-start: 1px solid color-mix(in srgb, var(--f12-surface) 18%, transparent);
}

.f12-hero__stat:last-child { padding-inline-end: 0; }

.f12-hero__stat-value { 
  font-family: var(--f12-font-mono);
  font-size: clamp(22px, 2.2vw, 28px);
  font-weight: 600;
  letter-spacing: -0.03em;
  color: var(--f12-surface);
}

.f12-hero__stat-label { 
  max-inline-size: 76px;
  font-size: 12px;
  line-height: 1.35;
  color: var(--f12-on-dark-aa);
}

@media (min-width: 48rem) {
  .f12-hero__grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
    gap: clamp(24px, 3vw, 44px);
    align-items: center;
  }

  .f12 .f12-hero__title {
    max-inline-size: 11em;
    font-size: clamp(30px, 3.8vw, 48px);
    line-height: 1.02;
    letter-spacing: -0.035em;
  }
}

.f12 .f12-cards {
  margin: -14px -16px -20px;
  padding: 14px 16px 20px;
  display: flex;
  gap: 12px;
  list-style: none;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scroll-padding-inline: 16px;
  scrollbar-width: none;
}

.f12 .f12-cards::-webkit-scrollbar {
  display: none;
}

.f12 .f12-cards:focus-visible {
  outline-offset: -3px;
}

.f12-cards__item {
  flex: 0 0 76%;
  min-inline-size: 0;
  display: flex;
  scroll-snap-align: start;
}

@media (min-width: 48rem) {
  .f12 .f12-cards {
    --f12-cards-gap: clamp(12px, 1.4vw, 16px);
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(max(min(100%, 252px), (100% - 2 * var(--f12-cards-gap)) / 3), 1fr));
    gap: var(--f12-cards-gap);
    overflow-x: visible;
    scroll-snap-type: none;
  }

  .f12-cards__item {
    flex: initial;
  }
}

.f12 .f12-card {
  flex: 1;
  min-inline-size: 0;
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  overflow: hidden;
  text-align: start;
  font: inherit;
  font-family: var(--f12-font-sans);
  color: var(--f12-ink);
  background: var(--f12-surface);
  border: 1px solid var(--f12-line);
  border-radius: var(--f12-r-sm);
  box-shadow: var(--f12-shadow-card);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.f12 .f12-card[disabled] {
  -webkit-text-fill-color: currentColor;
  cursor: default;
}

.f12 .f12-card:not([disabled]) {
  cursor: pointer;
}

@media (hover: hover) {
  
  .f12 .f12-card:not([disabled]):hover {
    transform: translateY(-3px);
    box-shadow: var(--f12-shadow-lift);
    border-color: var(--f12-green);
  }
}

.f12-card__thumb {
  position: relative;
  display: block;
  aspect-ratio: 5 / 4;
  overflow: hidden;
  background: var(--f12-well);
  border-block-end: 1px solid var(--f12-line-soft);
}

.f12 .f12-card__img {
  position: absolute;
  inset: 0;
  display: block;
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
  object-position: top center;
}

.f12-card__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 15px 16px 16px;
}

.f12-card__label {
  display: block;
  font-size: 15.5px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.01em;
  min-block-size: 1.5em;
  color: var(--f12-ink); 
}

.f12-card__note {
  display: block;
  font-size: 12.5px;
  line-height: 1.45;
  color: var(--f12-ink-muted); 
  text-wrap: pretty;
}

.f12-card__bullets {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-block-start: 2px;
}

.f12-card__bullet {
  display: flex;
  align-items: baseline;
  gap: 8px;
  font-size: 12px;
  line-height: 1.35;
  color: var(--f12-ink-faint); 
}

.f12-card__dot {
  flex: 0 0 auto;
  inline-size: 4px;
  block-size: 4px;
  border-radius: 50%;
  background: var(--f12-mint-400);
  transform: translateY(-2px);
}

.f12-card__bullet-text {
  min-inline-size: 0;
}

.f12-card__foot {
  margin-block-start: auto;
  padding-block-start: 11px;
  border-block-start: 1px solid var(--f12-line-soft); 
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.f12-card__tier {
  flex: 0 1 auto;
  display: inline-flex;
  align-items: stretch;
  overflow: hidden;
  border: 1px solid var(--f12-mint-400); 
  border-radius: var(--f12-r-7);
  
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .65);
}

.f12-card__tier-half {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 8px;
}

.f12-card__tier-base {
  background: var(--f12-mint-100);
  border-inline-end: 1px solid var(--f12-mint-400);
  color: var(--f12-green);
}

.f12-card__tier-pro {
  background: var(--f12-honey-50);
  color: var(--f12-honey-ink);
}

.f12-card__tier-label {
  font-family: var(--f12-font-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
}

.f12 .f12-card__tier-icon {
  flex: 0 0 auto;
  inline-size: 10.5px;
  block-size: 10.5px;
}

.f12 .f12-card__tier-base .f12-card__tier-icon {
  fill: none;
  stroke: var(--f12-green); 
}

.f12 .f12-card__tier-pro .f12-card__tier-icon {
  fill: var(--f12-honey-icon); 
  stroke: var(--f12-honey-icon); 
}

.f12-card__cta {
  flex: 0 0 auto;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--f12-green); 
}

.f12-cards__pager {
  display: flex;
  align-items: center;
  gap: 10px;
}

@media (min-width: 48rem) {
  .f12-cards__pager {
    display: none;
  }
}

.f12-cards__hint {
  font-size: 12px;
  line-height: 1.4;
  color: var(--f12-green-soft); 
}

.f12-cards__rule {
  flex: 1;
  block-size: 1px;
  background: var(--f12-mint-200);
}

.f12 .f12-cards__arrow {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  inline-size: 44px;
  block-size: 44px;
  padding: 0;
  cursor: pointer;
  font-family: var(--f12-font-sans);
  font-size: 17px;
  line-height: 1;
  color: var(--f12-green);
  background: var(--f12-surface);
  border: 1px solid var(--f12-mint-200);
  border-radius: var(--f12-r-12);
}

.f12 .f12-cards__arrow[hidden] {
  display: none;
}

.f12 .f12-cards__arrow[aria-disabled='true'] {
  color: var(--f12-ink-faint);
  cursor: default;
}

@media (hover: hover) {
  
  .f12 .f12-cards__arrow:not([aria-disabled='true']):hover {
    background: var(--f12-mint-50);
    border-color: var(--f12-green);
  }
}

.f12-notice {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 18px;
  background: var(--f12-mint-50);
  border: 1px solid var(--f12-mint-200);
  border-radius: var(--f12-r-sm);
}

@media (min-width: 48rem) {
  .f12-notice {
    padding: clamp(18px, 2vw, 24px);
  }
}

.f12-notice__eyebrow {
  font-weight: 600;
  font-size: 11.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--f12-green); 
}

.f12 .f12-notice__title {
  margin: 0;
  font-family: var(--f12-font-sans);
  font-size: 15.5px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.01em;
  color: var(--f12-ink); 
  text-wrap: balance;
}

.f12 .f12-notice__body {
  margin: 0;
  max-inline-size: 820px;
  font-size: 14px;
  line-height: 1.55;
  color: var(--f12-ink-muted); 
  text-wrap: pretty;
}

@media (prefers-reduced-motion: no-preference) {
  .f12 .f12-cards {
    scroll-behavior: smooth;
  }
}

.f12-media {
  --f12-media-pad-i: clamp(18px, 2vw, 24px);
  --f12-media-pad-b: clamp(16px, 1.8vw, 22px);
  --f12-media-gap: 12px;
  --f12-media-rail: 10px;
  --f12-media-thumb: 72px;
}

@media (min-width: 48rem) {
  .f12-media {
    --f12-media-gap: 14px;
  }
}

.f12-media__panel {
  border: 1px solid var(--f12-line);
  border-radius: var(--f12-r-md);
  background: var(--f12-surface);
  overflow: hidden;
}

.f12-media__band {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding-block: var(--f12-media-pad-b);
  padding-inline: var(--f12-media-pad-i);
}

.f12-media__band--files {
  padding-block: var(--f12-media-pad-b) var(--f12-media-pad-i);
}

.f12 .f12-media__rule {
  border: 0;
  block-size: 1px;
  background: var(--f12-line-soft);
  margin-block: 0;
  margin-inline: var(--f12-media-pad-i);
}

.f12-media__bandhead {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 10px;
}

.f12-media__badge {
  flex: 0 0 auto;
  font-family: var(--f12-font-mono);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding-block: 5px;
  padding-inline: 10px;
  border-radius: var(--f12-r-pill);
  background: var(--f12-green);
  color: var(--f12-surface);
}

.f12 .f12-media__bandtitle {
  flex: 1 1 auto;
  min-inline-size: 0;
  margin: 0;
  font-family: var(--f12-font-sans);
  font-size: 15.5px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--f12-ink); 
  text-wrap: pretty;
}

.f12-media__bandnote {
  flex: 1 1 100%;
  font-size: 11.5px;
  line-height: 1.4;
  color: var(--f12-ink-faint); 
}

@media (min-width: 48rem) {
  .f12-media__bandnote {
    flex: 0 1 auto;
    margin-inline-start: auto;
    text-align: end;
  }
}

.f12-media__pair,
.f12-media__row {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--f12-media-gap);
}

.f12-media__row {
  align-items: start;
}

@media (min-width: 48rem) {
  .f12-media__pair,
  .f12-media__row {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
  }
}

.f12-media__card {
  position: relative;
  display: block;
  inline-size: 100%;
  padding: 0;
  border: 1px solid var(--f12-line-media); 
  border-radius: var(--f12-r-xs);
  overflow: hidden;
  aspect-ratio: 16 / 10;
  text-align: start;
  transition: border-color var(--dur-1) var(--ease), transform var(--dur-1) var(--ease);
}

.f12-media__card--four {
  aspect-ratio: 4 / 3;
}

.f12-media__card--dark {
  background: var(--f12-well-dark);
}

.f12-media__card--light {
  background: var(--f12-well);
}

.f12 .f12-media__card:disabled,
.f12 .f12-media__thumb:disabled,
.f12 .f12-media__more:disabled {
  cursor: default;
}

.f12 .f12-media__shot {
  position: absolute;
  inset: 0;
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
}

.f12-media__scrim {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(
    to top,
    color-mix(in srgb, var(--f12-ink) 86%, transparent) 0%,
    color-mix(in srgb, var(--f12-ink) 12%, transparent) 52%,
    color-mix(in srgb, var(--f12-ink) 6%, transparent) 100%
  );
}

.f12-media__disc {
  position: absolute;
  inset-inline-start: 50%;
  inset-block-start: 44%;
  transform: translate(-50%, -50%);
  inline-size: 62px;
  block-size: 62px;
  border-radius: 50%;
  background: var(--f12-surface);
  display: grid;
  place-items: center;
  box-shadow: 0 6px 18px -8px color-mix(in srgb, var(--f12-ink) 50%, transparent);
  pointer-events: none;
}

.f12 .f12-media__mark {
  inline-size: 40px;
  block-size: auto;
}

.f12-media__play {
  position: absolute;
  inset-inline-start: 50%;
  inset-block-start: 50%;
  transform: translate(-50%, -50%);
  inline-size: 58px;
  block-size: 58px;
  border-radius: 50%;
  background: var(--f12-surface);
  color: var(--f12-ink);
  display: grid;
  place-items: center;
  pointer-events: none;
}

.f12 .f12-media__playicon {
  
  margin-inline-start: 4px;
}

.f12-media__count {
  position: absolute;
  inset-inline-start: 50%;
  inset-block-start: 50%;
  transform: translate(-50%, -50%);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding-block: 9px;
  padding-inline: 11px 14px;
  border-radius: var(--f12-r-pill);
  background: var(--f12-surface);
  color: var(--f12-ink);
  box-shadow: 0 6px 18px -8px color-mix(in srgb, var(--f12-ink) 50%, transparent);
  pointer-events: none;
}

.f12-media__countnum {
  
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: 0.02em;
}

.f12-media__cardtext {
  position: absolute;
  inset-inline: 14px;
  inset-block-end: 13px;
  display: flex;
  flex-direction: column;
  gap: 3px;
  pointer-events: none;
}

.f12-media__cardlabel {
  font-size: 15px;
  font-weight: 600;
  color: var(--f12-surface); 
}

.f12-media__cardmeta {
  font-size: 11.5px;
  line-height: 1.35;
  color: var(--f12-on-dark-aa); 
}

.f12-media__stamp {
  position: absolute;
  inset-inline-start: 12px;
  inset-block-end: 11px;
  font-size: 11.5px;
  color: var(--f12-on-dark-aa); 
  pointer-events: none;
}

.f12-media__stamp--mono {
  
  font-family: var(--f12-font-mono);
}

.f12-media__block {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-inline-size: 0;
}

.f12-media__blockhead {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 10px;
}

.f12-media__tag {
  flex: 0 0 auto;
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding-block: 5px;
  padding-inline: 10px;
  border-radius: var(--f12-r-pill);
  background: var(--f12-ink);
  color: var(--f12-surface);
}

.f12 .f12-media__blocktitle {
  flex: 0 1 auto;
  min-inline-size: 0;
  margin: 0;
  font-family: var(--f12-font-sans);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--f12-ink); 
  text-wrap: pretty;
}

.f12-media__blockmeta {
  
  font-size: 11.5px;
  color: var(--f12-ink-faint); 
}

@media (min-width: 48rem) {
  .f12-media__blockmeta {
    margin-inline-start: auto;
  }
}

.f12 .f12-media__blockdesc {
  margin: 0;
  font-size: 13px;
  line-height: 1.45;
  color: var(--f12-ink-muted); 
  text-wrap: pretty;
}

@media (hover: hover) {
  .f12-media__card:not(:disabled):hover {
    border-color: var(--f12-green); 
    transform: translateY(-2px);
  }

  .f12-media__thumb:not(:disabled):hover {
    border-color: var(--f12-green); 
  }

  .f12-media__more:not(:disabled):hover {
    background-color: var(--f12-mint-50);
    border-color: var(--f12-green); 
  }
}

.f12 .f12-media__rail {
  display: flex;
  gap: var(--f12-media-rail);
  overflow-x: auto;
  
  overflow-y: clip;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  list-style: none;
  
  padding-block: 6px;
  padding-inline: 6px;
  margin-block: -6px;
  margin-inline: -6px;
  scroll-padding-inline: 6px;
}

.f12 .f12-media__rail::-webkit-scrollbar {
  display: none;
}

.f12-media__slot {
  flex: 0 0 92px;
  min-inline-size: 0;
  display: flex;
  scroll-snap-align: start;
}

@media (min-width: 48rem) {
  .f12 .f12-media__rail {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--f12-media-thumb)), 1fr));
    overflow-x: visible;
    overflow-y: visible;
    padding-block: 0;
    padding-inline: 0;
    margin-block: 0;
    margin-inline: 0;
  }
}

.f12-media__thumb {
  position: relative;
  inline-size: 100%;
  padding: 0;
  border: 2px solid transparent;
  border-radius: var(--f12-r-chip);
  overflow: hidden;
  background: var(--f12-well);
  aspect-ratio: 4 / 3;
  transition: border-color var(--dur-1) var(--ease);
}

.f12 .f12-media__thumb[aria-current='true'] {
  border-color: var(--f12-green); 
}

.f12 .f12-media__thumbimg {
  position: absolute;
  inset: 0;
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
}

.f12-media__more {
  inline-size: 100%;
  border: 1px dashed var(--f12-line-dash);
  border-radius: var(--f12-r-chip);
  background: var(--f12-paper);
  color: var(--f12-green);
  aspect-ratio: 4 / 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  padding-block: 0;
  padding-inline: 2px;
  transition: background-color var(--dur-1) var(--ease), border-color var(--dur-1) var(--ease);
}

.f12-media__morenum {
  font-family: var(--f12-font-mono);
  font-size: 17px;
  font-weight: 600;
  line-height: 1;
}

.f12-media__morelabel {
  font-size: 11px;
  font-weight: 600;
  line-height: 1.2;
}

.f12-agg__stats {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}

.f12-agg-stat {
  padding: clamp(18px, 1.9vw, 24px);
  border-radius: var(--f12-r-sm);
  background: var(--f12-surface);
  border: 1px solid var(--f12-line);
  
  border-block-start: 3px solid var(--f12-danger);
}

.f12-agg-stat__fig {
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.f12-agg-stat__value {
  font-family: var(--f12-font-mono);
  font-size: 32px;
  
  font-weight: 600;
  letter-spacing: -0.03em;
  line-height: 1;
  white-space: nowrap;
  color: var(--f12-danger-ink);
}

.f12-agg-stat__caption {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.f12-agg-stat__title {
  font-size: 15px;
  font-weight: 600;
  line-height: 1.3;
}

.f12-agg-stat__body {
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--f12-ink-muted);
  text-wrap: pretty;
}

.f12-agg-case {
  overflow: hidden;
  border-radius: var(--f12-r-md);
  background: var(--f12-danger-50);
  border: 1px solid var(--f12-danger-200);
}

.f12-agg-case__bar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  padding: 12px clamp(18px, 2vw, 26px);
  background: var(--f12-danger-ink);
}

.f12 .f12-agg-case__eyebrow {
  margin: 0;
  font-family: var(--f12-font-sans);
  font-size: 10.5px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--f12-surface);
}

.f12-agg-case__hairline {
  flex: 1;
  block-size: 1px;
  background: var(--f12-danger-200);
}

.f12-agg-case__tag {
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--f12-danger-100);
}

.f12-agg-case__body {
  padding: clamp(20px, 2.2vw, 28px);
  display: flex;
  flex-direction: column;
  gap: clamp(20px, 2.2vw, 26px);
}

.f12 .f12-agg-case__lede {
  margin: 0;
  font-size: clamp(18px, 1.8vw, 23px);
  font-weight: 700;
  line-height: 1.32;
  letter-spacing: -0.025em;
  max-inline-size: 30ch;
  text-wrap: balance;
}

.f12-agg-time {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  align-items: stretch;
}

.f12-agg-time__step {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-block-start: 14px;
  border-block-start: 2px solid var(--f12-mint-400);
}

.f12-agg-time__dot {
  position: absolute;
  inset-block-start: -6px;
  inset-inline-start: 0;
  inline-size: 10px;
  block-size: 10px;
  border-radius: 50%;
  background: var(--f12-surface);
  border: 2px solid var(--f12-mint-400);
}

.f12-agg-time__when {
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--f12-ink-muted);
}

.f12-agg-time__what {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.35;
  text-wrap: pretty;
}

.f12-agg-time__tag {
  align-self: flex-start;
  margin-block-start: auto;
  padding: 5px 8px;
  
  border-radius: var(--f12-r-6);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--f12-green);
  background: var(--f12-mint-100);
}

.f12-agg-time__step--danger {
  border-block-start-color: var(--f12-danger-ink);
}

.f12-agg-time__step--danger .f12-agg-time__dot {
  background: var(--f12-danger-ink);
  border-color: var(--f12-danger-ink);
}

.f12-agg-time__step--danger .f12-agg-time__tag {
  color: var(--f12-surface);
  background: var(--f12-danger-ink);
}

.f12-agg-case__close {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  align-items: stretch;
}

.f12 .f12-agg-case__note {
  margin: 0;
  align-self: center;
  font-size: 13.5px;
  line-height: 1.6;
  color: var(--f12-ink-muted);
  text-wrap: pretty;
}

.f12-agg-rail {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: clamp(16px, 1.8vw, 20px);
  border-radius: var(--f12-r-xs);
}

.f12-agg-rail__fig {
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.f12-agg-rail__value {
  font-family: var(--f12-font-mono);
  font-size: clamp(26px, 2.6vw, 32px);
  font-weight: 600;
  letter-spacing: -0.03em;
  line-height: 1;
  white-space: nowrap;
  color: var(--f12-surface);
}

.f12-agg-rail__label {
  font-size: 12.5px;
  line-height: 1.35;
}

.f12-agg-rail__sep {
  flex: none;
  align-self: stretch;
  inline-size: 1px;
  background: var(--f12-green-soft);
}

@media (min-width: 48rem) {
  .f12-agg__stats {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr));
    gap: 14px;
  }

  .f12-agg-time {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 178px), 1fr));
    gap: clamp(14px, 1.6vw, 22px);
  }

  .f12-agg-case__close {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
    gap: clamp(16px, 2vw, 24px);
  }
}

.f12-tier__panel {
  border-radius: var(--f12-r-lg);
  border: 1px solid var(--f12-mint-200);
  background: var(--f12-surface);
  overflow: hidden;
}

.f12-tier__head {
  padding: clamp(20px, 2.2vw, 28px) clamp(20px, 2.2vw, 28px) clamp(14px, 1.6vw, 18px);
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.f12-tier__eyebrow { 
  font-weight: 600;
  font-size: 11.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--f12-green);
}

.f12-tier .f12-tier__title { 
  margin: 0;
  font-family: var(--f12-font-sans);
  font-size: clamp(20px, 2vw, 26px);
  line-height: 1.15;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--f12-green);
  text-wrap: balance;
}

.f12-tier__grid {
  padding: 0 clamp(20px, 2.2vw, 28px) clamp(20px, 2.2vw, 28px);
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
  align-items: start;
}

@media (min-width: 48rem) {
  .f12-tier__grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
    gap: clamp(16px, 2vw, 28px);
  }
}

.f12-tier__col {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.f12-tier__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
}

.f12-tier__row {
  display: flex;
  align-items: center;
  gap: 12px;
  inline-size: 100%;
  min-block-size: 52px;
  padding: 8px 10px;
  border: 0;
  border-block-end: 1px solid var(--f12-divider-mint); 
  border-radius: var(--f12-r-chip);
  background: transparent;
  font: inherit;
  text-align: start;
  transition: background-color var(--dur-1) var(--ease);
}

.f12-tier__row:enabled {
  cursor: pointer;
}

@media (hover: hover) {
  .f12-tier__row:enabled:hover {
    background-color: var(--f12-hover-mint);
  }
}

.f12-tier__mark { 
  flex: 0 0 auto;
  inline-size: 26px;
  block-size: 26px;
  border-radius: var(--f12-r-chip);
  display: grid;
  place-items: center;
  background: var(--f12-green);
  border: 1.5px solid var(--f12-green);
}

.f12-tier__mark-svg {
  inline-size: 13px;
  block-size: 13px;
  display: block;
}

.f12-tier__icon {
  flex: 0 0 auto;
  inline-size: 28px;
  block-size: 28px;
  border-radius: var(--f12-r-chip);
  display: grid;
  place-items: center;
  background: var(--f12-mint-50);
}

.f12-tier__icon-svg {
  inline-size: 15px;
  block-size: 15px;
  display: block;
  stroke: var(--f12-green); 
}

.f12-tier__label { 
  flex: 1;
  min-inline-size: 0;
  font-size: 13.5px;
  font-weight: 500;
  line-height: 1.3;
  color: var(--f12-ink);
}

.f12-tier__mark-svg .f12-tier__tick {
  stroke: var(--f12-surface); 
}

.f12-tier__cross {
  display: none;
}

.f12-tier__free { 
  border-radius: var(--f12-r-xs);
  border: 1.5px dashed var(--f12-mint-500);
  background: var(--f12-hover-mint);
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.f12-tier__free-head {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.f12-tier__free-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 9px;
  border-radius: var(--f12-r-7);
  background: var(--f12-green);
}

.f12-tier__free-badge-text { 
  font-family: var(--f12-font-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--f12-surface);
}

.f12-tier__free-lede { 
  font-size: 13px;
  font-weight: 700;
  color: var(--f12-green);
}

.f12-tier__free-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.f12-tier__free-row {
  display: flex;
  align-items: center;
  gap: 9px;
}

.f12-tier__free-mark { 
  flex: 0 0 auto;
  inline-size: 20px;
  block-size: 20px;
  border-radius: var(--f12-r-6);
  display: grid;
  place-items: center;
  background: var(--f12-green);
  border: 1.5px solid var(--f12-green);
}

.f12-tier__free-mark-svg {
  inline-size: 11px;
  block-size: 11px;
  display: block;
  stroke: var(--f12-surface); 
}

.f12-tier__free-label { 
  flex: 1;
  min-inline-size: 0;
  font-size: 13px;
  line-height: 1.35;
  color: var(--f12-ink-body);
}

.f12-tier[data-tier="base"] .f12-tier__row[data-f12-pro="true"] .f12-tier__label { 
  color: var(--f12-ink-faint);
  text-decoration: line-through;
}

.f12-tier[data-tier="base"] .f12-tier__row[data-f12-pro="true"] .f12-tier__mark { 
  background: var(--f12-surface);
  border-color: var(--f12-off-mark-bd);
}

.f12-tier[data-tier="base"] .f12-tier__row[data-f12-pro="true"] .f12-tier__mark-svg .f12-tier__cross {
  stroke: var(--f12-off-icon-fg); 
}

.f12-tier[data-tier="base"] .f12-tier__row[data-f12-pro="true"] .f12-tier__icon {
  background: var(--f12-off-icon-bg);
}

.f12-tier[data-tier="base"] .f12-tier__row[data-f12-pro="true"] .f12-tier__icon-svg {
  stroke: var(--f12-off-icon-fg); 
}

.f12-tier[data-tier="base"] .f12-tier__row[data-f12-pro="true"] .f12-tier__tick {
  display: none;
}

.f12-tier[data-tier="base"] .f12-tier__row[data-f12-pro="true"] .f12-tier__cross {
  display: block;
}

.f12-tier__state[data-f12-row-state="off"] {
  display: none;
}

.f12-tier[data-tier="base"] .f12-tier__row[data-f12-pro="true"] .f12-tier__state[data-f12-row-state="on"] {
  display: none;
}

.f12-tier[data-tier="base"] .f12-tier__row[data-f12-pro="true"] .f12-tier__state[data-f12-row-state="off"] {
  display: inline;
}

.f12-tier__rail {
  border-radius: var(--f12-r-sm);
  padding: clamp(18px, 2vw, 24px);
  display: flex;
  flex-direction: column;
  gap: 14px;
  box-sizing: border-box;
  
  align-self: stretch;
}

.f12-tier__offer {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.f12-tier__name { 
  font-weight: 600;
  font-size: 11.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--f12-on-dark-aa);
}

.f12-tier__amount {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 10px;
}

.f12-tier__price { 
  font-family: var(--f12-font-mono);
  font-size: clamp(32px, 3.4vw, 42px);
  font-weight: 600;
  letter-spacing: -0.03em;
  line-height: 1;
  color: var(--f12-surface);
}

.f12-tier__period { 
  font-size: 13px;
  color: var(--f12-on-dark-aa);
}

.f12-tier .f12-tier__included { 
  margin: 0;
  font-size: 13.5px;
  line-height: 1.5;
  min-block-size: 3em;
  color: var(--f12-on-dark);
}

.f12-tier__pick {
  display: flex;
  flex-direction: column;
  gap: 12px;
  justify-content: center;
}

.f12-tier__pick-label { 
  font-weight: 600;
  font-size: 11.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--f12-on-dark-aa);
}

.f12-tier__switch {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 118px), 1fr));
  gap: 4px;
  padding: 4px;
  border-radius: var(--f12-r-xs);
  background: color-mix(in srgb, var(--f12-surface), transparent 92%);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--f12-mint-400), transparent 58%);
}

.f12-tier[data-tier="pro"] .f12-tier__switch {
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--f12-honey-400), transparent 58%);
}

.f12-tier__opt { 
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  padding: 12px 16px;
  min-block-size: 56px;
  border: 0;
  border-radius: var(--f12-r-chip);
  background: transparent;
  font: inherit;
  text-align: start;
  color: var(--f12-on-dark-aa);
  transition: background-color var(--dur-1) var(--ease), color var(--dur-1) var(--ease);
}

.f12-tier--js .f12-tier__opt {
  cursor: pointer;
}

.f12-tier__opt-name {
  font-size: 14px;
  font-weight: 600;
}

.f12-tier__opt-price { 
  font-family: var(--f12-font-mono);
  font-size: 12.5px;
  color: var(--f12-on-dark);
}

.f12-tier[data-tier="base"] .f12-tier__opt[data-f12-tier-set="base"] {
  background: var(--f12-mint-100);
  color: var(--f12-green);
  box-shadow: inset 0 0 0 1.5px var(--f12-mint-400);
}

.f12-tier[data-tier="base"] .f12-tier__opt[data-f12-tier-set="base"] .f12-tier__opt-price { 
  color: var(--f12-green-soft);
}

.f12-tier[data-tier="pro"] .f12-tier__opt[data-f12-tier-set="pro"] {
  background: var(--f12-honey-50);
  color: var(--f12-honey-ink);
  box-shadow: inset 0 0 0 1.5px var(--f12-honey-400);
}

.f12-tier[data-tier="pro"] .f12-tier__opt[data-f12-tier-set="pro"] .f12-tier__opt-price { 
  color: var(--f12-honey-icon);
}

.f12-tier .f12-tier__foot { 
  margin: 0;
  font-size: 12.5px;
  line-height: 1.5;
  min-block-size: 3em;
  color: var(--f12-on-dark-aa);
}

.f12-tier__actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.f12 .f12-tier .f12-tier__buy {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 15px 22px;
  min-block-size: 50px;
  border-radius: var(--f12-r-chip);
  background: var(--f12-surface);
  color: var(--f12-green);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.25;
  text-align: center;
  text-decoration: none;
  box-sizing: border-box;
  transition: background-color var(--dur-1) var(--ease);
}

@media (hover: hover) {
  .f12 .f12-tier .f12-tier__buy:hover {
    background-color: var(--f12-mint-50);
  }
}

.f12 .f12-tier .f12-tier__sample { 
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 20px;
  min-block-size: 48px;
  border-radius: var(--f12-r-chip);
  border: 1.5px solid color-mix(in srgb, var(--f12-surface), transparent 50%);
  background: transparent;
  color: var(--f12-surface);
  font: inherit;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.25;
  text-align: center;
  box-sizing: border-box;
  transition: background-color var(--dur-1) var(--ease), border-color var(--dur-1) var(--ease);
}

.f12 .f12-tier .f12-tier__sample:enabled {
  cursor: pointer;
}

@media (hover: hover) {
  .f12 .f12-tier .f12-tier__sample:enabled:hover {
    background-color: color-mix(in srgb, var(--f12-surface), transparent 88%);
    border-color: color-mix(in srgb, var(--f12-surface), transparent 40%);
  }
}

.f12-tier__after {
  margin-block-start: auto;
  padding-block-start: 16px;
  border-block-start: 1px solid color-mix(in srgb, var(--f12-surface), transparent 82%);
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.f12-tier__after-label { 
  font-weight: 600;
  font-size: 11.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--f12-on-dark-aa);
}

.f12-tier__after-list {
  display: flex;
  flex-direction: column;
  gap: 11px;
}

.f12-tier__after-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.f12-tier__after-icon { 
  flex: 0 0 auto;
  inline-size: 24px;
  block-size: 24px;
  border-radius: var(--f12-r-7);
  display: grid;
  place-items: center;
  background: color-mix(in srgb, var(--f12-surface), transparent 86%);
  color: var(--f12-surface);
}

.f12-tier__after-icon-svg {
  inline-size: 12.5px;
  block-size: 12.5px;
  display: block;
  stroke: var(--f12-surface); 
}

.f12-tier__after-body {
  flex: 1;
  min-inline-size: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.f12-tier__after-title { 
  font-size: 13px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--f12-surface);
}

.f12-tier__after-desc { 
  font-size: 12px;
  line-height: 1.4;
  color: var(--f12-on-dark);
}

.f12-tier__stack {
  display: grid;
}

.f12-tier__stack > .f12-tier__v {
  grid-row: 1;
  grid-column: 1;
}

.f12-tier[data-tier="base"] .f12-tier__v[data-f12-when="pro"],
.f12-tier[data-tier="pro"] .f12-tier__v[data-f12-when="base"] {
  visibility: hidden;
}

.f12-dlg,
.f12-lb {
  position: fixed;
  inset: 0;
  margin: 0;
  border: 0;
  inline-size: 100%;
  block-size: 100%;
  max-inline-size: none;
  max-block-size: none;
  padding: clamp(10px, 2vw, 22px);
  
  padding-block-end: max(clamp(10px, 2vw, 22px), env(safe-area-inset-bottom));
  background: transparent;
  color: var(--f12-on-dark-aa); 
  font-family: var(--f12-font-sans);
  overscroll-behavior: contain;
}

.f12-dlg[open],
.f12-lb[open] {
  display: flex;
  flex-direction: column;
}

.f12-dlg::backdrop {
  background: color-mix(in srgb, var(--f12-ink) 94%, transparent);
}

.f12-lb::backdrop {
  background: color-mix(in srgb, var(--f12-ink) 96%, transparent);
}

.f12-dlg__shell,
.f12-lb__shell {
  inline-size: 100%;
  max-inline-size: 1100px;
  margin-inline: auto;
  flex: 1;
  min-block-size: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.f12 .f12-dlg__head :focus-visible,
.f12 .f12-dlg__tabs :focus-visible,
.f12 .f12-dlg__foot :focus-visible,
.f12 .f12-dlg__stage:focus-visible,
.f12 .f12-lb :focus-visible {
  outline-color: var(--f12-surface); 
}

.f12-dlg__head,
.f12-lb__head {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}

.f12 .f12-dlg__title,
.f12 .f12-lb__title {
  
  margin: 0;
  flex: 1;
  min-inline-size: 0;
  font-family: var(--f12-font-sans);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--f12-on-dark-aa); 
}

.f12 .f12-dlg__close,
.f12 .f12-lb__close {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  inline-size: 42px;
  block-size: 42px;
  padding: 0;
  border: 0;
  
  border-radius: 50%;
  background: var(--f12-well-dark);
  color: var(--f12-surface);
  font: inherit;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
}

@media (hover: hover) {
  .f12 .f12-dlg__close:hover,
  .f12 .f12-lb__close:hover {
    background: var(--f12-green);
    color: var(--f12-surface);
  }
}

.f12-dlg__glyph {
  display: block;
  line-height: 1;
}

.f12-dlg__tabs {
  flex: 0 0 auto;
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding-block-end: 2px;
  overscroll-behavior-x: contain;
}

.f12 .f12-dlg__tab {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-block-size: 44px;
  padding: 10px 16px;
  border: 0;
  border-radius: var(--f12-r-pill); 
  background: var(--f12-well-dark);
  color: var(--f12-scroll-ground);
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
}

.f12 .f12-dlg__tab[aria-selected="true"] {
  background: var(--f12-green);
  color: var(--f12-surface);
}

.f12-dlg__tab-badge {
  font-size: 11px;
  font-weight: 400;
}

@media (hover: hover) {
  .f12 .f12-dlg__tab:hover {
    background: var(--f12-green-ink);
    color: var(--f12-surface);
  }

  .f12 .f12-dlg__tab[aria-selected="true"]:hover {
    background: var(--f12-green);
    color: var(--f12-surface);
  }
}

.f12-dlg__body {
  flex: 1;
  min-block-size: 0;
  display: flex;
  flex-direction: column;
  border-radius: var(--f12-r-16); 
  background: var(--f12-surface);
  overflow: hidden;
}

.f12-dlg__panel {
  flex: 1;
  min-block-size: 0;
  display: flex;
  flex-direction: column;
}

.f12-dlg__panel[hidden],
.f12-dlg__sec[hidden],
.f12-dlg__panobox[hidden],
.f12-dlg__vfail[hidden],
.f12-dlg__buy-title[hidden] {
  display: none;
}

.f12-dlg__chips {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 10px;
  border-block-end: 1px solid var(--f12-line-soft); 
}

.f12 .f12-dlg__nav {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  inline-size: clamp(34px, 10vw, 44px);
  block-size: 44px;
  padding: 0;
  border: 1px solid var(--f12-line);
  border-radius: var(--f12-r-9); 
  background: var(--f12-paper);
  color: var(--f12-ink);
  font: inherit;
  font-size: 15px;
  cursor: pointer;
}

@media (hover: hover) {
  .f12 .f12-dlg__nav:hover {
    border-color: var(--f12-green);
    background: var(--f12-surface);
    color: var(--f12-green);
  }
}

.f12-dlg__chips-rail {
  flex: 1;
  min-inline-size: 0;
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding-block: 2px;
  overscroll-behavior-x: contain;
}

.f12 .f12-dlg__chip {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-block-size: 40px;
  padding: 8px 13px;
  border: 1px solid var(--f12-line);
  border-radius: var(--f12-r-pill); 
  background: var(--f12-surface);
  color: var(--f12-ink-muted);
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
}

.f12 .f12-dlg__chip[aria-pressed="true"] {
  border-color: transparent;
  background: var(--f12-green);
  color: var(--f12-surface);
}

@media (hover: hover) {
  
  .f12 .f12-dlg__chip:hover {
    background: var(--f12-mint-50);
    color: var(--f12-green);
  }

  .f12 .f12-dlg__chip[aria-pressed="true"]:hover {
    background: var(--f12-green-ink);
    color: var(--f12-surface);
  }
}

.f12-dlg__chip-pro {
  padding: 2px 6px;
  border-radius: var(--f12-r-pill); 
  background: var(--f12-mint-50);
  color: var(--f12-green);
  font-family: var(--f12-font-mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.f12-dlg__scroll {
  flex: 1;
  min-block-size: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  background: var(--f12-scroll-ground);
  padding-block-start: 16px;
}

.f12-dlg__scroll--photos {
  background: var(--f12-surface);
  padding: 18px;
}

.f12-dlg__doc {
  max-inline-size: 760px;
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  padding: 0 12px 16px;
}

.f12-dlg__sec {
  display: flex;
  flex-direction: column;
}

.f12-dlg__tiles {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.f12-dlg__sec[data-family="carfax"] .f12-dlg__tiles {
  gap: 12px;
}

.f12 .f12-dlg__tile {
  display: block;
  inline-size: 100%;
  block-size: auto;
  border-radius: 0; 
  background: var(--f12-surface);
}

.f12 .f12-dlg__sec[data-family="carfax"] .f12-dlg__tile {
  border-radius: var(--f12-r-8); 
}

.f12-dlg__pro {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-block-start: 14px;
  padding: 16px 20px;
  border-radius: var(--f12-r-12); 
  background: var(--f12-green);
}

.f12-dlg__pro-eyebrow {
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--f12-on-dark-aa); 
}

.f12 .f12-dlg .f12-dlg__pro-body {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
  color: var(--f12-surface); 
}

.f12-dlg__buy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  margin-block-start: 14px;
  padding: 24px;
  border: 1px solid var(--f12-mint-200);
  border-radius: var(--f12-r-12); 
  background: var(--f12-surface);
}

.f12 .f12-dlg .f12-dlg__buy-title {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: var(--f12-ink); 
}

.f12 .f12-dlg .f12-dlg__buy-note {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
  color: var(--f12-ink-muted); 
}

.f12 .f12-dlg__buy-link,
.f12 .f12-dlg__foot-link {
  display: inline-flex;
  align-items: center;
  min-block-size: 46px;
  padding: 13px 22px;
  border-radius: var(--f12-r-11); 
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
}

.f12 .f12-dlg .f12-dlg__buy-link {
  background: var(--f12-green);
  color: var(--f12-surface);
}

@media (hover: hover) {
  .f12 .f12-dlg .f12-dlg__buy-link:hover {
    background: var(--f12-green-ink);
    color: var(--f12-surface);
    text-decoration: none;
  }
}

.f12 .f12-dlg .f12-dlg__note {
  flex: 0 0 auto;
  margin: 0;
  padding: 12px 18px;
  border-block-start: 1px solid var(--f12-line-soft);
  background: var(--f12-surface);
  color: var(--f12-ink-faint);
  font-size: 11.5px;
  line-height: 1.4;
}

.f12-dlg__stage {
  flex: 1;
  min-block-size: 0;
  position: relative;
  overflow: hidden;
  background: var(--f12-ink);
  cursor: grab;
  touch-action: pan-y;
}

.f12 .f12-dlg__frame,
.f12 .f12-dlg__poster,
.f12 .f12-dlg__video {
  position: absolute;
  inset: 0;
  inline-size: 100%;
  block-size: 100%;
  object-fit: contain;
}

.f12 .f12-dlg__video {
  background: transparent;
}

.f12-dlg__vmount,
.f12-dlg__panomount {
  position: absolute;
  inset: 0;
}

.f12-dlg__hint {
  position: absolute;
  inset-inline-start: 50%;
  inset-block-end: 16px;
  transform: translateX(-50%);
  max-inline-size: calc(100% - 32px);
  padding: 8px 14px;
  border-radius: var(--f12-r-pill); 
  background: var(--f12-ink);
  color: var(--f12-surface);
  font-size: 12px;
  line-height: 1.3;
  text-align: center;
  pointer-events: none;
}

.f12-dlg__rail {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 18px;
  border-block-start: 1px solid var(--f12-line-soft);
  background: var(--f12-surface);
}

.f12-dlg__rail-track {
  position: relative;
  flex: 1;
  block-size: 4px;
  border-radius: var(--f12-r-pill); 
  background: var(--f12-scroll-ground);
}

.f12-dlg__rail-dot {
  position: absolute;
  inset-block-start: -3px;
  inline-size: 10px;
  block-size: 10px;
  
  border-radius: 50%;
  background: var(--f12-green);
}

.f12-dlg__rail-num {
  flex: 0 0 auto;
  color: var(--f12-ink-faint); 
  font-size: 11.5px;
}

.f12-dlg__panobox {
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.f12 .f12-dlg__panoimg {
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  block-size: 100%;
  inline-size: auto;
  min-inline-size: 200%;
  max-inline-size: none;
  user-select: none;
  pointer-events: none;
}

.f12 .f12-dlg .f12-dlg__vfail {
  position: absolute;
  inset-inline: 16px;
  inset-block-end: 16px;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  padding: 12px 16px;
  border-radius: var(--f12-r-10); 
  background: var(--f12-ink);
}

.f12-dlg__vfail-text {
  color: var(--f12-danger-100); 
  font-size: 12px;
  line-height: 1.4;
}

.f12 .f12-dlg .f12-dlg__vfail-link {
  color: var(--f12-surface); 
  font-size: 12px;
  font-weight: 600;
  text-decoration: underline;
}

.f12-dlg__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(46%, 168px), 1fr));
  grid-auto-rows: max-content;
  align-content: start;
  gap: 12px;
}

.f12 .f12-dlg__cell {
  position: relative;
  aspect-ratio: 4 / 3;
  padding: 0;
  border: 0;
  border-radius: var(--f12-r-10); 
  background: var(--f12-well);
  overflow: hidden;
  cursor: zoom-in;
  font: inherit;
}

.f12 .f12-dlg__cell-img,
.f12 .f12-lb__thumb-img {
  display: block;
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
}

.f12-dlg__foot {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
  padding: 2px 4px 4px;
}

.f12-dlg__foot-note {
  color: var(--f12-chip-ink); 
  font-size: 13.5px;
  line-height: 1.4;
}

.f12 .f12-dlg .f12-dlg__foot-link {
  background: var(--f12-surface);
  color: var(--f12-green);
}

@media (hover: hover) {
  .f12 .f12-dlg .f12-dlg__foot-link:hover {
    background: var(--f12-mint-50);
    color: var(--f12-green);
    text-decoration: none;
  }
}

.f12-lb__stage {
  position: relative;
  flex: 1;
  min-block-size: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.f12 .f12-lb__img {
  max-inline-size: 100%;
  max-block-size: 100%;
  inline-size: auto;
  block-size: auto;
  border-radius: var(--f12-r-12); 
  object-fit: contain;
}

.f12 .f12-lb__step {
  position: absolute;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  inline-size: 52px;
  block-size: 52px;
  padding: 0;
  border: 0;
  
  border-radius: 50%;
  background: var(--f12-ink);
  color: var(--f12-surface);
  font: inherit;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}

.f12 .f12-lb__step--prev { inset-inline-start: 4px; }
.f12 .f12-lb__step--next { inset-inline-end: 4px; }

@media (hover: hover) {
  .f12 .f12-lb__step:hover {
    background: var(--f12-green);
    color: var(--f12-surface);
  }
}

.f12-lb__counter {
  position: absolute;
  inset-inline-start: 50%;
  inset-block-end: 10px;
  transform: translateX(-50%);
  max-inline-size: calc(100% - 32px);
  padding: 7px 14px;
  border-radius: var(--f12-r-pill); 
  background: var(--f12-ink);
  color: var(--f12-surface);
  font-size: 12px;
  line-height: 1.3;
  text-align: center;
}

.f12-lb__rail {
  flex: 0 0 auto;
  display: flex;
  align-items: stretch;
  gap: 8px;
  block-size: 74px;
}

.f12 .f12-lb__rail-nav {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  inline-size: clamp(34px, 10vw, 44px);
  padding: 0;
  border: 0;
  border-radius: var(--f12-r-8); 
  background: var(--f12-well-dark);
  color: var(--f12-surface);
  font: inherit;
  font-size: 15px;
  cursor: pointer;
}

@media (hover: hover) {
  .f12 .f12-lb__rail-nav:hover {
    background: var(--f12-green);
    color: var(--f12-surface);
  }
}

.f12-lb__rail-track {
  flex: 1;
  min-inline-size: 0;
  display: flex;
  gap: 8px;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  padding: 2px;
}

.f12 .f12-lb__thumb {
  flex: 0 0 auto;
  position: relative;
  inline-size: 84px;
  aspect-ratio: 4 / 3;
  padding: 0;
  border: 2px solid transparent;
  border-radius: var(--f12-r-8); 
  background: var(--f12-well-dark);
  overflow: hidden;
  cursor: pointer;
  font: inherit;
}

.f12 .f12-lb__thumb[aria-current="true"] {
  border-color: var(--f12-surface);
}

@media (min-width: 48rem) {
  .f12-dlg__doc {
    padding: 0 16px 24px;
  }

  .f12-dlg__grid {
    gap: 14px;
  }

  .f12-dlg__foot {
    padding: 2px 6px 6px;
  }
}

#faq.section-v2 {
  padding-block: 0;
}

.f18 {
  background: var(--f12-paper);
  color: var(--f11-ink);
  font-family: var(--font-head);
  padding-block: 40px 52px;
}

.f18 .f18-faq__head {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-block-end: 24px;
}

.f18 .f18-faq__title {
  margin: 0;
  font-family: var(--font-head);
  font-size: 31px;
  line-height: 1.08;
  letter-spacing: -.03em;
  font-weight: 700;
  color: var(--f11-ink);
  text-wrap: balance;
}

.f18 .f18-faq__subtitle {
  margin: 0;
  font-size: 15.5px;
  line-height: 1.55;
  color: var(--f12-ink-muted);
  text-wrap: pretty;
}

.f18 .f18-faq__grid {
  display: block;
}

.f18 .f18-faq__rail {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.f18 .f18-faq__eyebrow {
  margin: 0;
  font-family: var(--font-mono);
  font-size: 10.5px;
  line-height: 1.6;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--f11-meta);
}

.f18 .f18-faq__pills {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.f18 .f18-faq__pills-item {
  margin: 0;
  padding: 0;
}

.f18 .f18-faq__pill {
  appearance: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-block-size: 44px;
  padding-block: 0;
  padding-inline: 15px;
  border: 1px solid var(--f11-line-4);
  border-radius: var(--r-pill);
  background: transparent;
  font-family: var(--font-head);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: -.01em;
  white-space: nowrap;
  transition: background var(--dur-1) var(--ease),
              border-color var(--dur-1) var(--ease),
              color var(--dur-1) var(--ease);
}

.f18 .f18-faq__pill-label {
  color: var(--f12-ink-muted);
}

.f18 .f18-faq__pill-count {
  font-family: var(--font-mono);
  font-size: 11.5px;
  color: var(--f11-meta);
}

.f18 .f18-faq__pill[aria-pressed="true"] {
  background: var(--f12-green);
  border-color: var(--f12-green);
}
.f18 .f18-faq__pill[aria-pressed="true"] .f18-faq__pill-label {
  color: var(--surface);
}
.f18 .f18-faq__pill[aria-pressed="true"] .f18-faq__pill-count {
  color: var(--f18-count-on-accent);
}

@media (hover: hover) {
  .f18 .f18-faq__pill:not([aria-pressed="true"]):hover {
    background: var(--f18-row-hover);
  }
  .f18 .f18-faq__pill:not([aria-pressed="true"]):hover .f18-faq__pill-label {
    color: var(--f11-ink);
  }
}

.f18 .f18-faq__note {
  margin-block: 4px 6px;
  margin-inline: 0;
  font-family: var(--font-mono);
  font-size: 11.5px;
  line-height: 1.6;
  color: var(--f11-meta);
}

.f18 .f18-faq__list {
  border-block-start: 1px solid var(--f11-line-4);
}

.f18 .f18-faq__row {
  border-block-end: 1px solid var(--f11-line-4);
}

.f18 .f18-faq__bar {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding-block: 18px;
  padding-inline: 2px;
  cursor: pointer;
  list-style: none;
  text-align: start;
  font-family: var(--font-head);
}
.f18 .f18-faq__bar::-webkit-details-marker {
  display: none;
}

.f18 .f18-faq__num {
  flex: none;
  inline-size: 20px;
  font-family: var(--font-mono);
  font-size: 11.5px;
  line-height: 1.95;
  color: var(--f11-meta);
}

.f18 .f18-faq__q {
  flex: 1;
  min-inline-size: 0;
  font-size: 16.5px;
  line-height: 1.45;
  font-weight: 600;
  letter-spacing: -.018em;
  color: var(--f11-ink);
  text-wrap: pretty;
  
  overflow-wrap: anywhere;
}

.f18 .f18-faq__plus { 
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  inline-size: 26px;
  block-size: 26px;
  margin-block-start: 1px;
  border-radius: 50%;
  background: var(--f18-chip-idle);
  color: var(--f11-meta);
  font-size: 14px;
  transition: transform var(--dur-2) var(--ease),
              background var(--dur-2) var(--ease),
              color var(--dur-2) var(--ease);
}

.f18 .f18-faq__row[open] > .f18-faq__bar .f18-faq__plus {
  transform: rotate(45deg);
  background: var(--f12-green);
  color: var(--surface);
}

.f18 .f18-faq__row[open] > .f18-faq__bar .f18-faq__num {
  color: var(--f12-green);
}

@media (hover: hover) {
  .f18 .f18-faq__bar:hover {
    background: var(--f18-row-hover);
  }
}

.f18 .f18-faq__answer {
  padding-block: 0 22px;
  
  padding-inline: 32px 38px;
}

.f18 .f18-faq__answer p {
  margin: 0;
  font-size: 15px;
  line-height: 1.7;
  color: var(--f12-ink-muted);
  text-wrap: pretty;
  overflow-wrap: anywhere;
}

.f18 :focus-visible {
  outline: 3px solid var(--f12-green);
  outline-offset: 2px;
}

@media (min-width: 64rem) {
  .f18 {
    padding-block: 88px 96px;
  }

  .f18 .f18-faq__head {
    gap: 16px;
    max-inline-size: 760px;
    margin-block-end: 56px;
  }

  .f18 .f18-faq__title {
    font-size: 46px;
    line-height: 1.05;
  }

  .f18 .f18-faq__subtitle {
    font-size: 18px;
  }

  .f18--js .f18-faq__grid {
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: 64px;
    align-items: start;
  }

  .f18--js .f18-faq__rail {
    position: sticky;
    inset-block-start: calc(var(--header-h, 64px) + var(--space-4));
    gap: 18px;
  }

  .f18 .f18-faq__eyebrow {
    padding-inline-start: 14px;
  }

  .f18 .f18-faq__pills {
    flex-direction: column;
    flex-wrap: nowrap;
    gap: 4px;
  }

  .f18 .f18-faq__pill {
    display: flex;
    justify-content: space-between;
    inline-size: 100%;
    gap: 12px;
    padding-block: 13px;
    padding-inline: 14px;
    border: 0;
    border-radius: var(--r-chip);
    font-size: 15.5px;
    white-space: normal;
  }

  .f18 .f18-faq__pill-count {
    font-size: 12px;
  }

  .f18 .f18-faq__note {
    margin-block: 6px 0;
    padding-inline-start: 14px;
  }

  .f18 .f18-faq__bar {
    gap: 20px;
    padding-block: 24px;
    padding-inline: 6px;
  }

  .f18 .f18-faq__num {
    inline-size: 26px;
    font-size: 12.5px;
    line-height: 1.9;
  }

  .f18 .f18-faq__q {
    font-size: 19px;
  }

  .f18 .f18-faq__answer {
    padding-block: 0 28px;
    padding-inline: 52px;
  }

  .f18 .f18-faq__answer p {
    font-size: 16px;
    
    max-inline-size: 62em;
  }
}

#seo-text.section-v2 {
  padding-block: 0;
}

.f19 {
  background: var(--f11-bg);
  color: var(--f11-ink);
  font-family: var(--font-body);
  padding-block: 26px 40px;
}

.f19 .f19__inner {
  display: flex;
  flex-direction: column;
  gap: 26px;
}

.f19 .f19-seo__head {
  display: flex;
  flex-direction: column;
  gap: 22px;
  padding-block-end: 24px;
  border-block-end: 1px solid var(--f11-line-4);
}

.f19 .f19-seo__head-main {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.f19 .f19-seo__eyebrow {
  margin: 0;
}

.f19 .f19-seo__eyebrow-pill {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-family: var(--font-mono);
  font-size: 11.5px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--f11-brand);
  background: var(--f11-brand-tint);
  border-radius: var(--r-pill); 
  padding: 7px 14px;
}

.f19 .f19-seo__title {
  margin: 0;
  font-family: var(--font-head);
  font-size: 29px;
  line-height: 1.1;
  letter-spacing: -.025em;
  font-weight: 700;
  color: var(--f11-ink);
  text-wrap: balance;
}

.f19 .f19-seo__lede {
  margin: 0;
  font-size: 16px;
  line-height: 1.55;
  color: var(--f11-muted);
  text-wrap: pretty;
}

.f19 .f19-seo__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--f11-meta);
}

.f19 .f19-seo__meta-item {
  display: flex;
  align-items: center;
  gap: 10px;
}

.f19 .f19-seo__meta-item + .f19-seo__meta-item::before {
  content: "";
  inline-size: 4px;
  block-size: 4px;
  border-radius: 50%;
  background: var(--f12-line-dash);
  flex: none;
}

.f19 .f19-seo__brief {
  background: var(--surface);
  border: 1px solid var(--f11-line);
  border-radius: var(--r-card); 
  padding: 18px 20px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.f19 .f19-seo__brief-label {
  margin: 0;
  font-family: var(--font-mono);
  font-size: 10.5px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--f11-meta);
}

.f19 .f19-seo__brief-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 13px;
}

.f19 .f19-seo__brief-item {
  display: flex;
  align-items: flex-start;
  gap: 11px;
}

.f19 .f19-seo__brief-text {
  font-size: 14.5px;
  line-height: 1.5;
  color: var(--f19-ink-2);
  text-wrap: pretty;
}

.f19 .f19-seo__tick {
  inline-size: 16px;
  block-size: 16px;
  border-radius: 50%;
  background: var(--f11-brand-tint-2);
  color: var(--f11-accent);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 9px;
  margin-block-start: 3px;
  flex: none;
}

.f19 .f19-seo__grid {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.f19 .f19-seo__toc {
  box-sizing: border-box;
  background: var(--surface);
  border: 1px solid var(--f11-line);
  border-radius: var(--r-card); 
  padding: 16px 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.f19 .f19-seo__toc-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 0 10px 14px;
  border-block-end: 1px solid var(--f11-line-2);
}

.f19 .f19-seo__toc-label {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -.015em;
  color: var(--f11-ink);
}

.f19 .f19-seo__toc-count {
  margin: 0;
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--f11-meta);
}

.f19 .f19-seo__toc-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.f19 .f19-seo__toc-link {
  display: grid;
  grid-template-columns: 7px 20px 1fr;
  gap: 10px;
  align-items: start;
  box-sizing: border-box;
  min-block-size: 44px;
  padding: 12px 10px;
  border-radius: var(--r-chip); 
  font-size: 14px;
  line-height: 1.4;
  color: var(--f19-ink-body);
  text-decoration: none;
}

.f19 a.f19-seo__toc-link:visited {
  color: var(--f19-ink-body);
}

.f19 .f19-seo__toc-dot {
  inline-size: 7px;
  block-size: 7px;
  border-radius: 50%;
  margin-block-start: 5px;
  display: block;
  background: var(--f19-line-3);
  transition: background var(--dur-1) var(--ease);
}

.f19 .f19-seo__toc-link.is-open .f19-seo__toc-dot {
  background: var(--f11-accent);
}

.f19 .f19-seo__toc-num {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--f11-meta);
}

@media (hover: hover) {
  .f19 .f19-seo__toc-link:hover {
    background: var(--f19-panel);
    color: var(--f11-brand);
  }

  .f19 a.f19-seo__toc-link:hover {
    color: var(--f11-brand);
  }
}

.f19 .f19-seo__toggle-all {
  appearance: none;
  margin-block-start: 4px;
  min-block-size: 42px;
  border: 1px solid var(--f19-line-3); 
  border-radius: var(--r-chip); 
  background: var(--f11-bg);
  font-family: var(--font-body);
  font-size: 13.5px;
  font-weight: 600;
  color: var(--f11-brand);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition: background var(--dur-1) var(--ease), border-color var(--dur-1) var(--ease);
}

@media (hover: hover) {
  .f19 .f19-seo__toggle-all:hover {
    background: var(--f11-brand-tint);
    border-color: var(--f12-mint-200); 
  }
}

.f19 .f19-seo__article {
  display: flex;
  flex-direction: column;
  min-inline-size: 0;
}

.f19 .f19-seo__intro {
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding-block-end: 28px;
}

.f19 .f19-seo__intro-p {
  margin: 0;
  font-size: 15.5px;
  line-height: 1.68;
  color: var(--f19-ink-2);
  text-wrap: pretty;
}

.f19 .f19-seo__intro-p--lead {
  font-size: 16px;
  color: var(--f19-ink-body);
}

.f19 .f19-seo__sec {
  display: flex;
  flex-direction: column;
  border-block-start: 1px solid var(--f19-line-4);
}

.f19 .f19-seo__sec-bar {
  display: grid;
  grid-template-columns: 24px 1fr 30px;
  gap: 10px;
  align-items: center;
  padding-block: 20px;
  cursor: pointer;
  list-style: none;
  color: var(--f11-ink);
}

.f19 .f19-seo__sec-bar::-webkit-details-marker {
  display: none;
}

.f19 .f19-seo__sec-bar::marker {
  content: "";
}

.f19 .f19-seo__sec-num {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 400;
  color: var(--f11-brand);
}

.f19 .f19-seo__sec-title {
  margin: 0;
  font-family: var(--font-head);
  font-size: 20px;
  line-height: 1.28;
  letter-spacing: -.02em;
  font-weight: 700;
  color: inherit;
  text-wrap: balance;
}

.f19 .f19-seo__sec-chev {
  inline-size: 30px;
  block-size: 30px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--f11-brand);
  transition: background var(--dur-1) var(--ease), transform var(--dur-2) var(--ease);
}

.f19 .f19-seo__sec-chev::before {
  content: "";
  inline-size: 9px;
  block-size: 9px;
  margin-block-start: -4px;
  display: block;
  border-inline-end: 1.6px solid currentColor;
  border-block-end: 1.6px solid currentColor;
  transform: rotate(45deg);
}

.f19 .f19-seo__sec[open] > .f19-seo__sec-bar .f19-seo__sec-chev {
  transform: rotate(180deg);
}

@media (hover: hover) {
  .f19 .f19-seo__sec-bar:hover {
    color: var(--f11-brand);
  }

  .f19 .f19-seo__sec-bar:hover .f19-seo__sec-chev {
    background: var(--f11-brand-tint);
  }
}

.f19 .f19-seo__sec-body {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding-block-end: 28px;
}

.f19 .f19-seo__p {
  margin: 0;
  font-size: 15.5px;
  line-height: 1.68;
  color: var(--f19-ink-2);
  text-wrap: pretty;
  
  overflow-wrap: anywhere;
}

.f19 .f19-seo__rules {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 0 40px;
}

.f19 .f19-seo__rules-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-block: 13px;
  border-block-end: 1px solid var(--f19-line-2);
}

.f19 .f19-seo__rules-item:last-child {
  border-block-end: 0;
}

.f19 .f19-seo__rules-text {
  font-size: 15.5px;
  color: var(--f19-ink-body);
}

.f19 .f19-seo__bullet {
  inline-size: 6px;
  block-size: 6px;
  border-radius: 50%;
  display: block;
  flex: none;
}

.f19 .f19-seo__bullet--risk {
  background: var(--f12-danger);
}

.f19 .f19-seo__rules--gain .f19-seo__tick {
  inline-size: 15px;
  block-size: 15px;
  margin-block-start: 0;
}

.f19 .f19-seo__panel {
  background: var(--surface);
  border: 1px solid var(--f11-line);
  border-radius: var(--r-card); 
  padding: 20px 18px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.f19 .f19-seo__panel-label {
  margin: 0;
  font-family: var(--font-mono);
  font-size: 10.5px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--f11-brand-mid);
}

.f19 .f19-seo__ticks {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px 28px;
}

.f19 .f19-seo__ticks-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.f19 .f19-seo__ticks-item .f19-seo__tick {
  inline-size: 15px;
  block-size: 15px;
  margin-block-start: 2px;
}

.f19 .f19-seo__ticks-text {
  font-size: 15px;
  line-height: 1.45;
  color: var(--f19-ink-body);
}

.f19 .f19-seo__risks {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

.f19 .f19-seo__risk {
  background: var(--surface);
  border: 1px solid var(--f11-line);
  border-radius: var(--r-card); 
  padding: 20px 18px;
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.f19 .f19-seo__risk-num {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--f12-danger);
}

.f19 .f19-seo__risk-title {
  margin: 0;
  font-family: var(--font-head);
  font-size: 17.5px;
  font-weight: 600;
  letter-spacing: -.01em;
  color: var(--f11-ink);
}

.f19 .f19-seo__risk-text {
  margin: 0;
  font-size: 14.5px;
  line-height: 1.6;
  color: var(--f11-muted);
  text-wrap: pretty;
}

.f19 .f19-seo__specs {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 0 40px;
}

.f19 .f19-seo__specs-item {
  display: flex;
  align-items: center;
  gap: 14px;
  padding-block: 14px;
  border-block-end: 1px solid var(--f19-line-2);
}

.f19 .f19-seo__specs-item:last-child {
  border-block-end: 0;
}

.f19 .f19-seo__specs-num {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--f11-meta);
  flex: none;
}

.f19 .f19-seo__specs-text {
  font-size: 15px;
  color: var(--f19-ink-body);
}

.f19 .f19-seo__tiers {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

.f19 .f19-seo__tier {
  border-radius: var(--r-card); 
  padding: 20px 18px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.f19 .f19-seo__tier--free {
  background: var(--surface);
  border: 1px solid var(--f11-line);
}

.f19 .f19-seo__tier--full {
  background: var(--f11-brand);
}

.f19 .f19-seo__tier-label {
  margin: 0;
  font-family: var(--font-mono);
  font-size: 10.5px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--f11-meta);
}

.f19 .f19-seo__tier-title {
  margin: 0;
  font-family: var(--font-head);
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -.02em;
  line-height: 1.2;
  color: var(--f11-ink);
}

.f19 .f19-seo__tier-text {
  margin: 0;
  font-size: 15px;
  line-height: 1.65;
  color: var(--f11-muted);
  text-wrap: pretty;
}

.f19 .f19-seo__tier--full .f19-seo__tier-label {
  color: var(--f12-chip-ink);
}

.f19 .f19-seo__tier--full .f19-seo__tier-title {
  color: var(--surface);
}

.f19 .f19-seo__tier--full .f19-seo__tier-text {
  color: var(--f12-on-dark);
}

.f19 .f19-seo__steps {
  list-style: none;
  margin: 0;
  padding: 0;
  counter-reset: f19-step;
  display: flex;
  flex-direction: column;
}

.f19 .f19-seo__step {
  counter-increment: f19-step;
  position: relative;
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 18px;
  align-items: start;
  padding-block-end: 20px;
}

.f19 .f19-seo__step--last {
  padding-block-end: 0;
}

.f19 .f19-seo__step::before {
  content: counter(f19-step);
  inline-size: 34px;
  block-size: 34px;
  border-radius: 50%;
  background: var(--f11-brand-tint);
  color: var(--f11-brand);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-mono);
  font-size: 13px;
  flex: none;
}

.f19 .f19-seo__step--last::before {
  background: var(--f11-brand);
  color: var(--surface);
}

.f19 .f19-seo__step::after {
  content: "";
  position: absolute;
  inset-block-start: 40px;
  inset-block-end: 0;
  inset-inline-start: 17px;
  inline-size: 1px;
  background: var(--f19-line-3);
}

.f19 .f19-seo__step--last::after {
  content: none;
}

.f19 .f19-seo__step-text {
  font-size: 16px;
  line-height: 1.55;
  color: var(--f19-ink-body);
  padding-block-start: 6px;
}

.f19 .f19-seo__vin {
  background: var(--surface);
  border: 1px solid var(--f11-line);
  border-radius: var(--r-card); 
  padding: 18px 16px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.f19 .f19-seo__vin-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 14px;
}

.f19 .f19-seo__vin-group {
  display: flex;
  flex-direction: column;
  gap: 7px;
  flex: none;
}

.f19 .f19-seo__vin-part {
  margin: 0;
  font-family: var(--font-mono);
  font-size: 10.5px;
  letter-spacing: .16em;
  text-transform: uppercase;
  text-align: center;
}

.f19 .f19-seo__vin-part--brand { color: var(--f11-brand); }
.f19 .f19-seo__vin-part--plain { color: var(--f11-muted); }

.f19 .f19-seo__vin-brace {
  border-block-start: 1px solid var(--f19-line-3);
  border-inline: 1px solid var(--f19-line-3);
  border-start-start-radius: var(--r-ctl);
  border-start-end-radius: var(--r-ctl);
  block-size: 7px;
  display: block;
}

.f19 .f19-seo__vin-brace--brand {
  border-block-start-color: var(--f19-mint-line);
  border-inline-color: var(--f19-mint-line);
}

.f19 .f19-seo__vin-chars {
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.f19 .f19-seo__vin-char {
  inline-size: 26px;
  block-size: 36px;
  border-radius: var(--r-ctl); 
  font-family: var(--font-mono);
  font-size: 13px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  border: 1px solid var(--f11-line-4);
  background: var(--surface);
  color: var(--f11-ink);
}

.f19 .f19-seo__vin-char--brand {
  background: var(--f11-brand-tint);
  border-color: var(--f19-mint-line);
  color: var(--f11-brand);
}

.f19 .f19-seo__vin-char--check {
  background: var(--f19-panel);
  border-style: dashed;
  border-color: var(--f12-line-dash);
  color: var(--f11-meta);
}

.f19 .f19-seo__vin-char--year {
  background: var(--f11-danger-bg);
  border-color: var(--f12-danger-200); 
  color: var(--f11-danger);
}

.f19 .f19-seo__vin-char--plant {
  background: var(--f12-scroll-ground); 
  border-color: var(--f19-line-3);
  color: var(--f11-muted);
}

.f19 .f19-seo__vin-char--serial {
  color: var(--f11-meta);
}

.f19 .f19-seo__vin-legend {
  list-style: none;
  margin: 0;
  padding-block-start: 20px;
  padding-inline: 0;
  border-block-start: 1px solid var(--f11-line-2);
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px 28px;
}

.f19 .f19-seo__vin-legend-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.f19 .f19-seo__vin-swatch {
  inline-size: 12px;
  block-size: 12px;
  border-radius: 4px;
  display: block;
  margin-block-start: 3px;
  flex: none;
  border: 1px solid var(--f11-line-4);
  background: var(--surface);
}

.f19 .f19-seo__vin-swatch--brand {
  background: var(--f11-brand-tint);
  border-color: var(--f19-mint-line);
}

.f19 .f19-seo__vin-swatch--check {
  background: var(--f19-panel);
  border-style: dashed;
  border-color: var(--f12-line-dash);
}

.f19 .f19-seo__vin-swatch--year {
  background: var(--f11-danger-bg);
  border-color: var(--f12-danger-200);
}

.f19 .f19-seo__vin-swatch--plant {
  background: var(--f12-scroll-ground);
  border-color: var(--f19-line-3);
}

.f19 .f19-seo__vin-legend-text {
  font-size: 14px;
  line-height: 1.45;
  color: var(--f19-ink-body);
}

.f19 .f19-seo__vin-range {
  font-family: var(--font-mono);
  font-size: 12.5px;
  font-weight: 600;
}

.f19 .f19-seo__vin-range--brand  { color: var(--f11-brand); }
.f19 .f19-seo__vin-range--plain  { color: var(--f11-ink); }
.f19 .f19-seo__vin-range--check  { color: var(--f11-meta); }
.f19 .f19-seo__vin-range--year   { color: var(--f11-danger); }
.f19 .f19-seo__vin-range--plant  { color: var(--f11-muted); }
.f19 .f19-seo__vin-range--serial { color: var(--f11-meta); }

.f19 .f19-seo__origins {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

.f19 .f19-seo__origin {
  background: var(--surface);
  border: 1px solid var(--f11-line);
  border-radius: var(--r-card); 
  padding: 20px 18px;
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.f19 .f19-seo__origin-code {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: .14em;
  color: var(--f11-brand);
}

.f19 .f19-seo__origin-title {
  font-size: 17px;
  font-weight: 600;
  letter-spacing: -.01em;
  color: var(--f11-ink);
}

.f19 .f19-seo__origin-text {
  font-size: 14.5px;
  line-height: 1.6;
  color: var(--f11-muted);
  text-wrap: pretty;
}

.f19 .f19-seo__chips {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.f19 .f19-seo__chip {
  background: var(--surface);
  border: 1px solid var(--f11-line-4);
  border-radius: var(--r-pill); 
  padding: 11px 18px;
  font-size: 14.5px;
  color: var(--f19-ink-body);
}

.f19 .f19-seo__sub {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.f19 .f19-seo__sub-title {
  margin: 0;
  font-family: var(--font-head);
  font-size: 17.5px;
  font-weight: 600;
  letter-spacing: -.015em;
  color: var(--f11-ink);
}

.f19 .f19-seo__parts {
  list-style: none;
  margin: 0;
  padding: 0;
  background: var(--surface);
  border: 1px solid var(--f11-line);
  border-radius: var(--r-card); 
  overflow: hidden;
}

.f19 .f19-seo__part {
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 15px 18px;
  border-block-end: 1px solid var(--f11-line-2);
}

.f19 .f19-seo__part:last-child {
  border-block-end: 0;
}

.f19 .f19-seo__part-num {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--f11-meta);
}

.f19 .f19-seo__part-title {
  font-size: 15.5px;
  font-weight: 600;
  color: var(--f11-ink);
}

.f19 .f19-seo__part-text {
  font-size: 15px;
  line-height: 1.5;
  color: var(--f11-muted);
}

.f19 .f19-seo__flags {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

.f19 .f19-seo__flag {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  background: var(--f11-danger-bg);
  border-radius: var(--r-field); 
  padding: 16px 18px;
}

.f19 .f19-seo__flag-mark {
  inline-size: 8px;
  block-size: 8px;
  background: var(--f12-danger);
  transform: rotate(45deg);
  display: block;
  margin-block-start: 6px;
  flex: none;
}

.f19 .f19-seo__flag-text {
  font-size: 14.5px;
  line-height: 1.55;
  color: var(--f19-danger-ink);
  text-wrap: pretty;
}

.f19 :focus-visible {
  outline: 3px solid var(--f11-brand);
  outline-offset: 2px;
}

@media (min-width: 30rem) {
  .f19 .f19-seo__vin-char {
    inline-size: 30px;
    block-size: 40px;
    font-size: 15px;
  }

  .f19 .f19-seo__vin-chars {
    gap: 5px;
  }
}

@media (min-width: 48rem) {
  .f19 .f19-seo__rules,
  .f19 .f19-seo__risks,
  .f19 .f19-seo__tiers,
  .f19 .f19-seo__origins,
  .f19 .f19-seo__flags {
    grid-template-columns: 1fr 1fr;
  }

  .f19 .f19-seo__risk--wide {
    grid-column: span 2;
  }

  .f19 .f19-seo__specs {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: repeat(4, auto);
    grid-auto-flow: column;
  }

  .f19 .f19-seo__specs-item:nth-child(4) {
    border-block-end: 0;
  }

  .f19 .f19-seo__ticks,
  .f19 .f19-seo__vin-legend {
    grid-template-columns: 1fr 1fr;
  }

  .f19 .f19-seo__panel,
  .f19 .f19-seo__risk,
  .f19 .f19-seo__tier,
  .f19 .f19-seo__origin,
  .f19 .f19-seo__vin {
    padding: 22px 24px;
  }

  .f19 .f19-seo__part {
    display: grid;
    grid-template-columns: 38px 210px 1fr;
    gap: 18px;
    align-items: baseline;
    padding: 18px 26px;
  }
}

@media (min-width: 64rem) {
  .f19 {
    padding-block: 56px 64px;
  }

  .f19 .f19__inner {
    gap: 52px;
  }

  .f19 .f19-seo__head {
    display: grid;
    grid-template-columns: 1fr 400px;
    gap: 72px;
    align-items: end;
    padding-block-end: 40px;
  }

  .f19 .f19-seo__title {
    font-size: 46px;
    line-height: 1.06;
    letter-spacing: -.03em;
    
    max-inline-size: 16ch;
  }

  .f19 .f19-seo__lede {
    font-size: 19px;
    max-inline-size: 52ch;
  }

  .f19 .f19-seo__meta {
    gap: 22px;
    font-size: 12px;
    margin-block-start: 4px;
  }

  .f19 .f19-seo__meta-item {
    gap: 22px;
  }

  .f19 .f19-seo__brief {
    padding: 24px 26px;
    gap: 16px;
    box-shadow: var(--shadow-case);
  }

  .f19 .f19-seo__grid {
    display: grid;
    grid-template-columns: 238px 1fr;
    gap: 72px;
    align-items: start;
  }

  .f19 .f19-seo__aside {
    position: sticky;
    inset-block-start: calc(var(--header-h, 64px) + var(--space-4));
    align-self: start;
    min-block-size: 0;
  }

  .f19 .f19-seo__toc {
    max-block-size: calc(100vh - var(--header-h, 64px) - var(--space-4) - 28px);
    padding: 20px 14px 16px;
    gap: 12px;
    box-shadow: var(--shadow-case);
  }

  .f19 .f19-seo__toc-label {
    font-size: 15.5px;
  }

  .f19 .f19-seo__toc-nav {
    overflow: auto;
    min-block-size: 0;
  }

  .f19 .f19-seo__toc-list {
    gap: 2px;
  }

  .f19 .f19-seo__toc-link {
    grid-template-columns: 7px 22px 1fr;
    gap: 11px;
    min-block-size: 0;
    padding: 10px 12px;
    font-size: 13.5px;
  }

  .f19 .f19-seo__intro {
    padding-block-end: 44px;
  }

  .f19 .f19-seo__intro-p {
    font-size: 16.5px;
    line-height: 1.72;
    max-inline-size: 68ch;
  }

  .f19 .f19-seo__intro-p--lead {
    font-size: 17px;
  }

  .f19 .f19-seo__sec-bar {
    grid-template-columns: 30px 1fr 34px;
    gap: 16px;
    padding-block: 26px;
  }

  .f19 .f19-seo__sec-title {
    font-size: 30px;
    line-height: 1.18;
    letter-spacing: -.025em;
  }

  .f19 .f19-seo__sec-chev {
    inline-size: 34px;
    block-size: 34px;
  }

  .f19 .f19-seo__sec-body {
    gap: 20px;
    padding-block-end: 44px;
  }

  .f19 .f19-seo__p {
    font-size: 16.5px;
    line-height: 1.72;
    max-inline-size: 68ch;
  }

  .f19 .f19-seo__ticks,
  .f19 .f19-seo__vin-legend {
    grid-template-columns: 1fr 1fr 1fr;
  }

  .f19 .f19-seo__panel,
  .f19 .f19-seo__tier {
    padding: 26px 28px;
  }

  .f19 .f19-seo__tier-title {
    font-size: 22px;
  }

  .f19 .f19-seo__vin {
    padding: 28px 30px 26px;
    gap: 22px;
  }

  .f19 .f19-seo__vin-strip {
    gap: 18px;
  }

  .f19 .f19-seo__vin-char {
    inline-size: 42px;
    block-size: 54px;
    font-size: 20px;
  }

  .f19 .f19-seo__specs-text {
    font-size: 15.5px;
  }

  .f19 .f19-seo__sub-title {
    font-size: 20px;
  }

  .f19 .f19-seo__flags {
    gap: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}