/* ============================================================
   Componente — direcția "Modern" (BEM)
   ============================================================ */

/* --- Butoane --- */
.btn{
  --btn-bg:var(--color-action); --btn-fg:#fff;
  display:inline-flex; align-items:center; gap:var(--space-2);
  font:inherit; font-weight:var(--fw-semibold); line-height:1;
  padding:.8rem 1.25rem; border:2px solid transparent; border-radius:var(--radius-sm);
  background:var(--btn-bg); color:var(--btn-fg); text-decoration:none; cursor:pointer;
  transition:background var(--dur) var(--ease), transform var(--dur) var(--ease);
}
.btn:hover{ background:var(--color-action-700); color:#fff; }
.btn:active{ transform:translateY(1px); }
.btn--ghost{ --btn-bg:transparent; --btn-fg:var(--color-navy); border-color:var(--color-slate-300); }
.btn--ghost:hover{ background:var(--color-slate-100); color:var(--color-navy); }
.btn--urgent{ --btn-bg:var(--color-urgent); }
.btn--urgent:hover{ background:var(--color-urgent-700); }
.btn--lg{ padding:1rem 1.5rem; font-size:var(--fs-500); }

/* --- Topbar (utilitar) --- */
.topbar{ background:var(--color-navy-700); color:#cfdbe9; font-size:var(--fs-300); }
.topbar__row{ display:flex; gap:var(--space-5); align-items:center; justify-content:flex-end;
  min-height:40px; flex-wrap:wrap; }
.topbar a{ color:#e6eef7; text-decoration:none; }
.topbar a:hover{ color:#fff; text-decoration:underline; }
.topbar__sep{ color:#4a6a8a; }
.topbar__left{ margin-right:auto; display:flex; gap:var(--space-4); align-items:center; }

/* --- Header / brand / nav --- */
.header{ background:var(--color-surface); border-bottom:1px solid var(--color-slate-200);
  position:sticky; top:0; z-index:50; }
.header__row{ display:flex; align-items:center; gap:var(--space-5); min-height:76px; }
.brand{ display:flex; align-items:center; gap:var(--space-3); text-decoration:none; color:var(--color-navy); }
.brand__mark{ width:46px; height:46px; flex:0 0 auto; border-radius:10px;
  background:linear-gradient(135deg,var(--color-navy),var(--color-teal)); display:grid; place-items:center;
  color:#fff; font-weight:var(--fw-bold); font-size:1.1rem; letter-spacing:.02em; }
.brand__logo{ width:56px; height:56px; flex:0 0 auto; object-fit:contain; }
.brand__name{ display:flex; flex-direction:column; line-height:1.2; }
.brand__line1{ font-weight:var(--fw-bold); font-size:var(--fs-400); color:var(--color-navy); }
.brand__line2{ font-weight:var(--fw-medium); font-size:var(--fs-300); color:var(--color-slate-700); }
.brand__name small{ display:block; font-weight:var(--fw-regular); font-size:var(--fs-300);
  color:var(--color-slate-500); }
@media (max-width:560px){ .brand__line1{ font-size:var(--fs-300); } .brand__line2{ display:none; } .brand__logo{ width:46px; height:46px; } }

.nav{ margin-left:auto; }
.nav__list{ display:flex; gap:var(--space-2); list-style:none; margin:0; padding:0; }
.nav__link{ display:inline-block; padding:.6rem .8rem; border-radius:var(--radius-sm);
  color:var(--color-slate-700); text-decoration:none; font-weight:var(--fw-medium); white-space:nowrap; }
.nav__link:hover,.nav__link[aria-current="page"]{ background:var(--color-slate-100); color:var(--color-navy); }

.nav-toggle{ display:none; margin-left:auto; }

/* --- Hero --- */
.hero{ background:
    radial-gradient(1200px 400px at 85% -10%, rgba(15,138,143,.18), transparent 60%),
    linear-gradient(180deg, #fff, var(--color-bg)); }
.hero__grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:var(--space-7); align-items:center;
  padding-block:var(--space-8); }
.hero__title{ font-size:clamp(2rem,1.3rem+3vw,3.25rem); margin-bottom:var(--space-4); }
.hero__lead{ font-size:var(--fs-500); color:var(--color-slate-700); max-width:46ch; }
.hero__cta{ display:flex; gap:var(--space-3); flex-wrap:wrap; margin-top:var(--space-5); }
.hero__media{ aspect-ratio:4/3; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-lg);
  background:var(--color-slate-100); }
.hero__img{ width:100%; height:100%; object-fit:cover; }

/* --- Hero: foto sus + card de text care iese sub linia slider-ului (cu bulinele pe porțiunea ieșită) --- */
.hero-full{ position:relative; overflow:hidden; min-height:min(78vh,600px); display:grid; align-items:center; }
.hero-full__media{ position:absolute; inset:0; }
.hero-full__media .slider__slide{ position:absolute; inset:0; }
.hero-full__media img{ width:100%; height:100%; object-fit:cover; }
/* Panou tăiat oblic, semi-transparent (text pe el, poza clară pe dreapta) */
.hero-full__panel{ position:absolute; left:0; top:0; bottom:0; width:54%; pointer-events:none;
  background:linear-gradient(120deg, rgba(8,24,43,.82), rgba(20,55,94,.58));
  clip-path:polygon(0 0, 100% 0, calc(100% - 120px) 100%, 0 100%); }
.hero-full__content{ position:relative; padding-block:var(--space-8); color:#fff; max-width:560px; }
.hero-full__content h1{ color:#fff; font-size:clamp(2rem,1.3rem+3vw,3.3rem); margin-bottom:var(--space-4);
  text-shadow:0 2px 16px rgba(0,0,0,.22); }
.hero-full__lead{ color:#e8eef6; font-size:var(--fs-500); max-width:50ch; }
.eyebrow--light{ color:#86d8dd; }

/* --- Acțiuni rapide (cardurile-cheie) --- */
.quick{ margin-top:0; padding-top:var(--space-8); position:relative; z-index:2; }
.quick__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:var(--space-4); }
.quick__card{ background:var(--color-surface); border:1px solid var(--color-slate-200);
  border-radius:var(--radius-md); padding:var(--space-5); text-decoration:none; color:var(--color-navy);
  box-shadow:var(--shadow-sm); transition:transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
  display:flex; flex-direction:column; gap:var(--space-2); }
.quick__card:hover{ transform:translateY(-3px); box-shadow:var(--shadow-md); color:var(--color-navy); }
.quick__icon{ width:40px; height:40px; border-radius:10px; background:var(--color-slate-100);
  display:grid; place-items:center; color:var(--color-teal-700); }
.quick__title{ font-weight:var(--fw-semibold); }
.quick__desc{ color:var(--color-slate-500); font-size:var(--fs-300); margin:0; }
.quick__card--urgent{ background:var(--color-urgent); border-color:var(--color-urgent); color:#fff; }
.quick__card--urgent .quick__icon{ background:rgba(255,255,255,.18); color:#fff; }
.quick__card--urgent .quick__desc{ color:#ffd9d6; }
.quick__card--urgent:hover{ color:#fff; }

/* --- Servicii (grid) --- */
.cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--space-5); }
/* Secțiile de pe home: 4 coloane (wide) → 2 (≤1024) → 1 (≤480), prin regulile .cards de mai jos. */
.cards--sectii{ grid-template-columns:repeat(4,1fr); }
.card{ background:var(--color-surface); border:1px solid var(--color-slate-200);
  border-radius:var(--radius-md); padding:var(--space-6); }
.card__icon{ width:48px; height:48px; border-radius:12px; background:var(--color-slate-100);
  color:var(--color-teal-700); display:grid; place-items:center; margin-bottom:var(--space-4); }
.card h3{ margin-bottom:var(--space-2); }
.card p{ color:var(--color-slate-700); margin:0; }
.card__link{ display:inline-block; margin-top:var(--space-4); font-weight:var(--fw-semibold);
  text-decoration:none; }
.card{ transition:transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease), border-color var(--dur); }
.card:hover{ transform:translateY(-5px); box-shadow:var(--shadow-md); border-color:var(--color-slate-300); }
.card__icon{ transition:transform var(--dur) var(--ease), background var(--dur), color var(--dur); }
.card:hover .card__icon{ transform:scale(1.1) rotate(-3deg); background:var(--color-teal); color:#fff; }
.card:hover .card__link{ color:var(--color-action-700); }

/* --- Bandă urgențe --- */
.urgent-band{ background:linear-gradient(100deg,var(--color-urgent-700),var(--color-urgent)); color:#fff; }
.urgent-band__row{ display:flex; align-items:center; gap:var(--space-5); flex-wrap:wrap;
  padding-block:var(--space-6); }
.urgent-band h2{ color:#fff; margin:0; }
.urgent-band p{ color:#ffe1de; margin:0; max-width:52ch; }
.urgent-band__phone{ margin-left:auto; font-size:var(--fs-700); font-weight:var(--fw-bold); color:#fff;
  text-decoration:none; white-space:nowrap; }
.urgent-band__phone:hover{ color:#fff; text-decoration:underline; }

/* --- Urgență (card reproiectat) --- */
.urgent__card{ position:relative; overflow:hidden; border-radius:var(--radius-lg); color:#fff;
  background:linear-gradient(120deg, var(--color-urgent-700), var(--color-urgent));
  padding:var(--space-7); display:grid; grid-template-columns:auto 1fr auto; gap:var(--space-6);
  align-items:center; box-shadow:var(--shadow-lg); }
.urgent__card::after{ content:""; position:absolute; right:-70px; top:-70px; width:260px; height:260px;
  border-radius:50%; background:rgba(255,255,255,.08); }
.urgent__card::before{ content:""; position:absolute; left:-50px; bottom:-90px; width:200px; height:200px;
  border-radius:50%; background:rgba(255,255,255,.06); }
.urgent__icon{ width:66px; height:66px; border-radius:18px; background:rgba(255,255,255,.16);
  display:grid; place-items:center; color:#fff; position:relative; z-index:1; }
.urgent__body{ position:relative; z-index:1; }
.urgent__body h2{ color:#fff; margin:0 0 var(--space-1); }
.urgent__body p{ color:#ffe3e0; margin:0; max-width:48ch; }
.urgent__actions{ position:relative; z-index:1; display:flex; flex-direction:column; gap:var(--space-3); }
.btn--white{ background:#fff; color:var(--color-urgent-700); }
.btn--white:hover{ background:#fff; color:var(--color-urgent); }
.btn--ghost-light{ background:transparent; border-color:rgba(255,255,255,.6); color:#fff; }
.btn--ghost-light:hover{ background:rgba(255,255,255,.15); color:#fff; }
.urgent__pulse{ width:9px; height:9px; border-radius:50%; background:currentColor;
  display:inline-block; position:relative; }
.urgent__pulse::before{ content:""; position:absolute; inset:-4px; border-radius:50%;
  border:2px solid currentColor; animation:urgentPulse 1.8s var(--ease) infinite; }
@keyframes urgentPulse{ 0%{ transform:scale(.7); opacity:.85; } 100%{ transform:scale(2.2); opacity:0; } }
@media (prefers-reduced-motion: reduce){ .urgent__pulse::before{ animation:none; } }

/* --- Stats --- */
.stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:var(--space-5); }
.stat{ position:relative; overflow:hidden; background:var(--color-surface); border:1px solid var(--color-slate-200);
  border-radius:var(--radius-md); padding:var(--space-6) var(--space-5) var(--space-5); text-align:center;
  box-shadow:var(--shadow-sm); transition:transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease); }
.stat::before{ content:""; position:absolute; left:0; right:0; top:0; height:4px;
  background:linear-gradient(90deg, var(--color-navy), var(--color-teal)); }
.stat:hover{ transform:translateY(-5px); box-shadow:var(--shadow-md); }
.stat__icon{ width:48px; height:48px; margin:var(--space-1) auto var(--space-3); border-radius:14px;
  background:var(--color-slate-100); color:var(--color-teal-700); display:grid; place-items:center; }
.stat__num{ font-size:var(--fs-900); font-weight:var(--fw-bold); line-height:1; letter-spacing:-.02em;
  background:linear-gradient(135deg, var(--color-navy), var(--color-teal));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.stat__label{ color:var(--color-slate-700); font-size:var(--fs-400); font-weight:var(--fw-medium); margin-top:var(--space-3); }

/* --- Despre (imagine + text) --- */
.about__grid{ display:grid; grid-template-columns:1fr 1fr; gap:var(--space-7); align-items:center; }
.about__media{ border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-md);
  aspect-ratio:4/3; background:var(--color-slate-100); }
.about__media img{ width:100%; height:100%; object-fit:cover; }
.about__list{ list-style:none; padding:0; margin:var(--space-4) 0 0; display:grid; gap:var(--space-2); }
.about__list li{ position:relative; padding-left:1.6rem; color:var(--color-slate-700); }
.about__list li::before{ content:"✓"; position:absolute; left:0; color:var(--color-teal-700); font-weight:var(--fw-bold); }

/* --- Știri --- */
.news{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--space-5); }
.news__item{ background:var(--color-surface); border:1px solid var(--color-slate-200);
  border-radius:var(--radius-md); overflow:hidden; display:flex; flex-direction:column; }
.news__item{ transition:transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease); }
.news__item:hover{ transform:translateY(-4px); box-shadow:var(--shadow-md); }
.news__thumb{ width:100%; aspect-ratio:16/9; object-fit:cover; }
.news__tag{ align-self:flex-start; display:inline-block; margin-bottom:var(--space-2); font-size:var(--fs-300);
  font-weight:var(--fw-semibold); color:var(--color-teal-700); background:var(--color-slate-100);
  padding:.25rem .6rem; border-radius:var(--radius-pill); }
.news__body{ padding:var(--space-4) var(--space-5) var(--space-5); }
.news__date{ color:var(--color-slate-500); font-size:var(--fs-300); }
.news__title{ font-size:var(--fs-500); margin:var(--space-2) 0 0; }
.news__title a{ color:var(--color-navy); text-decoration:none; }
.news__title a:hover{ text-decoration:underline; }

/* buton de acțiune după o secțiune/listă (spațiere consistentă) */
.section__more{ margin-top:var(--space-6); margin-bottom:0; }
.section__more--right{ text-align:right; }
.section__more--center{ text-align:center; }

/* --- Echipă --- */
.team{ display:grid; grid-template-columns:repeat(4,1fr); gap:var(--space-5); }
.member{ text-align:center; }
.member__photo{ width:104px; height:104px; border-radius:50%; margin:0 auto var(--space-3); overflow:hidden;
  background:var(--color-slate-200); display:grid; place-items:center; color:var(--color-navy);
  font-weight:var(--fw-bold); font-size:1.5rem; box-shadow:var(--shadow-sm); }
.member__photo img{ width:100%; height:100%; object-fit:cover; }
.member__name{ font-weight:var(--fw-semibold); color:var(--color-navy); }
.member__role{ color:var(--color-slate-500); font-size:var(--fs-300); }

/* --- FAQ (accordion accesibil, layout pe 2 coloane) --- */
.faq-layout{ display:grid; grid-template-columns:.85fr 1.15fr; gap:var(--space-7); align-items:start; }
.faq-aside__icon{ width:72px; height:72px; border-radius:18px; background:var(--color-slate-100);
  color:var(--color-teal-700); display:grid; place-items:center; margin-bottom:var(--space-4); }
.faq-aside h2{ margin-bottom:var(--space-3); }
.faq-aside p{ color:var(--color-slate-700); }
.faq{ max-width:none; }
.faq__item{ border-bottom:1px solid var(--color-slate-200); }
.faq__btn{ width:100%; text-align:left; background:none; border:0; cursor:pointer; font:inherit;
  font-weight:var(--fw-semibold); color:var(--color-navy); padding:var(--space-4) 0;
  display:flex; justify-content:space-between; align-items:center; gap:var(--space-4); }
.faq__btn::after{ content:"+"; font-size:1.5rem; color:var(--color-teal-700); transition:transform var(--dur); }
.faq__btn[aria-expanded="true"]::after{ content:"–"; }
.faq__panel{ padding:0 0 var(--space-5); color:var(--color-slate-700); max-width:60ch; }
.faq__panel[hidden]{ display:none; }

/* --- Footer --- */
.footer{ background:var(--color-navy-900); color:#aebfd4; margin-top:var(--space-8); }
.footer__grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:var(--space-6);
  padding-block:var(--space-8); }
.footer h2{ color:#fff; font-size:var(--fs-400); text-transform:uppercase; letter-spacing:.05em;
  margin-bottom:var(--space-4); }
.footer a{ color:#cdd9e8; text-decoration:none; }
.footer a:hover{ color:#fff; text-decoration:underline; }
.footer ul{ list-style:none; padding:0; margin:0; display:grid; gap:var(--space-2); }
.footer__bottom{ border-top:1px solid rgba(255,255,255,.12); padding-block:var(--space-4);
  display:flex; justify-content:space-between; gap:var(--space-4); flex-wrap:wrap; font-size:var(--fs-300); }
.footer__badge{ display:inline-block; background:#fff; padding:var(--space-3); border-radius:var(--radius-md);
  margin-top:var(--space-2); }
.footer__badge img{ display:block; height:72px; width:auto; }
.footer__badge figcaption{ margin-top:var(--space-2); color:var(--color-slate-500); font-size:.72rem;
  text-align:center; max-width:120px; }

/* --- Bloc alternativ (fundal) --- */
.section--tint{ background:var(--color-surface); border-block:1px solid var(--color-slate-200); }

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width:1024px){
  .quick__grid{ grid-template-columns:repeat(2,1fr); }
  .cards,.news{ grid-template-columns:repeat(2,1fr); }
  .team{ grid-template-columns:repeat(2,1fr); }
  .footer__grid{ grid-template-columns:1fr 1fr; }
}
/* Meniul trece la hamburger mai devreme (prea multe item-uri sub ~1024px) */
@media (max-width:1024px){
  .nav{ display:none; }
  .nav-toggle{ display:inline-flex; }
  .nav.is-open{ display:block; position:absolute; left:0; right:0; top:100%;
    background:#fff; border-bottom:1px solid var(--color-slate-200); box-shadow:var(--shadow-md);
    max-height:calc(100vh - 72px); max-height:calc(100dvh - 72px); overflow-y:auto; }
  .nav.is-open .nav__list{ flex-direction:column; padding:var(--space-3); }
}
@media (max-width:768px){
  .hero__grid{ grid-template-columns:1fr; }
  .hero__media{ order:-1; }
  .about__grid{ grid-template-columns:1fr; }
  .faq-layout{ grid-template-columns:1fr; }
  .urgent__card{ grid-template-columns:1fr; text-align:left; gap:var(--space-4); }
  .urgent__actions{ flex-direction:row; flex-wrap:wrap; }
  .hero-full{ min-height:auto; }
  .hero-full__panel{ width:100%; clip-path:none;
    background:linear-gradient(180deg, rgba(8,24,43,.5), rgba(8,24,43,.86)); }
  .quick{ margin-top:var(--space-6); }
  .stats{ grid-template-columns:repeat(2,1fr); }
  .urgent-band__phone{ margin-left:0; }
}
@media (max-width:480px){
  .quick__grid,.cards,.news,.team,.stats,.footer__grid{ grid-template-columns:1fr; }
}
