@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600;800&family=Inter:wght@400;700&display=swap";@import "https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable.min.css";:root{--primary-color:#00a651;--primary-gradient:linear-gradient(135deg, #00a651 0%, #008848 100%);--accent-glow:#00a6514d;--bg-color:#fdfcf8;--bg-surface:#fff;--card-bg:#fffc;--text-main:#1a1a1a;--text-secondary:#4a4a4a;--text-muted:#7a7a7a;--border-glass:#0000000d;--shadow-soft:0 10px 30px #00000008;--shadow-float:0 20px 40px #0000000f;--shadow-glow:0 0 20px var(--accent-glow);--base-font-size:20px;--h1-size:3.5rem;--h2-size:2.2rem;--btn-height:64px;--radius-lg:32px;--radius-md:24px}*{box-sizing:border-box;-webkit-font-smoothing:antialiased;margin:0;padding:0}body{font-family:Outfit,Pretendard Variable,sans-serif;font-size:var(--base-font-size);color:var(--text-main);background-color:var(--bg-color);letter-spacing:-.01em;background-image:radial-gradient(at 0 0,#00a6510d 0,#0000 50%),radial-gradient(at 100% 100%,#00a65108 0,#0000 50%);line-height:1.5}.container{max-width:800px;margin:0 auto;padding:0 20px}header{-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border-glass);z-index:100;background:#ffffffb3;padding:16px 0;transition:all .3s;position:sticky;top:0}.logo{align-items:center;gap:8px;text-decoration:none;transition:transform .3s;display:flex}.logo:hover{transform:translateY(-1px)}.logo-icon{object-fit:contain;width:auto;height:36px}.logo-text{color:var(--primary-color);letter-spacing:-.02em;font-size:1.6rem;font-weight:900}.hero{text-align:center;padding:100px 0 60px;overflow:hidden}.hero-title{flex-direction:column;align-items:center;gap:12px;margin-bottom:32px;display:flex}.title-main{font-size:var(--h1-size);letter-spacing:-.03em;background:linear-gradient(#1a1a1a,#4a4a4a);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-weight:800;line-height:1.1}.title-sub{color:var(--text-secondary);font-size:2.2rem;font-weight:600;line-height:1.2}.hero-image{border-radius:var(--radius-lg);max-width:90%;height:auto;box-shadow:var(--shadow-float);border:8px solid #fff;margin:48px 0;transition:transform .6s cubic-bezier(.16,1,.3,1)}.hero-image:hover{transform:scale(1.02)}.mission-box{border-radius:var(--radius-lg);max-width:850px;box-shadow:var(--shadow-soft);text-align:left;background:#fffdf5;border:1px solid #00a6511a;margin:60px auto;padding:60px;position:relative}.mission-quote{color:#00a6510d;-webkit-user-select:none;user-select:none;font-family:serif;font-size:80px;line-height:1;position:absolute;top:20px;left:30px}.mission-box p{color:var(--text-secondary);word-break:keep-all;z-index:1;margin-bottom:20px;font-size:1.25rem;line-height:1.9;position:relative}.mission-box strong{color:var(--text-main);background:linear-gradient(120deg,#00a6511a 0% 100%) 0 80%/100% 40% no-repeat;font-weight:800}.mission-footer{text-align:center;border-top:1px dashed #00a65133;padding-top:32px;font-weight:800;color:var(--primary-color)!important;margin-top:48px!important;font-size:1.5rem!important}@media (width<=640px){.mission-box{margin:40px 0;padding:40px 24px}.mission-box p{margin-bottom:16px;font-size:1.2rem;line-height:1.8}.mission-quote{font-size:60px;top:10px;left:15px}.mission-footer{margin-top:32px!important;font-size:1.3rem!important}}.tools-section{padding:60px 0}.bg-light{background-color:var(--bg-light)}.section-header{justify-content:space-between;align-items:center;margin-bottom:30px;display:flex}.view-all{color:var(--primary-color);font-weight:600;text-decoration:none}.tutorial-banner{background-color:var(--primary-color);color:#fff;text-align:center;border-radius:20px;max-width:1200px;margin:40px auto;padding:40px}.banner-content h2{margin-bottom:10px;font-size:2rem}.banner-content p{opacity:.9;margin-bottom:30px;font-size:1.2rem}.blog-card{box-shadow:var(--card-shadow);background:#fff;border-radius:16px;flex-direction:column;transition:transform .2s;display:flex;overflow:hidden}.blog-card:hover{transform:translateY(-5px)}.blog-thumb{object-fit:cover;width:100%;height:200px}.blog-content{flex-grow:1;padding:24px}.blog-meta{justify-content:space-between;align-items:center;margin-bottom:15px;display:flex}.badge{text-transform:uppercase;color:#fff;border-radius:20px;padding:4px 12px;font-size:.85rem;font-weight:600}.badge.beginner{background-color:var(--difficulty-beginner)}.badge.intermediate{background-color:var(--difficulty-intermediate)}.badge.advanced{background-color:var(--difficulty-advanced)}.blog-title{color:var(--text-main);margin-bottom:15px;font-size:1.4rem;line-height:1.4}.blog-footer{color:var(--text-muted);font-size:.9rem}.grid-list{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px;display:grid}.section-title{text-align:center;margin-bottom:40px}.tool-list{flex-direction:column;gap:24px;display:flex}.tool-card{background:var(--card-bg);-webkit-backdrop-filter:blur(8px);border-radius:var(--radius-md);box-shadow:var(--shadow-soft);border:1px solid var(--border-glass);align-items:center;gap:32px;padding:32px;transition:all .4s cubic-bezier(.16,1,.3,1);display:flex}.tool-card:hover{box-shadow:var(--shadow-float);border-color:var(--primary-color);background:#fff;transform:translateY(-8px)}@media (width<=640px){.hero-title{gap:8px;margin-bottom:24px}.title-main{font-size:2.2rem}.title-sub{word-break:keep-all;white-space:nowrap;font-size:1.4rem}.tool-card{text-align:center;flex-direction:column;gap:20px;padding:24px}.tool-icon{width:64px;height:64px;margin:0 auto;font-size:32px}.btn{width:100%;min-width:unset}.tutorial-banner{margin:24px 0;padding:32px 20px}.banner-content h2{word-break:keep-all;font-size:1.5rem;line-height:1.4}.banner-content p{word-break:keep-all;margin-top:12px;font-size:1rem}}.tool-icon{background:#f0f9f4;border-radius:16px;justify-content:center;align-items:center;width:80px;height:80px;font-size:40px;display:flex}.tool-info{flex:1}.tool-info h3{margin-bottom:8px;font-size:1.4rem}.tool-info p{color:var(--text-muted);font-size:1rem}.tool-status{border-radius:20px;margin-top:8px;padding:4px 12px;font-size:.9rem;font-weight:700;display:inline-block}.status-active{color:#1e7e34;background:#e6f4ea}.status-pending{color:#5f6368;background:#f1f3f4}.btn{min-width:200px;height:var(--btn-height);cursor:pointer;border:none;border-radius:30px;justify-content:center;align-items:center;padding:0 32px;font-size:1.2rem;font-weight:700;text-decoration:none;transition:background .2s;display:inline-flex}.btn-primary{background:var(--primary-gradient);color:#fff;box-shadow:var(--shadow-glow);transition:all .3s cubic-bezier(.16,1,.3,1)}.btn-primary:hover{box-shadow:0 12px 24px var(--accent-glow);transform:translateY(-2px)scale(1.02)}.btn-disabled{color:#999;cursor:not-allowed;background:#e0e0e0}html{scroll-behavior:smooth}.reveal{opacity:0;transition:all .8s cubic-bezier(.16,1,.3,1);transform:translateY(30px)}.reveal.active{opacity:1;transform:translateY(0)}.delay-1{transition-delay:.1s}.delay-2{transition-delay:.2s}.delay-3{transition-delay:.3s}footer{color:#fff;text-align:center;background:#111;padding:80px 0}.footer-info p{opacity:.5;margin-bottom:12px;font-size:.95rem;font-weight:300}
