@import url('https://fonts.googleapis.com/css2?family=Anton&family=Montserrat:wght@400;500;600;700;800;900&family=Pretendard:wght@400;500;600;700;800&display=swap');
:root{--lime:#c8f34a;--black:#080a0c;--dark:#101317;--line:rgba(255,255,255,.13);--gray:#a5a9ae;--white:#fff;--max:1280px}
*{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;background:#fff;color:#15181b;font-family:Montserrat,Pretendard,Arial,sans-serif;overflow-x:hidden} body.menu-open,body.modal-open{overflow:hidden}
a{text-decoration:none;color:inherit} button{font:inherit;cursor:pointer} img{max-width:100%;display:block}
.container{width:min(calc(100% - 64px),var(--max));margin:auto}.eyebrow{font-size:10px;font-weight:800;letter-spacing:.16em;color:var(--lime);margin-bottom:12px}.section-title{font-size:38px;line-height:1;font-weight:800;margin:0 0 30px}.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:28px}.view-all{font-size:11px;font-weight:700;letter-spacing:.08em}.view-all span{color:var(--lime);font-size:18px;margin-left:7px}.reveal{opacity:0;transform:translateY(35px);transition:.8s cubic-bezier(.2,.8,.2,1)}.reveal.show{opacity:1;transform:none}
.header{position:fixed;z-index:1000;top:0;left:0;width:100%;height:78px;color:#fff;transition:.35s}.header.scrolled{height:68px;background:rgba(6,8,10,.94);backdrop-filter:blur(16px);box-shadow:0 4px 25px rgba(0,0,0,.2)}.nav-wrap{height:100%;display:flex;align-items:center;justify-content:space-between}.logo{font-size:21px;font-weight:900;letter-spacing:-1px}.logo b{color:var(--lime)}.logo small{display:block;font-size:5px;letter-spacing:.28em;color:#aaa;margin-left:23px}.nav{display:flex;gap:31px}.nav a{font-size:10px;font-weight:700;letter-spacing:.02em;position:relative}.nav a.is-active:after{width:100%}.nav a:after{content:"";position:absolute;width:0;height:2px;background:var(--lime);left:0;bottom:-8px;transition:.3s}.nav a:hover:after{width:100%}.header-actions{display:flex;gap:20px;align-items:center}.hamburger{width:28px;height:24px;background:none;border:0;padding:0;position:relative}.hamburger span{position:absolute;left:3px;width:21px;height:2px;background:#fff;transition:.3s}.hamburger span:nth-child(1){top:5px}.hamburger span:nth-child(2){top:11px}.hamburger span:nth-child(3){top:17px}.hamburger.active span:nth-child(1){transform:rotate(45deg);top:11px}.hamburger.active span:nth-child(2){opacity:0}.hamburger.active span:nth-child(3){transform:rotate(-45deg);top:11px}
.mobile-nav{position:fixed;inset:0;background:rgba(7,9,11,.98);z-index:900;padding:110px 8vw 40px;display:flex;flex-direction:column;gap:5px;opacity:0;visibility:hidden;transition:.35s}.mobile-nav.open{opacity:1;visibility:visible}.mobile-nav a{font-size:clamp(28px,7vw,48px);font-weight:800;padding:12px 0;border-bottom:1px solid #24272b;color:#fff}
.hero{height:100svh;min-height:680px;position:relative;color:#fff;background:#080a0c;overflow:hidden}.hero-track{height:100%;display:flex;transition:transform .9s cubic-bezier(.75,0,.25,1)}.hero-slide{min-width:100%;height:100%;position:relative;isolation:isolate}.hero-slide:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,6,8,.94) 0%,rgba(4,6,8,.54) 38%,rgba(4,6,8,.08) 72%),linear-gradient(0deg,rgba(0,0,0,.5),transparent 45%);z-index:1}.hero-slide:after{content:"";position:absolute;inset:0;background-image:var(--bg);background-size:cover;background-position:center;transform:scale(1.08);transition:transform 7s ease;z-index:-1}.hero-slide.active:after{transform:scale(1)}.hero-content{position:relative;z-index:3;height:100%;display:flex;align-items:center}.hero-copy{margin-left:max(0px,calc((100vw - var(--max))/2));padding-left:0;width:min(650px,54vw);padding-top:80px}.hero-num{font-size:14px;color:#fff;margin-bottom:15px}.hero h1{font-family:Anton,Impact,sans-serif;font-size:clamp(64px,8.8vw,145px);font-weight:400;line-height:.88;letter-spacing:-.025em;margin:0;text-transform:uppercase}.hero h1 span{display:block;color:transparent;-webkit-text-stroke:1px #d8dce0}.hero h1 i{font-style:normal;display:block}.hero-desc{margin:26px 0 25px;font-size:13px;font-weight:600;color:#e5e5e5}.hero-btn,.outline-btn,.lime-btn{display:inline-flex;align-items:center;gap:26px;min-height:48px;padding:0 18px;border:1px solid rgba(255,255,255,.38);background:rgba(0,0,0,.1);color:#fff;font-size:10px;font-weight:800;letter-spacing:.03em;transition:.3s}.hero-btn:hover,.outline-btn:hover{background:#fff;color:#111}.hero-btn b,.outline-btn b,.lime-btn b{font-size:16px;color:var(--lime)}.hero-progress{position:absolute;z-index:4;bottom:45px;left:max(32px,calc((100vw - var(--max))/2));display:flex;gap:28px}.hero-dot{border:0;background:none;color:#8e9499;padding:10px 0;font-size:9px;font-weight:800;position:relative}.hero-dot:after{content:"";position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--lime)}.hero-dot.active{color:#fff}.hero-dot.active:after{animation:progress 5s linear forwards}@keyframes progress{from{width:0}to{width:100%}}.hero-social{position:absolute;z-index:4;right:40px;top:50%;transform:translateY(-50%);display:grid;gap:17px}.hero-social a{width:28px;height:28px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;font-size:10px;color:#fff}
.brand{background:#050607;color:#fff;padding:120px 0}.brand-grid{display:grid;grid-template-columns:.82fr 1.6fr;gap:70px;align-items:center}.brand-copy .section-title{font-size:42px;max-width:320px}.brand-copy p{font-size:13px;line-height:1.8;color:#aeb2b7;max-width:320px;margin-bottom:27px}.video-card{height:400px;position:relative;overflow:hidden}.video-card img{width:100%;height:100%;object-fit:cover;filter:brightness(.7);transition:.6s}.video-card:hover img{transform:scale(1.05)}.play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:58px;height:58px;border-radius:50%;border:0;background:#fff;color:#111;font-size:18px;box-shadow:0 10px 30px #0006}
.models{padding:105px 0 95px;background:linear-gradient(120deg,#fff 0%,#f2f4f6 100%)}.slider-shell{position:relative}.slider-window{overflow:hidden}.models-track,.news-track{display:flex;gap:20px;transition:transform .55s cubic-bezier(.2,.8,.2,1)}.model-card{min-width:calc((100% - 40px)/3);height:390px;background:#15191c;color:#fff;position:relative;overflow:hidden;padding:26px}.model-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.78;transition:.55s}.model-card:before{content:"";position:absolute;z-index:1;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.45),transparent 42%,rgba(0,0,0,.75))}.model-card:hover img{transform:scale(1.08)}.model-info{position:relative;z-index:2}.model-cat{font-size:9px;font-weight:800;color:var(--lime);margin-bottom:13px}.model-info h3{font-size:18px;margin:0 0 7px}.model-info p{font-size:9px;color:#ddd;margin:0}.model-price{position:absolute;z-index:2;left:26px;bottom:66px;font-size:14px;font-weight:700}.model-more{position:absolute;z-index:2;left:26px;bottom:25px;font-size:9px;font-weight:800;color:#ddd}.model-more b{color:var(--lime);margin-left:5px}.slider-arrow{position:absolute;z-index:10;top:50%;transform:translateY(-50%);width:42px;height:42px;border-radius:50%;background:#fff;border:1px solid #d6d9dc;font-size:19px;color:#45484b;display:grid;place-items:center;box-shadow:0 5px 18px #00000010;transition:.3s}.slider-arrow:hover{background:#111;color:var(--lime);border-color:#111}.slider-arrow.prev{left:-25px}.slider-arrow.next{right:-25px}.slider-dots{display:flex;justify-content:center;gap:7px;margin-top:22px}.slider-dots button{width:5px;height:5px;border:0;border-radius:50%;background:#c4c7ca;padding:0}.slider-dots button.active{background:var(--lime);transform:scale(1.35)}
.performance{background:#030506;color:#fff;min-height:550px;display:grid;grid-template-columns:1fr 1.25fr;overflow:hidden}.perf-copy{padding:95px max(32px,calc((100vw - var(--max))/2)) 90px max(32px,calc((100vw - var(--max))/2));padding-right:80px;align-self:center}.perf-copy h2{font-size:28px;line-height:1.35;margin:0 0 20px}.perf-copy>p{font-size:11px;color:#a7adb3;line-height:1.8;margin-bottom:25px}.perf-list{display:grid;gap:12px}.perf-row{display:grid;grid-template-columns:38px 95px 1fr;border-bottom:1px solid #24282c;padding-bottom:11px;align-items:center}.perf-row b:first-child{color:var(--lime);font-size:12px}.perf-row strong{font-size:12px}.perf-row span{font-size:9px;color:#a9afb5}.perf-image{min-height:550px;overflow:hidden}.perf-image img{width:100%;height:100%;object-fit:cover;object-position:center}
.why{padding:75px 0;background:#fff;text-align:center}.why-grid{display:grid;grid-template-columns:repeat(4,1fr);margin-top:45px}.why-item{padding:5px 30px}.why-icon{color:var(--lime);font-size:29px;margin-bottom:16px}.why-item h4{margin:0 0 10px;font-size:12px}.why-item p{font-size:10px;line-height:1.6;color:#7b8187;margin:0}
.test-ride{min-height:430px;position:relative;background:#111;color:#fff;display:flex;align-items:center}.test-ride:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,6,8,.9),rgba(5,6,8,.15)),url('https://images.unsplash.com/photo-1558981806-ec527fa84c39?auto=format&fit=crop&w=2000&q=85') center/cover}.test-copy{position:relative;z-index:1}.test-copy h2{font-size:38px;line-height:1.05;margin:0 0 18px}.test-copy p{font-size:11px;color:#e1e4e7;margin-bottom:26px}.lime-btn{border:0;background:var(--lime);color:#151815;gap:24px}.lime-btn:hover{filter:brightness(1.1);transform:translateY(-2px)}
.experience{padding:95px 0}.gallery{display:grid;grid-template-columns:1.15fr 1fr 1fr;gap:7px;height:420px}.gallery .g-item{overflow:hidden;position:relative}.gallery .g-item:nth-child(3){display:grid;grid-template-rows:1fr 1fr;gap:7px}.gallery .g-item img{width:100%;height:100%;object-fit:cover;transition:.6s}.gallery>.g-item:hover>img,.gallery .g-item>div:hover img{transform:scale(1.06)}.gallery .g-item div{overflow:hidden}.gallery .g-item div img{width:100%;height:100%;object-fit:cover;transition:.6s}
.service{padding:78px 0;background:#050607;color:#fff}.service-grid{display:grid;grid-template-columns:repeat(3,1fr)}.service-card{background:#16191c;min-height:200px;padding:31px;border-right:1px solid #282c30;transition:.35s}.service-card:hover{background:#202428;transform:translateY(-6px)}.service-num{font-size:24px;font-weight:800;color:var(--lime)}.service-icon{font-size:31px;margin:25px 0 14px}.service-card h4{font-size:13px;margin:0 0 9px}.service-card p{font-size:10px;line-height:1.7;color:#a7adb2;margin:0}
.news{padding:95px 0;background:#f5f6f7}.news-card{min-width:calc((100% - 40px)/3);background:#fff;border:1px solid #e3e5e7;transition:.3s}.news-card:hover{transform:translateY(-6px);box-shadow:0 15px 35px #0000000c}.news-img{height:180px;overflow:hidden}.news-img img{width:100%;height:100%;object-fit:cover;transition:.5s}.news-card:hover img{transform:scale(1.06)}.news-copy{padding:15px 17px 20px}.news-meta{display:flex;justify-content:space-between;font-size:8px;color:#999;margin-bottom:14px}.news-copy h4{font-size:12px;margin:0 0 10px}.news-copy p{font-size:9px;color:#81868b;margin:0;line-height:1.6}
.showroom{min-height:330px;color:#fff;position:relative;background:#101317;padding:65px 0}.showroom:before{content:"";position:absolute;inset:0;opacity:.48;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:30px 30px}.show-grid{position:relative;display:grid;grid-template-columns:1.5fr .8fr;gap:70px;align-items:center}.show-copy h2{font-size:30px;line-height:1.05;margin:0 0 15px}.show-copy p{font-size:10px;color:#c4c7ca;line-height:1.7}.show-info{background:#080a0c;border:1px solid #282d31;padding:30px}.show-info h4{font-size:11px;margin:0 0 19px}.show-info p{font-size:9px;color:#aaa;margin:11px 0}.pin{position:absolute;left:57%;top:52%;width:19px;height:25px;background:var(--lime);border-radius:50% 50% 50% 0;transform:rotate(-45deg);box-shadow:0 0 30px var(--lime)}.pin:after{content:"";position:absolute;width:7px;height:7px;border-radius:50%;background:#111;left:6px;top:6px}
.footer{background:#030405;color:#fff;padding:55px 0 25px}.footer-grid{display:grid;grid-template-columns:1.8fr repeat(4,1fr);gap:40px}.footer-logo p{font-size:9px;color:#777;margin-top:18px}.socials{display:flex;gap:12px;margin-top:18px}.socials a{width:26px;height:26px;border:1px solid #303438;border-radius:50%;display:grid;place-items:center;font-size:10px}.footer-col h5{font-size:9px;margin:0 0 15px}.footer-col a{display:block;font-size:9px;color:#888;margin:9px 0}.copyright{text-align:center;border-top:1px solid #171a1d;margin-top:38px;padding-top:20px;font-size:8px;color:#666}
.top-btn{position:fixed;right:26px;bottom:26px;z-index:800;width:43px;height:43px;border:1px solid #303438;border-radius:50%;background:#101215;color:#fff;opacity:0;visibility:hidden;transform:translateY(15px);transition:.3s}.top-btn.show{opacity:1;visibility:visible;transform:none}.top-btn:hover{background:var(--lime);color:#111}
.modal{position:fixed;z-index:2000;inset:0;background:rgba(0,0,0,.78);display:grid;place-items:center;padding:25px;opacity:0;visibility:hidden;transition:.3s}.modal.open{opacity:1;visibility:visible}.modal-box{width:min(720px,100%);max-height:90svh;overflow:auto;background:#fff;position:relative;transform:translateY(25px);transition:.3s}.modal.open .modal-box{transform:none}.modal-close{position:absolute;z-index:2;right:15px;top:15px;width:38px;height:38px;border:0;border-radius:50%;background:#111;color:#fff;font-size:22px}.model-modal-image{height:340px}.model-modal-image img{width:100%;height:100%;object-fit:cover}.modal-content{padding:32px}.modal-content h3{font-size:28px;margin:0 0 8px}.modal-content p{font-size:12px;color:#777;line-height:1.8}.specs{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #e5e5e5;border-bottom:1px solid #e5e5e5;margin:24px 0}.spec{padding:17px 5px;border-right:1px solid #eee}.spec:last-child{border:0}.spec small{display:block;color:#999;font-size:8px;margin-bottom:6px}.spec b{font-size:12px}.form-modal{padding:40px}.form-modal h3{margin-top:0}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-grid input,.form-grid select{width:100%;border:1px solid #ddd;padding:15px;background:#fff;font-size:12px}.form-grid .full{grid-column:1/-1}.form-note{font-size:10px;color:#888;margin:14px 0}.form-modal .lime-btn{width:100%;justify-content:center}.toast{position:fixed;z-index:3000;left:50%;bottom:25px;transform:translate(-50%,80px);background:#15181b;color:#fff;padding:14px 22px;font-size:11px;opacity:0;transition:.4s}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:900px){.container{width:min(calc(100% - 40px),var(--max))}.nav{display:none}.brand-grid,.performance{grid-template-columns:1fr}.brand{padding:80px 0}.video-card{height:330px}.perf-copy{padding:70px 30px}.perf-image{min-height:420px}.why-grid{grid-template-columns:repeat(2,1fr);gap:35px}.gallery{height:340px}.footer-grid{grid-template-columns:2fr 1fr 1fr}.footer-col:nth-last-child(-n+2){display:none}.show-grid{grid-template-columns:1fr;gap:30px}.pin{left:80%;top:35%}.slider-arrow.prev{left:-20px}.slider-arrow.next{right:-20px}}
@media(max-width:620px){.container{width:calc(100% - 32px)}.header{height:65px}.header-actions{gap:8px}.header-actions>span{display:none}.hero{min-height:680px}.hero-copy{padding:100px 25px 0;margin:0;width:100%;align-self:center}.hero h1{font-size:72px}.hero-desc{font-size:11px}.hero-social{display:none}.hero-progress{left:25px;bottom:25px}.model-card{min-width:calc(100% - 12px);height:390px}.news-card{min-width:calc(100% - 12px)}.slider-arrow{width:38px;height:38px}.slider-arrow.prev{left:-19px}.slider-arrow.next{right:-19px}.section-title{font-size:29px}.brand-grid{gap:35px}.brand-copy .section-title{font-size:36px}.video-card{height:240px}.models,.experience,.news{padding:70px 0}.performance{min-height:auto}.perf-copy{padding:65px 24px}.perf-image{min-height:330px}.why{padding:65px 0}.why-grid{gap:28px 5px}.why-item{padding:5px 10px}.test-ride{min-height:390px}.test-copy h2{font-size:33px}.gallery{height:auto;grid-template-columns:1fr 1fr}.gallery>.g-item:first-child{grid-column:1/-1;height:320px}.gallery>.g-item:nth-child(2){height:240px}.gallery>.g-item:nth-child(3){height:240px}.service-grid{grid-template-columns:1fr}.service-card{min-height:160px}.showroom{padding:60px 0}.footer-grid{grid-template-columns:1fr 1fr;gap:30px}.footer-logo{grid-column:1/-1}.footer-col:nth-last-child(-n+2){display:block}.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}.model-modal-image{height:230px}.modal-content{padding:24px}.specs{grid-template-columns:1fr}.spec{border-right:0;border-bottom:1px solid #eee}.section-head{align-items:center}.view-all{display:none}}

/* ===== Final readability & HERO control enhancement ===== */
html { scroll-padding-top: 78px; }
body { font-size: 17px; }
.hero-track { will-change: transform; }
.hero-arrow{
 position:absolute; z-index:6; top:50%; transform:translateY(-50%);
 width:58px; height:58px; border-radius:50%;
 border:1px solid rgba(255,255,255,.34); background:rgba(8,10,12,.28);
 backdrop-filter:blur(8px); color:#fff; font-size:25px; line-height:1;
 display:grid; place-items:center; transition:.3s;
}
.hero-arrow:hover{background:var(--lime);color:#111;border-color:var(--lime);transform:translateY(-50%) scale(1.06)}
.hero-prev{left:32px}.hero-next{right:32px}
.hero h1{font-size:clamp(76px,9.6vw,156px)}
.hero-desc{font-size:15px;line-height:1.7}
.hero-btn,.outline-btn,.lime-btn{font-size:12px;min-height:54px;padding:0 22px}
.nav a{font-size:11px}
.section-title{font-size:43px}
.brand-copy .section-title{font-size:48px}
.model-info h3{font-size:22px}.model-info p{font-size:11px}
.model-price{font-size:16px}.model-more{font-size:10px}
.perf-copy h2{font-size:34px}.perf-copy>p{font-size:13px}
.perf-row strong{font-size:14px}.perf-row span{font-size:10px}
.why-item h4{font-size:14px}.why-item p{font-size:11px}
.test-copy h2{font-size:46px}.test-copy p{font-size:13px}
.service-card h4{font-size:15px}.service-card p{font-size:11px}
.news-copy h4{font-size:15px}.news-copy p{font-size:11px}
.show-copy h2{font-size:38px}.show-copy p{font-size:12px}
.footer-col h5{font-size:10px}.footer-col a{font-size:10px}

@media(max-width:900px){
 .hero-arrow{width:50px;height:50px}.hero-prev{left:16px}.hero-next{right:16px}
 .section-title{font-size:38px}
}
@media(max-width:620px){
 .hero-arrow{display:none}
 .hero h1{font-size:clamp(64px,18vw,92px)}
 .hero-copy{padding-left:24px;padding-right:24px}
 .hero-desc{font-size:13px}
 .section-title{font-size:31px}
 .brand-copy .section-title{font-size:38px}
 .test-copy h2{font-size:38px}
 .model-info h3{font-size:21px}
 .slider-arrow{z-index:30}
}


/* =========================================================
   MOTOX PRO COMMERCE EDITION
   Typography / spacing / interaction refinement
   ========================================================= */
:root{
  --max: 1360px;
  --text-lg: 19px;
  --text-md: 16px;
  --text-sm: 13px;
}

body{
  font-size:var(--text-md);
  letter-spacing:-.015em;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
.container{width:min(calc(100% - 80px),var(--max))}
.header{border-bottom:1px solid rgba(255,255,255,.06)}
.header.scrolled{background:rgba(5,7,9,.97)}
.logo{font-size:24px}
.nav{gap:36px}
.nav a{font-size:12px;font-weight:800}

.eyebrow{font-size:11px;letter-spacing:.18em;margin-bottom:16px}
.section-title{font-size:clamp(38px,3.5vw,58px);letter-spacing:-.04em;margin-bottom:34px}
.section-head{margin-bottom:36px}
.view-all{font-size:12px}
.view-all span{font-size:22px}

.hero{min-height:760px}
.hero:after{content:"";position:absolute;left:0;right:0;bottom:0;height:130px;background:linear-gradient(transparent,rgba(0,0,0,.4));pointer-events:none;z-index:2}
.hero-copy{width:min(700px,58vw)}
.hero-num{font-size:15px;font-weight:800;margin-bottom:22px;letter-spacing:.08em}
.hero h1{font-size:clamp(88px,10.4vw,170px);line-height:.84}
.hero-desc{font-size:17px;font-weight:600;margin:30px 0 32px;line-height:1.7}
.hero-btn{font-size:13px;min-height:58px;padding:0 25px;box-shadow:0 8px 30px rgba(0,0,0,.15)}
.hero-progress{bottom:50px;gap:36px}
.hero-dot{font-size:11px;letter-spacing:.08em}
.hero-arrow{width:62px;height:62px}
.hero-social a{width:32px;height:32px;font-size:12px}

.brand{padding:150px 0}
.brand-grid{gap:95px}
.brand-copy .section-title{font-size:clamp(45px,4.3vw,70px);line-height:1.02}
.brand-copy p{font-size:16px;line-height:1.9;max-width:410px}
.video-card{height:470px}
.play{width:68px;height:68px;font-size:21px}

.models{padding:125px 0 115px}
.model-card{height:455px;padding:30px}
.model-cat{font-size:10px;margin-bottom:16px}
.model-info h3{font-size:25px;margin-bottom:10px}
.model-info p{font-size:12px;line-height:1.5}
.model-price{left:30px;bottom:74px;font-size:19px}
.model-more{left:30px;bottom:29px;font-size:11px}
.slider-arrow{width:52px;height:52px;font-size:25px}
.slider-arrow.prev{left:-27px}.slider-arrow.next{right:-27px}
.slider-dots{gap:9px;margin-top:28px}
.slider-dots button{width:7px;height:7px}

.performance{min-height:620px}
.perf-copy{padding-top:110px;padding-bottom:110px}
.perf-copy h2{font-size:clamp(34px,3vw,52px);line-height:1.28}
.perf-copy>p{font-size:15px;line-height:1.9;max-width:420px}
.perf-list{margin-top:34px;gap:17px}
.perf-row{grid-template-columns:50px 120px 1fr;padding-bottom:15px}
.perf-row b:first-child{font-size:14px}
.perf-row strong{font-size:15px}
.perf-row span{font-size:11px;line-height:1.6}
.perf-image{min-height:620px}

.why{padding:100px 0}
.why-grid{margin-top:55px}
.why-item{padding:10px 35px}
.why-icon{font-size:36px;margin-bottom:20px}
.why-item h4{font-size:15px;margin-bottom:12px}
.why-item p{font-size:12px;line-height:1.8}

.test-ride{min-height:500px}
.test-copy h2{font-size:clamp(45px,4.5vw,70px);line-height:1.02}
.test-copy p{font-size:15px;margin-bottom:30px}
.lime-btn,.outline-btn{font-size:12px;min-height:56px}

.experience{padding:120px 0}
.gallery{height:500px;gap:10px}
.gallery .g-item:nth-child(3){gap:10px}

.service{padding:100px 0}
.service-card{min-height:250px;padding:38px}
.service-num{font-size:30px}
.service-icon{font-size:39px;margin:30px 0 18px}
.service-card h4{font-size:17px;margin-bottom:11px}
.service-card p{font-size:12px;line-height:1.8}

.news{padding:120px 0}
.news-card{min-height:380px}
.news-img{height:220px}
.news-copy{padding:20px 21px 25px}
.news-meta{font-size:9px;margin-bottom:17px}
.news-copy h4{font-size:17px;margin-bottom:12px}
.news-copy p{font-size:12px;line-height:1.75}

.showroom{min-height:400px;padding:80px 0}
.showroom {
    
}
.show-copy h2{font-size:clamp(40px,3.7vw,62px)}
.show-copy p{font-size:14px;line-height:1.8;margin-bottom:25px}
.show-info{padding:38px}
.show-info h4{font-size:14px;margin-bottom:24px}
.show-info p{font-size:11px;line-height:1.8;margin:14px 0}

.footer{padding:70px 0 30px}
.footer-col h5{font-size:11px;margin-bottom:19px}
.footer-col a{font-size:11px;margin:12px 0}
.footer-logo p{font-size:11px}
.copyright{font-size:9px}

.modal-content h3,.form-modal h3{font-size:34px}
.modal-content p{font-size:14px;line-height:1.9}
.form-modal{padding:48px}
.form-grid input,.form-grid select{font-size:14px;padding:17px}
.top-btn{width:50px;height:50px;font-size:18px}

@media(max-width:1000px){
 .container{width:min(calc(100% - 56px),var(--max))}
 .hero h1{font-size:clamp(78px,11vw,130px)}
 .brand{padding:105px 0}
 .model-card{height:420px}
 .news-img{height:200px}
}
@media(max-width:620px){
 :root{--text-md:16px}
 .container{width:calc(100% - 32px)}
 .header{height:70px}
 .logo{font-size:21px}
 .mobile-nav a{font-size:clamp(31px,10vw,48px);padding:15px 0}
 .hero{min-height:700px}
 .hero h1{font-size:clamp(68px,20vw,100px)}
 .hero-copy{padding-top:95px}
 .hero-desc{font-size:14px;max-width:300px}
 .hero-progress{bottom:28px}
 .brand{padding:80px 0}
 .brand-copy .section-title{font-size:43px}
 .brand-copy p{font-size:15px}
 .video-card{height:270px}
 .models,.experience,.news{padding:82px 0}
 .model-card{height:440px}
 .model-info h3{font-size:24px}
 .model-price{font-size:18px}
 .performance{display:block}
 .perf-copy{padding:80px 24px}
 .perf-copy h2{font-size:37px}
 .perf-copy>p{font-size:14px}
 .perf-row{grid-template-columns:42px 100px 1fr}
 .perf-image{min-height:390px}
 .why{padding:82px 0}
 .why-item h4{font-size:14px}
 .why-item p{font-size:12px}
 .test-ride{min-height:440px}
 .test-copy h2{font-size:47px}
 .gallery{height:auto}
 .gallery>.g-item:first-child{height:360px}
 .gallery>.g-item:nth-child(2),.gallery>.g-item:nth-child(3){height:260px}
 .service{padding:82px 0}
 .service-card{padding:32px;min-height:190px}
 .news-card{min-height:360px}
 .news-img{height:205px}
 .news-copy h4{font-size:16px}
 .showroom{padding:70px 0}
 .show-copy h2{font-size:47px}
 .footer{padding-top:60px}
 .slider-arrow{width:46px;height:46px}
}


/* =========================================================
   FONT PLUS EDITION
   Larger, cleaner typography for premium commercial display
   ========================================================= */
:root{
  --text-lg:21px;
  --text-md:18px;
  --text-sm:14px;
}

/* Global text */
body{font-size:18px;line-height:1.75}
p{font-size:1em;line-height:1.8}
.eyebrow{font-size:12px}
.nav a{font-size:13px}
.logo{font-size:26px}

/* Hero */
.hero-num{font-size:17px}
.hero h1{font-size:clamp(96px,11.3vw,185px)}
.hero-desc{font-size:19px;max-width:620px}
.hero-btn{font-size:14px;min-height:62px;padding:0 30px}
.hero-dot{font-size:13px}
.hero-social a{font-size:14px}

/* Headings */
.section-title{font-size:clamp(46px,4.2vw,68px);line-height:1.1}
.brand-copy .section-title{font-size:clamp(52px,5vw,78px)}
.brand-copy p{font-size:18px}
.view-all{font-size:13px}

/* Models */
.model-cat{font-size:11px}
.model-info h3{font-size:29px}
.model-info p{font-size:14px;line-height:1.65}
.model-price{font-size:22px}
.model-more{font-size:12px}

/* Performance */
.perf-copy h2{font-size:clamp(40px,3.6vw,60px)}
.perf-copy>p{font-size:17px}
.perf-row b:first-child{font-size:16px}
.perf-row strong{font-size:18px}
.perf-row span{font-size:13px}

/* Why */
.why-item h4{font-size:18px}
.why-item p{font-size:14px}
.why-icon{font-size:40px}

/* Test ride */
.test-copy h2{font-size:clamp(52px,5.2vw,80px)}
.test-copy p{font-size:18px}
.lime-btn,.outline-btn{font-size:14px;min-height:62px;padding:0 28px}

/* Experience / Service */
.service-num{font-size:34px}
.service-card h4{font-size:20px}
.service-card p{font-size:14px}
.service-icon{font-size:43px}

/* News */
.news-meta{font-size:10px}
.news-copy h4{font-size:20px;line-height:1.4}
.news-copy p{font-size:14px;line-height:1.8}

/* Showroom */
.show-copy h2{font-size:clamp(48px,4.4vw,70px)}
.show-copy p{font-size:17px}
.show-info h4{font-size:16px}
.show-info p{font-size:13px}

/* Footer */
.footer-col h5{font-size:12px}
.footer-col a{font-size:12px}
.footer-logo p{font-size:12px}

/* Modal and forms */
.modal-content h3,.form-modal h3{font-size:40px}
.modal-content p{font-size:17px}
.form-grid label{font-size:13px}
.form-grid input,.form-grid select{font-size:16px;padding:19px}

/* Mobile typography: large but balanced */
@media(max-width:1000px){
  body{font-size:17px}
  .hero h1{font-size:clamp(84px,13vw,145px)}
  .section-title{font-size:clamp(42px,6vw,58px)}
  .brand-copy .section-title{font-size:clamp(48px,7vw,64px)}
}
@media(max-width:620px){
  body{font-size:16px;line-height:1.75}
  .hero{min-height:720px}
  .hero h1{font-size:clamp(74px,21vw,108px)}
  .hero-desc{font-size:16px;line-height:1.75}
  .hero-num{font-size:15px}
  .hero-btn{font-size:13px;min-height:56px}
  .section-title{font-size:clamp(36px,10vw,48px)}
  .brand-copy .section-title{font-size:clamp(42px,12vw,56px)}
  .brand-copy p{font-size:16px}
  .model-info h3{font-size:27px}
  .model-info p{font-size:13px}
  .model-price{font-size:20px}
  .perf-copy h2{font-size:42px}
  .perf-copy>p{font-size:16px}
  .perf-row strong{font-size:16px}
  .perf-row span{font-size:12px}
  .why-item h4{font-size:17px}
  .why-item p{font-size:13px}
  .test-copy h2{font-size:52px}
  .test-copy p{font-size:16px}
  .service-card h4{font-size:19px}
  .service-card p{font-size:13px}
  .news-copy h4{font-size:19px}
  .news-copy p{font-size:13px}
  .show-copy h2{font-size:50px}
  .show-copy p{font-size:16px}
  .modal-content h3,.form-modal h3{font-size:34px}
}


/* =========================================================
   HERO RIGHT-GAP FIX
   Prevent horizontal overflow / blank space on the right
   ========================================================= */
html,
body{
  width:100%;
  max-width:100%;
  overflow-x:hidden;
}

.hero{
  width:100%;
  max-width:100%;
  overflow:hidden;
  position:relative;
}

.hero-track{
  display:flex;
  width:100%;
  max-width:none;
  min-width:0;
  overflow:visible;
  transform:translate3d(0,0,0);
}

.hero-slide{
  position:relative;
  flex:0 0 100%;
  width:100%;
  min-width:100%;
  max-width:100%;
  overflow:hidden;
}

.hero-slide::before,
.hero-slide::after{
  max-width:100%;
}

.hero-slide img,
.hero-slide picture,
.hero-slide .hero-bg{
  display:block;
  width:100%;
  max-width:none;
}

@media(max-width:620px){
  .hero,
  .hero-track,
  .hero-slide{
    width:100%;
    min-width:100%;
    max-width:100%;
  }
}

/* ================================
   VIDEO CARD
================================ */

.video-card {
    position: relative;
    width: 100%;
    overflow: hidden;
    cursor: pointer;
}

.video-card img {
    display: block;
    width: 100%;
    height: auto;
    transition: transform 0.5s ease;
}

.video-card:hover img {
    transform: scale(1.05);
}


/* ================================
   PLAY BUTTON
================================ */

.play {
    position: absolute;
    top: 50%;
    left: 50%;

    width: 90px;
    height: 90px;

    transform: translate(-50%, -50%);

    border: none;
    border-radius: 50%;

    background: rgba(255, 255, 255, 0.95);

    color: #111;

    font-size: 28px;

    display: flex;
    align-items: center;
    justify-content: center;

    cursor: pointer;

    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.25);

    transition: 
        transform 0.3s ease,
        background 0.3s ease;
}

.play:hover {
    transform: translate(-50%, -50%) scale(1.1);
    background: #ffffff;
}


/* ================================
   VIDEO MODAL
================================ */

.video-modal {
    position: fixed;

    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    z-index: 99999;

    display: none;

    align-items: center;
    justify-content: center;
}


/* 활성화 */

.video-modal.active {
    display: flex;
}


/* ================================
   DIM
================================ */

.video-modal-dim {
    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    background: rgba(0, 0, 0, 0.88);

    backdrop-filter: blur(5px);
}


/* ================================
   VIDEO CONTENT
================================ */

.video-modal-content {
    position: relative;

    width: 90%;
    max-width: 1000px;

    z-index: 2;

    animation: videoModalOpen 0.35s ease;
}


/* ================================
   VIDEO RATIO
================================ */

.video-frame {
    position: relative;

    width: 100%;

    aspect-ratio: 16 / 9;

    background: #000;

    overflow: hidden;

    border-radius: 8px;

    box-shadow: 
        0 30px 80px rgba(0, 0, 0, 0.5);
}

.video-frame iframe {
    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    border: 0;
}


/* ================================
   CLOSE BUTTON
================================ */

.video-close {
    position: absolute;

    top: -55px;
    right: 0;

    width: 45px;
    height: 45px;

    border: none;

    background: transparent;

    color: #fff;

    font-size: 42px;
    line-height: 1;

    cursor: pointer;

    transition: transform 0.3s ease;
}

.video-close:hover {
    transform: rotate(90deg);
}


/* ================================
   ANIMATION
================================ */

@keyframes videoModalOpen {

    from {
        opacity: 0;
        transform: scale(0.92);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }

}


/* ================================
   MOBILE
================================ */

@media screen and (max-width: 768px) {

    .video-modal-content {
        width: 92%;
    }

    .play {
        width: 70px;
        height: 70px;

        font-size: 22px;
    }

    .video-close {
        top: -50px;
        font-size: 38px;
    }

}

.pin {display:none;}