/* =========================================================
   Paletă & setup
   ========================================================= */
:root{
  --paper:#ffffff;
  --ink:#0f1820;
  --muted:#5f7483;
  --line:#e7edf2;
  --accent:#ff7a1a;
  --accent-2:#2db6c7;
  --shadow: 0 14px 50px rgba(10,20,30,.15);
  --radius: 18px;
  --container: min(1180px, 92vw);

  --h1: clamp(2.2rem, 2.3vw + 1.6rem, 3.2rem);
  --h2: clamp(1.6rem, 1.5vw + 1rem, 2.2rem);
  --h3: clamp(1.15rem, .8vw + .9rem, 1.35rem);
  --p: clamp(1rem, .35vw + .9rem, 1.12rem);

  /* merged: 72px -> 70px (valoarea finală din override) */
  --header-h: 70px; /* merged */

  /* Logo (valoarea finală din override) */
  --logo-base-h: 60px;  /* merged: 44px -> 60px */
  --logo-scale: 3.2;

  /* Footer logo (valoarea finală din override) */
  --footer-logo: 64px;
}

*{ box-sizing:border-box; margin:0; padding:0 }
html,body{ height:100% }

body{
  font-family: Poppins, Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--ink);
  background:
    radial-gradient(800px 500px at 110% 10%, rgba(45,182,199,.08) 0%, transparent 60%),
    radial-gradient(700px 500px at -10% 0%, rgba(255,122,26,.08) 0%, transparent 60%),
    #f7fafc;
  line-height:1.7;
  padding-top: var(--header-h);
}

img{ display:block; max-width:100%; height:auto }
a{ color:inherit; text-decoration:none }
.container{ width: var(--container); margin: 0 auto }
.nowrap{ white-space: nowrap }

/* =========================================================
   Butoane
   ========================================================= */
.btn{
  display:inline-block; font-weight:700; letter-spacing:.2px;
  padding:.9rem 1.2rem; border-radius:999px;
  background: linear-gradient(135deg, var(--accent), #ff9d55);
  color:#111; box-shadow: var(--shadow);
  transition: transform .15s ease, filter .2s ease;
}
.btn:hover{ transform: translateY(-2px); filter: brightness(1.03) }
.btn.small{ padding:.6rem .9rem; font-size:.95rem }

/* =========================================================
   Titluri / secțiuni & animații
   ========================================================= */
.section{ padding: clamp(48px, 6vw, 90px) 0 }
.section-title{
  font-size: var(--h2); text-align:center;
  margin-bottom: clamp(22px, 2.6vw, 38px);
  position:relative; display:inline-block;
  left:50%; transform:translateX(-50%);
}
.pop-in{ animation: pop .6s ease both }
.reveal-down{ animation: revealDown .65s ease both }
.reveal-up{ animation: revealUp .65s ease both }
.reveal-left{ animation: revealLeft .65s ease both }
.reveal-right{ animation: revealRight .65s ease both }
.rise{ animation: rise .65s ease both; animation-delay: var(--d, .02s) }

@keyframes pop{ from{opacity:0; transform:translateX(-50%) scale(.96)} to{opacity:1; transform:translateX(-50%) scale(1)} }
@keyframes revealDown{ from{opacity:0; transform:translateY(-18px)} to{opacity:1; transform:translateY(0)} }
@keyframes revealUp{ from{opacity:0; transform:translateY(18px)} to{opacity:1; transform:translateY(0)} }
@keyframes revealLeft{ from{opacity:0; transform:translateX(-22px)} to{opacity:1; transform:translateX(0)} }
@keyframes revealRight{ from{opacity:0; transform:translateX(22px)} to{opacity:1; transform:translateX(0)} }
@keyframes rise{ from{opacity:0; transform:translateY(18px)} to{opacity:1; transform:translateY(0)} }

/* =========================================================
   HEADER (fix, logo mare fără să crească bara)
   ========================================================= */
.site-header{
  position: fixed; top:0; left:0; right:0;
  height: var(--header-h);
  z-index: 9999;
  background: rgba(255,255,255,.95);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--line);
  overflow: visible;
}
.hdr{ height:100%; display:flex; align-items:center; gap: clamp(24px, 8vw, 220px) }
.logo{ display:flex; align-items:center; gap:.6rem; font-weight:700; position:relative }
.logo img{
  height: var(--logo-base-h) !important;
  width:auto !important;
  transform: scale(var(--logo-scale));
  transform-origin: left center;
  display:block; will-change: transform;
}
.logo span{ font-size:1.1rem }

.primary-nav{ margin-left:auto; position:relative; display:flex; align-items:center }
.primary-nav ul{ list-style:none; display:flex; align-items:center; gap:1rem }
.primary-nav li a{
  padding:.45rem .65rem; border-radius:10px; color:#0d1a22; white-space:nowrap;
}
.primary-nav li a:hover,
.primary-nav li a.active{ background:#f1f6fa }

/* hamburger */
#nav-toggle{ display:none }
.hamburger{ display:none; cursor:pointer; padding:.3rem .2rem; border-radius:8px; margin-left:.4rem }
.hamburger span{
  display:block; width:26px; height:2px; background:#0d1a22; margin:6px 0;
  transition: transform .3s ease, opacity .3s ease;
}

/* Mobil/Tabletă: meniu */
@media (max-width: 1024px){
  .hamburger{ display:block }
  .primary-nav ul{
    position:absolute; right:0; top: calc(var(--header-h));
    background:#fff; border:1px solid var(--line); border-radius:12px;
    padding:10px; box-shadow: var(--shadow);
    flex-direction:column; gap:.25rem; display:none; min-width: 220px;
  }
  #nav-toggle:checked ~ ul{ display:flex }
  #nav-toggle:checked + .hamburger span:nth-child(1){ transform: translateY(8px) rotate(45deg) }
  #nav-toggle:checked + .hamburger span:nth-child(2){ opacity:0 }
  #nav-toggle:checked + .hamburger span:nth-child(3){ transform: translateY(-8px) rotate(-45deg) }
}

/* =========================================================
   SUBHERO
   ========================================================= */
.subhero{
  position:relative; background-size:cover; background-position:center;
  min-height: 340px; display:flex; align-items:center;
  border-bottom:1px solid var(--line);
}
.subhero .scrim{
  position:absolute; inset:0;
  background: linear-gradient(120deg, rgba(11,15,18,.25), rgba(11,15,18,.55) 58%, rgba(11,15,18,.1));
}
.subhero .container{ position:relative; z-index:2 }
.subhero h1{ font-size: var(--h1); color:#fff; text-shadow: 0 10px 26px rgba(0,0,0,.35) }
.subhero .lead{ color:#eef4f7; max-width: 860px; margin-top:.4rem }

/* =========================================================
   ABOUT GRID
   ========================================================= */
.about-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:28px; align-items:center }
.about .copy p{ color:var(--muted); margin:.6rem 0 }
.facts{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px }
.fact{
  background:#fff; border:1px solid var(--line); border-radius:16px; text-align:center; padding:22px; box-shadow:var(--shadow);
}
.fact strong{ display:block; font-size: clamp(1.7rem, 2.6vw + .6rem, 2.8rem) }
.fact span{ color:var(--muted) }

/* =========================================================
   CERTIFICĂRI (cu background image)
   ========================================================= */
.cert-grid-wrapper{
  position: relative;
  margin-top: 30px;
  border-radius: 24px;
  background: url("images/bg-certs.webp") center/cover no-repeat;
  padding: 60px 50px;
}
.cert-grid-wrapper::before{ display: none; } /* removed overlay alb */

.cert-grid{
  position: relative;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px;
  z-index:1;
}
/* merged: eliminat prima versiune „albă” a cardurilor; păstrăm stilul final întunecat */
.cert-card{
  background: rgba(0,0,0,0.65);
  border: none;
  border-radius:16px;
  padding:22px;
  color:#fff;
  box-shadow: 0 8px 20px rgba(0,0,0,0.4);
  text-align: center;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.cert-card h3{
  font-size: 1.25rem;
  margin-bottom:.5rem;
  color:#fff;
  font-weight:600;
}
.cert-card p{
  font-size: 1.05rem;
  color:#f5f5f5;
  line-height: 1.6;
}
.cert-card:hover{
  transform: translateY(-4px);
  box-shadow: 0 12px 28px rgba(0,0,0,0.55);
  background: rgba(0,0,0,0.8);
}

/* =========================================================
   PILONI
   ========================================================= */
.pill-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px }
.pill{
  background:#fff; border:1px solid var(--line); border-radius:16px; padding:18px; box-shadow:var(--shadow)
}
.pill h3{ font-size:1.06rem; margin-bottom:.35rem }
.pill p{ color:var(--muted) }

/* =========================================================
   CTA
   ========================================================= */
.cta{
  background: linear-gradient(180deg, rgba(255,122,26,.07), rgba(255,122,26,.02));
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
}
.cta-wrap{
  padding: 26px 0;
  display:flex; align-items:center; justify-content:space-between; gap:18px;
}
.cta-copy h2{ font-size: clamp(1.6rem, 1.2vw + 1rem, 2rem) }
.cta-copy p{ color:var(--muted) }

/* =========================================================
   FOOTER
   ========================================================= */
.site-footer{ margin-top:28px; background:#fff; border-top:1px solid var(--line); color:var(--ink) }
.footer-grid{
  display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:22px; padding:26px 0;
  grid-template-areas: "brand dept contact";
}
.foot-brand   { grid-area: brand; }
.foot-dept    { grid-area: dept; }
.foot-contact { grid-area: contact; }

.site-footer .foot-brand img{
  width: var(--footer-logo) !important;
  height: var(--footer-logo) !important;
  margin-bottom: .55rem;
}
.foot-brand small{ display:block; color:var(--muted) }
.foot-dept h4, .foot-contact h4{ margin-bottom:.4rem }
.foot-dept ul{ list-style:none; display:grid; gap:.25rem }
.foot-dept a{ color:#0f1820; text-decoration:underline dotted transparent }
.foot-dept a:hover{ text-decoration-color:#0f1820 }
.foot-contact p{ color:var(--muted); margin:.2rem 0 }
.foot-contact .btn.small{ margin-top:.3rem }

/* Centrare linie drepturi & an */
.site-footer .legal{
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 12px 0;
  border-top: 1px solid var(--line);
  color: var(--muted);
  margin: 0 auto;
}

/* Footer: social + WhatsApp */
.social{ list-style:none; display:flex; gap:10px; margin:10px 0 0; padding:0; }
.icon-btn{ display:inline-grid; place-items:center; width:36px; height:36px; border:1px solid var(--line); border-radius:10px; background:#fff; }
.icon{ width:18px; height:18px; fill:#0f1820; opacity:.85 }
.icon-btn:hover .icon{ opacity:1 }
.dept-list{ list-style:none; padding:0; margin:0; display:grid; gap:.35rem; }
.dept-list a{ text-decoration:none; }
.dept-list .wa{ display:inline-grid; place-items:center; margin-left:.4rem; width:26px; height:26px; border-radius:6px; background:#25D3661a; border:1px solid #25D36655; vertical-align:middle; }
.wa-icon{ width:15px; height:15px; fill:#25D366; }

/* =========================================================
   Media Queries (grupate)
   ========================================================= */

/* ≤1024px — meniu + grile */
@media (max-width: 1024px){
  /* header menu – vezi secțiunea HEADER */
  .subhero{ min-height: 280px } /* ușor redus */
  .about-grid{ grid-template-columns:1fr }
  .cert-grid{ grid-template-columns:repeat(3,1fr); }
  .pill-grid{ grid-template-columns:repeat(3,1fr) }

  /* Footer (2 coloane, brand sus) */
  :root{ --footer-logo: 60px; } /* merged */
  .site-footer{ margin-top: 48px; }
  .footer-grid{
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
      "brand brand"
      "dept  contact";
    gap: 20px 24px;
  }
}

/* 481–768px — tabletă portret / phablet */
@media (min-width:481px) and (max-width:768px){
  .about-grid{ grid-template-columns:1fr }
  .cert-grid{ grid-template-columns:repeat(2,1fr) }
  .pill-grid{ grid-template-columns:repeat(2,1fr) }

  :root{ --footer-logo: 56px; } /* merged */
  .footer-grid{
    grid-template-columns: 1fr;
    grid-template-areas:
      "brand"
      "dept"
      "contact";
    gap: 16px;
    text-align: center;
  }
  .foot-brand img{ margin: 0 auto .5rem; }
  .foot-dept ul{
    justify-items: center;
    text-align: left;
    width: max-content;
    margin: 0 auto;
  }
  .social{ justify-content: center; margin-top: 8px; }
}

/* ≤480px — telefoane mici (valoarea FINALĂ) */
@media (max-width:480px){
  .subhero{ min-height: 260px }
  .facts{ grid-template-columns:1fr 1fr }
  .cert-grid{ grid-template-columns:1fr }
  .pill-grid{ grid-template-columns:1fr }
  .cta-wrap{ flex-direction:column; align-items:flex-start }
  .footer-grid{ grid-template-columns:1fr }

  /* merged: păstrăm ultima setare din fișier (suprascrie setarea anterioară 1.8/40px) */
  :root{
    --logo-scale: 3;       /* merged (final) */
    --logo-base-h: 44px;   /* merged (final) */
    --footer-logo: 90px;   /* merged (final) */
  }

  .legal{ font-size: .95rem; }
}

/* ≤400px — padding footer mai strâns */
@media (max-width: 400px){
  .footer-grid{ padding: 20px 0; }
}

/* ≥1280px — logo puțin mai mare */
@media (min-width:1280px){
  :root{ --logo-scale: 3.6; } /* merged */
}
/* ===== FOOTER (stil identic cu restul paginilor) ===== */
.site-footer{
  margin-top:28px;
  background:#fff;
  border-top:1px solid var(--line);
  color:var(--ink);
}

.footer-grid{
  display:grid;
  grid-template-columns:1.2fr 1fr 1fr;
  gap:22px;
  padding:26px 0;
  grid-template-areas: "brand dept contact"; /* desktop layout */
}

.foot-brand   { grid-area: brand; }
.foot-dept    { grid-area: dept; }
.foot-contact { grid-area: contact; }

.foot-brand img{
  width: var(--footer-logo);
  height: var(--footer-logo);
  margin-bottom:.55rem;
}
.foot-brand small{ display:block; color:var(--muted) }
.foot-dept h4, .foot-contact h4{ margin-bottom:.4rem }
.foot-dept ul{ list-style:none; display:grid; gap:.25rem }
.foot-dept a{ color:#0f1820; text-decoration:underline dotted transparent }
.foot-dept a:hover{ text-decoration-color:#0f1820 }
.foot-contact p{ color:var(--muted); margin:.2rem 0 }
.foot-contact .btn.small{ margin-top:.3rem }

/* linia de drepturi */
.site-footer .legal{
  width:100%;
  display:flex;
  justify-content:center;
  align-items:center;
  text-align:center;
  padding:12px 0;
  border-top:1px solid var(--line);
  color:var(--muted);
  margin:0 auto;
}

/* ===== Footer responsive ===== */

/* Tabletă / laptop mic (≤1024px): brand pe un rând întreg */
@media (max-width: 1024px){
  :root{ --footer-logo: 60px; }
  .site-footer{ margin-top:48px; }
  .footer-grid{
    grid-template-columns:1fr 1fr;
    grid-template-areas:
      "brand brand"
      "dept  contact";
    gap:20px 24px;
  }
}

/* Telefon & tabletă portret (≤768px): totul pe o coloană */
@media (max-width: 768px){
  :root{ --footer-logo: 56px; }
  .footer-grid{
    grid-template-columns:1fr;
    grid-template-areas:
      "brand"
      "dept"
      "contact";
    gap:16px;
    text-align:center;
  }
  .foot-brand img{ margin:0 auto .5rem; }
  .foot-dept ul{
    justify-items:center;
    text-align:left;
    width:max-content;
    margin:0 auto;
  }
  .foot-contact .btn.small{ margin-top:.4rem; }
  .social{ justify-content:center; margin-top:8px; }
}

/* Telefoane foarte mici (≤400px) */
@media (max-width: 400px){
  .footer-grid{ padding:20px 0; }
  .legal{ font-size:.95rem; }
}
/* Grid pentru .facts: două coloane pe desktop */
.about-grid .facts{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  grid-auto-flow: dense; /* umple golurile elegant */
}

/* Cardul „500K+” ocupă ambele coloane (cât două carduri) */
.about-grid .facts .fact-2x{
  grid-column: 1 / -1;
}

/* Pe mobil rămâne pe o coloană, toate egale */
@media (max-width: 480px){
  .about-grid .facts{ grid-template-columns: 1fr; }
  .about-grid .facts .fact-2x{ grid-column: auto; }
}