@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable.min.css");
@import url("https://fonts.googleapis.com/css2?family=Archivo:wdth,wght@62..125,200..800&display=swap");

:root{
  --ink:#06080c;
  --navy:#0a1527;
  --navy-2:#0f1e35;
  --navy-3:#16294a;
  --paper:#f3f4f6;
  --white:#f7f8fa;
  --mute:#8a93a1;
  --mute-d:#5d6676;
  --line:rgba(255,255,255,.12);
  --line-d:rgba(6,8,12,.12);
  --silver:linear-gradient(100deg,#7f8792 0%,#e8ebef 28%,#9aa2ad 48%,#f5f6f8 70%,#868e99 100%);
  --silver-solid:#c3c8cf;
  --kr:"Pretendard Variable",Pretendard,-apple-system,"Apple SD Gothic Neo","Noto Sans KR",sans-serif;
  --en:"Archivo","Pretendard Variable",sans-serif;
  --pad:clamp(20px,5vw,80px);
  --max:1520px;
  --hdr:88px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--kr);color:var(--ink);background:var(--white);font-size:16px;line-height:1.7;letter-spacing:-.01em;-webkit-font-smoothing:antialiased;word-break:keep-all}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
ul{list-style:none}
p,h1,h2,h3,h4{text-wrap:pretty}

.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--pad)}
.en{font-family:var(--en);font-stretch:118%;letter-spacing:.06em;text-transform:uppercase}
.silver{background:var(--silver);-webkit-background-clip:text;background-clip:text;color:transparent}
.eyebrow{font-family:var(--en);font-stretch:118%;font-size:12px;font-weight:500;letter-spacing:.32em;text-transform:uppercase;color:var(--mute);display:flex;align-items:center;gap:14px}
.eyebrow::before{content:"";width:36px;height:1px;background:currentColor;opacity:.7}
.dark{background:var(--navy);color:var(--white)}
.black{background:var(--ink);color:var(--white)}
.paper{background:var(--paper)}

/* ---------- Header ---------- */
.hdr{position:fixed;inset:0 0 auto 0;height:var(--hdr);z-index:50;color:#fff;transition:background .4s,height .4s,border-color .4s;border-bottom:1px solid transparent}
.hdr .wrap{height:100%;display:flex;align-items:center;justify-content:space-between;max-width:none}
.hdr.solid{background:rgba(7,12,22,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-color:var(--line);height:72px}
.logo{display:flex;align-items:flex-end;gap:12px;line-height:1}
.logo-mark{width:62px;height:auto;flex:none;filter:drop-shadow(0 1px 6px rgba(0,0,0,.25))}
.logo-txt{padding-bottom:1px;white-space:nowrap}
.logo-txt b{display:block;font-family:var(--en);font-stretch:112%;font-weight:700;font-size:17px;letter-spacing:.08em;color:#e9ecf0}
.logo-txt small{display:block;font-size:11px;letter-spacing:.32em;color:var(--mute);margin-top:5px;font-weight:500}
.gnb{display:flex;gap:clamp(28px,3.4vw,64px);align-items:center}
.gnb a{font-size:15px;font-weight:500;letter-spacing:.02em;position:relative;padding:8px 0;opacity:.86;transition:opacity .2s}
.gnb a:hover,.gnb a.on{opacity:1}
.gnb a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--silver);transform:scaleX(0);transform-origin:left;transition:transform .35s}
.gnb a:hover::after,.gnb a.on::after{transform:scaleX(1)}
.hdr-cta{display:flex;align-items:center;gap:28px}
.hdr-tel{font-family:var(--en);font-stretch:110%;font-size:13px;letter-spacing:.12em;color:#cfd4db}
.burger{display:none;width:44px;height:44px;background:none;border:0;cursor:pointer;position:relative}
.burger i{position:absolute;left:10px;right:10px;height:1.5px;background:#fff;transition:transform .3s,opacity .3s}
.burger i:nth-child(1){top:16px}.burger i:nth-child(2){top:22px}.burger i:nth-child(3){top:28px;left:18px}
.menu-open .burger i:nth-child(1){transform:translateY(6px) rotate(45deg)}
.menu-open .burger i:nth-child(2){opacity:0}
.menu-open .burger i:nth-child(3){left:10px;transform:translateY(-6px) rotate(-45deg)}
.mnav{position:fixed;inset:0;z-index:45;background:var(--ink);color:#fff;padding:120px var(--pad) 40px;display:flex;flex-direction:column;justify-content:space-between;opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s}
.menu-open .mnav{opacity:1;visibility:visible}
.mnav ul li{border-bottom:1px solid var(--line)}
.mnav ul a{display:flex;justify-content:space-between;align-items:baseline;padding:22px 0;font-size:26px;font-weight:600}
.mnav ul a span{font-family:var(--en);font-stretch:118%;font-size:11px;letter-spacing:.24em;color:var(--mute);font-weight:500}
.mnav .mnav-foot{font-size:13px;color:var(--mute);line-height:2}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:18px;height:56px;padding:0 30px;border:1px solid currentColor;font-size:14px;font-weight:600;letter-spacing:.04em;cursor:pointer;background:none;transition:background .3s,color .3s,border-color .3s}
.btn .arr{width:28px;height:1px;background:currentColor;position:relative;transition:width .3s}
.btn .arr::after{content:"";position:absolute;right:0;top:-3px;width:7px;height:7px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg)}
.btn:hover .arr{width:40px}
.btn-light{color:#fff;border-color:rgba(255,255,255,.4)}
.btn-light:hover{background:#fff;color:var(--ink);border-color:#fff}
.btn-dark{color:var(--ink);border-color:rgba(6,8,12,.3)}
.btn-dark:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.btn-solid{background:var(--white);color:var(--ink);border-color:var(--white)}
.btn-solid:hover{background:transparent;color:#fff}

/* ---------- Sub hero ---------- */
.subhero{position:relative;height:min(78vh,720px);min-height:520px;color:#fff;overflow:hidden;background:var(--ink)}
.subhero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.72;transform:scale(1.06);animation:kb 14s ease-out forwards}
.subhero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,8,12,.55) 0%,rgba(6,8,12,.1) 40%,rgba(10,21,39,.92) 100%)}
.subhero .wrap{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:clamp(48px,7vw,96px)}
.subhero h1{font-size:clamp(40px,6vw,88px);font-weight:700;letter-spacing:-.03em;line-height:1.08;margin-top:22px}
.subhero .en-big{font-family:var(--en);font-stretch:125%;font-weight:300;font-size:clamp(13px,1.1vw,16px);letter-spacing:.42em;color:#c9ced6;margin-top:18px}
.crumb{position:absolute;right:var(--pad);bottom:clamp(48px,7vw,96px);z-index:2;font-size:12px;letter-spacing:.14em;color:#aab1bb;font-family:var(--en);font-stretch:110%;text-transform:uppercase}
.crumb b{color:#fff;font-weight:500}
@keyframes kb{to{transform:scale(1)}}

/* Sticky local nav */
.lnb{position:sticky;top:72px;z-index:30;background:var(--navy);color:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.lnb .wrap{display:flex;overflow-x:auto;scrollbar-width:none}
.lnb .wrap::-webkit-scrollbar{display:none}
.lnb a{flex:none;padding:22px 0;margin-right:clamp(28px,4vw,64px);font-size:14px;font-weight:500;color:#aeb5c0;position:relative;white-space:nowrap}
.lnb a.on,.lnb a:hover{color:#fff}
.lnb a.on::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--silver)}

/* ---------- Sections ---------- */
.sec{padding:clamp(96px,12vw,180px) 0}
.sec-head{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,120px);align-items:end;margin-bottom:clamp(56px,7vw,100px)}
.sec-title{font-size:clamp(34px,4.2vw,64px);font-weight:700;letter-spacing:-.035em;line-height:1.14;margin-top:24px}
.sec-desc{font-size:clamp(16px,1.15vw,18px);color:var(--mute-d);line-height:1.9;max-width:640px}
.dark .sec-desc,.black .sec-desc{color:#a3abb7}

/* ---------- Footer ---------- */
.ftr{background:var(--ink);color:#c2c8d0;padding:clamp(72px,8vw,120px) 0 40px;position:relative;overflow:hidden}
.ftr-brand{display:flex;align-items:flex-end;gap:clamp(16px,2vw,36px);margin-bottom:clamp(56px,6vw,96px)}
.ftr-mark{width:clamp(110px,17vw,320px);flex:none;margin-bottom:.4%}
.ftr-brand .ftr-big{margin-bottom:0}
.ftr-big{font-family:var(--en);font-stretch:112%;font-weight:700;font-size:clamp(32px,8vw,150px);letter-spacing:.02em;line-height:.85;white-space:nowrap;margin-bottom:clamp(56px,6vw,96px);opacity:.95}
.ftr-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:40px;padding-top:40px;border-top:1px solid var(--line)}
.ftr h5{font-family:var(--en);font-stretch:118%;font-size:11px;letter-spacing:.28em;color:var(--mute);font-weight:500;margin-bottom:18px;text-transform:uppercase}
.ftr p,.ftr li{font-size:14px;line-height:2}
.ftr li a:hover{color:#fff}
.ftr-bot{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:72px;padding-top:28px;border-top:1px solid var(--line);font-size:12px;color:var(--mute-d);letter-spacing:.04em}
.ftr-bot a:hover{color:#fff}

/* top button */
.totop{position:fixed;right:24px;bottom:24px;width:52px;height:52px;border-radius:50%;background:rgba(10,21,39,.9);border:1px solid var(--line);color:#fff;z-index:40;cursor:pointer;font-family:var(--en);font-size:10px;letter-spacing:.16em;opacity:0;transform:translateY(10px);transition:.3s;backdrop-filter:blur(8px)}
.totop.show{opacity:1;transform:none}

/* brand mark accents */
.mark-deco{position:absolute;pointer-events:none;z-index:1}
.mark-deco svg{width:100%;height:auto;display:block}
.subhero .mark-deco{right:-4%;bottom:-6%;width:min(62vw,980px);opacity:.14}
.eyebrow.m::before{display:none}
.eyebrow .em{width:34px;height:auto;flex:none}

/* reveal */
.rv{opacity:0;transform:translateY(36px);transition:opacity 1s cubic-bezier(.2,.7,.2,1),transform 1s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}
.rv.d1{transition-delay:.1s}.rv.d2{transition-delay:.2s}.rv.d3{transition-delay:.3s}

/* CTA band */
.cta{position:relative;color:#fff;overflow:hidden;background:var(--ink)}
.cta img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55}
.cta::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,8,12,.92) 0%,rgba(10,21,39,.6) 55%,rgba(10,21,39,.3) 100%)}
.cta .wrap{position:relative;z-index:2;padding-top:clamp(96px,11vw,170px);padding-bottom:clamp(96px,11vw,170px);display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap}
.cta h2{font-size:clamp(32px,4vw,60px);font-weight:700;letter-spacing:-.03em;line-height:1.2;margin-top:24px}

@media (max-width:1080px){
  .gnb,.hdr-tel{display:none}
  .burger{display:block}
  .hdr-cta .btn{display:none}
  .sec-head{grid-template-columns:1fr;align-items:start}
  .ftr-grid{grid-template-columns:1fr 1fr}
  .crumb{display:none}
}
@media (max-width:640px){
  :root{--hdr:68px}
  .hdr.solid{height:64px}
  .lnb{top:64px}
  .ftr-grid{grid-template-columns:1fr}
  .logo-txt small{display:none}
  .logo-mark{width:48px}
  .logo-txt b{font-size:15px}
  .ftr-brand{flex-direction:column;align-items:flex-start;gap:20px}
  .btn{height:52px;padding:0 24px}
  .subhero{min-height:440px;height:62vh}
}