/* ==========================================================================
   XpertCMS - theme.css (client / public site)
   ========================================================================== */

/* ---- reset minimal & base ---- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
    margin: 0;
    font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto,
                 "Helvetica Neue", Arial, "Noto Sans", sans-serif;
    line-height: 1.5;
    color: #111827; /* gray-900 */
    background-color: #ffffff;
}
img, svg { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
a:hover { text-decoration: none; }
h1, h2, h3, h4, h5, h6, p, figure { margin: 0; }
ul, ol { margin: 0; padding: 0; }
button { font: inherit; cursor: pointer; border: 0; background: transparent; }
input, textarea, select { font: inherit; color: inherit; }

/* ---- palette (alias-uri tailwind) ---- */
:root {
    --color-white: #ffffff;
    --color-gray-50:  #f9fafb;
    --color-gray-200: #e5e7eb;
    --color-gray-300: #d1d5db;
    --color-gray-500: #6b7280;
    --color-gray-600: #4b5563;
    --color-gray-700: #374151;
    --color-gray-900: #111827;
    --color-blue-50:  #eff6ff;
    --color-blue-500: #3b82f6;
    --color-blue-600: #2563eb;
    --color-green-50:  #f0fdf4;
    --color-green-200: #bbf7d0;
    --color-green-800: #166534;
    --color-red-50:  #fef2f2;
    --color-red-200: #fecaca;
    --color-red-600: #dc2626;
    --color-red-800: #991b1b;
    --shadow-sm: 0 1px 2px 0 rgba(0,0,0,.05);
    --shadow-md: 0 4px 6px -1px rgba(0,0,0,.1), 0 2px 4px -2px rgba(0,0,0,.1);
    --shadow-lg: 0 10px 15px -3px rgba(0,0,0,.1), 0 4px 6px -4px rgba(0,0,0,.1);
    --ring-blue: 0 0 0 3px rgba(59,130,246,.4);
}

/* ---- layout / display ---- */
.block        { display: block; }
.inline-block { display: inline-block; }
.hidden       { display: none; }
.flex         { display: flex; }
.grid         { display: grid; }
.flex-col     { flex-direction: column; }
.flex-1       { flex: 1 1 0%; }
.flex-wrap    { flex-wrap: wrap; }
.items-start    { align-items: flex-start; }
.items-center   { align-items: center; }
.justify-between{ justify-content: space-between; }
.text-center  { text-align: center; }

.gap-2 { gap: .5rem; }
.gap-3 { gap: .75rem; }
.gap-4 { gap: 1rem; }
.gap-6 { gap: 1.5rem; }

/* ---- spacing ---- */
.mx-auto { margin-left: auto; margin-right: auto; }
.mx-2    { margin-left: .5rem; margin-right: .5rem; }
.mt-1 { margin-top: .25rem; }
.mt-3 { margin-top: .75rem; }
.mt-4 { margin-top: 1rem; }
.mt-12{ margin-top: 3rem; }
.mb-1 { margin-bottom: .25rem; }
.mb-2 { margin-bottom: .5rem; }
.mb-4 { margin-bottom: 1rem; }
.mb-6 { margin-bottom: 1.5rem; }
.mb-8 { margin-bottom: 2rem; }

.p-3 { padding: .75rem; }
.p-4 { padding: 1rem; }
.px-2 { padding-left: .5rem; padding-right: .5rem; }
.px-4 { padding-left: 1rem; padding-right: 1rem; }
.px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
.py-1 { padding-top: .25rem; padding-bottom: .25rem; }
.py-2 { padding-top: .5rem; padding-bottom: .5rem; }
.py-4 { padding-top: 1rem; padding-bottom: 1rem; }
.py-8 { padding-top: 2rem; padding-bottom: 2rem; }
.py-10{ padding-top: 2.5rem; padding-bottom: 2.5rem; }
.py-12{ padding-top: 3rem; padding-bottom: 3rem; }
.py-16{ padding-top: 4rem; padding-bottom: 4rem; }

.space-y-1 > * + * { margin-top: .25rem; }
.space-y-4 > * + * { margin-top: 1rem; }

/* ---- sizing ---- */
.w-auto { width: auto; }
.w-full { width: 100%; }
.h-8    { height: 2rem; }
.h-48   { height: 12rem; }
.min-h-screen { min-height: 100vh; }
.max-w-none { max-width: none; }
.max-w-2xl { max-width: 42rem; }
.max-w-3xl { max-width: 48rem; }
.max-w-4xl { max-width: 56rem; }
.max-w-5xl { max-width: 64rem; }
.max-w-6xl { max-width: 72rem; }

/* ---- positioning ---- */
.relative { position: relative; }
.fixed    { position: fixed; }
.absolute { position: absolute; }
.bottom-0 { bottom: 0; }
.inset-x-0 { left: 0; right: 0; }
.z-50 { z-index: 50; }

/* ---- borders ---- */
.border          { border: 1px solid var(--color-gray-200); }
.border-b        { border-bottom: 1px solid var(--color-gray-200); }
.border-t        { border-top: 1px solid var(--color-gray-200); }
.border-gray-200 { border-color: var(--color-gray-200); }
.border-gray-300 { border-color: var(--color-gray-300); }
.border-green-200{ border-color: var(--color-green-200); }
.border-red-200  { border-color: var(--color-red-200); }
.rounded     { border-radius: .25rem; }
.rounded-lg  { border-radius: .5rem; }
.overflow-hidden { overflow: hidden; }

/* ---- backgrounds ---- */
.bg-white     { background-color: var(--color-white); }
.bg-gray-50   { background-color: var(--color-gray-50); }
.bg-gray-900  { background-color: var(--color-gray-900); }
.bg-blue-500  { background-color: var(--color-blue-500); }
.bg-blue-600  { background-color: var(--color-blue-600); }
.bg-green-50  { background-color: var(--color-green-50); }
.bg-red-50    { background-color: var(--color-red-50); }
.bg-gradient-to-b.from-blue-50.to-white {
    background-image: linear-gradient(to bottom, var(--color-blue-50), var(--color-white));
}

/* ---- text / typography ---- */
.text-white   { color: var(--color-white); }
.text-gray-500{ color: var(--color-gray-500); }
.text-gray-600{ color: var(--color-gray-600); }
.text-gray-700{ color: var(--color-gray-700); }
.text-gray-900{ color: var(--color-gray-900); }
.text-blue-600{ color: var(--color-blue-600); }
.text-green-800{ color: var(--color-green-800); }
.text-red-600 { color: var(--color-red-600); }
.text-red-800 { color: var(--color-red-800); }

.text-xs   { font-size: .75rem;  line-height: 1rem; }
.text-sm   { font-size: .875rem; line-height: 1.25rem; }
.text-lg   { font-size: 1.125rem;line-height: 1.75rem; }
.text-2xl  { font-size: 1.5rem;  line-height: 2rem; }
.text-3xl  { font-size: 1.875rem;line-height: 2.25rem; }
.text-4xl  { font-size: 2.25rem; line-height: 2.5rem; }

.font-medium   { font-weight: 500; }
.font-semibold { font-weight: 600; }
.font-bold     { font-weight: 700; }
.tracking-tight{ letter-spacing: -0.025em; }
.uppercase     { text-transform: uppercase; }
.underline     { text-decoration: underline; }
.antialiased   {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* line-clamp helper */
.line-clamp-2,
.line-clamp-3 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.line-clamp-2 { -webkit-line-clamp: 2; }
.line-clamp-3 { -webkit-line-clamp: 3; }

/* ---- effects ---- */
.shadow      { box-shadow: var(--shadow-md); }
.shadow-sm   { box-shadow: var(--shadow-sm); }
.shadow-md   { box-shadow: var(--shadow-md); }
.shadow-lg   { box-shadow: var(--shadow-lg); }
.transition  { transition: all .2s ease; }
.object-cover{ object-fit: cover; }

/* ---- forms ---- */
input[type="text"],
input[type="email"],
input[type="search"],
input[type="tel"],
input[type="url"],
textarea,
select {
    display: block;
    width: 100%;
    padding: .5rem .75rem;
    border: 1px solid var(--color-gray-300);
    border-radius: .25rem;
    background-color: #fff;
    box-shadow: var(--shadow-sm);
}
textarea { resize: vertical; min-height: 8rem; }
input:focus, textarea:focus, select:focus {
    outline: none;
    border-color: var(--color-blue-500);
    box-shadow: var(--ring-blue);
}

/* ---- a11y helpers ---- */
.sr-only {
    position: absolute;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0;
}
.focus\:not-sr-only:focus {
    position: static;
    width: auto; height: auto;
    margin: 0; overflow: visible;
    clip: auto; white-space: normal;
}
.focus\:absolute:focus { position: absolute; }
.focus\:top-2:focus    { top: .5rem; }
.focus\:left-2:focus   { left: .5rem; }

/* ---- grid utilities ---- */
.sm\:grid-cols-2,
.md\:grid-cols-3,
.lg\:grid-cols-3,
.lg\:grid-cols-4 {
    /* mobile-first: o coloana */
    grid-template-columns: 1fr;
}

/* ---- hover states ---- */
.hover\:text-blue-600:hover { color: var(--color-blue-600); }
.hover\:underline:hover     { text-decoration: underline; }
.hover\:shadow-md:hover     { box-shadow: var(--shadow-md); }
.bg-blue-600.hover\:bg-blue-500:hover { background-color: var(--color-blue-500); }

/* ---- focus ring helpers (clase tailwind nu se aplica direct fara JIT;
     ne bazam pe input:focus de mai sus) ---- */
.focus\:border-blue-500:focus { border-color: var(--color-blue-500); }
.focus\:ring-blue-500:focus   { box-shadow: var(--ring-blue); }

/* ---- "prose" minimal pentru continut WYSIWYG (legal pages, services) ---- */
.prose {
    color: var(--color-gray-700);
    line-height: 1.7;
}
.prose h1, .prose h2, .prose h3, .prose h4 {
    color: var(--color-gray-900);
    font-weight: 700;
    margin-top: 1.5em;
    margin-bottom: .5em;
    line-height: 1.3;
}
.prose h1 { font-size: 1.875rem; }
.prose h2 { font-size: 1.5rem; }
.prose h3 { font-size: 1.25rem; }
.prose p, .prose ul, .prose ol, .prose blockquote { margin: 1em 0; }
.prose ul, .prose ol { padding-left: 1.5rem; }
.prose ul { list-style: disc; }
.prose ol { list-style: decimal; }
.prose a  { color: var(--color-blue-600); text-decoration: underline; }
.prose img { margin: 1.5em 0; border-radius: .375rem; }
.prose blockquote {
    border-left: 4px solid var(--color-gray-200);
    padding-left: 1rem;
    color: var(--color-gray-600);
    font-style: italic;
}
.prose code {
    background: var(--color-gray-50);
    padding: .15em .35em;
    border-radius: .25rem;
    font-size: .9em;
}
.prose pre {
    background: var(--color-gray-900);
    color: #fff;
    padding: 1rem;
    border-radius: .375rem;
    overflow-x: auto;
}
.prose pre code { background: transparent; padding: 0; color: inherit; }

/* ==========================================================================
   BIG PRINT SOLUTIONS - PREMIUM BRAND THEME
   --------------------------------------------------------------------------
   Adaugat fara a strica utilitarele anterioare. Variabile, componente
   si sectiuni dedicate site-ului public (homepage, header, footer).
   ========================================================================== */

:root {
    --bps-ink:          #0b1727;
    --bps-ink-2:        #11203a;
    --bps-ink-soft:     #1a2c47;
    --bps-muted:        #5a6b85;
    --bps-line:         #e6e9ef;
    --bps-line-soft:    #eef0f4;
    --bps-cream:        #faf7f2;
    --bps-cream-2:      #f3eee5;
    --bps-accent:       #feb400;
    --bps-accent-hover: #e09e00;
    --bps-accent-soft:  #fff6dc;
    --bps-gold:         #ffd266;
    --bps-radius:       14px;
    --bps-radius-lg:    20px;
    --bps-shadow-sm:    0 1px 2px rgba(11,23,39,.06), 0 1px 1px rgba(11,23,39,.04);
    --bps-shadow:       0 8px 24px -10px rgba(11,23,39,.18), 0 2px 6px -2px rgba(11,23,39,.08);
    --bps-shadow-lg:    0 30px 60px -25px rgba(11,23,39,.35), 0 8px 20px -10px rgba(11,23,39,.18);
    --bps-shadow-glow:  0 20px 50px -15px rgba(254,180,0,.45);
    --bps-font-display: "Plus Jakarta Sans", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
    --bps-font-body:    ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

body {
    font-family: var(--bps-font-body);
    color: var(--bps-ink);
    background-color: #ffffff;
}

h1, h2, h3, h4 { font-family: var(--bps-font-display); letter-spacing: -0.01em; }

/* ---------- helpers extra (le adaugam aici, restul ramane atins) ---------- */
.bps-container { max-width: 1200px; margin-left: auto; margin-right: auto; padding-left: 1.25rem; padding-right: 1.25rem; }
.bps-section   { padding: 5rem 0; }
.bps-section-sm{ padding: 3rem 0; }
.bps-eyebrow {
    display: inline-flex; align-items: center; gap: .5rem;
    font-size: .75rem; font-weight: 700; letter-spacing: .14em;
    text-transform: uppercase; color: var(--bps-accent);
}
.bps-eyebrow::before {
    content: ""; width: 28px; height: 2px; background: var(--bps-accent); border-radius: 2px;
}
.bps-title {
    font-size: clamp(1.875rem, 1.2rem + 2.4vw, 2.75rem);
    line-height: 1.1; font-weight: 800; color: var(--bps-ink);
    margin: .75rem 0 1rem;
}
.bps-title--light { color: #fff; }
.bps-lead {
    color: var(--bps-muted); font-size: 1.0625rem; line-height: 1.7; max-width: 60ch;
}
.bps-lead--center { margin-left: auto; margin-right: auto; }
.bps-section-head { text-align: center; margin-bottom: 3rem; }
.bps-section-head .bps-lead { margin: 0 auto; }

/* ---------- buttons ---------- */
.bps-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: .55rem;
    padding: .85rem 1.4rem; border-radius: 999px; font-weight: 600;
    font-size: .95rem; line-height: 1; transition: transform .15s ease, box-shadow .2s ease, background-color .2s ease, color .2s ease, border-color .2s ease;
    text-decoration: none; cursor: pointer; border: 1px solid transparent;
    white-space: nowrap;
}
.bps-btn svg { width: 18px; height: 18px; }
.bps-btn--primary { background: var(--bps-accent); color: #fff; box-shadow: var(--bps-shadow-glow); }
.bps-btn--primary:hover { background: var(--bps-accent-hover); transform: translateY(-1px); }
.bps-btn--dark { background: var(--bps-ink); color: #fff; }
.bps-btn--dark:hover { background: var(--bps-ink-2); transform: translateY(-1px); }
.bps-btn--ghost { background: transparent; color: var(--bps-ink); border-color: var(--bps-line); }
.bps-btn--ghost:hover { border-color: var(--bps-ink); }
.bps-btn--ghost-light { background: transparent; color: #fff; border-color: rgba(255,255,255,.25); }
.bps-btn--ghost-light:hover { border-color: #fff; background: rgba(255,255,255,.06); }
.bps-btn--sm { padding: .6rem 1rem; font-size: .85rem; }
.bps-btn--block { width: 100%; }

/* ---------- header ---------- */
.bps-header {
    position: sticky; top: 0; z-index: 50;
    background: rgba(255,255,255,.92);
    backdrop-filter: saturate(160%) blur(10px);
    -webkit-backdrop-filter: saturate(160%) blur(10px);
    border-bottom: 1px solid var(--bps-line);
}
.bps-header__inner {
    display: flex; align-items: center; gap: 1.25rem;
    padding: .9rem 0; min-height: 72px;
}
/* Pe desktop: 3 coloane (logo | nav centrat optic | CTA), egale stanga/dreapta
   pentru ca nav-ul sa fie REAL centrat in viewport. */
@media (min-width: 900px) {
    .bps-header__inner {
        display: grid;
        grid-template-columns: 1fr auto 1fr;
        gap: 1rem;
    }
}
.bps-logo {
    display: inline-flex; align-items: center; gap: .65rem;
    font-family: var(--bps-font-display); font-weight: 800;
    color: var(--bps-ink); text-decoration: none; letter-spacing: -0.02em;
}
.bps-logo__mark {
    display: inline-flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; border-radius: 11px;
    background: linear-gradient(135deg, var(--bps-ink) 0%, var(--bps-ink-soft) 100%);
    color: #fff; box-shadow: var(--bps-shadow);
    position: relative; overflow: hidden;
}
.bps-logo__mark::after {
    content: ""; position: absolute; inset: 0;
    background: radial-gradient(120% 80% at 100% 0%, rgba(254,180,0,.55), transparent 60%);
}
.bps-logo__mark span { position: relative; z-index: 1; font-weight: 800; font-size: 1.05rem; }
.bps-logo img { height: 40px; width: auto; display: block; }
.bps-logo__text { display: flex; flex-direction: column; line-height: 1.05; }
.bps-logo__text strong { font-size: 1.05rem; font-weight: 800; }
.bps-logo__text small { font-size: .68rem; font-weight: 600; color: var(--bps-muted); letter-spacing: .14em; text-transform: uppercase; }

/* Nav: centrat optic prin grid pe desktop (vezi .bps-header__inner) */
.bps-nav { display: none; align-items: center; gap: .25rem; }
.bps-nav a {
    display: inline-flex; align-items: center;
    padding: .55rem .9rem; border-radius: 10px;
    color: var(--bps-ink); font-weight: 600; font-size: .94rem;
    text-decoration: none; transition: color .15s ease, background-color .15s ease;
}
.bps-nav a:hover { color: var(--bps-accent); background: var(--bps-accent-soft); }
.bps-nav a[aria-current="page"] { color: var(--bps-accent); }

/* ---------- Header right (single CTA: "Suna acum") ---------- */
/* Pe desktop e in coloana 3 a grid-ului, aliniat la dreapta */
.bps-header__cta { display: none; align-items: center; justify-self: end; }

/* "Suna acum" CTA: buton galben simplu */
.bps-call-cta {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .65rem 1.25rem;
    border-radius: 10px;
    background: var(--bps-accent);
    color: var(--bps-ink);
    font-weight: 500;
    font-size: .94rem;
    text-decoration: none;
    transition: background-color .15s ease;
}
.bps-call-cta:hover { background: var(--bps-accent-hover); }
.bps-call-cta:focus-visible {
    outline: 2px solid var(--bps-ink);
    outline-offset: 2px;
}
.bps-call-cta svg { width: 16px; height: 16px; }
.bps-call-cta--block { width: 100%; justify-content: center; padding: .95rem 1.25rem; font-size: 1rem; }

/* ============================================================
   MOBILE: burger + drawer full-screen (slide stanga -> dreapta)
   Controlat de #bps-burger-toggle (checkbox CSS-only, fara JS)
   ============================================================ */
.bps-burger { display: inline-flex; margin-left: auto; }
.bps-burger-toggle { position: absolute; opacity: 0; pointer-events: none; }
.bps-burger label {
    display: inline-flex; align-items: center; justify-content: center;
    width: 44px; height: 44px; border-radius: 12px; cursor: pointer;
    background: var(--bps-cream); color: var(--bps-ink);
}
.bps-burger label svg { width: 22px; height: 22px; }

/* Overlay (in spatele drawer-ului) - apare cand burger e bifat */
.bps-drawer__overlay {
    position: fixed; inset: 0;
    background: rgba(11, 23, 39, .55);
    opacity: 0; pointer-events: none;
    transition: opacity .25s ease;
    z-index: 60;
    cursor: pointer;
}

/* Drawer-ul propriu-zis: alunecă de la stanga */
.bps-drawer {
    position: fixed; top: 0; left: 0; bottom: 0;
    width: 100%; max-width: 380px;
    background: #fff;
    display: flex; flex-direction: column;
    transform: translateX(-100%);
    transition: transform .3s cubic-bezier(.4, 0, .2, 1);
    z-index: 70;
    box-shadow: 4px 0 24px rgba(11, 23, 39, .12);
    overflow-y: auto;
    overflow-x: hidden; /* CLIP sub-panel-ul cand e translatat la dreapta */
    overscroll-behavior: contain;
}

/* Activarea drawer-ului */
.bps-burger-toggle:checked ~ .bps-drawer__overlay { opacity: 1; pointer-events: auto; }
.bps-burger-toggle:checked ~ .bps-drawer { transform: translateX(0); }
/* Blocheaza scroll-ul body cand drawer e deschis */
body:has(.bps-burger-toggle:checked) { overflow: hidden; }

/* Header drawer: logo + buton inchidere */
.bps-drawer__header {
    display: flex; align-items: center; justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--bps-line);
    flex-shrink: 0;
}
.bps-drawer__logo {
    display: inline-flex; align-items: center; gap: .6rem;
    text-decoration: none; color: var(--bps-ink);
    font-family: var(--bps-font-display); font-weight: 800;
    min-width: 0;
}
.bps-drawer__logo img { height: 36px; width: auto; display: block; }
.bps-drawer__logo-mark {
    display: inline-flex; align-items: center; justify-content: center;
    width: 36px; height: 36px; border-radius: 9px;
    background: linear-gradient(135deg, var(--bps-ink) 0%, var(--bps-ink-soft) 100%);
    color: #fff; font-weight: 800; font-size: .9rem;
    flex: 0 0 36px;
}
.bps-drawer__logo strong {
    font-size: 1rem;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.bps-drawer__close {
    display: inline-flex; align-items: center; justify-content: center;
    width: 44px; height: 44px; border-radius: 12px;
    background: var(--bps-cream); color: var(--bps-ink);
    cursor: pointer; flex-shrink: 0;
    transition: background-color .15s ease;
}
.bps-drawer__close:hover { background: var(--bps-line); }
.bps-drawer__close svg { width: 22px; height: 22px; }

/* Lista de navigare */
.bps-drawer__nav {
    display: flex; flex-direction: column;
    padding: .5rem 0;
    flex: 1;
}
.bps-drawer__link {
    display: flex; align-items: center; gap: 1rem;
    padding: 1rem 1.25rem;
    color: var(--bps-ink);
    font-weight: 600; font-size: 1.02rem;
    text-decoration: none;
    border-bottom: 1px solid var(--bps-line-soft);
    transition: background-color .15s ease;
    cursor: pointer;
}
.bps-drawer__link:hover,
.bps-drawer__link:active { background: var(--bps-cream); }
.bps-drawer__link-icon {
    display: inline-flex; align-items: center; justify-content: center;
    width: 38px; height: 38px; border-radius: 10px;
    background: var(--bps-accent-soft); color: var(--bps-accent);
    flex: 0 0 38px;
    overflow: hidden;
}
.bps-drawer__link-icon svg { width: 18px; height: 18px; }
.bps-drawer__link-icon img,
.bps-drawer__link-icon .bps-cat-visual__img,
.bps-drawer__link-icon .bps-cat-visual__svg {
    width: 100%; height: 100%; object-fit: cover; display: block;
}
.bps-drawer__link-text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.bps-drawer__link-text strong { font-weight: 600; font-size: 1.02rem; color: var(--bps-ink); line-height: 1.2; }
.bps-drawer__link-text small {
    font-weight: 400; font-size: .82rem; color: var(--bps-muted); line-height: 1.3;
    overflow: hidden; text-overflow: ellipsis; display: -webkit-box;
    -webkit-line-clamp: 1; -webkit-box-orient: vertical;
}
.bps-drawer__link-chevron {
    display: inline-flex; align-items: center; justify-content: center;
    color: var(--bps-muted);
    transition: transform .15s ease;
}
.bps-drawer__link-chevron svg { width: 18px; height: 18px; }
.bps-drawer__link:hover .bps-drawer__link-chevron { transform: translateX(2px); color: var(--bps-ink); }

/* Variantă "featured" (ex: "Toate serviciile" in topul sub-panel-ului) */
.bps-drawer__link--featured { background: var(--bps-accent-soft); }
.bps-drawer__link--featured:hover { background: rgba(254, 180, 0, .18); }
.bps-drawer__link--featured .bps-drawer__link-icon {
    background: var(--bps-accent); color: var(--bps-ink);
}

/* ============================================================
   SUB-PANEL Servicii - slide din dreapta peste drawer.
   Design simplu: header cu back + titlu, lista verticala clean.
   ============================================================ */
.bps-drawer__panel {
    position: absolute; inset: 0;
    background: #fff;
    display: flex; flex-direction: column;
    transform: translateX(100%);
    visibility: hidden;
    transition: transform .3s cubic-bezier(.4, 0, .2, 1),
                visibility 0s linear .3s;
    z-index: 2;
    overflow-y: auto;
    overscroll-behavior: contain;
}
.bps-burger-toggle#bps-services-toggle:checked ~ .bps-drawer .bps-drawer__panel {
    transform: translateX(0);
    visibility: visible;
    transition: transform .3s cubic-bezier(.4, 0, .2, 1),
                visibility 0s linear 0s;
}

/* Header sub-panel: back icon + titlu */
.bps-drawer__panel-header {
    display: flex; align-items: center; gap: .25rem;
    padding: .75rem .75rem .75rem .5rem;
    border-bottom: 1px solid var(--bps-line);
    flex-shrink: 0;
    position: sticky; top: 0; background: #fff;
    z-index: 1;
}
.bps-drawer__back {
    display: inline-flex; align-items: center; justify-content: center;
    width: 40px; height: 40px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--bps-ink);
    cursor: pointer;
    flex-shrink: 0;
    transition: background-color .15s ease;
}
.bps-drawer__back:hover { background: var(--bps-cream); color: var(--bps-accent); }
.bps-drawer__back svg { width: 22px; height: 22px; }
.bps-drawer__panel-title {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--bps-ink);
    letter-spacing: -.005em;
}

/* Lista categorii - verticala simpla, separatoare subtile */
.bps-drawer__panel-list {
    display: flex; flex-direction: column;
    padding: .25rem 0;
    flex: 1 1 auto;
}
.bps-drawer__panel-item {
    display: block;
    padding: 1rem 1.25rem;
    color: var(--bps-ink);
    font-size: .98rem;
    font-weight: 500;
    text-decoration: none;
    border-bottom: 1px solid var(--bps-line-soft);
    transition: background-color .12s ease, color .12s ease;
}
.bps-drawer__panel-item:last-child { border-bottom: 0; }
.bps-drawer__panel-item:hover,
.bps-drawer__panel-item:active {
    background: var(--bps-accent-soft);
    color: var(--bps-accent);
}

/* Footer sticky cu CTA "Vezi toate serviciile" - identic vizual cu Suna acum */
.bps-drawer__panel-footer {
    padding: 1rem 1.25rem;
    border-top: 1px solid var(--bps-line);
    background: #fff;
    position: sticky; bottom: 0;
    flex-shrink: 0;
}
.bps-drawer__panel-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: .95rem 1.25rem;
    border-radius: 10px;
    background: var(--bps-accent);
    color: var(--bps-ink);
    font-size: 1rem;
    font-weight: 500;
    text-decoration: none;
    transition: background-color .15s ease;
}
.bps-drawer__panel-cta:hover,
.bps-drawer__panel-cta:active {
    background: var(--bps-accent-hover);
    color: var(--bps-ink);
}

/* Footer drawer cu CTA */
.bps-drawer__footer {
    padding: 1.25rem;
    border-top: 1px solid var(--bps-line);
    background: #fff;
    flex-shrink: 0;
    position: sticky; bottom: 0;
}

/* ---------- HERO ---------- */
.bps-hero {
    position: relative;
    background: radial-gradient(80% 120% at 100% 0%, #18294a 0%, var(--bps-ink) 60%, #06101e 100%);
    color: #fff; overflow: hidden;
}
.bps-hero::before {
    content: ""; position: absolute; inset: 0;
    background:
        radial-gradient(40% 60% at 85% 15%, rgba(254,180,0,.35), transparent 70%),
        radial-gradient(35% 55% at 10% 90%, rgba(255,210,102,.20), transparent 70%);
    pointer-events: none;
}
.bps-hero::after {
    content: ""; position: absolute; inset: 0;
    background-image:
        linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
    background-size: 56px 56px;
    mask-image: radial-gradient(60% 50% at 50% 50%, black, transparent 90%);
    -webkit-mask-image: radial-gradient(60% 50% at 50% 50%, black, transparent 90%);
    pointer-events: none;
}
.bps-hero__inner {
    position: relative; z-index: 1;
    display: grid; grid-template-columns: 1fr; gap: 3rem;
    padding: 4.5rem 0 5rem;
}
.bps-hero__copy { max-width: 640px; }
.bps-hero__badge {
    display: inline-flex; align-items: center; gap: .55rem;
    padding: .4rem .8rem; border-radius: 999px;
    background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.15);
    font-size: .78rem; font-weight: 600; letter-spacing: .04em; color: #fff;
}
.bps-hero__badge .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--bps-accent); box-shadow: 0 0 0 4px rgba(254,180,0,.25); }
.bps-hero h1 {
    font-size: clamp(2.25rem, 1.4rem + 3.6vw, 4rem);
    line-height: 1.05; font-weight: 800; margin: 1.25rem 0 1.25rem;
    letter-spacing: -0.02em;
}
.bps-hero h1 .accent {
    background: linear-gradient(120deg, var(--bps-accent) 0%, var(--bps-gold) 100%);
    -webkit-background-clip: text; background-clip: text; color: transparent;
}
.bps-hero__lead { color: rgba(255,255,255,.78); font-size: 1.1rem; line-height: 1.7; max-width: 56ch; }
.bps-hero__cta { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2rem; }
.bps-hero__meta {
    display: flex; flex-wrap: wrap; gap: 1.5rem 2.25rem; margin-top: 2.5rem;
    padding-top: 2rem; border-top: 1px solid rgba(255,255,255,.10);
}
.bps-hero__metric strong {
    display: block; font-family: var(--bps-font-display); font-size: 1.85rem; font-weight: 800; color: #fff;
}
.bps-hero__metric span { color: rgba(255,255,255,.7); font-size: .85rem; }

.bps-hero__visual { position: relative; }
.bps-hero__card {
    position: relative;
    border-radius: var(--bps-radius-lg);
    background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
    border: 1px solid rgba(255,255,255,.10);
    padding: 1.25rem; backdrop-filter: blur(10px);
    box-shadow: var(--bps-shadow-lg);
}
.bps-hero__mosaic {
    display: grid; grid-template-columns: repeat(6, 1fr); grid-auto-rows: 60px; gap: .6rem;
}
.bps-hero__tile {
    border-radius: 12px; position: relative; overflow: hidden;
    background: #1c2c4a;
}
.bps-hero__tile::after {
    content: ""; position: absolute; inset: 0;
    background: linear-gradient(135deg, rgba(255,255,255,.08), transparent 60%);
}
.bps-hero__tile--a { grid-column: 1 / span 4; grid-row: 1 / span 3; background: linear-gradient(135deg, #feb400 0%, #ffd266 100%); }
.bps-hero__tile--b { grid-column: 5 / span 2; grid-row: 1 / span 2; background: linear-gradient(135deg, #ffc940 0%, #fff0b3 100%); }
.bps-hero__tile--c { grid-column: 5 / span 2; grid-row: 3 / span 2; background: linear-gradient(135deg, #2a3e63 0%, #3b577f 100%); }
.bps-hero__tile--d { grid-column: 1 / span 2; grid-row: 4 / span 2; background: linear-gradient(135deg, #11203a 0%, #1a2c47 100%); border: 1px solid rgba(255,255,255,.08); }
.bps-hero__tile--e { grid-column: 3 / span 2; grid-row: 4 / span 2; background: linear-gradient(135deg, #feb40033, #feb40008); border: 1px solid rgba(254,180,0,.25); }
.bps-hero__tile-label {
    position: absolute; left: .75rem; bottom: .65rem;
    color: #fff; font-weight: 700; font-size: .78rem; letter-spacing: .04em;
    text-shadow: 0 2px 6px rgba(0,0,0,.25); z-index: 1;
}
.bps-hero__sticker {
    position: absolute; bottom: -22px; right: -14px;
    background: #fff; color: var(--bps-ink);
    border-radius: 999px; padding: .8rem 1.1rem;
    box-shadow: var(--bps-shadow);
    display: inline-flex; align-items: center; gap: .6rem; font-weight: 700; font-size: .9rem;
}
.bps-hero__sticker .dot { width: 10px; height: 10px; border-radius: 50%; background: #16a34a; box-shadow: 0 0 0 4px rgba(22,163,74,.18); }

/* ---------- marquee logos ---------- */
.bps-trustbar {
    background: #fff; border-top: 1px solid var(--bps-line); border-bottom: 1px solid var(--bps-line);
    padding: 1.25rem 0;
}
.bps-trustbar__label {
    text-align: center; font-size: .72rem; letter-spacing: .18em;
    text-transform: uppercase; color: var(--bps-muted); font-weight: 700; margin-bottom: 1rem;
}
.bps-trustbar__row {
    display: flex; flex-wrap: wrap; justify-content: center; align-items: center;
    gap: 2rem 3rem; opacity: .75;
}
.bps-trustbar__row span {
    font-family: var(--bps-font-display); font-weight: 800;
    color: var(--bps-ink); letter-spacing: -0.02em; font-size: 1.15rem;
}

/* ---------- service cards ---------- */
.bps-services { background: #fff; }
.bps-grid { display: grid; grid-template-columns: 1fr; gap: 1.25rem; }
.bps-service-card {
    position: relative; padding: 1.75rem;
    background: #fff; border: 1px solid var(--bps-line);
    border-radius: var(--bps-radius); overflow: hidden;
    transition: transform .25s ease, box-shadow .25s ease, border-color .2s ease;
    display: flex; flex-direction: column; min-height: 100%;
}
.bps-service-card:hover {
    transform: translateY(-4px); box-shadow: var(--bps-shadow);
    border-color: transparent;
}
.bps-service-card__icon {
    width: 52px; height: 52px; border-radius: 14px;
    background: var(--bps-accent-soft); color: var(--bps-accent);
    display: inline-flex; align-items: center; justify-content: center;
    margin-bottom: 1.25rem;
}
.bps-service-card__icon svg { width: 26px; height: 26px; }
.bps-service-card h3 {
    font-size: 1.2rem; font-weight: 700; color: var(--bps-ink); margin-bottom: .5rem;
}
.bps-service-card p { color: var(--bps-muted); font-size: .95rem; line-height: 1.65; margin: 0; }
.bps-service-card__link {
    margin-top: 1.25rem; color: var(--bps-accent); font-weight: 700; font-size: .9rem;
    display: inline-flex; align-items: center; gap: .35rem;
    text-decoration: none;
}
.bps-service-card__link svg { width: 16px; height: 16px; flex-shrink: 0; transition: transform .2s ease; }
.bps-service-card:hover .bps-service-card__link svg { transform: translateX(3px); }
.bps-service-card__link:hover { color: var(--bps-accent-hover); }

/* service card with cover image (used in /services listing & home featured) */
.bps-service-card--media { padding: 0; }
.bps-service-card--media .bps-service-card__body { padding: 1.5rem 1.75rem 1.75rem; display: flex; flex-direction: column; flex: 1; }
.bps-service-card__media {
    position: relative; aspect-ratio: 16 / 10; overflow: hidden;
    background: linear-gradient(135deg, var(--bps-cream-2) 0%, var(--bps-cream) 100%);
}
.bps-service-card__media img {
    width: 100%; height: 100%; object-fit: cover; display: block;
    transition: transform .5s ease;
}
.bps-service-card--media:hover .bps-service-card__media img { transform: scale(1.04); }
.bps-service-card__media-fallback {
    position: absolute; inset: 0;
    display: inline-flex; align-items: center; justify-content: center;
    color: var(--bps-accent); opacity: .85;
    font-family: var(--bps-font-display); font-weight: 800; font-size: 5rem;
    letter-spacing: -0.02em; text-transform: uppercase;
    text-shadow: 0 4px 12px rgba(254,180,0,.25);
}
.bps-service-card__tag {
    position: absolute; top: 1rem; left: 1rem;
    background: rgba(255,255,255,.95); color: var(--bps-ink);
    font-size: .7rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
    padding: .35rem .65rem; border-radius: 999px;
    box-shadow: var(--bps-shadow-sm);
}

/* icon-only "cover" - used when there is no image (e.g. static homepage cards) */
.bps-service-card__cover {
    position: relative; aspect-ratio: 16 / 10; overflow: hidden;
    background:
        radial-gradient(120% 90% at 0% 0%, rgba(254,180,0,.18), transparent 60%),
        linear-gradient(135deg, var(--bps-ink) 0%, var(--bps-ink-soft) 100%);
    color: #fff;
    display: flex; align-items: center; justify-content: center;
}
.bps-service-card__cover::before {
    content: ""; position: absolute; inset: 0;
    background-image:
        linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
    background-size: 28px 28px;
    mask-image: radial-gradient(70% 70% at 50% 50%, black, transparent 95%);
    -webkit-mask-image: radial-gradient(70% 70% at 50% 50%, black, transparent 95%);
}
.bps-service-card__cover-icon {
    position: relative; z-index: 1;
    width: 72px; height: 72px; border-radius: 18px;
    background: var(--bps-accent); color: var(--bps-ink);
    display: inline-flex; align-items: center; justify-content: center;
    box-shadow: 0 14px 30px -10px rgba(254,180,0,.55);
}
.bps-service-card__cover-icon svg { width: 34px; height: 34px; }
.bps-service-card__cover-label {
    position: absolute; bottom: 1rem; left: 1.25rem; z-index: 1;
    font-family: var(--bps-font-display); font-weight: 800; font-size: .85rem;
    letter-spacing: .08em; text-transform: uppercase; color: rgba(255,255,255,.55);
}

/* divider with label, used on homepage between static and DB-driven cards */
.bps-featured-divider {
    display: flex; align-items: center; gap: 1rem;
    margin: 3.5rem 0 2rem;
}
.bps-featured-divider span {
    flex: 1; height: 1px; background: var(--bps-line);
}
.bps-featured-divider strong {
    font-family: var(--bps-font-display);
    font-size: .72rem; font-weight: 700; letter-spacing: .18em;
    text-transform: uppercase; color: var(--bps-muted);
}

/* page hero - small banner used on inner pages */
.bps-pagehero {
    position: relative; overflow: hidden; color: #fff;
    background: radial-gradient(80% 120% at 100% 0%, #18294a 0%, var(--bps-ink) 60%, #06101e 100%);
    padding: 2.5rem 0 2.75rem;
}
.bps-pagehero::before {
    content: ""; position: absolute; inset: 0;
    background:
        radial-gradient(40% 60% at 90% 10%, rgba(254,180,0,.30), transparent 70%),
        radial-gradient(35% 60% at 5% 90%, rgba(255,210,102,.18), transparent 70%);
    pointer-events: none;
}
.bps-pagehero::after {
    content: ""; position: absolute; inset: 0;
    background-image:
        linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
    background-size: 56px 56px;
    mask-image: radial-gradient(60% 50% at 50% 50%, black, transparent 90%);
    -webkit-mask-image: radial-gradient(60% 50% at 50% 50%, black, transparent 90%);
    pointer-events: none;
}
.bps-pagehero__inner { position: relative; z-index: 1; }
.bps-pagehero__titlerow {
    display: flex; align-items: flex-end; justify-content: space-between;
    gap: 1.25rem; flex-wrap: wrap;
}
.bps-pagehero__titlerow h1 { flex: 1 1 auto; min-width: 0; }
.bps-pagehero__titlerow .bps-hero-back { margin-top: 0; flex: 0 0 auto; align-self: center; }
.bps-pagehero .bps-breadcrumb { display: none; }
.bps-pagehero .bps-eyebrow { color: var(--bps-accent); }
.bps-pagehero .bps-eyebrow::before { display: none; }
.bps-hero-back {
    display: inline-flex; align-items: center; gap: .4rem;
    margin-top: .9rem;
    padding: .4rem .75rem .4rem .55rem;
    font-size: .8rem; font-weight: 600;
    color: rgba(255,255,255,.85);
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 999px;
    text-decoration: none;
    transition: background .15s ease, border-color .15s ease, color .15s ease, transform .15s ease;
}
.bps-hero-back:hover {
    color: var(--bps-ink);
    background: var(--bps-accent);
    border-color: var(--bps-accent);
}
.bps-hero-back svg { transition: transform .15s ease; }
.bps-hero-back:hover svg { transform: translateX(-2px); }
.bps-pagehero h1 {
    font-size: clamp(1.625rem, 1.15rem + 1.5vw, 2.25rem);
    font-weight: 800; line-height: 1.15; margin: .5rem 0 0;
    letter-spacing: -.015em;
}
.bps-pagehero__lead {
    margin: .75rem 0 0;
    max-width: 62ch;
    font-size: 1rem;
    line-height: 1.6;
    color: rgba(255, 255, 255, .78);
}

/* breadcrumb */
.bps-breadcrumb {
    display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .5rem;
    font-size: .85rem; color: rgba(255,255,255,.65);
}
.bps-breadcrumb a { color: rgba(255,255,255,.85); text-decoration: none; transition: color .15s ease; }
.bps-breadcrumb a:hover { color: var(--bps-accent); }
.bps-breadcrumb__sep { opacity: .5; }
.bps-breadcrumb--light { color: var(--bps-muted); }
.bps-breadcrumb--light a { color: var(--bps-ink); }
.bps-breadcrumb--light a:hover { color: var(--bps-accent); }

/* article - generic content page */
.bps-article {
    max-width: 820px; margin: 0 auto;
}
.bps-article__cover {
    width: 100%; max-height: 480px; object-fit: cover;
    border-radius: var(--bps-radius-lg); margin-bottom: 2rem;
    box-shadow: var(--bps-shadow);
}
.bps-article__lead {
    font-size: 1.2rem; line-height: 1.65; color: var(--bps-ink);
    padding: 1.25rem 1.5rem; border-left: 4px solid var(--bps-accent);
    background: var(--bps-cream); border-radius: 0 var(--bps-radius) var(--bps-radius) 0;
    margin: 0 0 2rem;
}

/* empty state */
.bps-empty {
    text-align: center; padding: 4rem 1.5rem;
    background: var(--bps-cream); border-radius: var(--bps-radius-lg);
    border: 1px dashed var(--bps-line);
}
.bps-empty p { color: var(--bps-muted); font-size: 1rem; margin: 0; }

/* ---------- process / steps ---------- */
.bps-process { background: var(--bps-cream); position: relative; }
.bps-steps { display: grid; grid-template-columns: 1fr; gap: 1.25rem; counter-reset: step; }
.bps-step {
    background: #fff; border: 1px solid var(--bps-line);
    border-radius: var(--bps-radius); padding: 1.75rem;
    position: relative;
}
.bps-step__num {
    counter-increment: step;
    display: inline-flex; align-items: center; justify-content: center;
    width: 44px; height: 44px; border-radius: 12px;
    background: var(--bps-ink); color: #fff;
    font-family: var(--bps-font-display); font-weight: 800; font-size: 1.05rem;
    margin-bottom: 1rem;
}
.bps-step__num::before { content: "0" counter(step); }
.bps-step h3 { font-size: 1.1rem; font-weight: 700; margin-bottom: .35rem; }
.bps-step p { color: var(--bps-muted); font-size: .92rem; line-height: 1.6; margin: 0; }

/* ---------- features (why us) ---------- */
.bps-features { background: #fff; }
.bps-features__grid { display: grid; grid-template-columns: 1fr; gap: 2rem; align-items: center; }
.bps-features__visual {
    position: relative; aspect-ratio: 4/3;
    border-radius: var(--bps-radius-lg);
    background:
        radial-gradient(60% 60% at 30% 30%, rgba(254,180,0,.18), transparent 70%),
        linear-gradient(135deg, var(--bps-ink) 0%, var(--bps-ink-soft) 100%);
    overflow: hidden; box-shadow: var(--bps-shadow-lg);
    display: flex; align-items: center; justify-content: center;
    color: rgba(255,255,255,.85);
}
.bps-features__visual::before {
    content: ""; position: absolute; inset: 0;
    background-image:
        linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);
    background-size: 40px 40px;
}
.bps-features__visual-inner {
    position: relative; text-align: center; padding: 2rem;
}
.bps-features__visual-inner .big {
    display: block; font-family: var(--bps-font-display);
    font-size: clamp(3rem, 2rem + 4vw, 5.5rem); font-weight: 800; line-height: 1;
    background: linear-gradient(120deg, var(--bps-accent) 0%, var(--bps-gold) 100%);
    -webkit-background-clip: text; background-clip: text; color: transparent;
}
.bps-features__visual-inner .lbl { display: block; margin-top: .5rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; font-size: .8rem; }
.bps-feature-list { display: flex; flex-direction: column; gap: 1.25rem; margin-top: 1.5rem; }
.bps-feature {
    display: flex; gap: 1rem; align-items: flex-start;
}
.bps-feature__icon {
    flex-shrink: 0; width: 44px; height: 44px; border-radius: 12px;
    background: var(--bps-accent-soft); color: var(--bps-accent);
    display: inline-flex; align-items: center; justify-content: center;
}
.bps-feature__icon svg { width: 22px; height: 22px; }
.bps-feature h4 { font-size: 1.05rem; font-weight: 700; color: var(--bps-ink); margin-bottom: .25rem; }
.bps-feature p { color: var(--bps-muted); font-size: .92rem; line-height: 1.6; margin: 0; }

/* ---------- stats strip ---------- */
.bps-stats {
    background: var(--bps-ink); color: #fff;
    position: relative; overflow: hidden;
}
.bps-stats::before {
    content:""; position: absolute; inset: 0;
    background:
        radial-gradient(40% 80% at 0% 0%, rgba(254,180,0,.18), transparent 70%),
        radial-gradient(40% 80% at 100% 100%, rgba(255,210,102,.12), transparent 70%);
    pointer-events: none;
}
.bps-stats__grid { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 2rem 1rem; text-align: center; }
.bps-stats__num {
    font-family: var(--bps-font-display); font-size: clamp(2rem, 1.4rem + 2vw, 3rem); font-weight: 800;
    background: linear-gradient(120deg, #fff 0%, #fff0b3 100%);
    -webkit-background-clip: text; background-clip: text; color: transparent;
}
.bps-stats__lbl { display: block; color: rgba(255,255,255,.7); font-size: .85rem; letter-spacing: .04em; margin-top: .35rem; }

/* ---------- testimonials ---------- */
.bps-testimonials { background: var(--bps-cream); }
.bps-tgrid { display: grid; grid-template-columns: 1fr; gap: 1.25rem; }
.bps-tcard {
    background: #fff; border-radius: var(--bps-radius);
    padding: 1.75rem; border: 1px solid var(--bps-line);
    position: relative; display: flex; flex-direction: column; gap: 1rem;
}
.bps-tcard::before {
    content: "\201C"; position: absolute; top: -.5rem; right: 1.25rem;
    font-family: Georgia, serif; font-size: 4rem; line-height: 1; color: var(--bps-accent-soft);
    pointer-events: none;
}
.bps-tcard__stars { color: var(--bps-gold); letter-spacing: 2px; font-size: .95rem; }
.bps-tcard__text { color: var(--bps-ink); font-size: 1rem; line-height: 1.65; flex: 1; }
.bps-tcard__author { display: flex; align-items: center; gap: .8rem; padding-top: .75rem; border-top: 1px solid var(--bps-line-soft); }
.bps-tcard__avatar {
    width: 42px; height: 42px; border-radius: 50%;
    background: linear-gradient(135deg, var(--bps-ink), var(--bps-ink-soft));
    color: #fff; display: inline-flex; align-items: center; justify-content: center;
    font-weight: 700; font-family: var(--bps-font-display);
}
.bps-tcard__author strong { display: block; font-size: .92rem; color: var(--bps-ink); }
.bps-tcard__author span  { display: block; font-size: .8rem; color: var(--bps-muted); }

/* ---------- CTA banner ---------- */
.bps-ctabanner { background: #fff; }
.bps-ctabanner__inner {
    border-radius: var(--bps-radius-lg);
    background: linear-gradient(135deg, var(--bps-ink) 0%, #18294a 60%, #1f3868 100%);
    color: #fff; padding: 3rem 1.75rem; text-align: center;
    position: relative; overflow: hidden;
}
.bps-ctabanner__inner::before {
    content: ""; position: absolute; inset: 0;
    background: radial-gradient(40% 100% at 100% 0%, rgba(254,180,0,.35), transparent 70%);
    pointer-events: none;
}
.bps-ctabanner h2 {
    position: relative; font-size: clamp(1.6rem, 1.1rem + 1.6vw, 2.25rem);
    font-weight: 800; margin-bottom: .75rem; line-height: 1.15;
}
.bps-ctabanner p { position: relative; color: rgba(255,255,255,.8); max-width: 60ch; margin: 0 auto 1.75rem; }
.bps-ctabanner__actions { position: relative; display: flex; flex-wrap: wrap; gap: .75rem; justify-content: center; }

/* Variant full-bleed: background-ul cardului devine background-ul intregii sectiuni */
.bps-ctabanner--bleed {
    background: #07101e;
    color: #fff;
    position: relative;
    overflow: hidden;
}
.bps-ctabanner--bleed::before {
    content: ""; position: absolute; inset: 0;
    pointer-events: none;
}
.bps-ctabanner--bleed::after {
    content: ""; position: absolute; inset: 0;
    background-image:
        linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
    background-size: 56px 56px;
    mask-image: radial-gradient(60% 50% at 50% 50%, black, transparent 90%);
    -webkit-mask-image: radial-gradient(60% 50% at 50% 50%, black, transparent 90%);
    pointer-events: none;
}
.bps-ctabanner--bleed .bps-container { position: relative; }
.bps-ctabanner--bleed .bps-ctabanner__inner {
    background: none;
    border-radius: 0;
    padding: 0;
    overflow: visible;
}
.bps-ctabanner--bleed .bps-ctabanner__inner::before { content: none; }

/* ---------- FAQ ---------- */
.bps-faq { background: #fff; }
.bps-faq__list { display: flex; flex-direction: column; gap: .75rem; max-width: 820px; margin: 0 auto; }
.bps-faq details {
    background: var(--bps-cream); border: 1px solid var(--bps-line);
    border-radius: var(--bps-radius); padding: 1rem 1.25rem;
    transition: background-color .2s ease, border-color .2s ease;
}
.bps-faq details[open] { background: #fff; border-color: var(--bps-ink); box-shadow: var(--bps-shadow-sm); }
.bps-faq summary {
    list-style: none; cursor: pointer; font-weight: 700; color: var(--bps-ink);
    display: flex; align-items: center; justify-content: space-between; gap: 1rem;
    font-size: 1rem;
}
.bps-faq summary::-webkit-details-marker { display: none; }
.bps-faq summary::after {
    content: "+"; font-size: 1.4rem; color: var(--bps-accent); font-weight: 400; line-height: 1;
    transition: transform .2s ease;
}
.bps-faq details[open] summary::after { content: "\2013"; }
.bps-faq__answer { margin-top: .75rem; color: var(--bps-muted); font-size: .95rem; line-height: 1.65; }

/* ---------- contact teaser ---------- */
.bps-contact-teaser { background: var(--bps-ink); color: #fff; position: relative; overflow: hidden; }
.bps-contact-teaser::before {
    content: ""; position: absolute; inset: 0;
    background:
        radial-gradient(40% 100% at 100% 50%, rgba(254,180,0,.20), transparent 70%);
}
.bps-contact-teaser__grid { position: relative; display: grid; grid-template-columns: 1fr; gap: 2rem; }
.bps-contact-teaser h2 { font-size: clamp(1.6rem, 1rem + 1.6vw, 2rem); font-weight: 800; }
.bps-contact-teaser p { color: rgba(255,255,255,.78); margin-top: .75rem; max-width: 50ch; line-height: 1.7; }
.bps-contact-teaser .bps-contact-info { display: grid; grid-template-columns: 1fr; gap: 1rem; }
.bps-contact-teaser .bps-contact-info__item {
    display: flex; gap: 1rem; align-items: flex-start;
    padding: 1.25rem; border: 1px solid rgba(255,255,255,.10);
    border-radius: var(--bps-radius); background: rgba(255,255,255,.03);
}
.bps-contact-teaser .bps-contact-info__icon {
    width: 42px; height: 42px; border-radius: 11px; flex-shrink: 0;
    background: var(--bps-accent); color: #fff;
    display: inline-flex; align-items: center; justify-content: center;
}
.bps-contact-teaser .bps-contact-info__icon svg { width: 20px; height: 20px; }
.bps-contact-teaser .bps-contact-info__item strong { display: block; font-size: .8rem; color: rgba(255,255,255,.6); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; margin-bottom: .25rem; }
.bps-contact-teaser .bps-contact-info__item a, .bps-contact-teaser .bps-contact-info__item span { color: #fff; font-weight: 600; text-decoration: none; }
.bps-contact-teaser .bps-contact-info__item a:hover { color: var(--bps-accent); }

/* ---------- footer ---------- */
.bps-footer { background: #07101e; color: rgba(255,255,255,.72); margin-top: 0; }
.bps-footer__top { padding: 4rem 0 2.5rem; }
.bps-footer__grid {
    display: grid; grid-template-columns: 1fr; gap: 2.5rem;
}
.bps-footer__about p { margin: 1rem 0 1.25rem; line-height: 1.7; max-width: 40ch; }
.bps-footer__brand { color: #fff; }
.bps-footer h4 {
    color: #fff; font-size: .82rem; font-weight: 700; text-transform: uppercase;
    letter-spacing: .14em; margin-bottom: 1rem;
}
.bps-footer ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: .55rem; }
.bps-footer a { color: rgba(255,255,255,.72); text-decoration: none; transition: color .15s ease; font-size: .92rem; }
.bps-footer a:hover { color: var(--bps-accent); }
.bps-footer__contact li { display: flex; gap: .55rem; align-items: flex-start; font-size: .92rem; line-height: 1.55; }
.bps-footer__contact svg { width: 16px; height: 16px; color: var(--bps-accent); margin-top: .15rem; flex-shrink: 0; }
.bps-footer__hours li { display: flex; justify-content: space-between; gap: 1rem; font-size: .9rem; padding: .35rem 0; border-bottom: 1px dashed rgba(255,255,255,.08); }
.bps-footer__hours li span:last-child { color: #fff; font-weight: 600; }
.bps-socials { display: flex; gap: .5rem; margin-top: 1rem; }
.bps-socials a {
    display: inline-flex; align-items: center; justify-content: center;
    width: 38px; height: 38px; border-radius: 10px;
    background: rgba(255,255,255,.06); color: #fff;
    transition: background-color .15s ease, color .15s ease, transform .15s ease;
}
.bps-socials a:hover { background: var(--bps-accent); color: #fff; transform: translateY(-2px); }
.bps-socials svg { width: 18px; height: 18px; }
.bps-footer__bottom {
    border-top: 1px solid rgba(255,255,255,.08);
    padding: 1.25rem 0;
}
.bps-footer__bottom-inner {
    display: flex; flex-direction: column; gap: .75rem;
    align-items: center; justify-content: space-between; text-align: center;
    font-size: .85rem;
}
.bps-footer__legal { display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; justify-content: center; }

/* ---------- responsive breakpoints (mobile-first overrides) ---------- */
@media (min-width: 640px) {
    .bps-grid { grid-template-columns: repeat(2, 1fr); }
    .bps-steps { grid-template-columns: repeat(2, 1fr); }
    .bps-tgrid { grid-template-columns: repeat(2, 1fr); }
    .bps-stats__grid { grid-template-columns: repeat(4, 1fr); }
    .bps-contact-teaser .bps-contact-info { grid-template-columns: repeat(3, 1fr); }
    .bps-footer__bottom-inner { flex-direction: row; text-align: left; }
}
@media (min-width: 900px) {
    .bps-nav { display: inline-flex; }
    .bps-header__cta { display: inline-flex; }
    .bps-burger { display: none; }
    .bps-drawer,
    .bps-drawer__overlay { display: none !important; }
    .bps-hero__inner { grid-template-columns: 1.05fr .95fr; align-items: center; gap: 4rem; padding: 6rem 0 6.5rem; }
    .bps-grid { grid-template-columns: repeat(3, 1fr); }
    .bps-steps { grid-template-columns: repeat(4, 1fr); }
    .bps-tgrid { grid-template-columns: repeat(3, 1fr); }
    .bps-features__grid { grid-template-columns: 1fr 1fr; gap: 4rem; }
    .bps-contact-teaser__grid { grid-template-columns: 1fr 1.1fr; gap: 4rem; align-items: center; }
    .bps-footer__grid { grid-template-columns: 1.6fr 1fr 1fr 1.2fr; }
}
@media (min-width: 1200px) {
    .bps-hero__inner { gap: 5rem; }
}

/* ==========================================================================
   Responsive overrides (mobile-first)
   ========================================================================== */

/* sm: >= 640px */
@media (min-width: 640px) {
    .sm\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sm\:flex-row    { flex-direction: row; }
    .sm\:items-center{ align-items: center; }
}

/* md: >= 768px */
@media (min-width: 768px) {
    .md\:flex              { display: flex; }
    .md\:flex-row          { flex-direction: row; }
    .md\:items-center      { align-items: center; }
    .md\:justify-between   { justify-content: space-between; }
    .md\:grid-cols-3       { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .md\:text-5xl          { font-size: 3rem; line-height: 1; }
}

/* lg: >= 1024px */
@media (min-width: 1024px) {
    .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .lg\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* ============================================================
   Service Categories — dropdown navbar + helpers
   Adaugat de modulul Services. Tine sincronizat cu header.blade.php
   si modules/Services/resources/views/client/partials/category-visual.blade.php
   ============================================================ */

.bps-nav__item {
    position: relative;
    display: inline-flex;
    align-items: center;
}
.bps-nav__link {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
}
.bps-nav__caret {
    width: 14px;
    height: 14px;
    transition: transform .2s ease;
}
.bps-nav__item--has-dropdown:hover .bps-nav__caret,
.bps-nav__item--has-dropdown:focus-within .bps-nav__caret {
    transform: rotate(180deg);
}

/* ============================================================
   Dropdown desktop "Servicii" — panel cu butoane full-width,
   sub-dropdown lateral pe categorie + CTA galben final.
   ============================================================ */
.bps-nav__dropdown {
    position: absolute;
    top: calc(100% + 12px);
    left: 50%;
    width: 300px;
    transform: translateX(-50%) translateY(-6px);
    background: #fff;
    border: 1px solid var(--bps-line);
    border-radius: 14px;
    box-shadow:
        0 1px 0 rgba(11, 23, 39, .03),
        0 18px 40px -12px rgba(11, 23, 39, .18);
    padding: 8px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    box-sizing: border-box;
    opacity: 0;
    visibility: hidden;
    transition: opacity .18s ease, transform .18s ease, visibility .18s;
    z-index: 60;
}
/* Bridge invizibil ca mouse-ul sa nu piarda hover-ul intre link si panel */
.bps-nav__dropdown::before {
    content: "";
    position: absolute;
    left: 0; right: 0;
    top: -12px;
    height: 12px;
}
.bps-nav__item--has-dropdown:hover .bps-nav__dropdown,
.bps-nav__item--has-dropdown:focus-within .bps-nav__dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
}

/* Lista de categorii (butoane verticale full-width) */
.bps-nav__dropdown-list {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

/* Rand (categorie + eventual sub-dropdown) */
.bps-nav__dropdown-row {
    position: relative;
}

/* Buton categorie — full-width in panel.
   Selectorul e prefixat cu .bps-nav ca sa invinga regula globala
   `.bps-nav a:hover` care altfel suprascrie color/background. */
.bps-nav .bps-nav__dropdown-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    width: 100%;
    padding: .65rem .85rem;
    border-radius: 8px;
    font-size: .92rem;
    font-weight: 500;
    line-height: 1.3;
    color: var(--bps-ink);
    text-decoration: none;
    transition: background-color .15s ease, color .15s ease;
}
.bps-nav .bps-nav__dropdown-item:hover,
.bps-nav .bps-nav__dropdown-item:focus-visible,
.bps-nav .bps-nav__dropdown-row.has-children:hover > .bps-nav__dropdown-item {
    background: var(--bps-accent-soft);
    color: var(--bps-accent);
    outline: none;
}
.bps-nav__dropdown-chev {
    width: 14px;
    height: 14px;
    color: var(--bps-muted, #6b7280);
    flex-shrink: 0;
    transition: transform .18s ease, color .15s ease;
}
.bps-nav__dropdown-row.has-children:hover .bps-nav__dropdown-chev {
    color: var(--bps-accent);
    transform: translateX(2px);
}

/* Sub-dropdown lateral cu servicii din categorie */
.bps-nav__subdropdown {
    position: absolute;
    top: -8px;
    left: calc(100% + 10px);
    min-width: 260px;
    max-width: 320px;
    background: #fff;
    border: 1px solid var(--bps-line);
    border-radius: 14px;
    box-shadow:
        0 1px 0 rgba(11, 23, 39, .03),
        0 18px 40px -12px rgba(11, 23, 39, .18);
    padding: 8px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    opacity: 0;
    visibility: hidden;
    transform: translateX(-6px);
    transition: opacity .15s ease, transform .15s ease, visibility .15s;
    z-index: 61;
}
.bps-nav__subdropdown::before {
    content: "";
    position: absolute;
    left: -10px; top: 0;
    width: 10px; height: 100%;
}
.bps-nav__dropdown-row.has-children:hover > .bps-nav__subdropdown,
.bps-nav__dropdown-row.has-children:focus-within > .bps-nav__subdropdown {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
}
.bps-nav .bps-nav__subdropdown-item {
    display: block;
    padding: .6rem .8rem;
    border-radius: 8px;
    font-size: .9rem;
    font-weight: 500;
    line-height: 1.35;
    color: var(--bps-ink);
    text-decoration: none;
    transition: background-color .15s ease;
}
.bps-nav .bps-nav__subdropdown-item:hover,
.bps-nav .bps-nav__subdropdown-item:focus-visible {
    background: var(--bps-accent-soft);
    color: var(--bps-accent);
    outline: none;
}

/* CTA galben "Vezi toate serviciile" — identic cu .bps-call-cta.
   Selectorul e prefixat cu .bps-nav ca sa invinga `.bps-nav a:hover`
   care altfel forta color: accent si background: accent-soft. */
.bps-nav .bps-nav__dropdown-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 8px;
    padding: .65rem 1.25rem;
    border-radius: 10px;
    background: var(--bps-accent);
    color: var(--bps-ink);
    font-size: .94rem;
    font-weight: 500;
    text-decoration: none;
    transition: background-color .15s ease;
}
.bps-nav .bps-nav__dropdown-cta:hover {
    background: var(--bps-accent-hover);
    color: var(--bps-ink);
}
.bps-nav .bps-nav__dropdown-cta:focus-visible {
    outline: 2px solid var(--bps-ink);
    outline-offset: 2px;
}

/* Vizual categorie (folosit in dropdown / pagini) */
.bps-cat-visual__svg,
.bps-cat-visual__img {
    display: block;
}
.bps-cat-visual__img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

@media (max-width: 900px) {
    .bps-nav__dropdown {
        display: none;
    }
}

/* ============================================================
   Service categories — design tokens (consistent cu bps-*)
   ============================================================ */

/* Pagehero variant cu vizual mai compact langa titlu */
.bps-pagehero--cat .bps-pagehero__inner {
    max-width: none;
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
    align-items: center;
}
.bps-pagehero__visual {
    display: flex; align-items: center; justify-content: center;
    width: 104px; height: 104px;
    border-radius: 20px;
    background: linear-gradient(135deg, var(--bps-accent) 0%, #ffd266 100%);
    color: var(--bps-ink);
    box-shadow: 0 14px 32px -12px rgba(254,180,0,.5);
    flex-shrink: 0;
}
.bps-pagehero__visual .bps-cat-visual__svg { width: 48px; height: 48px; }
.bps-pagehero__visual .bps-cat-visual__img { width: 72px; height: 72px; border-radius: 14px; object-fit: cover; }
@media (min-width: 900px) {
    .bps-pagehero--cat .bps-pagehero__inner {
        grid-template-columns: 1fr auto;
        gap: 2rem;
    }
}

/* Categorii grid (pagina /servicii) */
.bps-cat-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.25rem;
}
@media (min-width: 640px) { .bps-cat-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 900px) { .bps-cat-grid { grid-template-columns: repeat(3, 1fr); } }

/* Strip orizontal de chips (homepage + intro pagina /servicii) */
.bps-cat-strip {
    display: flex; flex-wrap: wrap; gap: .65rem;
    margin: 0 0 2.5rem;
    justify-content: center;
}
.bps-cat-chip {
    display: inline-flex; align-items: center; gap: .55rem;
    padding: .55rem 1rem .55rem .55rem;
    background: #fff;
    border: 1px solid var(--bps-line);
    border-radius: 999px;
    color: var(--bps-ink);
    font-size: .88rem; font-weight: 600;
    text-decoration: none;
    transition: border-color .2s ease, transform .15s ease, box-shadow .2s ease;
}
.bps-cat-chip:hover {
    border-color: var(--bps-accent);
    transform: translateY(-1px);
    box-shadow: var(--bps-shadow-sm);
}
.bps-cat-chip__icon {
    width: 28px; height: 28px;
    border-radius: 50%;
    background: var(--bps-accent-soft);
    color: var(--bps-accent);
    display: inline-flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}
.bps-cat-chip__icon .bps-cat-visual__svg { width: 16px; height: 16px; }
.bps-cat-chip__icon .bps-cat-visual__img { width: 22px; height: 22px; border-radius: 50%; object-fit: cover; }

/* Prose container (descriere completa categorie) */
.bps-prose {
    max-width: 760px; margin: 0 auto;
    color: var(--bps-ink); font-size: 1.05rem; line-height: 1.75;
}
.bps-prose h2, .bps-prose h3 {
    font-family: var(--bps-font-display); font-weight: 700;
    margin: 2rem 0 1rem; line-height: 1.25;
}
.bps-prose h2 { font-size: 1.5rem; }
.bps-prose h3 { font-size: 1.2rem; }
.bps-prose p { margin: 0 0 1.1rem; color: var(--bps-muted); }
.bps-prose a { color: var(--bps-accent); text-decoration: underline; text-underline-offset: 3px; }
.bps-prose ul, .bps-prose ol { margin: 0 0 1.1rem 1.25rem; color: var(--bps-muted); }
.bps-prose li { margin-bottom: .35rem; }

.bps-section--narrow { padding-top: 3.5rem; padding-bottom: 3.5rem; }

/* Featured-divider sub categorii pe homepage (separator decorativ) */
.bps-cat-strip + .bps-grid { margin-top: 1rem; }

/* ============================================================
   Categorii servicii pe homepage — card-uri light, TailwindUI-style
   ============================================================ */
.bps-cat-cards {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}
@media (min-width: 640px) { .bps-cat-cards { grid-template-columns: repeat(2, 1fr); gap: 1.25rem; } }
@media (min-width: 1024px) { .bps-cat-cards { grid-template-columns: repeat(3, 1fr); } }

.bps-cat-card {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    padding: 1.5rem;
    background: #fff;
    border: 1px solid var(--bps-line);
    border-radius: 16px;
    color: var(--bps-ink);
    text-decoration: none;
    transition: border-color .18s ease, box-shadow .18s ease;
}
.bps-cat-card:hover {
    box-shadow: 0 18px 40px -20px rgba(11, 23, 39, .25);
}

.bps-cat-card__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: var(--bps-accent);
    color: #fff;
    flex-shrink: 0;
}
.bps-cat-card__icon .bps-cat-visual__svg { width: 24px; height: 24px; }
.bps-cat-card__icon .bps-cat-visual__img {
    width: 100%; height: 100%;
    object-fit: cover;
    border-radius: 12px;
}

.bps-cat-card__body { display: flex; flex-direction: column; gap: .4rem; flex: 1; min-width: 0; }
.bps-cat-card__title {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--bps-ink);
    letter-spacing: -.01em;
    line-height: 1.3;
}
.bps-cat-card__excerpt {
    margin: 0;
    color: var(--bps-muted);
    font-size: .92rem;
    line-height: 1.55;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.bps-cat-card__foot {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    color: var(--bps-accent);
    font-size: .9rem;
    font-weight: 600;
}
.bps-cat-card__link { color: inherit; }
.bps-cat-card__arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: inherit;
}
.bps-cat-card__arrow svg { width: 16px; height: 16px; transition: transform .18s ease; }
.bps-cat-card:hover .bps-cat-card__arrow svg { transform: translateX(3px); }
.bps-cat-card:hover .bps-cat-card__foot { color: var(--bps-accent-hover); }

/* ============================================================
   Parteneri — grid de logo-uri sub butonul "Vezi toate serviciile"
   ============================================================ */
.bps-partners {
    margin-top: 4rem;
    padding-top: 3rem;
    border-top: 1px solid var(--bps-line);
}
.bps-partners__head {
    text-align: center;
    margin-bottom: 2rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .5rem;
}
.bps-partners__lead {
    margin: 0;
    color: var(--bps-muted);
    font-size: .95rem;
    max-width: 540px;
}
.bps-partners__grid {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem 2rem;
    align-items: center;
}
@media (min-width: 640px) { .bps-partners__grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 900px) { .bps-partners__grid { grid-template-columns: repeat(5, 1fr); } }

.bps-partners__item {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 60px;
}
.bps-partners__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    max-width: 140px;
    width: 100%;
    height: 60px;
}
.bps-partners__link img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    filter: grayscale(100%) opacity(.55);
    transition: filter .2s ease;
}
.bps-partners__link:hover img,
.bps-partners__link:focus-visible img {
    filter: grayscale(0) opacity(1);
}

/* ============================================================
   Tab-uri categorii servicii (navigare reala intre pagini)
   ============================================================ */
.bps-cat-tabs {
    background: #fff;
    border-bottom: 1px solid var(--bps-line);
    position: sticky; top: 0; z-index: 30;
}
.bps-cat-tabs__scroller {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1.25rem;
    display: flex;
    gap: .25rem;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.bps-cat-tabs__scroller::-webkit-scrollbar { display: none; }

.bps-cat-tab {
    flex-shrink: 0;
    display: inline-flex; align-items: center; gap: .5rem;
    padding: 1rem .25rem;
    margin: 0 .75rem;
    color: var(--bps-muted);
    font-size: .92rem; font-weight: 600;
    text-decoration: none;
    border-bottom: 2px solid transparent;
    transition: color .15s ease, border-color .15s ease;
    white-space: nowrap;
    scroll-snap-align: start;
}
.bps-cat-tab:first-child { margin-left: 0; }
.bps-cat-tab:last-child  { margin-right: 0; }
.bps-cat-tab:hover {
    color: var(--bps-ink);
}
.bps-cat-tab--active {
    color: var(--bps-ink);
    border-bottom-color: var(--bps-accent);
}
.bps-cat-tab__icon {
    width: 22px; height: 22px;
    display: inline-flex; align-items: center; justify-content: center;
    color: var(--bps-accent);
}
.bps-cat-tab__icon .bps-cat-visual__svg { width: 18px; height: 18px; }
.bps-cat-tab__icon .bps-cat-visual__img { width: 22px; height: 22px; border-radius: 4px; object-fit: cover; }

/* ============================================================
   Grid servicii (in hero, pe pagina de categorie / detaliu serviciu)
   ============================================================ */
.bps-svc-tiles-section {
    position: relative; z-index: 1;
    margin: 1.75rem 0 0;
    padding-top: 1.75rem;
    border-top: 1px solid rgba(255, 255, 255, .10);
}
.bps-svc-tiles__lead {
    margin: 0 0 .75rem;
    font-size: .95rem;
    line-height: 1.5;
    color: rgba(255, 255, 255, .75);
}
.bps-svc-tiles {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: .5rem;
}
.bps-svc-tile {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .65rem;
    min-height: 96px;
    padding: .9rem .75rem;
    background: rgba(255, 255, 255, .03);
    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 10px;
    text-decoration: none;
    transition: background-color .15s ease, border-color .15s ease, transform .15s ease;
    text-align: center;
}
.bps-svc-tile:hover {
    background: rgba(255, 255, 255, .07);
    border-color: rgba(254, 180, 0, .45);
    transform: translateY(-1px);
}
.bps-svc-tile__icon {
    color: rgba(255, 255, 255, .7);
    display: flex; align-items: center; justify-content: center;
    line-height: 0;
    transition: color .15s ease;
}
.bps-svc-tile:hover .bps-svc-tile__icon { color: var(--bps-accent); }
.bps-svc-tile__icon svg { width: 28px; height: 28px; stroke-width: 1.5; }
.bps-svc-tile__icon img { width: 40px; height: 40px; object-fit: contain; }
.bps-svc-tile__label {
    font-family: var(--bps-font-display);
    font-size: .7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: rgba(255, 255, 255, .88);
    line-height: 1.3;
    transition: color .15s ease;
}
.bps-svc-tile:hover .bps-svc-tile__label { color: #fff; }
.bps-svc-tile--active {
    background: rgba(254, 180, 0, .12);
    border-color: rgba(254, 180, 0, .55);
}
.bps-svc-tile--active .bps-svc-tile__label { color: var(--bps-accent); }
.bps-svc-tile--active .bps-svc-tile__icon { color: var(--bps-accent); }
.bps-svc-tile__meta {
    font-size: .68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: rgba(255, 255, 255, .45);
    margin-top: .1rem;
    transition: color .15s ease;
}
.bps-svc-tile:hover .bps-svc-tile__meta { color: var(--bps-accent); }

@media (max-width: 640px) {
    .bps-svc-tiles { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: .4rem; }
    .bps-svc-tile { min-height: 84px; padding: .7rem .5rem; gap: .55rem; }
    .bps-svc-tile__icon svg { width: 24px; height: 24px; }
    .bps-svc-tile__icon img { width: 34px; height: 34px; }
    .bps-svc-tile__label { font-size: .66rem; }
    .bps-svc-tiles-section { margin-top: 1.25rem; padding-top: 1rem; }
}

/* ============================================================
   Sectiuni dinamice serviciu (text / galerie)
   ============================================================ */
.bps-svc-section { padding: 4rem 0; }
.bps-svc-section + .bps-svc-section { padding-top: 4rem; }
.bps-svc-section__inner { max-width: 100%; margin: 0; }
.bps-svc-section__inner .bps-prose { max-width: 100%; margin: 0; }
.bps-svc-section__title {
    font-family: inherit;
    font-size: clamp(1.375rem, 1rem + .8vw, 1.75rem);
    line-height: 1.25;
    font-weight: 700;
    color: var(--bps-ink);
    margin: 0 0 1.25rem;
    letter-spacing: -.005em;
    position: relative;
    padding-bottom: .75rem;
}
.bps-svc-section__title::after {
    content: "";
    position: absolute;
    left: 0; bottom: 0;
    width: 40px; height: 2px;
    background: var(--bps-accent);
    border-radius: 2px;
}

.bps-svc-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: .75rem;
}
.bps-svc-gallery__item {
    display: block;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: var(--bps-cream);
    border: 1px solid var(--bps-line);
    transition: transform .2s ease, border-color .2s ease;
}
.bps-svc-gallery__item img {
    width: 100%; height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .35s ease;
}
.bps-svc-gallery__item:hover { border-color: var(--bps-accent); }
.bps-svc-gallery__item:hover img { transform: scale(1.04); }

@media (max-width: 640px) {
    .bps-svc-gallery { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: .5rem; }
    .bps-svc-section { padding: 2.5rem 0; }
    .bps-svc-section + .bps-svc-section { padding-top: 2.5rem; }
}

/* ============================================================
   Lightbox (galerie servicii / categorii)
   ============================================================ */
.bps-lb {
    position: fixed; inset: 0; z-index: 1000;
    background: rgba(7, 16, 30, .92);
    display: none;
    align-items: center; justify-content: center;
    padding: 1rem;
    opacity: 0;
    transition: opacity .2s ease;
}
.bps-lb.is-open { display: flex; opacity: 1; }
.bps-lb__stage {
    margin: 0;
    max-width: 95vw; max-height: 90vh;
    display: flex; flex-direction: column; align-items: center; gap: .75rem;
}
.bps-lb__img {
    max-width: 95vw; max-height: 82vh;
    object-fit: contain;
    display: block;
    border-radius: 6px;
    box-shadow: 0 12px 48px rgba(0, 0, 0, .5);
    user-select: none;
    -webkit-user-drag: none;
}
.bps-lb__caption {
    color: rgba(255, 255, 255, .85);
    font-size: .9rem;
    text-align: center;
    max-width: 80ch;
    line-height: 1.4;
}
.bps-lb__btn {
    position: absolute;
    appearance: none;
    background: rgba(255, 255, 255, .08);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, .15);
    border-radius: 999px;
    width: 44px; height: 44px;
    display: inline-flex; align-items: center; justify-content: center;
    cursor: pointer;
    transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.bps-lb__btn:hover, .bps-lb__btn:focus-visible {
    background: var(--bps-accent);
    color: var(--bps-ink);
    border-color: var(--bps-accent);
    outline: none;
}
.bps-lb__close { top: 1rem; right: 1rem; }
.bps-lb__prev  { left: 1rem;  top: 50%; transform: translateY(-50%); }
.bps-lb__next  { right: 1rem; top: 50%; transform: translateY(-50%); }
.bps-lb__counter {
    position: absolute; bottom: 1rem; left: 50%; transform: translateX(-50%);
    color: rgba(255, 255, 255, .65);
    font-size: .8rem; letter-spacing: .05em;
    background: rgba(0, 0, 0, .35);
    padding: .25rem .65rem;
    border-radius: 999px;
}

@media (max-width: 640px) {
    .bps-lb__btn { width: 40px; height: 40px; }
    .bps-lb__close { top: .5rem; right: .5rem; }
    .bps-lb__prev  { left: .5rem; }
    .bps-lb__next  { right: .5rem; }
    .bps-lb__img { max-height: 75vh; }
}

/* ============================================================
   Sectiune preturi (table)
   ============================================================ */
.bps-pricing__tablewrap {
    overflow-x: auto;
    margin: .25rem 0 0;
}
.bps-pricing__table {
    width: 100%;
    border-collapse: collapse;
    font-size: .95rem;
    background: transparent;
}
.bps-pricing__table th,
.bps-pricing__table td {
    padding: .9rem 1rem;
    text-align: left;
    border-bottom: 1px solid var(--bps-line);
    color: var(--bps-ink);
    vertical-align: middle;
}
.bps-pricing__table thead th {
    font-weight: 700;
    color: var(--bps-ink);
    font-size: .82rem;
    letter-spacing: .02em;
    border-bottom: 2px solid var(--bps-ink);
    padding-top: .6rem;
    padding-bottom: .6rem;
}
.bps-pricing__table tbody tr:last-child td { border-bottom: none; }
.bps-pricing__table tbody td:first-child { font-weight: 600; }
.bps-pricing__table th:first-child,
.bps-pricing__table td:first-child { padding-left: 0; }
.bps-pricing__table th:last-child,
.bps-pricing__table td:last-child { padding-right: 0; }

.bps-pricing__notes {
    margin: 1.5rem 0 0;
    font-size: .92rem;
    color: var(--bps-muted);
    line-height: 1.7;
}
.bps-pricing__notes p { margin: 0 0 .5rem; }
.bps-pricing__notes p:last-child { margin-bottom: 0; }
.bps-pricing__notes ul { margin: .5rem 0; padding-left: 1.25rem; }
.bps-pricing__notes li { margin: .25rem 0; color: var(--bps-ink); }
.bps-pricing__notes strong { color: var(--bps-ink); }

@media (max-width: 640px) {
    .bps-pricing__table th,
    .bps-pricing__table td { padding: .65rem .65rem; font-size: .85rem; }
    .bps-pricing__notes { font-size: .85rem; }
}

/* ============================================================
   Sticky bottom nav (pagina serviciu)
   ============================================================ */

/* ============================================================
   Homepage - hero (copy + slider) + "why us" grid
   ============================================================ */

/* Hero-ul de homepage: text pe stanga, slider de lucrari pe dreapta.
   Pe mobil totul stivuit, pe desktop grid 2 coloane.
   Fundalul foloseste aceeasi paleta dark + accent ca .bps-pagehero
   pentru consistenta cu paginile interne. */
.bps-hhero {
    position: relative; overflow: hidden; color: #fff;
    background: radial-gradient(75% 110% at 100% 0%, #18294a 0%, var(--bps-ink) 55%, #06101e 100%);
    padding: 3rem 0 3.5rem;
}
.bps-hhero::before {
    content: ""; position: absolute; inset: 0; pointer-events: none;
    background:
        radial-gradient(40% 55% at 90% 10%, rgba(254,180,0,.28), transparent 70%),
        radial-gradient(35% 60% at 5% 95%, rgba(255,210,102,.16), transparent 70%);
}
.bps-hhero::after {
    content: ""; position: absolute; inset: 0; pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
    background-size: 56px 56px;
    mask-image: radial-gradient(60% 50% at 50% 50%, black, transparent 90%);
    -webkit-mask-image: radial-gradient(60% 50% at 50% 50%, black, transparent 90%);
}
.bps-hhero__inner {
    position: relative; z-index: 1;
    display: grid; grid-template-columns: 1fr; gap: 2.5rem;
    align-items: center;
}
@media (min-width: 960px) {
    .bps-hhero { padding: 4.5rem 0 5rem; }
    .bps-hhero__inner { grid-template-columns: 1.05fr 1fr; gap: 3.5rem; }
}

.bps-hhero__copy { max-width: 600px; }
.bps-hhero .bps-eyebrow { color: var(--bps-accent); }
.bps-hhero .bps-eyebrow::before { display: none; }
.bps-hhero__title {
    font-family: var(--bps-font-display);
    font-size: clamp(2rem, 1.3rem + 2.6vw, 3.1rem);
    line-height: 1.08; font-weight: 800; letter-spacing: -.02em;
    margin: .55rem 0 0;
}
.bps-hhero__accent {
    color: var(--bps-accent);
    background: linear-gradient(180deg, transparent 62%, rgba(254,180,0,.18) 62%);
}
.bps-hhero__lead {
    margin: 1.1rem 0 0; max-width: 56ch;
    color: rgba(255,255,255,.78);
    font-size: 1.0625rem; line-height: 1.65;
}
.bps-hhero__cta {
    display: flex; flex-wrap: wrap; gap: .75rem;
    margin-top: 1.75rem;
}
.bps-hhero__metrics {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin: 2.25rem 0 0;
    padding: 1.25rem 0 0;
    border-top: 1px solid rgba(255,255,255,.1);
}
.bps-hhero__metrics > div { min-width: 0; }
.bps-hhero__metrics dt {
    font-family: var(--bps-font-display);
    font-size: clamp(1.35rem, 1.05rem + 1vw, 1.75rem);
    font-weight: 800; color: #fff; letter-spacing: -.01em;
}
.bps-hhero__metrics dd {
    margin: .2rem 0 0;
    color: rgba(255,255,255,.65);
    font-size: .8rem; line-height: 1.35;
}

/* ---------- Slider (pur CSS) ---------- */
.bps-hhero__visual { position: relative; min-width: 0; }

.bps-hslider {
    position: relative;
    aspect-ratio: 4 / 3;
    border-radius: 18px;
    overflow: hidden;
    background: #0b1428;
    box-shadow:
        0 30px 60px -20px rgba(0,0,0,.55),
        0 12px 24px -12px rgba(0,0,0,.4),
        inset 0 0 0 1px rgba(255,255,255,.06);
}
@media (min-width: 1100px) {
    .bps-hslider { aspect-ratio: 5 / 4; }
}

.bps-hslider__input { position: absolute; opacity: 0; pointer-events: none; }

.bps-hslider__track {
    position: absolute; inset: 0;
    list-style: none; margin: 0; padding: 0;
}
.bps-hslider__slide {
    position: absolute; inset: 0;
    opacity: 0;
    transform: scale(1.04);
    transition: opacity .9s ease, transform 6s ease;
    will-change: opacity, transform;
}
.bps-hslider__slide img {
    width: 100%; height: 100%; object-fit: cover; display: block;
    filter: saturate(1.05);
}
.bps-hslider__slide::after {
    /* gradient subtil pentru contrast jos */
    content: ""; position: absolute; inset: 0;
    background: linear-gradient(180deg, transparent 65%, rgba(0,0,0,.35) 100%);
    pointer-events: none;
}

/* Dots de control */
.bps-hslider__dots {
    position: absolute; left: 50%; bottom: 1rem;
    z-index: 3;
    transform: translateX(-50%);
    display: inline-flex; gap: .5rem;
    padding: .35rem .55rem;
    background: rgba(11,20,40,.55);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 999px;
}
.bps-hslider__dots label {
    display: block; width: 8px; height: 8px;
    border-radius: 50%;
    background: rgba(255,255,255,.4);
    cursor: pointer;
    transition: background .2s ease, transform .2s ease, width .25s ease;
}
.bps-hslider__dots label:hover { background: rgba(255,255,255,.7); }

/* --- Selectie manuala (cand userul apasa pe un dot) --- */
/* In ordine pentru fiecare radio: cand este checked, activeaza slide-ul si dot-ul de la acelasi index. */
.bps-hslider__input:nth-of-type(1):checked ~ .bps-hslider__track .bps-hslider__slide:nth-child(1),
.bps-hslider__input:nth-of-type(2):checked ~ .bps-hslider__track .bps-hslider__slide:nth-child(2),
.bps-hslider__input:nth-of-type(3):checked ~ .bps-hslider__track .bps-hslider__slide:nth-child(3),
.bps-hslider__input:nth-of-type(4):checked ~ .bps-hslider__track .bps-hslider__slide:nth-child(4),
.bps-hslider__input:nth-of-type(5):checked ~ .bps-hslider__track .bps-hslider__slide:nth-child(5),
.bps-hslider__input:nth-of-type(6):checked ~ .bps-hslider__track .bps-hslider__slide:nth-child(6) {
    opacity: 1;
    transform: scale(1);
    animation: none;
}
.bps-hslider__input:nth-of-type(1):checked ~ .bps-hslider__dots label:nth-of-type(1),
.bps-hslider__input:nth-of-type(2):checked ~ .bps-hslider__dots label:nth-of-type(2),
.bps-hslider__input:nth-of-type(3):checked ~ .bps-hslider__dots label:nth-of-type(3),
.bps-hslider__input:nth-of-type(4):checked ~ .bps-hslider__dots label:nth-of-type(4),
.bps-hslider__input:nth-of-type(5):checked ~ .bps-hslider__dots label:nth-of-type(5),
.bps-hslider__input:nth-of-type(6):checked ~ .bps-hslider__dots label:nth-of-type(6) {
    background: var(--bps-accent);
    width: 22px; border-radius: 4px;
}

/* --- Autoplay cand utilizatorul nu a interactionat (toate radio-urile neselectate prin :has) ---
   Folosim @supports selector(:has(*)) ca sa nu rupem fallback-ul pe browsere foarte vechi.
   Pe baseline, primul slide ramane vizibil (checked din HTML) si dots-ul de selectie manuala
   functioneaza in orice caz. */
@keyframes bps-hslider-cycle {
    0%, 16% { opacity: 1; transform: scale(1); }
    22%, 100% { opacity: 0; transform: scale(1.06); }
}
@keyframes bps-hslider-dot-cycle {
    0%, 16% { background: var(--bps-accent); width: 22px; border-radius: 4px; }
    22%, 100% { background: rgba(255,255,255,.4); width: 8px; border-radius: 50%; }
}

@supports selector(:has(*)) {
    /* Pana isi alege userul un slide manual, ruleaza autoplay. Aceleasi
       reguli se aplica si pe dot-uri ca sa fie sincronizate cu slide-ul vizibil. */
    .bps-hslider:not(:has(.bps-hslider__input:checked:not(#bps-hslider-0))) .bps-hslider__slide {
        animation: bps-hslider-cycle calc(var(--bps-hslides, 5) * 4.5s) ease-in-out infinite;
    }
    .bps-hslider:not(:has(.bps-hslider__input:checked:not(#bps-hslider-0))) .bps-hslider__dots label {
        animation: bps-hslider-dot-cycle calc(var(--bps-hslides, 5) * 4.5s) ease-in-out infinite;
    }
    /* Offset per slide/dot (negative animation-delay = porneste din mijlocul ciclului).
       Slide:nth-child(N) si dot:nth-of-type(N) primesc EXACT acelasi delay. */
    .bps-hslider:not(:has(.bps-hslider__input:checked:not(#bps-hslider-0))) .bps-hslider__slide:nth-child(1),
    .bps-hslider:not(:has(.bps-hslider__input:checked:not(#bps-hslider-0))) .bps-hslider__dots label:nth-of-type(1) {
        animation-delay: 0s;
    }
    .bps-hslider:not(:has(.bps-hslider__input:checked:not(#bps-hslider-0))) .bps-hslider__slide:nth-child(2),
    .bps-hslider:not(:has(.bps-hslider__input:checked:not(#bps-hslider-0))) .bps-hslider__dots label:nth-of-type(2) {
        animation-delay: calc(4.5s * -4);
    }
    .bps-hslider:not(:has(.bps-hslider__input:checked:not(#bps-hslider-0))) .bps-hslider__slide:nth-child(3),
    .bps-hslider:not(:has(.bps-hslider__input:checked:not(#bps-hslider-0))) .bps-hslider__dots label:nth-of-type(3) {
        animation-delay: calc(4.5s * -3);
    }
    .bps-hslider:not(:has(.bps-hslider__input:checked:not(#bps-hslider-0))) .bps-hslider__slide:nth-child(4),
    .bps-hslider:not(:has(.bps-hslider__input:checked:not(#bps-hslider-0))) .bps-hslider__dots label:nth-of-type(4) {
        animation-delay: calc(4.5s * -2);
    }
    .bps-hslider:not(:has(.bps-hslider__input:checked:not(#bps-hslider-0))) .bps-hslider__slide:nth-child(5),
    .bps-hslider:not(:has(.bps-hslider__input:checked:not(#bps-hslider-0))) .bps-hslider__dots label:nth-of-type(5) {
        animation-delay: calc(4.5s * -1);
    }
}

/* Fallback fara :has - tot avem primul slide vizibil + dots manuale. */
@supports not selector(:has(*)) {
    .bps-hslider__input:nth-of-type(1):checked ~ .bps-hslider__track .bps-hslider__slide:nth-child(1) {
        opacity: 1; transform: scale(1);
    }
}

@media (prefers-reduced-motion: reduce) {
    .bps-hslider__slide,
    .bps-hslider__dots label { animation: none !important; transition: none !important; }
}

/* Why us - grid sobru de 4 puncte */
.bps-why-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}
@media (min-width: 640px) { .bps-why-grid { grid-template-columns: 1fr 1fr; gap: 1.25rem; } }
@media (min-width: 1024px) { .bps-why-grid { grid-template-columns: repeat(4, 1fr); } }

/* ===========================================================
   CONTACT PAGE  (prefix: bps-contactpage / bps-form*)
   - prefixele dedicate evita coliziuni cu .bps-contact-teaser
   - design compact, dens, denumiri scurte, pe spatii reduse
   =========================================================== */

/* Sectiune mai compacta pe contact (override pe section.bps-section) */
.bps-section--contact { padding-top: 2.5rem; padding-bottom: 3rem; }
@media (min-width: 768px) { .bps-section--contact { padding-top: 3rem; padding-bottom: 3.5rem; } }

.bps-contactpage {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.25rem;
    align-items: start;
}
@media (min-width: 960px) {
    .bps-contactpage {
        grid-template-columns: minmax(260px, 320px) minmax(0, 1fr);
        gap: 1.5rem;
    }
}

/* Card info contact */
.bps-contactpage__info {
    background: #fff;
    border: 1px solid var(--bps-line);
    border-radius: var(--bps-radius-lg);
    padding: 1.25rem;
    box-shadow: var(--bps-shadow-sm);
}
@media (min-width: 640px) { .bps-contactpage__info { padding: 1.5rem; } }

.bps-contactpage__title {
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--bps-muted);
    margin: 0 0 1rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.bps-contactpage__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.bps-contactpage__item {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
}

.bps-contactpage__icon {
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: var(--bps-accent-soft);
    color: var(--bps-accent-hover);
}
.bps-contactpage__icon svg { width: 18px; height: 18px; }

.bps-contactpage__body { min-width: 0; flex: 1; }

.bps-contactpage__label {
    display: block;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--bps-muted);
    font-weight: 600;
    margin-bottom: 0.1rem;
}
.bps-contactpage__value,
.bps-contactpage__value a {
    color: var(--bps-ink);
    font-weight: 600;
    font-size: 0.92rem;
    line-height: 1.4;
    text-decoration: none;
    word-break: break-word;
}
.bps-contactpage__value a:hover { color: var(--bps-accent-hover); }
.bps-contactpage__value--free { font-weight: 500; white-space: pre-line; }

.bps-contactpage__divider {
    height: 1px;
    background: var(--bps-line-soft);
    margin: 1.1rem 0 0.9rem;
    border: 0;
}

.bps-contactpage__socials {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}
.bps-contactpage__socials a {
    width: 34px;
    height: 34px;
    border-radius: 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--bps-line);
    color: var(--bps-ink);
    text-decoration: none;
    transition: border-color .18s ease, background .18s ease, color .18s ease, transform .18s ease;
}
.bps-contactpage__socials a:hover {
    border-color: var(--bps-accent);
    background: var(--bps-accent-soft);
    color: var(--bps-accent-hover);
    transform: translateY(-1px);
}
.bps-contactpage__socials svg { width: 16px; height: 16px; }

/* Card formular */
.bps-contactpage__form {
    background: #fff;
    border: 1px solid var(--bps-line);
    border-radius: var(--bps-radius-lg);
    padding: 1.25rem;
    box-shadow: var(--bps-shadow);
    position: relative;
    overflow: hidden;
}
@media (min-width: 640px) { .bps-contactpage__form { padding: 1.75rem; } }

.bps-contactpage__form::before {
    content: '';
    position: absolute;
    inset: 0 0 auto 0;
    height: 3px;
    background: linear-gradient(90deg, var(--bps-accent) 0%, var(--bps-accent-hover) 100%);
}

.bps-contactpage__formhead {
    margin-bottom: 1.1rem;
}
.bps-contactpage__formhead h2 {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--bps-ink);
    margin: 0 0 0.3rem;
    letter-spacing: -0.01em;
    line-height: 1.3;
}
.bps-contactpage__formhead p {
    color: var(--bps-muted);
    margin: 0;
    font-size: 0.88rem;
    line-height: 1.5;
}

/* Alerte */
.bps-alert {
    padding: 0.7rem 0.9rem;
    border-radius: 9px;
    font-size: 0.88rem;
    margin-bottom: 0.9rem;
    display: flex;
    gap: 0.5rem;
    align-items: flex-start;
    border: 1px solid transparent;
    line-height: 1.45;
}
.bps-alert svg { width: 16px; height: 16px; flex-shrink: 0; margin-top: 2px; }
.bps-alert--success {
    background: #ecfdf5;
    border-color: #a7f3d0;
    color: #065f46;
}
.bps-alert--error {
    background: #fef2f2;
    border-color: #fecaca;
    color: #991b1b;
}

/* Form fields */
.bps-form {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}
.bps-form__row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.85rem;
}
@media (min-width: 640px) {
    .bps-form__row--2 { grid-template-columns: 1fr 1fr; }
}

.bps-field { display: flex; flex-direction: column; gap: 0.3rem; }
.bps-field__label {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--bps-ink);
    letter-spacing: -0.005em;
}
.bps-field__label .bps-field__req { color: var(--bps-accent-hover); margin-left: 2px; }

.bps-input,
.bps-textarea {
    width: 100%;
    border: 1.5px solid var(--bps-line);
    border-radius: 9px;
    padding: 0.6rem 0.85rem;
    font-size: 0.93rem;
    font-family: inherit;
    color: var(--bps-ink);
    background: #fff;
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
    line-height: 1.5;
}
.bps-input::placeholder,
.bps-textarea::placeholder { color: #9ca3af; }
.bps-input:hover,
.bps-textarea:hover { border-color: #cdd3dd; }
.bps-input:focus,
.bps-textarea:focus {
    outline: none;
    border-color: var(--bps-accent);
    box-shadow: 0 0 0 3px rgba(254, 180, 0, 0.18);
    background: #fffdf7;
}
.bps-textarea { resize: vertical; min-height: 120px; }

.bps-field--error .bps-input,
.bps-field--error .bps-textarea {
    border-color: #ef4444;
    background: #fef2f2;
}
.bps-field--error .bps-input:focus,
.bps-field--error .bps-textarea:focus {
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.14);
}

.bps-field__error {
    color: #b91c1c;
    font-size: 0.78rem;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.3rem;
}
.bps-field__error::before {
    content: '';
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #b91c1c;
    display: inline-block;
}

.bps-form__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.85rem;
    margin-top: 0.25rem;
}
.bps-form__legal {
    font-size: 0.75rem;
    color: var(--bps-muted);
    flex: 1 1 200px;
    line-height: 1.5;
    margin: 0;
}
.bps-form__legal a { color: var(--bps-ink); text-decoration: underline; text-underline-offset: 2px; }
.bps-form__legal a:hover { color: var(--bps-accent-hover); }

/* Honeypot ascuns vizual dar accesibil pentru boti */
.bps-honeypot {
    position: absolute !important;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0,0,0,0);
    white-space: nowrap; border: 0;
}

/* ===========================================================
   THANK YOU PAGE (dupa submit contact) - minimal & centrat
   =========================================================== */
.bps-section--thanks {
    padding-top: 3rem;
    padding-bottom: 4rem;
    min-height: 60vh;
    display: flex;
    align-items: center;
}
@media (min-width: 768px) { .bps-section--thanks { padding-top: 4rem; padding-bottom: 5rem; } }

.bps-thanks {
    max-width: 460px;
    margin: 0 auto;
    text-align: center;
}

.bps-thanks__check {
    width: 56px;
    height: 56px;
    margin: 0 auto 1.25rem;
    border-radius: 50%;
    background: var(--bps-accent);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 20px -6px rgba(254,180,0,.45);
}
.bps-thanks__check svg { width: 26px; height: 26px; }

.bps-thanks__title {
    font-size: clamp(1.5rem, 1.2rem + 1vw, 1.875rem);
    font-weight: 800;
    color: var(--bps-ink);
    margin: 0 0 0.6rem;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.bps-thanks__lead {
    color: var(--bps-muted);
    margin: 0 auto 1.5rem;
    font-size: 0.95rem;
    line-height: 1.6;
}

.bps-thanks__actions {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 0.5rem 1.25rem;
}

.bps-thanks__link {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    color: var(--bps-ink);
    font-weight: 600;
    font-size: 0.9rem;
    text-decoration: none;
    padding: 0.35rem 0.25rem;
    border-bottom: 1px solid transparent;
    transition: color .15s ease, border-color .15s ease;
}
.bps-thanks__link:hover {
    color: var(--bps-accent-hover);
    border-color: var(--bps-accent);
}
.bps-thanks__link svg {
    width: 14px;
    height: 14px;
    transition: transform .15s ease;
}
.bps-thanks__link:hover svg { transform: translateX(2px); }

.bps-why {
    background: #fff;
    border: 1px solid var(--bps-line);
    border-radius: 14px;
    padding: 1.5rem 1.4rem;
    transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.bps-why:hover {
    border-color: var(--bps-ink);
    box-shadow: var(--bps-shadow-sm);
    transform: translateY(-2px);
}
.bps-why__icon {
    display: inline-flex; align-items: center; justify-content: center;
    width: 44px; height: 44px;
    border-radius: 11px;
    background: var(--bps-accent-soft);
    color: var(--bps-ink);
    margin-bottom: 1rem;
}
.bps-why__icon svg { width: 22px; height: 22px; }
.bps-why h3 {
    font-size: 1rem;
    font-weight: 700;
    color: var(--bps-ink);
    margin: 0 0 .4rem;
    letter-spacing: -.005em;
}
.bps-why p {
    margin: 0;
    font-size: .9rem;
    line-height: 1.6;
    color: var(--bps-muted);
}

.bps-stickynav {
    position: fixed; left: 0; right: 0; bottom: -100%;
    z-index: 50;
    background: #fff;
    border-top: 1px solid var(--bps-line);
    transition: bottom .25s ease;
    pointer-events: none;
}
.bps-stickynav.is-visible {
    bottom: 0;
    pointer-events: auto;
}
.bps-stickynav__inner {
    max-width: var(--bps-container, 1200px);
    margin: 0 auto;
    padding: 0 1rem;
    min-height: 56px;
    display: flex;
    align-items: stretch;
    gap: 0;
}
.bps-stickynav__back {
    display: inline-flex; align-items: center; gap: .45rem;
    padding: 0 1rem 0 0;
    color: var(--bps-muted); font-weight: 500; font-size: .88rem;
    text-decoration: none;
    background: transparent;
    white-space: nowrap;
    flex-shrink: 0;
    transition: color .15s ease;
}
.bps-stickynav__back:hover { color: var(--bps-ink); }
.bps-stickynav__back svg { transition: transform .15s ease; }
.bps-stickynav__back:hover svg { transform: translateX(-2px); }
.bps-stickynav__divider {
    width: 1px;
    background: var(--bps-line);
    flex-shrink: 0;
    margin: .85rem 0;
}
.bps-stickynav__tiles {
    display: flex;
    align-items: stretch;
    overflow-x: auto;
    overflow-y: hidden;
    flex: 1 1 auto;
    margin-left: .9rem;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.bps-stickynav__tiles::-webkit-scrollbar { display: none; height: 0; width: 0; }
.bps-stickynav__tile {
    display: inline-flex; align-items: center; gap: .5rem;
    padding: 0 1rem;
    color: var(--bps-muted); font-weight: 500; font-size: .88rem;
    text-decoration: none;
    white-space: nowrap;
    border-bottom: 3px solid transparent;
    margin-bottom: -1px;
    transition: color .15s ease, border-color .15s ease;
}
.bps-stickynav__tile-icon {
    width: 20px !important; height: 20px !important;
    object-fit: contain;
    flex-shrink: 0;
    opacity: .55;
    filter: grayscale(1);
    transition: opacity .15s ease, filter .15s ease;
    display: inline-block;
}
.bps-stickynav__tile:hover { color: var(--bps-ink); }
.bps-stickynav__tile:hover .bps-stickynav__tile-icon { opacity: .85; filter: grayscale(.3); }
.bps-stickynav__tile--active {
    color: var(--bps-accent);
    font-weight: 600;
    border-bottom-color: var(--bps-accent);
}
.bps-stickynav__tile--active .bps-stickynav__tile-icon { opacity: 1; filter: none; }

@media (max-width: 640px) {
    .bps-stickynav__inner { padding: 0 .65rem; min-height: 50px; }
    .bps-stickynav__back { padding: 0 .6rem 0 0; font-size: .82rem; }
    .bps-stickynav__back span { display: none; }
    .bps-stickynav__divider { display: none; }
    .bps-stickynav__tiles { margin-left: 0; }
    .bps-stickynav__tile { padding: 0 .75rem; font-size: .82rem; }
}