/* =====================================
   LIGHT MODE / DEFAULT
===================================== */
:root{
    --bg:#edf1f5;
    --surface:#ffffff;
    --surface-hover:#f1f4f7;
    --footer:#e1e6eb;
    --footer-border:#c7cdd4;
    --text:#202124;
    --text-secondary:#5f6368;
    --border:#c7cdd1;
    --primary:#1a73e8;
    --radius:14px;
    --radius-lg:22px;
    --shadow:0 5px 18px rgba(0,0,0,.10);
    --transition:.25s ease;
}

/* =====================================
   DARK MODE
===================================== */
html[data-theme="dark"]{
    --bg:#202124;
    --surface:#303134;
    --surface-hover:#3c4043;
    --footer:#171717;
    --footer-border:#313335;
    --text:#e8eaed;
    --text-secondary:#9aa0a6;
    --border:#5f6368;
    --primary:#8ab4f8;
    --shadow:0 5px 18px rgba(0,0,0,.35);
}

/* =====================================
   RESET
===================================== */
*{margin:0;padding:0;box-sizing:border-box}html{min-height:100%;background:var(--bg);scroll-behavior:smooth}body{min-height:100vh;font-family:Inter,Arial,sans-serif;color:var(--text);background:radial-gradient(circle at 15% 0%,rgb(26 115 232 / .13),transparent 35%),var(--bg);transition:background var(--transition),color var(--transition)}a{color:inherit;text-decoration:none}
.container{width:min(1120px,92%);margin:auto}

/* ===================================== HEADER ===================================== */
.header{position:sticky;top:0;z-index:1000;background:var(--bg);border-bottom:1px solid var(--border);backdrop-filter:blur(20px)}.header-wrap{max-width:1200px;height:60px;min-height:60px;margin:0 auto;padding:0 20px;display:flex;align-items:center;justify-content:space-between}.header-logo{color:var(--text);font-size:1.5rem;font-weight:700;text-decoration:none}.header-logo span{color:var(--primary)}.nav{display:flex;align-items:center;gap:32px}.nav a{color:var(--text-secondary);transition:color var(--transition)}.nav a:hover{color:var(--text)}.theme-toggle{width:44px;height:44px;display:flex;align-items:center;justify-content:center;color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:50%;cursor:pointer}.theme-toggle:hover{background:var(--surface-hover)}.theme-toggle svg{width:22px;height:22px}.sun{display:none}html[data-theme="dark"] .moon{display:none}html[data-theme="dark"] .sun{display:block}.menu-toggle{display:none;width:44px;height:44px;color:var(--text);background:none;border:none;font-size:28px;cursor:pointer}




.page-content{width:100%;max-width:1200px;margin:32px auto;padding:32px;box-sizing:border-box;background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow);transition:background var(--transition),color var(--transition),border-color var(--transition),box-shadow var(--transition)}.page-content h1,.page-content h2,.page-content h3,.page-content h4,.page-content h5,.page-content h6{margin-top:0;margin-bottom:16px;color:var(--text);line-height:1.25;font-weight:700}.page-content h1{font-size:clamp(1.9rem, 4vw, 2.7rem);letter-spacing:-.03em}.page-content h2{margin-top:40px;font-size:clamp(1.5rem, 3vw, 2.1rem);letter-spacing:-.02em}.page-content h3{margin-top:32px;font-size:clamp(1.25rem, 2.5vw, 1.6rem)}.page-content h4{margin-top:28px;font-size:1.2rem}.page-content h5{margin-top:24px;font-size:1.05rem}.page-content h6{margin-top:20px;font-size:.95rem}.page-content p{margin:0 0 20px;color:var(--text-secondary);font-size:1rem;line-height:1.8}.page-content strong,.page-content b{color:var(--text);font-weight:700}.page-content em,.page-content i{color:var(--text-secondary)}.page-content a{color:var(--primary);text-decoration:none;font-weight:600;transition:color var(--transition),opacity var(--transition)}.page-content a:hover{text-decoration:underline}.page-content ul,.page-content ol{margin:0 0 20px;padding-left:24px;color:var(--text-secondary)}.page-content li{margin-bottom:10px;line-height:1.7}.page-content li::marker{color:var(--primary)}.page-content blockquote{margin:24px 0;padding:18px 20px;background:var(--surface);color:var(--text-secondary);border-left:4px solid var(--primary);border-radius:0 var(--radius) var(--radius) 0;line-height:1.7}.page-content hr{height:1px;margin:32px 0;background:var(--border);border:0}.page-content img{display:block;width:100%;max-width:100%;height:auto;margin:24px auto;border-radius:var(--radius)}.page-content>:first-child{margin-top:0}.page-content>:last-child{margin-bottom:0}@media (max-width:768px){.page-content{margin:24px auto;padding:24px 20px;border-radius:var(--radius)}.page-content h2{margin-top:32px}.page-content h3{margin-top:28px}.page-content p{line-height:1.75}}@media (max-width:480px){.page-content{width:calc(100% - 24px);margin:16px auto;padding:20px 16px;border-radius:12px}.page-content h1{font-size:1.8rem}.page-content h2{margin-top:28px;font-size:1.45rem}.page-content h3{margin-top:24px;font-size:1.2rem}.page-content p{margin-bottom:18px;font-size:.96rem;line-height:1.7}.page-content ul,.page-content ol{padding-left:20px}}
@media(max-width:768px){.menu-toggle{display:block;z-index:1001}.header-wrap{display:grid;grid-template-columns:44px 1fr 44px}.header-logo{justify-self:center;font-size:1.2rem}.nav{position:fixed;top:0;left:-100%;width:100%;height:100vh;display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:90px 20px;background:var(--bg);transition:left .3s ease;z-index:999}.nav.active{left:0}.nav a{width:100%;display:block;padding:12px 16px;color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:8px}.nav a:hover{border-color:var(--primary);background:var(--surface-hover)}}

	  /* ==== FOOTER ==== */
 footer{padding:55px 0 24px;color:var(--text);background:var(--footer);border-top:1px solid var(--footer-border)}.footergrid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:35px}.footer-title{margin:0 0 14px;color:var(--text);font-size:18px;font-weight:700;line-height:1.4}.footer-description{margin:0;max-width:520px;color:var(--text-secondary);line-height:1.8}.footergrid a{display:block;width:max-content;max-width:100%;margin:8px 0;color:var(--text-secondary);text-decoration:none;transition:color var(--transition)}.footergrid a:hover{color:var(--primary)}.copy{margin:34px auto 0;padding-top:18px;color:var(--text-secondary);border-top:1px solid var(--footer-border);text-align:center;font-size:14px;line-height:1.6}@media(max-width:900px){.footergrid{grid-template-columns:repeat(2,1fr);gap:25px}.footergrid>div:first-child{grid-column:1/-1}}@media(max-width:560px){.footergrid{grid-template-columns:1fr}.footergrid>div:first-child{grid-column:auto}}