/* ===========================
Main
=========================== */


.main-visual{position:relative;height:100svh;overflow:hidden; color:#fff;}
.main-visual .inner{position:relative;height:100%;display:flex;align-items:flex-end;padding-bottom:clamp(50px,5.21vw,100px);}
.visual-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.visual-dim{position:absolute;inset:0;background:rgba(0,0,0,.2);}  
.visual-copy h2{font-size:clamp(40px,5.21vw,100px);font-weight:700;line-height:1.1; }
.visual-copy p{margin-top:clamp(20px,1.56vw,30px);max-width:600px;font-size:clamp(16px,1.15vw,22px);  font-weight: 500;}


.aceband-section{padding:clamp(80px,9.38vw,180px) 0 clamp(30px,6.77vw,130px); }
.aceband-section .section-head{display:grid;grid-template-columns:1fr 1fr; align-items:start;} 
.aceband-video-wrap{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(15px,1.04vw,20px);margin-top:clamp(50px,6.25vw,120px);}
.aceband-video{position:relative;display:block;aspect-ratio:560 / 372;overflow:hidden;border-radius:24px;}
.aceband-video video{width:100%;height:100%;object-fit:cover; } 



.structure-section{position:relative; }
.structure-inner{ height:100vh;display:grid;grid-template-columns:1fr 1fr;align-items:center;   padding:clamp(60px,7.29vw,140px) 0 clamp(50px,6.25vw,120px);}
.structure-left{display:flex;flex-direction:column; padding-right: 40px;   height: 100%; }
.structure-left .section-desc {max-width:560px;}
.structure-right{position:relative;height:100%; overflow:hidden;}
.structure-img{position:absolute;right:0;top:50%;width:100%; max-width:720px;transform:translateY(-50%);}
.structure-tab{display:flex;flex-direction:column;gap:8px; }
.structure-tab button{padding:12px 16px;border-radius:6px;background:#F5F6F7;color:#726f6d;transition:.35s; font-size: clamp(16px,0.94vw,18px); display:flex; align-items:center; line-height: 1; font-weight: 700;}
.structure-tab button:before{content:''; display:inline-block;width: 8px; aspect-ratio:1; background: #fff; transition:.35s; width: 0;}
.structure-tab .active button{background:var(--primary);color:#fff; }
.structure-tab .active button:before{ width: 8px; margin-right: 8px;}
.scan-bubble{position:absolute;opacity:0;transform:translateY(20px);transition:.4s; max-width:270px; width: 90%; backdrop-filter:blur(30px); box-shadow:0 0 40px rgba(104,104,104,.14); padding:20px; font-size: 15px; border:1px solid rgba(255,255,255,0.5); border-radius:12px; background: rgba(255,255,255,0.5);}
.scan-bubble h3{font-size: clamp(16px,0.94vw,18px); font-weight: 700; color: var(--primary); margin-bottom: clamp(5px,0.52vw,10px);}
.scan-bubble.active{opacity:1;transform:translateY(0);}
.scan-bubble.bubble1{top:58%;left:12%;}
.scan-bubble.bubble2{top:25%;right:8%;}
.scan-bubble.bubble3{bottom:20%;right:18%;}
.scan-bubble.bubble4{top:42%;right:12%;}


.scan-section{position:relative;  }
.scan-wrap{ height:100vh;display:grid;grid-template-columns:1fr 1fr;align-items:center;overflow:hidden;}
.scan-left{width: 100%;position:relative;height:100%;background:#171717;overflow:hidden;}
.scan-right{width: 100%;display:flex;flex-direction:column; padding:clamp(50px,9.38vw,180px) clamp(30px,6.25vw,120px) clamp(60px,6.25vw,120px);  height: 100%;}
.scan-right .section-desc{max-width:596px;}
.scan-image{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:.35s;}
.scan-image span{position:absolute; left:0; top:0; padding:clamp(20px,1.56vw,30px); font-size: 18px; font-weight: 700; color: #fff;}
.scan-image.active{opacity:1;visibility:visible;z-index:2;}
.scan-image img{ width:100%; height:100%;object-fit:cover;}
.scan-step{display:flex;flex-direction:column; gap:30px; }
.scan-step li{position:relative; display:flex; flex-direction:column; gap:clamp(10px,1.04vw,20px); transition:.35s; padding-left: 48px; font-size:clamp(18px,1.04vw,20px);}
.scan-step li h3{color:#2C2826; font-weight:700; transition:.35s; }
.scan-step li p{color: #959290;  }
.scan-step li .num{position:absolute; left:0; top:0; display:flex;align-items:center;justify-content:center;width:clamp(30px,1.88vw,36px); aspect-ratio:1; border-radius:50%;background:#9F9F9F;color:#fff;font-size:16px;font-weight:600;transition:.35s;}
.scan-step .line{position:absolute; left:0; top:clamp(38px,2.5vw,48px);width: 1px; height: 0; margin-left: clamp(14px,0.94vw,18px); transition:all ease .35s; background: #9F9F9F;}
.scan-step li.active{color:var(--black);}
.scan-step li.active .num{background:var(--primary);}
.scan-step li.active .line{height:6vh; margin-top: .8vh; margin-bottom: .8vh; }



.comfort-section{position:relative; background:var(--primary); overflow:hidden;}
.comfort-dim{content:''; inset:0; pointer-events:none; position:absolute;  opacity:0;background:linear-gradient(to top,#00234D 0%,#1F497D 100%);}
.comfort-wrap{ height:100vh;overflow:hidden;}
.comfort-typo{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:17.71vw; color:rgba(255,255,255,.1);white-space:nowrap;pointer-events:none; line-height: 1.2; font-weight: 700;}  
.comfort-stack{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%); }
.stack-card{position:absolute;left:50%;top:50%;   transform:translate(-50%,-50%); }
.stack-card img{display:block; width:  auto; max-width:none; border-radius:12px; max-height:clamp(120px,18.54vw,456px); max-width:clamp(150px,19.64vw,477px);}
.stack-card.card3 .comfort-bubble{bottom:80%;}
.stack-card.card6 .comfort-bubble{left:-40%;}
.comfort-bubble{position:absolute;opacity:0; bottom:-60px; left:40%;transition:.4s;  width:clamp(200px,16.67vw,320px);  backdrop-filter:blur(60px); box-shadow:0 10px 35px rgba(12,53,104,.32); padding:20px; font-size: 15px;  border-radius:12px; color: #fff; background: rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.1);} 
.comfort-bubble h3{font-size: clamp(16px,0.94vw,18px);  font-weight: 700; margin-bottom: clamp(5px,0.52vw,10px);}  
.comfort-bubble p{opacity:.8;} 
.comfort-copy{width: 90%;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;color:#fff;opacity:0;}
.comfort-copy h3{font-size:clamp(24px,2.5vw,48px);font-weight:700; line-height: 1.25;} 
.comfort-copy p{margin-top:clamp(16px,1.67vw,32px);font-size:clamp(18px,1.04vw,20px);opacity:.5;}




.center-section{padding:clamp(80px,10.42vw,200px) 0; } 
.center-list{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:100px;}
.center-card{display:flex;flex-direction:column; padding:40px;border-radius:16px;background:#F5F6F7; transition:.35s;} 
.center-card h3{font-size:24px;font-weight:500; display:block; padding-bottom: 32px; margin-bottom: 32px; border-bottom:1px solid rgba(0,0,0,0.1); transition:.35s;} 
.center-card strong{ font-weight:500; display:block; margin-bottom: 20px; transition:.35s;}
.center-card p{ opacity:.8;transition:.35s;} 
.center-card:hover{background:var(--primary);color:#fff; }
.center-card:hover h3{border-color:rgba(255,255,255,.2);}


/* ===========================
Responsive
=========================== */


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

	.aceband-section .section-head{grid-template-columns: 1fr  ;}
	.structure-inner{grid-template-columns: 1fr  ;}
	.scan-wrap{grid-template-columns: 1fr  ; height:auto;} 
	.structure-inner{height:auto;}
	.structure-right{aspect-ratio:1; width: 100%; height: auto;}
	.scan-left{aspect-ratio:1; width: 100%; height: auto;}
	.scan-wrap{flex-direction: column-reverse;  display: flex;}
	.comfort-bubble{display:none;}
	.scan-right{padding-left: 5%; padding-right: 5%; padding-top: 0;}
	.structure-tab{padding-left: 18px;}
}
@media screen and (max-width:640px){
	.aceband-video-wrap{grid-template-columns: 1fr  ;}
}