/* --- Base / Reset --- */
* { box-sizing: border-box; }
html, body { margin:0; padding:0; }
body {
  font: 16px/1.6 system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, "Helvetica Neue", Arial, sans-serif;
  color:#111; background:#fff;
}

/* --- Layout --- */
.container { max-width: 1120px; margin: 0 auto; padding: 0 20px; }
.section { padding: 64px 0; }
.muted { color:#666; }
.small { font-size:.9rem; }

/* --- Header / Nav --- */
.site-header {
  position: sticky; top:0; z-index:1000;
  background: rgba(255,255,255,.95);
  border-bottom: 1px solid #eee;
  backdrop-filter: saturate(120%) blur(6px);
}
.header-inner {
  display:flex; align-items:center; gap:16px; padding:12px 0;
}
.brand {
  font-weight:800; letter-spacing:.06em; text-decoration:none; color:#111;
}
.nav { margin-left:auto; display:flex; gap:16px; }
.nav a { color:#333; text-decoration:none; padding:6px 10px; border-radius:8px; }
.nav a:hover { background:#f3f3f3; }

/* --- Language switch (top-right cluster) --- */
.lang-switch { display:flex; gap:8px; margin-left:16px; }
.lang-switch button{
  width:34px; height:28px; border:1px solid #ddd; border-radius:8px;
  background:#fafafa; cursor:pointer; display:grid; place-items:center;
  transition: all .15s ease;
}
.lang-switch button:hover{ background:#f0f0f0; }
.lang-switch button.active{ outline:2px solid #111; background:#fff; }
.flag{ font-size:16px; line-height:1; }

/* --- Hero --- */
.hero { background:#fff; }
.hero-grid {
  display:grid; grid-template-columns: 1.1fr .9fr; gap:36px; align-items:center;
}
.hero h1 { font-size: 2.25rem; margin:.2rem 0 8px; }
.lead { font-size:1.05rem; color:#444; }
.hero-media img { width:100%; height:auto; border-radius:14px; box-shadow: 0 8px 24px rgba(0,0,0,.08); }

/* --- Buttons --- */
.btn {
  display:inline-block; padding:10px 16px; border:1px solid #ddd; border-radius:10px;
  text-decoration:none; color:#111; font-weight:600;
}
.btn.primary { background:#111; color:#fff; border-color:#111; }
.btn + .btn { margin-left:10px; }
.cta-row { margin:18px 0 8px; display:flex; flex-wrap:wrap; gap:10px; }
.social-row { margin-top:8px; display:flex; gap:14px; }

/* --- Video embed --- */
.video-embed { position:relative; padding-bottom:56.25%; height:0; border-radius:14px; overflow:hidden; box-shadow: 0 8px 24px rgba(0,0,0,.08);}
.video-embed iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }

/* --- Cards --- */
.cards { display:grid; grid-template-columns: repeat(3, 1fr); gap:20px; margin-top:16px; }
.card { border:1px solid #eee; border-radius:14px; padding:14px; transition: box-shadow .2s; }
.card:hover { box-shadow: 0 10px 30px rgba(0,0,0,.07); }
/* Equal height card images without changing HTML */
.card img{
    width: 100%;
    aspect-ratio: 2 / 3;    /* try 4/3 or 3/2 if you prefer */
    height: auto;             /* height will follow the aspect-ratio */
    object-fit: cover;        /* crop to fill uniformly */
    border-radius: 10px;
    display: block;
    margin-bottom: 10px;
    object-position: center;  /* keep center in view */
  }
  

/* --- Contact form --- */
.contact-form { margin-top:14px; }
.contact-form .grid-2 { display:grid; grid-template-columns: 1fr 1fr; gap:14px; }
.contact-form label span { display:block; font-weight:600; color:#333; margin-bottom:6px; }
.contact-form input, .contact-form textarea {
  width:100%; padding:10px 12px; border:1px solid #ddd; border-radius:10px; background:#fff;
}
.contact-form textarea { resize: vertical; min-height: 140px; }
.honeypot { display:none; }

/* --- Footer --- */
.site-footer { border-top:1px solid #eee; padding:20px 0; }

/* --- Responsive --- */
@media (max-width: 960px) {
  .hero-grid { grid-template-columns: 1fr; }
  .cards { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .nav { display:none; } /* keep simple for now */
  .cards { grid-template-columns: 1fr; }
  .lang-switch { margin-left:auto; }
}
