:root { --bg:#fffaf3; --surface:#fff; --ink:#202321; --muted:#656963; --line:#dedfd8; --coral:#ff6f5e; --coral-dark:#e85040; --mint:#84d8c2; --yellow:#ffd66b; --max:1160px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:var(--ink); font-family:"Pretendard Variable",Pretendard,"Apple SD Gothic Neo","Noto Sans KR",system-ui,sans-serif; line-height:1.7; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
.shell { width:min(calc(100% - 48px),var(--max)); margin-inline:auto; }
.skip-link { position:fixed; z-index:100; top:12px; left:12px; padding:10px 16px; background:var(--ink); color:#fff; transform:translateY(-150%); }
.skip-link:focus { transform:none; }
.site-header { position:relative; z-index:10; border-bottom:1px solid rgba(32,35,33,.08); }
.nav-wrap { min-height:88px; display:flex; align-items:center; justify-content:space-between; }
.brand { display:flex; align-items:center; gap:12px; }
.brand-mark { position:relative; width:42px; height:42px; border-radius:14px; background:var(--coral); transform:rotate(-5deg); box-shadow:inset 0 -4px 0 rgba(0,0,0,.07); }
.brand-mark span { position:absolute; top:13px; width:6px; height:6px; border-radius:50%; background:var(--ink); }
.brand-mark span:first-child { left:11px; }.brand-mark span:last-child { right:11px; }
.brand-mark::after { content:""; position:absolute; left:13px; bottom:9px; width:16px; height:7px; border-bottom:3px solid var(--ink); border-radius:0 0 50% 50%; }
.brand-name { display:grid; line-height:1.1; }.brand-name strong { font-size:1.05rem; }.brand-name small { margin-top:5px; color:var(--muted); font:600 .65rem "DM Sans",sans-serif; letter-spacing:.04em; }
nav { display:flex; gap:32px; font:600 .84rem "DM Sans",sans-serif; }
nav a { padding:8px 0; border-bottom:2px solid transparent; } nav a:hover,nav a:focus-visible,nav a[aria-current="page"] { border-color:var(--coral); }
.hero { min-height:680px; display:grid; grid-template-columns:1.06fr .94fr; align-items:center; gap:60px; padding-block:90px 110px; }
.eyebrow,.section-label { margin:0 0 18px; color:var(--coral-dark); font:700 .76rem "DM Sans",sans-serif; text-transform:uppercase; letter-spacing:.15em; }
h1,h2,h3,p { overflow-wrap:break-word; }
.hero h1 { margin:0; font-size:clamp(3.1rem,6vw,5.6rem); line-height:1.12; letter-spacing:-.06em; }
.hero h1 span { color:var(--coral-dark); }
.hero-description { max-width:590px; margin:30px 0 36px; color:var(--muted); font-size:1.08rem; }
.button { display:inline-flex; align-items:center; gap:32px; padding:15px 20px 15px 24px; border:1px solid var(--ink); border-radius:999px; font-weight:700; transition:.2s ease; }
.button span { display:grid; place-items:center; width:30px; height:30px; border-radius:50%; color:#fff; background:var(--ink); }.button:hover { background:var(--ink); color:#fff; transform:translateY(-2px); }.button:hover span { background:var(--coral); }
.idea-field { position:relative; min-height:470px; }
.idea-core { position:absolute; z-index:2; top:50%; left:50%; display:grid; place-items:center; width:190px; height:190px; border-radius:46% 54% 51% 49%; background:var(--yellow); transform:translate(-50%,-50%) rotate(8deg); box-shadow:0 22px 50px rgba(91,66,21,.12); animation:float 4s ease-in-out infinite; }
.idea-core span { margin-top:22px; font:700 1.05rem "DM Sans",sans-serif; }.idea-core strong { margin-top:-48px; font:800 5rem "DM Sans",sans-serif; }
.orbit { position:absolute; top:50%; left:50%; border:1px solid #c8c8bf; border-radius:50%; transform:translate(-50%,-50%); }.orbit-one { width:360px;height:360px; }.orbit-two { width:470px;height:470px; border-style:dashed; }
.orbit span { position:absolute; width:34px;height:34px;border-radius:50%;background:var(--mint);box-shadow:0 5px 0 rgba(0,0,0,.08); }.orbit-one span { top:48px;right:21px; }.orbit-two span { bottom:48px;left:40px;background:var(--coral); }
.spark { position:absolute; display:block; }.spark-one { top:13%;left:20%;width:16px;height:50px;border-radius:20px;background:var(--coral);transform:rotate(-35deg); }.spark-two { right:5%;bottom:21%;width:44px;height:44px;background:var(--mint);clip-path:polygon(50% 0,61% 36%,100% 50%,61% 63%,50% 100%,38% 63%,0 50%,38% 36%); }.spark-three { right:17%;top:17%;width:14px;height:14px;border-radius:50%;background:var(--ink); }
@keyframes float { 0%,100% { transform:translate(-50%,-50%) rotate(8deg); } 50% { transform:translate(-50%,-56%) rotate(4deg); } }
.studio-section { padding:110px 0; background:var(--ink); color:#fff; }
.studio-grid { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:end; }.studio-section .section-label { color:var(--mint); }.studio-grid h2,.section-heading h2,.contact-inner h2,.page-hero h1,.before-contact h2 { margin:0; font-size:clamp(2rem,4vw,3.6rem); line-height:1.25; letter-spacing:-.045em; }.studio-copy p { margin:0 0 28px; color:#c8cbc7; font-size:1.08rem; }.values { display:flex; flex-wrap:wrap; gap:10px; }.values span { padding:8px 14px;border:1px solid #50534f;border-radius:999px;font:600 .76rem "DM Sans",sans-serif; }
.apps-section { padding-block:120px; }.section-heading { display:flex; justify-content:space-between; align-items:end; gap:40px; margin-bottom:48px; }.section-heading>p { margin:0;color:var(--muted); }.app-card { position:relative; overflow:hidden; display:grid; grid-template-columns:230px 1fr; gap:52px; align-items:center; min-height:330px; padding:48px; border:1px solid var(--line); border-radius:28px; background:rgba(255,255,255,.6); }.app-icon-placeholder { position:relative; width:210px;height:210px;border-radius:48px;background:var(--mint);box-shadow:inset 0 -9px 0 rgba(0,0,0,.06); }.app-icon-placeholder span { position:absolute;border-radius:50%;background:var(--yellow); }.app-icon-placeholder span:first-child { width:78px;height:78px;top:35px;right:29px; }.app-icon-placeholder span:last-child { width:38px;height:38px;left:39px;bottom:43px;background:var(--coral); }.status { display:flex;align-items:center;gap:9px;margin:0 0 16px!important;color:var(--coral-dark)!important;font:700 .76rem "DM Sans",sans-serif;text-transform:uppercase;letter-spacing:.12em; }.status span { width:8px;height:8px;border-radius:50%;background:var(--coral);box-shadow:0 0 0 5px rgba(255,111,94,.15); }.app-info h3 { margin:0 0 14px;font-size:2rem; }.app-info>p { color:var(--muted);margin:0; }.card-note { position:absolute;right:35px;bottom:8px;color:rgba(32,35,33,.05);font:800 8rem "DM Sans",sans-serif;line-height:1; }
.contact-strip { padding:78px 0;background:var(--yellow); }.contact-inner { display:flex;align-items:end;justify-content:space-between;gap:40px; }.contact-inner .section-label { color:var(--ink); }.contact-inner h2 { font-size:clamp(1.8rem,3.5vw,3rem); }.text-link { display:inline-flex;align-items:center;gap:12px;border-bottom:1px solid currentColor;padding-block:4px;font-weight:700;white-space:nowrap; }.text-link:hover { color:var(--coral-dark); }
.site-footer { padding:55px 0;background:#f1eee7; }.footer-inner { display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:30px; }.footer-inner p { margin:0;line-height:1.45; }.footer-inner span { color:var(--muted);font:500 .76rem "DM Sans",sans-serif; }.footer-links { display:flex;gap:24px;font-size:.8rem;font-weight:600; }.footer-links a:hover { text-decoration:underline; }.copyright { justify-self:end;color:var(--muted);font:500 .75rem "DM Sans",sans-serif; }
.page-hero { padding-block:100px 72px;border-bottom:1px solid var(--line); }.page-hero h1 { margin-bottom:22px; }.page-hero>p:last-child { max-width:690px;margin:0;color:var(--muted);font-size:1.08rem; }.policy-layout { display:grid;grid-template-columns:300px 1fr;gap:100px;padding-block:75px 120px;align-items:start; }.policy-notice { position:sticky;top:28px;padding:24px;border-left:4px solid var(--coral);background:#fff3e8; }.policy-notice p { margin:8px 0 0;color:var(--muted);font-size:.9rem; }.policy-content section { position:relative;padding:0 0 55px 58px;margin-bottom:55px;border-bottom:1px solid var(--line); }.policy-content section:last-child { margin-bottom:0;border:0; }.policy-number { position:absolute;left:0;top:5px;color:var(--coral-dark);font:700 .76rem "DM Sans",sans-serif; }.policy-content h2,.support-card h2 { margin:0 0 18px;font-size:1.55rem; }.policy-content p { margin:0 0 20px;color:var(--muted); }.empty-list { display:grid;gap:4px;margin-top:25px;padding:24px;border:1px dashed #b9bbb4;border-radius:12px;background:rgba(255,255,255,.55); }.empty-list span { color:var(--muted);font-size:.86rem; }
.support-main { padding-bottom:120px; }.support-grid { display:grid;grid-template-columns:1fr 1fr;gap:24px;padding-block:72px; }.support-card { position:relative;min-height:330px;padding:42px;border:1px solid var(--line);border-radius:24px;background:var(--surface); }.support-card>p:not(.section-label) { color:var(--muted); }.support-icon { display:grid;place-items:center;width:44px;height:44px;margin-bottom:52px;border-radius:50%;background:var(--yellow);font:800 1.2rem "DM Sans",sans-serif; }.accent-card { background:var(--mint);border-color:transparent; }.accent-card .section-label { color:var(--ink); }.accent-card .support-icon { background:#fff; }.accent-card>p:not(.section-label) { color:#334740; }.contact-placeholder { display:inline-block;margin-top:12px;padding:10px 14px;border:1px dashed #4d776b;border-radius:8px;font-size:.82rem;font-weight:600; }.before-contact { display:grid;grid-template-columns:1fr 1fr;gap:80px;padding-top:75px;border-top:1px solid var(--line); }.before-contact h2 { font-size:2.3rem; }.before-contact ul { list-style:none;margin:0;padding:0; }.before-contact li { display:flex;gap:18px;padding:17px 0;border-bottom:1px solid var(--line); }.before-contact li span { color:var(--coral-dark);font:700 .72rem "DM Sans",sans-serif; }
.reveal { opacity:0;transform:translateY(14px);transition:opacity .55s ease,transform .55s ease; }.reveal.is-visible { opacity:1;transform:none; }
@media (max-width:800px) { .shell{width:min(calc(100% - 36px),var(--max));}.nav-wrap{min-height:76px}.brand-name small{display:none}nav{gap:17px;font-size:.75rem}.hero{min-height:auto;grid-template-columns:1fr;padding-block:70px 85px}.hero h1{font-size:clamp(2.8rem,12vw,4.2rem)}.idea-field{min-height:370px}.orbit-one{width:280px;height:280px}.orbit-two{width:355px;height:355px}.idea-core{width:155px;height:155px}.studio-section,.apps-section{padding-block:80px}.studio-grid,.policy-layout,.before-contact{grid-template-columns:1fr;gap:45px}.section-heading,.contact-inner{align-items:flex-start;flex-direction:column}.app-card{grid-template-columns:1fr;padding:30px;gap:30px}.app-icon-placeholder{width:150px;height:150px;border-radius:34px}.app-icon-placeholder span:first-child{width:58px;height:58px}.footer-inner{grid-template-columns:1fr;}.copyright{justify-self:start}.policy-layout{padding-block:50px 85px}.policy-notice{position:static}.support-grid{grid-template-columns:1fr}.support-card{min-height:auto}.page-hero{padding-block:72px 52px}.support-main{padding-bottom:85px} }
@media (max-width:520px) { .brand-mark{width:36px;height:36px;border-radius:12px}.brand-mark span{top:11px}.brand-mark span:first-child{left:9px}.brand-mark span:last-child{right:9px}.brand-mark::after{left:11px;bottom:8px;width:14px}nav{gap:12px}.hero{gap:28px}.hero-description{font-size:1rem}.idea-field{min-height:300px}.orbit-one{width:230px;height:230px}.orbit-two{width:290px;height:290px}.idea-core{width:130px;height:130px}.idea-core strong{font-size:4rem}.spark-one{left:10%}.app-card{border-radius:20px}.contact-inner .text-link{white-space:normal}.footer-links{flex-direction:column;gap:8px}.policy-content section{padding-left:38px}.support-card{padding:30px} }
@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto}.idea-core{animation:none}.reveal{opacity:1;transform:none;transition:none} }