/* NICHU AUTO V4 — typography, complete brand lockup and cinematic entry */
:root{
  --font-zh:"Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
  --font-ja:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
  --font-latin:"Manrope","Helvetica Neue",Arial,sans-serif;
  --sans:var(--font-zh);
  --serif:var(--font-latin);
  --display:var(--font-latin);
  --v4-red:#be212b;
  --v4-cream:#f5f2ec;
  --v4-black:#07080a;
  --v4-ease:cubic-bezier(.16,1,.3,1);
}
html[lang="zh-CN"]{--sans:var(--font-zh)}
html[lang="ja"]{--sans:var(--font-ja)}
body{font-family:var(--sans);font-weight:400;letter-spacing:.012em;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;z-index:9999;inset:0;pointer-events:none;opacity:.022;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E");mix-blend-mode:multiply}
.eyebrow,.topline,.hero-label,.hero-vertical,.hero-aside-title,.inventory-count,.brand-stat small,.footer-col h4,.modal-specs small,.modal-price small,.page-nav a,.field label{font-family:var(--font-latin)}

/* complete logo lockup */
.brand-lockup{gap:13px;min-width:196px}
.brand-mark{width:47px;height:47px;display:grid;place-items:center;flex:0 0 auto}
.brand-mark img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 0 18px rgba(255,255,255,.06))}
.brand-wordmark{display:flex;flex-direction:column;line-height:1}
.brand-wordmark strong{font-family:var(--font-latin);font-size:15px;line-height:1;letter-spacing:.18em;font-weight:800;white-space:nowrap}
.brand-wordmark strong span{color:#fff}.brand-wordmark strong i{font-style:normal;color:#dd2b36;margin-left:.38em}
.brand-wordmark small{font-family:var(--sans);font-size:8px;line-height:1;margin-top:8px;letter-spacing:.16em;color:rgba(255,255,255,.54);white-space:nowrap}
.footer-lockup{display:flex;align-items:center;gap:15px;margin-bottom:22px}.footer-lockup>img{width:58px;height:58px;object-fit:contain}.footer-lockup>div{display:flex;flex-direction:column;line-height:1}.footer-lockup strong{font-family:var(--font-latin);font-size:18px;letter-spacing:.18em}.footer-lockup strong span{color:#fff}.footer-lockup strong i{color:#dc303a;font-style:normal;margin-left:.34em}.footer-lockup small{margin-top:9px;font-size:9px;letter-spacing:.14em;color:rgba(255,255,255,.48)}
.footer-brand>img{display:none!important}

/* typography refinement */
.nav-links{gap:37px}.nav-links a{font-size:11px;letter-spacing:.055em;font-weight:500}
.nav-pill{letter-spacing:.11em;font-family:var(--font-latin)}
.hero-grid{padding-top:220px;padding-bottom:106px}
.hero-copy{max-width:940px}
.hero h1{font-family:var(--display);font-weight:700;font-size:clamp(72px,8.85vw,145px);line-height:.88;letter-spacing:-.047em;text-transform:none}
.hero h1 em{font-family:var(--display);font-style:normal;font-weight:500;letter-spacing:-.045em;color:#e0323d}
.hero-sub{max-width:670px;font-size:14px;line-height:2.02;letter-spacing:.035em;color:rgba(255,255,255,.67)}
.hero-aside-row b{font-family:var(--sans);font-size:20px;font-weight:600;letter-spacing:.035em}.hero-aside-row small{font-family:var(--font-latin);letter-spacing:.15em}
.hero-giant{font-family:var(--display);font-weight:800;letter-spacing:-.08em;bottom:-20px}
.marquee-item{font-family:var(--font-latin);font-style:normal;font-weight:500;letter-spacing:.08em;font-size:18px;text-transform:uppercase;padding:17px 36px}
.section-head h2,.brand-intro h2,.promise-copy h2,.business-title h3,.showroom-copy h2,.contact-grid h2,.modal-content h2,.contact-drawer h2,.inner-hero h1,.content-grid h2,.service-info-card h3{font-family:var(--sans);font-weight:600;letter-spacing:-.025em;line-height:1.08}
.section-head h2{font-size:clamp(48px,5.7vw,88px);margin-top:24px}.section-head p,.brand-intro-bottom p,.content-grid p{line-height:2;letter-spacing:.025em}
.brand-intro h2{font-size:clamp(47px,5.6vw,86px);line-height:1.12}.brand-intro h2 span{display:inline-block;margin-top:.08em}
.brand-stat strong{font-family:var(--font-latin);font-weight:500;letter-spacing:-.04em}
.vehicle-title{font-family:var(--sans)!important;font-size:30px!important;line-height:1.22!important;letter-spacing:-.02em!important;font-weight:650!important}.vehicle-price{font-family:var(--font-latin)}
.promise-copy .big-en{font-family:var(--font-latin);font-weight:800;letter-spacing:-.08em}.promise-copy h2{line-height:1.18}.promise-row b{font-family:var(--sans);letter-spacing:.02em}
.business-title small,.big-en{font-family:var(--font-latin)}.business-title h3{font-size:clamp(32px,3.5vw,54px);line-height:1.12}.business-content p{line-height:1.95;letter-spacing:.02em}
.process-card b{font-family:var(--font-latin);font-weight:500}.process-card h3{font-family:var(--sans);line-height:1.3;letter-spacing:.01em}
.showroom-copy h2{line-height:1.08}.contact-grid h2{line-height:1.02}
.inner-hero h1{line-height:.96;letter-spacing:-.035em}.modal-content h2{line-height:1.08}.contact-option b{font-family:var(--font-latin);letter-spacing:-.015em}

/* refined space and materials */
.header.scrolled{background:rgba(6,7,9,.88);backdrop-filter:blur(24px) saturate(125%)}
.nav{height:96px}
.hero-slide::before{background:linear-gradient(90deg,rgba(3,4,6,.96) 0%,rgba(3,4,6,.84) 35%,rgba(3,4,6,.29) 70%,rgba(3,4,6,.13) 100%),linear-gradient(0deg,rgba(3,4,6,.86),transparent 64%)}
.hero-copy::after{content:"";display:block;width:118px;height:1px;margin-top:54px;background:linear-gradient(90deg,#d72b36,rgba(255,255,255,.12))}
.btn{letter-spacing:.12em;font-family:var(--font-latin);font-weight:650;min-height:58px}
.vehicle-card{background:rgba(255,255,255,.72);box-shadow:0 20px 70px rgba(8,10,13,.04);transition:transform .55s var(--v4-ease),box-shadow .55s var(--v4-ease)}
.vehicle-card:hover{transform:translateY(-8px);box-shadow:0 30px 90px rgba(8,10,13,.12)}
.vehicle-image img{transition:transform 1.2s var(--v4-ease),filter .6s}.vehicle-card:hover .vehicle-image img{transform:scale(1.035);filter:saturate(1.04) contrast(1.02)}
.business-item{transition:background .45s var(--v4-ease),padding .45s var(--v4-ease)}.business-item:hover{background:rgba(255,255,255,.045);padding-left:18px;padding-right:18px}
.reveal{transform:translateY(42px);transition:opacity .95s var(--v4-ease),transform .95s var(--v4-ease)}

/* cinematic site intro */
body.intro-pending{overflow:hidden;background:var(--v4-black)}
.site-intro{position:fixed;z-index:10000;inset:0;background:var(--v4-black);color:#fff;display:grid;place-items:center;overflow:hidden;isolation:isolate}
.site-intro::before{content:"";position:absolute;inset:-20%;background:radial-gradient(circle at center,rgba(190,33,43,.13),transparent 34%),linear-gradient(118deg,transparent 42%,rgba(255,255,255,.035) 50%,transparent 58%);transform:translateX(-35%);animation:introSweep 2.3s var(--v4-ease) forwards}
.intro-curtain{position:absolute;z-index:4;left:0;width:100%;height:51%;background:#050608;will-change:transform}.intro-curtain-top{top:0}.intro-curtain-bottom{bottom:0}
.intro-core{position:relative;z-index:6;display:flex;flex-direction:column;align-items:center;text-align:center}
.intro-halo{position:absolute;left:50%;top:32%;width:280px;height:280px;border:1px solid rgba(255,255,255,.08);border-radius:50%;transform:translate(-50%,-50%) scale(.65);opacity:0;box-shadow:0 0 100px rgba(190,33,43,.08)}
.intro-mark{width:118px;height:118px;object-fit:contain;opacity:0;transform:scale(.82) rotate(-4deg);filter:drop-shadow(0 14px 42px rgba(0,0,0,.35))}
.intro-rule{width:230px;height:1px;margin:26px 0 23px;background:rgba(255,255,255,.12);overflow:hidden}.intro-rule span{display:block;width:100%;height:100%;background:linear-gradient(90deg,transparent,#d72b36 25%,#fff 50%,#d72b36 75%,transparent);transform:translateX(-110%)}
.intro-name{display:flex;align-items:baseline;gap:14px;font-family:var(--font-latin);font-size:25px;letter-spacing:.28em;line-height:1;opacity:0;transform:translateY(12px)}.intro-name b{font-weight:800}.intro-name em{font-style:normal;font-weight:800;color:#df303b}
.intro-jp{margin-top:13px;font-family:var(--sans);font-size:9px;letter-spacing:.32em;color:rgba(255,255,255,.48);opacity:0}
.intro-progress{position:absolute;z-index:7;left:35px;right:35px;bottom:27px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:13px;font-family:var(--font-latin);font-size:8px;letter-spacing:.12em;color:rgba(255,255,255,.4)}.intro-progress i{height:1px;background:rgba(255,255,255,.13);overflow:hidden;position:relative}.intro-progress i::after{content:"";position:absolute;inset:0;background:#cf2934;transform-origin:left;transform:scaleX(0)}
.intro-skip{position:absolute;z-index:9;right:30px;top:28px;border:0;background:transparent;color:rgba(255,255,255,.36);font-family:var(--font-latin);font-size:8px;letter-spacing:.22em;padding:8px;transition:.25s}.intro-skip:hover{color:#fff}
.site-intro.is-running .intro-halo{animation:haloIn 1.2s .15s var(--v4-ease) forwards}.site-intro.is-running .intro-mark{animation:markIn .9s .22s var(--v4-ease) forwards}.site-intro.is-running .intro-rule span{animation:ruleSweep 1.2s .55s var(--v4-ease) forwards}.site-intro.is-running .intro-name{animation:textIn .8s .82s var(--v4-ease) forwards}.site-intro.is-running .intro-jp{animation:fadeIn .7s 1.08s ease forwards}.site-intro.is-running .intro-progress i::after{animation:loadLine 2.2s .1s cubic-bezier(.24,.7,.24,1) forwards}
.site-intro.is-leaving .intro-core,.site-intro.is-leaving .intro-progress,.site-intro.is-leaving .intro-skip{animation:introCoreOut .42s ease forwards}.site-intro.is-leaving .intro-curtain-top{animation:curtainTop .85s .18s var(--v4-ease) forwards}.site-intro.is-leaving .intro-curtain-bottom{animation:curtainBottom .85s .18s var(--v4-ease) forwards}.site-intro.is-leaving{background:transparent;pointer-events:none}
@keyframes introSweep{0%{transform:translateX(-40%)}100%{transform:translateX(35%)}}
@keyframes haloIn{to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes markIn{to{opacity:1;transform:scale(1) rotate(0)}}
@keyframes ruleSweep{to{transform:translateX(110%)}}
@keyframes textIn{to{opacity:1;transform:none}}
@keyframes fadeIn{to{opacity:1}}
@keyframes loadLine{to{transform:scaleX(1)}}
@keyframes introCoreOut{to{opacity:0;transform:scale(.98)}}
@keyframes curtainTop{to{transform:translateY(-102%)}}
@keyframes curtainBottom{to{transform:translateY(102%)}}

@media(max-width:760px){
  .brand-lockup{min-width:0;gap:10px}.brand-mark{width:43px;height:43px}.brand-wordmark strong{font-size:12px;letter-spacing:.14em}.brand-wordmark small{font-size:7px;letter-spacing:.1em;margin-top:6px}.logo-text{display:flex!important}
  .nav{height:78px}.hero-grid{padding-top:142px}.hero h1{font-size:clamp(56px,17vw,74px);line-height:.94;letter-spacing:-.045em}.hero-sub{line-height:1.9;letter-spacing:.015em}.hero-copy::after{margin-top:35px}
  .section-head h2{font-size:48px;line-height:1.12}.brand-intro h2{font-size:42px;line-height:1.2}.promise-copy h2{font-size:44px;line-height:1.2}.business-title h3{font-size:36px}.showroom-copy h2{font-size:50px}.contact-grid h2{font-size:52px}
  .intro-mark{width:94px;height:94px}.intro-halo{width:220px;height:220px}.intro-name{font-size:20px;gap:10px;letter-spacing:.2em}.intro-rule{width:185px}.intro-progress{left:18px;right:18px;bottom:18px}.intro-skip{right:16px;top:14px}
}
@media(prefers-reduced-motion:reduce){.site-intro{display:none!important}body.intro-pending{overflow:auto}}