*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:"Source Sans 3",Helvetica Neue,Arial,sans-serif;color:#1a1a1a;background:#fff;line-height:1.6;-webkit-font-smoothing:antialiased}img{display:block;max-width:100%}a{text-decoration:none}.container{max-width:1160px;margin:0 auto;padding:0 28px}.section-label{text-align:center;font-size:13px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:#3776ab;margin-bottom:10px}.section-title{text-align:center;font-size:36px;font-weight:700;color:#1e3a5f;margin-bottom:12px}.section-sub{text-align:center;font-size:18px;color:#555;max-width:600px;margin:0 auto 52px}.btn{display:inline-block;padding:13px 30px;border-radius:6px;font-size:16px;font-weight:600;transition:all .2s ease;cursor:pointer;border:2px solid transparent}.btn-primary{background:#3776ab;color:#fff;border-color:#3776ab}.btn-primary:hover{background:#2b5f8f;border-color:#2b5f8f;transform:translateY(-1px);box-shadow:0 4px 14px #3776ab59}.btn-yellow{background:#ffd43b;color:#1e3a5f;border-color:#ffd43b}.btn-yellow:hover{background:#f0c800;border-color:#f0c800;transform:translateY(-1px);box-shadow:0 4px 14px #ffd43b66}.btn-outline-white{background:transparent;color:#fff;border-color:#ffffffa6}.btn-outline-white:hover{border-color:#fff;background:#ffffff1f}.btn-patreon{background:#ff424d;color:#fff;border-color:#ff424d}.btn-patreon:hover{background:#e03040;border-color:#e03040;transform:translateY(-1px);box-shadow:0 4px 14px #ff424d66}.top-bar{background:#1e3a5f;color:#b8d4ea;font-size:13px;padding:7px 0}.top-bar-inner{display:flex;align-items:center;justify-content:space-between}.top-links{display:flex;gap:20px}.top-links a{color:#b8d4ea;transition:color .15s}.top-links a:hover{color:#ffd43b}.main-header{background:#fff;border-bottom:1px solid #e4ecf3;position:sticky;top:0;z-index:200;transition:box-shadow .2s}.main-header.scrolled{box-shadow:0 2px 16px #1e3a5f1f}.main-header-inner{display:flex;align-items:center;justify-content:space-between;padding-top:14px;padding-bottom:14px}.logo{display:flex;align-items:center;gap:12px}.logo img{height:46px;width:auto;object-fit:contain}.logo-text{font-size:22px;font-weight:700;color:#1e3a5f}.main-nav{display:flex;align-items:center;gap:4px}.main-nav a{color:#1e3a5f;font-size:15px;font-weight:600;padding:8px 14px;border-radius:5px;transition:background .15s,color .15s}.main-nav a:hover{background:#eef4fb;color:#3776ab}.main-nav .nav-patreon{color:#ff424d;font-weight:600}.main-nav .nav-patreon:hover{background:#fff0f1;color:#e03040}.main-nav .nav-cta{background:#3776ab;color:#fff;border-radius:5px;margin-left:8px}.main-nav .nav-cta:hover{background:#2b5f8f;color:#fff}.menu-toggle{display:none;background:none;border:none;font-size:22px;cursor:pointer;color:#1e3a5f;padding:4px 8px}.hero{background:linear-gradient(145deg,#1e3a5f,#3776ab 55%,#4e8fc7);color:#fff;padding:90px 0 80px;overflow:hidden}.hero-inner{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}.hero-eyebrow{font-size:13px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:#ffd43b;margin-bottom:14px}.hero h1{font-size:54px;font-weight:700;line-height:1.12;margin-bottom:22px}.hero-subtitle{font-size:19px;color:#cde0f2;line-height:1.65;margin-bottom:38px;max-width:480px}.hero-buttons{display:flex;gap:14px;flex-wrap:wrap}.code-window{background:#1a1e2e;border-radius:12px;overflow:hidden;box-shadow:0 24px 60px #00000073,0 0 0 1px #ffffff14}.code-titlebar{background:#252a3a;padding:12px 18px;display:flex;align-items:center;gap:8px;border-bottom:1px solid rgba(255,255,255,.06)}.dot{width:12px;height:12px;border-radius:50%}.dot.red{background:#ff5f57}.dot.yellow{background:#febc2e}.dot.green{background:#28c840}.code-filename{font-family:Source Code Pro,monospace;font-size:13px;color:#888;margin-left:8px}.code-block{padding:26px 28px;overflow-x:auto;margin:0}.code-block code{font-family:Source Code Pro,Courier New,monospace;font-size:14px;line-height:1.75;color:#abb2bf;white-space:pre}.tok-comment{color:#6a9955}.tok-kw{color:#c586c0}.tok-fn{color:#dcdcaa}.tok-var{color:#9cdcfe}.tok-str{color:#ce9178}.stats-bar{background:#f0f6fc;border-top:1px solid #dce8f4;border-bottom:1px solid #dce8f4;padding:36px 0}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.stat{text-align:center}.stat-num{display:block;font-size:36px;font-weight:700;color:#3776ab;line-height:1}.stat-lbl{display:block;font-size:14px;color:#555;margin-top:6px}.courses{padding:92px 0;background:#fff}.courses-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-top:0}.course-card{border:2px solid #e4ecf3;border-radius:14px;overflow:hidden;background:#fff;display:flex;flex-direction:column;transition:transform .25s,box-shadow .25s,border-color .25s}.course-card:hover{transform:translateY(-6px);box-shadow:0 16px 40px #3776ab24;border-color:#3776ab}.course-card.course-featured{border-color:#ffd43b}.course-card.course-featured:hover{border-color:#f0c800;box-shadow:0 16px 40px #ffd43b38}.course-header{padding:28px 36px 24px;display:flex;align-items:center;justify-content:space-between}.header-beginner{background:linear-gradient(120deg,#e8f5e9,#f1fbf2)}.header-desktop{background:linear-gradient(120deg,#e3f2fd,#eff8ff)}.header-web{background:linear-gradient(120deg,#f3e5f5,#fce4f5)}.header-game{background:linear-gradient(120deg,#fff3e0,#fff8f0)}.course-badge{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1px;padding:5px 14px;border-radius:20px}.badge-beginner{background:#c8e6c9;color:#1b5e20}.badge-advanced{background:#fff9c4;color:#bf6000}.course-icon{font-size:44px}.course-body{padding:0 36px 28px;flex:1}.course-body h3{font-size:20px;font-weight:700;color:#1e3a5f;margin-bottom:10px;line-height:1.3}.course-body>p{color:#555;font-size:15px;line-height:1.65;margin-bottom:24px}.topic-list{list-style:none}.topic-list li{padding:9px 0;border-bottom:1px solid #f2f5f8;font-size:15px;color:#1a1a1a;display:flex;align-items:center;gap:10px}.topic-list li:before{content:"✓";color:#3776ab;font-weight:700;flex-shrink:0}.course-footer{padding:24px 36px;border-top:1px solid #f2f5f8;display:flex;align-items:center;justify-content:space-between}.course-meta{display:flex;flex-direction:column;gap:4px;font-size:14px;color:#666}.why{padding:92px 0;background:#f5f9fd}.features-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;margin-top:52px}.feature-card{background:#fff;border-radius:12px;padding:36px 28px;text-align:center;border:1px solid #e4ecf3;transition:transform .2s,box-shadow .2s}.feature-card:hover{transform:translateY(-4px);box-shadow:0 8px 24px #3776ab1f}.feature-icon{font-size:44px;margin-bottom:16px}.feature-card h3{font-size:18px;font-weight:700;color:#1e3a5f;margin-bottom:10px}.feature-card p{font-size:15px;color:#555;line-height:1.6}.testimonials{padding:92px 0;background:#fff}.testimonials-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:52px}.testimonial-card{background:#f7fbff;border-radius:14px;padding:36px 32px 32px;border:1px solid #dce8f4;position:relative}.quote-mark{font-size:72px;line-height:.6;color:#3776ab;opacity:.15;font-family:Georgia,serif;margin-bottom:18px;-webkit-user-select:none;user-select:none}.testimonial-card>p{font-size:15px;line-height:1.75;color:#333;margin-bottom:28px;font-style:italic}.testimonial-author{display:flex;align-items:center;gap:14px}.avatar{width:46px;height:46px;border-radius:50%;background:linear-gradient(135deg,#3776ab,#1e3a5f);color:#fff;font-weight:700;font-size:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.testimonial-author strong{display:block;font-size:15px;color:#1e3a5f}.testimonial-author span{font-size:13px;color:#777}.cta-section{background:linear-gradient(145deg,#1e3a5f,#3776ab);padding:80px 0}.cta-inner{display:flex;align-items:center;justify-content:space-between;gap:40px;flex-wrap:wrap}.cta-text h2{font-size:34px;font-weight:700;color:#fff;margin-bottom:10px}.cta-text p{font-size:17px;color:#cde0f2;max-width:520px}.cta-buttons{display:flex;gap:14px;flex-shrink:0;flex-wrap:wrap}.footer{background:#132b45;color:#b8d4ea}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;padding:64px 28px 52px}.footer-brand .footer-logo{display:flex;align-items:center;gap:12px;margin-bottom:14px}.footer-brand .footer-logo img{height:38px;object-fit:contain;opacity:.9}.footer-brand .footer-logo span{font-size:18px;font-weight:700;color:#fff}.footer-brand>p{font-size:14px;line-height:1.7;color:#8aaec8}.footer-col h4{color:#fff;font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;margin-bottom:18px}.footer-col ul{list-style:none}.footer-col ul li{margin-bottom:10px}.footer-col ul li a{color:#8aaec8;font-size:14px;transition:color .15s}.footer-col ul li a:hover{color:#ffd43b}.footer-patreon{color:#ff8087!important}.footer-patreon:hover{color:#ff424d!important}.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding:18px 0}.footer-bottom p{text-align:center;font-size:13px;color:#5a7d9a}@media (max-width: 960px){.hero h1{font-size:42px}.hero-inner{gap:40px}.features-grid{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:1fr 1fr;gap:36px}.footer-brand{grid-column:1 / -1}}@media (max-width: 768px){.top-bar{display:none}.main-nav{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;flex-direction:column;align-items:stretch;padding:12px 16px 20px;box-shadow:0 8px 24px #0000001f;border-top:1px solid #e4ecf3;gap:2px}.main-nav.open{display:flex}.main-nav a{padding:12px 16px;border-radius:6px}.main-nav .nav-cta{margin-left:0;text-align:center}.menu-toggle{display:block}.hero{padding:60px 0 52px}.hero-inner{grid-template-columns:1fr;gap:0}.hero h1{font-size:36px}.hero-subtitle{font-size:17px}.hero-code-wrap{display:none}.stats-grid{grid-template-columns:repeat(2,1fr)}.section-title{font-size:28px}.courses-grid{grid-template-columns:1fr}.cta-inner{flex-direction:column;text-align:center}.cta-text h2{font-size:26px}.testimonials-grid,.footer-grid{grid-template-columns:1fr}}@media (max-width: 480px){.hero h1{font-size:30px}.hero-buttons{flex-direction:column}.cta-buttons{flex-direction:column;width:100%}.cta-buttons .btn{text-align:center}.course-footer{flex-direction:column;gap:16px;align-items:flex-start}}