/* Automotoria — retro 80s theme */
@font-face{font-family:"Unbounded";font-style:normal;font-display:swap;font-weight:200 900;src:url(../fonts/unbounded-latin-wght-normal.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:"Unbounded";font-style:normal;font-display:swap;font-weight:200 900;src:url(../fonts/unbounded-latin-ext-wght-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Unbounded";font-style:normal;font-display:swap;font-weight:200 900;src:url(../fonts/unbounded-cyrillic-wght-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Manrope";font-style:normal;font-display:swap;font-weight:200 800;src:url(../fonts/manrope-latin-wght-normal.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-display:swap;font-weight:200 800;src:url(../fonts/manrope-latin-ext-wght-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Manrope";font-style:normal;font-display:swap;font-weight:200 800;src:url(../fonts/manrope-cyrillic-wght-normal.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-display:swap;font-weight:100 800;src:url(../fonts/jetbrains-mono-latin-wght-normal.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-display:swap;font-weight:100 800;src:url(../fonts/jetbrains-mono-latin-ext-wght-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-display:swap;font-weight:100 800;src:url(../fonts/jetbrains-mono-cyrillic-wght-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}

:root{
  --orange:#BE5103;
  --sun:#FFCE1B;
  --teal:#069494;
  --rust:#B7410E;
  --ink:#16110f;
  --ink-2:#211915;
  --ink-3:#2d221c;
  --cream:#F6EAD3;
  --muted:#bfae95;
  --line:rgba(246,234,211,.14);
  --wide:"Unbounded",system-ui,sans-serif;
  --body:"Manrope",system-ui,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,monospace;
  --radius:4px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ink);color:var(--cream);font-family:var(--body);font-size:17px;line-height:1.6;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3{margin:0;font-family:var(--wide);font-style:italic;font-weight:800;line-height:1.05;letter-spacing:-.02em;font-synthesis:style;text-transform:uppercase}
p{margin:0}
.wrap{width:100%;max-width:1200px;margin:0 auto;padding:0 24px}
.skip{position:absolute;left:-999px;top:8px;background:var(--sun);color:var(--ink);padding:8px 12px;z-index:100}
.skip:focus{left:8px}
:focus-visible{outline:2px solid var(--sun);outline-offset:3px}

/* subtle VHS scanlines over everything */
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:90;
  background:repeating-linear-gradient(0deg,rgba(0,0,0,.09) 0 1px,transparent 1px 3px);mix-blend-mode:multiply}

/* ---------- TOPBAR ---------- */
.topbar{position:sticky;top:0;z-index:50;background:rgba(22,17,15,.86);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.topbar__inner{display:flex;align-items:center;gap:32px;height:68px}
.topbar__logo img{height:26px;width:auto}
.topbar__nav{display:flex;gap:28px;margin-left:auto}
.topbar__nav a{font-family:var(--mono);text-transform:uppercase;letter-spacing:.12em;font-size:14px;text-decoration:none;color:var(--muted);transition:color .2s}
.topbar__nav a:hover{color:var(--sun)}

/* language dropdown */
.lang{position:relative}
.lang__btn{display:flex;align-items:center;gap:8px;background:transparent;border:1px solid var(--line);color:var(--cream);font-family:var(--mono);font-size:15px;letter-spacing:.1em;padding:8px 12px;border-radius:var(--radius);cursor:pointer;transition:border-color .2s}
.lang__btn:hover,.lang__btn[aria-expanded="true"]{border-color:var(--sun);color:var(--sun)}
.lang__btn svg{transition:transform .2s}
.lang__btn[aria-expanded="true"] svg{transform:rotate(180deg)}
.lang__menu{position:absolute;right:0;top:calc(100% + 8px);min-width:180px;margin:0;padding:6px;list-style:none;background:var(--ink-2);border:1px solid var(--line);border-top:3px solid var(--sun);border-radius:var(--radius);box-shadow:0 18px 40px rgba(0,0,0,.5)}
.lang__menu li{display:flex;gap:12px;align-items:center;padding:10px 12px;cursor:pointer;border-radius:2px;font-size:15px}
.lang__menu li span{font-family:var(--mono);color:var(--muted);width:24px}
.lang__menu li:hover,.lang__menu li.is-active{background:var(--ink-3)}
.lang__menu li[aria-selected="true"]{color:var(--sun)}
.lang__menu li[aria-selected="true"] span{color:var(--sun)}

/* ---------- HERO ---------- */
.hero{position:relative;min-height:calc(100vh - 68px);min-height:calc(100svh - 68px);display:flex;align-items:center;overflow:hidden;padding:72px 0 120px;
  background:linear-gradient(180deg,#1a1210 0%,#2a1712 45%,#5a2210 76%,#16110f 76.2%)}
.hero__sky{position:absolute;inset:0;pointer-events:none}
.sun{position:absolute;right:-8vw;top:14%;width:min(52vw,640px);aspect-ratio:1;border-radius:50%;
  background:linear-gradient(180deg,var(--sun) 0%,#FFB21B 30%,var(--orange) 62%,var(--rust) 100%);
  -webkit-mask:linear-gradient(180deg,#000 0 50%,transparent 50% 53%,#000 53% 60%,transparent 60% 64%,#000 64% 70%,transparent 70% 75%,#000 75% 80%,transparent 80% 86%,#000 86% 90%,transparent 90%);
          mask:linear-gradient(180deg,#000 0 50%,transparent 50% 53%,#000 53% 60%,transparent 60% 64%,#000 64% 70%,transparent 70% 75%,#000 75% 80%,transparent 80% 86%,#000 86% 90%,transparent 90%);
  filter:drop-shadow(0 0 60px rgba(255,160,27,.35))}
.grid{position:absolute;left:-50%;right:-50%;bottom:0;height:24%;
  background:
    linear-gradient(90deg,rgba(6,148,148,.75) 1px,transparent 1px) 0 0/60px 100%,
    linear-gradient(0deg,rgba(6,148,148,.75) 1px,transparent 1px) 0 0/100% 34px;
  transform:perspective(300px) rotateX(58deg);transform-origin:50% 0;
  -webkit-mask:linear-gradient(180deg,transparent,#000 35%);mask:linear-gradient(180deg,transparent,#000 35%);
  animation:drive 1.6s linear infinite}
@keyframes drive{to{background-position:0 0,0 34px}}
@media (prefers-reduced-motion:reduce){.grid{animation:none}html{scroll-behavior:auto}}

.hero__content{position:relative;z-index:2}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);text-transform:uppercase;letter-spacing:.18em;font-size:14px;color:var(--sun);margin-bottom:28px}
.dot{width:8px;height:8px;border-radius:50%;background:var(--sun);box-shadow:0 0 12px var(--sun)}
.hero__title{font-size:clamp(36px,5.8vw,84px);max-width:min(100%,800px);text-shadow:0 4px 30px rgba(22,17,15,.55)}
.hero__title span{display:block}
.hero__title .hero__title--hot{text-shadow:none}
.hero__title--hot{color:transparent;background:linear-gradient(180deg,var(--sun) 10%,var(--orange) 70%,var(--rust));-webkit-background-clip:text;background-clip:text;padding-right:.1em}
.hero__lead{margin-top:28px;max-width:560px;font-size:clamp(17px,1.6vw,20px);color:#e9dcc4}
.hero__cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:40px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 28px;font-family:var(--wide);font-weight:800;font-style:italic;text-transform:uppercase;letter-spacing:.04em;font-size:15px;text-decoration:none;border-radius:var(--radius);transition:transform .15s,box-shadow .15s,background .2s,color .2s}
.btn--sun{background:var(--sun);color:var(--ink);box-shadow:5px 5px 0 var(--rust)}
.btn--sun:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 var(--rust)}
.btn--ghost{border:2px solid var(--cream);color:var(--cream)}
.btn--ghost:hover{background:var(--cream);color:var(--ink)}

/* racing stripes */
.stripes{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;z-index:3}
.stripes i{display:block;height:10px}
.stripes i:nth-child(1){background:var(--sun)}
.stripes i:nth-child(2){background:var(--orange)}
.stripes i:nth-child(3){background:var(--rust)}
.stripes i:nth-child(4){background:var(--teal)}
.stripes--thin{position:static}
.stripes--thin i{height:5px}

/* ---------- DASH ---------- */
.dash{background:var(--ink-2);border-bottom:1px solid var(--line)}
.dash__grid{display:grid;grid-template-columns:repeat(3,1fr)}
.gauge{padding:34px 20px;border-left:1px solid var(--line);display:flex;flex-direction:column;gap:6px}
.gauge:first-child{border-left:0;padding-left:0}
.gauge b{font-family:var(--mono);font-weight:400;font-size:clamp(28px,3.4vw,42px);line-height:1;color:var(--sun);text-shadow:0 0 16px rgba(255,206,27,.45)}
.gauge span{font-family:var(--mono);font-size:13px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}

/* ---------- SECTION HEAD ---------- */
section{scroll-margin-top:68px}
.brands,.about,.contact{padding:110px 0}
.sec-head{max-width:720px;margin-bottom:56px}
.sec-head__num{font-family:var(--mono);color:var(--teal);font-size:15px;letter-spacing:.2em;margin-bottom:12px}
.sec-head__num::after{content:"";display:inline-block;width:48px;height:2px;background:var(--teal);vertical-align:middle;margin-left:12px}
.sec-head h2{font-size:clamp(38px,5.6vw,72px)}
.sec-head p:last-child{margin-top:20px;color:var(--muted);font-size:18px}

/* ---------- CARDS ---------- */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.card{--c:var(--teal);position:relative;display:flex;flex-direction:column;gap:16px;padding:32px 28px 28px;background:var(--ink-2);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:transform .2s,border-color .2s}
.card::before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:var(--c);box-shadow:0 6px 0 var(--ink-2),0 9px 0 var(--c)}
.card:hover{transform:translateY(-4px);border-color:var(--c)}
.card--teal{--c:var(--teal)}
.card--rust{--c:var(--rust)}
.card--orange{--c:var(--orange)}
.card--sun{--c:var(--sun)}
.card--lead{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;column-gap:48px;align-items:start}
.card--lead > *{grid-column:2}
.card--lead .card__top{grid-column:1;grid-row:1 / span 7;flex-direction:column;align-items:flex-start;gap:20px}
.card--lead .card__logo--sq{width:180px;height:180px}
.card__top{display:flex;flex-direction:column;align-items:flex-start;gap:16px;margin-top:8px;margin-bottom:6px}
.card__top > div:last-child{display:flex;flex-wrap:wrap;gap:6px}
.card--lead .card__top > div:last-child{justify-content:flex-start}
.card__logo{flex:none}
.card__logo--sq{width:88px;height:88px;border-radius:var(--radius);overflow:hidden}
.card__logo--sq img{width:100%;height:100%;object-fit:cover}
.card__logo--round{width:72px;height:72px}
.card__logo--wide{height:64px;display:flex;align-items:center;padding:0 16px;border-radius:var(--radius)}
.card__logo--wide img{height:30px;width:auto}
.card__logo--red{background:#E61E28}
.card__logo--word{background:var(--sun);color:var(--ink)}
.wordmark{font-family:var(--wide);font-weight:900;font-style:italic;font-size:24px;letter-spacing:-.02em;text-transform:lowercase}
.wordmark em{font-style:italic;color:var(--rust)}
.card__kicker{font-family:var(--mono);font-size:14px;letter-spacing:.14em;color:var(--c);text-transform:lowercase}
.card--sun .card__kicker{color:var(--sun)}
.card h3{font-size:clamp(22px,2.2vw,28px);}
.card--lead h3{font-size:clamp(28px,3.4vw,44px)}
.card p{color:#e3d5bc;font-size:16px}
.card__note{color:var(--muted)!important;font-size:15px!important;border-left:2px solid var(--c);padding-left:12px}
.ticks{list-style:none;margin:4px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px 16px}
.ticks li{position:relative;padding-left:20px;font-size:15px;font-weight:600}
.ticks li::before{content:"";position:absolute;left:0;top:.55em;width:10px;height:6px;background:var(--c);transform:skewX(-20deg)}
.card__link{margin-top:auto;padding-top:10px;font-family:var(--mono);font-size:15px;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;color:var(--c);align-self:flex-start}
.card--sun .card__link{color:var(--sun)}
.card__link:not(.card__link--off):hover{text-decoration:underline;text-underline-offset:4px}
.card__link--off{color:var(--muted)!important}

.badge{display:inline-block;font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;padding:5px 9px;border-radius:2px;white-space:nowrap}
.badge--live{background:rgba(6,148,148,.18);color:#3fd0cf;border:1px solid rgba(6,148,148,.6)}
.badge--live::before{content:"● ";color:#3fd0cf}
.badge--soon{background:rgba(255,206,27,.12);color:var(--sun);border:1px solid rgba(255,206,27,.5)}
.badge--flag{background:var(--sun);color:var(--ink);border:1px solid var(--sun)}

/* ---------- ABOUT ---------- */
.about{background:
  linear-gradient(180deg,var(--ink) 0%,transparent 20%,transparent 80%,var(--ink) 100%),
  repeating-linear-gradient(-45deg,rgba(183,65,14,.08) 0 2px,transparent 2px 22px),
  var(--ink-2)}
.about__grid{display:grid;grid-template-columns:1fr 1.1fr;gap:64px;align-items:start}
.values{list-style:none;margin:0;padding:0;display:grid;gap:18px}
.values li{position:relative;display:grid;grid-template-columns:64px 1fr;column-gap:20px;padding:24px;background:var(--ink);border:1px solid var(--line);border-radius:var(--radius)}
.values__n{grid-row:span 2;display:flex;align-items:center;justify-content:center;width:64px;height:64px;font-family:var(--wide);font-weight:900;font-style:italic;font-size:22px;color:var(--ink);background:var(--sun);border-radius:var(--radius)}
.values li:nth-child(2) .values__n{background:var(--teal);color:var(--cream)}

.values h3{font-size:20px;margin-bottom:6px;align-self:end}
.values p{color:var(--muted);font-size:16px}

/* ---------- CONTACT ---------- */
.contact__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.tile{display:flex;flex-direction:column;gap:14px;padding:30px 28px;min-height:220px;text-decoration:none;background:var(--ink-2);border:1px solid var(--line);border-radius:var(--radius);transition:background .2s,transform .2s,border-color .2s}
.tile:hover{background:var(--ink-3);border-color:var(--sun);transform:translateY(-3px)}
.tile__label{font-family:var(--mono);color:var(--teal);letter-spacing:.16em;text-transform:uppercase;font-size:13px}
.tile__value{font-family:var(--wide);font-weight:800;font-size:clamp(20px,2vw,25px);line-height:1.3;overflow-wrap:anywhere}
.tile__more{margin-top:auto;font-family:var(--mono);color:var(--sun);font-size:14px;letter-spacing:.08em;text-transform:uppercase}

/* ---------- FOOTER ---------- */
.footer{background:#0f0b0a}
.footer__inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px 32px;padding-top:40px;padding-bottom:40px;font-family:var(--mono);font-size:14px;color:var(--muted)}
.footer__logo{height:22px;width:auto;opacity:.9}
.footer__brands{letter-spacing:.06em}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1000px){
  .cards{grid-template-columns:1fr 1fr}
  .card--lead{display:flex}
  .card--lead .card__logo--sq{width:110px;height:110px}
  .about__grid{grid-template-columns:1fr;gap:32px}
}
@media (max-width:760px){
  body{font-size:16px}
  .wrap{padding:0 16px}
  .topbar__inner{gap:12px;height:60px}
  .topbar__nav{display:none}
  .topbar__logo img{height:20px}
  .lang{margin-left:auto}
  section{scroll-margin-top:60px}
  .hero{min-height:auto;padding:56px 0 110px}
  .sun{width:120vw;right:-50vw;top:4%;opacity:.55}
  .hero__title{font-size:8.6vw}
  .hero__cta .btn{flex:1 1 100%}
  .dash__grid{grid-template-columns:1fr 1fr}
  .gauge{padding:22px 12px}
  .gauge:first-child{grid-column:1/-1;border-bottom:1px solid var(--line)}
  .gauge:nth-child(2){border-left:0;padding-left:0}
  .values__n{font-size:17px!important}
  .brands,.about,.contact{padding:72px 0}
  .sec-head{margin-bottom:36px}
  .cards,.contact__grid{grid-template-columns:1fr}
  .card{padding:28px 20px 22px}
  .card__top{flex-wrap:wrap}
  .card__top > div:last-child{justify-content:flex-start}
  .ticks{grid-template-columns:1fr}
  .values li{grid-template-columns:48px 1fr;padding:18px;column-gap:16px}
  .values__n{width:48px;height:48px;font-size:24px}
  .tile{min-height:0}
  .footer__inner{flex-direction:column;align-items:flex-start}
}

.tile__value--sm{font-size:clamp(16px,1.45vw,19px);overflow-wrap:normal;white-space:nowrap}
.card:not(.card--lead) .ticks{grid-template-columns:1fr}
.ice-no{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:6px;font-family:var(--wide);font-style:italic;font-weight:800;text-transform:uppercase;font-size:clamp(18px,2vw,26px);line-height:1.15;color:var(--cream)}
.ice-no li:nth-child(2){color:#3fd0cf}
.ice-no li:nth-child(3){color:var(--teal)}
@media (max-width:1000px){.ice-no{display:none}}
