/* ==========================================================================
   COSMIDEEA UNIC - Framework global
   Versiune 1.0
   Pentru: WordPress + Hello Elementor + Elementor Editor V4 + JetPlugins

   Reguli respectate:
   - zero valori px scrise manual
   - rem, em, clamp(), %, fr, min(), max(), minmax()
   - breakpoints in em
   - logical properties pentru directii si spatieri
   - contrast verificat pentru fiecare pereche folosita
   ========================================================================== */


/* ==========================================================================
   1. FONTURI
   Fonturile sunt incarcate de Elementor, ca fonturi variabile:
   Elementor > Editor > Custom Fonts > Add New > Add Variable Font

     Manrope-Variable.ttf   axa wght 600 - 800
     Inter-Variable.ttf     axa wght 400 - 700

   Numele introdus la "Enter Font Family" trebuie sa fie exact
   Manrope, respectiv Inter, ca sa se potriveasca cu variabilele de mai jos.

   Aici NU exista blocuri @font-face. Daca le adaugi, browserul descarca
   fisierele de doua ori.

   Daca renunti la ruta Elementor si gazduiesti fonturile in child theme,
   adauga @font-face inapoi aici si sterge fonturile din Custom Fonts.
   ========================================================================== */


/* ==========================================================================
   2. VARIABILE
   ========================================================================== */

:root {

  /* --- Culori de marca, extrase din logo --- */
  --color-brand-900: #011647;
  --color-brand-800: #081236;
  --color-gold-500: #D2A563;
  --color-gold-700: #93661D;
  --color-accent-600: #752D8D;
  --color-accent-300: #B561D1;
  --color-surface-000: #FFFFFF;
  --color-surface-050: #F5F8F9;

  /* --- Culori semantice --- */
  --color-text: var(--color-brand-900);
  --color-text-muted: color-mix(in srgb, var(--color-brand-900) 72%, var(--color-surface-000));
  --color-text-inverse: var(--color-surface-050);
  --color-text-inverse-muted: color-mix(in srgb, var(--color-surface-050) 78%, var(--color-brand-900));
  --color-border: color-mix(in srgb, var(--color-brand-900) 16%, transparent);
  --color-border-strong: color-mix(in srgb, var(--color-brand-900) 32%, transparent);
  --color-border-inverse: color-mix(in srgb, var(--color-surface-050) 24%, transparent);
  --color-focus: var(--color-gold-500);
  --color-error: #A62222;
  --color-success: #17633A;

  /* Contrast masurat, pentru referinta rapida in QA:
     brand-900 pe alb ............ 17.40  AA + AAA
     alb pe brand-900 ............ 17.40  AA + AAA
     gold-500 pe brand-900 ....... 7.71   AA + AAA
     gold-700 pe alb ............. 5.05   AA
     accent-600 pe alb ........... 8.35   AA + AAA
     accent-300 pe brand-900 ..... 4.64   AA
     brand-900 pe gold-500 ....... 7.71   AA + AAA
     error pe alb ................ 7.31   AA + AAA
     success pe alb .............. 7.29   AA + AAA

     INTERZIS:
     gold-500 pe alb ............. 2.26   pica
     accent-600 pe brand-900 ..... 2.08   pica
  */

  /* --- Tipografie --- */
  --font-heading: "Manrope", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-body: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --fs-xs: clamp(0.78rem, 0.75rem + 0.10vw, 0.84rem);
  --fs-sm: clamp(0.88rem, 0.84rem + 0.16vw, 0.96rem);
  --fs-body: clamp(1rem, 0.95rem + 0.22vw, 1.125rem);
  --fs-lead: clamp(1.125rem, 1.02rem + 0.42vw, 1.35rem);
  --fs-h4: clamp(1.25rem, 1.08rem + 0.65vw, 1.6rem);
  --fs-h3: clamp(1.55rem, 1.26rem + 1.05vw, 2.15rem);
  --fs-h2: clamp(2rem, 1.52rem + 1.75vw, 3rem);
  --fs-h1: clamp(2.55rem, 1.78rem + 3.05vw, 4.6rem);

  --lh-tight: 1.05;
  --lh-heading: 1.15;
  --lh-body: 1.65;

  --ls-tight: -0.02em;
  --ls-heading: -0.01em;
  --ls-eyebrow: 0.08em;

  --fw-regular: 400;
  --fw-medium: 600;
  --fw-bold: 700;
  --fw-black: 800;

  --measure-body: 68ch;
  --measure-heading: 22ch;
  --measure-lead: 52ch;

  /* --- Spatiere --- */
  --space-3xs: clamp(0.25rem, 0.22rem + 0.12vw, 0.375rem);
  --space-2xs: clamp(0.5rem, 0.46rem + 0.16vw, 0.625rem);
  --space-xs: clamp(0.75rem, 0.68rem + 0.28vw, 0.95rem);
  --space-sm: clamp(1rem, 0.88rem + 0.45vw, 1.3rem);
  --space-md: clamp(1.5rem, 1.27rem + 0.85vw, 2rem);
  --space-lg: clamp(2rem, 1.55rem + 1.65vw, 3rem);
  --space-xl: clamp(3rem, 2.1rem + 3.3vw, 5rem);
  --space-2xl: clamp(4.5rem, 2.95rem + 5.7vw, 8rem);

  --section-block: clamp(4rem, 2.7rem + 4.8vw, 7rem);
  --section-block-compact: clamp(2.5rem, 1.8rem + 2.6vw, 4rem);
  --gutter-inline: clamp(1rem, 0.72rem + 1.15vw, 2rem);

  /* --- Containere --- */
  --container-wide: clamp(68rem, 82vw, 86rem);
  --container-content: clamp(42rem, 62vw, 68rem);
  --container-narrow: clamp(30rem, 46vw, 48rem);

  /* --- Raze --- */
  --radius-sm: clamp(0.35rem, 0.3rem + 0.12vw, 0.5rem);
  --radius-md: clamp(0.65rem, 0.56rem + 0.25vw, 0.9rem);
  --radius-lg: clamp(1rem, 0.83rem + 0.55vw, 1.4rem);
  --radius-pill: 62.5rem;

  /* --- Controale si contur --- */
  --control-min-block: clamp(2.75rem, 2.65rem + 0.35vw, 3rem);
  --control-padding-inline: clamp(1.15rem, 1rem + 0.6vw, 1.75rem);
  --focus-width: clamp(0.15rem, 0.14rem + 0.04vw, 0.2rem);
  --focus-offset: clamp(0.15rem, 0.14rem + 0.04vw, 0.2rem);
  --border-hair: 0.0625rem;
  --border-medium: 0.125rem;
  --border-thick: 0.25rem;

  /* --- Umbre, discrete --- */
  --shadow-xs: 0 0.0625rem 0.125rem color-mix(in srgb, var(--color-brand-900) 8%, transparent);
  --shadow-sm: 0 0.125rem 0.5rem color-mix(in srgb, var(--color-brand-900) 8%, transparent);
  --shadow-md: 0 0.5rem 1.5rem color-mix(in srgb, var(--color-brand-900) 10%, transparent);
  --shadow-lg: 0 1rem 3rem color-mix(in srgb, var(--color-brand-900) 12%, transparent);

  /* --- Tranzitii --- */
  --ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0.05, 0.36, 1);
  --duration-fast: 140ms;
  --duration-base: 240ms;
  --duration-slow: 420ms;
  --transition-color: color var(--duration-fast) var(--ease-out),
                      background-color var(--duration-fast) var(--ease-out),
                      border-color var(--duration-fast) var(--ease-out);
  --transition-transform: transform var(--duration-base) var(--ease-out);

  /* --- Opacitati --- */
  --opacity-muted: 0.72;
  --opacity-disabled: 0.45;
  --opacity-overlay: 0.62;

  /* --- Rapoarte de imagine --- */
  --ratio-hero: 16 / 10;
  --ratio-card: 4 / 3;
  --ratio-wide: 16 / 9;
  --ratio-square: 1 / 1;
  --ratio-portrait: 3 / 4;

  /* --- Grile --- */
  --grid-min-col: 18rem;
  --grid-gap: var(--space-md);

  /* --- Suprafata activa a sectiunii, comutata de .l-section--dark --- */
  --surface: var(--color-surface-000);
  --on-surface: var(--color-text);
  --on-surface-muted: var(--color-text-muted);
  --on-surface-border: var(--color-border);
  --accent-on-surface: var(--color-accent-600);
  --gold-on-surface: var(--color-gold-700);
}


/* ==========================================================================
   3. BAZA
   ========================================================================== */

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-block-start: var(--space-2xl);
}

body {
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--fs-body);
  font-weight: var(--fw-regular);
  line-height: var(--lh-body);
  color: var(--color-text);
  background-color: var(--color-surface-000);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  font-weight: var(--fw-bold);
  line-height: var(--lh-heading);
  letter-spacing: var(--ls-heading);
  margin-block: 0;
  text-wrap: balance;
}

p, ul, ol, dl, blockquote, figure, table {
  margin-block: 0;
}

img, picture, video, canvas, svg {
  display: block;
  max-inline-size: 100%;
  block-size: auto;
}

a {
  color: inherit;
  text-decoration-thickness: var(--border-hair);
  text-underline-offset: 0.18em;
}

button, input, select, textarea {
  font: inherit;
  color: inherit;
}

:focus-visible {
  outline: var(--focus-width) solid var(--color-focus);
  outline-offset: var(--focus-offset);
  border-radius: var(--radius-sm);
}

.l-section--dark :focus-visible {
  outline-color: var(--color-gold-500);
}

::selection {
  background-color: var(--color-gold-500);
  color: var(--color-brand-900);
}


/* ==========================================================================
   4. LAYOUT SI CONTAINERE
   ========================================================================== */

.l-page {
  display: flex;
  flex-direction: column;
  min-block-size: 100vh;
  min-block-size: 100dvh;
  overflow-x: clip;
}

.l-page > main {
  flex: 1 0 auto;
}

.l-section {
  padding-block: var(--section-block);
  padding-inline: 0;
  background-color: var(--surface);
  color: var(--on-surface);
  position: relative;
}

.l-section--compact {
  padding-block: var(--section-block-compact);
}

.l-section--flush-top {
  padding-block-start: 0;
}

.l-section--dark {
  --surface: var(--color-brand-900);
  --on-surface: var(--color-text-inverse);
  --on-surface-muted: var(--color-text-inverse-muted);
  --on-surface-border: var(--color-border-inverse);
  --accent-on-surface: var(--color-accent-300);
  --gold-on-surface: var(--color-gold-500);
}

.l-section--tinted {
  --surface: var(--color-surface-050);
}

.l-container {
  padding: 0;
  inline-size: min(100% - (var(--gutter-inline) * 2), var(--container-wide));
  margin-inline: auto;
}

.l-container--content {
  inline-size: min(100% - (var(--gutter-inline) * 2), var(--container-content));
}

.l-container--narrow {
  inline-size: min(100% - (var(--gutter-inline) * 2), var(--container-narrow));
}

.l-grid {
  display: grid;
  gap: var(--grid-gap);
  padding: 0;
}

.l-grid--2 {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr));
}

.l-grid--3 {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--grid-min-col)), 1fr));
}

.l-grid--4 {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
}

.l-grid--auto {
  grid-template-columns: repeat(auto-fill, minmax(min(100%, var(--grid-min-col)), 1fr));
}

/* Doua coloane inegale, pentru sectiuni text + imagine */
.l-grid--split {
  grid-template-columns: 1fr;
  align-items: center;
}

.l-stack {
  display: flex;
  padding: 0;
  flex-direction: column;
  gap: var(--stack-gap, var(--space-sm));
}

.l-stack--lg { --stack-gap: var(--space-lg); }
.l-stack--md { --stack-gap: var(--space-md); }
.l-stack--xs { --stack-gap: var(--space-xs); }

.l-cluster {
  display: flex;
  padding: 0;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--cluster-gap, var(--space-xs));
}

.l-cluster--sm { --cluster-gap: var(--space-2xs); }
.l-cluster--md { --cluster-gap: var(--space-sm); }

.l-split {
  display: flex;
  padding: 0;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-sm);
}


/* ==========================================================================
   5. TIPOGRAFIE
   ========================================================================== */

.t-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2xs);
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  letter-spacing: var(--ls-eyebrow);
  text-transform: uppercase;
  line-height: 1.2;
  color: var(--gold-on-surface);
}

.t-eyebrow::before {
  content: "";
  inline-size: var(--space-md);
  block-size: var(--border-medium);
  background-color: currentColor;
  flex: none;
}

.t-display {
  font-family: var(--font-heading);
  font-size: var(--fs-h1);
  font-weight: var(--fw-black);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-tight);
  max-inline-size: var(--measure-heading);
  text-wrap: balance;
}

.t-h1 {
  font-size: var(--fs-h1);
  font-weight: var(--fw-black);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-tight);
  max-inline-size: var(--measure-heading);
}

.t-h2 {
  font-size: var(--fs-h2);
  font-weight: var(--fw-bold);
  max-inline-size: var(--measure-heading);
}

.t-h3 { font-size: var(--fs-h3); font-weight: var(--fw-bold); }
.t-h4 { font-size: var(--fs-h4); font-weight: var(--fw-medium); }

.t-lead {
  font-size: var(--fs-lead);
  font-family: var(--font-body);
  font-weight: var(--fw-regular);
  line-height: 1.5;
  color: var(--on-surface-muted);
  max-inline-size: var(--measure-lead);
  text-wrap: pretty;
}

.t-body {
  font-size: var(--fs-body);
  font-family: var(--font-body);
  font-weight: var(--fw-regular);
  line-height: var(--lh-body);
}

.t-small {
  font-size: var(--fs-sm);
  font-family: var(--font-body);
  font-weight: var(--fw-regular);
  line-height: 1.5;
}

.t-xs {
  font-size: var(--fs-xs);
  font-family: var(--font-body);
  font-weight: var(--fw-regular);
  line-height: 1.4;
}

.t-readable {
  max-inline-size: var(--measure-body);
  text-wrap: pretty;
}

.t-muted { color: var(--on-surface-muted); }

.t-inverse {
  color: var(--color-text-inverse);
}

/* Link in corpul textului: nu se distinge doar prin culoare */
.t-body a:not(.c-button):not(.c-link-arrow),
.t-readable a:not(.c-button):not(.c-link-arrow) {
  color: var(--accent-on-surface);
  text-decoration: underline;
  text-decoration-thickness: var(--border-hair);
  transition: var(--transition-color);
}

.t-body a:hover,
.t-readable a:hover {
  text-decoration-thickness: var(--border-medium);
}


/* ==========================================================================
   6. COMPONENTE
   ========================================================================== */

/* --- 6.1 Butoane --- */

.c-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2xs);
  min-block-size: var(--control-min-block);
  padding-block: var(--space-2xs);
  padding-inline: var(--control-padding-inline);
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  /* line-height 1 lasa caseta de linie sa se stranga pe litere.
     Peste 1, spatiul in plus se imparte egal fata de caseta de continut,
     nu fata de literele vizibile, iar textul pare urcat. */
  line-height: 1;
  text-align: center;
  text-decoration: none;
  border: var(--border-medium) solid transparent;
  border-radius: var(--radius-sm);
  cursor: pointer;
  white-space: nowrap;
  transition: var(--transition-color);
}

/* Portita de scapare pentru etichete lungi */
.c-button--wrap { white-space: normal; }

.c-button--primary {
  background-color: var(--color-gold-500);
  border-color: var(--color-gold-500);
  color: var(--color-brand-900);
}

.c-button--primary:hover,
.c-button--primary:focus-visible {
  background-color: var(--color-gold-700);
  border-color: var(--color-gold-700);
  color: var(--color-surface-000);
}

.c-button--secondary {
  background-color: transparent;
  border-color: var(--color-brand-900);
  color: var(--color-brand-900);
}

.c-button--secondary:hover,
.c-button--secondary:focus-visible {
  background-color: var(--color-brand-900);
  color: var(--color-text-inverse);
}

.l-section--dark .c-button--secondary,
.c-cta-band .c-button--secondary {
  border-color: var(--color-surface-050);
  color: var(--color-surface-050);
}

.l-section--dark .c-button--secondary:hover,
.c-cta-band .c-button--secondary:hover {
  background-color: var(--color-surface-050);
  color: var(--color-brand-900);
}

.c-button--ghost {
  background-color: transparent;
  border-color: transparent;
  color: var(--on-surface);
  padding-inline: var(--space-xs);
  text-decoration: underline;
  text-decoration-thickness: var(--border-hair);
}

.c-button--ghost:hover {
  color: var(--accent-on-surface);
  text-decoration-thickness: var(--border-medium);
}

.c-button--block {
  inline-size: 100%;
}

.c-button[aria-disabled="true"],
.c-button:disabled {
  opacity: var(--opacity-disabled);
  cursor: not-allowed;
}

/* --- 6.2 Link cu sageata --- */

.c-link-arrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2xs);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  color: var(--accent-on-surface);
  text-decoration: underline;
  text-decoration-thickness: var(--border-hair);
  text-underline-offset: 0.25em;
  transition: var(--transition-color);
}

.c-link-arrow::after {
  content: "";
  inline-size: 0.5em;
  block-size: 0.5em;
  border-block-start: var(--border-medium) solid currentColor;
  border-inline-end: var(--border-medium) solid currentColor;
  transform: rotate(45deg);
  transition: var(--transition-transform);
  flex: none;
}

.c-link-arrow:hover::after {
  transform: rotate(45deg) translate(0.15em, -0.15em);
}

/* --- 6.3 Carduri --- */

.c-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  padding: var(--space-md);
  background-color: var(--color-surface-000);
  border: var(--border-hair) solid var(--color-border);
  border-radius: var(--radius-md);
  block-size: 100%;
  transition: border-color var(--duration-base) var(--ease-out),
              box-shadow var(--duration-base) var(--ease-out);
}

.c-card:hover {
  border-color: var(--color-gold-500);
  box-shadow: var(--shadow-sm);
}

.c-card:focus-within {
  border-color: var(--color-gold-500);
}

.l-section--dark .c-card {
  background-color: color-mix(in srgb, var(--color-surface-050) 6%, transparent);
  border-color: var(--color-border-inverse);
}

.c-card__title {
  font-family: var(--font-heading);
  font-size: var(--fs-h4);
  font-weight: var(--fw-bold);
  line-height: var(--lh-heading);
  letter-spacing: var(--ls-heading);
  text-align: start;
  margin: 0;
}

.c-card__title a {
  text-decoration: none;
}

/* Zona de click pe tot cardul, pastrand un singur link real */
.c-card__title a::after {
  content: "";
  position: absolute;
  inset: 0;
}

.c-card__text {
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  font-weight: var(--fw-regular);
  line-height: var(--lh-body);
  color: var(--color-text-muted);
  margin: 0;
  flex: 1 1 auto;
}

.l-section--dark .c-card__text {
  color: var(--color-text-inverse-muted);
}

.c-card__media {
  aspect-ratio: var(--ratio-card);
  overflow: hidden;
  border-radius: var(--radius-sm);
  background-color: var(--color-surface-050);
  margin-block-end: var(--space-2xs);
}

.c-card__media img {
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
}

.c-card--service {
  position: relative;
  padding-block-start: var(--space-md);
}

.c-card--project {
  position: relative;
  padding: 0;
  overflow: hidden;
}

.c-card--project .c-card__media {
  border-radius: 0;
  margin-block-end: 0;
}

.c-card--project .c-card__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-2xs);
  padding: var(--space-sm) var(--space-md) var(--space-md);
}

.c-card--article {
  position: relative;
  padding: 0;
  overflow: hidden;
}

.c-card--article .c-card__media {
  aspect-ratio: var(--ratio-wide);
  border-radius: 0;
  margin-block-end: 0;
}

.c-card--article .c-card__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-2xs);
  padding: var(--space-sm) var(--space-md) var(--space-md);
}

.c-card__meta {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: var(--space-2xs) var(--space-xs);
  font-size: var(--fs-xs);
  color: var(--color-text-muted);
}

/* --- 6.4 Icon box --- */

.c-icon-box {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  inline-size: clamp(2.75rem, 2.4rem + 1.4vw, 3.5rem);
  aspect-ratio: var(--ratio-square);
  border-radius: var(--radius-sm);
  background-color: color-mix(in srgb, var(--color-gold-500) 18%, transparent);
  color: var(--color-gold-700);
  flex: none;
}

.l-section--dark .c-icon-box {
  background-color: color-mix(in srgb, var(--color-gold-500) 22%, transparent);
  color: var(--color-gold-500);
}

.c-icon-box svg,
.c-icon-box img {
  inline-size: 62%;
  block-size: 62%;
}

/* --- 6.5 Badge --- */

.c-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3xs);
  padding-block: var(--space-3xs);
  padding-inline: var(--space-2xs);
  font-size: var(--fs-xs);
  font-weight: var(--fw-medium);
  line-height: 1.3;
  border-radius: var(--radius-sm);
  background-color: var(--color-surface-050);
  color: var(--color-brand-900);
  border: var(--border-hair) solid var(--color-border);
}

.c-badge--accent {
  background-color: color-mix(in srgb, var(--color-accent-600) 12%, transparent);
  border-color: color-mix(in srgb, var(--color-accent-600) 30%, transparent);
  color: var(--color-accent-600);
}

.l-section--dark .c-badge {
  background-color: color-mix(in srgb, var(--color-surface-050) 10%, transparent);
  border-color: var(--color-border-inverse);
  color: var(--color-surface-050);
}

/* --- 6.6 Breadcrumbs --- */

.c-breadcrumbs {
  font-size: var(--fs-xs);
  color: var(--on-surface-muted);
}

.c-breadcrumbs ol {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3xs) var(--space-2xs);
  list-style: none;
  padding-inline-start: 0;
}

.c-breadcrumbs li {
  display: flex;
  align-items: center;
  gap: var(--space-3xs) var(--space-2xs);
}

.c-breadcrumbs li:not(:last-child)::after {
  content: "/";
  color: var(--on-surface-border);
}

.c-breadcrumbs a {
  color: inherit;
  text-decoration: underline;
  text-decoration-thickness: var(--border-hair);
}

.c-breadcrumbs [aria-current="page"] {
  color: var(--on-surface);
  font-weight: var(--fw-medium);
}

/* --- 6.7 Banda CTA --- */

.c-cta-band {
  --surface: var(--color-brand-900);
  --on-surface: var(--color-text-inverse);
  --on-surface-muted: var(--color-text-inverse-muted);
  --on-surface-border: var(--color-border-inverse);
  --gold-on-surface: var(--color-gold-500);
  --accent-on-surface: var(--color-accent-300);
  background-color: var(--surface);
  color: var(--on-surface);
  border-radius: var(--radius-lg);
  padding: var(--space-xl) var(--space-lg);
  position: relative;
  overflow: hidden;
}

.c-cta-band__inner {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  z-index: 1;
}

/* --- 6.8 Motiv de acoperis, singurul element decorativ acceptat --- */

.c-roofline {
  display: block;
  inline-size: 100%;
  block-size: var(--space-sm);
  background-image: linear-gradient(
    135deg,
    var(--color-gold-700) 0%,
    var(--color-gold-500) 45%,
    var(--color-accent-600) 45%,
    var(--color-accent-600) 100%
  );
  border-radius: var(--radius-pill);
}

.c-roofline--short {
  inline-size: clamp(3rem, 2rem + 4vw, 6rem);
  block-size: var(--space-3xs);
}

/* --- 6.9 Formular --- */

.c-form {
  display: grid;
  gap: var(--space-sm);
}

.c-form__row {
  display: grid;
  gap: var(--space-sm);
}

.c-form__field {
  display: flex;
  flex-direction: column;
  gap: var(--space-3xs);
}

.c-form__label {
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  color: var(--on-surface);
}

.c-form__required {
  color: var(--color-error);
  margin-inline-start: var(--space-3xs);
}

.c-form__hint {
  font-size: var(--fs-xs);
  color: var(--on-surface-muted);
}

.c-form__control {
  min-block-size: var(--control-min-block);
  padding-block: var(--space-2xs);
  padding-inline: var(--space-xs);
  inline-size: 100%;
  font-size: var(--fs-body);
  color: var(--color-text);
  background-color: var(--color-surface-000);
  border: var(--border-hair) solid var(--color-border-strong);
  border-radius: var(--radius-sm);
  transition: var(--transition-color);
}

textarea.c-form__control {
  min-block-size: clamp(7rem, 6rem + 4vw, 10rem);
  resize: vertical;
  line-height: var(--lh-body);
}

.c-form__control:hover {
  border-color: var(--color-brand-900);
}

.c-form__control[aria-invalid="true"] {
  border-color: var(--color-error);
  border-inline-start-width: var(--border-thick);
}

.c-form__error {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: var(--space-3xs);
  font-size: var(--fs-xs);
  font-weight: var(--fw-medium);
  color: var(--color-error);
}

.c-form__error::before {
  content: "!";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  inline-size: 1.1em;
  block-size: 1.1em;
  border-radius: var(--radius-pill);
  background-color: var(--color-error);
  color: var(--color-surface-000);
  font-size: 0.85em;
  flex: none;
}

.c-form__success {
  display: flex;
  flex-direction: row;
  gap: var(--space-2xs);
  padding: var(--space-sm);
  font-size: var(--fs-sm);
  border-radius: var(--radius-sm);
  background-color: color-mix(in srgb, var(--color-success) 10%, transparent);
  border-inline-start: var(--border-thick) solid var(--color-success);
  color: var(--color-success);
}

.c-form__consent {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: var(--space-2xs);
  font-size: var(--fs-sm);
}

.c-form__consent input[type="checkbox"] {
  inline-size: 1.25rem;
  block-size: 1.25rem;
  margin-block-start: 0.2em;
  accent-color: var(--color-brand-900);
  flex: none;
}

/* --- 6.9e Widget de cautare JetSearch, stilizat ca formular propriu ----------
   Pui clasa .c-form pe widget, in campul Clase din Elementor. Plugin-ul isi
   genereaza singur markup-ul si nu permite clase pe input sau pe buton, asa ca
   le tintim dupa clasele lui:
     .c-form > .elementor-widget-container > .elementor-jet-search > .jet-search
       > form.jet-search__form > label.jet-search__label > input.jet-search__field
       si button.jet-search__submit
   Clasa .c-form e dublata pentru ca plugin-ul isi aplica propriile stiluri. */

.c-form.c-form .jet-search__form {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: stretch;
  gap: var(--space-2xs);
}

.c-form.c-form .jet-search__label {
  flex: 1 1 16rem;
  min-inline-size: 0;
  margin-block: 0;
}

.c-form.c-form .jet-search__field {
  min-block-size: var(--control-min-block);
  padding-block: var(--space-2xs);
  padding-inline: var(--space-xs);
  inline-size: 100%;
  font-family: var(--font-body);
  font-size: var(--fs-body);
  color: var(--color-text);
  background-color: var(--color-surface-000);
  border: var(--border-hair) solid var(--color-border-strong);
  border-radius: var(--radius-sm);
  transition: var(--transition-color);
}

.c-form.c-form .jet-search__field:hover {
  border-color: var(--color-brand-900);
}

/* Placeholderul e text ajutator, nu continut: greutate normala si ton discret,
   ca sa nu concureze vizual cu textul pe care il scrie omul. */
.c-form__control::placeholder,
.c-form.c-form .jet-search__field::placeholder {
  font-weight: var(--fw-regular);
  color: var(--on-surface-muted);
  opacity: 1;
}

.c-form.c-form .jet-search__submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-block-size: var(--control-min-block);
  padding-block: var(--space-2xs);
  padding-inline: var(--control-padding-inline);
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  line-height: 1;
  text-align: center;
  background-color: var(--color-gold-500);
  border: var(--border-medium) solid var(--color-gold-500);
  border-radius: var(--radius-sm);
  color: var(--color-brand-900);
  cursor: pointer;
  white-space: nowrap;
  transition: var(--transition-color);
}

.c-form.c-form .jet-search__submit:hover,
.c-form.c-form .jet-search__submit:focus-visible {
  background-color: var(--color-gold-700);
  border-color: var(--color-gold-700);
  color: var(--color-surface-000);
}

/* --- 6.9b Callout (Pe scurt / Raspuns rapid) --- */

.c-callout {
  display: flex;
  flex-direction: column;
  gap: var(--space-2xs);
  padding: var(--space-md);
  background-color: var(--color-surface-050);
  border-inline-start: var(--border-thick) solid var(--color-gold-500);
  border-radius: var(--radius-sm);
}

.c-callout p { margin-block: 0; }

.c-callout .t-body:not(:first-child) { margin-block-start: var(--space-2xs); }

/* --- 6.9c Tabel in continutul articolului --- */

.c-table-wrap {
  overflow-x: auto;
  border: var(--border-hair) solid var(--color-border);
  border-radius: var(--radius-sm);
}

.c-table {
  inline-size: 100%;
  border-collapse: collapse;
  font-size: var(--fs-sm);
}

.c-table th,
.c-table td {
  padding: var(--space-xs) var(--space-sm);
  text-align: start;
  vertical-align: top;
  border-block-end: var(--border-hair) solid var(--color-border);
}

.c-table th {
  background-color: var(--color-surface-050);
  font-family: var(--font-heading);
  font-weight: var(--fw-bold);
  color: var(--color-brand-900);
}

.c-table tr:last-child td { border-block-end: 0; }

/* --- 6.10 Acordeon --- */

.c-accordion {
  display: flex;
  flex-direction: column;
  border-block-start: var(--border-hair) solid var(--on-surface-border);
}

.c-accordion__item {
  border-block-end: var(--border-hair) solid var(--on-surface-border);
}

.c-accordion__trigger {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-sm);
  inline-size: 100%;
  min-block-size: var(--control-min-block);
  padding-block: var(--space-sm);
  padding-inline: 0;
  background: none;
  border: 0;
  text-align: start;
  font-family: var(--font-heading);
  font-size: var(--fs-lead);
  font-weight: var(--fw-medium);
  line-height: var(--lh-heading);
  color: var(--on-surface);
  cursor: pointer;
  transition: var(--transition-color);
}

.c-accordion__trigger:hover {
  color: var(--gold-on-surface);
}

.c-accordion__icon {
  position: relative;
  inline-size: var(--space-sm);
  block-size: var(--space-sm);
  margin-block-start: 0.35em;
  flex: none;
}

.c-accordion__icon::before,
.c-accordion__icon::after {
  content: "";
  position: absolute;
  inset-block-start: 50%;
  inset-inline-start: 0;
  inline-size: 100%;
  block-size: var(--border-medium);
  background-color: currentColor;
  transition: var(--transition-transform);
}

.c-accordion__icon::after {
  transform: rotate(90deg);
}

.c-accordion__trigger[aria-expanded="true"] .c-accordion__icon::after {
  transform: rotate(0deg);
}

.c-accordion__panel {
  padding-block-end: var(--space-md);
  max-inline-size: var(--measure-body);
  color: var(--on-surface-muted);
}

.c-accordion__panel[hidden] {
  display: none;
}

/* --- 6.10d Acordeon nativ (details/summary), pentru continutul din Gutenberg --- */

summary.c-accordion__trigger {
  list-style: none;
}

summary.c-accordion__trigger::-webkit-details-marker {
  display: none;
}

summary.c-accordion__trigger::marker {
  display: none;
}

/* Rotatia iconitei se conduce printr-o variabila setata pe <details>, nu printr-un
   selector care tinteste direct pseudo-elementul. Cand acordeonul exclusiv
   (atributul name) inchide un item, recalculul pe elementul real e fiabil,
   in timp ce pseudo-elementele raman uneori pe starea veche. */
.c-accordion__item {
  --icon-rot: 90deg;
}

.c-accordion__item[open] {
  --icon-rot: 0deg;
}

.c-accordion__icon.c-accordion__icon.c-accordion__icon::after {
  transform: rotate(var(--icon-rot, 90deg));
}

/* --- 6.11 Paginare --- */

.c-pagination ol {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: var(--space-2xs);
  list-style: none;
  padding-inline-start: 0;
  justify-content: center;
}

.c-pagination a,
.c-pagination span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-inline-size: var(--control-min-block);
  min-block-size: var(--control-min-block);
  padding-inline: var(--space-2xs);
  font-size: var(--fs-sm);
  font-weight: var(--fw-medium);
  text-decoration: none;
  border: var(--border-hair) solid var(--color-border);
  border-radius: var(--radius-sm);
  transition: var(--transition-color);
}

.c-pagination a:hover {
  border-color: var(--color-brand-900);
  background-color: var(--color-surface-050);
}

.c-pagination [aria-current="page"] {
  background-color: var(--color-brand-900);
  border-color: var(--color-brand-900);
  color: var(--color-text-inverse);
}

/* --- 6.12 Filtre --- */

.c-filter {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--space-sm);
  padding: var(--space-md);
  background-color: var(--color-surface-050);
  border: var(--border-hair) solid var(--color-border);
  border-radius: var(--radius-md);
}

.c-filter__group {
  display: flex;
  flex-direction: column;
  gap: var(--space-3xs);
  flex: 1 1 12rem;
  min-inline-size: 0;
}

.c-filter__label {
  font-size: var(--fs-xs);
  font-weight: var(--fw-bold);
  letter-spacing: var(--ls-eyebrow);
  text-transform: uppercase;
  color: var(--color-text-muted);
}

.c-filter__status {
  inline-size: 100%;
  font-size: var(--fs-sm);
  color: var(--color-text-muted);
}

.c-filter__empty {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-sm);
  padding: var(--space-xl) var(--space-md);
  border: var(--border-medium) dashed var(--color-border);
  border-radius: var(--radius-md);
  max-inline-size: var(--measure-body);
}

/* --- 6.13 Skip link --- */

.c-skip-link {
  position: absolute;
  inset-block-start: var(--space-2xs);
  inset-inline-start: var(--space-2xs);
  z-index: 999;
  padding-block: var(--space-2xs);
  padding-inline: var(--space-sm);
  background-color: var(--color-brand-900);
  color: var(--color-text-inverse);
  border-radius: var(--radius-sm);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  text-decoration: none;
  transform: translateY(-200%);
  transition: transform var(--duration-fast) var(--ease-out);
}

.c-skip-link:focus {
  transform: translateY(0);
}

/* --- 6.14 Titlu de sectiune --- */

.c-section-head {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  margin-block-end: var(--space-lg);
  max-inline-size: var(--measure-body);
}

.c-section-head--split {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-md);
  max-inline-size: none;
}

/* --- 6.15 Lista de etape, numerotata pentru ca este o secventa reala --- */

.c-steps {
  list-style: none;
  padding-inline-start: 0;
  display: grid;
  gap: var(--space-md);
  counter-reset: step;
}

.c-steps__item {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-sm);
  align-items: start;
  counter-increment: step;
}

.c-steps__item::before {
  content: counter(step, decimal-leading-zero);
  font-family: var(--font-heading);
  font-size: var(--fs-h4);
  font-weight: var(--fw-black);
  line-height: 1;
  color: var(--gold-on-surface);
  padding-block-start: 0.1em;
}


/* --- 6.16 Footer global --- */

.c-footer {
  padding-block: var(--space-xl);
  background-color: var(--surface);
  color: var(--on-surface);
}

.c-footer__grid {
  display: grid;
  padding: 0;
  gap: var(--space-lg);
  grid-template-columns: 1fr;
}

.c-footer__logo {
  inline-size: clamp(6.5rem, 5.5rem + 3vw, 8.5rem);
  block-size: auto;
}

.c-footer__head {
  font-family: var(--font-heading);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  letter-spacing: var(--ls-eyebrow);
  text-transform: uppercase;
  line-height: 1.2;
  color: var(--gold-on-surface);
}

.c-footer__list {
  display: flex;
  flex-direction: column;
  gap: var(--space-2xs);
  list-style: none;
  padding-inline-start: 0;
}

/* Copiii directi, indiferent de tag. Elementor scoate div si p, nu li. */
.c-footer__list > * {
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  font-weight: var(--fw-regular);
  line-height: 1.45;
  color: var(--on-surface-muted);
}

.c-footer__list a {
  color: var(--on-surface-muted);
  text-decoration: none;
  transition: var(--transition-color);
}

.c-footer__list a:hover,
.c-footer__list a:focus-visible {
  color: var(--on-surface);
  text-decoration: underline;
  text-decoration-thickness: var(--border-hair);
}

.c-footer__phones {
  display: flex;
  flex-direction: row;
  padding: 0;
  flex-wrap: wrap;
  gap: var(--space-2xs);
}

/* Nota separata sub o lista de footer, pentru o informatie de alt tip */
.c-footer__note {
  margin-block-start: var(--space-sm);
  padding-block-start: var(--space-sm);
  border-block-start: var(--border-hair) solid var(--on-surface-border);
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  font-weight: var(--fw-medium);
  line-height: 1.45;
  color: var(--gold-on-surface);
}

.c-footer__legal,
.c-footer__bottom {
  padding-inline: 0;
  margin-block-start: var(--space-md);
  padding-block-start: var(--space-sm);
  border-block-start: var(--border-hair) solid var(--on-surface-border);
}

/* Banda juridica. Fiecare valoare e un element separat, cu propriul
   dynamic tag. Punctul dintre ele il deseneaza CSS-ul, nu il scrii tu.
   Asa nu ai nevoie de HTML inline, pe care V4 nu il accepta. */
.c-footer__legal {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-3xs) var(--space-xs);
}

.c-footer__legal > * {
  display: inline-flex;
  align-items: baseline;
  gap: var(--space-xs);
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--fs-xs);
  font-weight: var(--fw-regular);
  line-height: 1.5;
  color: var(--on-surface-muted);
}

.c-footer__legal > *:not(:last-child)::after {
  content: "\00B7";
  color: var(--on-surface-border);
}

.c-footer__bottom {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2xs) var(--space-md);
}

/* Copiii nu se intind pe toata latimea, altfel se impinge fiecare pe
   randul lui si space-between nu mai are ce distribui. */
.c-footer__bottom > * {
  flex: 0 1 auto;
  inline-size: auto;
  max-inline-size: none;
  margin: 0;
}

.c-footer__policies {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: var(--space-2xs) var(--space-sm);
  list-style: none;
  padding-inline-start: 0;
}

.c-footer__policies a {
  font-size: var(--fs-xs);
  color: var(--on-surface-muted);
  text-decoration: underline;
  text-decoration-thickness: var(--border-hair);
}

.c-footer__policies a:hover {
  color: var(--on-surface);
}


/* --- 6.18 Linkuri simple construite din elementul Button --- */

/* Editorul V4 nu are un element de tip link. Se foloseste Button, iar
   clasele de mai jos ii sterg complet aspectul de buton: fara fundal,
   fara contur, fara inaltime minima, fara majuscule. Ramane un <a>
   obisnuit, cu link functional si comportament de tastatura corect. */

.c-link-plain,
.c-footer__list a,
.c-header__link {
  display: inline-flex;
  align-items: center;
  min-block-size: auto;
  padding: 0;
  background: none;
  background-color: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  text-align: start;
  text-transform: none;
  letter-spacing: normal;
  font-family: var(--font-body);
  cursor: pointer;
}

.c-link-plain {
  font-size: var(--fs-sm);
  font-weight: var(--fw-regular);
  color: var(--on-surface-muted);
  text-decoration: none;
  transition: var(--transition-color);
}

.c-link-plain:hover,
.c-link-plain:focus-visible {
  color: var(--on-surface);
  text-decoration: underline;
  text-decoration-thickness: var(--border-hair);
}

/* In header, linkul isi recapata majusculele si spatierea proprie */
.c-header__link {
  display: block;
  padding-block: var(--space-2xs);
  font-weight: var(--fw-bold);
  letter-spacing: var(--ls-eyebrow);
  text-transform: uppercase;
}


/* ==========================================================================
   6b. TEMPORAR - marcaj pentru date necompletate
   Sterge tot blocul acesta inainte de lansare.
   ========================================================================== */

.is-placeholder {
  background-color: #FFE9A8;
  color: #4A3200;
  padding-inline: 0.35em;
  padding-block: 0.1em;
  border-radius: var(--radius-sm);
  font-weight: var(--fw-medium);
  text-decoration: underline dotted #93661D;
  text-underline-offset: 0.2em;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}


/* --- 6.17 Header global --- */

.c-header {
  position: sticky;
  inset-block-start: 0;
  z-index: 100;
  background-color: var(--color-brand-900);
  color: var(--color-text-inverse);
  border-block-end: var(--border-hair) solid var(--color-border-inverse);
}

/* Grila cu trei coloane: logo, meniu, actiuni.
   Intr-o grila elementele nu se suprapun si nu se rup pe randuri,
   indiferent cat de stramt e spatiul. */
.c-header__inner {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  column-gap: var(--space-sm);
  min-block-size: clamp(4.25rem, 3.8rem + 1.8vw, 5.5rem);
  padding: 0;
  position: relative;
}

.c-header__inner > * {
  min-inline-size: 0;
}

/* Limitat pe inaltime, ca sa nu depaseasca bara. Latimea urmeaza raportul. */
.c-header__logo {
  display: block;
  block-size: clamp(2.6rem, 2.3rem + 1.3vw, 3.5rem);
  inline-size: auto;
  max-inline-size: none;
  object-fit: contain;
  flex: none;
}

/* Linkul din jurul logo-ului nu isi ia latime proprie */
.c-header__logo-link {
  display: inline-flex;
  align-items: center;
  flex: none;
  padding: 0;
  line-height: 0;
}

/* Panoul cu meniul si actiunile. Pe mobil devine sertar. */
.c-header__panel {
  display: none;
}

.c-header__panel[data-open="true"] {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--space-md);
  position: absolute;
  inset-inline: 0;
  inset-block-start: 100%;
  padding: var(--space-md);
  background-color: var(--color-brand-800);
  border-block-start: var(--border-hair) solid var(--color-border-inverse);
  box-shadow: var(--shadow-lg);
}

.c-header__list {
  display: flex;
  flex-direction: column;
  gap: var(--space-2xs);
  list-style: none;
  padding-inline-start: 0;
}

.c-header__link {
  display: block;
  padding-block: var(--space-2xs);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  letter-spacing: var(--ls-eyebrow);
  text-transform: uppercase;
  text-decoration: none;
  color: var(--color-text-inverse-muted);
  transition: var(--transition-color);
  position: relative;
}

.c-header__link:hover,
.c-header__link:focus-visible {
  color: var(--color-surface-000);
}

.c-header__link[aria-current="page"] {
  color: var(--color-surface-000);
}

.c-header__link[aria-current="page"]::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  inset-block-end: 0;
  block-size: var(--border-medium);
  background-color: var(--color-gold-500);
}

.c-header__actions {
  display: flex;
  flex-direction: row;
  justify-self: end;
  flex: none;
  padding: 0;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2xs);
}

.c-header__phone {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2xs);
  min-block-size: var(--control-min-block);
  padding-inline: var(--space-2xs);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  color: var(--color-gold-500);
  text-decoration: none;
  white-space: nowrap;
  transition: var(--transition-color);
}

.c-header__phone:hover { color: var(--color-surface-000); }
.c-header__phone svg { inline-size: 1.15em; block-size: 1.15em; flex: none; }

/* Butonul de meniu, vizibil doar pe mobil */
.c-header__toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2xs);
  min-block-size: var(--control-min-block);
  min-inline-size: var(--control-min-block);
  padding-inline: var(--space-2xs);
  background: none;
  border: var(--border-hair) solid var(--color-border-inverse);
  border-radius: var(--radius-sm);
  color: var(--color-text-inverse);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  cursor: pointer;
  flex: none;
}

.c-header__burger {
  position: relative;
  inline-size: 1.15rem;
  block-size: 0.75rem;
  flex: none;
}

.c-header__burger::before,
.c-header__burger::after,
.c-header__burger span {
  content: "";
  position: absolute;
  inset-inline: 0;
  block-size: var(--border-medium);
  background-color: currentColor;
  transition: var(--transition-transform);
}

.c-header__burger::before { inset-block-start: 0; }
.c-header__burger span    { inset-block-start: 50%; translate: 0 -50%; }
.c-header__burger::after  { inset-block-end: 0; }

[aria-expanded="true"] .c-header__burger::before {
  inset-block-start: 50%;
  rotate: 45deg;
  translate: 0 -50%;
}

[aria-expanded="true"] .c-header__burger span { opacity: 0; }

[aria-expanded="true"] .c-header__burger::after {
  inset-block-end: 50%;
  rotate: -45deg;
  translate: 0 50%;
}


/* ==========================================================================
   7. UTILITARE
   ========================================================================== */

.u-sr-only {
  position: absolute;
  inline-size: var(--border-hair);
  block-size: var(--border-hair);
  padding: 0;
  margin: calc(var(--border-hair) * -1);
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.u-flow > * + * {
  margin-block-start: var(--flow-space, var(--space-sm));
}

.u-flow h2, .u-flow h3 {
  --flow-space: var(--space-lg);
}

.u-flow h2 + *, .u-flow h3 + * {
  --flow-space: var(--space-xs);
}

/* --- 6.9d Centrarea coloanei de continut in widgetul de postare --- */
/* Descendent, nu copil direct: Elementor insereaza .elementor-widget-theme-post-content
   intre .c-post-content si continutul nostru. */

.c-post-content .u-flow.t-readable {
  margin-inline: auto;
}

/* Spatiu intre imaginea hero si inceputul continutului, cand stau in aceeasi sectiune */
.c-post-content {
  margin-block-start: var(--space-lg);
}

.u-full-bleed {
  inline-size: 100vw;
  margin-inline-start: 50%;
  transform: translateX(-50%);
  max-inline-size: none;
}

.u-center {
  margin-inline: auto;
}

.u-text-center {
  text-align: center;
}

.u-text-balance { text-wrap: balance; }
.u-text-pretty { text-wrap: pretty; }

.u-no-scroll {
  overflow: hidden;
}

.u-gap-xs { gap: var(--space-xs); }
.u-gap-sm { gap: var(--space-sm); }
.u-gap-md { gap: var(--space-md); }
.u-gap-lg { gap: var(--space-lg); }

.u-mbs-sm { margin-block-start: var(--space-sm); }
.u-mbs-md { margin-block-start: var(--space-md); }
.u-mbs-lg { margin-block-start: var(--space-lg); }
.u-mbe-sm { margin-block-end: var(--space-sm); }
.u-mbe-md { margin-block-end: var(--space-md); }
.u-mbe-lg { margin-block-end: var(--space-lg); }

.u-list-reset {
  list-style: none;
  padding-inline-start: 0;
}

.u-hide-mobile { display: none; }


/* ==========================================================================
   8. BREAKPOINTS, in em, mobile first
   30em  = mobil mare
   48em  = tableta
   64em  = desktop
   80em  = desktop mare
   ========================================================================== */

@media (min-width: 48em) {
  .u-hide-mobile { display: revert; }
  .u-hide-desktop { display: none; }

  .l-grid--split {
    grid-template-columns: 1.05fr 0.95fr;
    gap: var(--space-xl);
  }

  .c-form__row--2 {
    grid-template-columns: repeat(2, 1fr);
  }

  .c-cta-band {
    padding: var(--space-2xl) var(--space-xl);
  }

  .c-header__toggle { display: none; }

  .c-header__panel,
  .c-header__panel[data-open="true"] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: var(--space-md);
    position: static;
    padding: 0;
    background: none;
    border: 0;
    box-shadow: none;
  }

  .c-header__list {
    flex-direction: row;
    gap: var(--space-sm);
  }

  .c-header__link { padding-block: var(--space-sm); }

  /* Doua coloane. Blocul de brand ocupa toata latimea. */
  .c-footer__grid {
    grid-template-columns: repeat(2, 1fr);
    column-gap: var(--space-xl);
  }

  .c-footer__brand {
    grid-column: 1 / -1;
    max-inline-size: var(--measure-lead);
  }
}

@media (min-width: 64em) {
  .c-form__row--3 {
    grid-template-columns: repeat(3, 1fr);
  }

  .c-cta-band__inner {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-xl);
  }

  /* Patru coloane abia de la 64em, nu mai devreme. */
  .c-footer__grid {
    grid-template-columns: 1.5fr 1fr 1.3fr 1.3fr;
    gap: var(--space-xl);
  }

  .c-footer__brand {
    grid-column: auto;
    max-inline-size: none;
  }
}


/* ==========================================================================
   9. MISCARE REDUSA
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}


/* ==========================================================================
   10. CONTRAST RIDICAT SI TIPARIRE
   ========================================================================== */

@media (forced-colors: active) {
  .c-button,
  .c-card,
  .c-form__control {
    border: var(--border-hair) solid;
  }
}

@media print {
  .c-skip-link,
  .c-filter,
  .c-pagination {
    display: none;
  }

  .l-section {
    padding-block: var(--space-md);
  }
}


/* ==========================================================================
   11. STRAT DE PRIORITATE PESTE ELEMENTOR
   Generat automat din sectiunile 4-7. Nu contine valori noi.
   ========================================================================== */

.l-section--dark.l-section--dark :focus-visible {
  outline-color: var(--color-gold-500);
}

.l-page.l-page {
  display: flex;
  flex-direction: column;
  min-block-size: 100vh;
  min-block-size: 100dvh;
  overflow-x: clip;
}

.l-page.l-page > main {
  flex: 1 0 auto;
}

.l-section.l-section {
  padding-block: var(--section-block);
  padding-inline: 0;
  background-color: var(--surface);
  color: var(--on-surface);
  position: relative;
}

.l-section--compact.l-section--compact {
  padding-block: var(--section-block-compact);
}

.l-section--flush-top.l-section--flush-top {
  padding-block-start: 0;
}

.l-section--dark.l-section--dark {
  --surface: var(--color-brand-900);
  --on-surface: var(--color-text-inverse);
  --on-surface-muted: var(--color-text-inverse-muted);
  --on-surface-border: var(--color-border-inverse);
  --accent-on-surface: var(--color-accent-300);
  --gold-on-surface: var(--color-gold-500);
}

.l-section--tinted.l-section--tinted {
  --surface: var(--color-surface-050);
}

.l-container.l-container {
  padding: 0;
  inline-size: min(100% - (var(--gutter-inline) * 2), var(--container-wide));
  margin-inline: auto;
}

.l-container--content.l-container--content {
  inline-size: min(100% - (var(--gutter-inline) * 2), var(--container-content));
}

.l-container--narrow.l-container--narrow {
  inline-size: min(100% - (var(--gutter-inline) * 2), var(--container-narrow));
}

.l-grid.l-grid {
  display: grid;
  gap: var(--grid-gap);
  padding: 0;
}

.l-grid--2.l-grid--2 {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr));
}

.l-grid--3.l-grid--3 {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--grid-min-col)), 1fr));
}

.l-grid--4.l-grid--4 {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
}

.l-grid--auto.l-grid--auto {
  grid-template-columns: repeat(auto-fill, minmax(min(100%, var(--grid-min-col)), 1fr));
}

.l-grid--split.l-grid--split {
  grid-template-columns: 1fr;
  align-items: center;
}

.l-stack.l-stack {
  display: flex;
  padding: 0;
  flex-direction: column;
  gap: var(--stack-gap, var(--space-sm));
}

.l-stack--lg.l-stack--lg {
  --stack-gap: var(--space-lg);
}

.l-stack--md.l-stack--md {
  --stack-gap: var(--space-md);
}

.l-stack--xs.l-stack--xs {
  --stack-gap: var(--space-xs);
}

.l-cluster.l-cluster {
  display: flex;
  padding: 0;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--cluster-gap, var(--space-xs));
}

.l-cluster--sm.l-cluster--sm {
  --cluster-gap: var(--space-2xs);
}

.l-cluster--md.l-cluster--md {
  --cluster-gap: var(--space-sm);
}

.l-split.l-split {
  display: flex;
  padding: 0;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-sm);
}

.t-eyebrow.t-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2xs);
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  letter-spacing: var(--ls-eyebrow);
  text-transform: uppercase;
  line-height: 1.2;
  color: var(--gold-on-surface);
}

.t-eyebrow.t-eyebrow::before {
  content: "";
  inline-size: var(--space-md);
  block-size: var(--border-medium);
  background-color: currentColor;
  flex: none;
}

.t-display.t-display {
  font-family: var(--font-heading);
  font-size: var(--fs-h1);
  font-weight: var(--fw-black);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-tight);
  max-inline-size: var(--measure-heading);
  text-wrap: balance;
}

.t-h1.t-h1 {
  font-size: var(--fs-h1);
  font-weight: var(--fw-black);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-tight);
  max-inline-size: var(--measure-heading);
}

.t-h2.t-h2 {
  font-size: var(--fs-h2);
  font-weight: var(--fw-bold);
  max-inline-size: var(--measure-heading);
}

.t-h3.t-h3 {
  font-size: var(--fs-h3); font-weight: var(--fw-bold);
}

.t-h4.t-h4 {
  font-size: var(--fs-h4); font-weight: var(--fw-medium);
}

.t-lead.t-lead {
  font-size: var(--fs-lead);
  font-family: var(--font-body);
  font-weight: var(--fw-regular);
  line-height: 1.5;
  color: var(--on-surface-muted);
  max-inline-size: var(--measure-lead);
  text-wrap: pretty;
}

.t-body.t-body {
  font-size: var(--fs-body);
  font-family: var(--font-body);
  font-weight: var(--fw-regular);
  line-height: var(--lh-body);
}

.t-small.t-small {
  font-size: var(--fs-sm);
  font-family: var(--font-body);
  font-weight: var(--fw-regular);
  line-height: 1.5;
}

.t-xs.t-xs {
  font-size: var(--fs-xs);
  font-family: var(--font-body);
  font-weight: var(--fw-regular);
  line-height: 1.4;
}

.t-readable.t-readable {
  max-inline-size: var(--measure-body);
  text-wrap: pretty;
}

.t-muted.t-muted {
  color: var(--on-surface-muted);
}

.t-inverse.t-inverse {
  color: var(--color-text-inverse);
}

.t-body.t-body a:not(.c-button.c-button):not(.c-link-arrow.c-link-arrow),
.t-readable.t-readable a:not(.c-button.c-button):not(.c-link-arrow.c-link-arrow) {
  color: var(--accent-on-surface);
  text-decoration: underline;
  text-decoration-thickness: var(--border-hair);
  transition: var(--transition-color);
}

.t-body.t-body a:hover,
.t-readable.t-readable a:hover {
  text-decoration-thickness: var(--border-medium);
}

.c-button.c-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2xs);
  min-block-size: var(--control-min-block);
  padding-block: var(--space-2xs);
  padding-inline: var(--control-padding-inline);
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  /* line-height 1 lasa caseta de linie sa se stranga pe litere.
  Peste 1, spatiul in plus se imparte egal fata de caseta de continut,
  nu fata de literele vizibile, iar textul pare urcat. */
  line-height: 1;
  text-align: center;
  text-decoration: none;
  border: var(--border-medium) solid transparent;
  border-radius: var(--radius-sm);
  cursor: pointer;
  white-space: nowrap;
  transition: var(--transition-color);
}

.c-button--wrap.c-button--wrap {
  white-space: normal;
}

.c-button--primary.c-button--primary {
  background-color: var(--color-gold-500);
  border-color: var(--color-gold-500);
  color: var(--color-brand-900);
}

.c-button--primary.c-button--primary:hover,
.c-button--primary.c-button--primary:focus-visible {
  background-color: var(--color-gold-700);
  border-color: var(--color-gold-700);
  color: var(--color-surface-000);
}

.c-button--secondary.c-button--secondary {
  background-color: transparent;
  border-color: var(--color-brand-900);
  color: var(--color-brand-900);
}

.c-button--secondary.c-button--secondary:hover,
.c-button--secondary.c-button--secondary:focus-visible {
  background-color: var(--color-brand-900);
  color: var(--color-text-inverse);
}

.l-section--dark.l-section--dark .c-button--secondary.c-button--secondary,
.c-cta-band.c-cta-band .c-button--secondary.c-button--secondary {
  border-color: var(--color-surface-050);
  color: var(--color-surface-050);
}

.l-section--dark.l-section--dark .c-button--secondary.c-button--secondary:hover,
.c-cta-band.c-cta-band .c-button--secondary.c-button--secondary:hover {
  background-color: var(--color-surface-050);
  color: var(--color-brand-900);
}

.c-button--ghost.c-button--ghost {
  background-color: transparent;
  border-color: transparent;
  color: var(--on-surface);
  padding-inline: var(--space-xs);
  text-decoration: underline;
  text-decoration-thickness: var(--border-hair);
}

.c-button--ghost.c-button--ghost:hover {
  color: var(--accent-on-surface);
  text-decoration-thickness: var(--border-medium);
}

.c-button--block.c-button--block {
  inline-size: 100%;
}

.c-button.c-button[aria-disabled="true"],
.c-button.c-button:disabled {
  opacity: var(--opacity-disabled);
  cursor: not-allowed;
}

.c-link-arrow.c-link-arrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2xs);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  color: var(--accent-on-surface);
  text-decoration: underline;
  text-decoration-thickness: var(--border-hair);
  text-underline-offset: 0.25em;
  transition: var(--transition-color);
}

.c-link-arrow.c-link-arrow::after {
  content: "";
  inline-size: 0.5em;
  block-size: 0.5em;
  border-block-start: var(--border-medium) solid currentColor;
  border-inline-end: var(--border-medium) solid currentColor;
  transform: rotate(45deg);
  transition: var(--transition-transform);
  flex: none;
}

.c-link-arrow.c-link-arrow:hover::after {
  transform: rotate(45deg) translate(0.15em, -0.15em);
}

.c-card.c-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  padding: var(--space-md);
  background-color: var(--color-surface-000);
  border: var(--border-hair) solid var(--color-border);
  border-radius: var(--radius-md);
  block-size: 100%;
  transition: border-color var(--duration-base) var(--ease-out),
  box-shadow var(--duration-base) var(--ease-out);
}

.c-card.c-card:hover {
  border-color: var(--color-gold-500);
  box-shadow: var(--shadow-sm);
}

.c-card.c-card:focus-within {
  border-color: var(--color-gold-500);
}

.l-section--dark.l-section--dark .c-card.c-card {
  background-color: color-mix(in srgb, var(--color-surface-050) 6%, transparent);
  border-color: var(--color-border-inverse);
}

.c-card__title.c-card__title {
  font-family: var(--font-heading);
  font-size: var(--fs-h4);
  font-weight: var(--fw-bold);
  line-height: var(--lh-heading);
  letter-spacing: var(--ls-heading);
  text-align: start;
  margin: 0;
}

.c-card__title.c-card__title a {
  text-decoration: none;
}

.c-card__title.c-card__title a::after {
  content: "";
  position: absolute;
  inset: 0;
}

.c-card__text.c-card__text {
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  font-weight: var(--fw-regular);
  line-height: var(--lh-body);
  color: var(--color-text-muted);
  margin: 0;
  flex: 1 1 auto;
}

.l-section--dark.l-section--dark .c-card__text.c-card__text {
  color: var(--color-text-inverse-muted);
}

.c-card__media.c-card__media {
  aspect-ratio: var(--ratio-card);
  overflow: hidden;
  border-radius: var(--radius-sm);
  background-color: var(--color-surface-050);
  margin-block-end: var(--space-2xs);
}

.c-card__media.c-card__media img {
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
}

.c-card--service.c-card--service {
  position: relative;
  padding-block-start: var(--space-md);
}

.c-card--project.c-card--project {
  position: relative;
  padding: 0;
  overflow: hidden;
}

.c-card--project.c-card--project .c-card__media.c-card__media {
  border-radius: 0;
  margin-block-end: 0;
}

.c-card--project.c-card--project .c-card__body.c-card__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-2xs);
  padding: var(--space-sm) var(--space-md) var(--space-md);
}

.c-card--article.c-card--article {
  position: relative;
  padding: 0;
  overflow: hidden;
}

.c-card--article.c-card--article .c-card__media.c-card__media {
  aspect-ratio: var(--ratio-wide);
  border-radius: 0;
  margin-block-end: 0;
}

.c-card--article.c-card--article .c-card__body.c-card__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-2xs);
  padding: var(--space-sm) var(--space-md) var(--space-md);
}

.c-card__meta.c-card__meta {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: var(--space-2xs) var(--space-xs);
  font-size: var(--fs-xs);
  color: var(--color-text-muted);
}

.c-icon-box.c-icon-box {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  inline-size: clamp(2.75rem, 2.4rem + 1.4vw, 3.5rem);
  aspect-ratio: var(--ratio-square);
  border-radius: var(--radius-sm);
  background-color: color-mix(in srgb, var(--color-gold-500) 18%, transparent);
  color: var(--color-gold-700);
  flex: none;
}

.l-section--dark.l-section--dark .c-icon-box.c-icon-box {
  background-color: color-mix(in srgb, var(--color-gold-500) 22%, transparent);
  color: var(--color-gold-500);
}

.c-icon-box.c-icon-box svg,
.c-icon-box.c-icon-box img {
  inline-size: 62%;
  block-size: 62%;
}

.c-badge.c-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3xs);
  padding-block: var(--space-3xs);
  padding-inline: var(--space-2xs);
  font-size: var(--fs-xs);
  font-weight: var(--fw-medium);
  line-height: 1.3;
  border-radius: var(--radius-sm);
  background-color: var(--color-surface-050);
  color: var(--color-brand-900);
  border: var(--border-hair) solid var(--color-border);
}

.c-badge--accent.c-badge--accent {
  background-color: color-mix(in srgb, var(--color-accent-600) 12%, transparent);
  border-color: color-mix(in srgb, var(--color-accent-600) 30%, transparent);
  color: var(--color-accent-600);
}

.l-section--dark.l-section--dark .c-badge.c-badge {
  background-color: color-mix(in srgb, var(--color-surface-050) 10%, transparent);
  border-color: var(--color-border-inverse);
  color: var(--color-surface-050);
}

.c-breadcrumbs.c-breadcrumbs {
  font-size: var(--fs-xs);
  color: var(--on-surface-muted);
}

.c-breadcrumbs.c-breadcrumbs ol {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3xs) var(--space-2xs);
  list-style: none;
  padding-inline-start: 0;
}

.c-breadcrumbs.c-breadcrumbs li {
  display: flex;
  align-items: center;
  gap: var(--space-3xs) var(--space-2xs);
}

.c-breadcrumbs.c-breadcrumbs li:not(:last-child)::after {
  content: "/";
  color: var(--on-surface-border);
}

.c-breadcrumbs.c-breadcrumbs a {
  color: inherit;
  text-decoration: underline;
  text-decoration-thickness: var(--border-hair);
}

.c-breadcrumbs.c-breadcrumbs [aria-current="page"] {
  color: var(--on-surface);
  font-weight: var(--fw-medium);
}

.c-cta-band.c-cta-band {
  --surface: var(--color-brand-900);
  --on-surface: var(--color-text-inverse);
  --on-surface-muted: var(--color-text-inverse-muted);
  --on-surface-border: var(--color-border-inverse);
  --gold-on-surface: var(--color-gold-500);
  --accent-on-surface: var(--color-accent-300);
  background-color: var(--surface);
  color: var(--on-surface);
  border-radius: var(--radius-lg);
  padding: var(--space-xl) var(--space-lg);
  position: relative;
  overflow: hidden;
}

.c-cta-band__inner.c-cta-band__inner {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  z-index: 1;
}

.c-roofline.c-roofline {
  display: block;
  inline-size: 100%;
  block-size: var(--space-sm);
  background-image: linear-gradient(
  135deg,
  var(--color-gold-700) 0%,
  var(--color-gold-500) 45%,
  var(--color-accent-600) 45%,
  var(--color-accent-600) 100%
  );
  border-radius: var(--radius-pill);
}

.c-roofline--short.c-roofline--short {
  inline-size: clamp(3rem, 2rem + 4vw, 6rem);
  block-size: var(--space-3xs);
}

.c-form.c-form {
  display: grid;
  gap: var(--space-sm);
}

.c-form__row.c-form__row {
  display: grid;
  gap: var(--space-sm);
}

.c-form__field.c-form__field {
  display: flex;
  flex-direction: column;
  gap: var(--space-3xs);
}

.c-form__label.c-form__label {
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  color: var(--on-surface);
}

.c-form__required.c-form__required {
  color: var(--color-error);
  margin-inline-start: var(--space-3xs);
}

.c-form__hint.c-form__hint {
  font-size: var(--fs-xs);
  color: var(--on-surface-muted);
}

.c-form__control.c-form__control {
  min-block-size: var(--control-min-block);
  padding-block: var(--space-2xs);
  padding-inline: var(--space-xs);
  inline-size: 100%;
  font-size: var(--fs-body);
  color: var(--color-text);
  background-color: var(--color-surface-000);
  border: var(--border-hair) solid var(--color-border-strong);
  border-radius: var(--radius-sm);
  transition: var(--transition-color);
}

textarea.c-form__control.c-form__control {
  min-block-size: clamp(7rem, 6rem + 4vw, 10rem);
  resize: vertical;
  line-height: var(--lh-body);
}

.c-form__control.c-form__control:hover {
  border-color: var(--color-brand-900);
}

.c-form__control.c-form__control[aria-invalid="true"] {
  border-color: var(--color-error);
  border-inline-start-width: var(--border-thick);
}

.c-form__error.c-form__error {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: var(--space-3xs);
  font-size: var(--fs-xs);
  font-weight: var(--fw-medium);
  color: var(--color-error);
}

.c-form__error.c-form__error::before {
  content: "!";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  inline-size: 1.1em;
  block-size: 1.1em;
  border-radius: var(--radius-pill);
  background-color: var(--color-error);
  color: var(--color-surface-000);
  font-size: 0.85em;
  flex: none;
}

.c-form__success.c-form__success {
  display: flex;
  flex-direction: row;
  gap: var(--space-2xs);
  padding: var(--space-sm);
  font-size: var(--fs-sm);
  border-radius: var(--radius-sm);
  background-color: color-mix(in srgb, var(--color-success) 10%, transparent);
  border-inline-start: var(--border-thick) solid var(--color-success);
  color: var(--color-success);
}

.c-form__consent.c-form__consent {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: var(--space-2xs);
  font-size: var(--fs-sm);
}

.c-form__consent.c-form__consent input[type="checkbox"] {
  inline-size: 1.25rem;
  block-size: 1.25rem;
  margin-block-start: 0.2em;
  accent-color: var(--color-brand-900);
  flex: none;
}

.c-form.c-form.c-form .jet-search__form.jet-search__form {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: stretch;
  gap: var(--space-2xs);
}

.c-form.c-form.c-form .jet-search__label.jet-search__label {
  flex: 1 1 16rem;
  min-inline-size: 0;
  margin-block: 0;
}

.c-form.c-form.c-form .jet-search__field.jet-search__field {
  min-block-size: var(--control-min-block);
  padding-block: var(--space-2xs);
  padding-inline: var(--space-xs);
  inline-size: 100%;
  font-family: var(--font-body);
  font-size: var(--fs-body);
  color: var(--color-text);
  background-color: var(--color-surface-000);
  border: var(--border-hair) solid var(--color-border-strong);
  border-radius: var(--radius-sm);
}

.c-form.c-form.c-form .jet-search__field.jet-search__field:hover {
  border-color: var(--color-brand-900);
}

.c-form__control.c-form__control::placeholder,
.c-form.c-form.c-form .jet-search__field.jet-search__field::placeholder {
  font-weight: var(--fw-regular);
  color: var(--on-surface-muted);
  opacity: 1;
}

.c-form.c-form.c-form .jet-search__submit.jet-search__submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-block-size: var(--control-min-block);
  padding-block: var(--space-2xs);
  padding-inline: var(--control-padding-inline);
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  line-height: 1;
  background-color: var(--color-gold-500);
  border: var(--border-medium) solid var(--color-gold-500);
  border-radius: var(--radius-sm);
  color: var(--color-brand-900);
  white-space: nowrap;
}

.c-form.c-form.c-form .jet-search__submit.jet-search__submit:hover,
.c-form.c-form.c-form .jet-search__submit.jet-search__submit:focus-visible {
  background-color: var(--color-gold-700);
  border-color: var(--color-gold-700);
  color: var(--color-surface-000);
}

.c-callout.c-callout {
  display: flex;
  flex-direction: column;
  gap: var(--space-2xs);
  padding: var(--space-md);
  background-color: var(--color-surface-050);
  border-inline-start: var(--border-thick) solid var(--color-gold-500);
  border-radius: var(--radius-sm);
}

.c-callout.c-callout p { margin-block: 0; }

.c-callout.c-callout .t-body:not(:first-child) { margin-block-start: var(--space-2xs); }

.c-table-wrap.c-table-wrap {
  overflow-x: auto;
  border: var(--border-hair) solid var(--color-border);
  border-radius: var(--radius-sm);
}

.c-table.c-table {
  inline-size: 100%;
  border-collapse: collapse;
  font-size: var(--fs-sm);
}

.c-table.c-table th,
.c-table.c-table td {
  padding: var(--space-xs) var(--space-sm);
  text-align: start;
  vertical-align: top;
  border-block-end: var(--border-hair) solid var(--color-border);
}

.c-table.c-table th {
  background-color: var(--color-surface-050);
  font-family: var(--font-heading);
  font-weight: var(--fw-bold);
  color: var(--color-brand-900);
}

.c-table.c-table tr:last-child td { border-block-end: 0; }

.c-accordion.c-accordion {
  display: flex;
  flex-direction: column;
  border-block-start: var(--border-hair) solid var(--on-surface-border);
}

.c-accordion__item.c-accordion__item {
  border-block-end: var(--border-hair) solid var(--on-surface-border);
}

.c-accordion__trigger.c-accordion__trigger {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-sm);
  inline-size: 100%;
  min-block-size: var(--control-min-block);
  padding-block: var(--space-sm);
  padding-inline: 0;
  background: none;
  border: 0;
  text-align: start;
  font-family: var(--font-heading);
  font-size: var(--fs-lead);
  font-weight: var(--fw-medium);
  line-height: var(--lh-heading);
  color: var(--on-surface);
  cursor: pointer;
  transition: var(--transition-color);
}

.c-accordion__trigger.c-accordion__trigger:hover {
  color: var(--gold-on-surface);
}

.c-accordion__icon.c-accordion__icon {
  position: relative;
  inline-size: var(--space-sm);
  block-size: var(--space-sm);
  margin-block-start: 0.35em;
  flex: none;
}

.c-accordion__icon.c-accordion__icon::before,
.c-accordion__icon.c-accordion__icon::after {
  content: "";
  position: absolute;
  inset-block-start: 50%;
  inset-inline-start: 0;
  inline-size: 100%;
  block-size: var(--border-medium);
  background-color: currentColor;
  transition: var(--transition-transform);
}

.c-accordion__icon.c-accordion__icon::after {
  transform: rotate(90deg);
}

.c-accordion__trigger.c-accordion__trigger[aria-expanded="true"] .c-accordion__icon.c-accordion__icon::after {
  transform: rotate(0deg);
}

.c-accordion__panel.c-accordion__panel {
  padding-block-end: var(--space-md);
  max-inline-size: var(--measure-body);
  color: var(--on-surface-muted);
}

.c-accordion__panel.c-accordion__panel[hidden] {
  display: none;
}

summary.c-accordion__trigger.c-accordion__trigger {
  list-style: none;
}

summary.c-accordion__trigger.c-accordion__trigger::-webkit-details-marker {
  display: none;
}

summary.c-accordion__trigger.c-accordion__trigger::marker {
  display: none;
}

.c-accordion__item.c-accordion__item {
  --icon-rot: 90deg;
}

.c-accordion__item.c-accordion__item[open] {
  --icon-rot: 0deg;
}

.c-accordion__icon.c-accordion__icon.c-accordion__icon.c-accordion__icon::after {
  transform: rotate(var(--icon-rot, 90deg));
}

/* Protectie: daca un script de acordeon scris pentru <button> apuca sa puna
   aria-expanded pe <summary> sau hidden pe panou, starea nativa a lui
   <details> ramane singura care conteaza. */
details.c-accordion__item summary.c-accordion__trigger[aria-expanded] .c-accordion__icon.c-accordion__icon.c-accordion__icon.c-accordion__icon::after {
  transform: rotate(var(--icon-rot, 90deg));
}

details.c-accordion__item > .c-accordion__panel[hidden],
details.c-accordion__item .c-accordion__panel.c-accordion__panel[hidden] {
  display: block;
}

.c-pagination.c-pagination ol {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: var(--space-2xs);
  list-style: none;
  padding-inline-start: 0;
  justify-content: center;
}

.c-pagination.c-pagination a,
.c-pagination.c-pagination span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-inline-size: var(--control-min-block);
  min-block-size: var(--control-min-block);
  padding-inline: var(--space-2xs);
  font-size: var(--fs-sm);
  font-weight: var(--fw-medium);
  text-decoration: none;
  border: var(--border-hair) solid var(--color-border);
  border-radius: var(--radius-sm);
  transition: var(--transition-color);
}

.c-pagination.c-pagination a:hover {
  border-color: var(--color-brand-900);
  background-color: var(--color-surface-050);
}

.c-pagination.c-pagination [aria-current="page"] {
  background-color: var(--color-brand-900);
  border-color: var(--color-brand-900);
  color: var(--color-text-inverse);
}

.c-filter.c-filter {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--space-sm);
  padding: var(--space-md);
  background-color: var(--color-surface-050);
  border: var(--border-hair) solid var(--color-border);
  border-radius: var(--radius-md);
}

.c-filter__group.c-filter__group {
  display: flex;
  flex-direction: column;
  gap: var(--space-3xs);
  flex: 1 1 12rem;
  min-inline-size: 0;
}

.c-filter__label.c-filter__label {
  font-size: var(--fs-xs);
  font-weight: var(--fw-bold);
  letter-spacing: var(--ls-eyebrow);
  text-transform: uppercase;
  color: var(--color-text-muted);
}

.c-filter__status.c-filter__status {
  inline-size: 100%;
  font-size: var(--fs-sm);
  color: var(--color-text-muted);
}

.c-filter__empty.c-filter__empty {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-sm);
  padding: var(--space-xl) var(--space-md);
  border: var(--border-medium) dashed var(--color-border);
  border-radius: var(--radius-md);
  max-inline-size: var(--measure-body);
}

.c-skip-link.c-skip-link {
  position: absolute;
  inset-block-start: var(--space-2xs);
  inset-inline-start: var(--space-2xs);
  z-index: 999;
  padding-block: var(--space-2xs);
  padding-inline: var(--space-sm);
  background-color: var(--color-brand-900);
  color: var(--color-text-inverse);
  border-radius: var(--radius-sm);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  text-decoration: none;
  transform: translateY(-200%);
  transition: transform var(--duration-fast) var(--ease-out);
}

.c-skip-link.c-skip-link:focus {
  transform: translateY(0);
}

.c-section-head.c-section-head {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  margin-block-end: var(--space-lg);
  max-inline-size: var(--measure-body);
}

.c-section-head--split.c-section-head--split {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-md);
  max-inline-size: none;
}

.c-steps.c-steps {
  list-style: none;
  padding-inline-start: 0;
  display: grid;
  gap: var(--space-md);
  counter-reset: step;
}

.c-steps__item.c-steps__item {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-sm);
  align-items: start;
  counter-increment: step;
}

.c-steps__item.c-steps__item::before {
  content: counter(step, decimal-leading-zero);
  font-family: var(--font-heading);
  font-size: var(--fs-h4);
  font-weight: var(--fw-black);
  line-height: 1;
  color: var(--gold-on-surface);
  padding-block-start: 0.1em;
}

.c-footer.c-footer {
  padding-block: var(--space-xl);
  background-color: var(--surface);
  color: var(--on-surface);
}

.c-footer__grid.c-footer__grid {
  display: grid;
  padding: 0;
  gap: var(--space-lg);
  grid-template-columns: 1fr;
}

.c-footer__logo.c-footer__logo {
  inline-size: clamp(6.5rem, 5.5rem + 3vw, 8.5rem);
  block-size: auto;
}

.c-footer__head.c-footer__head {
  font-family: var(--font-heading);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  letter-spacing: var(--ls-eyebrow);
  text-transform: uppercase;
  line-height: 1.2;
  color: var(--gold-on-surface);
}

.c-footer__list.c-footer__list {
  display: flex;
  flex-direction: column;
  gap: var(--space-2xs);
  list-style: none;
  padding-inline-start: 0;
}

.c-footer__list.c-footer__list > * {
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  font-weight: var(--fw-regular);
  line-height: 1.45;
  color: var(--on-surface-muted);
}

.c-footer__list.c-footer__list a {
  color: var(--on-surface-muted);
  text-decoration: none;
  transition: var(--transition-color);
}

.c-footer__list.c-footer__list a:hover,
.c-footer__list.c-footer__list a:focus-visible {
  color: var(--on-surface);
  text-decoration: underline;
  text-decoration-thickness: var(--border-hair);
}

.c-footer__phones.c-footer__phones {
  display: flex;
  flex-direction: row;
  padding: 0;
  flex-wrap: wrap;
  gap: var(--space-2xs);
}

.c-footer__note.c-footer__note {
  margin-block-start: var(--space-sm);
  padding-block-start: var(--space-sm);
  border-block-start: var(--border-hair) solid var(--on-surface-border);
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  font-weight: var(--fw-medium);
  line-height: 1.45;
  color: var(--gold-on-surface);
}

.c-footer__legal.c-footer__legal,
.c-footer__bottom.c-footer__bottom {
  padding-inline: 0;
  margin-block-start: var(--space-md);
  padding-block-start: var(--space-sm);
  border-block-start: var(--border-hair) solid var(--on-surface-border);
}

.c-footer__legal.c-footer__legal {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-3xs) var(--space-xs);
}

.c-footer__legal.c-footer__legal > * {
  display: inline-flex;
  align-items: baseline;
  gap: var(--space-xs);
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--fs-xs);
  font-weight: var(--fw-regular);
  line-height: 1.5;
  color: var(--on-surface-muted);
}

.c-footer__legal.c-footer__legal > *:not(:last-child)::after {
  content: "\00B7";
  color: var(--on-surface-border);
}

.c-footer__bottom.c-footer__bottom {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2xs) var(--space-md);
}

.c-footer__bottom.c-footer__bottom > * {
  flex: 0 1 auto;
  inline-size: auto;
  max-inline-size: none;
  margin: 0;
}

.c-footer__policies.c-footer__policies {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: var(--space-2xs) var(--space-sm);
  list-style: none;
  padding-inline-start: 0;
}

.c-footer__policies.c-footer__policies a {
  font-size: var(--fs-xs);
  color: var(--on-surface-muted);
  text-decoration: underline;
  text-decoration-thickness: var(--border-hair);
}

.c-footer__policies.c-footer__policies a:hover {
  color: var(--on-surface);
}

.c-link-plain.c-link-plain,
.c-footer__list.c-footer__list a,
.c-header__link.c-header__link {
  display: inline-flex;
  align-items: center;
  min-block-size: auto;
  padding: 0;
  background: none;
  background-color: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  text-align: start;
  text-transform: none;
  letter-spacing: normal;
  font-family: var(--font-body);
  cursor: pointer;
}

.c-link-plain.c-link-plain {
  font-size: var(--fs-sm);
  font-weight: var(--fw-regular);
  color: var(--on-surface-muted);
  text-decoration: none;
  transition: var(--transition-color);
}

.c-link-plain.c-link-plain:hover,
.c-link-plain.c-link-plain:focus-visible {
  color: var(--on-surface);
  text-decoration: underline;
  text-decoration-thickness: var(--border-hair);
}

.c-header__link.c-header__link {
  display: block;
  padding-block: var(--space-2xs);
  font-weight: var(--fw-bold);
  letter-spacing: var(--ls-eyebrow);
  text-transform: uppercase;
}

.is-placeholder.is-placeholder {
  background-color: #FFE9A8;
  color: #4A3200;
  padding-inline: 0.35em;
  padding-block: 0.1em;
  border-radius: var(--radius-sm);
  font-weight: var(--fw-medium);
  text-decoration: underline dotted #93661D;
  text-underline-offset: 0.2em;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

.c-header.c-header {
  position: sticky;
  inset-block-start: 0;
  z-index: 100;
  background-color: var(--color-brand-900);
  color: var(--color-text-inverse);
  border-block-end: var(--border-hair) solid var(--color-border-inverse);
}

.c-header__inner.c-header__inner {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  column-gap: var(--space-sm);
  min-block-size: clamp(4.25rem, 3.8rem + 1.8vw, 5.5rem);
  padding: 0;
  position: relative;
}

.c-header__inner.c-header__inner > * {
  min-inline-size: 0;
}

.c-header__logo.c-header__logo {
  display: block;
  block-size: clamp(2.6rem, 2.3rem + 1.3vw, 3.5rem);
  inline-size: auto;
  max-inline-size: none;
  object-fit: contain;
  flex: none;
}

.c-header__logo-link.c-header__logo-link {
  display: inline-flex;
  align-items: center;
  flex: none;
  padding: 0;
  line-height: 0;
}

.c-header__panel.c-header__panel {
  display: none;
}

.c-header__panel.c-header__panel[data-open="true"] {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--space-md);
  position: absolute;
  inset-inline: 0;
  inset-block-start: 100%;
  padding: var(--space-md);
  background-color: var(--color-brand-800);
  border-block-start: var(--border-hair) solid var(--color-border-inverse);
  box-shadow: var(--shadow-lg);
}

.c-header__list.c-header__list {
  display: flex;
  flex-direction: column;
  gap: var(--space-2xs);
  list-style: none;
  padding-inline-start: 0;
}

.c-header__link.c-header__link {
  display: block;
  padding-block: var(--space-2xs);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  letter-spacing: var(--ls-eyebrow);
  text-transform: uppercase;
  text-decoration: none;
  color: var(--color-text-inverse-muted);
  transition: var(--transition-color);
  position: relative;
}

.c-header__link.c-header__link:hover,
.c-header__link.c-header__link:focus-visible {
  color: var(--color-surface-000);
}

.c-header__link.c-header__link[aria-current="page"] {
  color: var(--color-surface-000);
}

.c-header__link.c-header__link[aria-current="page"]::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  inset-block-end: 0;
  block-size: var(--border-medium);
  background-color: var(--color-gold-500);
}

.c-header__actions.c-header__actions {
  display: flex;
  flex-direction: row;
  justify-self: end;
  flex: none;
  padding: 0;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2xs);
}

.c-header__phone.c-header__phone {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2xs);
  min-block-size: var(--control-min-block);
  padding-inline: var(--space-2xs);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  color: var(--color-gold-500);
  text-decoration: none;
  white-space: nowrap;
  transition: var(--transition-color);
}

.c-header__phone.c-header__phone:hover {
  color: var(--color-surface-000);
}

.c-header__phone.c-header__phone svg {
  inline-size: 1.15em; block-size: 1.15em; flex: none;
}

.c-header__toggle.c-header__toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2xs);
  min-block-size: var(--control-min-block);
  min-inline-size: var(--control-min-block);
  padding-inline: var(--space-2xs);
  background: none;
  border: var(--border-hair) solid var(--color-border-inverse);
  border-radius: var(--radius-sm);
  color: var(--color-text-inverse);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  cursor: pointer;
  flex: none;
}

.c-header__burger.c-header__burger {
  position: relative;
  inline-size: 1.15rem;
  block-size: 0.75rem;
  flex: none;
}

.c-header__burger.c-header__burger::before,
.c-header__burger.c-header__burger::after,
.c-header__burger.c-header__burger span {
  content: "";
  position: absolute;
  inset-inline: 0;
  block-size: var(--border-medium);
  background-color: currentColor;
  transition: var(--transition-transform);
}

.c-header__burger.c-header__burger::before {
  inset-block-start: 0;
}

.c-header__burger.c-header__burger span {
  inset-block-start: 50%; translate: 0 -50%;
}

.c-header__burger.c-header__burger::after {
  inset-block-end: 0;
}

[aria-expanded="true"] .c-header__burger.c-header__burger::before {
  inset-block-start: 50%;
  rotate: 45deg;
  translate: 0 -50%;
}

[aria-expanded="true"] .c-header__burger.c-header__burger span {
  opacity: 0;
}

[aria-expanded="true"] .c-header__burger.c-header__burger::after {
  inset-block-end: 50%;
  rotate: -45deg;
  translate: 0 50%;
}

.u-sr-only.u-sr-only {
  position: absolute;
  inline-size: var(--border-hair);
  block-size: var(--border-hair);
  padding: 0;
  margin: calc(var(--border-hair) * -1);
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.u-flow.u-flow > * + * {
  margin-block-start: var(--flow-space, var(--space-sm));
}

.u-flow.u-flow h2,
.u-flow.u-flow h3 {
  --flow-space: var(--space-lg);
}

.u-flow.u-flow h2 + *,
.u-flow.u-flow h3 + * {
  --flow-space: var(--space-xs);
}

.c-post-content.c-post-content .u-flow.u-flow.t-readable.t-readable {
  margin-inline: auto;
}

.c-post-content.c-post-content.c-post-content {
  margin-block-start: var(--space-lg);
}

.u-full-bleed.u-full-bleed {
  inline-size: 100vw;
  margin-inline-start: 50%;
  transform: translateX(-50%);
  max-inline-size: none;
}

.u-center.u-center {
  margin-inline: auto;
}

.u-text-center.u-text-center {
  text-align: center;
}

.u-text-balance.u-text-balance {
  text-wrap: balance;
}

.u-text-pretty.u-text-pretty {
  text-wrap: pretty;
}

.u-no-scroll.u-no-scroll {
  overflow: hidden;
}

.u-gap-xs.u-gap-xs {
  gap: var(--space-xs);
}

.u-gap-sm.u-gap-sm {
  gap: var(--space-sm);
}

.u-gap-md.u-gap-md {
  gap: var(--space-md);
}

.u-gap-lg.u-gap-lg {
  gap: var(--space-lg);
}

.u-mbs-sm.u-mbs-sm {
  margin-block-start: var(--space-sm);
}

.u-mbs-md.u-mbs-md {
  margin-block-start: var(--space-md);
}

.u-mbs-lg.u-mbs-lg {
  margin-block-start: var(--space-lg);
}

.u-mbe-sm.u-mbe-sm {
  margin-block-end: var(--space-sm);
}

.u-mbe-md.u-mbe-md {
  margin-block-end: var(--space-md);
}

.u-mbe-lg.u-mbe-lg {
  margin-block-end: var(--space-lg);
}

.u-list-reset.u-list-reset {
  list-style: none;
  padding-inline-start: 0;
}

.u-hide-mobile.u-hide-mobile {
  display: none;
}

@media (min-width: 48em) {
  .u-hide-mobile.u-hide-mobile {
    display: revert;
  }

  .u-hide-desktop.u-hide-desktop {
    display: none;
  }

  .l-grid--split.l-grid--split {
    grid-template-columns: 1.05fr 0.95fr;
    gap: var(--space-xl);
  }

  .c-form__row--2.c-form__row--2 {
    grid-template-columns: repeat(2, 1fr);
  }

  .c-cta-band.c-cta-band {
    padding: var(--space-2xl) var(--space-xl);
  }

  .c-header__toggle.c-header__toggle {
    display: none;
  }

  .c-header__panel.c-header__panel,
.c-header__panel.c-header__panel[data-open="true"] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: var(--space-md);
    position: static;
    padding: 0;
    background: none;
    border: 0;
    box-shadow: none;
  }

  .c-header__list.c-header__list {
    flex-direction: row;
    gap: var(--space-sm);
  }

  .c-header__link.c-header__link {
    padding-block: var(--space-sm);
  }

  .c-footer__grid.c-footer__grid {
    grid-template-columns: repeat(2, 1fr);
    column-gap: var(--space-xl);
  }

  .c-footer__brand.c-footer__brand {
    grid-column: 1 / -1;
    max-inline-size: var(--measure-lead);
  }
}

@media (min-width: 64em) {
  .c-form__row--3.c-form__row--3 {
    grid-template-columns: repeat(3, 1fr);
  }

  .c-cta-band__inner.c-cta-band__inner {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-xl);
  }

  .c-footer__grid.c-footer__grid {
    grid-template-columns: 1.5fr 1fr 1.3fr 1.3fr;
    gap: var(--space-xl);
  }

  .c-footer__brand.c-footer__brand {
    grid-column: auto;
    max-inline-size: none;
  }
}

@media (forced-colors: active) {
  .c-button.c-button,
.c-card.c-card,
.c-form__control.c-form__control {
    border: var(--border-hair) solid;
  }
}

@media print {
  .c-skip-link.c-skip-link,
.c-filter.c-filter,
.c-pagination.c-pagination {
    display: none;
  }

  .l-section.l-section {
    padding-block: var(--space-md);
  }
}

/* ==========================================================================
   12. NAV MENU - STILURI LEGATE DE STAREA WIDGET-ULUI, NU DE VIEWPORT

   Elementor comuta meniul pe sertar la propriul breakpoint, care poate fi
   diferit de cel din framework. Daca stilurile noastre ar depinde de
   @media, ar exista un interval in care meniul e in sertar dar arata a
   desktop. De aceea totul se leaga de clasele de stare pe care le pune
   chiar Elementor:

     nav.elementor-nav-menu--main       meniul orizontal
     nav.elementor-nav-menu--dropdown   sertarul
     ul.elementor-nav-menu--dropdown    panoul de submeniu

   Asa, oriunde ai muta breakpoint-ul widget-ului, aspectul se potriveste.
   ========================================================================== */

/* --- Comun ambelor stari --- */

.c-header__nav.c-header__nav .elementor-nav-menu.elementor-nav-menu {
  list-style: none;
  padding-inline-start: 0;
  margin: 0;
  background: none;
}

.c-header__nav.c-header__nav .elementor-nav-menu li {
  margin: 0;
}

.c-header__nav.c-header__nav .elementor-item.elementor-item {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.45em;
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  letter-spacing: var(--ls-eyebrow);
  line-height: 1.2;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--color-text-inverse-muted);
  background: none;
  border: 0;
  fill: currentColor;
  transition: var(--transition-color);
}

.c-header__nav.c-header__nav .elementor-item.elementor-item:hover,
.c-header__nav.c-header__nav .elementor-item.elementor-item:focus-visible {
  color: var(--color-surface-000);
  background: none;
}

.c-header__nav.c-header__nav .elementor-item.elementor-item::before {
  display: none;
}

/* Sageata de submeniu, pe aceeasi linie cu textul */
.c-header__nav.c-header__nav .elementor-item .sub-arrow {
  position: static;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  inset: auto;
  margin: 0;
  padding: 0;
  inline-size: auto;
  block-size: auto;
  min-inline-size: 0;
  transform: none;
  translate: 0 0.05em;
  background: none;
  border: 0;
}

.c-header__nav.c-header__nav .sub-arrow svg {
  inline-size: 0.85em;
  block-size: 0.85em;
  fill: currentColor;
  color: inherit;
}

.c-header__nav.c-header__nav .sub-arrow i {
  font-size: 0.85em;
  line-height: 1;
  color: inherit;
}


/* --- STAREA ORIZONTALA --- */

.c-header__nav.c-header__nav .elementor-nav-menu--main > .elementor-nav-menu {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
  gap: var(--space-sm);
}

.c-header__nav.c-header__nav .elementor-nav-menu--main .elementor-item.elementor-item {
  padding-block: var(--space-sm);
  padding-inline: 0;
  white-space: nowrap;
}

/* Linia aurie pe pagina curenta */
.c-header__nav.c-header__nav .elementor-nav-menu--main .elementor-item.elementor-item-active,
.c-header__nav.c-header__nav .elementor-nav-menu--main .elementor-item.elementor-item[aria-current="page"] {
  color: var(--color-surface-000);
}

.c-header__nav.c-header__nav .elementor-nav-menu--main .elementor-item.elementor-item-active::after,
.c-header__nav.c-header__nav .elementor-nav-menu--main .elementor-item.elementor-item[aria-current="page"]::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  inset-block-end: 0;
  block-size: var(--border-medium);
  background-color: var(--color-gold-500);
}

/* Panoul de submeniu, doar in starea orizontala */
.c-header__nav.c-header__nav .elementor-nav-menu--main ul.elementor-nav-menu--dropdown {
  background-color: var(--color-brand-800);
  border: var(--border-hair) solid var(--color-border-inverse);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-lg);
  min-inline-size: 16rem;
  padding-block: var(--space-2xs);
  overflow: hidden;
}


/* --- STAREA DE SERTAR --- */

.c-header__nav.c-header__nav nav.elementor-nav-menu--dropdown {
  background-color: var(--color-brand-800);
  border-block-start: var(--border-hair) solid var(--color-border-inverse);
  box-shadow: var(--shadow-lg);
}

.c-header__nav.c-header__nav nav.elementor-nav-menu--dropdown .elementor-nav-menu {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.c-header__nav.c-header__nav nav.elementor-nav-menu--dropdown .elementor-item.elementor-item {
  display: flex;
  justify-content: space-between;
  inline-size: 100%;
  padding-block: var(--space-xs);
  padding-inline: var(--space-md);
  white-space: normal;
}

.c-header__nav.c-header__nav nav.elementor-nav-menu--dropdown .elementor-item.elementor-item:hover {
  background-color: color-mix(in srgb, var(--color-surface-050) 8%, transparent);
}

/* In sertar, submeniul curge in lista, fara panou propriu */
.c-header__nav.c-header__nav nav.elementor-nav-menu--dropdown ul.elementor-nav-menu--dropdown {
  background: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  min-inline-size: 0;
  padding: 0;
}


/* --- SUBMENIUL, LINKURILE --- */

.c-header__nav.c-header__nav .elementor-sub-item.elementor-sub-item {
  display: block;
  padding-block: var(--space-2xs);
  padding-inline: var(--space-sm);
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  font-weight: var(--fw-regular);
  line-height: 1.35;
  letter-spacing: normal;
  text-transform: none;
  text-decoration: none;
  color: var(--color-text-inverse);
  background: none;
  border: 0;
  transition: var(--transition-color);
}

.c-header__nav.c-header__nav .elementor-sub-item.elementor-sub-item:hover,
.c-header__nav.c-header__nav .elementor-sub-item.elementor-sub-item:focus-visible {
  background-color: color-mix(in srgb, var(--color-gold-500) 16%, transparent);
  color: var(--color-surface-000);
}

.c-header__nav.c-header__nav .elementor-sub-item.elementor-sub-item.elementor-item-active,
.c-header__nav.c-header__nav .elementor-sub-item.elementor-sub-item[aria-current="page"] {
  color: var(--color-gold-500);
  font-weight: var(--fw-medium);
}

.c-header__nav.c-header__nav .elementor-sub-item.elementor-sub-item::after,
.c-header__nav.c-header__nav .elementor-sub-item.elementor-sub-item::before {
  display: none;
}

.c-header__nav.c-header__nav nav.elementor-nav-menu--dropdown .elementor-sub-item.elementor-sub-item {
  padding-inline-start: var(--space-xl);
  color: var(--color-text-inverse-muted);
}

/* Butonul cu trei linii */
.c-header__nav.c-header__nav .elementor-menu-toggle {
  min-block-size: var(--control-min-block);
  min-inline-size: var(--control-min-block);
  padding: var(--space-2xs);
  color: var(--color-text-inverse);
  background: none;
  border: var(--border-hair) solid var(--color-border-inverse);
  border-radius: var(--radius-sm);
}

.c-header__nav.c-header__nav .elementor-menu-toggle:hover {
  background: none;
  color: var(--color-gold-500);
}

.c-header__nav.c-header__nav .elementor-menu-toggle:focus-visible {
  outline: var(--focus-width) solid var(--color-gold-500);
  outline-offset: var(--focus-offset);
}

.c-header__nav {
  justify-self: end;
  min-inline-size: 0;
}


/* --------------------------------------------------------------------------
   12b. WIDGET-URI V3 DE TIP BUTTON

   La widget-urile clasice, clasa scrisa in CSS Classes ajunge pe wrapper-ul
   <div class="elementor-widget-button">, nu pe <a class="elementor-button">.
   Wrapper-ul iese din layout cu display:contents, iar stilul se aplica pe link.
   -------------------------------------------------------------------------- */

.c-button:has(.elementor-button),
.c-link-plain:has(.elementor-button),
.c-header__phone:has(.elementor-button),
.c-link-arrow:has(.elementor-button) {
  display: contents;
}

/* Baza de buton, pe linkul din interior */
.c-button.c-button .elementor-button.elementor-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2xs);
  min-block-size: var(--control-min-block);
  padding-block: var(--space-2xs);
  padding-inline: var(--control-padding-inline);
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  border: var(--border-medium) solid transparent;
  border-radius: var(--radius-sm);
  box-shadow: none;
  transition: var(--transition-color);
}

.c-button--primary.c-button--primary .elementor-button.elementor-button {
  background-color: var(--color-gold-500);
  border-color: var(--color-gold-500);
  color: var(--color-brand-900);
}

.c-button--primary.c-button--primary .elementor-button.elementor-button:hover,
.c-button--primary.c-button--primary .elementor-button.elementor-button:focus-visible {
  background-color: var(--color-gold-700);
  border-color: var(--color-gold-700);
  color: var(--color-surface-000);
}

.c-button--secondary.c-button--secondary .elementor-button.elementor-button {
  background-color: transparent;
  border-color: var(--color-brand-900);
  color: var(--color-brand-900);
}

.l-section--dark .c-button--secondary.c-button--secondary .elementor-button.elementor-button,
.c-footer .c-button--secondary.c-button--secondary .elementor-button.elementor-button {
  border-color: var(--color-surface-050);
  color: var(--color-surface-050);
}

/* Telefonul din header, link simplu auriu, fara aspect de buton */
.c-header__phone.c-header__phone .elementor-button.elementor-button {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2xs);
  min-block-size: var(--control-min-block);
  padding-block: 0;
  padding-inline: var(--space-2xs);
  background: none;
  background-color: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  line-height: 1;
  color: var(--color-gold-500);
  fill: currentColor;
  text-decoration: none;
  white-space: nowrap;
  transition: var(--transition-color);
}

.c-header__phone.c-header__phone .elementor-button.elementor-button:hover,
.c-header__phone.c-header__phone .elementor-button.elementor-button:focus-visible {
  background: none;
  color: var(--color-surface-000);
}

.c-header__phone.c-header__phone .elementor-button-icon svg {
  inline-size: 1.15em;
  block-size: 1.15em;
  fill: currentColor;
}

/* Link simplu construit dintr-un buton V3 */
.c-link-plain.c-link-plain .elementor-button.elementor-button {
  display: inline-flex;
  min-block-size: auto;
  padding: 0;
  background: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  font-weight: var(--fw-regular);
  text-transform: none;
  letter-spacing: normal;
  color: var(--on-surface-muted);
  text-decoration: none;
}

.c-link-plain.c-link-plain .elementor-button.elementor-button:hover {
  color: var(--on-surface);
  text-decoration: underline;
}

/* --------------------------------------------------------------------------
   12d. DISPLAY IMPUS PE COMPONENTELE CARE DEPIND DE FLEX

   Elementor seteaza display:block pe elementele lui de baza, cu aceeasi
   specificitate ca a claselor noastre, iar CSS-ul lui se incarca dupa
   framework. La egalitate castiga el, iar componentele isi pierd centrarea
   verticala: align-items nu are efect intr-un element block, si tot spatiul
   ramas din min-block-size se duce in jos.

   Clasa repetata de trei ori ajunge la 0,3,0 si rezolva definitiv.
   -------------------------------------------------------------------------- */

.c-button.c-button.c-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.c-button--block.c-button--block.c-button--block {
  display: flex;
}

.c-link-arrow.c-link-arrow.c-link-arrow {
  display: inline-flex;
  align-items: center;
}

.c-header__phone.c-header__phone.c-header__phone {
  display: inline-flex;
  align-items: center;
}

.c-icon-box.c-icon-box.c-icon-box {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.c-badge.c-badge.c-badge {
  display: inline-flex;
  align-items: center;
}

.c-link-plain.c-link-plain.c-link-plain {
  display: inline-flex;
  align-items: center;
}

.c-accordion__trigger.c-accordion__trigger.c-accordion__trigger {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}

/* Variantele construite din widget-uri V3 raman pe display:contents,
   asa ca regula de mai sus nu trebuie sa le prinda. */
.c-button.c-button.c-button:has(.elementor-button),
.c-link-plain.c-link-plain.c-link-plain:has(.elementor-button),
.c-header__phone.c-header__phone.c-header__phone:has(.elementor-button),
.c-link-arrow.c-link-arrow.c-link-arrow:has(.elementor-button) {
  display: contents;
}

/* ==========================================================================
   13. ASCUNDERE PE BREAKPOINT, CU PRIORITATE

   .u-hide-mobile avea 0,2,0, iar regula care impune display pe butoane are
   0,3,0, deci ascunderea pierdea. Clasa repetata de trei ori, plus media
   query pe max-width, castiga sigur.
   ========================================================================== */

/* Regulile de ascundere s-au mutat la finalul fisierului, sectiunea 21. */

/* ==========================================================================
   14. COMPATIBILITATE CU LISTINGURILE JETENGINE

   Repetitorul Jet pune pe fiecare element display:flex cu align-items:center.
   Consecinta: cardul nu se mai intinde pe toata inaltimea celulei, iar
   cardurile dintr-un rand ies inegale cand textele au lungimi diferite.

   Grila o face .l-grid. Elementele Jet trebuie doar sa nu se amestece.
   ========================================================================== */

.l-grid > .jet-listing-dynamic-repeater__item,
.l-grid > .jet-listing-grid__item,
.jet-listing-dynamic-repeater__items > .jet-listing-dynamic-repeater__item {
  display: block;
  align-items: stretch;
  block-size: 100%;
  min-inline-size: 0;
  padding: 0;
  margin: 0;
}

.jet-listing-dynamic-repeater__items {
  display: contents;
}

/* Cardul umple celula, indiferent de cine il ambaleaza */
.jet-listing-dynamic-repeater__item > .c-card,
.jet-listing-grid__item > .c-card {
  block-size: 100%;
}

/* Separatorul implicit dintre elementele de repeater */
.jet-listing-dynamic-repeater__item + .jet-listing-dynamic-repeater__item::before {
  display: none;
}

/* --------------------------------------------------------------------------
   14b. ALINIEREA IN CARDURI

   Widget-urile Elementor genereaza text-align pe clasa lor individuala,
   care bate regula noastra la specificitate egala. Clasa repetata de trei
   ori ajunge la 0,3,0 si fixeaza alinierea la stanga pentru tot cardul.

   Daca vrei vreodata un card centrat, adaugi pe el .u-text-center, care
   are aceeasi greutate si vine dupa.
   -------------------------------------------------------------------------- */

.c-card.c-card.c-card {
  align-items: stretch;
  text-align: start;
}

.c-card__title.c-card__title.c-card__title,
.c-card__text.c-card__text.c-card__text,
.c-card__meta.c-card__meta.c-card__meta {
  text-align: start;
}

.u-text-center.u-text-center.u-text-center,
.u-text-center.u-text-center.u-text-center * {
  text-align: center;
}

/* --------------------------------------------------------------------------
   14c. LISTA DE ETAPE IN INTERIORUL UNUI REPEATER JET

   Jet ambaleaza fiecare <li> intr-un div propriu. Consecinte:
   - fiecare item devine o grila separata, deci coloana numarului se
     dimensioneaza dupa continutul lui si numerele nu se mai aliniaza;
   - spatiul dintre etape vine din alt loc decat gap-ul listei.

   Ambalajul devine transparent cu display:contents, iar coloana numarului
   primeste latime fixa in em, deci se aliniaza indiferent de continut.
   -------------------------------------------------------------------------- */

.c-steps > .jet-listing-dynamic-repeater__item,
.c-steps .jet-listing-dynamic-repeater__items {
  display: contents;
}

.c-steps.c-steps.c-steps {
  display: grid;
  gap: var(--space-md);
  list-style: none;
  padding-inline-start: 0;
  counter-reset: step;
}

.c-steps__item.c-steps__item.c-steps__item {
  display: grid;
  /* Latimea coloanei o dau cifrele, nu textul curent. Valoarea in rem
     urmeaza scara lui --fs-h4, ca numerele sa ramana aliniate la orice
     latime de ecran, fara sa lase un gol inutil. */
  grid-template-columns: clamp(1.9rem, 1.65rem + 0.9vw, 2.5rem) 1fr;
  gap: var(--space-xs);
  align-items: start;
  counter-increment: step;
}

/* Numarul se aliniaza pe prima linie a titlului, nu pe mijlocul blocului */
.c-steps__item.c-steps__item.c-steps__item::before {
  content: counter(step, decimal-leading-zero);
  font-family: var(--font-heading);
  font-size: var(--fs-h4);
  font-weight: var(--fw-black);
  line-height: var(--lh-heading);
  color: var(--gold-on-surface);
  padding-block-start: 0;
  text-align: start;
}

/* Aer intre titlu si explicatie, indiferent cum le ambaleaza Jet */
.c-steps__item > div > * + *,
.c-steps__item > * + * {
  margin-block-start: var(--space-2xs);
}

/* --------------------------------------------------------------------------
   14d. LINK CU SAGEATA SI CAP DE SECTIUNE PE DOUA COLOANE
   -------------------------------------------------------------------------- */

/* Construit din elementul Button, deci mosteneste aspectul de buton.
   Se sterge complet: fara fundal, fara contur, fara padding, fara inaltime. */
.c-link-arrow.c-link-arrow.c-link-arrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2xs);
  inline-size: auto;
  min-block-size: auto;
  padding: 0;
  background: none;
  background-color: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  line-height: 1.2;
  letter-spacing: normal;
  text-transform: none;
  text-align: start;
  text-decoration: underline;
  text-decoration-thickness: var(--border-hair);
  text-underline-offset: 0.25em;
  color: var(--accent-on-surface);
  transition: var(--transition-color);
}

.c-link-arrow.c-link-arrow.c-link-arrow:hover,
.c-link-arrow.c-link-arrow.c-link-arrow:focus-visible {
  background: none;
  color: var(--accent-on-surface);
  text-decoration-thickness: var(--border-medium);
}

/* Capul de sectiune cu titlu in stanga si link in dreapta */
.c-section-head--split.c-section-head--split.c-section-head--split {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-md);
  max-inline-size: none;
}

.c-section-head--split.c-section-head--split.c-section-head--split > * {
  flex: 0 1 auto;
  inline-size: auto;
}

/* Sub 48em titlul si linkul stau unul sub altul, linkul aliniat la stanga */
@media (max-width: 47.99em) {
  .c-section-head--split.c-section-head--split.c-section-head--split {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-sm);
  }
}

/* --------------------------------------------------------------------------
   14e. ACORDEON CONSTRUIT DINTR-UN DYNAMIC REPEATER

   Jet ambaleaza fiecare intrebare intr-un div propriu. Acela devine
   elementul de acordeon, deci nu mai e nevoie de .c-accordion__item scris
   in markup, care oricum s-ar fi scris o singura data.
   -------------------------------------------------------------------------- */

.c-accordion .jet-listing-dynamic-repeater__item {
  display: block;
  inline-size: 100%;
  padding: 0;
  margin: 0;
  border-block-end: var(--border-hair) solid var(--on-surface-border);
}

.c-accordion .jet-listing-dynamic-repeater__item::before,
.c-accordion .jet-listing-dynamic-repeater__item::after {
  display: none;
}

/* Titlul care contine butonul nu adauga spatiu propriu */
.c-accordion h2,
.c-accordion h3,
.c-accordion h4 {
  margin: 0;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  letter-spacing: normal;
}

.c-accordion__trigger.c-accordion__trigger.c-accordion__trigger {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-sm);
  inline-size: 100%;
  min-block-size: var(--control-min-block);
  padding-block: var(--space-sm);
  padding-inline: 0;
  background: none;
  background-color: transparent;
  border: 0;
  border-radius: 0;
  text-align: start;
  font-family: var(--font-heading);
  font-size: var(--fs-lead);
  font-weight: var(--fw-medium);
  line-height: var(--lh-heading);
  letter-spacing: var(--ls-heading);
  color: var(--on-surface);
  cursor: pointer;
  transition: var(--transition-color);
}

.c-accordion__trigger.c-accordion__trigger.c-accordion__trigger:hover {
  color: var(--gold-on-surface);
  background: none;
}

.c-accordion__panel.c-accordion__panel {
  padding-block-end: var(--space-md);
  max-inline-size: var(--measure-body);
  color: var(--on-surface-muted);
}

.c-accordion__panel.c-accordion__panel p {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  font-weight: var(--fw-regular);
  line-height: var(--lh-body);
  margin: 0;
}

.c-accordion__panel[hidden] {
  display: none;
}

/* --------------------------------------------------------------------------
   14f. ICONUL DINTR-UN CAMP DINAMIC JET

   Jet ambaleaza imaginea in trei div-uri intre .c-icon-box si <img>.
   Ambalajele devin transparente, imaginea ajunge copil direct al casetei
   si se poate centra si dimensiona.
   -------------------------------------------------------------------------- */

.c-icon-box .elementor-widget-container,
.c-icon-box .jet-listing,
.c-icon-box .jet-listing-dynamic-field,
.c-icon-box .jet-listing-dynamic-field__inline-wrap,
.c-icon-box .jet-listing-dynamic-field__content {
  display: contents;
}

.c-icon-box.c-icon-box.c-icon-box {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  inline-size: clamp(2.75rem, 2.4rem + 1.4vw, 3.5rem);
  block-size: clamp(2.75rem, 2.4rem + 1.4vw, 3.5rem);
  aspect-ratio: var(--ratio-square);
  flex: none;
  padding: 0;
  border-radius: var(--radius-sm);
  background-color: color-mix(in srgb, var(--color-gold-500) 18%, transparent);
  color: var(--color-gold-700);
  overflow: hidden;
}

.c-icon-box.c-icon-box img,
.c-icon-box.c-icon-box svg {
  inline-size: 60%;
  block-size: 60%;
  max-inline-size: 60%;
  object-fit: contain;
  display: block;
}

/* --------------------------------------------------------------------------
   15. MOTIV DECORATIV DE FUNDAL

   Chevroanele din logo, desenate ca SVG inline in CSS, deci zero cereri
   de retea. Se pun cu .l-section--motif pe orice sectiune care are spatiu
   liber in dreapta. Nu schimba culoarea de fundal a sectiunii.

   Apare doar de la 64em in sus. Sub aceasta latime nu exista spatiu liber,
   iar motivul ar trece pe sub text.
   -------------------------------------------------------------------------- */

.l-section--motif.l-section--motif {
  position: relative;
  overflow: clip;
}

.l-section--motif.l-section--motif > * {
  position: relative;
  z-index: 1;
}

.l-section--motif.l-section--motif::after {
  content: "";
  position: absolute;
  inset-block-start: 50%;
  inset-inline-end: clamp(-5rem, -2vw, 0rem);
  translate: 0 -50%;
  inline-size: min(34rem, 40%);
  aspect-ratio: 3 / 2;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20600%20400%22%3E%3Cpath%20d%3D%22M20%20330%20L200%20110%20L300%20232%20L268%20272%20L200%20190%20L84%20330%20Z%22%20fill%3D%22%2393661D%22%2F%3E%3Cpath%20d%3D%22M300%20232%20L400%20110%20L580%20330%20L516%20330%20L400%20190%20L332%20272%20Z%22%20fill%3D%22%23752D8D%22%2F%3E%3Crect%20x%3D%22284%22%20y%3D%22252%22%20width%3D%2230%22%20height%3D%2230%22%20fill%3D%22%2393661D%22%2F%3E%3Crect%20x%3D%22322%22%20y%3D%22252%22%20width%3D%2230%22%20height%3D%2230%22%20fill%3D%22%2393661D%22%2F%3E%3Crect%20x%3D%22284%22%20y%3D%22290%22%20width%3D%2230%22%20height%3D%2230%22%20fill%3D%22%2393661D%22%2F%3E%3Crect%20x%3D%22322%22%20y%3D%22290%22%20width%3D%2230%22%20height%3D%2230%22%20fill%3D%22%2393661D%22%2F%3E%3C%2Fsvg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  opacity: 0.07;
  pointer-events: none;
  z-index: 0;
  display: none;
}

@media (min-width: 64em) {
  .l-section--motif.l-section--motif::after {
    display: block;
  }
}

/* Varianta pentru sectiuni intunecate, unde 7% nu se vede */
.l-section--dark.l-section--motif.l-section--motif::after,
.c-cta-band.l-section--motif.l-section--motif::after {
  opacity: 0.13;
}

/* Varianta discreta si cea accentuata */
.l-section--motif--soft.l-section--motif--soft::after { opacity: 0.04; }
.l-section--motif--strong.l-section--motif--strong::after { opacity: 0.11; }

/* In modul de contrast fortat, decorul dispare */
@media (forced-colors: active) {
  .l-section--motif.l-section--motif::after {
    display: none;
  }
}

/* --------------------------------------------------------------------------
   16. FIGURA CU IMAGINE
   -------------------------------------------------------------------------- */

.c-figure {
  display: block;
  margin: 0;
}

.c-figure__media {
  display: block;
  aspect-ratio: var(--ratio-wide);
  overflow: hidden;
  border-radius: var(--radius-lg);
  background-color: var(--color-surface-050);
}

.c-figure__media img {
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
  display: block;
}

.c-figure--card .c-figure__media {
  aspect-ratio: var(--ratio-card);
  border-radius: var(--radius-md);
}

.c-figure__caption {
  display: block;
  margin-block-start: var(--space-2xs);
  font-family: var(--font-body);
  font-size: var(--fs-xs);
  font-weight: var(--fw-regular);
  line-height: 1.5;
  color: var(--on-surface-muted);
  max-inline-size: var(--measure-body);
}

/* Elementor ambaleaza imaginea; ambalajele devin transparente */
.c-figure__media .elementor-widget-container,
.c-figure__media .jet-listing,
.c-figure__media .jet-listing-dynamic-image {
  display: contents;
}

/* --------------------------------------------------------------------------
   17. COMPATIBILITATE CU ELEMENTOR FORMS

   Widget-ul isi genereaza propriul markup, cu clasele lui. Nu putem pune
   .c-form__control pe fiecare input din interfata, deci mapam clasele
   Elementor peste stilurile noastre.

   In Elementor pui o singura clasa pe widget: .c-form
   Restul se aliniaza singur.

   Setari recomandate in widget, ca sa nu genereze reguli concurente:
     Label Position: Above
     Required Mark: Show
     Columns Gap si Rows Gap: lasate implicite
     Tab Style: nu seta nimic
   -------------------------------------------------------------------------- */

.c-form .elementor-form-fields-wrapper {
  display: grid;
  gap: var(--space-sm);
  margin: 0;
}

.c-form .elementor-field-group {
  display: flex;
  flex-direction: column;
  gap: var(--space-3xs);
  padding: 0;
  margin: 0;
  max-inline-size: none;
}

.c-form .elementor-field-label {
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  line-height: 1.3;
  color: var(--on-surface);
  padding: 0;
  margin: 0;
}

.c-form .elementor-mark-required .elementor-field-label::after {
  color: var(--color-error);
  margin-inline-start: var(--space-3xs);
}

.c-form .elementor-field-textual,
.c-form select.elementor-field,
.c-form textarea.elementor-field {
  min-block-size: var(--control-min-block);
  padding-block: var(--space-2xs);
  padding-inline: var(--space-xs);
  inline-size: 100%;
  font-family: var(--font-body);
  font-size: var(--fs-body);
  font-weight: var(--fw-regular);
  line-height: 1.4;
  color: var(--color-text);
  background-color: var(--color-surface-000);
  border: var(--border-hair) solid var(--color-border-strong);
  border-radius: var(--radius-sm);
  box-shadow: none;
  transition: var(--transition-color);
}

.c-form textarea.elementor-field {
  min-block-size: clamp(7rem, 6rem + 4vw, 10rem);
  resize: vertical;
  line-height: var(--lh-body);
}

.c-form .elementor-field-textual:hover {
  border-color: var(--color-brand-900);
}

.c-form .elementor-field-textual:focus-visible {
  outline: var(--focus-width) solid var(--color-focus);
  outline-offset: var(--focus-offset);
  border-color: var(--color-brand-900);
}

/* Acordul GDPR si celelalte bife */
.c-form .elementor-field-type-acceptance .elementor-field-option,
.c-form .elementor-field-subgroup {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: var(--space-2xs) var(--space-sm);
  font-size: var(--fs-sm);
  line-height: 1.45;
}

.c-form input[type="checkbox"],
.c-form input[type="radio"] {
  inline-size: 1.25rem;
  block-size: 1.25rem;
  margin-block-start: 0.15em;
  accent-color: var(--color-brand-900);
  flex: none;
}

/* Butonul de trimitere */
.c-form .elementor-button[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2xs);
  inline-size: 100%;
  min-block-size: var(--control-min-block);
  padding-block: var(--space-2xs);
  padding-inline: var(--control-padding-inline);
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  line-height: 1;
  white-space: nowrap;
  color: var(--color-brand-900);
  background-color: var(--color-gold-500);
  border: var(--border-medium) solid var(--color-gold-500);
  border-radius: var(--radius-sm);
  box-shadow: none;
  transition: var(--transition-color);
}

.c-form .elementor-button[type="submit"]:hover,
.c-form .elementor-button[type="submit"]:focus-visible {
  background-color: var(--color-gold-700);
  border-color: var(--color-gold-700);
  color: var(--color-surface-000);
}

/* Mesajele de eroare si de succes */
.c-form .elementor-message {
  display: flex;
  flex-direction: row;
  gap: var(--space-2xs);
  padding: var(--space-sm);
  margin-block-start: var(--space-sm);
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  line-height: 1.5;
  border-radius: var(--radius-sm);
}

.c-form .elementor-message-success {
  background-color: color-mix(in srgb, var(--color-success) 10%, transparent);
  border-inline-start: var(--border-thick) solid var(--color-success);
  color: var(--color-success);
}

.c-form .elementor-message-danger,
.c-form .elementor-message-error {
  background-color: color-mix(in srgb, var(--color-error) 10%, transparent);
  border-inline-start: var(--border-thick) solid var(--color-error);
  color: var(--color-error);
}

.c-form .elementor-field-group.elementor-error .elementor-field-textual {
  border-color: var(--color-error);
  border-inline-start-width: var(--border-thick);
}

.c-form .elementor-help-inline {
  font-size: var(--fs-xs);
  color: var(--color-error);
}

/* Doua campuri pe rand de la 48em */
@media (min-width: 48em) {
  .c-form .elementor-form-fields-wrapper {
    grid-template-columns: repeat(2, 1fr);
  }

  .c-form .elementor-field-group.elementor-col-100 {
    grid-column: 1 / -1;
  }
}

/* Intrebare si mai mica, pentru acordeoane din coloane inguste */
.c-accordion--compact .c-accordion__trigger.c-accordion__trigger.c-accordion__trigger {
  font-size: var(--fs-body);
  padding-block: var(--space-xs);
}

.c-accordion--compact .c-accordion__panel.c-accordion__panel {
  padding-block-end: var(--space-sm);
}

.c-accordion--compact .c-accordion__panel.c-accordion__panel p {
  font-size: var(--fs-sm);
}

/* --------------------------------------------------------------------------
   18. LINKURI SOCIALE

   Butoane patrate cu icon, minimum 2.75rem pe fiecare directie, peste
   pragul WCAG 2.2 pentru tinte interactive. Fiecare link are nume
   accesibil propriu, pentru ca iconul singur nu spune nimic unui
   cititor de ecran.
   -------------------------------------------------------------------------- */

.c-social {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2xs);
  list-style: none;
  padding-inline-start: 0;
  margin: 0;
}

.c-social__link.c-social__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  inline-size: var(--control-min-block);
  block-size: var(--control-min-block);
  flex: none;
  padding: 0;
  border: var(--border-hair) solid var(--on-surface-border);
  border-radius: var(--radius-sm);
  background: none;
  background-color: transparent;
  color: var(--on-surface);
  text-decoration: none;
  transition: var(--transition-color);
}

.c-social__link.c-social__link:hover,
.c-social__link.c-social__link:focus-visible {
  background-color: var(--color-brand-900);
  border-color: var(--color-brand-900);
  color: var(--color-text-inverse);
}

.l-section--dark .c-social__link.c-social__link:hover,
.c-footer .c-social__link.c-social__link:hover {
  background-color: var(--color-gold-500);
  border-color: var(--color-gold-500);
  color: var(--color-brand-900);
}

.c-social__link svg {
  inline-size: 1.15rem;
  block-size: 1.15rem;
  fill: currentColor;
  display: block;
}

/* --------------------------------------------------------------------------
   14g. PADDING-UL IMPLICIT AL CONTAINERELOR ELEMENTOR

   Elementor scrie .elementor .e-div-block-base { padding: 10px } cu
   specificitate 0,2,0. O regula de-a noastra cu doua clase e la egalitate
   si pierde, pentru ca fisierul lui se incarca dupa tema copil.

   Toate regulile de aici au clasa repetata de trei ori, deci 0,3,0.
   Se aplica numai in containerele unde copiii NU trebuie sa aiba padding
   propriu. Cardurile dintr-o grila isi pastreaza padding-ul lor.
   -------------------------------------------------------------------------- */

.c-card__meta.c-card__meta.c-card__meta > *,
.c-card__meta.c-card__meta.c-card__meta .elementor-widget,
.c-footer__list.c-footer__list.c-footer__list > *,
.c-social.c-social.c-social > *,
.c-header__actions.c-header__actions.c-header__actions > *,
.c-footer__legal.c-footer__legal.c-footer__legal > *,
.c-footer__bottom.c-footer__bottom.c-footer__bottom > *,
.c-footer__phones.c-footer__phones.c-footer__phones > * {
  padding: 0;
  margin: 0;
  min-inline-size: 0;
}

/* Ambalajele Jet dispar din layout, tot cu 0,3,0 */
.c-card__meta.c-card__meta.c-card__meta .elementor-widget-container,
.c-card__meta.c-card__meta.c-card__meta .jet-listing,
.c-card__meta.c-card__meta.c-card__meta .jet-listing-dynamic-terms,
.c-card__meta.c-card__meta.c-card__meta .jet-listing-dynamic-field,
.c-card__meta.c-card__meta.c-card__meta .jet-listing-dynamic-field__inline-wrap,
.c-card__meta.c-card__meta.c-card__meta .jet-listing-dynamic-field__content,
.c-icon-box.c-icon-box.c-icon-box .elementor-widget-container,
.c-icon-box.c-icon-box.c-icon-box .jet-listing,
.c-icon-box.c-icon-box.c-icon-box .jet-listing-dynamic-field,
.c-icon-box.c-icon-box.c-icon-box .jet-listing-dynamic-field__inline-wrap,
.c-icon-box.c-icon-box.c-icon-box .jet-listing-dynamic-field__content,
.c-figure__media.c-figure__media.c-figure__media .elementor-widget-container,
.c-figure__media.c-figure__media.c-figure__media .jet-listing,
.c-figure__media.c-figure__media.c-figure__media .jet-listing-dynamic-image {
  display: contents;
}

/* Ambalajele de repeater din liste si acordeoane */
.c-steps.c-steps.c-steps > .jet-listing-dynamic-repeater__item,
.c-steps.c-steps.c-steps .jet-listing-dynamic-repeater__items,
.c-accordion.c-accordion.c-accordion .jet-listing-dynamic-repeater__items {
  display: contents;
}

.c-accordion.c-accordion.c-accordion .jet-listing-dynamic-repeater__item {
  display: block;
  padding: 0;
  margin: 0;
  border-block-end: var(--border-hair) solid var(--on-surface-border);
}

/* Linkurile de taxonomie din metadate */
.c-card__meta.c-card__meta a,
.c-card__meta.c-card__meta .jet-listing-dynamic-terms__link {
  color: inherit;
  text-decoration: none;
  transition: var(--transition-color);
}

.c-card__meta.c-card__meta a:hover,
.c-card__meta.c-card__meta .jet-listing-dynamic-terms__link:hover {
  color: var(--color-brand-900);
  text-decoration: underline;
  text-decoration-thickness: var(--border-hair);
}

.c-card__meta.c-card__meta .jet-listing-dynamic-terms__delimiter {
  margin-inline: var(--space-3xs);
  color: var(--color-border-strong);
}

/* Utilitar pentru cazurile punctuale unde padding-ul Elementor deranjeaza */
.u-pad-0.u-pad-0.u-pad-0 {
  padding: 0;
}

/* ==========================================================================
   19. DISPLAY IMPUS PENTRU TOATE CLASELE DE LAYOUT

   Elementor scrie .elementor .e-div-block-base { display: block } cu
   specificitate 0,2,0. Stratul generat automat de la sectiunea 11 e tot
   0,2,0, deci la egalitate pierde: fisierul lui se incarca dupa tema copil.

   Aici, fiecare clasa e repetata de trei ori, deci 0,3,0. Sunt aceleasi
   valori ca in sectiunile 4-6, doar cu prioritate mai mare. Nu se adauga
   padding si nu se schimba nimic altceva.
   ========================================================================== */

.l-cluster.l-cluster.l-cluster {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--cluster-gap, var(--space-xs));
}

.l-split.l-split.l-split {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-sm);
}

.l-stack.l-stack.l-stack {
  display: flex;
  flex-direction: column;
  gap: var(--stack-gap, var(--space-sm));
}

.l-grid.l-grid.l-grid {
  display: grid;
  gap: var(--grid-gap);
}

.l-grid--2.l-grid--2.l-grid--2 {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr));
}

.l-grid--3.l-grid--3.l-grid--3 {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--grid-min-col)), 1fr));
}

.l-grid--4.l-grid--4.l-grid--4 {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
}

.l-grid--auto.l-grid--auto.l-grid--auto {
  grid-template-columns: repeat(auto-fill, minmax(min(100%, var(--grid-min-col)), 1fr));
}

.l-grid--split.l-grid--split.l-grid--split {
  grid-template-columns: 1fr;
  align-items: center;
}

.l-container.l-container.l-container {
  display: block;
  inline-size: min(100% - (var(--gutter-inline) * 2), var(--container-wide));
  margin-inline: auto;
  padding: 0;
}

.l-container--content.l-container--content.l-container--content {
  inline-size: min(100% - (var(--gutter-inline) * 2), var(--container-content));
}

.l-container--narrow.l-container--narrow.l-container--narrow {
  inline-size: min(100% - (var(--gutter-inline) * 2), var(--container-narrow));
}

.c-card__body.c-card__body.c-card__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-2xs);
}

.c-card__meta.c-card__meta.c-card__meta {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2xs) var(--space-xs);
}

.c-section-head.c-section-head.c-section-head:not(.c-section-head--split) {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--space-xs);
}

.c-cta-band__inner.c-cta-band__inner.c-cta-band__inner {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}

.c-accordion.c-accordion.c-accordion {
  display: flex;
  flex-direction: column;
}

.c-form.c-form.c-form {
  display: grid;
  gap: var(--space-sm);
}

.c-footer__grid.c-footer__grid.c-footer__grid {
  display: grid;
  gap: var(--space-lg);
  grid-template-columns: 1fr;
  padding: 0;
}

.c-footer__list.c-footer__list.c-footer__list {
  display: flex;
  flex-direction: column;
  gap: var(--space-2xs);
  padding-inline-start: 0;
}

.c-footer__phones.c-footer__phones.c-footer__phones,
.c-footer__policies.c-footer__policies.c-footer__policies,
.c-social.c-social.c-social {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
}

.c-footer__legal.c-footer__legal.c-footer__legal {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-3xs) var(--space-xs);
}

.c-footer__bottom.c-footer__bottom.c-footer__bottom {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2xs) var(--space-md);
}

.c-header__inner.c-header__inner.c-header__inner {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  column-gap: var(--space-sm);
  padding: 0;
}

.c-header__actions.c-header__actions.c-header__actions {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-self: end;
  flex: none;
}

.c-steps.c-steps.c-steps {
  display: grid;
  gap: var(--space-md);
  padding-inline-start: 0;
}

.c-filter.c-filter.c-filter {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--space-sm);
}

@media (min-width: 48em) {
  .l-grid--split.l-grid--split.l-grid--split {
    grid-template-columns: 1.05fr 0.95fr;
    gap: var(--space-xl);
  }

  .c-footer__grid.c-footer__grid.c-footer__grid {
    grid-template-columns: repeat(2, 1fr);
    column-gap: var(--space-xl);
  }

  .c-form.c-form.c-form {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 64em) {
  .c-footer__grid.c-footer__grid.c-footer__grid {
    grid-template-columns: 1.5fr 1fr 1.3fr 1.3fr;
    gap: var(--space-xl);
  }

  .c-cta-band__inner.c-cta-band__inner.c-cta-band__inner {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-xl);
  }
}

/* --------------------------------------------------------------------------
   19b. COPIII UNUI RAND NU SE INTIND PE TOATA LATIMEA

   Containerul poate fi corect flex si pe rand, iar elementele sa apara tot
   stivuite, pentru ca fiecare copil primeste latime completa de la
   Elementor si forteaza wrap.

   Se aplica numai in containerele de tip rand. Grilele si stivele nu sunt
   atinse, acolo latimea completa e corecta.
   -------------------------------------------------------------------------- */

.l-cluster.l-cluster.l-cluster > *,
.l-split.l-split.l-split > *,
.c-header__actions.c-header__actions.c-header__actions > *,
.c-footer__phones.c-footer__phones.c-footer__phones > *,
.c-footer__policies.c-footer__policies.c-footer__policies > *,
.c-social.c-social.c-social > *,
.c-card__meta.c-card__meta.c-card__meta > *,
.c-footer__legal.c-footer__legal.c-footer__legal > * {
  flex: 0 1 auto;
  inline-size: auto;
  max-inline-size: 100%;
}

/* Butoanele si linkurile raman pe latimea textului lor */
.l-cluster.l-cluster.l-cluster > .c-button,
.l-cluster.l-cluster.l-cluster > .c-link-arrow,
.l-cluster.l-cluster.l-cluster > .c-header__phone,
.c-header__actions.c-header__actions.c-header__actions > .c-button,
.c-header__actions.c-header__actions.c-header__actions > .c-header__phone,
.c-footer__phones.c-footer__phones.c-footer__phones > .c-button {
  inline-size: auto;
  flex: 0 0 auto;
}

/* Exceptia: pe latimi foarte mici, butoanele ocupa tot randul */
@media (max-width: 29.99em) {
  .l-cluster--stack-sm.l-cluster--stack-sm.l-cluster--stack-sm > * {
    flex: 1 1 100%;
    inline-size: 100%;
  }
}

/* --------------------------------------------------------------------------
   19c. MODIFICATORII RAMAN DUPA CLASELE DE BAZA

   O regula de baza si un modificator cu aceeasi specificitate se decid
   dupa ordinea din fisier. Modificatorii stau aici, la final, ca sa nu
   mai fie anulati de sectiunile de prioritate de mai sus.
   -------------------------------------------------------------------------- */

.c-section-head--split.c-section-head--split.c-section-head--split {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-md);
  max-inline-size: none;
}

.c-section-head--split.c-section-head--split.c-section-head--split > * {
  flex: 0 1 auto;
  inline-size: auto;
}

@media (max-width: 47.99em) {
  .c-section-head--split.c-section-head--split.c-section-head--split {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-sm);
  }
}

.l-section--compact.l-section--compact.l-section--compact {
  padding-block: var(--section-block-compact);
}

.l-section--flush-top.l-section--flush-top.l-section--flush-top {
  padding-block-start: 0;
}

.l-stack--lg.l-stack--lg.l-stack--lg { --stack-gap: var(--space-lg); }
.l-stack--md.l-stack--md.l-stack--md { --stack-gap: var(--space-md); }
.l-stack--xs.l-stack--xs.l-stack--xs { --stack-gap: var(--space-xs); }

.l-cluster--sm.l-cluster--sm.l-cluster--sm { --cluster-gap: var(--space-2xs); }
.l-cluster--md.l-cluster--md.l-cluster--md { --cluster-gap: var(--space-sm); }

/* ==========================================================================
   20. SECTIUNI CARE DISPAR CAND NU AU CE AFISA

   Doua situatii diferite, doua mecanisme.
   ========================================================================== */

/* --- A. Continutul postarii e gol ---------------------------------------
   Pui .l-section--if-content pe sectiunea care tine widget-ul de continut.
   Clasa .no-post-content vine din filtrul body_class din functions.php,
   deci verificarea se face pe server.
   Al doilea selector e rezerva, fara PHP: ceri .c-post-content pe
   containerul interior si se verifica direct in pagina.
   ------------------------------------------------------------------------ */

.no-post-content .l-section--if-content {
  display: none;
}

/* Rezerva se activeaza NUMAI daca exista un element .c-post-content in
   sectiune. Altfel ar ascunde permanent orice sectiune care nu are clasa
   aia, inclusiv cand folosesti varianta PHP. */
.l-section--if-content:has(.c-post-content):not(:has(.c-post-content :is(p, ul, ol, h2, h3, h4, h5, blockquote, figure, table, img, iframe))) {
  display: none;
}

/* --- B. Un listing nu are rezultate -------------------------------------
   Pui .l-section--if-listing pe sectiune. Daca inauntru nu exista niciun
   element de listing, sectiunea dispare cu titlu cu tot.

   Merge pentru: proiectele asociate unui serviciu, serviciile asociate
   unui proiect, lucrarile similare, articolele recente de pe Acasa.
   Nu depinde de relatia JetEngine si nu are nevoie de PHP.
   ------------------------------------------------------------------------ */

/* Acopera ambele generatii de listinguri:
     JetEngine  .jet-listing-grid__item, .jet-listing-dynamic-repeater__item
     Elementor V3  .elementor-loop-item, .e-loop-item
     Elementor V4  [data-e-type="e-collection-loop-item"], [role="listitem"]
   V4 nu mai pune clasa de loop pe element, doar atributele. */
.l-section--if-listing:not(:has(
  .jet-listing-grid__item,
  .jet-listing-dynamic-repeater__item,
  .elementor-loop-item,
  .e-loop-item,
  [data-e-type="e-collection-loop-item"],
  [data-element_type="e-collection-loop-item"],
  [role="listitem"]
)) {
  display: none;
}

/* Mesajul implicit de tip "nimic gasit" nu mai apare, sectiunea e ascunsa */
.l-section--if-listing .jet-listing-not-found {
  display: none;
}

/* --- C. Utilitar general ------------------------------------------------ */

.u-hide-if-empty:empty,
.u-hide-if-empty:not(:has(*:not(:empty))) {
  display: none;
}

/* --------------------------------------------------------------------------
   19d. GAP-URILE PIERDUTE

   Elementor seteaza --widgets-spacing: 0px pe containerele lui si il
   aplica prin gap. Orice container de-al nostru care nu declara gap la
   0,3,0 ramane fara spatiu intre copii.
   -------------------------------------------------------------------------- */

.c-footer__phones.c-footer__phones.c-footer__phones {
  gap: var(--space-2xs);
}

.c-footer__policies.c-footer__policies.c-footer__policies {
  gap: var(--space-2xs) var(--space-sm);
}

.c-social.c-social.c-social {
  gap: var(--space-2xs);
}

.c-header__actions.c-header__actions.c-header__actions {
  gap: var(--space-2xs);
}

.c-footer__list.c-footer__list.c-footer__list {
  gap: var(--space-2xs);
}

.c-card.c-card.c-card {
  gap: var(--space-xs);
}

.c-steps__item.c-steps__item.c-steps__item {
  gap: var(--space-xs);
}

.c-accordion__trigger.c-accordion__trigger.c-accordion__trigger {
  gap: var(--space-sm);
}

.c-form.c-form.c-form {
  gap: var(--space-sm);
}

/* Nota separata din footer isi pastreaza aerul si linia de deasupra */
.c-footer__note.c-footer__note.c-footer__note {
  margin-block-start: var(--space-sm);
  padding-block-start: var(--space-sm);
  border-block-start: var(--border-hair) solid var(--on-surface-border);
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  font-weight: var(--fw-medium);
  line-height: 1.45;
  color: var(--gold-on-surface);
}

/* --------------------------------------------------------------------------
   19e. SPATIEREA PRIN VARIABILELE ELEMENTOR

   Elementor nu scrie gap direct, ci gap: var(--widgets-spacing), iar pe
   containerele lui pune --widgets-spacing: 0px. Daca regula lui castiga,
   gap-ul nostru dispare oricat de specific ar fi selectorul.

   Solutia: pe langa gap, setam si variabilele pe care le citeste el.
   Asa, chiar daca regula lui se aplica, valoarea rezolvata e a noastra.
   -------------------------------------------------------------------------- */

/* Perechea de butoane: telefoane in footer, telefon plus CTA in header */
.c-footer__phones.c-footer__phones.c-footer__phones,
.c-header__actions.c-header__actions.c-header__actions {
  --widgets-spacing: var(--space-sm);
  --widgets-spacing-row: var(--space-2xs);
  --widgets-spacing-column: var(--space-sm);
  --kit-widget-spacing: var(--space-sm);
  gap: var(--space-2xs) var(--space-sm);
}

/* Iconurile sociale raman stranse, sunt un grup vizual compact */
.c-social.c-social.c-social {
  --widgets-spacing: var(--space-2xs);
  --widgets-spacing-row: var(--space-2xs);
  --widgets-spacing-column: var(--space-2xs);
  --kit-widget-spacing: var(--space-2xs);
  gap: var(--space-2xs);
}

.c-footer__policies.c-footer__policies.c-footer__policies {
  --widgets-spacing: var(--space-sm);
  --widgets-spacing-row: var(--space-2xs);
  --widgets-spacing-column: var(--space-sm);
  --kit-widget-spacing: var(--space-sm);
  gap: var(--space-2xs) var(--space-sm);
}

.l-cluster.l-cluster.l-cluster {
  --widgets-spacing: var(--cluster-gap, var(--space-xs));
  --widgets-spacing-row: var(--cluster-gap, var(--space-xs));
  --widgets-spacing-column: var(--cluster-gap, var(--space-xs));
  --kit-widget-spacing: var(--cluster-gap, var(--space-xs));
  gap: var(--cluster-gap, var(--space-xs));
}

.l-stack.l-stack.l-stack {
  --widgets-spacing: var(--stack-gap, var(--space-sm));
  --widgets-spacing-row: var(--stack-gap, var(--space-sm));
  --widgets-spacing-column: var(--stack-gap, var(--space-sm));
  --kit-widget-spacing: var(--stack-gap, var(--space-sm));
  gap: var(--stack-gap, var(--space-sm));
}

.l-grid.l-grid.l-grid {
  --widgets-spacing: var(--grid-gap);
  --widgets-spacing-row: var(--grid-gap);
  --widgets-spacing-column: var(--grid-gap);
  --kit-widget-spacing: var(--grid-gap);
  gap: var(--grid-gap);
}

.c-footer__list.c-footer__list.c-footer__list {
  --widgets-spacing: var(--space-2xs);
  --widgets-spacing-row: var(--space-2xs);
  --widgets-spacing-column: var(--space-2xs);
  --kit-widget-spacing: var(--space-2xs);
  gap: var(--space-2xs);
}

/* --------------------------------------------------------------------------
   19f. BUTONUL, TOATE PROPRIETATILE LA 0,3,0

   Ridicasem doar display. Padding-ul, inaltimea minima, conturul si raza
   ramasesera la 0,2,0, unde le bate Elementor. Rezultatul: butoane mai
   inguste si mai joase pe site decat in sablon.
   -------------------------------------------------------------------------- */

.c-button.c-button.c-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2xs);
  min-block-size: var(--control-min-block);
  padding-block: var(--space-2xs);
  padding-inline: var(--control-padding-inline);
  inline-size: auto;
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
  line-height: 1;
  letter-spacing: normal;
  text-align: center;
  text-transform: none;
  text-decoration: none;
  white-space: nowrap;
  border: var(--border-medium) solid transparent;
  border-radius: var(--radius-sm);
  box-shadow: none;
  cursor: pointer;
  transition: var(--transition-color);
}

.c-button--primary.c-button--primary.c-button--primary {
  background-color: var(--color-gold-500);
  border-color: var(--color-gold-500);
  color: var(--color-brand-900);
}

.c-button--primary.c-button--primary.c-button--primary:hover,
.c-button--primary.c-button--primary.c-button--primary:focus-visible {
  background-color: var(--color-gold-700);
  border-color: var(--color-gold-700);
  color: var(--color-surface-000);
}

.c-button--secondary.c-button--secondary.c-button--secondary {
  background-color: transparent;
  border-color: var(--color-brand-900);
  color: var(--color-brand-900);
}

.c-button--secondary.c-button--secondary.c-button--secondary:hover,
.c-button--secondary.c-button--secondary.c-button--secondary:focus-visible {
  background-color: var(--color-brand-900);
  color: var(--color-text-inverse);
}

.l-section--dark .c-button--secondary.c-button--secondary.c-button--secondary,
.c-footer .c-button--secondary.c-button--secondary.c-button--secondary,
.c-cta-band .c-button--secondary.c-button--secondary.c-button--secondary {
  border-color: var(--color-surface-050);
  color: var(--color-surface-050);
}

.l-section--dark .c-button--secondary.c-button--secondary.c-button--secondary:hover,
.c-footer .c-button--secondary.c-button--secondary.c-button--secondary:hover,
.c-cta-band .c-button--secondary.c-button--secondary.c-button--secondary:hover {
  background-color: var(--color-surface-050);
  color: var(--color-brand-900);
}

.c-button--ghost.c-button--ghost.c-button--ghost {
  background-color: transparent;
  border-color: transparent;
  padding-inline: var(--space-xs);
  color: var(--on-surface);
  text-decoration: underline;
  text-decoration-thickness: var(--border-hair);
}

.c-button--block.c-button--block.c-button--block {
  display: flex;
  inline-size: 100%;
}

.c-button.c-button.c-button[aria-disabled="true"],
.c-button.c-button.c-button:disabled {
  opacity: var(--opacity-disabled);
  cursor: not-allowed;
}

/* Varianta construita din widget V3 ramane pe display:contents */
.c-button.c-button.c-button:has(.elementor-button) {
  display: contents;
}

/* --------------------------------------------------------------------------
   20b. IMAGINEA PE FUNDAL INCHIS

   Copertele de articol au fundal bleumarin, ca sa arate bine pe cardurile
   din arhiva, unde sectiunea e alba. In hero-ul intunecat al articolului
   se topesc in fundal.

   Conturul si umbra delimiteaza imaginea fara sa ii schimbe culoarea.
   -------------------------------------------------------------------------- */

.l-section--dark .c-figure__media,
.c-cta-band .c-figure__media {
  border: var(--border-hair) solid var(--color-border-inverse);
  box-shadow: var(--shadow-lg);
  background-color: color-mix(in srgb, var(--color-surface-050) 4%, transparent);
}

/* Varianta cu ramă aurie, pentru cand vrei sa iasa mai tare in evidenta */
.c-figure--framed .c-figure__media {
  border: var(--border-medium) solid var(--color-gold-500);
  box-shadow: var(--shadow-lg);
}

/* ==========================================================================
   22. RANDUL DE CATEGORII

   Categoria curenta trece prima si primeste stilul accentuat, fara PHP
   si fara sa atingi query-ul.

   Mecanismul: WordPress pune pe <body> clasa .category-{slug} pe arhiva
   de categorie, iar linkul badge-ului contine slug-ul in href. Din cele
   doua rezulta care e categoria curenta, iar order: -1 o muta prima.

   Pui .c-term-nav pe containerul listei. Ordinea din query nu conteaza.

   Daca adaugi o categorie noua, adaugi si o regula aici, dupa model.
   ========================================================================== */

.c-term-nav {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2xs);
  list-style: none;
  padding-inline-start: 0;
  margin: 0;
}

.c-term-nav.c-term-nav.c-term-nav {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-content: flex-start;
  --widgets-spacing: var(--space-2xs);
  --widgets-spacing-row: var(--space-2xs);
  --widgets-spacing-column: var(--space-2xs);
  --kit-widget-spacing: var(--space-2xs);
  gap: var(--space-2xs);
}

.c-term-nav > *,
.c-term-nav .elementor-widget {
  order: 0;
  padding: 0;
  margin: 0;
  min-inline-size: 0;
  flex: 0 1 auto;
}

/* Toate ambalajele dintre .c-term-nav si <a class="c-badge"> devin transparente,
   ca badge-urile sa fie copii DIRECTI ai containerului flex.
   Markup-ul actual nu mai contine .elementor-widget-container, iar widgetul
   .elementor-widget ramanea opac: de aici badge-urile pe coloana.
   Clasa e dublata (0,3,0) pentru ca display e o proprietate pe care
   Elementor o seteaza implicit. */
.c-term-nav.c-term-nav .elementor-widget,
.c-term-nav.c-term-nav .elementor-widget-container,
.c-term-nav.c-term-nav .jet-listing,
.c-term-nav.c-term-nav .jet-listing-grid,
.c-term-nav.c-term-nav .jet-listing-grid__items,
.c-term-nav.c-term-nav .jet-listing-grid__item,
.c-term-nav.c-term-nav .jet-engine-listing-overlay-wrap,
.c-term-nav.c-term-nav [data-elementor-type] {
  display: contents;
}

/* Butonul de administrare JetEngine, vizibil doar pentru utilizatorii logati.
   Nu e continut, deci nu intra in randul de categorii. */
.c-term-nav.c-term-nav .jet-engine-frontend-query-editor-buttons {
  display: none;
}

/* Badge-ul ramane la latimea textului, chiar daca clasa sta pe un container
   Elementor, care implicit ia 100% din latime. Se aplica la fel si cand
   clasa e chiar pe <a>. */
.c-term-nav.c-term-nav .c-badge {
  display: inline-flex;
  flex: 0 0 auto;
  flex-grow: 0;
  flex-basis: auto;
  inline-size: auto;
  max-inline-size: max-content;
  align-self: flex-start;
  margin-inline: 0;
}

.c-term-nav .c-badge {
  text-decoration: none;
  transition: var(--transition-color);
}

.c-term-nav .c-badge:hover {
  border-color: var(--color-brand-900);
  color: var(--color-brand-900);
}

/* Categoria curenta, prima si accentuata */
.category-ghid .c-term-nav .c-badge[href*="/ghid"],
.category-ghid .c-term-nav .c-badge:has([href*="/ghid"]) {
  order: -1;
  background-color: color-mix(in srgb, var(--color-accent-600) 12%, transparent);
  border-color: color-mix(in srgb, var(--color-accent-600) 30%, transparent);
  color: var(--color-accent-600);
  font-weight: var(--fw-bold);
}
.category-dulgherie .c-term-nav .c-badge[href*="/dulgherie"],
.category-dulgherie .c-term-nav .c-badge:has([href*="/dulgherie"]) {
  order: -1;
  background-color: color-mix(in srgb, var(--color-accent-600) 12%, transparent);
  border-color: color-mix(in srgb, var(--color-accent-600) 30%, transparent);
  color: var(--color-accent-600);
  font-weight: var(--fw-bold);
}
.category-materiale .c-term-nav .c-badge[href*="/materiale"],
.category-materiale .c-term-nav .c-badge:has([href*="/materiale"]) {
  order: -1;
  background-color: color-mix(in srgb, var(--color-accent-600) 12%, transparent);
  border-color: color-mix(in srgb, var(--color-accent-600) 30%, transparent);
  color: var(--color-accent-600);
  font-weight: var(--fw-bold);
}
.category-intretinere .c-term-nav .c-badge[href*="/intretinere"],
.category-intretinere .c-term-nav .c-badge:has([href*="/intretinere"]) {
  order: -1;
  background-color: color-mix(in srgb, var(--color-accent-600) 12%, transparent);
  border-color: color-mix(in srgb, var(--color-accent-600) 30%, transparent);
  color: var(--color-accent-600);
  font-weight: var(--fw-bold);
}
.category-ofertare .c-term-nav .c-badge[href*="/ofertare"],
.category-ofertare .c-term-nav .c-badge:has([href*="/ofertare"]) {
  order: -1;
  background-color: color-mix(in srgb, var(--color-accent-600) 12%, transparent);
  border-color: color-mix(in srgb, var(--color-accent-600) 30%, transparent);
  color: var(--color-accent-600);
  font-weight: var(--fw-bold);
}
.category-reparatii .c-term-nav .c-badge[href*="/reparatii"],
.category-reparatii .c-term-nav .c-badge:has([href*="/reparatii"]) {
  order: -1;
  background-color: color-mix(in srgb, var(--color-accent-600) 12%, transparent);
  border-color: color-mix(in srgb, var(--color-accent-600) 30%, transparent);
  color: var(--color-accent-600);
  font-weight: var(--fw-bold);
}

/* Daca .c-badge e ambalajul, iar <a href> real sta inauntru, linkul
   preia culoarea si greutatea de la badge, ca evidentierea sa se vada. */
.c-term-nav .c-badge a {
  color: inherit;
  font-weight: inherit;
  text-decoration: none;
}

/* Daca marchezi manual elementul curent, functioneaza si asa */
.c-term-nav .c-badge[aria-current="page"] {
  order: -1;
  background-color: color-mix(in srgb, var(--color-accent-600) 12%, transparent);
  border-color: color-mix(in srgb, var(--color-accent-600) 30%, transparent);
  color: var(--color-accent-600);
  font-weight: var(--fw-bold);
}

/* ==========================================================================
   23. GRILE CU NUMAR FIX DE COLOANE

   .l-grid--3 si celelalte variante folosesc auto-fit, deci numarul de
   coloane depinde de latimea disponibila. E potrivit pentru carduri de
   serviciu, unde vrei sa umpli spatiul.

   Pentru carduri cu imagine si titlu lung, cum sunt cele de articol,
   numarul trebuie sa fie previzibil. Clasele de aici il fixeaza.

   Se pun IN LOC de .l-grid--3, nu pe langa. Clasa .l-grid ramane.
   ========================================================================== */

.l-grid--3-fix.l-grid--3-fix.l-grid--3-fix,
.l-grid--2-fix.l-grid--2-fix.l-grid--2-fix,
.l-grid--4-fix.l-grid--4-fix.l-grid--4-fix {
  display: grid;
  gap: var(--grid-gap);
  grid-template-columns: 1fr;
}

@media (min-width: 30em) {
  .l-grid--2-fix.l-grid--2-fix.l-grid--2-fix,
  .l-grid--3-fix.l-grid--3-fix.l-grid--3-fix,
  .l-grid--4-fix.l-grid--4-fix.l-grid--4-fix {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 64em) {
  .l-grid--3-fix.l-grid--3-fix.l-grid--3-fix {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .l-grid--4-fix.l-grid--4-fix.l-grid--4-fix {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/* ==========================================================================
   21. ASCUNDEREA PE BREAKPOINT

   ULTIMA SECTIUNE DIN FISIER. Nu adauga nimic dupa ea.

   Ascunderea trebuie sa bata orice regula de display, inclusiv pe cele
   de la 0,3,0 din sectiunile de mai sus. De aceea clasa e repetata de
   patru ori, 0,4,0, si sta la final: la specificitate egala castiga
   regula scrisa ultima.

   .u-hide-mobile   dispare sub 48em, adica 768px
   .u-hide-compact  dispare sub 64em, adica 1024px
   .u-hide-desktop  dispare de la 48em in sus
   ========================================================================== */

@media (max-width: 47.99em) {
  .u-hide-mobile.u-hide-mobile.u-hide-mobile.u-hide-mobile {
    display: none;
  }
}

@media (max-width: 63.99em) {
  .u-hide-compact.u-hide-compact.u-hide-compact.u-hide-compact {
    display: none;
  }
}

@media (min-width: 48em) {
  .u-hide-desktop.u-hide-desktop.u-hide-desktop.u-hide-desktop {
    display: none;
  }
}

.u-sr-only.u-sr-only.u-sr-only.u-sr-only {
  position: absolute;
  inline-size: var(--border-hair);
  block-size: var(--border-hair);
  padding: 0;
  margin: calc(var(--border-hair) * -1);
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}