:root{
  --bg:#0f172a; --card:#111827; --muted:#94a3b8; --text:#e5e7eb;
  --brand:#00b3a4; --brand-2:#2dd4bf; --accent:#f59e0b;
}
*{box-sizing:border-box}
html,body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Cambria,sans-serif;background:var(--bg);color:var(--text);scroll-behavior:smooth}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{max-width:1100px;margin:0 auto;padding:0 20px}
header{position:sticky;top:0;z-index:50;background:rgba(15,23,42,.8);backdrop-filter:blur(8px);border-bottom:1px solid rgba(148,163,184,.2)}
.nav{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{display:flex;align-items:center;gap:.6rem;font-weight:700;letter-spacing:.2px}
.brand-logo{width:28px;height:28px;border-radius:8px;background:linear-gradient(135deg,var(--brand),var(--brand-2));display:inline-block}
.nav-links{display:flex;gap:1rem}
.nav-links a{padding:.5rem .8rem;border-radius:8px;color:var(--text);position:relative}
.nav-links a::after{content:"";position:absolute;left:.8rem;right:.8rem;bottom:.35rem;height:2px;background:linear-gradient(90deg,var(--brand),var(--brand-2));transform:scaleX(0);transform-origin:left;transition:transform .25s ease}
.nav-links a:hover::after{transform:scaleX(1)}
.menu-btn{display:none;border:1px solid rgba(148,163,184,.3);background:transparent;color:var(--text);padding:.45rem .6rem;border-radius:8px}
.hero{padding:80px 0;background:radial-gradient(1200px 600px at 10% -10%,rgba(45,212,191,.12),transparent),radial-gradient(900px 400px at 90% 0,rgba(245,158,11,.08),transparent)}
.hero h1{font-size:clamp(28px,5vw,48px);line-height:1.1;margin:0 0 14px}
.hero p{color:var(--muted);max-width:800px;font-size:18px}
.cta{margin-top:24px;display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.8rem 1rem;border-radius:10px;border:1px solid transparent;font-weight:600}
.btn-primary{background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#0b1219;transition:transform .2s ease}
.btn-primary:hover{transform:translateY(-1px)}
.btn-secondary{border-color:rgba(148,163,184,.35);color:var(--text)}
section{padding:64px 0;border-top:1px solid rgba(148,163,184,.18)}
.section-title{font-size:28px;margin:0 0 8px}
.section-sub{color:var(--muted);margin:0 0 24px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{background:var(--card);border:1px solid rgba(148,163,184,.18);padding:18px;border-radius:14px;transition:transform .25s ease, box-shadow .25s ease}
.card:hover{transform:translateY(-3px);box-shadow:0 12px 24px rgba(0,0,0,.25)}
.projects{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.project{background:var(--card);border:1px solid rgba(148,163,184,.18);border-radius:14px;overflow:hidden;transition:transform .25s ease}
.project:hover{transform:translateY(-3px)}
.project .thumb{height:160px;background:linear-gradient(135deg,#1f2937,#0b1220)}
.project .body{padding:14px}
.project h4{margin:0 0 6px}
.project span{color:var(--muted);font-size:14px}
.about{display:grid;grid-template-columns:1.2fr .8fr;gap:24px}
.about .box{background:var(--card);border:1px solid rgba(148,163,184,.18);padding:18px;border-radius:14px}
.about ul{margin:8px 0 0 18px}
form{display:grid;gap:12px;max-width:640px}
input, textarea{width:100%;padding:12px 14px;border-radius:10px;border:1px solid rgba(148,163,184,.3);background:#0b1220;color:var(--text)}
textarea{min-height:120px;resize:vertical}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
footer{padding:36px 0;border-top:1px solid rgba(148,163,184,.18);color:var(--muted)}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:18px}
.small{font-size:14px;color:var(--muted)}
/* Animations */ 
.fade-up{opacity:0;transform:translateY(16px);transition:opacity .6s ease, transform .6s ease}
.fade-up.show{opacity:1;transform:translateY(0)}
@keyframes softPulse{0%{box-shadow:0 0 0 0 rgba(45,212,191,.0)}70%{box-shadow:0 0 0 14px rgba(45,212,191,.12)}100%{box-shadow:0 0 0 0 rgba(45,212,191,.0)}}
.pulse{animation:softPulse 2.5s ease-in-out infinite}
@media (max-width: 920px){ .cards,.projects,.about,.footer-grid{grid-template-columns:1fr} }
@media (max-width: 720px){ .nav-links{display:none} .menu-btn{display:inline-flex} .mobile-menu{display:none;flex-direction:column;padding:10px 0} .mobile-menu a{padding:.6rem;border-radius:8px} .mobile-menu a:hover{background:rgba(148,163,184,.15)} }

/* ====== NAV mobil: slide-down + state handling (override) ====== */
/* implicit ascuns: folosim opacity + transform (nu display:none) ca să putem anima */
.primary-nav{
  display:block;                      /* override vechiul display:none */
  position:fixed; top:64px; left:0; right:0;
  background:rgba(15,23,42,.98);
  border-top:1px solid rgba(148,163,184,.2);
  padding:10px 0;
  opacity:0; transform:translateY(-12px);
  pointer-events:none;
  transition:transform .25s ease, opacity .25s ease;
  z-index:60;
}
.primary-nav .menu{
  list-style:none; margin:0; padding:0 20px;
  display:flex; flex-direction:column; gap:8px;
}
.primary-nav .menu a{ display:block; padding:.6rem .8rem; border-radius:8px; }
.primary-nav .menu a:hover{ background:rgba(148,163,184,.15); }

.primary-nav.open{
  opacity:1; transform:translateY(0);
  pointer-events:auto;
}

/* butonul hamburger pe mobil */
.menu-btn{
  display:inline-flex;
  border:1px solid rgba(148,163,184,.3);
  background:transparent; color:var(--text);
  padding:.45rem .6rem; border-radius:8px;
}

/* desktop ≥ 720px: meniu pe o linie, fără panou fix */
@media (min-width: 720px){
  .menu-btn{ display:none; }
  .primary-nav{
    position:static; padding:0; background:transparent;
    border-top:0; opacity:1; transform:none; pointer-events:auto;
  }
  .primary-nav .menu{
    flex-direction:row; gap:1rem; padding:0;
  }
  .primary-nav .menu a{
    padding:.5rem .8rem; position:relative;
  }
  .primary-nav .menu a::after{
    content:""; position:absolute; left:.8rem; right:.8rem; bottom:.35rem; height:2px;
    background:linear-gradient(90deg,var(--brand),var(--brand-2));
    transform:scaleX(0); transform-origin:left; transition:transform .25s ease;
  }
  .primary-nav .menu a:hover::after{ transform:scaleX(1); }
}

/* ====== Hover pe brand (logo + text) ====== */
.brand{
  transition: transform .18s ease, filter .18s ease;
  will-change: transform;
}
.brand:hover{ transform: scale(1.10); }
.brand-logo{ transition: transform .18s ease, box-shadow .18s ease; }
.brand:hover .brand-logo{
  box-shadow: 0 0 0 3px rgba(45,212,191,.18) inset;
}

/* Respectă preferința utilizatorilor care reduc animațiile */
@media (prefers-reduced-motion: reduce){
  .primary-nav{ transition: none; }
  .primary-nav .menu a::after{ transition: none; }
  .brand, .brand-logo{ transition: none; }
}

/* Container mai lat și cu margini mai mici */
.container{
  max-width: 1600px;   /* crește zona centrală */
  margin: 0 auto;
  padding: 0 22px;     /* ~22px de la margine stânga/dreapta */
}

/* Header: spațiere echilibrată între logo și meniu */
.nav{
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 64px;
}

/* Footer: aplicăm aceleași margini laterale */
.footer-grid{
  max-width: 1600px;
  margin: 0 auto;
  padding: 0 22px;
  display: flex;                 /* schimbă din default în flex */
  justify-content: space-between;/* împinge elementele la stânga și dreapta */
  align-items: center;
}


/* ====== Program & Status LIVE ====== */
.hours-card{
  background: var(--card);
  border:1px solid rgba(148,163,184,.18);
  border-radius:14px;
  padding:18px;
}
.hours-row{
  display:grid;
  grid-template-columns: 1fr auto auto;
  gap:14px;
  align-items:center;
  margin-bottom:10px;
}
.status-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  border:1px solid rgba(148,163,184,.25);
  padding:8px 12px;
  border-radius:999px;
  font-weight:600;
}
.status-badge .dot{
  width:10px; height:10px; border-radius:50%;
  background:#999; box-shadow:0 0 0 0 rgba(0,0,0,.15);
  animation: softPulse 2.5s ease-in-out infinite;
}
.status-badge.open{ border-color: rgba(16,185,129,.35); }
.status-badge.open .dot{ background:#10b981; }
.status-badge.open .text{ color:#10b981; }

.status-badge.closed{ border-color: rgba(239,68,68,.35); }
.status-badge.closed .dot{ background:#ef4444; }
.status-badge.closed .text{ color:#ef4444; }

.now, .today-hours{ color:var(--muted); }
.next-change{
  margin:6px 0 14px;
  color:var(--muted);
  font-size:14px;
}

/* grilă cu programul săptămânal */
.hours-grid{
  display:grid;
  grid-template-columns: 1fr auto;
  gap:8px 16px;
  padding-top:8px;
  border-top:1px dashed rgba(148,163,184,.25);
}
.hours-grid .day{ color:var(--text); }
.hours-grid .range{ color:var(--muted); }
.hours-grid .today{
  font-weight:700;
  color: var(--accent);
}
@media (max-width: 720px){
  .hours-row{
    grid-template-columns:1fr;
    gap:10px;
    align-items:flex-start;
  }
}

/* 1) Mărește textul logo-ului */
.brand span{
  font-size: 1.45rem;          /* ajustează 1.35–1.6 după gust */
  line-height: 1;              /* ca să nu “sară” vertical */
}

/* 2) Mărește linkurile din meniu (desktop + mobil) */
.nav-links a,                  /* pentru paginile cu .nav-links */
.primary-nav .menu a{          /* pentru index.html */
  font-size: 1.15rem;          /* ajustează 1.1–1.25 */
}

/* 3) (opțional) dacă ai crescut mult fontul, dă un pic mai mult loc header‑ului */
.nav{
  height: 72px;                /* de la 64px -> 72px (sau 76px) */
}

/* 4) (opțional) păstrează proporțiile logo-ului */
.brand-logo{
  width: 32px;                 /* de la 28px */
  height: 32px;
}

/* 6) (recomandat) pe telefoane, menține mărimea normală ca să nu rupă layout-ul */
@media (max-width: 720px){
  .brand span{ font-size: 1.2rem; }
  .nav-links a,
  .primary-nav .menu a{ font-size: 1rem; }
  .nav{ height: 64px; }        /* revine la înălțimea inițială pe mobil */
}