@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;600;700;800&display=swap");
:root { font-family:"Noto Sans KR","Apple SD Gothic Neo",sans-serif; color:#0f2238; background:#fff; font-synthesis:none; --navy:#0a2a5e; --deep:#0b3a85; --blue:#1558d6; --sky:#4cc3f7; --ice:#eaf6fe; --mist:#f4f9fd; --ink:#0f2238; --muted:#53677d; --line:#d9e6f2; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; scroll-padding-top:92px; } body { margin:0; min-width:320px; min-height:100vh; -webkit-font-smoothing:antialiased; } body,button { font-family:inherit; } a { color:inherit; text-decoration:none; } img { display:block; max-width:100%; } button,a { -webkit-tap-highlight-color:transparent; }
.shell { width:min(1180px,calc(100% - 48px)); margin-inline:auto; }
h1,h2,h3 { word-break:keep-all; }
.eyebrow { margin:0 0 12px; color:var(--blue); font-size:12px; font-weight:800; letter-spacing:.16em; }

/* Header */
.site-header { position:sticky; z-index:50; top:0; background:rgba(255,255,255,.96); border-bottom:1px solid rgba(10,42,94,.08); backdrop-filter:blur(12px); }
.header-inner { height:78px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:32px; }
.brand { display:inline-flex; align-items:center; gap:10px; width:max-content; font-size:24px; font-weight:800; letter-spacing:-.05em; color:var(--navy); }
.brand-mark { position:relative; display:grid; place-items:center; width:38px; height:38px; color:var(--blue); font-size:28px; }
.brand-mark .flake { position:absolute; right:-2px; bottom:0; font-size:14px; color:var(--sky); }
.nav { display:flex; align-items:center; gap:clamp(24px,3vw,48px); font-size:15px; font-weight:600; }
.nav a,.footer-links a { transition:color .2s ease; } .nav a:hover,.footer-links a:hover { color:var(--blue); }
.header-phone { justify-self:end; display:inline-flex; align-items:center; gap:9px; padding:10px 18px; border-radius:999px; background:var(--ice); color:var(--blue); font-size:16px; font-weight:800; } .header-phone i { font-size:15px; }
.menu-button { display:none; border:0; background:transparent; color:var(--navy); padding:8px; } .menu-button i { font-size:24px; }

/* Buttons */
.phone-button { display:inline-flex; align-items:center; justify-content:center; gap:11px; min-height:58px; padding:0 26px; border-radius:12px; background:var(--sky); color:var(--navy); font-size:18px; font-weight:800; box-shadow:0 12px 28px rgba(76,195,247,.32); transition:transform .2s ease,background .2s ease; } .phone-button:hover { background:#7dd6fb; transform:translateY(-2px); } .phone-button i { font-size:18px; }
.ghost-button { display:inline-flex; align-items:center; gap:9px; min-height:58px; padding:0 24px; border:1.5px solid rgba(255,255,255,.5); border-radius:12px; color:#fff; font-size:16px; font-weight:700; transition:background .2s ease; } .ghost-button:hover { background:rgba(255,255,255,.12); } .ghost-button i { font-size:13px; }

/* Hero */
.hero { position:relative; overflow:hidden; color:#fff; background:linear-gradient(135deg,#0a2a5e 0%,#0d4294 58%,#1a78cc 100%); }
.hero::before { content:""; position:absolute; width:560px; height:560px; right:-140px; top:-220px; border-radius:50%; background:radial-gradient(circle,rgba(76,195,247,.35),rgba(76,195,247,0) 70%); }
.hero::after { content:""; position:absolute; width:420px; height:420px; left:-160px; bottom:-220px; border-radius:50%; background:radial-gradient(circle,rgba(255,255,255,.14),rgba(255,255,255,0) 70%); }
.hero-inner { position:relative; z-index:1; display:grid; grid-template-columns:1fr 1.05fr; align-items:center; gap:56px; padding:84px 0 120px; }
.pill { display:inline-flex; align-items:center; gap:8px; margin:0 0 24px; padding:8px 16px; border-radius:999px; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.25); font-size:12px; font-weight:800; letter-spacing:.12em; }
.hero-copy h1 { margin:0; font-size:clamp(42px,4.6vw,64px); line-height:1.2; letter-spacing:-.055em; } .hero-copy h1 strong { display:block; color:var(--sky); font-weight:800; }
.hero-description { margin:26px 0 34px; color:rgba(255,255,255,.86); font-size:19px; font-weight:500; line-height:1.8; }
.hero-actions { display:flex; flex-wrap:wrap; gap:14px; }
.hero-visual { position:relative; margin:0; }
.hero-visual img { width:100%; aspect-ratio:4/3.4; object-fit:cover; object-position:35% center; border-radius:28px; border:8px solid rgba(255,255,255,.92); box-shadow:0 28px 60px rgba(3,20,52,.4); }
.hero-badge { position:absolute; left:-22px; bottom:28px; display:inline-flex; align-items:center; gap:10px; padding:14px 20px; border-radius:14px; background:#fff; color:var(--navy); font-size:15px; font-weight:800; box-shadow:0 16px 36px rgba(3,20,52,.28); } .hero-badge i { color:var(--blue); font-size:18px; }

/* Type strip */
.type-strip { position:relative; z-index:3; margin-top:-52px; }
.type-strip-inner { display:grid; grid-template-columns:repeat(4,1fr); background:#fff; border-radius:18px; box-shadow:0 18px 44px rgba(10,42,94,.16); overflow:hidden; }
.type-strip a { display:flex; align-items:center; justify-content:center; gap:12px; min-height:92px; font-weight:700; color:var(--navy); border-right:1px solid var(--line); transition:background .2s ease; } .type-strip a:last-child { border-right:0; } .type-strip a:hover { background:var(--mist); } .type-strip i { color:var(--blue); font-size:24px; }

/* Sections */
.section { padding:96px 0; background:#fff; } .section-tint { background:var(--mist); }
.section-heading { text-align:center; margin-bottom:48px; } .section-heading h2 { margin:0; font-size:clamp(30px,3.2vw,42px); line-height:1.3; letter-spacing:-.045em; color:var(--navy); } .section-sub { margin:14px 0 0; color:var(--muted); font-size:16px; }

.type-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.type-card { padding:38px 32px 32px; border:1px solid var(--line); border-radius:20px; background:#fff; transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease; } .type-card:hover { transform:translateY(-6px); border-color:var(--sky); box-shadow:0 20px 40px rgba(21,88,214,.12); }
.type-icon { display:grid; place-items:center; width:64px; height:64px; border-radius:18px; background:var(--ice); color:var(--blue); font-size:27px; }
.type-card h3 { margin:22px 0 10px; font-size:24px; letter-spacing:-.04em; color:var(--navy); } .type-card p { margin:0; color:var(--muted); font-size:15.5px; line-height:1.8; word-break:keep-all; }
.type-card a,.more-copy a { display:inline-flex; align-items:center; gap:7px; margin-top:20px; color:var(--blue); font-size:14px; font-weight:800; } .type-card a i,.more-copy a i { font-size:12px; }

/* Process */
.step-flow { position:relative; display:grid; grid-template-columns:repeat(5,1fr); gap:20px; margin:0; padding:0; list-style:none; counter-reset:none; }
.step-flow::before { content:""; position:absolute; top:62px; left:10%; right:10%; height:2px; background:repeating-linear-gradient(90deg,#b9d4ee 0 8px,transparent 8px 16px); }
.step-flow li { position:relative; text-align:center; padding:0 6px; }
.step-no { display:block; margin-bottom:10px; color:var(--blue); font-size:13px; font-weight:800; letter-spacing:.14em; }
.step-ico { position:relative; z-index:1; display:grid; place-items:center; width:84px; height:84px; margin:0 auto 18px; border-radius:50%; background:linear-gradient(135deg,var(--blue),var(--sky)); color:#fff; font-size:30px; box-shadow:0 14px 28px rgba(21,88,214,.24); }
.step-flow strong { display:block; font-size:19px; color:var(--navy); } .step-flow p { margin:8px auto 0; max-width:190px; color:var(--muted); font-size:14px; line-height:1.7; word-break:keep-all; }

/* Split */
.split { display:grid; grid-template-columns:.8fr 1.2fr; align-items:center; gap:72px; }
.split-photo { margin:0; position:relative; } .split-photo::before { content:""; position:absolute; inset:24px -24px -24px 24px; border-radius:26px; background:var(--ice); } .split-photo img { position:relative; width:100%; max-height:560px; aspect-ratio:4/5; object-fit:cover; object-position:center 25%; border-radius:26px; }
.split-copy h2 { margin:0 0 30px; font-size:clamp(28px,3vw,38px); line-height:1.35; letter-spacing:-.045em; color:var(--navy); }
.check-list { display:grid; gap:20px; margin:0; padding:0; list-style:none; } .check-list li { display:flex; gap:16px; align-items:flex-start; padding:20px 22px; border:1px solid var(--line); border-radius:16px; background:#fff; }
.check-list i { margin-top:3px; color:var(--blue); font-size:22px; } .check-list strong { display:block; font-size:17px; color:var(--navy); } .check-list p { margin:6px 0 0; color:var(--muted); font-size:14.5px; line-height:1.7; word-break:keep-all; }

/* More services */
.more-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.more-card { overflow:hidden; border-radius:20px; background:#fff; border:1px solid var(--line); transition:transform .25s ease,box-shadow .25s ease; } .more-card:hover { transform:translateY(-5px); box-shadow:0 20px 40px rgba(10,42,94,.1); }
.more-photo { overflow:hidden; } .more-photo img { width:100%; aspect-ratio:3/2; object-fit:cover; transition:transform .6s ease; } .more-card:hover .more-photo img { transform:scale(1.04); }
.more-copy { padding:26px 28px 30px; } .more-copy h3 { margin:0 0 8px; font-size:22px; letter-spacing:-.04em; color:var(--navy); } .more-copy p { margin:0; color:var(--muted); font-size:15px; line-height:1.75; word-break:keep-all; }

/* Contact steps */
.contact-steps { position:relative; display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin:0; padding:0; list-style:none; }
.contact-steps li { padding:30px 24px; border-radius:18px; background:var(--mist); border:1px solid var(--line); }
.c-num { display:grid; place-items:center; width:38px; height:38px; margin-bottom:16px; border-radius:50%; background:var(--blue); color:#fff; font-size:15px; font-weight:800; }
.contact-steps strong { display:block; font-size:19px; color:var(--navy); } .contact-steps p { margin:8px 0 0; color:var(--muted); font-size:14.5px; line-height:1.7; word-break:keep-all; }

/* CTA */
.final-cta { padding:0 0 64px; background:#fff; }
.final-cta-inner { position:relative; overflow:hidden; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:28px; min-height:170px; padding:34px 48px; border-radius:24px; color:#fff; background:linear-gradient(105deg,rgba(10,42,94,.94),rgba(13,66,148,.88)),url("../assets/hero.webp") center/cover no-repeat; box-shadow:0 20px 48px rgba(10,42,94,.24); }
.cta-icon { display:grid; place-items:center; width:72px; height:72px; border:1px solid rgba(255,255,255,.5); border-radius:50%; } .cta-icon i { font-size:27px; }
.final-cta h2 { margin:0 0 8px; font-size:27px; letter-spacing:-.04em; } .final-cta p { margin:0; color:rgba(255,255,255,.82); }
.final-cta-inner>a { display:flex; flex-direction:column; align-items:center; justify-content:center; min-width:250px; min-height:90px; border-radius:16px; background:var(--sky); color:var(--navy); transition:transform .2s ease; } .final-cta-inner>a:hover { transform:translateY(-2px); } .final-cta-inner>a span { font-size:13px; font-weight:700; } .final-cta-inner>a strong { margin-top:2px; font-size:25px; }

/* Footer */
.site-footer { padding:38px 0 48px; background:var(--navy); color:rgba(255,255,255,.78); }
.footer-inner { display:grid; grid-template-columns:auto auto 1fr; align-items:start; gap:24px 38px; }
.site-footer .brand { font-size:20px; color:#fff; } .site-footer .brand-mark { width:31px; height:31px; font-size:23px; color:#fff; } .site-footer .brand-mark .flake { font-size:12px; }
.footer-links { display:flex; gap:22px; align-items:center; min-height:34px; font-size:13px; } .footer-links a:hover { color:var(--sky); }
.business-info { display:flex; flex-wrap:wrap; gap:6px 18px; color:rgba(255,255,255,.62); font-size:12px; line-height:1.7; }
.copyright { grid-column:3; margin:-8px 0 0; color:rgba(255,255,255,.42); font-size:11px; }
.mobile-call { display:none; }

/* Policy pages */
.policy-main { padding:76px 0 100px; background:var(--mist); } .policy-shell { max-width:860px; } .policy-shell>h1 { margin:0; font-size:46px; letter-spacing:-.05em; color:var(--navy); } .policy-date { color:#7b8794; font-size:13px; }
.policy-content { margin-top:34px; padding:52px 56px; background:#fff; border:1px solid var(--line); border-radius:16px; } .policy-content section+section { margin-top:34px; padding-top:34px; border-top:1px solid #e7ecf2; } .policy-content h2 { margin:0 0 12px; font-size:20px; color:var(--navy); } .policy-content p { margin:0; color:#4b5b6d; line-height:1.9; }
.back-link { display:inline-flex; margin-top:28px; color:var(--blue); font-weight:700; }
.policy-header .header-inner { grid-template-columns:1fr auto; }

/* Tablet */
@media (max-width:1020px) {
  .header-inner { grid-template-columns:1fr auto auto; }
  .nav { display:none; position:absolute; top:78px; left:0; right:0; padding:20px 24px 26px; background:#fff; border-bottom:1px solid var(--line); flex-direction:column; align-items:flex-start; gap:20px; box-shadow:0 14px 28px rgba(10,42,94,.08); } .nav.open { display:flex; }
  .header-phone { margin-left:auto; } .menu-button { display:inline-grid; place-items:center; }
  .hero-inner { grid-template-columns:1fr; gap:44px; padding:64px 0 110px; } .hero-visual { max-width:640px; } .hero-badge { left:14px; }
  .type-grid,.more-grid { grid-template-columns:1fr 1fr; } .step-flow { grid-template-columns:repeat(3,1fr); row-gap:40px; } .step-flow::before { display:none; }
  .split { grid-template-columns:1fr; gap:48px; } .split-photo { max-width:420px; } .contact-steps { grid-template-columns:1fr 1fr; }
  .final-cta-inner { padding:30px 32px; }
}

/* Mobile */
@media (max-width:760px) {
  html { scroll-padding-top:70px; } .shell { width:min(100% - 32px,1180px); }
  .header-inner { height:66px; gap:8px; } .brand { font-size:20px; } .brand-mark { width:31px; height:31px; font-size:23px; } .nav { top:66px; }
  .header-phone span { display:none; } .header-phone { justify-content:center; width:42px; height:42px; padding:0; border-radius:50%; }
  .hero-inner { padding:44px 0 92px; gap:36px; } .hero-copy h1 { font-size:clamp(36px,10vw,46px); } .hero-description { margin:20px 0 26px; font-size:16.5px; }
  .hero-actions { flex-direction:column; } .hero-actions .phone-button,.hero-actions .ghost-button { width:100%; justify-content:center; }
  .hero-visual img { border-width:5px; border-radius:20px; } .hero-badge { left:10px; bottom:14px; padding:10px 14px; font-size:13px; }
  .type-strip { margin-top:-40px; } .type-strip-inner { grid-template-columns:1fr 1fr; } .type-strip a { min-height:70px; font-size:14px; gap:8px; border-bottom:1px solid var(--line); } .type-strip a:nth-child(2) { border-right:0; } .type-strip a:nth-child(n+3) { border-bottom:0; } .type-strip i { font-size:20px; }
  .section { padding:64px 0; } .section-heading { margin-bottom:32px; } .section-heading h2 { font-size:28px; }
  .type-grid,.more-grid { grid-template-columns:1fr; gap:16px; } .type-card { padding:30px 26px 26px; }
  .step-flow { grid-template-columns:1fr 1fr; gap:32px 14px; } .step-ico { width:68px; height:68px; font-size:24px; } .step-flow p { font-size:13px; }
  .split-photo { max-width:100%; } .split-photo::before { inset:16px -10px -16px 10px; } .split-photo img { aspect-ratio:4/4.2; }
  .check-list li { padding:16px 18px; }
  .contact-steps { grid-template-columns:1fr; gap:12px; } .contact-steps li { padding:22px 22px; }
  .final-cta { padding-bottom:40px; } .final-cta-inner { grid-template-columns:auto 1fr; gap:18px; padding:26px 22px; border-radius:18px; } .cta-icon { width:54px; height:54px; } .cta-icon i { font-size:21px; } .final-cta h2 { font-size:20px; } .final-cta p { margin-top:5px; font-size:13px; } .final-cta-inner>a { grid-column:1/-1; width:100%; min-height:74px; }
  .footer-inner { display:flex; flex-direction:column; gap:18px; } .footer-links { min-height:0; } .business-info { flex-direction:column; gap:2px; } .copyright { margin:0; }
  .mobile-call { position:fixed; z-index:60; right:16px; bottom:max(16px,env(safe-area-inset-bottom)); display:inline-flex; min-height:52px; padding:0 18px; border-radius:999px; font-size:15px; background:var(--blue); color:#fff; box-shadow:0 12px 28px rgba(21,88,214,.38); } .mobile-call:hover { background:#0f48b3; }
  .policy-main { padding:52px 0 78px; } .policy-shell>h1 { font-size:36px; } .policy-content { padding:32px 24px; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition-duration:.01ms!important; } }
