:root {
  --card-bg: rgba(255,255,255,.6);
  --card-border: rgba(15,23,42,.08);
  --card-radius: 1rem;
  --card-shadow: 0 30px 80px rgba(15,23,42,.12);

  --input-bg: rgba(255,255,255,.8);
  --input-border: rgba(15,23,42,.12);
  --input-radius: .5rem;

  --text-main: #0f172a;
  --text-dim: #64748b;

  --cta-bg-from: #0f172a;
  --cta-bg-to: #1e293b;

  --secondary-bg: rgba(15,23,42,.02);
  --secondary-border: rgba(15,23,42,.12);

  --idle-shine-from: rgba(255,255,255,.4);
  --idle-shine-to: rgba(255,255,255,0);

  --btn-radius: .75rem;
  --btn-shadow: 0 24px 48px rgba(15,23,42,.22);
}

html,
body {
  height: 100%;
}

/* ===== background global ===== */
.bg-auth-grid {
  background-image:
    radial-gradient(circle at 20% 20%, rgba(15,23,42,.07) 0px, transparent 60%),
    radial-gradient(circle at 80% 0%, rgba(15,23,42,.04) 0px, transparent 60%),
    linear-gradient(to bottom right,#fff,#f8fafc 60%);
  background-size: 300px 300px, 300px 300px, auto;
  background-repeat: no-repeat;
  background-color:#fff;
  position:relative;
}

/* pe mobil vrem alb curat, fără banding */
@media (max-width:1023px){
  .bg-auth-grid{
    background:none !important;
    background-color:#fff !important;
  }
}

/* ===== coloana stânga desktop ===== */
.auth-side{
  width:360px;
  background:radial-gradient(circle at 20% 20%,rgba(255,255,255,.9) 0%,rgba(255,255,255,.4) 60%);
  border-right:1px solid rgba(15,23,42,.06);
  color:var(--text-main);
  position:relative;
  overflow:hidden;
}
.auth-side-inner{
  position:relative;
  z-index:2;
}
.auth-side::after{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 0% 100%,rgba(15,23,42,.07) 0%,transparent 70%);
  mix-blend-mode:multiply;
  pointer-events:none;
  opacity:.4;
}

/* ===== card login ===== */
.auth-card{
  background:var(--card-bg);
  -webkit-backdrop-filter:blur(16px) saturate(1.2);
  backdrop-filter:blur(16px) saturate(1.2);
  border-radius:var(--card-radius);
  border:1px solid var(--card-border);
  box-shadow:var(--card-shadow);
  padding:1.5rem 1.5rem 2rem;
  color:var(--text-main);
  position:relative;
  isolation:isolate;
}
@media (min-width:640px){
  .auth-card{
    padding:2rem 2rem 2.25rem;
  }
}
@media (max-width:1023px){
  .auth-card{
    background:#fff !important;
    -webkit-backdrop-filter:none !important;
    backdrop-filter:none !important;
    box-shadow:0 30px 80px rgba(15,23,42,.12);
    border:1px solid rgba(15,23,42,.08);
  }
}

/* ===== form fields ===== */
.form-field .input-wrap{
  display:flex;
  align-items:center;
  gap:.5rem;
  background:var(--input-bg);
  border-radius:var(--input-radius);
  border:1px solid var(--input-border);
  padding:.75rem .75rem;
  position:relative;
  box-shadow:0 2px 4px rgba(15,23,42,.04);
}

/* icon stânga (mail / lock) */
.input-ico{
  flex-shrink:0;
  width:16px;
  height:16px;
  color:var(--text-dim);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:0;
}

/* câmp efectiv */
.input-ctrl{
  appearance:none;
  border:0;
  background:transparent;
  width:100%;
  min-width:0;
  font-size:.9rem;
  font-weight:600;
  line-height:1.4;
  color:var(--text-main);

  outline:none;
  box-shadow:none;
  border-radius:0 !important;
  overflow:visible;
  background-clip:padding-box;
  -webkit-background-clip:padding-box;
}
.input-ctrl::placeholder{
  color:rgba(100,116,139,.6);
  font-weight:500;
}

/* fără highlight albastru & fără ring la focus */
.input-ctrl,
.input-ctrl:focus,
.input-ctrl:focus-visible,
.input-ctrl:active{
  outline:none !important;
  box-shadow:none !important;
  border:0 !important;
}

/* wrapper când e focusat: păstrăm look curat */
.input-wrap:focus-within{
  box-shadow:none !important;
  border-color:var(--input-border) !important;
  background:#fff !important;
  border-radius:var(--input-radius);
  overflow:visible;
}

/* ===== buton toggle parola (ochi clean feather) ===== */
.eye-btn{
  position:absolute;
  right:.6rem;
  top:50%;
  transform:translateY(-50%);
  background:transparent;
  border:0;
  padding:.3rem;
  border-radius:.5rem;
  cursor:pointer;
  line-height:0;
  color:var(--text-dim);

  outline:none;
  box-shadow:none;
  -webkit-tap-highlight-color:transparent;

  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:24px;
  min-height:24px;
}
.eye-btn,
.eye-btn:focus,
.eye-btn:focus-visible,
.eye-btn:active{
  outline:none !important;
  box-shadow:none !important;
  border:0 !important;
}

/* icon-urile feather interior (eye / eye-off) */
.eye-ico{
  width:16px;
  height:16px;
  line-height:0;
  display:block;
  color:var(--text-dim);
  stroke:currentColor;
  transition:opacity .18s ease;
}
.eye-ico.hidden-eye{
  opacity:0;
  pointer-events:none;
  position:absolute;
}
.eye-btn.showing .eye-ico.eye-open{
  opacity:0;
  pointer-events:none;
  position:absolute;
}
.eye-btn.showing .eye-ico.eye-closed{
  opacity:1;
  position:static;
  pointer-events:auto;
}

/* ===== remember me checkbox (redesign clean) ===== */
.remember-box{
  /* ascundem look-ul browserului și desenăm al nostru */
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;

  cursor:pointer;
  flex-shrink:0;

  width:16px;
  height:16px;

  border-radius:.4rem;
  border:1px solid rgba(15,23,42,.22);
  background:#fff;

  box-shadow:
    0 1px 2px rgba(15,23,42,.08),
    inset 0 0 0 1px rgba(255,255,255,.6);

  display:inline-block;
  position:relative;

  transition:
    background-color .15s ease,
    border-color .15s ease,
    box-shadow .15s ease;
  outline:0;
  line-height:0;
}

/* mic efect la tap/focus mobil fără halo albastru urât */
.remember-box:focus-visible{
  outline:0;
  box-shadow:
    0 0 0 3px rgba(15,23,42,.08),
    0 1px 2px rgba(15,23,42,.08),
    inset 0 0 0 1px rgba(255,255,255,.6);
}

/* starea bifat */
.remember-box:checked{
  background:#0f172a;
  border-color:#0f172a;
  box-shadow:
    0 4px 10px rgba(15,23,42,.4),
    inset 0 0 0 1px rgba(255,255,255,.2);
}

/* desenăm bifa manual, centrată, cu animație */
.remember-box::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:8px;
  height:5px;

  border-bottom:2px solid #fff;
  border-left:2px solid #fff;
  border-radius:1px;

  transform-origin:center;
  transform:translate(-50%,-60%) rotate(-45deg) scale(0);
  transition:transform .15s cubic-bezier(.4,0,.2,1);
}
.remember-box:checked::after{
  transform:translate(-50%,-60%) rotate(-45deg) scale(1);
}

/* ===== primary CTA button ===== */
.btn-cta{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:3rem;
  border-radius:var(--btn-radius);
  border:0;
  padding:.75rem 1rem;
  width:auto;
  background:transparent;
  text-decoration:none;
  cursor:pointer;
  font-weight:800;
  line-height:1.2;
  color:#fff;
  box-shadow:var(--btn-shadow);
  overflow:hidden;
  isolation:isolate;
  -webkit-tap-highlight-color:transparent;
}
.btn-cta-inner{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  font-size:.9rem;
  font-weight:800;
}
.btn-cta-bg{
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:
    radial-gradient(circle at 20% 20%,rgba(255,255,255,.18) 0%,rgba(255,255,255,0) 70%),
    linear-gradient(90deg,var(--cta-bg-from) 0%,var(--cta-bg-to) 100%);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.18),
    0 30px 60px rgba(15,23,42,.6);
  z-index:1;
  overflow:hidden;
}
.btn-cta:hover .btn-cta-bg{
  filter:brightness(1.08);
}
.btn-cta:active{
  transform:scale(.98);
}

/* shimmer layer animat */
.idle-glow{
  position:absolute;
  inset:0;
  pointer-events:none;
}
.idle-glow::after{
  content:"";
  position:absolute;
  top:0;
  left:-150%;
  width:150%;
  height:100%;
  background:linear-gradient(
    110deg,
    var(--idle-shine-to) 0%,
    var(--idle-shine-from) 50%,
    var(--idle-shine-to) 100%
  );
  opacity:.4;
  mix-blend-mode:screen;
  animation:idleSlide 4s linear infinite;
  border-radius:inherit;
}

/* ===== secondary buttons (Creează cont / Am uitat parola) ===== */
.btn-secondary{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:2.75rem;
  border-radius:var(--btn-radius);
  font-weight:800;
  line-height:1.2;
  padding:.7rem 1rem;
  text-decoration:none;
  overflow:hidden;
  isolation:isolate;
  -webkit-tap-highlight-color:transparent;
  color:var(--text-main);
  background:var(--secondary-bg);
  border:1px solid var(--secondary-border);
  font-size:.8rem;
  box-shadow:
    0 16px 32px rgba(15,23,42,.08),
    inset 0 0 0 1px rgba(255,255,255,.4);
}
.btn-secondary:hover{
  background:rgba(15,23,42,.05);
}
.btn-secondary:active{
  transform:scale(.98);
}
.btn-secondary-bg{
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
}
.btn-secondary-bg::after{
  content:"";
  position:absolute;
  top:0;
  left:-150%;
  width:150%;
  height:100%;
  background:linear-gradient(
    110deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.6) 50%,
    rgba(255,255,255,0) 100%
  );
  opacity:.4;
  mix-blend-mode:screen;
  animation:idleSlide 4s linear infinite;
  border-radius:inherit;
}

/* ===== ripple efect pe click ===== */
.ripple{
  position:absolute;
  width:180px;
  height:180px;
  margin-left:-90px;
  margin-top:-90px;
  border-radius:50%;
  pointer-events:none;
  background:radial-gradient(circle,rgba(255,255,255,.6) 0%, rgba(255,255,255,0) 60%);
  animation:ripple .5s ease-out;
  opacity:.75;
  z-index:3;
}
@keyframes ripple{
  0%{ transform:scale(.2); opacity:.75; }
  100%{ transform:scale(1); opacity:0; }
}

/* shimmer anim */
@keyframes idleSlide{
  0%{ left:-150%; }
  100%{ left:100%; }
}

/* ===== text selection în input ===== */
.input-ctrl::selection{
  background:rgba(59,130,246,.25);
  color:#0f172a;
}
.input-ctrl::-moz-selection{
  background:rgba(59,130,246,.25);
  color:#0f172a;
}

/* ===== autofill fix ===== */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active,
input:-webkit-autofill:focus-visible {
  -webkit-box-shadow:0 0 0 1000px #ffffff inset !important;
          box-shadow:0 0 0 1000px #ffffff inset !important;
  -webkit-text-fill-color:#0f172a !important;
  color:#0f172a !important;
  caret-color:#0f172a !important;
  filter:none !important;
  background-color:#ffffff !important;
  background-image:none !important;
  border-radius:0 !important;
  background-clip:padding-box !important;
  -webkit-background-clip:padding-box !important;
  overflow:visible !important;
}
input:-webkit-autofill::first-line{
  -webkit-text-fill-color:#0f172a !important;
  color:#0f172a !important;
}
.input-wrap:focus-within input:-webkit-autofill,
.input-wrap:focus-within input:-webkit-autofill:hover,
.input-wrap:focus-within input:-webkit-autofill:focus,
.input-wrap:focus-within input:-webkit-autofill:active,
.input-wrap:focus-within input:-webkit-autofill:focus-visible {
  -webkit-box-shadow:0 0 0 1000px #ffffff inset !important;
          box-shadow:0 0 0 1000px #ffffff inset !important;
  -webkit-text-fill-color:#0f172a !important;
  color:#0f172a !important;
  caret-color:#0f172a !important;
  background-color:#ffffff !important;
  background-image:none !important;
  border-radius:0 !important;
  background-clip:padding-box !important;
  -webkit-background-clip:padding-box !important;
  overflow:visible !important;
}

/* ===== responsive fine-tuning ===== */
@media (max-width:380px){
  .auth-card{
    padding:1rem 1rem 1.5rem;
  }
  .btn-cta-inner{
    font-size:.8rem;
  }
  .btn-secondary{
    font-size:.75rem;
    min-height:2.5rem;
  }
}

@media (min-width:1024px){
  main{
    background:radial-gradient(circle at 80% 20%,rgba(15,23,42,.12) 0%,rgba(15,23,42,0) 70%);
  }
}

@media (min-width:1024px){
  .no-radial-bg{
    background: none !important;
  }
}


/* =========== LANDING (index.php) =========== */

/* NAV bar sticky glass */
.landing-nav{
  position:fixed;
  top:0;left:0;right:0;
  z-index:40;
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:rgba(255,255,255,.7);
  -webkit-backdrop-filter:saturate(1.2) blur(12px);
  backdrop-filter:saturate(1.2) blur(12px);
  border-bottom:1px solid rgba(15,23,42,.06);
  box-shadow:0 30px 80px rgba(15,23,42,.07);
  height:64px;
  padding:0 .75rem;
}
@media(min-width:640px){
  .landing-nav{
    height:72px;
    padding:0 2rem;
  }
}

/* ===== BRAND în navbar ===== */
.brand-chip{
  display:flex;
  align-items:center;
  gap:.5rem;
  text-decoration:none;
  line-height:1.2;
  color:#0f172a;
}

.brand-chip-icon{
  width:44px;
  height:44px;
  border-radius:.75rem;
  background:#fff;
  border:1px solid rgba(15,23,42,.12);
  box-shadow:0 24px 48px rgba(15,23,42,.1);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.brand-chip-icon img{
  max-width:32px;
  max-height:32px;
  object-fit:contain;
  display:block;
}
@media(min-width:640px){
  .brand-chip-icon{
    width:48px;
    height:48px;
    border-radius:.9rem;
  }
}

.brand-chip-label{
  display:flex;
  flex-direction:column;
  line-height:1.2;
}
.brand-chip-top{
  font-size:.6rem;
  line-height:1.2;
  font-weight:600;
  color:rgb(100,116,139);
  text-transform:uppercase;
  letter-spacing:.05em;
  display:none;
}
.brand-chip-name{
  font-size:.7rem;
  font-weight:700;
  color:#0f172a;
}
@media(min-width:640px){
  .brand-chip-top{
    display:block;
  }
  .brand-chip-name{
    font-size:.8rem;
  }
}

/* ===== NAV links dreapta ===== */
/* ascuns complet pe mobil -> apare doar >=640px */
.nav-links{
  display:none;
}
@media(min-width:640px){
  .nav-links{
    display:flex;
    align-items:center;
    gap:.75rem;
    font-size:.8rem;
    font-weight:600;
    line-height:1.2;
    color:#0f172a;
  }
}

/* generic nav pill */
.nav-a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:.6rem;
  line-height:1.2;
  padding:.5rem .75rem;
  border:1px solid rgba(15,23,42,.12);
  background:rgba(255,255,255,.6);
  box-shadow:
    0 10px 24px rgba(15,23,42,.07),
    inset 0 0 0 1px rgba(255,255,255,.4);
  text-decoration:none;
  color:#0f172a;
  font-weight:700;
}
.nav-a:hover{
  background:rgba(15,23,42,.03);
}

/* înregistrare pill rămâne light (nav-a clasic) */

/* autentificare pill (dark) */
.nav-login{
  background:linear-gradient(90deg,#0f172a 0%,#1e293b 100%);
  color:#fff !important;
  border:0;
  box-shadow:
    0 24px 48px rgba(15,23,42,.22),
    0 30px 60px rgba(15,23,42,.6);
  position:relative;
  overflow:hidden;
  isolation:isolate;
  padding:.5rem .75rem;
  line-height:1.2;
}
.nav-login .idle-glow::after{
  animation-duration:4s;
}
.nav-login-label{
  position:relative;
  z-index:2;
  text-decoration:none;
  color:#fff !important;
  font-weight:800;
  font-size:.8rem;
  line-height:1.2;
  white-space:nowrap;
}

/* ===== HERO wrapper ===== */
.hero-wrap{
  position:relative;
  background-color:#fff;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}
.hero-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(
    to bottom right,
    rgba(255,255,255,.92) 0%,
    rgba(255,255,255,.88) 40%,
    rgba(255,255,255,.92) 100%
  );
}

/* eyebrow chip deasupra headline */
.hero-eyebrow{
  display:inline-flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.5rem;
  font-size:.6rem;
  font-weight:600;
  line-height:1.2;
  text-transform:uppercase;
  letter-spacing:.05em;
  color:#475569;
}
.hero-eyebrow-chip{
  border-radius:.5rem;
  background:#fff;
  border:1px solid rgba(15,23,42,.12);
  box-shadow:0 10px 24px rgba(15,23,42,.07), inset 0 0 0 1px rgba(255,255,255,.4);
  padding:.4rem .5rem;
  line-height:1.2;
  font-weight:700;
  color:#0f172a;
  font-size:.6rem;
}

/* headline nou */
.hero-headline{
  font-weight:800;
  color:#0f172a;
  line-height:1.15;
  letter-spacing:-.03em;
  font-size:1.5rem;
}
@media(min-width:640px){
  .hero-headline{
    font-size:2rem;
  }
}
@media(min-width:768px){
  .hero-headline{
    font-size:2.5rem;
  }
}
@media(min-width:1280px){
  .hero-headline{
    font-size:2.75rem;
  }
}

/* subheadline / descriere */
.hero-desc{
  font-size:.95rem;
  line-height:1.5;
  font-weight:500;
  color:#475569;
  max-width:50ch;
}
@media(min-width:640px){
  .hero-desc{
    font-size:1rem;
    line-height:1.55;
  }
}

/* ===== CTA block pe mobil ===== */
.cta-mobile-card{
  background:#fff;
  border-radius:1rem;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:
    0 30px 80px rgba(15,23,42,.14),
    0 0 40px rgba(15,23,42,.04);
  padding:.75rem;
  display:flex;
  flex-direction:column;
  gap:.5rem;
}
@media(min-width:640px){
  .cta-mobile-card{
    display:none;
  }
}

.cta-mobile-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  min-height:3rem;
  border-radius:.75rem;
  font-size:.9rem;
  font-weight:800;
  line-height:1.2;
  border:1px solid transparent;
  box-shadow:0 24px 48px rgba(15,23,42,.08);
  text-align:center;
  -webkit-tap-highlight-color:transparent;
}
.cta-mobile-btn-primary{
  background:linear-gradient(90deg,#0f172a 0%,#1e293b 100%);
  color:#fff;
  box-shadow:
    0 24px 48px rgba(15,23,42,.22),
    0 30px 60px rgba(15,23,42,.6);
}
.cta-mobile-btn-secondary{
  background:#fff;
  color:#0f172a;
  border:1px solid rgba(15,23,42,.12);
  box-shadow:
    0 16px 32px rgba(15,23,42,.08),
    inset 0 0 0 1px rgba(255,255,255,.4);
  font-weight:700;
  font-size:.85rem;
}

/* zona suport/contact sub butoane (mobil) */
.cta-support{
  border-top:1px solid rgba(15,23,42,.07);
  padding-top:.75rem;
  margin-top:.25rem;
  text-align:center;
}
.cta-support-text{
  font-size:.7rem;
  line-height:1.4;
  font-weight:600;
  color:#475569;
}
.cta-support-link{
  color:#0f172a;
  font-weight:700;
  text-decoration:underline;
  text-underline-offset:2px;
  font-size:.7rem;
}

/* ===== CTA desktop ===== */
.cta-row-desktop{
  display:none;
}
@media(min-width:640px){
  .cta-row-desktop{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:.75rem;
  }

  .cta-row-desktop-inner{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:.75rem;
  }

  .cta-row-desktop-support{
    flex-basis:100%;
    border-top:1px solid rgba(15,23,42,.07);
    padding-top:.75rem;
    margin-top:.25rem;
    font-size:.7rem;
    line-height:1.4;
    font-weight:600;
    color:#475569;
  }
  .cta-row-desktop-support a{
    color:#0f172a;
    font-weight:700;
    text-decoration:underline;
    text-underline-offset:2px;
    font-size:.7rem;
  }
}

/* ===== feature-card ===== */
.feature-card{
  background:#fff;
  border-radius:1rem;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 30px 80px rgba(15,23,42,.07);
  padding:1rem 1rem 1.25rem;
}
@media(min-width:640px){
  .feature-card{
    padding:1.25rem 1.25rem 1.5rem;
  }
}

/* ===== cookie-card ===== */
.cookie-card{
  background:#fff;
  border-radius:1rem;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 30px 80px rgba(15,23,42,.14);
}


/* ===== NAV links dreapta ===== */
.nav-links{
  display:flex;
  align-items:center;
  gap:.5rem;
  font-size:.7rem;
  font-weight:600;
  line-height:1.2;
  color:#0f172a;
}
@media(min-width:640px){
  .nav-links{
    gap:.75rem;
    font-size:.8rem;
  }
}

/* fiecare link din nav */
.nav-a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:.6rem;
  line-height:1.2;
  padding:.5rem .75rem;
  border:1px solid rgba(15,23,42,.12);
  background:rgba(255,255,255,.6);
  box-shadow:
    0 10px 24px rgba(15,23,42,.07),
    inset 0 0 0 1px rgba(255,255,255,.4);
  text-decoration:none;
  color:#0f172a;
  font-weight:700;
}
.nav-a:hover{
  background:rgba(15,23,42,.03);
}

/* buton login în nav (dark pill) */
.nav-login{
  background:linear-gradient(90deg,#0f172a 0%,#1e293b 100%);
  color:#fff !important;
  border:0;
  box-shadow:
    0 24px 48px rgba(15,23,42,.22),
    0 30px 60px rgba(15,23,42,.6);
  position:relative;
  overflow:hidden;
  isolation:isolate;
  padding:.5rem .75rem;
  line-height:1.2;
}
.nav-login .idle-glow::after{
  animation-duration:4s;
}
.nav-login-label{
  position:relative;
  z-index:2;
  text-decoration:none;
  color:#fff !important;
  font-weight:800;
  font-size:.7rem;
  line-height:1.2;
  white-space:nowrap;
}
@media(min-width:640px){
  .nav-login-label{
    font-size:.8rem;
  }
}

/* ascundem butoanele extra ("Contact", "Înregistrare") pe mobil pentru a nu înghesui top bar */
.nav-extra{
  display:none;
}
@media(min-width:640px){
  .nav-extra{
    display:inline-flex;
  }
}

/* ===== HERO wrapper (background + overlay gradient alb lăptos) ===== */
.hero-wrap{
  position:relative;
  background-color:#fff;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}
.hero-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(
    to bottom right,
    rgba(255,255,255,.92) 0%,
    rgba(255,255,255,.88) 40%,
    rgba(255,255,255,.92) 100%
  );
}

/* mini brand info din hero */
.hero-brand-logo{
  height:48px;
  width:48px;
  border-radius:.75rem;
  background:#fff;
  border:1px solid rgba(15,23,42,.12);
  box-shadow:0 20px 40px rgba(15,23,42,.1);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.hero-brand-logo img{
  max-height:32px;
  max-width:32px;
  object-fit:contain;
  display:block;
}
@media(min-width:640px){
  .hero-brand-logo{
    height:48px;
    width:48px;
    border-radius:.9rem;
  }
}

.hero-brand-meta-top{
  font-size:.6rem;
  line-height:1.2;
  font-weight:600;
  color:rgb(100,116,139);
  text-transform:uppercase;
  letter-spacing:.05em;
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
}
.hero-brand-meta-name{
  font-size:.8rem;
  font-weight:700;
  color:#0f172a;
  line-height:1.2;
}

/* ===== CTA block pe mobil ===== */
.cta-mobile-card{
  background:#fff;
  border-radius:1rem;
  border:1px solid rgba(15,23,42,.08);
  /* drop shadow soft + ambient glow */
  box-shadow:
    0 30px 80px rgba(15,23,42,.14),
    0 0 40px rgba(15,23,42,.04);
  padding:.75rem;
  display:flex;
  flex-direction:column;
  gap:.5rem;
}
@media(min-width:640px){
  .cta-mobile-card{
    display:none;
  }
}

/* butoane din card mobil */
.cta-mobile-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  min-height:3rem;
  border-radius:.75rem;
  font-size:.9rem;
  font-weight:800;
  line-height:1.2;
  border:1px solid transparent;
  box-shadow:0 24px 48px rgba(15,23,42,.08);
  text-align:center;
  -webkit-tap-highlight-color:transparent;
}
.cta-mobile-btn-primary{
  background:linear-gradient(90deg,#0f172a 0%,#1e293b 100%);
  color:#fff;
  box-shadow:
    0 24px 48px rgba(15,23,42,.22),
    0 30px 60px rgba(15,23,42,.6);
}
.cta-mobile-btn-secondary{
  background:#fff;
  color:#0f172a;
  border:1px solid rgba(15,23,42,.12);
  box-shadow:
    0 16px 32px rgba(15,23,42,.08),
    inset 0 0 0 1px rgba(255,255,255,.4);
  font-weight:700;
  font-size:.85rem;
}

/* ===== CTA row desktop (ascuns pe mobil) ===== */
.cta-row-desktop{
  display:none;
}
@media(min-width:640px){
  .cta-row-desktop{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:.75rem;
  }
}

/* ===== feature-card (cards din zona de avantaje) ===== */
.feature-card{
  background:#fff;
  border-radius:1rem;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 30px 80px rgba(15,23,42,.07);
  padding:1rem 1rem 1.25rem;
}
@media(min-width:640px){
  .feature-card{
    padding:1.25rem 1.25rem 1.5rem;
  }
}

/* ===== cookie-card ===== */
.cookie-card{
  background:#fff;
  border-radius:1rem;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 30px 80px rgba(15,23,42,.14);
}

/* ===================== CONTACT PAGE ===================== */

.bg-contact-page{
  min-height:100vh;
  background:
    radial-gradient(circle at 80% 0%, rgba(15,23,42,.04) 0px, transparent 60%),
    linear-gradient(to bottom right,#ffffff 0%,#f8fafc 80%);
  background-repeat:no-repeat;
  background-size:800px 800px, auto;
  background-color:#fff;
}

/* card mare */
.contact-shell{
  background:#fff;
  border-radius:1rem;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 30px 80px rgba(15,23,42,.12);
  position:relative;
  isolation:isolate;
  width:100%;
  max-width:1100px;
}
@media(min-width:1280px){ .contact-shell{ max-width:1200px; } }

/* head row */
.contact-header-row{
  background:
    radial-gradient(1200px 350px at 60% -20%, rgba(15,23,42,.06) 0%, transparent 60%),
    linear-gradient(180deg, #ffffff 0%, #ffffff 100%);
  border-top-left-radius:1rem;
  border-top-right-radius:1rem;
}

/* back link */
.back-home-btn{
  display:inline-flex; align-items:center; gap:.5rem;
  font-weight:800; font-size:.85rem; color:#0f172a; text-decoration:none;
  padding:.5rem .75rem; border-radius:.75rem; background:rgba(15,23,42,.03);
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 10px 24px rgba(15,23,42,.06), inset 0 0 0 1px rgba(255,255,255,.5);
}
.back-home-btn:hover{ background:rgba(15,23,42,.05); }

/* etichete + help */
.label{ display:block; font-weight:800; font-size:.8rem; color:#0f172a; }
.help{ font-size:.8rem; color:#64748b; }

/* textarea mai înaltă în mod implicit pe desktop */
@media(min-width:1024px){ .contact-textarea{ min-height:12rem; } }

/* alerte */
.alert-success,.alert-error{
  display:flex; gap:.5rem; align-items:flex-start;
  border-radius:.75rem; padding:.75rem .9rem; font-weight:700;
}
.alert-success{
  background:linear-gradient(0deg,#ecfdf5,#ecfdf5);
  border:1px solid #a7f3d0; color:#065f46;
  box-shadow:0 20px 60px rgba(5,150,105,.1);
}
.alert-error{
  background:linear-gradient(0deg,#fef2f2,#fef2f2);
  border:1px solid #fecaca; color:#7f1d1d;
  box-shadow:0 20px 60px rgba(185,28,28,.08);
}

/* coloana de suport */
.support-card{
  background:#fff; border-radius:1rem;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 30px 80px rgba(15,23,42,.06);
  padding:1rem 1rem 1.25rem;
  position:sticky; top:1rem;
}
.support-item{
  display:flex; gap:.75rem; align-items:flex-start;
  padding:.5rem 0; border-bottom:1px dashed rgba(15,23,42,.08);
}
.support-item:last-child{ border-bottom:0; }
.support-title{ font-weight:900; color:#0f172a; }
.support-link{
  color:#0f172a; text-decoration:underline; text-underline-offset:2px;
  font-weight:800; word-break:break-all;
}
.support-text{ color:#475569; font-weight:600; font-size:.85rem; }
.support-divider{ height:1px; background:rgba(15,23,42,.08); margin:.75rem 0; }
.support-note{ display:flex; gap:.5rem; align-items:flex-start; font-size:.85rem; color:#475569; }

/* sub CTA */
.terms{
  margin-top:.6rem; font-size:.8rem; color:#64748b; font-weight:600;
}
.terms a{ color:#0f172a; font-weight:800; text-decoration:underline; text-underline-offset:2px; }

/* păstrează identitatea vizuală cu card glass form (deja definit) */

/* ===================== CONTACT — refine layout/spacing ===================== */
.contact-shell{
  width:100%;
  max-width:1160px;               /* mai strâns decât 1200 pentru ca ochiul să “lege” coloanele */
  border-radius:16px;
  border:1px solid rgba(15,23,42,.08);
  background:#fff;
  box-shadow:0 30px 80px rgba(15,23,42,.12);
}
@media(min-width:1400px){ .contact-shell{ max-width:1180px; } }

/* header subtil cu gradient */
.contact-header-row{
  background:
    radial-gradient(1200px 350px at 60% -20%, rgba(15,23,42,.06) 0%, transparent 60%),
    linear-gradient(180deg, #ffffff 0%, #ffffff 100%);
  border-top-left-radius:16px;
  border-top-right-radius:16px;
}

/* card formular (folosește stilul existent .auth-card) – doar margini perfect egale */
.auth-card{ padding:18px; border-radius:14px; }
@media(min-width:768px){ .auth-card{ padding:22px; } }
@media(min-width:1024px){ .auth-card{ padding:24px; } }

.label{ display:block; font-weight:800; font-size:.82rem; color:#0f172a; }
.help{ font-size:.82rem; color:#64748b; }

/* alerts */
.alert-success,.alert-error{
  display:flex; gap:.55rem; align-items:flex-start;
  border-radius:12px; padding:.75rem .9rem; font-weight:700;
}
.alert-success{ background:#ecfdf5; border:1px solid #a7f3d0; color:#065f46; }
.alert-error{ background:#fef2f2; border:1px solid #fecaca; color:#7f1d1d; }

/* suport card, sticky discret, arie vizuală egală cu form */
.support-card{
  position:sticky; top:12px;
  background:#fff; border-radius:14px;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 18px 60px rgba(15,23,42,.06);
  padding:14px 14px 16px;
}
.support-item{
  display:flex; gap:.75rem; align-items:flex-start;
  padding:.6rem 0; border-bottom:1px dashed rgba(15,23,42,.09);
}
.support-item:last-child{ border-bottom:0; }
.support-title{ font-weight:900; color:#0f172a; }
.support-link{ color:#0f172a; font-weight:800; text-decoration:underline; text-underline-offset:2px; }
.support-text{ color:#475569; font-weight:600; font-size:.86rem; }
.support-divider{ height:1px; background:rgba(15,23,42,.08); margin:.75rem 0; }
.support-note{ display:flex; gap:.5rem; align-items:flex-start; font-size:.86rem; color:#475569; }

/* sub CTA */
.terms{ font-size:.82rem; color:#64748b; font-weight:600; }

/* input/textarea albe, pentru iOS */
.contact-input,.contact-textarea{
  background:#fff !important; color:#0f172a !important;
  box-shadow: inset 0 0 0 1px rgba(15,23,42,.08), 0 10px 24px rgba(2,6,23,.05);
}

/* mic tweak la btn-cta pentru încadrere pe mobil */
.btn-cta{ border-radius:12px; padding:.78rem 1.05rem; }

/* === profile page additions === */

/* Carduri din profil (Date profil / Schimbă parola / Apartamente asociate / Notificări push)
   - același stil soft-card ca în dashboard, dar:
   - overflow:hidden ca să NU mai iasă glow-ul din colțurile rotunjite */
.profile-card {
  position: relative;
  background: #ffffff;
  border-radius: 0.75rem; /* rounded-xl */
  border: 1px solid rgba(15,23,42,.08);
  overflow: hidden;

  /* umbră mai mică și mai puțin opacă decât versiunea veche */
  box-shadow:
    0 16px 32px rgba(15,23,42,.04),
    0 4px 8px rgba(15,23,42,.03);
}

/* Titlurile din card */
.card-title {
  font-size: 1rem;
  font-weight: 700;
  color: #0f172a; /* slate-900 */
  line-height: 1.3;
}

/* Label mic pentru câmpuri */
.pro-label {
  font-size: .8rem;
  font-weight: 600;
  color: #0f172a;
  line-height: 1.3;
}

/* câmp readonly (Email) */
.pro-readonly {
  font-size: .9rem;
  font-weight: 600;
  color: #0f172a;
  background: #f8fafc; /* slate-50-ish */
  border: 1px solid rgba(15,23,42,.08);
  border-radius: .5rem;
  padding: .5rem .75rem;
  line-height: 1.4;
  min-height: 2.5rem;
  display: flex;
  align-items: center;
  box-shadow: 0 2px 4px rgba(15,23,42,.04);
}

/* input-urile editabile (nume complet, telefon, parolă etc)
   - stil apropiat de login/register, dar reutilizabil */
.pro-input {
  appearance: none;
  width: 100%;
  font-size: .9rem;
  font-weight: 600;
  line-height: 1.4;
  color: #0f172a;
  background: #ffffff;
  border-radius: .5rem;
  border: 1px solid rgba(15,23,42,.12);
  padding: .6rem .75rem;
  box-shadow: 0 2px 4px rgba(15,23,42,.04);
  outline: none;
}
.pro-input:focus {
  background:#fff;
  border-color: rgba(15,23,42,.4);
  box-shadow:
    0 0 0 3px rgba(15,23,42,.07),
    0 2px 4px rgba(15,23,42,.04);
}

/* badge "activ" din lista de apartamente desktop */
.apt-active-badge {
  position: absolute;
  right: .75rem;
  top: .75rem;
  font-size: .7rem;
  line-height: 1.2;
  background-color: #eff6ff; /* blue-50 */
  color: #1d4ed8;           /* blue-700 */
  padding: .25rem .5rem;
  border-radius: .375rem;
  font-weight: 600;
  white-space: nowrap;
}

/* text mic de sub notificări push */
.prefs-hint {
  font-size: .8rem;
  line-height: 1.4;
  color: #475569; /* slate-600-ish */
  font-weight: 500;
}

/* asigurăm culori decente pe itemele cu radio din "Apartamente asociate" */
.apt-item,
.apt-item .apt-name {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  opacity: 1 !important;
  visibility: visible !important;
  line-height: 1.5;
}

/* layout pentru butoanele Asociază / Setează apartament activ
   - egal pe orizontală la ecrane >= sm
   - una sub alta pe very-small */
.apt-actions-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: .75rem;
}
@media (min-width: 640px) {
  .apt-actions-grid {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
}

/* btn-secondary și btn-cta vin deja din auth-login.css.
   Aici ne asigurăm doar că am setat width:100% când punem clasa w-full în HTML,
   deci nu trebuie alt override aici */

/* checkbox-ul .remember-box e deja în auth-login.css de la login/register,
   îl refolosim identic pentru SMS / Email */

/* gata profile page additions */
