/* Custom tweaks layered on top of Tailwind. Keep minimal for portability. */
:root {
  --brand: #0ea5e9; /* sky-500 */
  --brand-600: #0284c7;
  --accent: #22c55e; /* green-500 */
  --ink: #0f172a;    /* slate-900 */
  --muted: #475569;  /* slate-600 */
  --bg: #ffffff;
  --bg-soft: #f1f5f9; /* slate-100 */
  --radius: 14px;
  --shadow: 0 10px 25px rgba(2, 8, 23, .08);
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0b1220;
    --bg-soft: #0f172a;
    --ink: #e2e8f0;
    --muted: #94a3b8;
    --shadow: 0 10px 25px rgba(15,23,42,.55);
  }
}
html.dark {
  --bg: #0b1220;
  --bg-soft: #0f172a;
  --ink: #e2e8f0;
  --muted: #94a3b8;
  --shadow: 0 10px 25px rgba(15,23,42,.55);
}
body { background: var(--bg); color: var(--ink); }
.card { border-radius: var(--radius); box-shadow: var(--shadow); background: var(--bg); }
.btn { border-radius: 9999px; padding: .75rem 1.1rem; font-weight: 600; display:inline-flex; align-items:center; gap:.5rem; }
.btn-primary { background: var(--brand); color: white; }
.btn-primary:hover { background: var(--brand-600); }
.btn-outline { border: 1px solid color-mix(in srgb, var(--brand) 35%, transparent); color: var(--brand); }
.btn-outline:hover { background: color-mix(in srgb, var(--brand) 10%, transparent); }
.badge { display:inline-flex; align-items:center; gap:.35rem; font-size:.75rem; padding:.3rem .6rem; border-radius: 9999px; border:1px solid rgba(2,6,23,.08); }
.badge i { width:.6rem; height:.6rem; border-radius:9999px; background: var(--brand); display:inline-block; }
.skip-link{ position:absolute; left:-999px; top:auto; width:1px; height:1px; overflow:hidden;}
.skip-link:focus{ position:fixed; left:1rem; top:1rem; z-index:50; width:auto; height:auto; padding:.5rem .75rem; background:#fff; border:2px solid #000; }
#mobile-drawer[aria-hidden="true"]{ display:none; }
#mobile-drawer[aria-hidden="false"]{ display:block; }
/* Masonry-like gallery using CSS columns */
.masonry { column-count: 1; column-gap: 1rem; }
.masonry img { break-inside: avoid; margin-bottom: 1rem; border-radius: 12px; }
@media (min-width:640px){ .masonry{ column-count:2; } }
@media (min-width:1024px){ .masonry{ column-count:3; } }
/* Lightbox */
.lightbox{ position:fixed; inset:0; background:rgba(0,0,0,.8); display:none; align-items:center; justify-content:center; padding:2rem; z-index:60; }
.lightbox.open{ display:flex; }
.lightbox img{ max-width:90vw; max-height:85vh; border-radius:12px; }
/* Toast */
.toast{ position:fixed; right:1rem; bottom:1rem; background:#111827; color:#fff; padding:.75rem 1rem; border-radius:10px; box-shadow: var(--shadow); opacity:0; transform: translateY(12px); transition: .3s; z-index:70;}
.toast.show{ opacity:1; transform: translateY(0); }
/* Back to top */
#backToTop{ position:fixed; right:1rem; bottom:1rem; display:none; z-index:40;}
/* Cookie banner */
#cookieBanner{ position:fixed; left:1rem; right:1rem; bottom:1rem; z-index:50; }