:root{
  --bg:#0b0b0b; --fg:#f5f5f5; --muted:#efefef; --accent:orange;
  --card:#151515; --max:1400px; --radius:16px; --shadow:0 10px 30px rgba(0,0,0,.25);
}

/* IMPORT NGBG FONTS */
@font-face {
    font-family: 'NGBG-Regular';
    src: url('NGBG-Regular.eot') format('embedded-opentype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'NGBG-Regular';
    src: url('NGBG-Regular.otf') format('opentype'), url('NGBG-Regular.ttf') format('truetype'), url('NGBG-Regular.svg#NGBG-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
}


*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--fg);font:16px/1.5 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial}
img{max-width:100%;height:auto;display:block}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
h1,h3,h5{line-height:1.2;margin:0 0 .5em;font-family: 'NGBG-Regular';}
h2,h4,{line-height:1.2;margin:0 0 .5em;}
h4{color:var(--bg)}
p{margin:0 0 1em}
.wrap{max-width:var(--max);margin:0 auto;padding:0 11px}
.section{padding:56px 0}
.lead{font-size:1.4rem;color:var(--muted)}
.sub{font-size:1.1rem;color:var(--muted)}
.reg{font-size:0.8rem;color:var(--muted)}
.black{font-size:1rem;color:var(--bg)}
.btn{display:inline-block;background:var(--accent);color:#111;padding:.7em 1em;border-radius:999px;font-weight:700}
.btn:hover{filter:brightness(.95)}
.sr-only{position:absolute;left:-9999px}
.skip-link{position:absolute;left:-9999px;background:#fff;color:#000;padding:8px;border-radius:6px}
.skip-link:focus{left:8px;top:8px;z-index:1000}

/* Header */
.site-header{position:sticky;top:0;background:rgba(11,11,11,.8);backdrop-filter:saturate(120%) blur(6px);border-bottom:1px solid #222;z-index:100}
.site-header .wrap{display:flex;align-items:center;gap:12px;min-height:64px}
.brand{display:flex;align-items:center;gap:8px;color:var(--fg)}
.logo{height:55px;width:auto;display:inline}
.brand-text{font-weight:800;letter-spacing:.3px}
.nav-toggle{margin-left:auto;background:none;border:1px solid #333;border-radius:10px;color:var(--fg);padding:4px 8px}
.site-nav{display:none}
.site-nav.open{display:block}
.site-nav ul{list-style:none;margin:0;padding:12px 0;display:flex;flex-direction:column;gap:6px;float:right;}
.site-nav a{padding:6px 8px;border-radius:8px;display:block}
.site-nav a:hover{background:#1b1b1b}
.lang-switch{display:flex;gap:6px;margin-left:8px}
.lang-switch button{background:#1a1a1a;border:1px solid #333;color:var(--fg);padding:6px 10px;border-radius:10px}
.lang-switch button.active{background:var(--accent);color:#111;border-color:transparent}

/* Hero */
.hero {
  position: relative;
  padding: 72px 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  color: var(--fg);
}

.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.44); /* dark overlay */
  z-index: 0;
}

.hero .wrap {
  position: relative;
  z-index: 1; /* ensure text is above overlay */
}

.hero h1 {
  font-size: clamp(1.8rem, 4.5vw, 3rem);
}

.hero .lead {
  max-width: 40ch;
}



/* Cards */
.cards{display:grid;grid-template-columns:1fr;gap:12px;margin-top:20px}
.card{background:var(--card);border:1px solid #222;padding:18px;border-radius:var(--radius);box-shadow:var(--shadow)}
.card h3{margin-bottom:.3em}
.card-link{font-weight:600}
.card img {
  border-radius: var(--radius);
  margin-bottom: 10px;
  display: block;
  max-height: 300px;
  object-fit: cover;
  width: 100%;
}
/* Card hover zoom */
.card{
  position: relative;
  overflow: hidden;           /* hides zoom bleed */
  transition: box-shadow .25s ease, transform .25s ease;
}
.card img{
  transition: transform .4s ease;
  will-change: transform;
}
.card:hover img,
.card:focus-within img{
  transform: scale(1.06);
}
.card:hover,
.card:focus-within{
  box-shadow: 0 14px 40px rgba(0,0,0,.35);
  transform: translateY(-2px);
}

/* Keyboard focus visible on links inside cards */
.card a:focus-visible{
  outline: 2px solid var(--accent);
  outline-offset: 3px;
  border-radius: 8px;
}

/* Respect prefers-reduced-motion */
@media (prefers-reduced-motion: reduce){
  .card, .card img{
    transition: none !important;
  }
  .card:hover, .card:focus-within{
    transform: none;
    box-shadow: var(--shadow);
  }
}

/* Map */
.map-outer{margin:20px 0}
.osm-frame{width:100%;height:320px;border-radius:var(--radius);filter:saturate(105%)}
.map-caption{margin:.4rem 0 1rem;color:var(--muted)}

/* Lists */
.partners ul, .socials ul{list-style:disc;padding-left:1.2em}
.site-footer{border-top:1px solid #222;padding:24px 0;color:var(--muted);}

/* Breakpoints: 480, 768, 1024 */

@media (min-width:0px){
  .site-nav ul{flex-direction:row;gap:1px}
  .site-nav{display:block;width:100%}
  .nav-toggle{display:none}
  .brand-text{display:none}
  .cards{grid-template-columns:repeat(1, 1fr)}
}
@media (min-width:400px){
  .site-nav ul{flex-direction:row;gap:1px}
  .site-nav{display:block;}
  .brand-text{display:none}
  .nav-toggle{display:none}
  .cards{grid-template-columns:repeat(2, 1fr)}
}

@media (min-width:600px){
  .site-nav ul{flex-direction:row;gap:22px;}
  .site-nav{display:block}
  .brand-text{display:block}
  .nav-toggle{display:none}
  .cards{grid-template-columns:repeat(3, 1fr)}
}
@media (min-width:1000px){
  .cards{grid-template-columns:repeat(4, 1fr)}
  .hero{padding:96px 0}
  .osm-frame{height:420px}
}
@media (min-width:1200px){
  .cards{grid-template-columns:repeat(5, 1fr)}
  .osm-frame{height:500px}
}
@media (min-width:1440px){
  .cards{grid-template-columns:repeat(6, 1fr)}
  .osm-frame{height:580px}
}
@media (min-width:1600px){
  .cards{grid-template-columns:repeat(6, 1fr)}
  .osm-frame{height:660px}
}

/* Contact */
.contact-grid{display:grid;gap:24px}
.contact-form{display:grid;gap:10px;margin-top:10px}
.contact-form input,.contact-form textarea{
  background:#111;border:1px solid #333;color:var(--fg);
  padding:10px;border-radius:12px
}
.form-note{font-size:.9rem;color:var(--muted);margin-top:6px}

@media (min-width:768px){
  .contact-grid{grid-template-columns:1fr 1fr;align-items:start}
}