/* Light theme with real photos; brand colors are easily adjustable */
:root{
  --bg:#ffffff; --text:#111827; --muted:#4b5563; --border:#e5e7eb;
  --primary:#2563eb;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
img{max-width:100%;display:block}
body{font-family:'Open Sans', Arial, sans-serif;background:var(--bg);color:var(--text)}
h1,h2,h3{font-family:'Montserrat', Arial, sans-serif;color:var(--text)}
.container{max-width:1120px;margin:0 auto;padding:16px 20px}
.site-header{position:sticky;top:0;background:#fff;border-bottom:1px solid var(--border);z-index:10}
.header-inner{display:flex;align-items:center;justify-content:space-between}
.brand{display:flex;align-items:center;gap:10px}
.brand-icon{width:28px;height:28px;object-fit:cover;border-radius:6px}
.brand-name{font-weight:800;letter-spacing:.5px;color:var(--text)}
.nav a{margin-left:18px;color:var(--muted);text-decoration:none;font-weight:600}
.nav a.active,.nav a:hover{color:var(--primary)}
.hero{position:relative;min-height:54vh;background-size:cover;background-position:center;border-bottom:1px solid var(--border)}
.overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.30),rgba(0,0,0,.35))}
.hero-inner{position:relative;z-index:1;text-align:center;color:#fff;max-width:900px}
.title{margin:0 0 8px;font-size:clamp(28px,4vw,44px);letter-spacing:.2px}
.subtitle{max-width:82ch;margin:0 auto;color:#e5e7eb;line-height:1.75}
.btn{display:inline-block;margin-top:16px;padding:10px 16px;border-radius:8px;background:var(--primary);color:#fff;font-weight:700;text-decoration:none}
.section{padding:56px 0}
.section.alt{background:#fafafa;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
h2{margin:0 0 12px;font-size:clamp(22px,3vw,32px)}
p{line-height:1.8}
.narrow{max-width:90ch}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;margin-top:12px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px;margin-top:12px}
.card{background:#fff;border-radius:10px;border:1px solid var(--border);box-shadow:0 1px 2px rgba(0,0,0,.03);overflow:hidden;display:flex;flex-direction:column}
.card-img{width:100%;height:180px;object-fit:cover;background:#fff;border-bottom:1px solid var(--border)}
.card-body{padding:14px}
.card h3{margin:0 0 6px;font-size:18px}
.site-footer{border-top:1px solid var(--border);background:#fff;text-align:center;padding:18px 0}
.site-footer small{color:var(--muted)}
a{color:var(--primary)}
a:focus,.btn:focus{outline:none;box-shadow:0 0 0 3px color-mix(in oklab, var(--primary) 35%, white)}


/* Scrollspy & smooth-scrolling tweaks */
html { scroll-behavior: smooth; }
.section, .hero { scroll-margin-top: 76px; } /* offset for sticky header */
.nav a.active { position: relative; color: var(--primary); }
.nav a.active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -8px; height: 3px; background: var(--primary); border-radius: 2px; }