/* ============================================================
   ZEUS — HVAC & Thermo-Hydro Solutions
   Stylesheet custom peste Bootstrap 5.3
   Design: Figma "ZEUS" — desktop 1920px, container 1448px
   ============================================================ */

:root {
  --z-text: #20292c;
  --z-text-soft: #e0e5eb;
  --z-muted: #9e9e9e;
  --z-placeholder: #7a7a7a;
  --z-bg-soft: #f4f7f7;
  --z-card-light: #e5e5e5;
  --z-border: #eee;
  --z-border-input: #f3f3f3;
  --z-green: #22c55e;
  --z-radius: 12px;
  --z-radius-btn: 10px;
  --font-body: "Inter", system-ui, -apple-system, sans-serif;
  --font-mono: "Martian Mono", monospace;
}

body {
  font-family: var(--font-body);
  color: var(--z-text);
  background: #fff;
}

/* Container la lățimea din design (1448px + padding) */
.container-zeus {
  width: 100%;
  max-width: 1488px;
  margin-inline: auto;
  padding-inline: 20px;
}

img { max-width: 100%; }

/* ---------- Butoane (Martian Mono, uppercase) ---------- */
.btn-zeus {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 52px;
  padding-inline: 26px;
  border: 0;
  border-radius: var(--z-radius-btn);
  font-family: var(--font-mono);
  font-weight: 300;
  font-size: 15px;
  line-height: 1.15;
  letter-spacing: 0;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .2s ease, opacity .2s ease;
}
.btn-zeus--glass { background: rgba(255, 255, 255, .1); color: #fff; }
.btn-zeus--glass:hover { background: rgba(255, 255, 255, .22); color: #fff; }
.btn-zeus--white { background: #fff; color: #000; }
.btn-zeus--white:hover { background: var(--z-text-soft); color: #000; }
.btn-zeus--black { background: #000; color: #fff; }
.btn-zeus--black:hover { background: #20292c; color: #fff; }

/* Buton pătrat cu iconiță (limbă / săgeți) */
.btn-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  height: 52px;
  padding-inline: 12px;
  border: 0;
  border-radius: var(--z-radius-btn);
  background: rgba(255, 255, 255, .1);
  color: #fff;
  font-family: var(--font-mono);
  font-size: 15px;
  cursor: pointer;
  transition: background-color .2s ease;
}
.btn-icon:hover { background: rgba(255, 255, 255, .22); }
.btn-icon img { width: 17px; height: 17px; }

/* ---------- Header / Nav ---------- */
.site-header {
  position: absolute;
  inset: 0 0 auto 0;
  z-index: 100;
  padding-top: 18px;
}
.site-header .navbar { padding: 0; }
.site-header .navbar-brand img { height: 58px; width: auto; }
.site-header .nav-link {
  font-weight: 500;
  font-size: 18px;
  color: #fff;
  padding-inline: 12px;
}
.site-header .nav-link:hover,
.site-header .nav-link:focus { color: var(--z-text-soft); }
.site-header .navbar-toggler {
  border-color: rgba(255, 255, 255, .4);
  color: #fff;
}
.site-header .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255,255,255,0.9)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

@media (max-width: 1199.98px) {
  .site-header .nav-side { flex: 1 1 0; display: flex; align-items: center; }
  .site-header .nav-side--end { justify-content: flex-end; }
  .site-header .navbar-brand { flex: 0 0 auto; }
  .site-header .navbar-brand img { height: 40px; }
}

.offcanvas-zeus { background: #0b0e0f; color: #fff; }
.offcanvas-zeus .nav-link { color: #fff; font-size: 18px; padding-block: 10px; }
.offcanvas-zeus .btn-close { filter: invert(1); }

/* ---------- Hero ---------- */
.hero {
  position: relative;
  height: min(53.1vw, 1020px);
  min-height: 620px;
  background: #000;
  overflow: hidden;
}
.hero__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.hero__actions {
  position: absolute;
  left: 50%;
  top: 66%;
  transform: translateX(-50%);
  display: flex;
  gap: 20px;
  z-index: 5;
}
.hero__scroll {
  position: absolute;
  left: 50%;
  bottom: 36px;
  transform: translateX(-50%);
  z-index: 5;
  width: 81px;
  height: 50px;
  border: 0;
  border-radius: var(--z-radius-btn);
  background: #343134;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background-color .2s ease;
}
.hero__scroll:hover { background: #4a464a; }
.hero__scroll img { width: 22px; height: 23px; transform: rotate(180deg); }

/* ---------- Secțiunea Catalog ---------- */
.section-catalog { padding-block: 96px 0; }
.section-catalog__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
  margin-bottom: 48px;
}
.section-title {
  font-weight: 500;
  font-size: clamp(36px, 4.6vw, 62px);
  line-height: 1.2;
  color: var(--z-text);
  margin: 0;
}
.link-arrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding-bottom: 2px;
  border-bottom: 1.8px solid var(--z-text);
  font-weight: 500;
  font-size: 18px;
  color: var(--z-text);
  text-decoration: none;
  white-space: nowrap;
}
.link-arrow img { width: 22px; height: 23px; transform: rotate(90deg); }
.link-arrow:hover { color: #000; opacity: .75; }

.row.row-zeus { --bs-gutter-x: 20px; --bs-gutter-y: 20px; margin-bottom: 40px; }

.cat-card {
  position: relative;
  display: block;
  height: 424px;
  border-radius: var(--z-radius);
  overflow: hidden;
  text-decoration: none;
  transition: transform .25s ease, box-shadow .25s ease;
}
.cat-card:hover { transform: translateY(-4px); box-shadow: 0 14px 32px rgba(0, 0, 0, .14); }
.cat-card--light { background: var(--z-card-light); color: var(--z-text); }
.cat-card--dark { background: #000; color: #fff; }
.cat-card__body {
  position: relative;
  z-index: 2;
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  max-width: 460px;
}
.cat-card__title {
  font-weight: 500;
  font-size: clamp(28px, 2.2vw, 38px);
  line-height: 1.05;
  margin: 0;
}
.cat-card__text { font-size: 18px; line-height: 26px; margin: 0; max-width: 340px; }
.cat-card--light .cat-card__text { color: var(--z-text); }
.cat-card--dark .cat-card__text { color: #fff; }
.cat-card__tags { display: flex; flex-wrap: wrap; gap: 8px; max-width: 340px; }
.tag {
  display: inline-flex;
  align-items: center;
  height: 36px;
  padding-inline: 14px;
  background: #fff;
  border: 1px solid var(--z-border);
  border-radius: 20px;
  font-size: 14px;
  line-height: 1;
  font-weight: 400;
  color: var(--z-text);
  white-space: nowrap;
}
.cat-card__tags .tag--soon { 
	border-radius: 20px;
	border: 1px solid #EEE;
	background: #FFF;
	color: rgba(158, 158, 158, 1);
}
.cat-card__img {
  position: absolute;
  z-index: 1;
  right: 0;
  bottom: 0;
  max-height: 72%;
  max-width: 62%;
  object-fit: contain;
  object-position: bottom right;
  pointer-events: none;
}
.cat-card__img--wide { max-width: 78%; max-height: 52%; }
.cat-card__img--unit { right: auto; left: 38px; max-height: 42%; }

@media (max-width: 575.98px){
  .cat-card__tags .tag{ padding:6px 14px; font-size:14px; max-width: 100%}
}

/* ---------- Slider "De ce ZEUS" ---------- */
.section-why {
  position: relative;
  margin-top: 96px;
  background: #000;
  color: #fff;
  overflow: hidden;
}
.why-slide {
  position: relative;
  min-height: clamp(620px, 53.2vw, 1022px);
  display: none;
}
.why-slide.is-active { display: block; }
.why-slide__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.why-slide__bg--overlay { opacity: .9; }
.why-slide__content {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 48px;
  min-height: inherit;
  padding-block: 120px;
}
.why-slide__title {
  font-weight: 600;
  font-size: clamp(38px, 4.6vw, 62px);
  line-height: 1.26;
  max-width: 600px;
  margin: 0;
  text-shadow: 0 2px 24px rgba(0, 0, 0, .35);
}
.why-card {
  background: #fff;
  color: var(--z-text);
  border-radius: var(--z-radius);
  padding: 24px;
  max-width: 603px;
  flex: 0 1 603px;
}
.why-card__title {
  font-weight: 600;
  font-size: clamp(22px, 1.8vw, 28px);
  line-height: 1.22;
  margin: 0 0 12px;
}
.why-card__text { font-size: clamp(17px, 1.4vw, 22px); line-height: 1.25; color: #000; margin: 0; }
.why-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  width: 50px;
  height: 81px;
  border: 0;
  border-radius: var(--z-radius-btn);
  background: rgba(255, 255, 255, .26);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background-color .2s ease;
}
.why-nav:hover { background: rgba(255, 255, 255, .45); }
.why-nav img { width: 22px; height: 23px; }
.why-nav--prev { left: clamp(12px, 5.3vw, 102px); }
.why-nav--prev img { transform: rotate(-90deg); }
.why-nav--next { right: clamp(12px, 5.3vw, 102px); }
.why-nav--next img { transform: rotate(90deg); }
.why-dots {
  position: absolute;
  left: 50%;
  bottom: 58px;
  transform: translateX(-50%);
  z-index: 5;
  display: flex;
  align-items: center;
  gap: 5px;
}
.why-dots button {
  height: 11px;
  width: 41px;
  border: 0;
  border-radius: 12px;
  background: rgba(255, 255, 255, .35);
  cursor: pointer;
  transition: width .3s ease, background-color .3s ease;
}
.why-dots button.is-active { width: 93px; background: rgba(255, 255, 255, .84); }

/* ---------- Unde cumpăr ---------- */
.section-where { padding-block: 120px 120px; }
.section-where__head { text-align: center; max-width: 753px; margin: 0 auto 42px; }
.section-where__head p {
  font-size: 18px;
  line-height: 27px;
  color: var(--z-text);
  max-width: 532px;
  margin: 14px auto 0;
  font-weight: 400;
}
.panel {
  background: var(--z-bg-soft);
  border-radius: var(--z-radius);
  padding: 25px;
}
.panel__title { font-weight: 500; font-size: 26px; margin: 0 0 25px; color: #000; }
.dist-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  background: #fff;
  border: 1px solid #eef0f0;
  border-radius: 14px;
  padding: 16px 20px;
}
.dist-card + .dist-card { margin-top: 12px; }
.dist-card__left { display: flex; align-items: center; gap: 16px; }
.dist-card__code {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: #f3f5f5;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  font-size: 13px;
  color: #9aabab;
}
.dist-card__name { font-weight: 600; font-size: 18px; color: var(--z-text); }
.dist-card__right { display: flex; align-items: center; gap: 16px; }
.dist-card__status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--z-green);
}
.dist-card__status::before {
  content: "";
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--z-green);
}
.dist-card__visit {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 36px;
  padding-inline: 14px;
  border-radius: 10px;
  background: #f3f5f5;
  font-weight: 500;
  font-size: 14px;
  color: var(--z-text);
  text-decoration: none;
}
.dist-card__visit:hover { background: #e7ebeb; color: var(--z-text); }
.dist-card__visit img { width: 16px; height: 16px; }
.dist-more {
  margin-top: 13px;
  height: 52px;
  border-radius: var(--z-radius);
  background: rgba(0, 0, 0, .06);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  font-size: 16px;
  color: rgba(112, 112, 112, .57);
  text-align: center;
}
.panel-cta {
  background: #000;
  color: #fff;
  border-radius: var(--z-radius);
  padding: 25px;
  margin-top: 20px;
}
.panel-cta h3 { font-weight: 500; font-size: 24px; margin: 0 0 8px; }
.panel-cta p { font-size: 16px; line-height: 22px; color: var(--z-text-soft); margin: 0 0 18px; }
.panel-cta .btn-cta {
  width: 100%;
  height: 56px;
  border: 0;
  border-radius: var(--z-radius-btn);
  background: #fff;
  color: var(--z-text);
  font-family: var(--font-mono);
  font-weight: 300;
  font-size: 15px;
  text-transform: uppercase;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background-color .2s ease;
}
.panel-cta .btn-cta:hover { background: var(--z-text-soft); }

/* Formular */
.form-zeus .form-label { font-weight: 500; font-size: 18px; color: var(--z-text); margin-bottom: 8px; }
.form-zeus .form-control,
.form-zeus .form-select {
  height: 52px;
  border: 1px solid var(--z-border-input);
  border-radius: var(--z-radius);
  font-size: 16px;
  color: var(--z-text);
  padding-inline: 12px;
  box-shadow: none;
}
.form-zeus .form-control::placeholder { color: var(--z-placeholder); }
.form-zeus .form-select {
  color: var(--z-placeholder);
  background-image: url("../assets/img/icon-select.png");
  background-size: 20px 20px;
}
.form-zeus .form-select.has-value { color: var(--z-text); }
.form-zeus textarea.form-control { height: 114px; padding-top: 14px; resize: vertical; }
.form-zeus .form-control:focus,
.form-zeus .form-select:focus { border-color: var(--z-text); box-shadow: none; }
.form-zeus button[type="submit"] {
  width: 100%;
  height: 58px;
  border: 0;
  border-radius: var(--z-radius);
  background: #000;
  color: #fff;
  font-family: var(--font-mono);
  font-weight: 300;
  font-size: 15px;
  text-transform: uppercase;
  transition: background-color .2s ease;
}
.form-zeus button[type="submit"]:hover { background: var(--z-text); }

/* ---------- Footer ---------- */
.site-footer { background: #000; color: var(--z-text-soft); padding: 90px 0 44px; }
.site-footer__logo img { height: 58px; width: auto; }
.site-footer__tagline {
  font-size: 16px;
  line-height: 22px;
  color: var(--z-text-soft);
  max-width: 368px;
  margin-top: 18px;
}
.site-footer h4 { font-weight: 600; font-size: 20px; color: #fff; margin-bottom: 16px; }
.site-footer ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 12px; }
.site-footer ul a { font-size: 16px; line-height: 22px; color: var(--z-text-soft); text-decoration: none; }
.site-footer ul a:hover { color: #fff; }
.site-footer__bottom {
  margin-top: 64px;
  padding-top: 20px;
  border-top: 1px solid rgba(224, 229, 235, .25);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
}
.site-footer__bottom p { margin: 0; font-size: 16px; }
.site-footer .btn-icon { height: 44px; }

/* ---------- Responsive ---------- */
@media (max-width: 1199.98px) {
  .cat-card { height: 380px; }
  .why-slide__content { flex-direction: column; align-items: flex-start; justify-content: center; }
}

@media (max-width: 991.98px) {
  .hero .about-hero__video{
	  margin-top: 70px;
  }
  .hero { height: auto; min-height: 58svh; }
  .hero__actions {
    top: auto;
    bottom: 130px;
    width: min(92%, 420px);
    flex-direction: column;
  }
  .hero__actions .btn-zeus { width: 100%; }
  .section-catalog { padding-top: 64px; }
  .section-where { padding-block: 72px; }
  .why-nav { display: none; }
  .why-dots { bottom: 28px; }
  .why-slide { min-height: 640px; }
  .why-slide__content { padding-block: 72px; }
}

@media (max-width: 767.98px) {
  .cat-card { height: auto; min-height: 340px; padding-bottom: 190px; }
  .cat-card__img { max-width: 82%; max-height: 180px; }
  .cat-card__img--unit { display: none; }
  .dist-card { flex-wrap: wrap; }
  .site-footer { padding-top: 56px; }
  .site-footer__bottom { margin-top: 40px; }
  .section-catalog__head { margin-bottom: 28px; }
}

/* ============================================================
   Pagini interioare (header light, breadcrumb, catalog, produs,
   despre noi, descărcări, devino distribuitor, modal contact)
   ============================================================ */

/* ---------- Header light ---------- */
.page-light { background: #fff; }
.site-header--light {
  position: static;
  padding-block: 18px 8px;
}
.site-header--light .nav-link { color: #000; }
.site-header--light .nav-link:hover,
.site-header--light .nav-link:focus,
.site-header--light .nav-link.active { color: #555; }
.site-header--light .navbar-toggler { border-color: rgba(0, 0, 0, .3); }
.site-header--light .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(32,41,44,0.9)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
.site-header--light .btn-icon { background: #e5e5e5; color: #000; }
.site-header--light .btn-icon:hover { background: #d7d7d7; }
/* Logo-ul alb din Figma, inversat pentru fundal alb */
.logo-invert { filter: invert(1); }

.page-main { padding-block: 24px 0px; }

/* ---------- Breadcrumb ---------- */
.breadcrumb-zeus {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 23px;
}
.crumb { font-weight: 500; font-size: 16px; color: #9ca3af; text-decoration: none; }
.crumb:hover { color: var(--z-text); }
.crumb--current { color: var(--z-text); text-transform: uppercase; }
.breadcrumb-zeus .crumb__sep { width: 15px; height: 15px; }

/* ---------- Chip-uri categorii ---------- */
.cat-chips {
  display: flex;
  gap: 14px;
  flex-wrap: nowrap;
  overflow-x: auto;
  padding-bottom: 6px;
  margin-bottom: 34px;
  scrollbar-width: none;
}
.cat-chips::-webkit-scrollbar { display: none; }
.cat-chip {
  position: relative;
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  height: 82px;
  min-width: 211px;
  padding-inline: 15px;
  border-radius: var(--z-radius-btn);
  background: var(--z-card-light);
  opacity: .5;
  overflow: hidden;
  text-decoration: none;
  font-weight: 500;
  font-size: 18px;
  color: var(--z-text);
  transition: opacity .2s ease;
}
.cat-chip:hover { opacity: .85; color: var(--z-text); }
.cat-chip--active { background: #000; color: #fff; opacity: 1; }
.cat-chip--active:hover { color: #fff; opacity: 1; }
.cat-chip span { position: relative; z-index: 2; max-width: 130px; line-height: 1.3; }
.cat-chip img {
  position: absolute;
  right: -10px;
  bottom: -6px;
  max-height: 90%;
  max-width: 55%;
  object-fit: contain;
  object-position: bottom right;
}

/* ---------- Titluri pagină ---------- */
.page-title {
  font-weight: 500;
  font-size: clamp(30px, 2.6vw, 36px);
  color: var(--z-text);
  margin-bottom: 34px;
}
.page-title--hero {
  font-size: clamp(38px, 4.6vw, 62px);
  line-height: 1.2;
  margin-bottom: 56px;
}
.eyebrow { font-weight: 500; font-size: 24px; color: #6f6f6f; margin-bottom: 10px; }

/* ---------- Bara de filtre ---------- */
.filter-bar {
  display: flex;
  align-items: center;
  gap: 28px;
  flex-wrap: wrap;
  margin: -10px 0 34px;
}
.filter-group { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.filter-group__label { font-weight: 500; font-size: 16px; color: var(--z-text); margin-right: 4px; }
.filter-pill {
  height: 36px;
  line-height: 36px;
  padding-inline: 14px;
  background: #fff;
  border: 1px solid var(--z-border);
  border-radius: 20px;
  font-size: 15px;
  color: var(--z-text);
  cursor: pointer;
  text-decoration: none;
  transition: background-color .15s ease, color .15s ease;
}
.filter-pill:hover { background: var(--z-bg-soft); }
.filter-pill--active { background: #000; border-color: #000; color: #fff; }
.filter-pill--active:hover {color: #222; }
.filter-pill--soon { color: var(--z-muted); }


.downloads-filter-pill {
  display: flex;
  padding: 13px 16px 14px 16px;
  justify-content: center;
  align-items: center;
  border-radius: 10px;
  background: #F4F7F7;
  border: none;
  color: #1a1a1a;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease;
}

.downloads-filter-pill.active {
  background: #000; /* sau ce culoare are starea activă din design */
  color: #fff;
}

.downloads-filter-pill:hover:not(.active) {
  background: #e8ecec;
}

.downloads-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px; /* ajustează după spațierea din Figma */
}

@media (max-width: 991px) {
  .downloads-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 575px) {
  .downloads-grid {
    grid-template-columns: 1fr;
  }
}

.download-card__title {
  color: #fff;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}


/* ---------- Card produs ---------- */
.row-products { --bs-gutter-y: 28px; --bs-gutter-x: 28px;margin-bottom: 40px; }
.pcard {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 482px;
  background: var(--z-bg-soft);
  border: 1px solid #e2e8e8;
  border-radius: var(--z-radius-btn);
  padding: 15px;
  text-decoration: none;
  color: var(--z-text);
  overflow: hidden;
  transition: transform .2s ease, box-shadow .2s ease;
}
.pcard:hover { transform: translateY(-3px); box-shadow: 0 12px 26px rgba(0, 0, 0, .1); color: var(--z-text); }
.pcard__top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.pcard__tag {
  display: inline-flex;
  align-items: center;
  height: 26px;
  padding-inline: 10px;
  border-radius: 999px;
  background: #000;
  color: #fff;
  font-weight: 500;
  font-size: 14px;
  white-space: nowrap;
}
.pcard__tag--soon { background: var(--z-card-light); border: 1px solid #f4f4f4; color: var(--z-muted); }
.pcard__sku { font-size: 12px; color: #898989; }
.pcard__imgwrap { height: 185px; display: flex; align-items: center; justify-content: center; margin-block: 12px; }
.pcard__img { max-height: 100%; max-width: 70%; object-fit: contain; }
.pcard__img--soon { opacity: .35; filter: grayscale(1); }
.pcard__body { display: flex; flex-direction: column; gap: 16px; margin-top: auto; }
.pcard__name { font-weight: 600; font-size: 18px; line-height: 20px; margin: 0; min-height: 40px; }
.pcard__specs { border-top: 1px solid #e2e8e8; }
.spec-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-block: 7px;
  border-bottom: 1px solid #e2e8e8;
  font-size: 16px;
}
.spec-row:last-child { border-bottom: 0; }
.spec-row span { color: rgba(0, 0, 0, .38); }
.spec-row b { font-weight: 500; color: var(--z-text); text-align: right; }
.spec-row--lg { font-size: 18px; }

/* ---------- Pagina produs ---------- */
.pp { margin-top: 6px; }
.pp-thumb {
  height: 380px;
  background: var(--z-bg-soft);
  border-radius: var(--z-radius-btn);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px;
  margin-bottom: 20px;
  overflow: hidden;
}
.pp-thumb img { max-height: 100%; max-width: 100%; object-fit: contain; }
.pp-thumb--photo { padding: 0; }
.pp-thumb--photo img { width: 100%; height: 100%; object-fit: cover; }
.pp-sku { font-size: 16px; margin-bottom: 10px; }
.pp-sku b { font-weight: 500; font-size: 18px; color: var(--z-text); }
.pp-sku span { color: #898989; }
.pp-title { font-weight: 500; font-size: clamp(26px, 2.4vw, 32px); line-height: 36px; margin: 14px 0 10px; color: #000; }
.accordion-zeus .acc-item { border-bottom: 1px solid #e2e8e8; }
.acc-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  width: 100%;
  padding-block: 10px;
  background: none;
  border: 0;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 20px;
  color: #181d25;
  cursor: pointer;
}
.acc-head__arrow { width: 13px; height: 13px; transition: transform .2s ease; }
.acc-head.collapsed .acc-head__arrow { transform: rotate(180deg); }
.acc-head__plus { width: 20px; height: 20px; }
.pp-specs { padding-bottom: 10px; }
.pp-desc { font-size: 17px; line-height: 26px; color: var(--z-text); padding-bottom: 14px; margin: 0; }
.pp-offer {
  background: var(--z-card-light);
  border-radius: var(--z-radius);
  padding: 16px 16px 20px;
  margin-top: 24px;
}
.pp-offer h3 { font-weight: 500; font-size: 22px; color: #000; margin-bottom: 14px; }
.pp-offer .form-control { height: 50px; }
.pp-offer button[type="submit"] { height: 52px; }
.pp-downloads { display: flex; gap: 20px; flex-wrap: wrap; margin-top: 20px; }
.pp-download {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 54px;
  padding-inline: 15px;
  background: var(--z-bg-soft);
  border-radius: var(--z-radius-btn);
  font-size: 18px;
  color: #000;
  text-decoration: none;
}
.pp-download:hover { background: #e9eeee; color: #000; }
.pp-download img { width: 20px; height: 20px; }

.pp-where { margin-top: 100px; }
.pp-where__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
  margin-bottom: 40px;
}
.pp-where__head h2 { font-weight: 500; font-size: clamp(26px, 2.4vw, 32px); color: #000; margin: 0; }
.pp-dist {
  background: #000;
  border-radius: var(--z-radius-btn);
  padding: 16px;
}
.pp-dist .dist-card { padding: 12px 16px; }
.dist-more--light { background: var(--z-text-soft); color: rgba(112, 112, 112, .57); }
.pp-dist__cta {
  background: rgba(255, 255, 255, .2);
  border-radius: var(--z-radius);
  padding: 16px 25px 25px 16px;
  margin-top: 18px;
  color: #fff;
}
.pp-dist__cta h3 { font-weight: 500; font-size: 22px; margin-bottom: 8px; }
.pp-dist__cta p { font-size: 16px; line-height: 22px; color: var(--z-text-soft); margin-bottom: 16px; }
.pp-dist__cta .btn-cta {
  width: 100%;
  height: 54px;
  border-radius: var(--z-radius-btn);
  background: #fff;
  color: var(--z-text);
  font-family: var(--font-mono);
  font-weight: 300;
  font-size: 15px;
  text-transform: uppercase;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.pp-dist__cta .btn-cta:hover { background: var(--z-text-soft); }

.pp-related__track {
  display: flex;
  gap: 28px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  padding-bottom: 6px;
}
.pp-related__track::-webkit-scrollbar { display: none; }
.pp-related__slide { flex: 0 0 min(464px, 88%); scroll-snap-align: start; }
.pp-related__nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  margin-top: 15px;
}
.pp-related__btn {
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 50%;
  background: var(--z-text);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.pp-related__btn:hover { background: #000; }
.pp-related__btn { color: #fff; font-size: 17px; line-height: 1; }
.pp-related__dots { display: flex; align-items: center; gap: 5px; }
.pp-related__dots button {
  width: 25px;
  height: 8px;
  border: 0;
  border-radius: 12px;
  background: var(--z-card-light);
  cursor: pointer;
  transition: width .25s ease, background-color .25s ease;
}
.pp-related__dots button.is-active { width: 40px; background: #000; }

/* ---------- Despre noi ---------- */
.about-block { margin-block: 40px; }
.about-block h2 { font-weight: 500; font-size: clamp(26px, 2.6vw, 36px); line-height: 1.25; color: #000; }
.about-block p { font-size: clamp(17px, 1.5vw, 22px); line-height: 32px; color: var(--z-text); margin: 0; }
.about-block--closing { margin-block: 80px 20px; }
.about-visual { border-radius: var(--z-radius); overflow: hidden; margin-block: 24px; }
.about-visual img { width: 100%; max-height: 560px; object-fit: cover; display: block; }
.about-links { margin-block: 56px 40px; }
.about-link-card {
  background: var(--z-bg-soft);
  border-radius: var(--z-radius);
  padding: 32px 28px;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}
.about-link-card h3 { font-weight: 500; font-size: 24px; color: #000; margin: 0; }
.about-link-card p { font-size: 17px; color: var(--z-text); margin: 0 0 14px; }
.about-cta { display: flex; gap: 20px; flex-wrap: wrap; justify-content: center; margin-block: 24px 90px; }
.btn-zeus--soft { background: var(--z-card-light); color: #000; }
.btn-zeus--soft:hover { background: #d7d7d7; color: #000; }

.timeline { padding-block: 40px 90px; }
.timeline__title {
  font-weight: 500;
  font-size: clamp(30px, 3.4vw, 46px);
  line-height: 1.22;
  color: #000;
  text-align: center;
  max-width: 760px;
  margin: 0 auto 60px;
}
.tl-years {
  position: relative;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 64px;
}
.tl-years::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 11px;
  height: 1px;
  background: #d9d9d9;
}
.tl-year {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  background: none;
  border: 0;
  cursor: pointer;
  font-family: var(--font-body);
  font-weight: 500;
  font-size: clamp(15px, 1.6vw, 24px);
  color: #ababab;
  transition: color .2s ease;
}
.tl-year i {
  width: 23px;
  height: 23px;
  border-radius: 50%;
  background: #fff;
  border: 2px solid #d9d9d9;
  transition: background-color .2s ease, border-color .2s ease;
}
.tl-year:hover { color: var(--z-text); }
.tl-year.is-active { color: #000; }
.tl-year.is-active i { background: #000; border-color: #000; }
.tl-slide {
  display: none;
  align-items: center;
  gap: clamp(40px, 6vw, 110px);
}
.tl-slide.is-active { display: flex; }
.tl-slide__text { flex: 1 1 60%; }
.tl-slide__text h3 { font-weight: 500; font-size: clamp(28px, 3.4vw, 46px); line-height: 1.2; color: #000; margin-bottom: 14px; }
.tl-slide__text p { font-size: clamp(17px, 1.6vw, 22px); line-height: 32px; color: #000; margin: 0; }
.tl-slide__img { flex: 0 0 338px; height: 220px; border-radius: var(--z-radius-btn); overflow: hidden; }
.tl-slide__img img { width: 100%; height: 100%; object-fit: cover; }
.tl-slide__img--soon {
  background: #000;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: 500;
  font-size: 24px;
  text-transform: uppercase;
}

/* ---------- Descărcări ---------- */
.dl-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  background: var(--z-bg-soft);
  border: 1px solid #e2e8e8;
  border-radius: var(--z-radius);
  padding: 24px;
  text-decoration: none;
  color: var(--z-text);
  transition: transform .2s ease, box-shadow .2s ease;
}
.dl-card:hover { transform: translateY(-3px); box-shadow: 0 12px 24px rgba(0, 0, 0, .08); color: var(--z-text); }
.dl-card img { width: 100%; height: aut0; }
.dl-card span { font-weight: 500; font-size: 19px; line-height: 1.3; }

/* ---------- Devino distribuitor ---------- */
.lead-zeus { font-size: 18px; line-height: 28px; color: var(--z-text); margin-bottom: 34px; max-width: 620px; }
.benefit { padding-block: 18px; border-top: 1px solid #e2e8e8; }
.benefit h3 { font-weight: 600; font-size: 21px; color: #000; margin-bottom: 6px; }
.benefit p { font-size: 16px; line-height: 24px; color: var(--z-text); margin: 0; }

/* ---------- Modal contact ---------- */
.modal-zeus { border: 0; border-radius: var(--z-radius); background: var(--z-bg-soft); padding: 10px 12px 4px; }
.modal-zeus .modal-body { padding-top: 16px; }

@media (max-width: 991.98px) {
  .tl-slide { flex-direction: column-reverse; align-items: flex-start; }
  .tl-slide__img { flex-basis: auto; width: 100%; max-width: 420px; }
  .tl-years { overflow-x: auto; justify-content: flex-start; gap: 34px; padding-bottom: 4px; }
  .pp-thumb { height: 300px; margin-bottom: 0; }
  .pp .col-6 { margin-bottom: 20px; }
}
@media (max-width: 767.98px) {
  .pcard { min-height: 0; }
  .cat-chip { height: 66px; min-width: 170px; font-size: 16px; }
  .page-main { padding-bottom: 0px; }
  .dl-card { height: 160px; }
}

/* ============================================================
   Fixes v1: acordeoane FA, paginare, pagini dark, slidere
   ============================================================ */

/* ---------- Acordeoane cu Font Awesome ---------- */
.acc-head__arrow { font-size: 14px; transition: transform .2s ease; }
.acc-head.collapsed .acc-head__arrow { transform: rotate(180deg); }
.acc-head__plus { font-size: 16px; transition: transform .2s ease; }
.acc-head:not(.collapsed) .acc-head__plus { transform: rotate(45deg); }

/* ---------- Paginare în stil ZEUS ---------- */
.pagination { gap: 8px; margin: 0 0 40px; justify-content: center; }
.pagination .page-link {
  min-width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--z-border);
  border-radius: 10px;
  background: #fff;
  color: var(--z-text);
  font-weight: 500;
  box-shadow: none !important;
}
.pagination .page-link:hover { background: var(--z-bg-soft); color: var(--z-text); }
.pagination .page-item.active .page-link { background: #000; border-color: #000; color: #fff; }
.pagination .page-item.disabled .page-link { color: var(--z-muted); background: var(--z-card-light); }
.pagination svg { width: 16px; height: 16px; }

/* ---------- Pagini dark (Unde cumpăr, Devino distribuitor) ---------- */
.page-dark { background: #000; }
.page-dark .site-footer { border-top: 1px solid rgba(255, 255, 255, .12); }
.page-dark__main { position: relative; padding-top: 150px; overflow: hidden; }
.page-dark__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .5;
  pointer-events: none;
}
.page-dark__bg--products { object-position: center bottom; opacity: .8; }
.page-dark__content { position: relative; z-index: 2; padding-bottom: 90px; }
.breadcrumb-zeus--dark .crumb { color: rgba(255, 255, 255, .55); }
.breadcrumb-zeus--dark .crumb:hover,
.breadcrumb-zeus--dark .crumb--current { color: #fff; }
.crumb__sep-fa { font-size: 11px; color: rgba(255, 255, 255, .55); }
.section-where__head--dark h1,
.page-title--ondark { color: #fff; }
.section-where__head--dark p { color: rgba(255, 255, 255, .8); }
.lead-zeus--ondark { color: rgba(255, 255, 255, .82); }

.panel--glass {
  background: rgba(255, 255, 255, .10);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.panel--glass .panel__title { color: #fff; }
.panel-cta--glass { background: rgba(255, 255, 255, .10); backdrop-filter: blur(10px); }
.panel--form { background: #fff; }
.panel--glass-form .form-label { color: #fff; }
.panel--glass-form .form-control,
.panel--glass-form .form-select {
  background: rgba(255, 255, 255, .14);
  border-color: rgba(255, 255, 255, .25);
  color: #fff;
}
.panel--glass-form .form-control::placeholder { color: rgba(255, 255, 255, .55); }
.panel--glass-form button[type="submit"] { background: #fff; color: var(--z-text); }
.panel--glass-form button[type="submit"]:hover { background: var(--z-text-soft); }

.benefit--dark { display: flex; gap: 16px; border-top-color: rgba(255, 255, 255, .15); }
.benefit--dark h3 { color: #fff; }
.benefit--dark p { color: rgba(255, 255, 255, .72); }
.benefit__icon {
  flex: 0 0 46px;
  height: 46px;
  border-radius: 12px;
  background: rgba(255, 255, 255, .12);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 18px;
}

/* ---------- Despre noi: hero + closing dark ---------- */
.page-main--flush { padding-top: 0; }
.about-hero {
  background: radial-gradient(120% 90% at 50% 0%, #17181a 0%, #000 70%);
  padding: 150px 20px 0;
  text-align: center;
  overflow: hidden;
}
.eyebrow--ondark { color: rgba(255, 255, 255, .55); }


.about-hero__video{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  pointer-events:none;
  background:#000;
}

@media (prefers-reduced-motion: reduce){
  .about-hero__video{ display:none; }
  .about-hero__stage{ background:url("../img/despre-hero.png") center/cover no-repeat; }
}
.about-hero__cta {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  justify-content: center;
  transform: translateY(-40px);
}
.about-closing { background: #000; padding: 80px 0 60px; }
.about-closing h2 { font-weight: 500; font-size: clamp(28px, 3.2vw, 42px); color: #fff; }
.about-closing p { color: rgba(255, 255, 255, .75); max-width: 620px; margin: 12px auto 30px; font-size: 18px; line-height: 28px; }
.about-closing__img { max-width: min(900px, 100%); }

/* ---------- Slider generic (zslider) ---------- */
[data-zslider] { position: relative; }
.zslide { display: none; }
.zslide.is-active { display: block; }
.zslider-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  margin-top: 16px;
}
.zslider-nav--overlay {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 26px;
  z-index: 5;
  margin: 0;
}
.zslider-btn {
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, .18);
  color: #fff;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background-color .2s ease;
}
.zslider-btn:hover { background: rgba(255, 255, 255, .35); }
.zslider-dots { display: flex; align-items: center; gap: 6px; }
.zslider-dots button {
  width: 25px;
  height: 8px;
  border: 0;
  border-radius: 12px;
  background: rgba(255, 255, 255, .35);
  cursor: pointer;
  transition: width .25s ease, background-color .25s ease;
}
.zslider-dots button.is-active { width: 40px; background: #fff; }

/* ---------- Slider "De ce {categoria} ZEUS?" (design exact) ---------- */
.cat-slider { background: #000; position: relative; }
.cat-slide { position: relative; min-height: clamp(520px, 53vw, 900px); overflow: hidden; }
.cat-slide__link { position: absolute; inset: 0; z-index: 3; }
.cat-slide__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
/* overlay întunecat ca textul alb să fie lizibil pe orice fotografie */
.cat-slide::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(90deg, rgba(0,0,0,.78) 0%, rgba(0,0,0,.55) 45%, rgba(0,0,0,.30) 100%);
}
.cat-slide__inner {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  min-height: inherit;
  padding-block: 80px 120px;
}
.cat-slide__title {
  font-weight: 500;
  font-size: clamp(28px, 3.4vw, 50px);
  line-height: 1.2;
  color: #fff !important;
  max-width: 700px;
  text-shadow: 0 2px 20px rgba(0, 0, 0, .6);
  text-transform: none;
}
.cat-slide__card {
  background: #fff;
  border-radius: 12px;
  padding: 28px 24px;
  max-width: 603px;
  flex: 0 1 480px;
  box-shadow: 0 18px 50px rgba(0, 0, 0, .35);
}
.cat-slide__card h3 { font-weight: 600; font-size: clamp(19px, 1.6vw, 24px); line-height: 1.28; color: #20292c; margin-bottom: 12px; }
.cat-slide__card p { font-size: clamp(15px, 1.2vw, 18px); line-height: 1.5; color: #20292c; margin: 0; }
/* săgeți: perfect centrate vertical, cerc plin */
.cat-slide__arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 6;
  width: 52px;
  height: 52px;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, .16);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  cursor: pointer;
  transition: background-color .2s ease;
}
.cat-slide__arrow:hover { background: rgba(255, 255, 255, .34); }
.cat-slide__arrow--prev { left: clamp(16px, 5vw, 60px); }
.cat-slide__arrow--next { right: clamp(16px, 5vw, 60px); }
/* dots: centrate orizontal, cu padding jos */
.cat-slider .zslider-nav--overlay {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 40px;
  z-index: 6;
  display: flex;
  justify-content: center;
}
@media (max-width: 991.98px) {
  .cat-slide__inner { flex-direction: column; align-items: flex-start; justify-content: flex-end; }
  .cat-slide__card { flex-basis: auto; }
  .cat-slide__arrow--prev { left: 10px; }
  .cat-slide__arrow--next { right: 10px; }
  .cat-slider .zslider-nav--overlay { bottom: 20px; }
}

/* ---------- Despre noi: foto reale ---------- */
.about-photo { width: 100%; border-radius: 10px; object-fit: cover; }
.about-hero__img--photo { max-width: min(1716px, 92%); border-radius: 10px; }


/* ---------- Slider categorii: variantă a why-slider pentru paginile interioare ---------- */
.section-why--cat { margin-top: 0; }
.why-slide__link { position: absolute; inset: 0; z-index: 3; }
.section-why--cat .why-slide__title { text-transform: none; }
/* overlay pentru lizibilitate — echivalentul stratului bg--overlay de pe frontpage */
.section-why--cat .why-slide::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(90deg, rgba(0,0,0,.75) 0%, rgba(0,0,0,.5) 45%, rgba(0,0,0,.25) 100%);
}
.section-why--cat .why-slide__content { z-index: 2; }


/* ---------- Spacing header pe paginile dark ---------- */
.breadcrumb-zeus--dark { margin-bottom: 28px; }
.page-dark__content .page-title--ondark,
.page-dark__content .section-where__head { margin-top: 4px; }

@media (max-width: 991.98px) {
  .page-dark__main { padding-top: 110px; }
  .about-hero { padding-top: 110px; }
}


/* ============================================================
   DESPRE NOI — fidelitate Figma
   ============================================================ */
.page-main--flush { padding-top: 0; }

/* HERO */
.about-hero {
  background: radial-gradient(130% 80% at 50% -10%, #1c1d1f 0%, #000 65%);
  padding-top: 150px;
  text-align: center;
  overflow: hidden;
}
.about-hero__eyebrow {
  display: inline-block;
  padding: 9px 22px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .1);
  border: 1px solid rgba(255, 255, 255, .16);
  color: #fff;
  font-family: 'Martian Mono', monospace;
  font-weight: 300;
  font-size: 13px;
}
.about-hero__title {
  font-weight: 300 !important;
  font-size: clamp(34px, 5vw, 68px);
  line-height: 1.12;
  color: #fff;
  margin: 22px 0 0;
}
.about-hero__title b, .about-hero__title strong { font-weight: 600 !important; }

.about-hero__stage {
  position: relative;
  width: 100%;
  margin: 0 auto 0;
  overflow: hidden;
  height: 800px;
}

.about-hero__stage .about-hero__video {
     position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);

    width: auto;          /* cheia: lățimea rezultă din raport */
    min-width: 100%;      /* siguranță dacă video-ul ar fi mai îngust */
    height: 100%;
    max-width: none;
    object-fit: cover;
}

.about-hero__cta {
  position: absolute;
  left: 50%;
  bottom: 92px;
  transform: translateX(-50%);
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  justify-content: center;
  width: max-content;
  max-width: 92vw;
}
.about-hero__scroll {
  position: absolute;
  left: 50%;
  bottom: 26px;
  transform: translateX(-50%);
  width: 80px;
  height: 50px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, .25);
  background: rgba(255, 255, 255, .28);
  color: #fff;
  cursor: pointer;
  transition: background-color .2s ease;
}
.about-hero__scroll:hover { background: rgba(255, 255, 255, .35); }

.about-hero__scroll i {
  display: inline-block;          /* transform nu se aplică pe inline */
  animation: zeus-bob 2.5s ease-in-out infinite;
}

@keyframes zeus-bob {
  0%, 100% { transform: translateY(-2px); }
  50%      { transform: translateY(2px); }
}

@media (prefers-reduced-motion: reduce) {
  .about-hero__scroll i { animation: none; }
}

/* BLOCURI mission / tech */
.about-block { align-items: center; padding: 70px 0; }
.about-block__title { font-weight: 500 !important; font-size: clamp(26px, 2.6vw, 38px); line-height: 1.2; color: var(--z-text); margin: 0; }
.about-block__text { font-size: 18px;  font-weight: 400; line-height: 1.55; color: var(--z-text-soft); margin-top: 30px; }
.about-photo { width: 100%; border-radius: 12px; object-fit: cover; }

/* CHIPS sub tech */
.about-chips { display: flex; gap: 16px; margin-top: 26px; flex-wrap: wrap;}
.about-chip {
  flex: 1 1 240px;
  border: 1px solid var(--z-border);
  border-radius: 12px;
  padding: 18px;
  background: #F4F7F7;
}
.about-chip h4 { font-weight: 600; font-size: 16px; color: var(--z-text); margin: 0 0 4px; }
.about-chip p { font-size: 14px; color: #20292C; margin: 0 0 14px; line-height: 1.4; font-weight: 300;}
.about-chip__btn {
  display: inline-flex;
  align-items: center;
  height: 42px;
  padding: 0 18px;
  border-radius: 8px;
  background: #20292c;
  color: #fff;
  font-family: 'Martian Mono', monospace;
  font-weight: 300;
  font-size: 12px;
  text-transform: uppercase;
  text-decoration: none;
}
.about-chip__btn:hover { background: #000; color: #fff; }

/* TIMELINE fundal gri deschis */
.timeline { background: var(--z-bg-soft, #f4f7f7); padding: 90px 0; margin-top: 20px; }
.timeline__title { text-align: center; font-weight: 500; font-size: clamp(26px, 2.8vw, 40px); color: var(--z-text); max-width: 760px; margin: 8px auto 50px; line-height: 1.2; }

/* CLOSING negru */
.about-closing { background: #000; padding: 80px 0 0; text-align: center; overflow: hidden; }
.about-closing__title { font-weight: 400; font-size: clamp(28px, 3.4vw, 46px); color: #fff; line-height: 1.2; }
.about-closing__title b, .about-closing__title strong { font-weight: 600; }
.about-closing__text { color: rgba(255, 255, 255, .72); max-width: 640px; margin: 16px auto 0; font-size: 18px; line-height: 1.5; }
.about-closing__img { width: 100%; max-width: 1380px; margin: 40px auto 0; display: block; }

@media (max-width: 991.98px) {
  .about-hero { padding-top: 110px; }
 
  .about-block { padding: 40px 0; }
}
/* =====================================================================
   ZEUS — slider: săgeți pe margini, dots centrate, fix mobil
   Se adaugă la finalul public/assets/zeus/css/style.css
   ===================================================================== */

/* ---------- Săgeți pe marginile slide-ului (frame desktop) ---------- */
.zslider-btn--edge {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 6;
  width: 50px;
  height: 81px;
  border: 0;
  border-radius: var(--z-radius-btn);
  background: rgba(255, 255, 255, .26);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background-color .2s ease;
}
.zslider-btn--edge:hover { background: rgba(255, 255, 255, .42); }
.zslider-btn--prev { left: 0; border-top-left-radius: 0; border-bottom-left-radius: 0; }
.zslider-btn--next { right: 0; border-top-right-radius: 0; border-bottom-right-radius: 0; }

/* Nav care conține doar dots — săgețile stau separat, pe margini */
.zslider-nav--dots-only { gap: 0; justify-content: center; }

/* ---------- Fix mobil ----------
   Cauza cardului alb uriaș: .why-slide__content e flex cu min-height: inherit
   moștenit din .why-slide (clamp 620px…1022px). Pe mobil devine coloană, iar
   .why-card se întinde pe toată înălțimea rămasă. Rezolvare: card cu înălțime
   auto, aliniat la start, și slide cu min-height mai mic.
--------------------------------- */
@media (max-width: 991.98px) {
  .section-why { margin-top: 56px; }

  .why-slide { min-height: 0; }

  .why-slide__content {
    flex-direction: column;
    align-items: stretch;      /* nu stretch pe cross-axis vertical */
    justify-content: flex-start;
    gap: 24px;
    min-height: 0;             /* anulează min-height: inherit */
    padding-block: 56px;
  }

  .why-card {
    flex: 0 0 auto;            /* nu mai crește ca să umple coloana */
    align-self: flex-start;
    height: auto;
    max-width: 100%;
    width: 100%;
    padding: 20px;
  }

  .why-slide__title {
    font-size: clamp(28px, 7vw, 40px);
    line-height: 1.18;
    max-width: 100%;
  }

  .why-card__title { font-size: clamp(19px, 4.6vw, 24px); }
  .why-card__text  { font-size: clamp(15px, 4vw, 18px); line-height: 1.4; }

  /* fotografia: pe mobil cadrul desktop taie produsul din centru */
  .why-slide__bg { object-position: 65% center; }

  /* overlay mai închis, altfel textul alb se pierde peste imaginea verticală */
  .section-why .why-slide::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(0,0,0,.72) 0%, rgba(0,0,0,.45) 55%, rgba(0,0,0,.65) 100%);
  }
  .why-slide__content { position: relative; z-index: 2; }

  /* săgețile devin mai mici și nu mai acoperă cardul */
  .zslider-btn--edge { width: 36px; height: 56px; }
  .zslider-nav--overlay { bottom: 14px; }
}

@media (max-width: 575.98px) {
  .why-slide__content { padding-block: 40px; }
  .zslider-btn--edge { display: none; }   /* pe telefon rămân doar dots + swipe */
  
  .about-hero__stage {
    height: 680px;        /* înălțimea pe mobil — ajustează */
    overflow: hidden;
  }

  .about-hero__stage .about-hero__video {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);

    width: auto;          /* cheia: lățimea rezultă din raport */
    min-width: 100%;      /* siguranță dacă video-ul ar fi mai îngust */
    height: 100%;
    max-width: none;
    object-fit: cover;
  }
}

/* ---------- Descrierea vine acum din WYSIWYG ---------- */
.why-card__text > :first-child { margin-top: 0; }
.why-card__text > :last-child  { margin-bottom: 0; }
.why-card__text p { margin: 0 0 10px; }
.why-card__text ul,
.why-card__text ol { margin: 0 0 10px; padding-left: 20px; }
.why-card__text a { color: inherit; text-decoration: underline; }

/* =====================================================================
   ZEUS — slider "De ce ...": design final
   Măsurători din Figma: slide 1921x1022, conținut la x=236 lățime 1449,
   titlu max 718px, card 603px, săgeți 50x81, dots 41x11 / 93x11 activ.

   Blocul ăsta vine ULTIMUL în style.css și suprascrie regulile de mai sus.
   ===================================================================== */

/* ---------- Structura slide-ului ---------- */
.section-why {
  position: relative;
  background: #000;
  color: #fff;
  overflow: hidden;
}
.section-why--cat { margin-top: 0; }

.why-slide {
  position: relative;
  min-height: clamp(620px, 53.2vw, 1022px);
  display: none;
}
.why-slide.is-active { display: block; }

.why-slide__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.why-slide__bg--overlay { opacity: .9; }

/* Overlay pe toate slide-urile, nu doar pe cele de categorie — textul alb
   trebuie să rămână lizibil și peste fotografii deschise (zăpadă, cer). */
.section-why .why-slide::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    90deg,
    rgba(0, 0, 0, .72) 0%,
    rgba(0, 0, 0, .48) 40%,
    rgba(0, 0, 0, .18) 70%,
    rgba(0, 0, 0, 0) 100%
  );
}

.why-slide__link { position: absolute; inset: 0; z-index: 4; }

.why-slide__content {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(24px, 3vw, 48px);
  min-height: inherit;
  padding-block: 120px;
}

/* ---------- Titlu: două linii, greutăți diferite ---------- */
.why-slide__title {
  margin: 0;
  max-width: 720px;
  font-weight: 600;
  font-size: clamp(32px, 3.3vw, 56px);
  line-height: 1.16;
  text-shadow: 0 2px 24px rgba(0, 0, 0, .4);
}
.why-slide__title-lead,
.why-slide__title-sub { display: block; }
.why-slide__title-lead { font-weight: 600; }
.why-slide__title-sub  { font-weight: 400; }

.section-why--cat .why-slide__title { text-transform: none; }

/* ---------- Card alb ---------- */
.why-card {
  align-self: center;
  flex: 0 1 603px;
  max-width: 603px;
  padding: 38px 25px;
  background: #fff;
  color: var(--z-text);
  border-radius: var(--z-radius);
  box-shadow: 0 18px 50px rgba(0, 0, 0, .28);
}
.why-card__title {
  margin: 0 0 12px;
  font-weight: 600;
  font-size: clamp(19px, 1.35vw, 24px);
  line-height: 1.28;
  color: #20292c;
}
.why-card__text {
  margin: 0;
  font-size: clamp(15px, 1.05vw, 18px);
  line-height: 1.5;
  color: #20292c;
}

/* Descrierea vine din WYSIWYG, deci poate conține p / ul / a */
.why-card__text > :first-child { margin-top: 0; }
.why-card__text > :last-child  { margin-bottom: 0; }
.why-card__text p { margin: 0 0 10px; }
.why-card__text ul,
.why-card__text ol { margin: 0 0 10px; padding-left: 20px; }
.why-card__text a { color: inherit; text-decoration: underline; }

/* ---------- Săgeți ---------- */
.section-why .zslider-btn--edge {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 6;
  width: 50px;
  height: 81px;
  border: 0;
  border-radius: var(--z-radius-btn);
  background: rgba(255, 255, 255, .26);
  color: #fff;
  font-size: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background-color .2s ease;
}
.section-why .zslider-btn--edge:hover { background: rgba(255, 255, 255, .45); }
.section-why .zslider-btn--prev { left: clamp(12px, 5.3vw, 102px); }
.section-why .zslider-btn--next { right: clamp(12px, 5.3vw, 102px); }

/* ---------- Dots ---------- */
.section-why .zslider-nav--overlay {
  bottom: 58px;
  justify-content: center;
}
.zslider-nav--dots-only { gap: 0; justify-content: center; }
.section-why .zslider-dots { gap: 5px; }
.section-why .zslider-dots button {
  width: 41px;
  height: 11px;
  border: 0;
  border-radius: 12px;
  background: rgba(255, 255, 255, .35);
  cursor: pointer;
  transition: width .3s ease, background-color .3s ease;
}
.section-why .zslider-dots button.is-active {
  width: 93px;
  background: rgba(255, 255, 255, .84);
}

/* =====================================================================
   Responsive
   ===================================================================== */

/* Sub 1200px conținutul trece pe coloană.
   ATENȚIE: pe coloană `flex-basis` se aplică pe ÎNĂLȚIME, așa că
   `flex: 0 1 603px` transforma cardul într-o cutie de 603px înălțime.
   De aici cutia albă uriașă de pe mobil. */
@media (max-width: 1199.98px) {
  .why-slide__content {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
  }
  .why-card {
    flex: 0 0 auto;
    align-self: flex-start;
    width: min(100%, 603px);
    max-width: 100%;
  }
}

@media (max-width: 991.98px) {
  .section-why { margin-top: 56px; }
  .section-why--cat { margin-top: 0; }

  .why-slide { min-height: 0; }

  .why-slide__content {
    justify-content: flex-start;
    gap: 24px;
    min-height: 0;
    padding-block: 64px;
  }

  .why-card {
    width: 100%;
    padding: 22px 20px;
  }

  .why-slide__title {
    max-width: 100%;
    font-size: clamp(28px, 6.4vw, 40px);
    line-height: 1.18;
  }
  .why-card__title { font-size: clamp(18px, 4.4vw, 22px); }
  .why-card__text  { font-size: clamp(15px, 3.8vw, 17px); }

  /* fotografia e cadrată pentru desktop; pe portret produsul iese din cadru */
  .why-slide__bg { object-position: 68% center; }

  /* gradientul orizontal nu mai ajută pe coloană — trece pe vertical */
  .section-why .why-slide::after {
    background: linear-gradient(
      180deg,
      rgba(0, 0, 0, .70) 0%,
      rgba(0, 0, 0, .42) 45%,
      rgba(0, 0, 0, .60) 100%
    );
  }

  .section-why .zslider-btn--edge { width: 36px; height: 58px; font-size: 15px; }
  .section-why .zslider-btn--prev { left: 8px; }
  .section-why .zslider-btn--next { right: 8px; }

  .section-why .zslider-nav--overlay { bottom: 20px; }
  .section-why .zslider-dots button { width: 28px; height: 8px; }
  .section-why .zslider-dots button.is-active { width: 60px; }
}

@media (max-width: 575.98px) {
  .why-slide__content { padding-block: 48px; }
  .section-why .zslider-btn--edge { display: none; }
}


.section-why .container-zeus {
  position: relative;
  z-index: 2;
  min-height: inherit;
  display: flex;
  align-items: center;
}

.section-why .why-slide__content {
  width: 100%;
  min-height: 0;
  align-items: center;
}

@media (max-width: 991.98px) {
  .section-why .container-zeus {
    min-height: 0;
    display: block;
  }
  .section-why .why-slide__content {
    align-items: stretch;
  }
}

/* ---------- Selector de limbă ---------- */
.lang-dd { position: relative; }

/* starea închisă */
.lang-dd > .dropdown-menu { display: none; }
.lang-dd > .dropdown-menu.show { display: block; }

/* aspectul meniului */
.lang-dd > .dropdown-menu {
  min-width: 100%;
  padding: 6px 0;
  margin-top: 6px;
  background: #fff;
  border: 0;
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .18);
  z-index: 1050;
}

.lang-dd .dropdown-item {
  padding: 8px 18px;
  color: #1a1a1a;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
}
.lang-dd .dropdown-item:hover,
.lang-dd .dropdown-item:focus { background: #f2f2f2; color: #000; }
.lang-dd .dropdown-item:active { background: #e6e6e6; color: #000; }


/* ---------- Descărcări: card cu imagine + overlay hover ---------- */
.dl-card {
  position: relative;
  display: block;
  border-radius: 14px;
  overflow: hidden;
  aspect-ratio: 3 / 4;
  background: #111;
  text-decoration: none;
}
.dl-card__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.dl-card__title {
  position: absolute;
  left: 16px;
  top: 16px;
  right: 16px;
  color: #fff;
  font-weight: 700;
  font-size: 15px;
  line-height: 1.3;
  z-index: 2;
  text-shadow: 0 2px 6px rgba(0,0,0,.4);
}
.dl-card__overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0);
  opacity: 0;
  transition: opacity .2s ease, background .2s ease;
  z-index: 3;
}
.dl-card:hover .dl-card__overlay {
  opacity: 1;
  background: rgba(0,0,0,.45);
}
.dl-card__btn {
	 display: flex;
	width: 206px;
	height: 50px;
	padding: 12px 55px 11px 56px;
	justify-content: center;
	align-items: center;
	border-radius: 10px;
	background: #FFF;
}

/* ---------- Descărcări: grup pill-uri filtru ---------- */
.downloads-filter-group {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.row-zeus--flush { --bs-gutter-y: 0; }