*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;background:#111;color:#fff}
.home{min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:52px 24px 24px}
.header{text-align:center;margin-bottom:38px}
.brand{font-size:clamp(34px,4vw,52px);font-weight:800;letter-spacing:.12em;line-height:1}
.brand-logo{display:block !important;width:225px !important;max-width:72vw !important;height:auto !important;max-height:76px !important;object-fit:contain !important;margin:0 auto !important;overflow:visible !important}
.subtitle{margin-top:11px;font-size:14px;letter-spacing:.16em;text-transform:uppercase;color:#aaa}
.languages{width:min(1240px,100%);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.language-card{display:flex;flex-direction:column;overflow:hidden;text-decoration:none;color:inherit;background:#1b1b1b;border:1px solid #2d2d2d;border-radius:15px;transition:transform 180ms ease,border-color 180ms ease,background 180ms ease;min-width:0}
.language-card:hover{transform:translateY(-4px);border-color:#555;background:#202020}
.language-card:focus-visible{outline:2px solid #fff;outline-offset:4px}
.cover{width:100%;aspect-ratio:16/10;overflow:hidden;background:#000}
.cover img{width:100%;height:100%;object-fit:cover;object-position:top;display:block}
.card-body{padding:17px 18px 18px}
.card-body h2{margin:0;display:flex;align-items:center;gap:10px;font-size:20px;letter-spacing:.02em}
.card-body p{margin:6px 0 16px;color:#aaa;font-size:13px}
.flag{width:27px;height:27px;flex:0 0 27px;border-radius:50%;display:block;overflow:hidden;box-shadow:0 0 0 1px rgba(255,255,255,.22);background:#000}
.flag-de{background:linear-gradient(to bottom,#000 0 33.33%,#dd0000 33.33% 66.66%,#ffce00 66.66% 100%)}
.flag-it{background:linear-gradient(to right,#009246 0 33.33%,#fff 33.33% 66.66%,#ce2b37 66.66% 100%)}
.flag-hu{background:linear-gradient(to bottom,#ce2939 0 33.33%,#fff 33.33% 66.66%,#477050 66.66% 100%)}
.open{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:600}
.open span{font-size:17px;line-height:1;transition:transform 180ms ease}
.language-card:hover .open span{transform:translateX(4px)}
footer{margin-top:auto;padding-top:40px;color:#666;font-size:11px;letter-spacing:.07em}
@media(max-width:950px){.languages{grid-template-columns:repeat(2,minmax(0,1fr));max-width:760px}}
@media(max-width:600px){.home{padding:36px 18px 20px}.header{margin-bottom:27px}.languages{grid-template-columns:1fr;gap:16px;max-width:430px}.card-body{padding:16px 18px 17px}}

/* Phone landscape warning */
.orientation-warning {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9999;
  align-items: center;
  justify-content: center;
  padding: 28px;
  text-align: center;
  background: #111;
  color: #fff;
}
.orientation-warning-inner {
  width: min(520px, 92vw);
  max-height: 92vh;
}
.orientation-icon {
  font-size: 48px;
  line-height: 1;
  margin-bottom: 14px;
  color: #ddd;
}
.orientation-warning h1 {
  margin: 0 0 9px;
  font-size: 22px;
  font-weight: 700;
}
.orientation-warning p {
  margin: 0;
  color: #aaa;
  font-size: 13px;
  line-height: 1.4;
}

.orientation-warning .warning-lang {
  margin: 4px 0 0;
  color: #888;
  font-size: 11px;
  line-height: 1.35;
}
.orientation-warning .warning-sk {
  margin: 0 0 8px;
  color: #aaa;
  font-size: 13px;
  line-height: 1.4;
}



/* Phone landscape lock - phones only; tablets remain unrestricted */
.orientation-warning { display:none !important; }
html.phone-landscape .orientation-warning {
  display:flex !important;
  position:fixed !important;
  inset:0 !important;
  z-index:999999 !important;
}
html.phone-landscape body > *:not(.orientation-warning) {
  visibility:hidden !important;
  pointer-events:none !important;
}
html.phone-landscape, html.phone-landscape body {
  overflow:hidden !important;
}
