:root {
--bg:          #faf8f4;
--bg2:         #f2efe8;
--bg3:         #e8e4da;
--surface:     #ffffff;
--ink:         #0f0d0a;
--ink2:        #2a2720;
--muted:       #7a7570;
--muted2:      #a09b95;
--border:      rgba(0,0,0,0.08);
--border-mid:  rgba(0,0,0,0.13);
--orange:      #e85d20;
--orange-l:    #f07040;
--orange-dim:  rgba(232,93,32,0.09);
--orange-bord: rgba(232,93,32,0.22);
--green-l:     #40916c;
--shadow-card: 0 2px 24px rgba(0,0,0,0.07);
--nav-bg:      rgba(250,248,244,0.9);
}
[data-theme="dark"] {
--bg:          #0b0b0a;
--bg2:         #111110;
--bg3:         #1a1a18;
--surface:     #161614;
--ink:         #f0ece3;
--ink2:        #d4cfc6;
--muted:       #6b6760;
--muted2:      #504d48;
--border:      rgba(255,255,255,0.07);
--border-mid:  rgba(255,255,255,0.12);
--orange-dim:  rgba(232,93,32,0.13);
--orange-bord: rgba(232,93,32,0.25);
--green-l:     #52b788;
--shadow-card: 0 2px 24px rgba(0,0,0,0.4);
--nav-bg:      rgba(11,11,10,0.85);
}
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
font-family: 'DM Sans', sans-serif;
background: var(--bg);
color: var(--ink);
transition: background 0.35s, color 0.35s;
overflow-x: hidden;
}
a { color: var(--orange); text-decoration: none; }
a:hover { color: var(--orange-l); }
img { max-width:100%; height:auto; display:block; }
.container {
max-width: 1160px;
margin: 0 auto;
padding: 0 48px;
}
@media(max-width:768px) {
.container { padding: 0 20px; }
}