:root{ --red:#C1121F; --black:#000000; --gray:#F5F5F5; }
*{box-sizing:border-box}
body{ margin:0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, Helvetica, sans-serif; color:#222; line-height:1.6; background:#fff; }
body::before{
  content:"";
  position:fixed; inset:0; z-index:-1;
  background-image: url('assets/logo.png');
  background-repeat:no-repeat;
  background-position:center 20%;
  background-size: 80vmin;
  opacity:.25; /* 25% */
  filter: grayscale(100%);
}
.container{ max-width:1100px; margin:0 auto; padding:0 16px; }

header{ position:sticky; top:0; z-index:999; background:#fff; border-bottom:1px solid #eee; }
.topbar{ display:flex; align-items:center; justify-content:space-between; padding:10px 0; gap:10px; }
.brand{ display:flex; align-items:center; gap:10px; text-decoration:none; color:#111; }
.brand img{ height:40px; width:auto; }
.brand span{ font-weight:800; letter-spacing:.2px; }

nav{ display:flex; align-items:center; gap:14px; }
nav a{ text-decoration:none; color:#111; font-weight:600; }
.btn{ display:inline-block; padding:10px 16px; border-radius:6px; text-decoration:none; font-weight:700; }
.btn-primary{ background:var(--red); color:#fff; }
.btn-outline{ border:2px solid var(--red); color:var(--red); }

/* Mobile menu */
.hamburger{ display:none; flex-direction:column; gap:4px; cursor:pointer; }
.hamburger span{ width:24px; height:3px; background:#111; border-radius:2px; }

@media (max-width: 900px){
  nav{ display:none; position:absolute; top:60px; right:16px; background:#fff; border:1px solid #eee; border-radius:10px; padding:10px; box-shadow:0 10px 25px rgba(0,0,0,.08); width:min(90vw, 320px); flex-direction:column; align-items:stretch; }
  nav a{ padding:10px 12px; border-radius:8px; }
  nav.show{ display:flex; }
  .hamburger{ display:flex; }
  .header-actions .btn-primary{ display:none; } /* primary call in menu on mobile */
}

.hero{ background:#000; color:#fff; position:relative; overflow:hidden; }
.hero-inner{ display:grid; grid-template-columns: 1.1fr 0.9fr; gap:24px; align-items:center; padding:48px 0; }
.hero h1{ font-size:40px; margin:0 0 8px; }
.hero p.lead{ font-size:18px; opacity:.95; }
.hero .cta{ display:flex; gap:12px; flex-wrap:wrap; margin-top:14px; }
.hero .imgwrap img{ width:100%; border-radius:10px; border:4px solid #fff; box-shadow:0 10px 30px rgba(0,0,0,.4); }

.section{ padding:48px 0; }
.section.gray{ background:var(--gray); }
h2{ margin-top:0; font-size:28px; }
.card{ background:#fff; border:1px solid #eee; border-radius:10px; padding:18px; }

footer{ background:#111; color:#ddd; padding:32px 0; margin-top:40px; }
footer a{ color:#fff; text-decoration:none; }
.small{ font-size:14px; opacity:.85; }

/* Simple carousel */
.carousel{ position:relative; overflow:hidden; border-radius:10px; }
.carousel img{ width:100%; display:none; }
.carousel img.active{ display:block; }
.carousel .dots{ position:absolute; bottom:10px; left:0; right:0; display:flex; gap:6px; justify-content:center; }
.carousel .dot{ width:8px; height:8px; border-radius:50%; background:#fff; opacity:.6; }
.carousel .dot.active{ opacity:1; }

.header-actions{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }

/* Gallery */
.grid{ display:grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap:12px; }
.grid img{ width:100%; height:220px; object-fit:cover; border-radius:10px; cursor:pointer; }
.lightbox{ position:fixed; inset:0; background:rgba(0,0,0,.9); display:none; align-items:center; justify-content:center; z-index:9999; }
.lightbox img{ max-width:90vw; max-height:85vh; border-radius:10px; }
.lightbox.show{ display:flex; }
.lightbox .close{ position:absolute; top:20px; right:24px; font-size:28px; color:#fff; cursor:pointer; }
.lightbox .prev, .lightbox .next{ position:absolute; top:50%; transform:translateY(-50%); font-size:30px; color:#fff; cursor:pointer; padding:10px 16px; }
.lightbox .prev{ left:20px; } .lightbox .next{ right:20px; }