
/* ===== HERO rules (v5: background-image cover) ===== */
.hero-header[data-hero="bg"]{
  position:relative;
  margin:0; padding:0;
  overflow:hidden;
  background-image:url('header.jpg');
  background-size:cover;
  background-position:center top;
  background-repeat:no-repeat;
  background-color:transparent;
}
/* Desktop */
@media (min-width: 1024px){
  .hero-header[data-hero="bg"]{ height:80vh; min-height:620px; }
}
/* Tablet */
@media (min-width: 768px) and (max-width: 1023px){
  .hero-header[data-hero="bg"]{ height:70vh; min-height:560px; }
}
/* Mobile defaults */
@media (max-width: 767px){
  .hero-header[data-hero="bg"]{ height:auto; min-height:520px; }
}

/* Overlay & logo layering */
.header-overlay{
  position:absolute; bottom:6%; left:50%; transform:translateX(-50%);
  z-index:1; color:#fff; text-align:center; padding:0 16px; max-width:min(100%, 1100px);
}
V0px; padding:20px }

/* Top bar / nav base */
.top-bar{ position:fixed; top:10px; right:10px; z-index:999; display:flex; align-items:center; gap:8px }
.top-menu{ background:rgb(28 63 51 / 95%); backdrop-filter:saturate(120%) blur(2px); border:1px solid rgb(195 164 94 / 40%); border-radius:12px }
.top-menu .nav-links{ list-style:none; margin:0; padding:10px 14px; display:flex; gap:16px }
.top-menu .nav-links a{ color:white; text-decoration:none; font-weight:600; letter-spacing:.2px }

/* Hamburger */
.hamburger{ display:none; position:relative; width:40px; height:40px; border:1px solid rgb(195 164 94 / 50%); border-radius:10px; background:rgb(28 63 51 / 92%); cursor:pointer; align-items:center; justify-content:center }
.hamburger span{ position:absolute; width:22px; height:2px; background:white; transition:.25s ease }
.hamburger span:nth-child(1){ transform:translateY(-6px) }
.hamburger span:nth-child(2){ transform:translateY(0) }
.hamburger span:nth-child(3){ transform:translateY(6px) }
body.nav-open .hamburger span:nth-child(1){ transform:rotate(45deg) }
body.nav-open .hamburger span:nth-child(2){ opacity:0 }
body.nav-open .hamburger span:nth-child(3){ transform:rotate(-45deg) }

@media (max-width: 992px){
  .hamburger{ display:flex }
  .top-menu{ display:none; position:absolute; top:48px; right:0; min-width:240px }
  body.nav-open .top-menu{ display:block }
  .top-menu .nav-links{ flex-direction:column; gap:10px }
}
@media (min-width: 993px){ .top-menu{ display:block } }

/* v6: mobile hero behaves like desktop cover + centered overlay */
@media (max-width: 767px){
  .hero-header[data-hero="bg"]{
    height: 100vh;
    min-height: 540px;
    background-size: cover;
    background-position: center top;
  }
  .header-overlay{
    bottom: 15%;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    padding-left: 16px;
    padding-right: 16px;
    width: 100%;
    max-width: 92vw;
  }
  .header-overlay h1{ margin:0 0 8px 0; font-size: clamp(22px, 7vw, 34px); line-height:1.15 }
  .header-overlay p{ margin:0; font-size: clamp(14px, 4.2vw, 18px); line-height:1.45 }
}

/* v7: larger logo on mobile and balanced tablet */
@media (min-width: 768px) and (max-width: 1023px){ .logo{ max-height: 200px; padding: 14px; will-change: transform; }
}
@media (max-width: 767px){ .logo{ max-height: clamp(140px, 24vw, 180px); height:auto; padding: 8px; will-change: transform; } }
}

/* Utility */
img{ max-width:100%; height:auto; display:block }
section{ padding:clamp(16px,4vw,36px) clamp(12px,4vw,28px); max-width:1100px; margin:0 auto }
:target{ scroll-margin-top:90px }


/* === v8 logo sizing start === */

/* Desktop (>=1024px): increase slightly */
@media (min-width: 1024px){
  .logo{
  max-height: 260px;
  padding: 20px;
  will-change: transform; }
}

/* Tablet (768px–1023px): bigger */
@media (min-width: 768px) and (max-width: 1023px){ .logo{ max-height: 200px;
  padding: 14px;
  will-change: transform; }
}

/* Mobile (<768px): significantly bigger */
@media (max-width: 767px){ .logo{ max-height: clamp(140px, 24vw, 180px); height:auto; padding: 8px; will-change: transform; } }
}

/* === v8 logo sizing end === */









