/*
 Theme Name:   PropertyPro Care Child
 Theme URI:    https://dev.wpstudio.ro/propertyprocare/
 Description:  Child theme for PropertyPro Care LLC
 Author:       WP Studio
 Template:     bricks
 Version:      1.0.0
*/

/* ============================================================
   DESIGN TOKENS — PropertyPro Care LLC
   Source: DESIGN.md + Working Style Brief v3
   Naming: color named after actual color, no semantic aliases
   ============================================================ */

:root {

  /* ----------------------------------------------------------
     COLORS — Primary palette
     Navy = brand primary, Red = emergency/CTA, Gold = compliance
  ---------------------------------------------------------- */

  /* Navy */
  --navy:           #0a1f44;   /* primary-container — main brand navy */
  --navy-deep:      #00081e;   /* primary — darkest navy, headings */
  --navy-mid:       #203243;   /* inverse-surface — mid navy */
  --navy-tint:      #4c5e86;   /* surface-tint */
  --navy-l-1:       #34466d;   /* on-primary-fixed-variant */
  --navy-l-2:       #7687b2;   /* on-primary-container */
  --navy-l-3:       #b4c6f4;   /* primary-fixed-dim / inverse-primary */
  --navy-l-4:       #d9e2ff;   /* primary-fixed */
  --navy-l-5:       #e8f2ff;   /* inverse-on-surface */

  /* Red */
  --red:            #b02d21;   /* secondary — main brand red */
  --red-deep:       #650001;   /* on-secondary-container */
  --red-dark:       #8e130c;   /* on-secondary-fixed-variant */
  --red-l-1:        #fc6451;   /* secondary-container */
  --red-l-2:        #ffb4a9;   /* secondary-fixed-dim */
  --red-l-3:        #ffdad5;   /* secondary-fixed */

  /* Gold */
  --gold:           #cca730;   /* tertiary-container — compliance badges */
  --gold-deep:      #735c00;   /* tertiary */
  --gold-dark:      #4f3e00;   /* on-tertiary-container */
  --gold-l-1:       #e9c349;   /* tertiary-fixed-dim */
  --gold-l-2:       #ffe088;   /* tertiary-fixed */
  --gold-text:      #241a00;   /* on-tertiary-fixed */

  /* Surface / Background */
  --white:          #ffffff;   /* surface-container-lowest */
  --surface:        #f7f9ff;   /* background / surface */
  --surface-low:    #edf4ff;   /* surface-container-low */
  --surface-mid:    #e3efff;   /* surface-container */
  --surface-high:   #d9eaff;   /* surface-container-high */
  --surface-dim:    #c9dcf3;   /* surface-dim */
  --surface-var:    #d1e4fb;   /* surface-variant */

  /* Text */
  --text-primary:   #091d2e;   /* on-surface / on-background */
  --text-secondary: #44464e;   /* on-surface-variant */
  --text-muted:     #75777f;   /* outline */
  --text-subtle:    #c5c6cf;   /* outline-variant */

  /* Error */
  --error:          #ba1a1a;
  --error-bg:       #ffdad6;

  /* ----------------------------------------------------------
     TYPOGRAPHY — Text scale (body)
     Perfect Fifth ratio (1.5), base 16px mobile / 20px desktop
     All clamp() driven
  ---------------------------------------------------------- */

  --text-2xs: clamp(0.625rem, 0.5rem + 0.3vw, 0.75rem);    /* ~10–12px */
  --text-xs:  clamp(0.75rem,  0.65rem + 0.3vw, 0.875rem);  /* ~12–14px */
  --text-s:   clamp(0.875rem, 0.8rem + 0.3vw, 1rem);       /* ~14–16px */
  --text-m:   clamp(1rem,     0.9rem + 0.5vw, 1.125rem);   /* ~16–18px — base */
  --text-l:   clamp(1.125rem, 1rem + 0.5vw, 1.25rem);      /* ~18–20px */
  --text-xl:  clamp(1.25rem,  1.1rem + 0.6vw, 1.5rem);     /* ~20–24px */
  --text-2xl: clamp(1.5rem,   1.3rem + 0.8vw, 1.875rem);   /* ~24–30px */

  /* ----------------------------------------------------------
     TYPOGRAPHY — Heading scale
     Hanken Grotesk, clamp() driven, mobile-first
  ---------------------------------------------------------- */

  --h1: clamp(1.75rem, 1.2rem + 2.5vw, 3rem);      /* ~28–48px */
  --h2: clamp(1.5rem,  1.1rem + 1.8vw, 2rem);      /* ~24–32px */
  --h3: clamp(1.25rem, 1rem + 1.2vw, 1.5rem);      /* ~20–24px */
  --h4: clamp(1.125rem, 1rem + 0.6vw, 1.25rem);    /* ~18–20px */
  --h5: clamp(1rem,    0.95rem + 0.3vw, 1.125rem); /* ~16–18px */
  --h6: clamp(0.875rem, 0.85rem + 0.2vw, 1rem);    /* ~14–16px */

  /* ----------------------------------------------------------
     SPACING — T-shirt scale, clamp() driven
  ---------------------------------------------------------- */

  --space-2xs: clamp(0.25rem,  0.2rem + 0.2vw, 0.375rem);  /* ~4–6px */
  --space-xs:  clamp(0.5rem,   0.4rem + 0.3vw, 0.75rem);   /* ~8–12px */
  --space-s:   clamp(0.75rem,  0.6rem + 0.4vw, 1rem);      /* ~12–16px */
  --space-m:   clamp(1rem,     0.8rem + 0.6vw, 1.5rem);    /* ~16–24px */
  --space-l:   clamp(1.5rem,   1.2rem + 1vw, 2rem);        /* ~24–32px */
  --space-xl:  clamp(2rem,     1.5rem + 1.5vw, 3rem);      /* ~32–48px */
  --space-2xl: clamp(3rem,     2rem + 3vw, 5rem);          /* ~48–80px */
	
  --logo-height: clamp(3rem, 1.912vw + 2.388rem, 5rem);
  --header-height: calc(var(--logo-height) + var(--space-s) + var(--space-s));  	

  /* ----------------------------------------------------------
     LAYOUT
  ---------------------------------------------------------- */

  --container-max: 1366px;
  --gutter:        clamp(1rem, 0.8rem + 1vw, 1.5rem);

  /* ----------------------------------------------------------
     BORDERS & RADIUS
     Design language: near-flat, 4px default (industrial)
  ---------------------------------------------------------- */

  --radius-sm:  0.125rem;  /* 2px */
  --radius:     0.25rem;   /* 4px — default */
  --radius-md:  0.375rem;  /* 6px */
  --radius-lg:  0.5rem;    /* 8px */
  --radius-xl:  0.75rem;   /* 12px */

  --border-color:       rgba(0, 8, 30, 0.1);  /* navy-deep at 10% */
  --border-color-solid: #c5c6cf;

  /* ----------------------------------------------------------
     FONTS
  ---------------------------------------------------------- */

  --font-heading: 'Hanken Grotesk', sans-serif;
  --font-body:    'Inter', sans-serif;

  /* ----------------------------------------------------------
     SHADOWS
     Minimal — tonal elevation preferred over shadow
  ---------------------------------------------------------- */

  --shadow-card:      0 1px 3px rgba(0, 8, 30, 0.08);
  --shadow-emergency: 0 4px 0 rgba(176, 45, 33, 0.6); /* red hard shadow */

  /* ----------------------------------------------------------
     TRANSITIONS
  ---------------------------------------------------------- */

  --transition: 200ms ease-in-out;
}


/* ============================================================
   GLOBAL RESETS & BASE
   ============================================================ */

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

html {
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-body);
  font-size: var(--text-m);
  line-height: 1.6;
  color: var(--text-primary);
  background-color: var(--surface);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Headings — global defaults */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  font-weight: 700;
  line-height: 1.2;
  color: var(--navy-deep);
  margin: 0;
}

h1 { font-size: var(--h1); font-weight: 800; letter-spacing: -0.02em; }
h2 { font-size: var(--h2); }
h3 { font-size: var(--h3); font-weight: 600; }
h4 { font-size: var(--h4); font-weight: 600; }
h5 { font-size: var(--h5); }
h6 { font-size: var(--h6); }

p {
  margin: 0;
  line-height: 1.6;
}

a {
  color: inherit;
  text-decoration: none;
  transition: color var(--transition);
}

img, svg {
  display: block;
  max-width: 100%;
}

ul, ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* ============================================================
   UTILITY CLASSES
   Used directly in Bricks via custom CSS field on elements
   ============================================================ */
section {
  padding-block: var(--space-2xl);
  padding-inline: var(--gutter);
}

/* Container */
.brxe-container {
  width: 100%;
  max-width: var(--container-max);
  margin-inline: auto;
}

/* Label caps — NAICS codes, trust bar, badges */
.label-caps {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

/* Section label — eyebrow text above headings */
.eyebrow {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--red);
}

/* Industrial top border on cards */
.industrial-border-top {
  border-top: 4px solid var(--navy);
}

.industrial-border-top--red {
  border-top: 4px solid var(--red);
}

/* Accent left border */
.accent-border-left {
  border-left: 4px solid var(--red);
  padding-left: var(--space-m);
}

.clickable-parent::after {
  content: '';
  position: absolute;
  inset: 0;
}

/* ============================================================
   GOOGLE FONTS — loaded via Bricks Settings
   Hanken Grotesk: 400, 500, 700, 800
   Inter: 400, 500, 700
   ============================================================ */


/* ============================================================
   SITE HEADER / NAV
   ============================================================ */

.site-header {
  background-color: var(--white);
  border-bottom: 1px solid var(--border-color-solid);
  transition: box-shadow var(--transition);
  padding-inline: var(--gutter);
}

.site-header.is-scrolled {
  box-shadow: 0 2px 8px rgba(0, 8, 30, 0.1);
}

.nav__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-block: var(--space-s);
  width: var(--container-max);
}

/* Logo */
.nav__logo img {
  height: var(--logo-height);
  width: auto;
  display: block;
  flex-shrink: 0;
}

/* ── Desktop nav menu ─────────────────────────────────────── */

.nav__links .bricks-nav-menu {
  display: flex;
  align-items: center;
  gap: var(--space-m);
  list-style: none;
  margin: 0;
  padding: 0;
  flex-wrap: nowrap;
}

.nav__links .bricks-nav-menu .bricks-menu-item a {
  font-family: var(--font-body);
  font-size: var(--text-2xs);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-secondary);
  text-decoration: none;
  white-space: nowrap;
  padding-block: var(--space-2xs);
  border-bottom: 2px solid transparent;
  transition:
    color var(--transition),
    border-color var(--transition);
}

.nav__links .bricks-nav-menu .bricks-menu-item a:hover {
  color: var(--navy);
  border-bottom-color: var(--red);
}

/* ── CTA button desktop ───────────────────────────────────── */

.nav__links .bricks-nav-menu .cta-menu-button a {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  color: var(--white);
  background-color: var(--navy);
  padding: var(--space-xs) var(--space-s);
  border-radius: var(--radius);
  border: 2px solid var(--navy);
  border-bottom: 2px solid var(--navy);
  transition:
    background-color var(--transition),
    border-color var(--transition);
}

.nav__links .bricks-nav-menu .cta-menu-button a:hover {
  background-color: var(--red);
  border-color: var(--red);
  color: var(--white);
  border-bottom-color: var(--red);
}

/* --- Mobile menu -----------------------------------------------*/

.bricks-mobile-menu-wrapper {
	border-top: 3px solid var(--red) !important;
}

.bricks-mobile-menu .bricks-menu-item:not(:last-child) a::after {
  content: '';
  display: block;
  width: 14px;
  height: 14px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='rgba(255,255,255,0.35)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18l6-6-6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  flex-shrink: 0;
}

.bricks-mobile-menu .bricks-menu-item a {
	display: flex; justify-content: space-between; align-items: center;
}

.bricks-mobile-menu-wrapper li.cta-menu-button a {
  display: block;
  padding: var(--space-s) var(--space-m);
  text-align: center;
  background-color: var(--red);
  color: var(--white);
  padding: var(--space-s) var(--space-m);
  border-radius: var(--radius);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-size: var(--text-xs);
}

/* ============================================================
   HERO SECTION
   ============================================================ */
.hero {
  background-color: var(--surface);
}

/* Two-column layout */
.hero__inner {
  display: grid;
  grid-template-columns: 45fr 55fr;
  align-items: center;
  gap: var(--space-xl);
}

/* ── Left column — content ───────────────────────────────── */

.hero__content {
  display: flex;
  flex-direction: column;
  gap: var(--space-m);
}

/* Eyebrow */
.hero .eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  font-size: var(--text-2xs);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--navy-l-1);
  background: var(--navy-l-5);
  padding: var(--space-2xs) var(--space-xs);
  border-radius: var(--radius-lg);
  width: fit-content;
}

/* H1 */
.hero__heading {
  font-family: var(--font-heading);
  font-size: var(--h1);
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: var(--navy-deep);
  max-width: 18ch;
}

/* Highlight "Vacant, Foreclosed & Damaged" */
.hero__heading em {
  font-style: normal;
  color: var(--red);
}

/* Subheadline */
.hero__sub {
  font-family: var(--font-body);
  font-size: var(--text-l);
  line-height: 1.6;
  color: var(--text-secondary);
  max-width: 52ch;
}

.hero figure.caption {
	font-size: var(--text-2xs);
	color: var(--text-subtle);
}

/* ── Buttons ─────────────────────────────────────────────── */

.hero__actions {
  display: flex;
  align-items: center;
  gap: var(--space-s);
  flex-wrap: wrap;
}

/* Primary button — navy */
.btn--primary {
  display: inline-flex;
  align-items: center;
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--white);
  background-color: var(--navy);
  padding: var(--space-s) var(--space-l);
  border-radius: var(--radius);
  border: 2px solid var(--navy);
  text-decoration: none;
  white-space: nowrap;
  transition:
    background-color var(--transition),
    border-color var(--transition);
}

.btn--primary:hover {
  background-color: var(--red);
  border-color: var(--red);
  color: var(--white);
}

/* Secondary button — outline */
.btn--outline {
  display: inline-flex;
  align-items: center;
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--navy);
  background-color: transparent;
  padding: var(--space-s) var(--space-l);
  border-radius: var(--radius);
  border: 2px solid var(--navy);
  text-decoration: none;
  white-space: nowrap;
  transition:
    background-color var(--transition),
    color var(--transition),
    border-color var(--transition);
}

.btn--outline:hover {
  background-color: var(--navy);
  color: var(--white);
}

/* ── Trust indicators ────────────────────────────────────── */

.hero__trust {
  display: flex;
  align-items: center;
  gap: var(--space-m);
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
  padding: 0;
  padding-top: var(--space-m);
}

.hero__trust li {
  display: flex;
  align-items: center;
  gap: var(--space-2xs);
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.hero__trust li::before {
  content: '';
  display: block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: var(--red);
  flex-shrink: 0;
}

/* ── Right column — image ────────────────────────────────── */

.hero__media {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  aspect-ratio: 4 / 3;
}

.hero__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

/* Accent border — industrial detail */
.hero__media::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background-color: var(--red);
  z-index: 1;
}

/* Navy gradient overlay pe stânga imaginii — tranziție spre bg */
.hero__media::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to right,
    rgba(247, 249, 255, 0.15) 0%,
    transparent 40%
  );
  pointer-events: none;
}

/* ── Mobile ──────────────────────────────────────────────── */

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

@media (max-width: 600px) {
  .hero__inner {
    grid-template-columns: 1fr;
    gap: var(--space-l);
  }

  /* Pe mobile — imagine sus, text jos */
  .hero__media {
/*     order: -1; */
    aspect-ratio: 16 / 9;
    border-radius: var(--radius);
  }

  .hero__heading {
    max-width: 100%;
  }

  .hero__sub {
    font-size: var(--text-m);
    max-width: 100%;
  }

  .hero__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .btn--primary,
  .btn--outline {
    text-align: center;
    justify-content: center;
  }

  .hero__trust {
    gap: var(--space-s);
	justify-content: center;  
  }
}

/* ============================================================
   TRUST BAR 
   ============================================================ */

.trust-bar {
  background-color: var(--navy);
  padding-block: var(--space-l);
}

.trust-bar__grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: var(--space-m);
  width: 100%;
}

.trust-bar__item {
  display: flex;
}

/* Icon container devine flex column — icon sus, text jos */
.trust-bar__icon {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--space-xs);
  width: 100%;
}

.trust-bar__icon svg {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  color: var(--navy-l-3);

  /* badge background pe SVG direct */
  background-color: rgba(255, 255, 255, 0.08);
  border-radius: var(--radius);
  padding: var(--space-xs);
  box-sizing: content-box;
}

.trust-bar__label {
  font-family: var(--font-body);
  font-size: var(--text-2xs);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--white);
  line-height: 1.3;
}

/* ── Tablet ──────────────────────────────────────────────── */

@media (max-width: 1024px) {
  .trust-bar__grid {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-l) var(--space-m);
  }
}

/* ── Mobile ──────────────────────────────────────────────── */

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

/* ── Hover animation — subtle lift + icon glow ──────────────── */
 
.trust-bar__icon {
  transition: transform 250ms ease;
}
 
.trust-bar__icon svg {
  transition:
    background-color 250ms ease,
    color 250ms ease;
}
 
.trust-bar__item:hover .trust-bar__icon {
  transform: translateY(-3px);
}
 
.trust-bar__item:hover .trust-bar__icon svg {
  background-color: rgba(255, 255, 255, 0.16);
  color: var(--white);
}

/* ============================================================
   SERVICES SECTION
   ============================================================ */

.services {
  background-color: var(--white);
}

/* ── Section header — split layout (H2 stânga / sub dreapta) ── */

.services .section-header {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  align-items: end;
  gap: var(--space-xl);
  max-width: none;
  margin-top: var(--space-xl);
  margin-bottom: var(--space-2xl);
}

.services .section-header__left {
  display: flex;
  flex-direction: column;
  gap: var(--space-s);
}

.services .eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  font-size: var(--text-2xs);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--navy-l-1);
  background: var(--navy-l-5);
  padding: var(--space-2xs) var(--space-xs);
  border-radius: var(--radius);
  width: fit-content;
}

.section-header__title {
  font-family: var(--font-heading);
  font-size: var(--h2);
  font-weight: 700;
  color: var(--navy-deep);
  line-height: 1.2;
  margin: 0;
}

.section-header__sub {
  font-family: var(--font-body);
  font-size: var(--text-m);
  color: var(--text-secondary);
  line-height: 1.6;
  text-align: left;
}

/* Mobile — revine la stacked vertical, vezi media query jos */

/* ── Grid ─────────────────────────────────────────────────── */

.services__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-l);
  width: 100%;
}

/* ── Card ─────────────────────────────────────────────────── */

.service-card {
  background-color: var(--white);
  border: 1px solid var(--border-color);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition:
    transform var(--transition),
    box-shadow var(--transition);
}

.service-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-card);
}

.service-card__bar {
  height: 4px;
  background-color: var(--navy); /* default — override per card */
}

/* Card-specific accent colors */
.service-card--emergency .service-card__bar {
  background-color: var(--red);
}

.service-card--vendor .service-card__bar {
  background-color: var(--gold);
}

.service-card__icon {
  width: 48px;
  height: 48px;
  background-color: var(--navy-l-5);
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--navy);
  margin: var(--space-l) var(--space-l) 0;
}

.service-card--emergency .service-card__icon {
  background-color: var(--red-l-3);
  color: var(--red);
}

.service-card--vendor .service-card__icon {
  background-color: var(--gold-l-2);
  color: var(--gold-deep);
}

.service-card__icon svg {
  width: 22px;
  height: 22px;
}

.service-card__title {
  font-family: var(--font-heading);
  font-size: var(--h4);
  font-weight: 600;
  color: var(--navy-deep);
  margin: var(--space-m) var(--space-l) var(--space-s);
}

.service-card__list {
  display: flex; flex-direction: column; gap: var(--space-2xs);
  margin: 0 var(--space-l) var(--space-l);
}
.service-card__item {
  position: relative; padding-left: var(--space-m);
  font-family: var(--font-body); font-size: var(--text-xs);
  color: var(--text-secondary); line-height: 1.5;
}
.service-card__item::before {
  content: ''; position: absolute; left: 0; top: 0.5em;
  width: 6px; height: 6px; background: var(--navy-l-3); transform: rotate(45deg);
}
.service-card--emergency .service-card__item::before { background: var(--red-l-2); }

/* ── Tablet ──────────────────────────────────────────────── */

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

  .services .section-header {
    grid-template-columns: 1fr;
    align-items: start;
    gap: var(--space-s);
  }
}

/* ── Mobile ──────────────────────────────────────────────── */

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

  .section-header__title {
    font-size: var(--h3);
  }
}

/* ============================================================
   WHY CHOOSE US
   ============================================================ */

.why-choose-us {
  background-color: var(--surface-low);
  padding-block: var(--space-2xl);
}

.why__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: stretch;
  gap: var(--space-xl);
}

/* ── Media — left column ─────────────────────────────────── */

.why__media {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
	align-self: stretch;
	height: 100%;
/*   aspect-ratio: 4 / 3; */
}

.why__media figure,
.why__media .brxe-image {
  height: 100%;
  display: block;
}

.why__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
}

.why__media::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 4px;
  background-color: var(--navy);
  z-index: 1;
}

/* ── Content — right column ──────────────────────────────── */

.why__content {
  display: flex;
  flex-direction: column;
  gap: var(--space-m);
}

.why-choose-us .eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  font-size: var(--text-2xs);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--navy-l-1);
  background: var(--white);
  padding: var(--space-2xs) var(--space-xs);
  border-radius: var(--radius);
  width: fit-content;
}

.why-choose-us .eyebrow svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}

.why__title {
  font-family: var(--font-heading);
  font-size: var(--h2);
  font-weight: 700;
  color: var(--navy-deep);
  line-height: 1.2;
}

/* ── List — 2 columns ─────────────────────────────────────── */

.why__list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-m) var(--space-l);
  list-style: none;
  margin: 0;
  padding: 0;
  margin-top: var(--space-s);
}

.why__item {
  display: flex;
  align-items: flex-start;
  gap: var(--space-s);
}

.why__item-icon {
  width: 24px;
  height: 24px;
  background-color: var(--navy);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white);
  flex-shrink: 0;
  margin-top: 2px;
}

.why__item-icon svg {
  width: 12px;
  height: 12px;
}

.why__item span:last-child {
  font-family: var(--font-body);
  font-size: var(--text-s);
  font-weight: 600;
  color: var(--text-primary);
  line-height: 1.4;
}

/* ── Tablet ──────────────────────────────────────────────── */

@media (max-width: 1024px) {
  .why__inner {
    grid-template-columns: 1fr;
    gap: var(--space-l);
  }

  .why__media {
    aspect-ratio: 16 / 9;
  }
}

/* ── Mobile ──────────────────────────────────────────────── */

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

  .why__title {
    font-size: var(--h3);
  }
}

/* ============================================================
   GOVERNMENT & PROCUREMENT
   ============================================================ */

.procurement {
  background-color: var(--white);
  padding-block: var(--space-2xl);
}

.procurement__inner {
  display: grid;
  grid-template-columns: 1fr 1.3fr;
  gap: var(--space-xl);
  align-items: start;
}

/* ── Left — content ──────────────────────────────────────── */

.procurement__content {
  display: flex;
  flex-direction: column;
  gap: var(--space-s);
  position: sticky;
  top: calc(var(--header-height) + var(--space-l));
}

.procurement .eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  font-size: var(--text-2xs);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--navy-l-1);
  background: var(--navy-l-5);
  padding: var(--space-2xs) var(--space-xs);
  border-radius: var(--radius);
  width: fit-content;
}

.procurement .eyebrow svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}

.procurement__title {
  font-family: var(--font-heading);
  font-size: var(--h2);
  font-weight: 700;
  color: var(--navy-deep);
  line-height: 1.2;
}

.procurement__sub {
  font-family: var(--font-body);
  font-size: var(--text-m);
  color: var(--text-secondary);
  line-height: 1.6;
}

.btn--download {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--white);
  background-color: var(--navy);
  padding: var(--space-s) var(--space-l);
  border-radius: var(--radius);
  text-decoration: none;
  width: fit-content;
  margin-top: var(--space-xs);
  transition: background-color var(--transition);
}

.btn--download:hover {
  background-color: var(--navy-deep);
}

.btn--download svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

/* ── Right — tables ──────────────────────────────────────── */

.procurement__tables {
  display: flex;
  flex-direction: column;
  gap: var(--space-m);
}

.code-table {
  background-color: var(--white);
  border: 1px solid var(--border-color);
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.code-table__header {
  padding: var(--space-s) var(--space-m);
}

.code-table__header span,
.code-table__header h3 {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--white);
  margin: 0;
}

.code-table--naics .code-table__header {
  background-color: var(--navy);
}

.code-table--psc .code-table__header {
  background-color: var(--red);
}

.code-table__row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--space-xs) var(--space-m);
  border-bottom: 1px solid var(--surface-low);
  gap: var(--space-s);
}

.code-table__row:last-child {
  border-bottom: none;
}

/* Row striping */
.code-table__row:nth-child(even) {
  background-color: var(--surface);
}

.code-table--naics .code-table__code {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: var(--text-xs);
  color: var(--navy);
  font-variant-numeric: tabular-nums;
  flex-shrink: 0;
}

.code-table--psc .code-table__code {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: var(--text-xs);
  color: var(--red);
  font-variant-numeric: tabular-nums;
  flex-shrink: 0;
}

.code-table__desc {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  color: var(--text-secondary);
  text-align: right;
}

/* ── Tablet ──────────────────────────────────────────────── */

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

  .procurement__content {
    position: static;
  }
}

/* ── Mobile ──────────────────────────────────────────────── */

@media (max-width: 600px) {
  .procurement__title {
    font-size: var(--h3);
  }

  .code-table__row {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-2xs);
  }

  .code-table__desc {
    text-align: left;
  }
}

/* ============================================================
   EMERGENCY RESPONSE BANNER
   ============================================================ */

.emergency-banner {
  background-color: var(--red);
  padding-block: var(--space-l);
}

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

/* ── Left — icon + text ──────────────────────────────────── */

.emergency-banner__left {
  display: flex;
  align-items: center;
  gap: var(--space-m);
}

.emergency-banner__icon {
  width: 48px;
  height: 48px;
  background-color: rgba(255, 255, 255, 0.15);
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white);
  flex-shrink: 0;
}

.emergency-banner__icon svg {
  width: 22px;
  height: 22px;
}

.emergency-banner__title {
  font-family: var(--font-heading);
  font-size: var(--text-l);
  font-weight: 600;
  color: var(--white);
  margin: 0 0 2px;
}

.emergency-banner__sub {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  color: rgba(255, 255, 255, 0.75);
  margin: 0;
}

/* ── CTA button ──────────────────────────────────────────── */

.emergency-banner__cta {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  background-color: var(--white);
  color: var(--red);
  font-family: var(--font-body);
  font-weight: 700;
  padding: var(--space-s) var(--space-l);
  border-radius: var(--radius);
  text-decoration: none;
  white-space: nowrap;
  transition: background-color var(--transition);
}

.emergency-banner__cta:hover {
  background-color: var(--red-l-3);
}

.emergency-banner__cta svg {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}

/* ── Mobile ──────────────────────────────────────────────── */

@media (max-width: 600px) {
  .emergency-banner__inner {
    flex-direction: column;
    align-items: stretch;
    text-align: center;
  }

  .emergency-banner__left {
    flex-direction: column;
    text-align: center;
  }

  .emergency-banner__cta {
    justify-content: center;
  }
}

/* ============================================================
   SERVICE COVERAGE AREAS
   ============================================================ */

.coverage {
  background-color: var(--surface);
  padding-block: var(--space-2xl);
}

.coverage__inner {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: var(--space-xl);
  align-items: center;
}

/* ── Left — content ──────────────────────────────────────── */

.coverage__content {
  display: flex;
  flex-direction: column;
  gap: var(--space-s);
}

.coverage__title {
  font-family: var(--font-heading);
  font-size: var(--h2);
  font-weight: 700;
  color: var(--navy-deep);
  line-height: 1.2;
}

.coverage__sub {
  font-family: var(--font-body);
  font-size: var(--text-m);
  color: var(--text-secondary);
  line-height: 1.6;
  margin-bottom: var(--space-s);
}

.coverage__list {
  display: flex;
  flex-direction: column;
  gap: var(--space-s);
  list-style: none;
  margin: 0;
  padding: 0;
}

.coverage__item {
  display: flex;
  align-items: center;
  gap: var(--space-m);
  padding: var(--space-m);
  background-color: var(--white);
  border: 1px solid var(--border-color);
  border-radius: var(--radius);
}

.coverage__item-icon {
  width: 40px;
  height: 40px;
  background-color: var(--navy-l-5);
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--red);
  flex-shrink: 0;
}

.coverage__item-icon svg {
  width: 18px;
  height: 18px;
}

.coverage__item-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.coverage__item-name {
  font-family: var(--font-body);
  font-size: var(--text-m);
  font-weight: 700;
  color: var(--navy-deep);
}

.coverage__item-detail {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  color: var(--text-secondary);
}

/* ── Right — map ─────────────────────────────────────────── */

.coverage__map {
  background-color: var(--surface-low);
  border-radius: var(--radius-lg);
  padding: var(--space-m);
}

.coverage__map svg {
  width: 100%;
  height: auto;
  display: block;
}

/* ── Tablet ──────────────────────────────────────────────── */

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

/* ── Mobile ──────────────────────────────────────────────── */

@media (max-width: 600px) {
  .coverage__title {
    font-size: var(--h3);
  }

  .coverage__item {
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
  }
}

/* ============================================================
   GALLERY
   ============================================================ */

.gallery {
  background-color: var(--surface-low);
  padding-block: var(--space-2xl);
  margin: 0;
}

/* ── Section header ──────────────────────────────────────── */

.gallery .section-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--space-s);
  max-width: 60ch;
  margin-inline: auto;
  margin-bottom: var(--space-xl);
}

.gallery .eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  font-size: var(--text-2xs);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--navy-l-1);
  background: var(--white);
  padding: var(--space-2xs) var(--space-xs);
  border-radius: var(--radius);
  width: fit-content;
}

.gallery .eyebrow svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}

.section-header__title {
  font-family: var(--font-heading);
  font-size: var(--h2);
  font-weight: 700;
  color: var(--navy-deep);
  line-height: 1.2;
}

.section-header__sub {
  font-family: var(--font-body);
  font-size: var(--text-m);
  color: var(--text-secondary);
  line-height: 1.6;
}

/* ── Image Gallery — elementul nativ Bricks ─────────────────
   Markup real generat de Bricks:
   ul.brxe-image-gallery > li.bricks-layout-item > figure > img + figcaption
   ──────────────────────────────────────────────────────────── */

.gallery__grid .brxe-image-gallery {
  list-style: none;
  margin: 0;
  padding: 0;
  gap: var(--space-m);
}

.gallery__grid .bricks-layout-item {
  border-radius: var(--radius);
  overflow: hidden;
  position: relative;
  padding: 0;
}

.gallery__grid .bricks-layout-item figure {
  margin: 0;
  position: relative;
/*   aspect-ratio: 4 / 3; */
}

.gallery__grid .bricks-layout-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
/*   filter: grayscale(100%); */
  transition:
    filter 400ms ease,
    transform 400ms ease;
}

.gallery__grid .bricks-layout-item:hover img {
/*   filter: grayscale(0%); */
  transform: scale(1.04);
}

/* Caption — figcaption nativ Bricks */
.gallery__grid .bricks-image-caption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: var(--navy);
  padding: var(--space-s) var(--space-m);
  transform: translateY(0);
  transition: transform 300ms ease;

  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--white);
  margin: 0;
}

.gallery__grid .bricks-layout-item:hover .bricks-image-caption {
  transform: translateY(100%);
}

/* ── Mobile — caption vizibil tot timpul, nu pe hover ──────── */

@media (max-width: 600px) {
  .section-header__title {
    font-size: var(--h3);
  }

  .gallery__grid .bricks-image-caption {
    transform: translateY(0);
    position: static;
  }
}

/* ============================================================
   COMPANY INFO
   ============================================================ */

.company-info {
  background-color: var(--navy-deep);
  padding-block: var(--space-2xl);
}

.company-info__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-xl);
  align-items: start;
}

/* ── Left — content ──────────────────────────────────────── */

.company-info__content {
  display: flex;
  flex-direction: column;
  gap: var(--space-m);
}

.company-info .eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  font-size: var(--text-2xs);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--navy-l-2);
  background: var(--navy-l-5);
  padding: var(--space-2xs) var(--space-xs);
  border-radius: var(--radius);
  width: fit-content;
}

.company-info .eyebrow svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}

.company-info__title {
  font-family: var(--font-heading);
  font-size: var(--h2);
  font-weight: 700;
  color: var(--white);
  line-height: 1.2;
  margin: 0;
}

.company-info__sub {
  font-family: var(--font-body);
  font-size: var(--text-m);
  color: var(--navy-l-3);
  line-height: 1.6;
}

/* ── Right — company card ────────────────────────────────── */

.company-card {
  background-color: var(--white);
  border: 1px solid var(--border-color);
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.company-card__header {
  background-color: var(--navy);
  padding: var(--space-m);
  display: flex;
  flex-direction: column;
  gap: var(--space-2xs);
}

.company-card__label {
  font-family: var(--font-body);
  font-size: var(--text-2xs);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.6);
}

.company-card__name {
  font-family: var(--font-heading);
  font-size: var(--text-l);
  font-weight: 700;
  color: var(--white);
}

.company-card__body {
  padding: 0 var(--space-m);
}

.company-card__row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--space-s) 0;
  border-bottom: 1px solid var(--surface-low);
  gap: var(--space-s);
}

.company-card__row:last-child {
  border-bottom: none;
}

.company-card__row-label {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
  font-family: var(--font-body);
  font-size: var(--text-xs);
  color: var(--text-secondary);
  flex-shrink: 0;
}

.company-card__row-label svg {
  width: 16px;
  height: 16px;
  color: var(--text-muted);
  flex-shrink: 0;
}

.company-card__row-value {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 600;
  color: var(--text-primary);
  text-align: right;
}

/* Link-uri în card — telefon și email */
a.company-card__row-value {
  color: var(--navy-tint);
  text-decoration: none;
  font-weight: 600;
  transition: color var(--transition);
}

a.company-card__row-value:hover {
  color: var(--red);
}

/* ── Tablet ──────────────────────────────────────────────── */

@media (max-width: 1024px) {
  .company-info__inner {
    grid-template-columns: 1fr;
  }
}

/* ── Mobile ──────────────────────────────────────────────── */

@media (max-width: 600px) {
  .company-info__title {
    font-size: var(--h3);
  }

  .company-card__row {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-2xs);
  }

  .company-card__row-value {
    text-align: left;
  }
}

/* ============================================================
   INDUSTRIES SERVED
   ============================================================ */

.industries {
  background-color: var(--surface);
  padding-block: var(--space-2xl);
}

/* ── Section header — split layout ──────────────────────── */

.industries .section-header {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  align-items: end;
  gap: var(--space-xl);
  margin-bottom: var(--space-xl);
}

.industries .section-header__left {
  display: flex;
  flex-direction: column;
  gap: var(--space-s);
}

.industries .eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  font-size: var(--text-2xs);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--navy-l-1);
  background: var(--white);
  padding: var(--space-2xs) var(--space-xs);
  border-radius: var(--radius);
  width: fit-content;
}

.industries .eyebrow svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}

/* ── Grid ─────────────────────────────────────────────────── */

.industries__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-m);
}

/* ── Card — base ─────────────────────────────────────────── */

.industry-card {
  background-color: var(--white);
  border: 1px solid var(--border-color);
  border-radius: var(--radius-lg);
  display: flex;
  align-items: center;
  gap: var(--space-m);
  padding: var(--space-m);
  transition: box-shadow var(--transition), transform var(--transition);
}

.industry-card:hover {
  box-shadow: var(--shadow-card);
  transform: translateY(-2px);
}

.industry-card__icon {
  width: 36px;
  height: 36px;
  border-radius: var(--radius);
  background-color: var(--navy-l-5);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--navy);
  flex-shrink: 0;
}

.industry-card__icon svg {
  width: 20px;
  height: 20px;
}

.industry-card__title {
  font-family: var(--font-body);
  font-size: var(--text-s);
  font-weight: 600;
  color: var(--navy-deep);
  margin: 0;
  line-height: 1.3;
}

/* ── Card — featured (primele 3) ─────────────────────────── */

.industry-card--featured {
  flex-direction: column;
  align-items: flex-start;
  border-top: 3px solid var(--navy);
  padding: var(--space-l);
  gap: var(--space-s);
}

.industry-card--featured .industry-card__icon {
  width: 44px;
  height: 44px;
}

.industry-card--featured .industry-card__icon svg {
  width: 22px;
  height: 22px;
}

.industry-card--featured .industry-card__title {
  font-family: var(--font-heading);
  font-size: var(--h5);
  font-weight: 700;
}

.industry-card--featured .industry-card__sub {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  color: var(--text-secondary);
  line-height: 1.5;
  margin: 0;
}

/* Featured card — red accent (Insurance) */
.industry-card--featured.industry-card--red {
  border-top-color: var(--red);
}

.industry-card--featured.industry-card--red .industry-card__icon {
  background-color: var(--red-l-3);
  color: var(--red);
}

/* ── Tablet ──────────────────────────────────────────────── */

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

  .industries .section-header {
    grid-template-columns: 1fr;
    gap: var(--space-s);
  }
}

/* ── Mobile ──────────────────────────────────────────────── */

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

/* ============================================================
   CONTACT
   ============================================================ */

.contact {
  background-color: var(--surface-low);
  padding-block: var(--space-2xl);
}

.contact__inner {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: var(--space-xl);
  align-items: start;
}

/* ── Left — content ──────────────────────────────────────── */

.contact__content {
  display: flex;
  flex-direction: column;
  gap: var(--space-m);
  position: sticky;
  top: calc(var(--header-height) + var(--space-l));
}

.contact .eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  font-size: var(--text-2xs);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--navy-l-1);
  background: var(--white);
  padding: var(--space-2xs) var(--space-xs);
  border-radius: var(--radius);
  width: fit-content;
}

.contact .eyebrow svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}

.contact__title {
  font-family: var(--font-heading);
  font-size: var(--h2);
  font-weight: 700;
  color: var(--navy-deep);
  line-height: 1.2;
  margin: 0;
}

.contact__sub {
  font-family: var(--font-body);
  font-size: var(--text-m);
  color: var(--text-secondary);
  line-height: 1.6;
}

/* Contact details */
.contact__details {
  display: flex;
  flex-direction: column;
  gap: var(--space-m);
  margin-top: var(--space-s);
}

.contact__detail-item {
  display: flex;
  align-items: center;
  gap: var(--space-m);
  position: relative;
}

.contact__detail-icon {
  width: 44px;
  height: 44px;
  background-color: var(--navy);
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white);
  flex-shrink: 0;
}

.contact__detail-icon svg {
  width: 18px;
  height: 18px;
}

.contact__detail-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.contact__detail-label {
  font-family: var(--font-body);
  font-size: var(--text-2xs);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.contact__detail-text a {
  font-family: var(--font-body);
  font-size: var(--text-m);
  font-weight: 600;
  color: var(--navy);
  text-decoration: none;
  transition: color var(--transition);
}

.contact__detail-text a:hover {
  color: var(--red);
}

/* ── Right — form ────────────────────────────────────────── */

.contact__form {
  background-color: var(--white);
  border: 1px solid var(--border-color);
  border-radius: var(--radius-lg);
  padding: var(--space-xl);
}

/* Stilizare form nativ Bricks */
.contact__form .brxe-form .form-group {
  margin-bottom: var(--space-m);
}

.contact__form .brxe-form label {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: var(--space-2xs);
  display: block;
}

.contact__form .brxe-form input,
.contact__form .brxe-form select,
.contact__form .brxe-form textarea {
  width: 100%;
  font-family: var(--font-body);
  font-size: var(--text-s);
  color: var(--text-primary);
  background-color: var(--surface);
  border: 1px solid var(--border-color-solid);
  border-radius: var(--radius);
  padding: var(--space-s) var(--space-m);
  transition: border-color var(--transition);
  outline: none;
  appearance: none;
}

.contact__form .brxe-form input:focus,
.contact__form .brxe-form select:focus,
.contact__form .brxe-form textarea:focus {
  border-color: var(--navy);
  background-color: var(--white);
}

.contact__form .brxe-form textarea {
  min-height: 120px;
  resize: vertical;
}

/* Submit button */
.contact__form .brxe-form button[type="submit"] {
  width: 100%;
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--white);
  background-color: var(--navy);
  border: none;
  border-radius: var(--radius);
  padding: var(--space-m) var(--space-l);
  cursor: pointer;
  transition: background-color var(--transition);
}

.contact__form .brxe-form button[type="submit"]:hover {
  background-color: var(--red);
}

/* ── Tablet ──────────────────────────────────────────────── */

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

  .contact__content {
    position: static;
  }
}

/* ── Mobile ──────────────────────────────────────────────── */

@media (max-width: 600px) {
  .contact__title {
    font-size: var(--h3);
  }

  .contact__form {
    padding: var(--space-m);
  }
}

/* ============================================================
   FOOTER
   ============================================================ */

.site-footer {
  background-color: var(--surface);
  padding-block: var(--space-2xl) var(--space-xl);
  padding-inline: var(--gutter);
  background-image: radial-gradient(rgba(10, 31, 68, 0.06) 1px, transparent 1px);;
  background-size: 24px 24px;
}

/* ── Main grid ───────────────────────────────────────────── */

.footer__inner {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1.2fr 1fr;
  gap: var(--space-xl);
  padding-bottom: var(--space-xl);
  border-bottom: 1px solid var(--border-color-solid);
  flex-direction: row;
}

/* ── Column — shared ─────────────────────────────────────── */

.footer__col {
  display: flex;
  flex-direction: column;
  gap: var(--space-m);
}

.footer__col-title {
  font-family: var(--font-body);
  font-size: var(--text-2xs);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-muted);
  padding-bottom: var(--space-xs);
  border-bottom: 1px solid var(--navy-l-5);
}

/* ── Col 1 — brand ───────────────────────────────────────── */

.footer__col--brand img {
  height: var(--logo-height);
  width: auto;
}

.footer__desc {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  color: var(--text-secondary);
  line-height: 1.7;
  margin: 0;
}

/* ── Col 2 — nav ─────────────────────────────────────────── */

.footer__nav .bricks-nav-menu {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  list-style: none;
  margin: 0;
  padding: 0;
}

.footer__nav .bricks-nav-menu li {
	margin: 0;
}

.footer__nav .bricks-nav-menu a {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 500;
  color: var(--text-secondary);
  text-decoration: none;
  transition: color var(--transition);
}

.footer__nav .bricks-nav-menu a:hover {
  color: var(--navy);
}

/* Ascunde CTA și hamburger în footer */
.footer__nav .cta-menu-button,
.footer__nav .bricks-mobile-menu-toggle,
.footer__nav .bricks-mobile-menu-wrapper,
.footer__nav .bricks-mobile-menu-overlay {
  display: none !important;
}

/* ── Col 3 — codes ───────────────────────────────────────── */

.footer__codes {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2xs) var(--space-xs);
}

.footer__codes span {
  font-family: var(--font-body);
  font-size: var(--text-2xs);
  font-weight: 700;
  color: var(--text-muted);
  letter-spacing: 0.04em;
}

.footer__codes span:not(:last-child)::after {
  content: '·';
  margin-left: var(--space-xs);
  opacity: 0.4;
}

/* ── Col 4 — contact ─────────────────────────────────────── */

.footer__contact-item {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
}

.footer__contact-item svg {
  color: var(--text-secondary);
  flex-shrink: 0;
}

.footer__contact-item a {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  color: var(--text-secondary);
  text-decoration: none;
  transition: color var(--transition);
}

.footer__contact-item a:hover {
  color: var(--navy);
}

.footer__location {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
  font-family: var(--font-body);
  font-size: var(--text-xs);
  color: var(--text-muted);
  margin: 0;
}

.footer__location svg {
  flex-shrink: 0;
}

/* ── Bottom bar ──────────────────────────────────────────── */

.footer__bottom {
  padding-top: var(--space-m);
  display: flex;
  flex-direction: row !important;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-m);
  flex-wrap: wrap;
}

.footer__copy,
.footer__legal {
  font-family: var(--font-body);
  font-size: var(--text-2xs);
  color: var(--text-muted);
  margin: 0;
}

/* ── Tablet ──────────────────────────────────────────────── */

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

  .footer__col--brand {
    grid-column: span 2;
  }
}

/* ── Mobile ──────────────────────────────────────────────── */

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

  .footer__col--brand {
    grid-column: span 1;
  }

  .footer__bottom {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ============================================================
   SCROLL REVEAL
   ============================================================ */

/* Base state */
section:not(.bricks-draggable-item):not(.pswp__scroll-wrap) {
  opacity: 0;
  transform: translateY(24px);
  transition:
    opacity 500ms ease,
    transform 500ms ease;
}

/* Visible state - same specificity */
section.is-visible:not(.bricks-draggable-item):not(.pswp__scroll-wrap) {
  opacity: 1;
  transform: translateY(0);
}
/* ============================================================
   BACK TO TOP
   ============================================================ */

.brxe-back-to-top {
  display: flex;
  align-items: center;
  gap: var(--space-xs);
  background-color: var(--navy);
  color: var(--white);
  border: none;
  border-radius: var(--radius);
  padding: var(--space-xs) var(--space-m);
  font-family: var(--font-body);
  font-size: var(--text-2xs);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background-color var(--transition);
}

.brxe-back-to-top:hover {
  background-color: var(--red);
}

.brxe-back-to-top .brxe-icon {
  font-size: 18px;
  color: var(--white);
}

.brxe-back-to-top p {
  margin: 0;
  color: var(--white);
}