.navbar{z-index:20;background:var(--color-red);min-height:80px;box-shadow:var(--shadow-soft);border-radius:5px;align-items:center;gap:1.5rem;padding:18px 20px;display:flex;position:fixed;inset:10px 10px auto;html[data-theme=dark] &{background:var(--color-navbar-dark)}& .navbar-logo{color:var(--color-jade);text-shadow:0 5px 5px #000000b3;align-items:center;gap:.5rem;margin-right:auto;font-size:2rem;font-weight:700;text-decoration:none;display:flex}& .logo{background:var(--color-jade);border-radius:50%;width:40px;height:40px;box-shadow:0 5px 5px #000000b3;html[data-theme=dark] &{background:var(--color-red)}}& .logo-dark{display:none}html[data-theme=dark] &{& .logo-light{display:none}& .logo-dark{display:block}}& .navbar-links{gap:2rem;list-style:none;display:flex;& a{color:var(--color-navbar-light);font-size:1.1rem;font-weight:700;text-decoration:none;&:hover{color:var(--color-jade);html[data-theme=dark] &{color:var(--color-red)}}}}& .toolbar{align-items:center;gap:1rem;display:flex}& .navbar-burger{color:var(--color-navbar-light);cursor:pointer;background:0 0;border:0;font-size:2rem;display:none}}.theme-toggle,.locale-button{border:1px solid var(--color-bg-dark);background:var(--color-jade);cursor:pointer;border-radius:5px;justify-content:flex-start;align-items:center;width:60px;height:40px;padding:5px;display:flex}.theme-toggle{& .theme-sun{display:none}html[data-theme=dark] &{border-color:var(--color-bg-light);background:var(--color-red);justify-content:flex-end;& .theme-moon{display:none}& .theme-sun{display:block}}}.locale-switcher{display:inline-flex;position:relative;& .locale-button{justify-content:center}& .locale-menu{background:var(--color-jade);border-radius:5px;width:60px;position:absolute;top:calc(100% + 3px);overflow:hidden;& a{justify-content:center;align-items:center;height:40px;display:flex}}}.side-menu{z-index:30;border-left:1px solid var(--color-navbar-light);background:var(--color-red);min-width:250px;max-width:80vw;height:100vh;color:var(--color-navbar-light);opacity:0;pointer-events:none;flex-direction:column;gap:2rem;padding:1.2rem;transition:opacity .25s,transform .25s;display:flex;position:fixed;top:0;right:0;transform:translate(100%);html[data-theme=dark] &{background:var(--color-navbar-dark)}&.open{opacity:1;pointer-events:auto;transform:translate(0)}& .close-btn{color:var(--color-navbar-light);cursor:pointer;background:0 0;border:0;align-self:flex-end;font-size:2.2rem;line-height:1}& ul{flex-direction:column;gap:2rem;list-style:none;display:flex}& a{color:var(--color-navbar-light);font-size:1.3rem;font-weight:700;text-decoration:none;&:hover{color:var(--color-jade);html[data-theme=dark] &{color:var(--color-red)}}}& .side-menu-footer{z-index:1;justify-content:space-between;align-items:center;gap:1rem;margin-top:auto;display:flex;position:relative}& .side-locale{background:var(--color-jade);border-radius:5px;gap:.25rem;padding:0 .25rem;& a{justify-content:center;align-items:center;height:40px;display:flex}}}.side-overlay{z-index:25;background:#0000004d;border:0;position:fixed;inset:0}@media (width<=900px){.navbar{& .navbar-links,& .toolbar{display:none}& .navbar-burger{display:flex}}}.footer{background:var(--color-red);color:var(--color-navbar-light);text-align:center;margin-top:auto;padding:2rem;box-shadow:0 -2px 8px #00000012;html[data-theme=dark] &{background:var(--color-navbar-dark)}}*{box-sizing:border-box;margin:0;padding:0}:root{--color-red:#c62828;--color-jade:#43a047;--color-jade-dark:#00675b;--color-bg-light:#fff8e1;--color-bg-card-light:#ffe0b2;--color-text-light:#333;--color-navbar-light:#fff;--color-bg-dark:#1a1a1a;--color-bg-card-dark:#263238;--color-text-dark:#e0e0e0;--color-navbar-dark:#00675b;--shadow-soft:0 2px 8px #0000001f}html{scroll-behavior:smooth;background:var(--color-bg-light);min-height:100%;color:var(--color-text-light);&[data-theme=dark]{background:var(--color-bg-dark);color:var(--color-text-dark)}}body{background:var(--color-bg-light);min-height:100vh;color:var(--color-text-light);flex-direction:column;font-family:Segoe UI,Roboto,Arial,sans-serif;display:flex;html[data-theme=dark] &{background:var(--color-bg-dark);color:var(--color-text-dark)}}main{background:var(--color-bg-light);min-height:100vh;color:var(--color-text-light);flex:1;padding:120px 2rem 2rem;html[data-theme=dark] &{background:var(--color-bg-dark);color:var(--color-text-dark)}}img{max-width:100%}