/* REDLINE — motorsport editorial. Black, red, amber. Bebas Neue wordmark,
   DM Mono readouts, red heat off the hero. */
:root{--r:4px;--r-lg:6px;--r-btn:4px;--line:#252729;--line-2:#34373b}
body{font-weight:400}
body::before{content:'';position:fixed;inset:0;z-index:-2;pointer-events:none;background:
  radial-gradient(ellipse 70% 50% at 110% 10%,rgb(var(--accent-rgb) / .16),transparent 60%),
  radial-gradient(ellipse 50% 40% at -10% 90%,rgb(var(--accent-rgb) / .08),transparent 60%)}
h1,h2{letter-spacing:.02em;text-transform:uppercase;font-weight:400}
.eyebrow{color:var(--accent);font-family:var(--font-mono);display:flex;align-items:center;gap:.8rem}
.eyebrow::after{content:'';flex:0 0 40px;height:1px;background:var(--accent);opacity:.5}
.lede{color:var(--ink-3);font-weight:300}

.btn{letter-spacing:.06em;text-transform:uppercase;font-size:.84rem;font-weight:600}
.btn--lg{font-size:.92rem}
.btn--primary{background:var(--accent-fill,var(--accent));color:#fff;box-shadow:0 0 0 0 rgb(var(--accent-rgb) / .5)}
.btn--primary:hover{background:var(--accent-deep);box-shadow:0 12px 30px -12px rgb(var(--accent-rgb) / .8)}
.btn--ghost{border-color:var(--line-2)}
.btn--ghost:hover{border-color:var(--ink);background:rgb(255 255 255 / .04)}

.nav{background:linear-gradient(rgb(var(--bg-rgb) / .9),rgb(var(--bg-rgb) / 0))}
.nav.is-scrolled{background:rgb(var(--bg-rgb) / .88);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav__brand{font-size:1.35rem;letter-spacing:.06em;text-transform:uppercase}
.nav__brand .mark{color:var(--accent)}
.nav__links{font-family:var(--font-mono);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3)}
.nav__links a:hover{color:var(--ink)}
.lang-toggle{font-family:var(--font-mono)}
.menu{background:rgb(var(--bg-2-rgb) / .88);border-color:var(--line-2)}
.menu nav a{font-family:var(--font-mono);font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2)}
.menu nav a:hover{color:var(--ink)}
.menu__cta{border-color:var(--line)}
@media (max-width:899px){.nav__cta{padding:.6rem .9rem;font-size:.76rem}}

/* hero: the wordmark owns the screen; a tachometer runs off the right edge,
   amber needle, the red zone lit */
.hero{background:var(--bg)}
.hero__gauge{position:absolute;z-index:-1;right:clamp(.5rem,2.5vw,3.5rem);top:50%;width:min(46vw,680px);margin:0;translate:0 -50%;pointer-events:none;animation:gaugeIn 1.4s var(--ease) .2s both;
  --g-track:#34373b;--g-tick:#7d8288;--g-num:#d9d6d0;--g-needle:var(--amber);--g-hub:#0e0f10;--g-pin:var(--amber);--g-bezel:#1d1f21;--g-face:rgb(255 255 255 / .015);--g-font:var(--font-display);--g-num-size:34px}
.hero__gauge .hero__cap{display:none}
.hero__gauge .gauge__red{filter:drop-shadow(0 0 12px rgb(var(--accent-rgb) / .75))}
.hero__gauge .gauge__needle{filter:drop-shadow(0 0 8px rgb(245 166 35 / .55))}
.hero__gauge .gauge__hub{stroke:#34373b;stroke-width:1.5}
@keyframes gaugeIn{from{opacity:0;scale:.95}}
.hero__veil{background:linear-gradient(180deg,rgb(var(--bg-rgb) / .2),rgb(var(--bg-rgb) / .1) 50%,var(--bg))}
.hero__fx i:nth-child(1){inset:auto -20% -30% auto;width:70vw;height:70vw;border-radius:50%;background:radial-gradient(circle,rgb(var(--accent-rgb) / .22),transparent 60%);animation:heat 7s ease-in-out infinite alternate}
.hero__fx i:nth-child(2){left:-10%;top:60%;width:40vw;height:40vw;border-radius:50%;background:radial-gradient(circle,rgb(var(--accent-rgb) / .1),transparent 60%)}
.hero__fx i:nth-child(3){display:none}
@keyframes heat{from{transform:translate(0,0) scale(1)}to{transform:translate(-4%,-6%) scale(1.08)}}
.hero__grid{grid-template-columns:minmax(0,1fr)}
/* small laptops: smaller and lower, so the dial clears the wordmark */
@media (min-width:900px) and (max-width:1199px){.hero__gauge{width:40vw;translate:0 -32%;--g-num-size:30px}}
/* phones: the copy fills the screen, so a dial behind it fights the text.
   It sits in the flow instead, cropped to its top half like an instrument strip. */
@media (max-width:899px){.hero__gauge{position:relative;z-index:0;right:auto;top:auto;translate:none;width:min(100%,440px);aspect-ratio:400/226;overflow:hidden;margin:.6rem auto 0;--g-num-size:30px}}
.hero__title{line-height:.86;letter-spacing:.015em}
.hero__line--alt{color:var(--accent)}
.hero__sub{color:var(--ink-3);font-weight:300;font-size:1.05rem}
.hero__sub::first-line{color:var(--ink);font-weight:500}
.hero__badge{color:var(--amber);border-color:rgb(245 166 35 / .3);background:rgb(245 166 35 / .07);border-radius:999px}
.hero__badge::before{background:var(--amber)}
.hero__copy>*{opacity:0;animation:fadeUp .7s var(--ease) forwards}
.hero__copy>:nth-child(1){animation-delay:.1s}.hero__copy>:nth-child(2){animation-delay:.2s}.hero__copy>:nth-child(3){animation-delay:.35s}.hero__copy>:nth-child(4){animation-delay:.5s}.hero__copy>:nth-child(5){animation-delay:.6s}
@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
.decor--readout{display:grid;position:absolute;right:var(--gutter);bottom:2.2rem;gap:.15rem;font-family:var(--font-mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);text-align:right}
.decor--readout div{display:flex;justify-content:flex-end;gap:.8rem}
.decor--readout dt{color:var(--accent)}
.readout__cursor{display:none!important}
@media (max-width:899px){.decor--readout{display:none}}

/* credentials: a tight dark grid, the first one lit red */
.creds{background:var(--bg-2);border-block:1px solid var(--line);padding-block:clamp(3rem,7vw,5rem)}
.creds__grid{gap:2px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.cred{background:var(--bg-3);border-radius:var(--r)}
.cred:first-child{grid-column:1/-1;background:rgb(var(--accent-rgb) / .07);border-bottom:1px solid rgb(var(--accent-rgb) / .2)}
.cred__title{font-size:.95rem}
.cred__body{font-size:.86rem;color:var(--ink-3)}

/* services: readout rows */
.services__list{gap:3px}
.service{background:var(--bg-3);border:1px solid var(--line);border-radius:var(--r)}
.service__title{font-weight:500}
.service__detail{color:var(--ink-3);font-weight:300}

/* booking prompts: a lit plate with a red rule, the strip a red-tinted bar */
.cta__band{background:var(--bg-3);border-radius:var(--r-lg)}
.cta__rule{display:block;position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--accent)}
.cta__glow{display:block;position:absolute;right:-8%;bottom:-70%;width:48%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgb(var(--accent-rgb) / .3),transparent 62%);pointer-events:none}
.cta__title{letter-spacing:.02em}
.cta__sub{color:var(--ink-3);font-weight:300}
.cta__fine li:first-child{color:var(--amber)}
.cta__strip{border-color:rgb(var(--accent-rgb) / .35);background:rgb(var(--accent-rgb) / .07)}
.cta__strip:hover{border-color:var(--accent);background:rgb(var(--accent-rgb) / .12)}
.cta__strip-text{text-transform:uppercase;letter-spacing:.02em}
@media (max-width:899px){.cta__glow{right:-30%;bottom:-40%;width:90%}}

/* questions: readout rows, red plus */
.faq{background:var(--bg-2);border-block:1px solid var(--line)}
.faq__item{background:var(--bg-3);border-radius:var(--r)}
.faq__item[open]{border-color:rgb(var(--accent-rgb) / .5)}
.faq__q{font-weight:500}
.faq__a{color:var(--ink-3);font-weight:300}

/* what happens next, on the red band */
.book .steps__title{color:#fff}
.book .step__n{border-color:rgb(255 255 255 / .45);color:#fff;background:rgb(0 0 0 / .18)}
.book .step__body{color:#fff}

/* why: red-barred cards */
.why{background:var(--bg-2);border-block:1px solid var(--line)}
.about__item{background:var(--bg-3)}
.about__name b{letter-spacing:.03em}
.about__photo{border:1px solid var(--line-2)}
.reason{background:var(--bg-3);border-radius:var(--r)}
.reason__title{font-size:1rem;font-weight:600}
.reason__body{color:var(--ink-3);font-size:.9rem;font-weight:300}

/* gallery carousel: tight gutters, plated captions */
.carousel{--car-gap:3px}
.tile__btn{border-radius:var(--r);background:var(--bg-3)}
.tile__btn img{filter:saturate(.9)}
.tile:hover .tile__btn img{filter:saturate(1.1)}
.tile__meta{padding:.8rem 1rem;background:var(--bg-3);border-top:1px solid var(--line);margin-top:0;font-size:.8rem}
.tile__title{font-size:.86rem}
.tile__cap{color:var(--ink-3)}

/* area */
.area__tags li{background:var(--bg-3);border-color:var(--line);border-radius:999px;font-size:.78rem}
.area__tags li:hover{border-color:var(--accent)}

/* booking: a red band, a black form on top */
.book{background:var(--accent-fill);color:#fff;overflow:hidden}
.book .lede,.book .contact__body{color:#fff}
.book .contact__title{font-size:2rem;letter-spacing:.03em}
.book .contact__phone{color:#fff;font-size:clamp(2.6rem,6vw,4rem)}
.book .btn--ghost{border-color:rgb(255 255 255 / .55);color:#fff}
.book .btn--ghost:hover{background:rgb(255 255 255 / .12);border-color:#fff}
.book .contact__meta div{border-color:rgb(255 255 255 / .25)}
.book .contact__meta dt{color:#fff}
.form{background:var(--bg);color:var(--ink);border:0;box-shadow:0 40px 80px -30px rgb(0 0 0 / .7);border-radius:var(--r-lg)}
.form__group>legend{letter-spacing:.04em;text-transform:uppercase;font-size:1.4rem}
.form__step{color:var(--accent)}
.field>span,.field>legend>span{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.field input,.field select,.field textarea{background:var(--bg-2);border-color:var(--line)}
.form .btn--primary{width:100%;justify-content:center}
.form__note{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.06em}
.form__done{border-color:var(--accent);background:rgb(var(--accent-rgb) / .06)}

.foot{background:var(--bg);color:var(--ink-3);font-family:var(--font-mono);font-size:.8rem;letter-spacing:.06em}
.foot__brand{font-size:1.4rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink)}
.foot__brand .mark{color:var(--accent)}
.callbar{background:rgb(var(--bg-rgb) / .92)}