:root{
  --bg1:#072736;--bg2:#0c3647;--card:#10384a;--line:#1a4b60;--text:#e8f7ff;
  --muted:#9fb9c6;--accent:#54d0ff;--success:#22c55e;
  --container-w: 1080px;
  --space: clamp(12px, 2.5vw, 24px);
  --radius: 16px;
  --fs-hero: clamp(18px, 5.0vw, 38px);
  --fs-loc: clamp(14px, 2.4vw, 20px);
  --fs-row: clamp(13px, 1.8vw, 16px);
}
body{
  background:linear-gradient(180deg,var(--bg1),var(--bg2));
  color:var(--text);
  font-family:Inter,system-ui,Arial,sans-serif;
  margin:0
}
.hero-wrap{
  max-width: var(--container-w);
  margin: clamp(16px, 3vw, 48px) auto;
  padding-left: calc(env(safe-area-inset-left, 0px) + clamp(12px, 3vw, 24px));
  padding-right: calc(env(safe-area-inset-right, 0px) + clamp(12px, 3vw, 24px));
  text-align:left;
}

/* Flag row */
.flag-row{ display:flex; align-items:center; gap:12px; margin-bottom:6px; }
.flag-badge{ font-size:28px; line-height:1; }
.hero-loc{ font-size:var(--fs-loc); opacity:.95; font-weight:700; }

/* Header dynamic fit (v7) */
.hero-ip{
  font-size: var(--fs-hero);
  font-weight: 800;
  margin: 6px 0 0 0;
  line-height: 1.2;
  word-break: normal;
  overflow: visible;
}
.hero-ip .hero-line{ display:block; white-space:nowrap; }
.line-wrap{ white-space:nowrap; display:inline-flex; align-items:center; gap:8px; }

.br-desktop{ display:none; height:10px; width:100%; content:""; }
.br-mobile{ display:block; height:8px; width:100%; content:""; }
@media (min-width: 768px){
  .br-desktop{ display:block; height:10px; }
  .br-mobile{ display:none; }
}

/* ===== GRID aliniat stânga, compact ===== */
.info-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(8px, 2vw, 20px);
  background: linear-gradient(180deg, var(--card), #0f3344);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: clamp(10px, 2vw, 18px);
  box-shadow: 0 10px 26px rgba(0, 0, 0, .25);
  text-align: left;
}
.col-title{
  font-size: clamp(15px, 2vw, 18px);
  font-weight: 700;
  margin: 0 0 8px 0;
  color: var(--accent);
  border-bottom: 1px solid rgba(255,255,255,.1);
  padding-bottom: 4px;
}
.info-grid .row {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid rgba(255, 255, 255, .06);
  padding: 6px 0;
  font-size: var(--fs-row);
  text-align: left;
}
.info-grid .k {
  width: 140px;
  flex-shrink: 0;
  font-weight: 600;
  color: var(--muted);
  text-align: left;
}
.info-grid .v {
  flex: 1;
  font-weight: 700;
  overflow-wrap: anywhere;
  text-align: left;
}

/* ===== Breakpoints ===== */
@media (max-width: 900px){
  .info-grid{ grid-template-columns:1fr; }
  .info-grid .k{ width: 120px; }
}
@media (max-width: 600px){
  .info-grid .k{ width: 110px; }
}
@media (max-width: 400px){
  :root{ --fs-hero: clamp(18px, 5.6vw, 34px); }
}
@media (min-width: 1440px){
  :root{ --container-w: 1180px; }
}