
/*=========================================================================
공통
=========================================================================*/
#wrap{min-width: var(--min-cont);}
.inner{max-width:var(--max-cont); margin:0 auto; padding:0 48px;}

@media(max-width:960px){
  .inner{padding:0 24px;}
}
@media(max-width:600px){
  .inner{padding:0 15px;}
}

/* REVEAL */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .55s ease,transform .55s ease;}
.reveal.in{opacity:1;transform:none;}

/* br */
br.mobile-br{display:none;}

@media(max-width:960px){
  br.mobile-br{display:block;}
}

/*=========================================================================
HERO
=========================================================================*/
.hero{background:var(--bg-cream);}
.hero .inner{display:grid; grid-template-columns:50fr 78fr; height:100vh; min-height:640px;}
.hero-text{display:flex; flex-direction:column; justify-content:center; align-items:flex-start; align-self:center; margin-top: 20px;}
.hero-text-inner{max-width:640px; width:100%;}
.hero-solution{font-size:.8rem; letter-spacing:.2em; color:var(--main); margin-bottom:22px; text-transform:uppercase; font-weight:600; font-family:var(--f-sub-en);}
.hero-lead{font-size:2.7rem; font-weight:400; line-height:1.28; color:var(--text-dark); margin-bottom:4px; letter-spacing:-.025em;}
.hero-brand{font-size:2.7rem; font-weight:700; line-height:1.28; color:var(--text-dark); margin-bottom:18px; letter-spacing:-.03em;}
.hero-brand-sub{font-size:1.8rem; font-weight:700; color:var(--main-dark); letter-spacing:-.01em; line-height:1.4; margin-bottom:28px;}
.hero-desc{font-size:.9rem; color:#444; line-height:1.9; max-width:560px;}
.hero-desc.hero-desc-top{margin-bottom:14px;}
.hero-desc.hero-desc-list{margin-bottom:36px;}
.hero-desc b{color:var(--text-dark); font-weight:700;}
.hero-desc-list{list-style:none; padding-left:0;}
.hero-desc-list li{position:relative; padding-left:18px; margin-bottom:4px;}
.hero-desc-list li::before{content:'·';position:absolute; left:0; color:var(--main); font-weight:700;}
.hero-btns{display:flex; gap:12px; flex-wrap:wrap;}
.hero-btn-primary{display:inline-flex; align-items:center; padding:14px 32px; background:var(--main); color:var(--white); font-size:.9rem; font-weight:500; border:none; border-radius:100px;cursor:pointer; transition:all .2s; box-shadow:0 8px 24px rgba(201,169,110,.28);}
.hero-btn-primary:hover{background: var(--main-dark); transform:translateY(-2px);}
.hero-btn-ghost{display:inline-flex; align-items:center; gap:6px; padding:14px 24px; background:transparent; color:var(--text-dark); font-size:.9rem; font-weight:500; border:1px solid var(--gray-200); border-radius:100px; cursor:pointer; transition:all .2s;}
.hero-btn-ghost:hover{border-color:var(--main); color:var(--main); transform:translateY(-2px);}
.hero-img-wrap{position:relative; overflow:hidden; background:var(--bg-cream); transform: translateX(100px);}
.hero-img{position:absolute; inset:0; width:100%; height:100%; object-fit:contain; object-position:left bottom; box-sizing:border-box;}
.hero-slide{opacity:0; transition:opacity 1.8s ease; z-index:1}
.hero-slide.active{opacity:1; z-index:2;}

@media(max-width:960px){
  .hero .inner{grid-template-columns:1fr; height:auto; max-height:none;}
  .hero-img-wrap{height:320px; order:-1; transform:none; margin-top: 70px;}
  .hero-img{position:absolute; inset:0; width:100%; height:100%; object-fit:contain; object-position:bottom center; padding:0;}
  .hero-slide.is-product{object-position:center; padding:0;}
  .hero-text{max-width:100%;padding:40px 0 50px; margin-top: 0;}
  .hero-lead,.hero-brand{font-size:1.9rem;}
  .hero-brand-sub{font-size:1.4rem; margin-bottom:22px;}
}
@media(max-width:600px){
  .hero-lead,.hero-brand{font-size:1.6rem;}
  .hero-brand-sub{font-size:1.2rem; margin-bottom:20px;}
  .hero-desc{font-size:.9rem; line-height:1.75;}
  .hero-btns{flex-direction:column; align-items:stretch;}
  .hero-btn-primary,.hero-btn-ghost{justify-content:center;}
}

/*=========================================================================
섹션 공통
=========================================================================*/
.sec{padding:96px 0;}
.sec-line{border-top:1px solid #eee}
.sec-cream{background:var(--bg-cream); padding:96px 0;}
.sec-dark{background:#111; padding:96px 0;}
.sec-eyebrow{font-size:.7rem; letter-spacing:.18em; color:var(--main); margin-bottom:14px;text-transform:uppercase; display:block; font-family:var(--f-sub-en);}
.sec-title{font-size:2rem; font-weight:500; line-height:1.25; margin-bottom:12px; letter-spacing:-.02em;}
.sec-title em{font-style:normal; color:var(--main);}
.sec-title-white{color:var(--white);}

@media(max-width:960px){
  .sec,.sec-cream,.sec-dark{padding:60px 0;}
}

/* 2-TIER TITLE — 안내 줄 + 선언 줄 */
.sec-title.two-tier{font-weight:400;}
.sec-title-intro{display:block; font-size:1.2rem; font-weight:400; color:var(--gray-500); letter-spacing:-.01em; line-height:1.45; margin-bottom:8px}
.sec-title-main{display:block; font-size:2.3rem; font-weight:700; color:var(--text-dark); letter-spacing:-.025em; line-height:1.2;}
.sec-title-white .sec-title-intro{color:var(--gray-400);}
.sec-title-white .sec-title-main{color:var(--white);}
.sec-sub{font-size:.9rem; color:var(--gray-500); line-height:1.8; max-width:600px;}
.sec-head{margin-bottom:56px;}
.sec-head.center{text-align:center;}
.sec-head.center .sec-sub{margin:0 auto;}

@media(max-width:960px){
  .sec-title{font-size:1.5rem;}
  .sec-title-intro{font-size:.9rem; margin-bottom:6px;}
  .sec-title-main{font-size:1.6rem;}
  .sec-head{margin-bottom:40px;}
}
@media(max-width:600px){
  .sec-title-intro{font-size:.8rem;}
  .sec-title-main{font-size:1.5rem;}  
  .sec-sub{font-size:.9rem}
}


/*=========================================================================
SKIN CONCERNS
=========================================================================*/
.concern-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.concern-card{background:var(--white); border:1px solid var(--gray-100); border-radius:16px; padding:40px 32px; text-align:center; transition:transform .2s,box-shadow .2s;}
.concern-card:hover{transform:translateY(-3px); box-shadow:0 16px 40px -24px rgba(26,26,26,.18);}
.concern-icon{width:68px; height:68px; border-radius:16px; background:var(--bg-peach); color:var(--main); display:flex; align-items:center; justify-content:center; margin:0 auto 22px;}
.concern-icon svg{width:34px; height:34px; }
.concern-title{font-size:1.3rem; font-weight:700; color:var(--text-dark); letter-spacing:-.01em; line-height:1.5;}
.concern-body{font-size:.9rem; color:var(--gray-400); line-height:1.65; margin-top:10px;}

@media(max-width:960px){
  .concern-grid{grid-template-columns:1fr;}
  .concern-title{font-size:1.2rem;}
}
@media(max-width:600px){
  .concern-card{padding:30px 22px;}
}

/*=========================================================================
BRIDGE
=========================================================================*/
/* BRIDGE */
.bridge{position: relative; padding:64px 0; text-align:center; overflow: hidden;}
.bridge::before{content: ""; position: absolute; inset: 0; background: url(../img/content/cta_bg.png) no-repeat 100%/ cover; transform: scale(1); transition: transform 5s cubic-bezier(.16,1,.3,1); z-index: 0; will-change: transform;}
.bridge.in::before{transform: scale(1.12);}
.bridge::after{content: ""; position: absolute; inset: 0; background: rgba(43, 33, 23, .6); z-index: 0;}
.bridge .inner{position: relative; z-index: 1;}
.bridge-logo{width: 110px; height: 50px; margin: 0 auto 10px;}
.bridge-logo img{object-fit: contain;}
.bridge-line{font-size:1.5rem; font-weight:600; color:var(--white); line-height:1.5; letter-spacing:-.01em; margin-bottom:18px; word-break:keep-all}
.bridge-cta{font-size:1rem; font-weight:500; color:var(--gray-200); letter-spacing:.01em; word-break:keep-all;}
.bridge-arrows{margin-top:22px;}
.bridge-arrows a{display:flex; flex-direction:column; align-items:center;}
.bridge-arrow{width:12px; height:12px; line-height:0; animation:bridgeArrowMove 1.6s ease-in-out infinite;}
.bridge-arrow i{display:block; width:100%; height:100%; border-right:2px solid #c9b38c; border-bottom:2px solid #c9b38c; transform:rotate(45deg); }

@keyframes bridgeArrowMove{
  0%,100%{opacity:.25; transform:translateY(0);}
  50%{opacity:.8; transform:translateY(5px);}
}

@media(max-width:960px){
  .bridge-line{font-size:1.2rem;}
  .bridge-cta{font-size:.9rem;}
}

/*=========================================================================
HOW IT WORKS
=========================================================================*/
.stepsB{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--gray-100); border:1px solid var(--gray-100); border-radius:16px; overflow:hidden;}
.blockB{background:var(--white); padding:32px 30px 34px; position:relative; overflow:hidden; transition:background-color .2s;}
.blockB:hover{background:var(--bg-cream);}
.blockB-num{position:absolute; top:24px; right:26px; font-family:var(--f-sub-en); font-size:2.9rem; font-weight:400; color:rgba(201,169,110,.35); letter-spacing:0; line-height:1; z-index:0;}
.blockB-inner{position:relative; z-index:1; padding-top:6px;}
.blockB-kicker{font-family:var(--f-sub-en); font-size:.7rem; font-weight:400; letter-spacing:.16em; color:var(--gray-400); text-transform:uppercase; margin-bottom:15px; line-height:1.5;}
.blockB-verb{display:inline-block; font-family:var(--f-sub-en); font-size:1.1rem; font-weight:600; color:var(--main-dark); letter-spacing:.1em; margin-bottom:16px;}
.blockB-heading{font-size:1.1rem; font-weight:700; color:var(--text-dark); line-height:1.42; margin-bottom:11px; letter-spacing:-.015em; word-break:keep-all;}
.blockB-body{font-size:.85rem; color:var(--gray-700); line-height:1.72; margin-bottom:22px;}
.blockB-divider{width:28px; height:1px; background:var(--border-beige); margin-bottom:23px;}
.blockB-foot{display:flex; align-items:center; flex-wrap:wrap; gap:8px; font-size:.7rem;}
.blockB-chip{color:var(--main-dark); letter-spacing:.02em; background:var(--bg-tag); border-radius:100px; padding:4px 10px;}
.blockB-where{color:var(--gray-400);}
.blockB-where::before{content:none;}
.flow-sub{font-weight:700; color:var(--main-dark); letter-spacing:-.01em; max-width:none;}
.flow-sub .fa{color:var(--main); margin:0 7px; font-weight:700;}

@media(max-width:960px){
  .stepsB{grid-template-columns:1fr 1fr; gap:1px;}
}
@media(max-width:600px){
  .stepsB{grid-template-columns:1fr;}
  .blockB{padding:24px 22px 26px;}
  .blockB-num{font-size:2.3rem; top:18px; right:20px;}
  .blockB-inner{padding-top:4px;}
}

/*=========================================================================
BENEFITS
=========================================================================*/
.benefit-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:16px;}
@media(min-width:961px) and (max-width:1120px){
  .benefit-grid{grid-template-columns:repeat(3,1fr);}
}
.benefit-item{position:relative;background:var(--bg-cream); border:1px solid var(--border-beige); border-radius:16px; padding:30px 26px;}
.benefit-num{font-family:var(--f-sub-en); font-size:.8rem; font-weight:400; letter-spacing:.12em; color:var(--main); margin-bottom:14px;}
.benefit-icon{width:48px; height:48px; border-radius:14px; background:var(--white); border:1px solid var(--border-beige); color:var(--main); display:flex; align-items:center; justify-content:center;margin-bottom:18px;}
.benefit-icon svg{width:24px; height:24px;}
.benefit-title{font-size:1.2rem; font-weight:700; color:var(--text-dark); margin-bottom:10px; line-height:1.4; letter-spacing:-.01em;}
.benefit-body{font-size:.85rem; color:var(--gray-600); line-height:1.55; min-height:63px;}

@media(max-width:960px){
  .benefit-grid{grid-template-columns:1fr 1fr; gap:16px;}
}
@media(max-width:600px){
  .benefit-grid{grid-template-columns:1fr; gap:14px;}
  .benefit-item{padding:26px 22px;}
}

/*=========================================================================
CARE CASES
=========================================================================*/
.case-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.case-card{border:1px solid var(--gray-100); border-radius:16px; overflow:hidden; background:var(--white); display:flex; flex-direction:column; transition:transform .2s,box-shadow .2s;}
.case-card:hover{transform:translateY(-3px); box-shadow:0 16px 40px -24px rgba(26,26,26,.18);}
.case-img{position:relative; width:100%; aspect-ratio:16/9; overflow:hidden; background:var(--bg-ivory); border-bottom:1px solid var(--border-beige);}
.case-img img{width:100%; height:100%; object-fit:cover; object-position:center; display:block;}
.case-img::after{content:""; position:absolute; left:0; right:0; bottom:0; height:44%; background:linear-gradient(to top,rgba(20,18,15,.42),rgba(20,18,15,0));pointer-events:none;}
.ba-band{position:absolute; left:0; right:0; bottom:12px; display:flex; align-items:center; gap:8px; padding:0 12px; pointer-events:none; z-index:2;}
.ba-chip{font-size:.7rem; font-weight:700; letter-spacing:.5px; line-height:1; padding:5px 11px; border-radius:20px; white-space:nowrap; font-family:var(--f-sub-en); box-shadow:0 2px 8px rgba(0,0,0,.22);}
.ba-chip-before{background:rgba(26,26,26,.82); color:var(--white);}
.ba-chip-after{background:var(--main-dark); color:#fff;}
.ba-line{flex:1;position:relative; height:2px; border-radius:2px; background:linear-gradient(90deg,rgba(255,255,255,.55),rgba(201,169,110,.95));}
.ba-line::after{content:""; position:absolute; right:-2px; top:50%; transform:translateY(-50%); border-left:7px solid var(--main); border-top:5px solid transparent; border-bottom:5px solid transparent;}
.case-body{padding:22px 32px 26px;}
.case-tag{font-size:.7rem; font-weight:700; letter-spacing:.07em; margin-bottom:10px; color:var(--main); font-family:var(--f-sub-en);}
.case-title{font-size:1.1rem; font-weight:700; color:var(--text-dark); letter-spacing:-.01em; margin-bottom:9px;}
.case-desc{font-size:.9rem; color:var(--gray-600); line-height:1.7;}
.case-notice{margin:40px auto 0; padding-top: 30px; max-width:var(--max-cont); font-size:.7rem; color:#b3aa98; line-height:1.78; text-align:center; border-top: 1px solid #9a8f7a22;}
.case-notice b{color:#9a8f7a; font-weight:600;}

@media(max-width:960px){
  .case-grid{grid-template-columns:1fr;}
}
@media(max-width:600px){
  .case-body{padding:18px 20px 22px;}
}

/*=========================================================================
PRODUCT LINE
=========================================================================*/
.line-grid{display:grid; grid-template-columns:1fr 1fr; gap:24px;}
.line-card{border:1px solid var(--gray-100); border-radius:16px; overflow:hidden; background:var(--white); display:flex; flex-direction:column; position:relative;}
.line-card.a{--line-c:#df9957; --line-tint:#fcf9f6;}
.line-card.b{--line-c:#86ac5f; --line-tint:#f8faf6;}
.line-card::before{content:''; position:absolute; top:0; left:0; right:0; height:3px; background:var(--line-c); z-index:1;}
.line-card-head{padding:30px 44px 24px; background:var(--line-tint);}
.line-name{display:flex;align-items:center;gap:14px;margin-bottom:12px}
.line-letter{font-family:var(--f-sub-en); font-size:2.8rem; font-weight:400; line-height:.9; letter-spacing:0; color:var(--line-c);}
.line-label{display:inline-block; font-size:.9rem; font-weight:700; color:var(--line-c); letter-spacing:.01em; font-family:var(--f-sub-en);background:var(--white); border-radius:100px; padding:5px 13px;}
.line-label i{color: var(--gray-800); margin-right: 5px;}
.line-title{font-size:1.4rem; font-weight:700; line-height:1.4; letter-spacing:-.015em; color:var(--text-dark); margin-bottom:0;}
.line-card-img{width:100%; display:block; aspect-ratio:16/10; object-fit:contain; background:var(--white);}
.line-card-content{padding:24px 44px 30px;}
.line-desc{font-size:.9rem; color:var(--gray-800); line-height:1.78; margin-bottom:20px;}
.line-points{display:flex; flex-direction:column; gap:9px;}
.line-point{position:relative; padding-left:18px; font-size:.9rem; color:var(--gray-800); line-height:1.5;}
.line-point::before{content:'·'; position:absolute; left:0; top:-2px; font-size:.9rem; color:var(--line-c); font-weight:700;}

@media(max-width:960px){
  .line-grid{grid-template-columns:1fr;}
  .line-point::before{top: 0;}
}
@media(max-width:600px){
  .line-card-head{padding:24px 22px 20px;}
  .line-card-content{padding:18px 22px 24px;}
  .line-point{padding-left:14px;}
}

/*=========================================================================
CLINIC + HOME, ONE BOX
=========================================================================*/
.hc-timeline{display:grid; grid-template-columns:1fr 1fr; gap:60px; position:relative; margin-bottom:28px;}
.hc-connector{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:38px; height:38px; border-radius:50%; background:var(--main); display:flex;align-items:center;justify-content:center; z-index:2;}
.hc-connector svg{width:15px;height:15px; color: #fff;}
.hc-step-block{background:var(--white); border:1px solid var(--gray-100); border-radius:18px; padding:26px 28px; position:relative; overflow:hidden; box-shadow:0 12px 40px rgba(0,0,0,.05)}
.hc-step-block::before{content:''; position:absolute; top:0; left:0; right:0; height:4px; background:var(--main);z-index:1}
.hc-step-label{font-size:.7rem; font-weight:700 ;letter-spacing:.1em;color:var(--main-dark); margin-bottom:10px;}
.hc-step-title{font-size:1.3rem; font-weight:700; color:var(--text-dark); letter-spacing:-.015em; margin-bottom:9px;}
.hc-step-desc{font-size:.9rem; color:var(--gray-700); line-height:1.7;margin-bottom:14px;}
.hc-prod-card{display:flex; align-items:center; gap:14px; padding:12px 15px; background:var(--bg-cream); border-radius:10px; margin-bottom:8px;}
.hc-prod-card:last-child{margin-bottom:0}
.hc-chip{width:34px;height:38px; color:var(--main); display:flex; align-items:center;justify-content:center; flex-shrink:0;}
.hc-chip svg{width:30px; height:36px;}
.hc-prod-name{font-size:.9rem; font-weight:600; color:var(--text-dark); margin-bottom:3px;}
.hc-prod-sub{font-size:.8rem; color:var(--gray-400); line-height:1.5}
.hc-box-banner{width:65%; margin:0 auto; border-radius:18px; aspect-ratio:15/8; overflow:hidden;}
.hc-box-banner img{width:100%; height:100%; object-fit:contain; display:block;}

@media(max-width:960px){
  .why3-grid,.hc-timeline,.hcg-grid,.cta-grid{grid-template-columns:1fr !important; gap:32px;}
  .hc-connector{position:static; justify-self:center; margin: -10px auto; transform: inherit;}
  .hc-box-banner{aspect-ratio:3/2; width:100%;}
}
@media(max-width:600px){
  .hc-step-block{padding:24px 20px;}
}

/*=========================================================================
HOMECARE GUIDE
=========================================================================*/
.hcg-grid{display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center;}
.hcg-steps{display:flex; flex-direction:column;}
.hcg-step{display:flex; gap:22px;}
.hcg-rail{display:flex; flex-direction:column; align-items:center; flex-shrink:0;}
.hcg-node{width:60px; height:60px; border-radius:50%; border:1px solid var(--border-beige);background:var(--bg-cream); color:var(--main); display:flex; align-items:center; justify-content:center;}
.hcg-node svg{width:30px; height:30px;}
.hcg-line{flex:1; width:1px; background:var(--border-beige); margin:6px 0; min-height:30px;}
.hcg-content{padding-bottom:40px;}
.hcg-step:last-child .hcg-content{padding-bottom:0;}
.hcg-label{font-size:.8rem; font-weight:600; letter-spacing:.08em; color:var(--main);margin-bottom:11px;}
.hcg-title{font-size:1.3rem; font-weight:600; color:var(--text-dark); letter-spacing:-.02em; margin-bottom:15px; line-height:1.35;}
.hcg-list{list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:11px; margin-bottom: 10px;}
.hcg-list li{color:var(--gray-800); line-height:1.65; padding-left:17px;position:relative}
.hcg-list li::before{content:'·'; position:absolute; left:0; color:var(--main); font-weight:700}
.hcg-img{width:100%; align-self:end; line-height:0; margin-bottom:-56px}
.hcg-img img{width:100%; max-width:490px; height:auto; display:block; margin:0 auto; border-radius:18px;}
.hcg-chip{display:inline-block; margin-top:15px; font-size:.8rem; color:var(--main-dark); background:var(--bg-tag); border-radius:100px;padding:7px 15px; font-weight:600; letter-spacing:-.003em;}
.hcg-tail{width:1px; height:24px; background:var(--border-beige)}
.hcg-end{padding-left:20px;}
.hcg-banner{display:inline-block; background:var(--main); color:#fff;font-size:1rem; font-weight:700; letter-spacing:-.01em; border-radius:100px; padding:16px 28px; line-height:1.3; margin-top:2px;}
#homecare-guide{padding-top:104px; padding-bottom:56px; overflow:hidden}

@media(max-width:960px){
  .hcg-end{padding-left:10px;}
  .hcg-title{font-size:1.2rem;}
  .hcg-list li{font-size: .9rem; padding-left: 12px;}
}
@media(max-width:600px){
  .hcg-grid{gap:36px;}
  .hcg-step{gap: 15px;}
  .hcg-node{width:46px; height:46px;}
  .hcg-end{padding-left:68px;}
  .hcg-title{font-size:1.1rem;}
  .hcg-step:last-child .hcg-content{width: 100%;}
  .hcg-end{padding-left:10px; width: 100%;}
  .hcg-banner{width: 100%; display: block; text-align: center;}
}

/*=========================================================================
HOW TO START
=========================================================================*/
.start-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:28px}
.start-card{position:relative; text-align:center; padding:34px 22px 30px; background:var(--white); border:1px solid var(--gray-100); border-radius:16px; transition:transform .2s,box-shadow .2s,border-color .2s}
.start-card:hover{transform:translateY(-3px); border-color:var(--border-beige);box-shadow:0 16px 40px -24px rgba(26,26,26,.18)}
.start-card:not(:last-child)::after{content:''; position:absolute; top:50%; right:-24px; width:14px; height:14px; transform:translateY(-50%); background-color:var(--main); -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5l7 7-7 7' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5l7 7-7 7' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat; -webkit-mask-size:contain;mask-size:contain; z-index:2}
.start-num{width:40px; height:40px; border-radius:50%; background:var(--bg-tag); color:var(--main-dark); font-family:var(--f-sub-en); font-size:.9rem; line-height: 1; font-weight:600; display:flex; align-items:center; justify-content:center; margin:0 auto 16px;}
.start-title{font-weight:600; color:var(--text-dark); margin-bottom:8px; word-break:keep-all}
.start-body{font-size:.8rem; color:var(--gray-500); line-height:1.65; word-break:keep-all}

@media(max-width:960px){
  .start-grid{grid-template-columns:1fr 1fr; gap:16px;}
  .start-card::after{display:none;}
}
@media(max-width:600px){
  .start-card{padding:26px 20px;}
}

/*=========================================================================
WHY CLINIC
=========================================================================*/
.why3-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.why-card{background:var(--white); border:1px solid var(--gray-100); border-radius:16px;padding:30px 32px; transition:transform .2s,box-shadow .2s}
.why-card:hover{transform:translateY(-3px); box-shadow:0 16px 40px -24px rgba(26,26,26,.18)}
.why-icon{width:46px; height:46px; border-radius:12px; background:var(--bg-peach);color:var(--main); display:flex; align-items:center; justify-content:center; margin-bottom:18px;}
.why-icon svg{width:24px;height:24px;}
.why-card-title{font-weight:600; color:var(--text-dark); margin-bottom:10px; letter-spacing:-.01em;}
.why-card-body{font-size:.9rem; color:var(--gray-700); line-height:1.72;}

@media(max-width:600px){
  .why-card{padding:24px 22px;}
}

/*=========================================================================
FAQ
=========================================================================*/
.faq-grid{display:grid; grid-template-columns:300px 1fr; gap:80px; align-items:start}
.faq-list{display:flex; flex-direction:column; gap:14px;}
.faq-item{background:var(--white); border:1px solid var(--gray-100); border-radius:16px;padding:0 28px; transition:border-color .25s,box-shadow .25s,background-color .25s}
.faq-item:hover{border-color:var(--border-beige); box-shadow:0 16px 40px -28px rgba(26,26,26,.16);}
.faq-item.active{background:var(--bg-cream); border-color:var(--border-beige); box-shadow:0 16px 40px -26px rgba(26,26,26,.14);}
.faq-q{display:flex;align-items:center; gap:18px; padding:22px 0; cursor:pointer;background:none; border:none; width:100%; text-align:left}
.faq-q-mark{flex-shrink:0; color:var(--main-dark); font-family:var(--f-sub-en); font-size:1rem; font-weight:600; transition:color .25s}
.faq-q-text{flex:1; font-size:.9rem; font-weight:500; color:var(--text-dark); line-height:1.5}
.faq-icon{flex-shrink:0; width:26px; height:26px; border-radius:50%; border:1px solid var(--gray-200); color:var(--gray-400); display:flex; align-items:center;justify-content:center;transition:transform .3s,border-color .25s,color .25s;}
.faq-icon svg{display:block;}
.faq-item.active .faq-icon{transform:rotate(45deg); border-color:var(--main); color:var(--main);}
.faq-a-wrap{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s ease;}
.faq-a-wrap-inner{overflow:hidden;}
.faq-item.active .faq-a-wrap{grid-template-rows:1fr;}
.faq-a{font-size:.9rem; color:var(--gray-700); line-height:1.78; padding:0 44px 24px 0;}

@media(max-width:960px){
  .faq-grid{grid-template-columns:1fr; gap:25px;}
}
@media(max-width:600px){
  .faq-item{padding:0 18px;}
  .faq-q{gap:12px;}
  .faq-q-mark{font-size:.9rem}
  .faq-a{padding-right:24px;}
}
/*=========================================================================
CTA
=========================================================================*/
.final-top{text-align:center; margin-bottom:36px;}
.final-logo{width: 110px; height: 50px; margin: 0 auto 10px;}
.final-logo img{object-fit: contain;}
.final-top h2{font-size:2rem; font-weight:500; color:var(--white); line-height:1.3; margin-bottom:14px; letter-spacing:-.02em;}
.final-top p{font-size:.9rem; color:var(--gray-500); line-height:1.8; margin:0 auto;}
.cta-grid{display:flex; flex-direction:column; align-items:center; text-align:center;gap:18px; padding-top:8px;}
.cta-lead{font-size:.9rem; color:#9a9a9a; line-height:1.6; font-weight: 500;}
.cta-buttons{display:flex; flex-direction:column; gap:12px; width:100%; max-width:440px;}
.cta-kakao{display:flex; align-items:center; justify-content:center; gap:10px; width:100%; padding:16px; background:#FEE500;color:var(--text-dark); font-size:.9rem; font-weight:600; border:none; border-radius:8px; cursor:pointer; transition:opacity .2s;text-decoration:none; box-sizing:border-box;}
.cta-kakao img{width: 15px; height: auto;}
.cta-kakao:link,.cta-kakao:visited,.cta-kakao:hover,.cta-kakao:active{color:var(--text-dark); text-decoration:none;}
.cta-kakao:hover{opacity:.9;}
.cta-phone{display:flex; align-items:center; justify-content:space-between; padding:15px 20px; border:1px solid #2a2a2a; border-radius:8px;}
.cta-phone-label{font-size:.8rem; color:var(--gray-600);}
.cta-phone-num{font-size:.9rem; font-weight:500; color:var(--white);}

@media(max-width:960px){
  .final-top h2{font-size:1.5rem;}
}
@media(max-width:600px){
  .final-top h2{font-size:1.3rem;}
}
@media(max-width:350px){
  .cta-phone{flex-direction: column; gap: 2px;}
}









