@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;600;700;800;900&display=swap');:root{--accent:#f45340;--bg:#101113;--panel:#1b1d21;--line:#34363b;--text:#fff;--muted:#a6a7ad;--white:#fff;--ink:#161719}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;font-family:'Noto Sans KR',system-ui,sans-serif;background:#111;color:white;word-break:keep-all}button,input{font:inherit}button{cursor:pointer}a{text-decoration:none;color:inherit}button:focus-visible,a:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.topline{height:48px;display:flex;justify-content:space-around;align-items:center;background:#1d1c1e;font-size:11px;color:#a9a9ae;gap:10px}.topline strong{background:linear-gradient(90deg,#482722,#242024);padding:15px 20px;color:white;border-bottom:2px solid var(--accent)}header{height:76px;padding:0 max(4%,calc((100% - 1320px)/2));display:flex;align-items:center;justify-content:space-between;background:rgba(17,18,20,.93);backdrop-filter:blur(18px);position:sticky;top:0;z-index:50;border-bottom:1px solid #ffffff0c}.logo{font-size:26px;font-weight:900;letter-spacing:-1.5px;color:var(--accent)}.logo b{color:#fff}.logo span{font-weight:500}nav{display:flex;gap:30px}nav a{font-size:13px;font-weight:800;transition:color .2s}nav a:hover{color:var(--accent)}.headActions{display:flex;gap:8px;align-items:center}.primary,.outline{border:1px solid transparent;border-radius:40px;padding:16px 30px;background:var(--accent);color:white;font-size:14px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;transition:transform .25s,box-shadow .25s,background .25s}.primary:hover{transform:translateY(-4px);box-shadow:0 12px 32px color-mix(in srgb,var(--accent) 40%,transparent)}.outline{background:transparent;border-color:#a9a9ae;color:inherit}.outline:hover{transform:translateY(-3px);border-color:var(--accent)}.small{padding:11px 18px;font-size:12px}.iconBtn{border:0;background:transparent;color:inherit;font-size:23px}#mobileMenu{display:none}.dark{background:#111214;color:white}.hero{min-height:750px;padding:95px 22px 75px;text-align:center;position:relative;overflow:hidden}.hero>*:not(.glow){position:relative;z-index:1}.glow{position:absolute;inset:-400px -100px auto;height:800px;background:radial-gradient(ellipse at 50% 40%,color-mix(in srgb,var(--accent) 16%,transparent),transparent 62%);pointer-events:none;transform:translateY(var(--parallax,0px))}.eyebrow{color:var(--accent);font-size:13px;font-weight:800}.pill{display:inline-block;padding:10px 22px;border:1px solid var(--accent);border-radius:50px}.hero h1{font-size:clamp(37px,5.4vw,74px);font-weight:900;line-height:1.3;letter-spacing:-4px;margin:30px auto}.hero h1 em{font-style:normal;color:var(--accent)}.hero p{font-size:15px;color:#b6b6bd;line-height:2}.features{max-width:930px;margin:45px auto 42px;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;text-align:left}.feature{position:relative;border:1px solid #33353b;border-radius:17px;padding:26px 18px;background:#1b1d21;color:white;display:flex;align-items:center;gap:13px;transition:transform .25s,border-color .25s,background .25s}.feature:hover{transform:translateY(-7px);border-color:var(--accent);background:#24262b}.feature i{font-style:normal;font-size:23px;display:grid;place-items:center;background:var(--accent);width:48px;height:48px;flex-shrink:0;border-radius:12px}.feature b{font-size:15px}.feature small{display:block;color:#9b9da6;font-size:11px;margin-top:5px}.feature sup{position:absolute;right:12px;top:10px;font-size:10px;background:var(--accent);padding:3px 7px;border-radius:30px}.actions{display:flex;justify-content:center;gap:12px}.micro{font-size:12px;color:#bbb;margin-top:18px}.gallery{padding:55px max(3%,calc((100% - 1500px)/2)) 125px}.sectionIntro{text-align:center;margin:0 auto 55px}.kicker{color:var(--accent);font-size:12px;letter-spacing:3px;font-weight:900}.sectionIntro h2{font-size:clamp(31px,4vw,55px);font-weight:900;letter-spacing:-2.5px;line-height:1.35;margin:24px 0}.sectionIntro p{font-size:15px;color:#999ba2;line-height:1.9}.filters{display:flex;justify-content:center;gap:10px;margin-bottom:24px;flex-wrap:wrap}.filters button,.tabs button{border:1px solid #42434a;border-radius:30px;padding:9px 18px;background:transparent;color:#aaa;font-size:12px}.filters button.active,.tabs button.active{background:var(--accent);border-color:var(--accent);color:white}.templateGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:17px}.templateCard{background:white;color:#17181b;border-radius:16px;overflow:hidden;position:relative;transition:transform .35s,box-shadow .35s}.templateCard:hover{transform:translateY(-13px);box-shadow:0 25px 40px #0007}.templateCard img{width:100%;height:300px;object-fit:cover;object-position:top;display:block}.templateCard>div{display:flex;justify-content:space-between;align-items:center;padding:15px;gap:5px}.templateCard strong{font-size:13px}.templateCard span{font-size:10px;background:#17181b;color:white;border-radius:6px;padding:4px}.templateCard>button{position:absolute;inset:0;border:0;background:#111a;color:white;font-size:18px;font-weight:800;opacity:0;transition:opacity .25s}.templateCard:hover>button,.templateCard>button:focus-visible{opacity:1}.galleryBottom{text-align:center;margin-top:38px}.editSection{padding:110px max(4%,calc((100% - 1300px)/2)) 100px}.stepGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.step{border:1px solid #35373d;border-radius:18px;overflow:hidden;background:#1b1d21}.stepVisual{height:220px;margin:16px 16px 0;border-radius:12px;background:white;color:#17181b;position:relative;overflow:hidden;padding:16px}.toolbar{font-size:11px;display:flex;justify-content:space-between;border-bottom:1px solid #ddd;padding-bottom:12px}.toolbar b{color:var(--accent)}.editable{margin:38px 10px 15px;font-weight:800;outline:0;padding:6px;border:1px dashed transparent}.editable:focus{border-color:var(--accent);background:#fff5f3}.skeleton{width:70%;height:9px;border-radius:6px;background:#e9eaed;margin:10px}.skeleton.short{width:45%}.fakeEdit small{color:#999;margin-left:10px}.imageSwap{background:linear-gradient(125deg,#a1b7b8,#2e555c);color:white}.photoArt{height:100px;margin-top:15px;display:flex;align-items:end;padding:12px;background:linear-gradient(45deg,#132a34bb,transparent);font-weight:800}.upload{display:inline-block;margin-top:12px;background:#fff;color:#222;border-radius:5px;padding:7px 12px;font-size:11px;cursor:pointer}.themeVisual p{font-size:12px}.swatches{display:flex;gap:9px}.swatches button{width:24px;height:24px;border:2px solid white;box-shadow:0 0 0 1px #aaa;border-radius:50%;background:var(--sw)}.fakeRow{background:#f1f2f4;padding:9px;margin-top:7px;border-radius:8px;font-size:11px}.stepBody{padding:28px}.stepBody>span,.includedGrid article>small{font-size:11px;color:var(--accent);font-weight:900;letter-spacing:2px}.stepBody h3{font-size:24px;line-height:1.45;margin:16px 0}.stepBody p{font-size:13px;line-height:1.9;color:#a4a6ad}.demoBanner{border:1px solid color-mix(in srgb,var(--accent) 55%,#333);border-radius:18px;margin-top:70px;padding:35px;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(110deg,#2c1e20,#1c1e21)}.demoBanner h3{margin:0 0 8px}.demoBanner p{font-size:12px;color:#aaa}.light{background:#fff;color:#17181b}.included{padding:120px max(5%,calc((100% - 1250px)/2)) 80px}.included .sectionIntro p{color:#777}.includedGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}.includedGrid article h3{font-size:23px}.includedGrid article p{color:#777;line-height:1.9;font-size:13px;min-height:70px}.illustration{height:230px;border-radius:14px;background:#f1f3f6;margin-bottom:25px;padding:22px;overflow:hidden}.dashboard{background:linear-gradient(145deg,#3d505d,#b7c4cc);padding:32px 35px}.dashboard>div{background:white;color:#222;padding:12px;display:flex;justify-content:space-between;font-size:12px}.dashboard .dashTop{background:#20262c;color:white}.dashTop span{color:var(--accent)}.designPreview{background:#eef0f4;position:relative}.designPreview:before{content:'';position:absolute;inset:20px;background:white;border:1px solid #ddd;border-radius:9px}.designPreview>*{position:relative}.browserDots{color:#ddd}.designPreview h4{margin:28px 0 20px}.previewTile{position:absolute;right:42px;bottom:42px;background:#c1e5d9;width:55px;height:55px;display:grid;place-items:center}.seo{padding-top:40px}.seo>div{padding:13px;background:white;margin-bottom:10px;border-radius:8px;font-size:12px}.seo b{color:var(--accent);margin-right:8px}.seo span{float:right;color:#21a37c}.textLink{border:0;background:transparent;color:var(--accent);padding:5px 0;font-size:12px;font-weight:800}.includedFooter{border-top:1px solid #ddd;margin-top:55px;padding-top:25px;display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:12px}.stats{padding:105px 20px}.chartPanel{max-width:850px;margin:auto;border:1px solid #383a41;background:#1c1e22;border-radius:18px;padding:30px}.chartTop{display:flex;justify-content:space-between;align-items:center}.chartTop strong,.chartTop small{display:block}.chartTop small{color:#999;font-size:11px;margin-top:6px}.bars{height:220px;display:flex;align-items:end;justify-content:space-around;gap:22px;margin-top:35px;border-bottom:1px solid #444}.bar{background:linear-gradient(0deg,var(--accent),color-mix(in srgb,var(--accent) 40%,white));border-radius:8px 8px 0 0;flex:1;max-width:70px;transition:height .65s ease;position:relative}.bar:hover{filter:brightness(1.25)}.bar:before{content:attr(data-value);position:absolute;top:-25px;left:50%;transform:translateX(-50%);font-size:11px;color:white}.barLabels{display:flex;justify-content:space-around;color:#aaa;font-size:12px;margin-top:15px}.blog{padding:110px max(5%,calc((100% - 1250px)/2))}.blogHead{display:flex;justify-content:space-between;align-items:end;margin-bottom:40px}.blogHead h2{font-size:32px;letter-spacing:-1px}.blogGrid{display:grid;grid-template-columns:3fr 1fr;gap:45px}.article{display:block;text-align:left;width:100%;border:0;border-bottom:1px solid #e0e0e0;padding:20px 0;background:transparent;color:inherit;transition:padding-left .25s}.article:hover{padding-left:12px}.article>span{font-size:10px;background:#f1f2f3;padding:5px}.article h3{font-size:19px;margin:13px 0}.article p{font-size:12px;color:#777}.article small{font-size:11px;color:#999}.popular{background:#f4f5f7;padding:20px;border-radius:12px}.popular li{font-size:12px;margin:15px 0;line-height:1.6}.consult{background:#1c1e21;color:white;border-radius:12px;padding:25px;margin-top:18px}.consult h3{line-height:1.5}.consult p{color:#aaa;font-size:12px;line-height:1.8}.faq{padding:70px 20px 120px}.faqList{max-width:900px;margin:auto}.faq details{border-bottom:1px solid #ddd;padding:18px}.faq summary{font-weight:800;cursor:pointer}.faq details p{color:#777;font-size:13px;line-height:1.9}footer{background:#1b1d20;padding:55px max(5%,calc((100% - 1250px)/2)) 20px}.footGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.footGrid b{display:block;font-size:12px;margin-bottom:16px}.footGrid a,.footGrid button:not(.outline),.footGrid small{display:block;background:none;border:0;padding:4px 0;color:#aaa;font-size:11px;text-align:left}.footLogo{border-top:1px solid #353535;margin-top:60px;padding:25px 0 0;text-align:center;font-size:22px;font-weight:900;color:var(--accent)}.footLogo small{display:block;color:#777;font-size:10px;letter-spacing:2px}#backTop,.chat{position:fixed;bottom:26px;right:25px;width:48px;height:48px;border:0;border-radius:50%;background:var(--accent);color:white;font-size:24px;z-index:40;box-shadow:0 8px 25px #0005}.chat{bottom:84px}.modalBackdrop{position:fixed;inset:0;background:#000b;z-index:100;display:none;align-items:center;justify-content:center;padding:20px}.modalBackdrop.open{display:flex}.modalBox{position:relative;width:min(100%,530px);background:#fff;color:#222;border-radius:20px;padding:35px;box-shadow:0 30px 90px #0009;animation:pop .25s ease}.modalBox h2{font-size:26px}.modalBox p,.modalBox li{color:#666;font-size:14px;line-height:1.9}.modalBox .primary{margin-top:15px}.close{position:absolute;right:22px;top:17px;border:0;background:transparent;font-size:22px}.reveal{opacity:0;transform:translateY(32px);transition:opacity .7s,transform .7s}.reveal.visible{opacity:1;transform:translateY(0)}@keyframes pop{from{transform:scale(.94);opacity:0}to{transform:scale(1);opacity:1}}body.lightMode{background:#fafafa}body.lightMode .hero,body.lightMode .gallery,body.lightMode .editSection,body.lightMode .stats{background:#e9ebee;color:#17181b}body.lightMode .hero p,body.lightMode .sectionIntro p{color:#666}body.lightMode .feature,body.lightMode .step,body.lightMode .chartPanel{background:#fff;color:#222;border-color:#ddd}body.lightMode .feature small,body.lightMode .stepBody p{color:#666}body.lightMode .outline{border-color:#555}body.lightMode .demoBanner{background:#f7f1f0;color:#222}body.lightMode .chartTop small{color:#666}body.lightMode .bar:before{color:#333}
@media(max-width:1000px){nav{gap:13px}nav a{font-size:11px}.templateGrid{grid-template-columns:repeat(2,1fr)}.stepGrid{gap:12px}.stepBody{padding:18px}.stepBody h3{font-size:19px}.topline span:nth-child(2),.topline span:nth-child(3){display:none}}@media(max-width:720px){.topline{height:38px;font-size:9px}.topline span:nth-child(1),.topline span:nth-child(5){display:none}.topline strong{padding:10px}.logo{font-size:21px}header{height:66px;padding:0 17px}nav{display:none;position:absolute;top:66px;left:0;right:0;background:#202126;padding:20px;flex-direction:column;gap:20px}nav.open{display:flex}.headActions .outline,.headActions .primary{display:none}#mobileMenu{display:block}.hero{padding-top:75px;min-height:0}.hero h1{letter-spacing:-2px}.hero p{font-size:12px}.features{grid-template-columns:repeat(2,1fr);gap:9px}.feature{padding:22px 10px;gap:8px}.feature i{width:37px;height:37px;font-size:18px}.feature b{font-size:12px}.feature small{font-size:9px}.actions{flex-wrap:wrap}.gallery,.editSection,.included,.stats,.blog{padding:75px 20px}.templateGrid{gap:12px}.templateCard img{height:210px}.templateCard strong{font-size:10px}.stepGrid,.includedGrid,.blogGrid{grid-template-columns:1fr}.stepVisual{height:210px}.demoBanner,.includedFooter,.blogHead{flex-direction:column;align-items:start}.includedGrid{gap:45px}.blogHead h2{font-size:25px}.footGrid{grid-template-columns:repeat(2,1fr)}.sectionIntro h2{letter-spacing:-1px}.chartPanel{padding:18px}.bars{gap:10px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}

/* V1.1 — porcelain white + cornflower / glacier blue */
:root{--accent:#4169e1;--bg:#f9fbff;--panel:#fff;--line:#dce7f7;--text:#172b4d;--muted:#61728c}
body{background:#f9fbff;color:#172b4d}
.topline{background:#edf4ff;color:#546783}.topline strong{background:linear-gradient(95deg,#e0ecff,#cce9ff);color:#234a9b;border-bottom-color:#4169e1}
header{background:rgba(255,255,255,.91);border-bottom:1px solid #dce7f7;box-shadow:0 3px 25px #4d7ac00b}.logo b{color:#1a3155}
.dark{background:#f9fbff;color:#172b4d}
.hero{background:radial-gradient(ellipse 58% 47% at 50% 9%,#a8d9ff77,transparent 77%),radial-gradient(ellipse 36% 42% at 90% 56%,#9dafff3b,transparent 85%),linear-gradient(180deg,#f7fbff 0%,#fff 80%);color:#172b4d}
.glow{background:radial-gradient(ellipse at 50% 40%,#75bfff60,transparent 65%)}
.hero p,.sectionIntro p,.micro{color:#61728c}
.feature{background:#fff;color:#1a3155;border-color:#dbe5f4;box-shadow:0 8px 32px #6c9bd012}.feature:hover{background:#f0f7ff;border-color:#82b8ff}.feature small{color:#667994}.feature i{color:#fff}
.gallery{background:linear-gradient(180deg,#fff,#f2f8ff)}.templateCard{box-shadow:0 12px 30px #567caf18}.templateCard:hover{box-shadow:0 24px 45px #567caf30}
.editSection{background:radial-gradient(ellipse at 5% 12%,#b4ddff4d,transparent 50%),linear-gradient(160deg,#f4f9ff,#fff);color:#172b4d}
.step{background:#fff;border-color:#dce7f7;box-shadow:0 8px 30px #507fba10}.stepBody p{color:#62758f}.editable:focus{background:#eef7ff}
.demoBanner{background:linear-gradient(115deg,#e7f1ff,#f4faff);border-color:#a3c9ff;color:#17375c}.demoBanner p{color:#5f718a}
.stats{background:linear-gradient(160deg,#f5faff,#eaf4ff);color:#172b4d}.chartPanel{background:#fff;border-color:#dce7f7;box-shadow:0 14px 40px #4169e112}.chartTop small,.barLabels{color:#63758f}.bar:before{color:#243d65}.bars{border-color:#d6e2f2}
.filters button,.tabs button{border-color:#c9d9ef;color:#536987}.filters button.active,.tabs button.active{color:#fff}
footer{background:#eaf2fc;color:#1d3558}.footGrid a,.footGrid button:not(.outline),.footGrid small{color:#63758f}.footLogo{border-color:#d0e1f4}.footLogo small{color:#63758f}
.outline{border-color:#7995b8;color:#254369}.primary{color:white}.consult{background:linear-gradient(135deg,#e1efff,#d4e8ff);color:#17375c}.consult p{color:#61758d}
#backTop,.chat{box-shadow:0 8px 25px #4169e13d}
@media(max-width:720px){nav{background:#fff;box-shadow:0 12px 20px #456ea21f}}
/* Light theme is now the default; theme toggle switches to a deep blue night mode. */
body.lightMode{background:#101b32;color:#f1f7ff}
body.lightMode header{background:rgba(15,27,50,.95);border-color:#334564;color:#fff}body.lightMode .logo b{color:#fff}
body.lightMode .hero,body.lightMode .gallery,body.lightMode .editSection,body.lightMode .stats{background:radial-gradient(ellipse at 50% 0%,#244e8c88,transparent 70%),#111e36;color:#f1f7ff}
body.lightMode .hero p,body.lightMode .sectionIntro p{color:#b4c5dd}
body.lightMode .feature,body.lightMode .step,body.lightMode .chartPanel{background:#1c2b46;color:#f1f7ff;border-color:#344b6b}
body.lightMode .feature small,body.lightMode .stepBody p{color:#b4c5dd}
body.lightMode .demoBanner{background:#1e3456;color:#fff}body.lightMode .chartTop small{color:#b4c5dd}body.lightMode .bar:before{color:#fff}
body.lightMode nav{background:#152540}