:root{
  --blue:#236fe8; --blue2:#0d57cf; --sky:#dff4ff; --sky2:#f3fbff;
  --ink:#173052; --muted:#68809c; --line:#d8e8f6; --white:#fff; --navy:#11366d;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Arial,"Pretendard","Noto Sans KR","Apple SD Gothic Neo",sans-serif;color:var(--ink);background:#fff;line-height:1.65}
a{text-decoration:none;color:inherit}
img{max-width:100%}
.wrap{max-width:1180px;margin:auto;padding:0 24px}
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);border-bottom:1px solid #e8f1f8}
.nav{height:78px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.brand-img{height:54px;width:170px;object-fit:contain;object-position:left center}
.nav-links{display:flex;gap:25px;font-weight:800;font-size:14px;color:#385a7b}
.nav-links a:hover{color:var(--blue)}
.call{background:var(--blue);color:#fff;padding:12px 18px;border-radius:999px;font-weight:900;box-shadow:0 8px 22px #236fe82b}
.hero{position:relative;overflow:hidden;background:linear-gradient(145deg,#f7fdff 0%,#e8f7ff 48%,#dff1ff 100%);padding:64px 0 78px}
.hero:before,.hero:after{content:"";position:absolute;border-radius:50%;filter:blur(2px);pointer-events:none}
.hero:before{width:420px;height:420px;background:#8fdcff55;right:-120px;top:-180px}
.hero:after{width:260px;height:260px;background:#6ea6ff33;left:-90px;bottom:-110px}
.hero-grid{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:50px;align-items:center}
.hero-logo{display:inline-block;background:#fff;border:1px solid #d9ebf7;border-radius:22px;padding:12px 18px;box-shadow:0 10px 30px #276da713;margin-bottom:20px}
.hero-logo img{width:290px;display:block}
.eyebrow{display:inline-flex;gap:8px;align-items:center;color:var(--blue2);font-weight:900;font-size:14px;letter-spacing:.02em}
.dot{width:8px;height:8px;border-radius:50%;background:#57b9f8;box-shadow:0 0 0 5px #57b9f822}
.hero h1{font-size:54px;line-height:1.12;letter-spacing:-.05em;margin:13px 0 18px}
.hero p{font-size:19px;color:#5d7894;max-width:620px}
.btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 21px;border-radius:14px;background:var(--blue);color:#fff;font-weight:900;box-shadow:0 9px 23px #236fe825}
.btn.ghost{background:#fff;color:var(--blue2);border:1px solid #c7e1f4;box-shadow:none}
.photo-stack{position:relative;padding:18px}
.photo-stack:before{content:"";position:absolute;inset:0;background:#fff;border-radius:34px;transform:rotate(4deg);box-shadow:0 20px 55px #286da825}
.photo-stack img{position:relative;z-index:1;width:100%;height:520px;object-fit:cover;border-radius:28px;display:block}
.photo-tag{position:absolute;z-index:2;left:35px;bottom:38px;background:rgba(17,54,109,.92);color:#fff;border-radius:13px;padding:10px 14px;font-size:13px;font-weight:900}
.quick{position:relative;margin-top:-30px;z-index:4}
.quick-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.quick-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:20px;box-shadow:0 12px 30px #1c6a9f12}
.quick-card b{display:block;color:var(--blue2);font-size:16px}.quick-card span{font-size:13px;color:var(--muted)}
section{padding:84px 0}
.soft{background:var(--sky2)}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:28px;margin-bottom:34px}
.kicker{font-size:13px;letter-spacing:.08em;color:var(--blue);font-weight:900;text-transform:uppercase}
.title{font-size:39px;line-height:1.2;letter-spacing:-.04em;margin:7px 0 10px}
.desc{color:var(--muted);max-width:720px;margin:0}
.service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.service{position:relative;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:24px;padding:28px;min-height:210px}
.service:after{content:"";position:absolute;width:110px;height:110px;border-radius:50%;background:var(--sky);right:-35px;bottom:-35px}
.service .ico{width:48px;height:48px;border-radius:16px;background:var(--sky);display:grid;place-items:center;color:var(--blue);font-size:22px;font-weight:900;margin-bottom:20px}
.service h3{font-size:22px;margin:0 0 8px}.service p{color:var(--muted);margin:0}
.case-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.case-card{background:#fff;border:1px solid var(--line);border-radius:26px;overflow:hidden;transition:.2s;box-shadow:0 8px 28px #1f6ca80c}
.case-card:hover{transform:translateY(-4px);box-shadow:0 18px 38px #1f6ca816}
.case-cover{height:290px;overflow:hidden;background:#d9edf8}
.case-cover img{width:100%;height:100%;object-fit:cover;transition:.3s}
.case-card:hover .case-cover img{transform:scale(1.03)}
.case-body{padding:22px 23px 24px}
.case-type{display:inline-block;background:#e9f5ff;color:var(--blue2);font-size:12px;font-weight:900;padding:6px 10px;border-radius:999px}
.case-body h3{font-size:22px;margin:11px 0 7px}.case-body p{color:var(--muted);margin:0}
.more{display:inline-block;margin-top:16px;color:var(--blue);font-weight:900}
.logo-story{display:grid;grid-template-columns:.8fr 1.2fr;gap:40px;align-items:center}
.logo-card{background:#fff;border:1px solid var(--line);border-radius:30px;padding:28px;box-shadow:0 18px 46px #1f6da512}
.logo-card img{width:100%;display:block}
.points{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:24px}
.point{background:#fff;border:1px solid var(--line);border-radius:16px;padding:15px;font-size:14px;font-weight:800}
.finish-gallery{display:grid;grid-template-columns:2fr 1fr 1fr;grid-auto-rows:210px;gap:13px}
.finish-gallery img{width:100%;height:100%;object-fit:cover;border-radius:20px}
.finish-gallery img:first-child{grid-row:span 2}
.area-box{background:linear-gradient(135deg,#1e6be5,#2394e8);border-radius:30px;padding:38px;color:#fff;display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center}
.area-box h2{font-size:34px;margin:0 0 10px;line-height:1.2}.area-box p{margin:0;color:#e6f5ff}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:17px}.chip{padding:8px 12px;border-radius:999px;background:#ffffff1e;border:1px solid #ffffff38;font-weight:800;font-size:13px}
.contact-band{background:#11366d;color:#fff}.contact-inner{display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center}.contact-band .title{color:#fff}.phone{font-size:34px;font-weight:900;color:#7cd6ff}
footer{background:#0b2951;color:#b8d0e5;padding:34px 0;font-size:13px}

/* Case detail */
.case-hero{background:linear-gradient(145deg,#f6fcff,#e8f6ff);padding:64px 0}
.breadcrumb{font-size:13px;color:#7790a7;margin-bottom:15px}
.case-hero h1{font-size:45px;letter-spacing:-.045em;line-height:1.15;margin:0 0 13px}
.case-meta{display:flex;gap:8px;flex-wrap:wrap}.case-meta span{background:#fff;border:1px solid var(--line);padding:7px 11px;border-radius:999px;font-size:13px;font-weight:800;color:#476985}
.compare-intro{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:25px}
.compare-columns{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.compare-col{background:#fff;border:1px solid var(--line);border-radius:24px;padding:18px}
.compare-col.before{box-shadow:inset 0 4px 0 #9bb2c9}.compare-col.after{box-shadow:inset 0 4px 0 #3b8df0}
.compare-title{display:flex;align-items:center;justify-content:space-between;margin:0 0 13px;font-size:20px}
.compare-title small{font-size:12px;color:var(--muted)}
.photo-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.photo-grid img{width:100%;height:245px;object-fit:cover;border-radius:14px}
.backlink{display:inline-flex;margin-top:26px;color:var(--blue);font-weight:900}

/* mobile */
@media(max-width:900px){
  .nav-links{display:none}.brand-img{width:145px;height:48px}
  .hero-grid,.logo-story,.area-box,.contact-inner{grid-template-columns:1fr}
  .hero h1{font-size:40px}.photo-stack img{height:380px}
  .quick-grid{grid-template-columns:1fr 1fr}
  .service-grid,.case-grid{grid-template-columns:1fr}
  .finish-gallery{grid-template-columns:1fr 1fr;grid-auto-rows:180px}.finish-gallery img:first-child{grid-row:auto;grid-column:span 2}
  .compare-columns{grid-template-columns:1fr}
}
@media(max-width:560px){
  .wrap{padding:0 17px}.call{padding:10px 13px;font-size:13px}.hero{padding-top:38px}.hero-logo img{width:230px}
  .hero h1{font-size:34px}.hero p{font-size:16px}.quick-grid{grid-template-columns:1fr}
  section{padding:64px 0}.title{font-size:31px}.photo-grid{grid-template-columns:1fr}.photo-grid img{height:260px}
  .case-cover{height:235px}.case-hero h1{font-size:34px}.phone{font-size:28px}
}

.video-section{background:linear-gradient(145deg,#e9f8ff,#f8fcff)}
.video-wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:42px;align-items:center}
.video-copy .mini{display:inline-block;background:#dff4ff;color:#0d57cf;padding:7px 11px;border-radius:999px;font-size:12px;font-weight:900;margin-bottom:12px}
.video-frame{background:#fff;border:1px solid var(--line);border-radius:30px;padding:14px;box-shadow:0 22px 50px #236fe820}
.video-frame video{display:block;width:100%;max-height:620px;object-fit:contain;background:#0b2448;border-radius:20px}
.video-note{font-size:13px;color:var(--muted);margin-top:12px}
@media(max-width:900px){.service-grid{grid-template-columns:1fr 1fr}.video-wrap{grid-template-columns:1fr}.video-frame video{max-height:560px}}
@media(max-width:560px){.service-grid{grid-template-columns:1fr}}

.price-strip{background:#0d57cf;color:#fff}
.price-inner{min-height:64px;display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap;font-weight:900}
.price-main{font-size:20px}.price-main strong{color:#bcecff;font-size:24px}.discount{background:#fff;color:#0d57cf;padding:8px 14px;border-radius:999px}.price-note{font-size:12px;color:#d9edff;font-weight:600}
.hero .eyebrow{margin-bottom:8px}.promo-box{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0 0}.promo-pill{background:#fff;border:1px solid #b9def5;border-radius:14px;padding:11px 14px;font-weight:900;color:#0d57cf;box-shadow:0 8px 22px #236fe810}.promo-pill.hot{background:#236fe8;color:#fff;border-color:#236fe8}
@media(max-width:560px){.price-inner{padding:10px 0;gap:8px}.price-main{font-size:16px}.price-main strong{font-size:20px}.discount{font-size:13px}.price-note{width:100%;text-align:center}}

.price-promo{padding:28px 0 8px;background:#fff}
.price-box{display:grid;grid-template-columns:1fr 1.25fr auto;gap:24px;align-items:center;background:linear-gradient(135deg,#e8f7ff,#f8fcff);border:1px solid #cfe8f8;border-radius:24px;padding:24px 26px;box-shadow:0 12px 30px #236fe810}
.price-box strong{display:block;font-size:28px;color:var(--blue2);line-height:1.2;margin-top:4px}
.price-box small{display:block;color:#6b8299;margin-top:6px}
.price-label{font-size:13px;font-weight:900;color:#236fe8}
.discount b{display:block;font-size:19px;color:#173052;margin-bottom:5px}
.discount span{font-size:13px;color:#6b8299}
@media(max-width:900px){.price-box{grid-template-columns:1fr}.price-box .btn{width:100%}}