/* theme.css - dark mode, dropdown menus, contact grid. Linked AFTER the main <style>. */
nav{align-items:center}
.dropdown{position:relative;padding:.5rem 0;margin:-.5rem 0}
.dropbtn{cursor:pointer}
.dropdown-menu{display:none;position:absolute;top:100%;left:-.75rem;min-width:150px;padding:.4rem 0;background:var(--card-bg);border:1px solid var(--border-color);border-radius:6px;box-shadow:0 6px 18px rgba(0,0,0,.12);z-index:60}
.dropdown-menu a{display:block;padding:.5rem 1rem;white-space:nowrap}
.dropdown:hover .dropdown-menu,.dropdown:focus-within .dropdown-menu,.dropdown.open .dropdown-menu{display:block}
.theme-toggle{background:none;border:1px solid var(--border-color);border-radius:50%;width:2.1rem;height:2.1rem;cursor:pointer;font-size:1rem;line-height:1;padding:0}
.theme-toggle:hover{border-color:var(--accent-color)}
.contact-list{grid-template-columns:repeat(3,minmax(0,280px));justify-content:center}
@media(max-width:800px){.contact-list{grid-template-columns:minmax(0,320px)}}
/* Dark mode */
:root[data-theme="dark"]{color-scheme:dark;--bg-color:#16171a;--text-color:#e8e6e1;--accent-color:#6db3ff;--border-color:#33353a;--card-bg:#202226}
[data-theme="dark"] p{color:#c9c7c2}
[data-theme="dark"] nav a{color:#aaa}
[data-theme="dark"] nav a:hover{color:var(--accent-color)}
[data-theme="dark"] .subtitle{color:#b5b3ae}
[data-theme="dark"] .meta{color:#9a9892}
[data-theme="dark"] .tag{background:#2c2e33;color:#bbb}
[data-theme="dark"] .hero img,[data-theme="dark"] .img-placeholder{background:#2a2c30;color:#888}
[data-theme="dark"] .card:hover{border-color:#555}
[data-theme="dark"] .btn{color:#16171a}
[data-theme="dark"] .btn-outline{color:var(--text-color)}
[data-theme="dark"] .sketch-grid button{background:#2a2c30}
[data-theme="dark"] footer{color:#888}
[data-theme="dark"] #translate-banner{background:#3a331c;border-color:#554b25;color:#e8d9a0}
.sub-logo{font-family:"Pinyon Script",cursive;font-size:2.4rem;font-weight:400;line-height:1;color:var(--text-color);text-decoration:none;-webkit-text-stroke:.6px var(--text-color);letter-spacing:.5px;margin-right:auto;margin-left:1.5rem;white-space:nowrap}
.sub-logo.logo-plain{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;font-size:1.4rem;font-weight:700;-webkit-text-stroke:0}
@media(max-width:700px){.sub-logo{font-size:1.4rem;margin-left:.75rem}.sub-logo.logo-plain{font-size:1rem}}
.card ul{margin:.75rem 0 0 1.25rem;padding:0}
.card li{color:#444;margin-bottom:.6rem}
[data-theme="dark"] .card li{color:#c9c7c2}
