:root{
  --bg:#000;
  --hdrH:96px;
  --hdrH-scrolled:64px;
  --logoH:72px;
  --logoH-scrolled:44px;
}

/* Σταθερότητα layout (χωρίς «λευκές λωρίδες» στα πλάγια) */
html{ overflow-y: scroll; }

header{
  background:var(--bg); color:#fff;
  position:sticky; top:0; z-index:50;
  transition:box-shadow .25s ease;
}
header .bar{
  min-height:var(--hdrH);
  display:grid;
  /* Desktop: logo αριστερά, menu δεξιά */
  grid-template-columns:auto 1fr;
  align-items:center;
  transition:min-height .25s ease;
}
header .brand{
  justify-self:start;               /* logo αριστερά */
  display:flex; align-items:center; gap:12px;
}
header .brand img{
  height:var(--logoH);
  width:auto; display:block; /* χωρίς aspect-ratio -> ποτέ παραμόρφωση */
  filter:brightness(0) invert(1);
  transition:height .25s ease, filter .2s ease;
}

/* Shrink on scroll */
body.is-scrolled header .bar{ min-height:var(--hdrH-scrolled) }
body.is-scrolled header .brand img{ height:var(--logoH-scrolled) }
body.is-scrolled header{ box-shadow:0 8px 24px rgba(2,6,23,.18) }

/* ===== Desktop: inline menu δεξιά, burger κρυφό ===== */
nav.site-nav{
  grid-column:2; justify-self:end;  /* menu δεξιά */
  position:static; transform:none; background:transparent;
  display:flex; align-items:center; gap:24px; padding:0;
}
header nav.site-nav a{
  color:#fff; opacity:.9; transition:opacity .2s; text-decoration:none;
  font-weight:600; line-height:1;
}
header nav.site-nav a:hover{ opacity:1 }
header nav.site-nav .login{
  background:#fff; color:#0b1020!important;
  padding:12px 24px; border-radius:999px; font-weight:700; line-height:1;
  display:inline-block;
}

/* Burger hidden on desktop */
.nav-toggle{
  justify-self:end; display:none;
  width:38px; height:34px; border:0; background:transparent; cursor:pointer; position:relative;
}
.nav-toggle span{
  position:absolute; left:6px; right:6px; height:3px; background:#fff; border-radius:3px; transition:all .3s ease;
}
.nav-toggle span:nth-child(1){top:8px}
.nav-toggle span:nth-child(2){top:16px}
.nav-toggle span:nth-child(3){top:24px}
body.nav-open .nav-toggle span:nth-child(1){transform:translateY(8px) rotate(45deg)}
body.nav-open .nav-toggle span:nth-child(2){opacity:0; transform:scaleX(0)}
body.nav-open .nav-toggle span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
.nav-close{ display:none } /* όχι Χ στο desktop */

.btn.is-disabled{
  opacity:.6;
  cursor:not-allowed;
  pointer-events:auto; /* για να πιάσει το click-handler που κάνει redirect στο /pricing */
}



/* ===== Mobile / Tablet: full-screen overlay ===== */
@media (max-width:900px){
  .nav-toggle{ display:block }

  nav.site-nav{
    position:fixed; inset:0;
    background:linear-gradient(135deg, #0a0c12 0%, #1a1d28 100%);
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:24px; padding:40px;
    transform:translateX(100%);
    transition:transform .35s cubic-bezier(0.4,0,0.2,1);
    z-index:100;
  }
  body.nav-open nav.site-nav{ transform:translateX(0) }

  nav.site-nav a{
    color:#fff; opacity:0; transform:translateY(20px);
    font-weight:600; font-size:18px; letter-spacing:.5px; transition:all .3s ease;
  }
  body.nav-open nav.site-nav a{ opacity:1; transform:translateY(0) }
  body.nav-open nav.site-nav a:nth-child(2){transition-delay:.05s}
  body.nav-open nav.site-nav a:nth-child(3){transition-delay:.1s}
  body.nav-open nav.site-nav a:nth-child(4){transition-delay:.15s}
  body.nav-open nav.site-nav a:nth-child(5){transition-delay:.2s}

  .nav-close{
    position:absolute; top:20px; right:20px; width:44px; height:44px;
    border-radius:50%;
    border:2px solid rgba(255,255,255,.1);
    background:rgba(255,255,255,.05);
    color:#fff; font-size:24px; line-height:1;
    z-index:101; display:none; place-items:center;
    cursor:pointer;
  }
  body.nav-open .nav-close{ display:grid; }

  body.nav-open{ overflow:hidden }
}

html, body { overscroll-behavior-y: contain; }

/* Desktop only: φέρ' τα πιο έξω στην μπάρα */
@media (min-width: 901px){
  header .bar{
    /* Μικρότερο side padding μόνο στο header */
    padding-left: 8px;
    padding-right: 8px;
    /* (έχει ήδη grid-template-columns: auto 1fr από πριν) */
  }

  /* προαιρετικά ένα τσακ ακόμα */
  header .brand{ margin-left: -90px; }     /* logo ελάχιστα πιο έξω */
  nav.site-nav{ margin-right: -90px; }     /* menu ελάχιστα πιο έξω */
}
