/* Local behavior layered over the preserved original responsive layout. */
/* The ONE site font: Cal Sans 2.0.6 (latin + HU + RO subset, weights 400–700 + optical size, one 47 KB file).
   OFL 1.1 – licence: /assets/fonts/cal-sans/OFL.txt. Brand rule: no other font on the site (see TYPOGRAPHY below). */
@font-face {
  font-family: "Cal Sans";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(../assets/fonts/cal-sans/CalSans-Var-opsz-latin-hu-ro.woff2) format("woff2");
}
:root { color-scheme: light; }
html { scroll-behavior: smooth; }
body { margin: 0; overflow-x: clip; }
#main { overflow-x: clip; }
[id] { scroll-margin-top: 95px; }
[hidden] { display: none !important; }
button, [role="button"], a[data-highlight] { cursor: pointer; }
:focus-visible { outline: 2px solid #2f669b; outline-offset: 4px; }
.framer-vaz7M .framer-vgpsd3 { cursor: pointer; }
.framer-vaz7M .framer-12dz6ot { transition: transform .2s; }
.framer-vaz7M.is-closed .framer-12dz6ot { transform: rotate(0deg) !important; }
.framer-Ca7Ft:hover, .framer-9QAfk:hover, .framer-D5Axy:hover { filter: brightness(1.06); }
.framer-jrhqy:hover { background: #eef5fb; }
.framer-form-input:focus, .framer-form-input:focus-visible { outline: none; } /* focus is shown on the whole field box (see EVO form fields) */
.local-form-status { margin: 10px 0 0; font: 400 14px/1.4 var(--evo-font); color: #2f669b; }
.local-slider ul { flex-shrink: 0; }
.local-slider li { flex-shrink: 0; }
.local-slider { touch-action: pan-y; }

/* Desktop dropdowns ("Funcții", "Avantaje") – 2026-10-02: open on hover, smooth reveal, picture on the right
   (model: dROOT menu). Links in two columns; texts, links and colours of the source menu unchanged. */
.local-dropdown {
  position: fixed; z-index: 20; top: 84px; width: max-content; max-width: calc(100vw - 40px);
  display: grid; grid-template-columns: max-content 360px; box-sizing: border-box; /* links as wide as their text, picture right next to them */
  max-height: calc(100dvh - 110px); overflow: hidden; background: #fff;
  border: 0; border-radius: 20px;
  box-shadow: 0 0 0 1px var(--evo-card-line), 0 30px 60px -24px rgba(12, 30, 50, .28), 0 6px 16px rgba(12, 30, 50, .06);
  font: 400 16px/1.5 var(--evo-font);
  /* hidden state */
  visibility: hidden; opacity: 0; transform: translateY(-10px) scale(.985); transform-origin: 50% 0;
  transition: opacity .28s ease, transform .38s var(--evo-ease), visibility 0s linear .38s;
}
.local-dropdown.is-open { visibility: visible; opacity: 1; transform: none; transition: opacity .28s ease, transform .38s var(--evo-ease), visibility 0s; }
.local-dropdown::before { content: ""; position: absolute; left: 0; right: 0; top: -20px; height: 20px; } /* hover bridge from the menu bar */
.local-dropdown-advantages { grid-template-columns: max-content 190px; } /* = the picture's own ratio at this panel height → whole shield group, right next to the links */
.local-dropdown-advantages .local-dropdown-media img { object-position: 40% 50%; -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 22%); mask-image: linear-gradient(90deg, transparent 0%, #000 22%); } /* picture cropped to the shield: it sits right next to the links */
.local-dropdown-links {
  display: grid; grid-template-columns: repeat(2, max-content); align-content: start; gap: 6px 28px;
  padding: 26px 8px 26px 26px; overflow-y: auto;
}
/* the links appear one after the other */
.local-dropdown-links a { opacity: 0; transform: translateY(6px); transition: opacity .3s ease, transform .4s var(--evo-ease), background-color .2s ease; }
.local-dropdown.is-open .local-dropdown-links a { opacity: 1; transform: none; transition-delay: calc(60ms + var(--i, 0) * 22ms), calc(60ms + var(--i, 0) * 22ms), 0s; }
/* picture: fills the right column, fades in from the white panel on its left edge */
.local-dropdown-media { position: relative; overflow: hidden; }
.local-dropdown-media img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%;
  transform: scale(1.06); transition: transform 1.2s var(--evo-ease);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 18%); mask-image: linear-gradient(90deg, transparent 0%, #000 18%);
}
.local-dropdown.is-open .local-dropdown-media img { transform: none; }
@media (max-width: 1100px) { .local-dropdown, .local-dropdown-advantages { grid-template-columns: max-content 240px; } }
@media (prefers-reduced-motion: reduce) {
  .local-dropdown, .local-dropdown-links a, .local-dropdown-media img { transition: none !important; transform: none !important; }
}
.local-dropdown a, .local-mobile-submenu a {
  display: flex; align-items: center; gap: 8px; color: #2f669b; padding: 9px; border-radius: 8px; text-decoration: none;
}
.local-dropdown a { min-height: 44px; box-sizing: border-box; padding: 10px 12px; border-radius: 10px; }
.evo-icon { fill: none; stroke: currentColor; stroke-width: var(--evo-icon-stroke); stroke-linecap: round; stroke-linejoin: round; }
.local-menu-icon { width: 24px; height: 24px; flex: 0 0 24px; color: var(--evo-icon-color); }
.local-dropdown a:hover, .local-mobile-submenu a:hover { background: #edf5fc; }
/* menu bar items: no light-blue box behind them on hover/open (Framer hover style) – only the text turns logo blue */
.framer-jrhqy { background-color: transparent !important; transition: color .2s ease; }
.framer-jrhqy:is(:hover, [aria-expanded="true"]) :is(p, .local-chevron) { --framer-text-color: var(--evo-blue) !important; color: var(--evo-blue) !important; }
.framer-jrhqy .local-chevron { transition: transform .3s var(--evo-ease); }
.framer-jrhqy[aria-expanded="true"] .local-chevron { transform: rotate(180deg); }
.local-chevron { width: 12px; height: 12px; margin-left: 5px; flex-shrink: 0; }
/* Mobile/tablet menu (2026-10-05, Vincent): big type and big tap rows (min. 48px, Apple/Google touch guideline),
   thin dividers; the page behind is seen through blue glass (.evo-menu-backdrop). Rule kept in docs/03_DESIGN_RENDSZER.md. */
/* 2026-10-05 evening (Vincent): the menu must breathe – sizes unchanged, more space around the rows. */
.local-mobile-links { width: 100%; max-height: calc(100dvh - 110px); overflow-y: auto; overscroll-behavior: contain; padding: 18px 14px 22px; box-sizing: border-box; }
.local-mobile-links > a, .local-mobile-links > button {
  display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 56px; box-sizing: border-box;
  padding: 12px 4px; border: 0; border-bottom: 1px solid var(--evo-line); background: none; cursor: pointer;
  color: #2f669b; text-align: left; text-decoration: none; font: 500 22px/1.25 var(--evo-font); letter-spacing: -.01em;
  -webkit-tap-highlight-color: transparent; transition: color .2s ease;
}
.local-mobile-links > :last-child, .local-mobile-links > :nth-last-child(2):has(+ .local-mobile-cta) { border-bottom: 0; }
/* sign-up button at the end of the menu: dark brand button that floats gently */
.local-mobile-links > a.local-mobile-cta {
  justify-content: center; gap: 10px; min-height: 56px; margin: 18px 0 6px; padding: 14px 20px; border: 0; border-radius: var(--evo-radius-btn);
  background: linear-gradient(180deg, #1d3a58, var(--evo-navy-800)); color: #fff; font: 600 18px/1.2 var(--evo-font);
  box-shadow: 0 14px 28px -12px rgba(12, 30, 50, .55), inset 0 1px 0 rgba(255, 255, 255, .12);
  animation: evo-float 3.6s ease-in-out infinite;
}
.local-mobile-links > a.local-mobile-cta svg { width: 20px; height: 20px; stroke: currentColor; }
.local-mobile-links > a.local-mobile-cta:active { color: #fff; scale: .98; }
@keyframes evo-float { 0%, 100% { translate: 0 0; box-shadow: 0 14px 28px -12px rgba(12, 30, 50, .55), inset 0 1px 0 rgba(255,255,255,.12); }
  50% { translate: 0 -4px; box-shadow: 0 20px 32px -12px rgba(12, 30, 50, .45), inset 0 1px 0 rgba(255,255,255,.12); } }
@media (prefers-reduced-motion: reduce) { .local-mobile-links > a.local-mobile-cta { animation: none; } }
.local-mobile-links > a:active, .local-mobile-links > button:active { color: var(--evo-navy-800); }
.local-mobile-links > button .local-chevron { width: 18px; height: 18px; transition: transform .3s var(--evo-ease); }
.local-mobile-links > button[aria-expanded="true"] .local-chevron { transform: rotate(180deg); }
.local-mobile-submenu { font: 400 17px/1.3 var(--evo-font); padding: 6px 0 10px; border-bottom: 1px solid var(--evo-line); }
.local-mobile-submenu a { min-height: 48px; box-sizing: border-box; padding: 10px 8px; gap: 12px; }
.local-mobile-submenu .local-menu-icon { width: 22px; height: 22px; flex-basis: 22px; }
.evo-menu-backdrop {
  position: fixed; inset: 0; z-index: 10000; opacity: 0; visibility: hidden; pointer-events: none;
  /* blue glass: the page stays visible behind it (Vincent 2026-10-05); light blur = cheap on phones */
  background: rgba(24, 59, 94, .45); -webkit-backdrop-filter: blur(6px) saturate(140%); backdrop-filter: blur(6px) saturate(140%);
  transition: opacity .3s ease, visibility 0s linear .3s;
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) { .evo-menu-backdrop { background: rgba(24, 59, 94, .8); } }
html.evo-menu-open .evo-menu-backdrop { opacity: 1; visibility: visible; pointer-events: auto; transition: opacity .3s ease, visibility 0s; }
html.evo-menu-open .evo-menu-host { z-index: 10001 !important; }
html.evo-menu-open, html.evo-menu-open body { overflow: hidden; }
html.evo-menu-open .ht-ctc { opacity: 0; visibility: hidden; pointer-events: none; }
@media (prefers-reduced-motion: reduce) { .evo-menu-backdrop { transition: none; } }
.framer-HPz71[aria-expanded="true"] .framer-1li13ef { top: 50%; bottom: auto; transform: rotate(-45deg) !important; }
.framer-HPz71[aria-expanded="true"] .framer-o0s41v { top: 50%; transform: rotate(45deg) !important; }

/* The original search shell, backed by the local homepage's content. */
.local-search { padding: 0; border: 0; border-radius: 16px; width: min(640px, calc(100vw - 30px));
  max-height: calc(100dvh - min(159px, 20dvh) - 15px); position: fixed; top: min(159px, 20dvh);
  margin: 0 auto; background: #fff; color: #333; box-shadow: 0 20px 40px #0003;
  font-family: var(--evo-font);
}
.local-search[open] { display: flex; flex-direction: column; } /* the results list shrinks inside the box */
.local-search::backdrop { background: #0006; }
.local-search-row { display: flex; flex: none; align-items: center; padding: 12px 20px; gap: 12px; }
.local-search input { flex: 1; min-width: 0; border: 0; background: transparent; outline: none;
  color: #333; height: 2em; padding: 0; font: 400 16px/2 var(--evo-font); }
.local-search input::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; } /* one × only: our close button */
.local-search-close { border: 0; background: none; font: 22px/1 var(--evo-font); color: #667; padding: 4px; }
.local-search-results { list-style: none; margin: 0; padding: 0 12px 12px; overflow-y: auto; min-height: 0;
  max-height: min(60vh, 520px); }
.local-search-results:empty { padding: 0; }
.local-search-results a { display: block; padding: 12px 10px; border-radius: 7px; text-decoration: none; color: #2f669b; }
.local-search-results a:hover, .local-search-results a.is-active { background: #edf5fc; }
.local-search-title { font-weight: 600; color: #1d3d63; }
.local-search-meta { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: #6b7a8c; margin-left: 8px; }
.local-search-snippet { display: block; font-size: 13px; line-height: 1.45; color: #4a5568; margin-top: 3px; }
.local-search-results mark { background: #fff1a8; color: inherit; padding: 0; border-radius: 2px; /* no padding: "programare|a" must read as one word */ }
.local-search-empty { padding: 12px 10px; color: #777; font-size: 14px; }

/* ===== COMPONENT: Mobile menu search (evo-menu-search) – 2026-10-12 =====
   A search field at the top of the phone/tablet menu (js/main.js "COMPONENT: Mobile menu search"). Tapping it opens
   the same search dialog as the desktop search (.local-search); the menu closes. The menu is a white card, so the
   field is light: 16px text (iOS does not zoom), 52px tall touch target, full menu width. */
.evo-menu-search {
  display: flex; align-items: center; gap: 12px; box-sizing: border-box; width: 100%; min-height: 52px; margin: 0 0 14px;
  padding: 0 16px; border: 1px solid var(--evo-line); border-radius: var(--evo-radius-btn); background: var(--evo-panel);
  transition: border-color .2s ease, box-shadow .2s ease; animation: evo-menu-search-in .4s var(--evo-ease) both;
}
.evo-menu-search:focus-within { border-color: var(--evo-blue); box-shadow: 0 0 0 3px var(--evo-blue-soft); }
.evo-menu-search-icon { width: 20px; height: 20px; flex: 0 0 20px; color: var(--evo-icon-color); }
.evo-menu-search input {
  flex: 1; min-width: 0; height: 50px; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; outline: none;
  color: var(--evo-ink); font: 400 16px/1.2 var(--evo-font); -webkit-appearance: none; appearance: none;
}
.evo-menu-search input::placeholder { color: var(--evo-muted); opacity: 1; }
.evo-menu-search input::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }
/* the field appears with the opened menu (display:none → block restarts the animation) */
@keyframes evo-menu-search-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .evo-menu-search { animation: none; transition: none; } }

/* ===== COMPONENT: cookie panel – centred at the bottom (Vincent, 2026-10-02) =====
   Text and logic unchanged (js/main.js builds it). "Acceptă" = the brand's dark button,
   "Respinge" = quiet secondary button: still clearly visible and readable, just less prominent. */
.local-cookie {
  position: fixed; bottom: 24px; left: 50%; right: auto; z-index: 100;
  width: min(560px, calc(100vw - 32px)); transform: translateX(-50%);
  box-sizing: border-box; padding: 22px 24px; border: 0; border-radius: 20px;
  background: #fff; color: var(--evo-text);
  box-shadow: 0 0 0 1px var(--evo-card-line), 0 24px 60px -18px rgba(12, 30, 50, .35), 0 4px 12px rgba(12, 30, 50, .06);
  font: 400 14px/1.55 var(--evo-font);
  animation: evo-cookie-in .6s var(--evo-ease) both;
}
@keyframes evo-cookie-in { from { opacity: 0; transform: translate(-50%, 24px); } to { opacity: 1; transform: translate(-50%, 0); } }
.local-cookie-title { margin: 0 0 8px; font-weight: 500; font-size: .75rem; line-height: 1.5; color: var(--evo-muted); letter-spacing: .02em; }
.local-cookie p { margin: 0; padding: 0; }
.local-cookie a { color: var(--evo-blue); text-decoration: none; }
.local-cookie a:hover { text-decoration: underline; }
.local-cookie-actions { display: flex; gap: 12px; margin-top: 18px; }
.local-cookie button { flex: 1; padding: 13px 16px; border: 0; border-radius: 12px; cursor: pointer;
  font: 500 15px/1 var(--evo-font); transition: transform .25s var(--evo-ease), box-shadow .25s ease, color .2s ease, background-color .2s ease; }
.local-cookie button[data-choice="rejected"] {
  flex: 0 1 38%; background: transparent; color: #8593a3; font-weight: 400;
  box-shadow: inset 0 0 0 1px #e6ecf2;
}
.local-cookie button[data-choice="rejected"]:hover { color: var(--evo-text); background: #f5f8fb; }
.local-cookie button[data-choice="accepted"] {
  flex: 1 1 62%; color: #fff; font-weight: 600;
  background: linear-gradient(180deg, #1d3d5e 0%, var(--evo-navy-800) 100%);
  box-shadow: 0 10px 24px -10px rgba(15, 33, 51, .7), inset 0 1px 0 rgba(255,255,255,.14);
}
.local-cookie button[data-choice="accepted"]:hover { transform: translateY(-2px); box-shadow: 0 16px 30px -12px rgba(47, 102, 155, .85), inset 0 1px 0 rgba(255,255,255,.14); }
.local-cookie button:focus-visible { outline: 2px solid var(--evo-blue-soft); outline-offset: 3px; }
/* phones: the panel sits above the WhatsApp button */
@media (max-width: 809.98px) {
  .local-cookie { bottom: 92px; padding: 18px; }
}

/* ===== COMPONENT: WhatsApp button – app-icon style (rounded green square, white glyph), gently pulsing =====
   (Vincent 2026-10-02, icon + more space from the corner 2026-10-05). Icon: assets/images/icons/whatsapp-v2.svg */
#ht-ctc-chat { bottom: 28px !important; right: 28px !important; }
#ht-ctc-chat a {
  position: relative; display: block; width: 58px; height: 58px; border-radius: 14px;
  background: url("/assets/images/icons/whatsapp-v2.svg") center / 100% 100% no-repeat;
  box-shadow: 0 10px 24px -8px rgba(18, 140, 70, .55);
  animation: evo-wa-pulse 2.4s ease-out infinite;
  transition: transform .25s var(--evo-ease);
}
#ht-ctc-chat a > * { display: none !important; } /* the old round icon */
#ht-ctc-chat a:hover { transform: scale(1.08); }
#ht-ctc-chat a:focus-visible { outline: 2px solid var(--evo-blue-soft); outline-offset: 4px; }
@keyframes evo-wa-pulse {
  0%   { box-shadow: 0 10px 24px -8px rgba(18, 140, 70, .55), 0 0 0 0 rgba(37, 211, 102, .5); }
  70%  { box-shadow: 0 10px 24px -8px rgba(18, 140, 70, .55), 0 0 0 16px rgba(37, 211, 102, 0); }
  100% { box-shadow: 0 10px 24px -8px rgba(18, 140, 70, .55), 0 0 0 0 rgba(37, 211, 102, 0); }
}
@media (max-width: 809.98px) { #ht-ctc-chat { bottom: 24px !important; right: 22px !important; } #ht-ctc-chat a { width: 54px; height: 54px; border-radius: 13px; } }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: 0s !important; animation-duration: 0s !important; }
}

/* Image protection (Vincent, 2026-10-01): no dragging, no iOS "save image" long-press menu.
   Pages and image indexing are unaffected. */
img {
  -webkit-user-drag: none;
  user-drag: none;
  -webkit-touch-callout: none;
  user-select: none;
}

/* ===== DESIGN TOKENS (brand) – the ONE place for colours, radii, shadows =====
   Every component below uses these; /brand shows them live. Change here → changes everywhere. */
:root {
  --evo-blue: #2F669B;          /* logo blue – the brand colour */
  --evo-blue-light: #3f7fbd;    /* glows, hover light */
  --evo-blue-soft: #8fb6dc;     /* focus ring */
  --evo-navy-900: #0a1520;      /* darkest (logo blue, almost black) */
  --evo-navy-800: #0f2133;      /* dark surfaces */
  --evo-ink: #12263b;           /* titles, button text on light */
  --evo-text: #2b3d50;          /* body text */
  --evo-muted: #6b7c8f;         /* secondary text */
  --evo-panel: #f3f7fb;         /* light panel top */
  --evo-panel-2: #edf3f9;       /* light panel bottom */
  --evo-line: #e3ecf5;          /* borders on light */
  --evo-white: #ffffff;
  --evo-radius-panel: 40px;     /* big sections */
  --evo-radius-card: 28px;      /* cards, dark CTA card */
  --evo-radius-btn: 14px;       /* buttons */
  --evo-card-line: #edf1f7;     /* the 1px card edge – this is what separates a white card from a white page */
  /* tight dark shadow + soft logo-blue shadow below (the 1px edge itself is an inner outline, see evo-card) */
  --evo-shadow-card: 0 1px 1px rgba(10, 21, 32, .08), 0 4px 6px rgba(47, 102, 155, .09);
  --evo-shadow-card-hover: 0 2px 2px rgba(10, 21, 32, .06), 0 16px 30px -8px rgba(47, 102, 155, .22);
  --evo-ease: cubic-bezier(.2, .8, .2, 1);
  --evo-font: "Cal Sans", system-ui, sans-serif;  /* the ONE font (@font-face at the top) */
  /* ONE icon source: Lucide (inline SVG, tools/build-icons.py). Line width + default colour of every icon: */
  --evo-icon-stroke: 2;          /* Lucide's own line width; thinner 1.5 / bolder 2.5 */
  --evo-icon-color: var(--evo-blue);
}

/* ===== TYPOGRAPHY: one font everywhere (2026-10-02) =====
   Every text uses Cal Sans – it overrides the font names left in the Framer styles.
   Headings (h1–h6) are one weight step bolder than their Framer preset (500 → 600, 600 → 700),
   and keep the font's own spacing: Cal Sans tightens itself at large sizes (optical size axis),
   so the negative letter-spacing of the Framer presets would squeeze the letters together. */
*, *::before, *::after { font-family: var(--evo-font) !important; }
:is(h1, h2, h3, h4, h5, h6),
:is(h1, h2, h3, h4, h5, h6) .framer-text:not(strong, b) { font-weight: calc(var(--framer-font-weight, 500) + 100) !important; letter-spacing: normal !important; }

/* Header "Creează un cont" (Vincent, 2026-10-02): only ONE sign-up button is visible at a time.
   While the page's first-screen sign-up button (hero) is visible, the header one is hidden; the moment the fixed
   header covers the hero button, the header button appears (js/main.js sets html.evo-header-cta). Pages without
   a first-screen button: shown from the start. HTML/text unchanged; space kept, so the menu never jumps. */
header .framer-1kpqgws-container {
  opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-8px) scale(.94);
  transition: opacity .35s ease, transform .5s var(--evo-ease), visibility 0s linear .5s;
}
html.evo-header-cta header .framer-1kpqgws-container {
  opacity: 1; visibility: visible; pointer-events: auto; transform: none;
  transition: opacity .35s ease, transform .5s var(--evo-ease), visibility 0s;
}
/* while the button is hidden its slot collapses → the menu reaches the right edge; when it appears the slot
   opens and pushes the menu left. Only this one small header row re-flows, for half a second. */
/* desktop only: on tablet/phone the same slot holds the menu (hamburger) button */
@media (min-width: 1200px) {
  header .framer-sx8y0p > .framer-tgye0o { flex: 1 1 auto !important; width: auto !important; min-width: 0; padding-right: 0 !important; }
  header .framer-1qjtw1p {
    justify-content: flex-start !important; overflow: visible !important;
    max-width: 0; margin-left: 0; transition: max-width .55s var(--evo-ease), margin-left .55s var(--evo-ease);
  }
  html.evo-header-cta header .framer-1qjtw1p { max-width: 260px; margin-left: 28px; }
}
html.evo-header-cta header .framer-1kpqgws-container { transition-delay: .12s, .12s, 0s; } /* the slot opens first, then the button fades in */
@media (prefers-reduced-motion: reduce) { header :is(.framer-1kpqgws-container, .framer-1qjtw1p) { transition: none !important; } }

/* ===== Phone numbers / e-mails recognised by the phone (iPhone Safari "data detectors", Android) =====
   The phone turns plain text such as "+40 365 441 611" into a blue underlined link. It stays tappable,
   but takes the look of the text around it (e.g. bold white in the dark CTA card) – sitewide. */
a[x-apple-data-detectors], a[href^="tel:"]:not([class]), a[href^="mailto:"]:not([class]) {
  color: inherit !important; text-decoration: none !important;
  font: inherit !important; font-weight: inherit !important; line-height: inherit !important;
}

/* ===== Home hero: gentle entrance (Vincent, 2026-10-02) =====
   1 title → 2 subtitle → 3 button + note → 4 app screenshot rise softly from below, one after the other.
   Pure CSS (runs from the first paint, no flash, nothing hidden if animations are off). */
@keyframes evo-rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes evo-rise-far { from { opacity: 0; transform: translateY(42px) scale(.985); } to { opacity: 1; transform: none; } }
/* Same motion with the individual translate/scale properties: they ADD to Framer's own transform (e.g. a picture centred
   with translate(-50%,-50%)) instead of replacing it. Used by the page intros (tools/build-intro.py) and evo-reveal.
   Start opacity .01, not 0: Chrome ignores opacity:0 elements for LCP – with every first-screen block at 0 a page had
   NO LCP at all (PageSpeed error on /contact, /blog). .01 looks the same and counts from the first paint. */
@keyframes evo-in { from { opacity: .01; translate: 0 18px; } to { opacity: 1; translate: none; } }
@keyframes evo-in-far { from { opacity: .01; translate: 0 42px; scale: .985; } to { opacity: 1; translate: none; scale: none; } }
header[data-framer-name="Header Section"] .framer-adtnmv > .framer-tlhi7w { animation: evo-rise .9s var(--evo-ease) .1s both; }
header[data-framer-name="Header Section"] .framer-adtnmv > .framer-a61ljt { animation: evo-rise .9s var(--evo-ease) .25s both; }
header[data-framer-name="Header Section"] .framer-adtnmv > .framer-bdf5f3 { animation: evo-rise .9s var(--evo-ease) .4s both; }
header[data-framer-name="Header Section"] .framer-adtnmv .framer-ujlg1x { animation: evo-rise-far 1.2s var(--evo-ease) .55s both; }
@media (prefers-reduced-motion: reduce) {
  header[data-framer-name="Header Section"] .framer-adtnmv :is(.framer-tlhi7w, .framer-a61ljt, .framer-bdf5f3, .framer-ujlg1x) { animation: none !important; }
}

/* ===== COMPONENT: home logo slider (clinic logos under the hero) – breathing room from the hero image (2026-10-08) ===== */
.framer-1mq8tk8-container { margin-top: 16px; }

/* ===== COMPONENT: chip menu ("Funcții" chips under the title: Evidență pacienți, Programare…, 16 feature pages) – never animated =====
   It is a menu, not content: no page-intro rise (css/pages/*.css EVO-INTRO) and no scroll reveal on any page. */
.framer-1coUE, .framer-1coUE *, *:has(> .framer-1coUE) { animation: none !important; }

/* ===== COMPONENT: evo-reveal – soft rise-in on scroll (home page, js/main.js) ===== */
.evo-reveal { opacity: 0; translate: 0 26px; transition: opacity .8s ease var(--evo-delay, 0s), translate .9s var(--evo-ease) var(--evo-delay, 0s) !important; }
.evo-reveal.is-in { opacity: 1; translate: none; }

/* ===== COMPONENT: evo-card – the ONE box style (2026-10-02) =====
   White card on a white page: a 1px light edge + soft shadow make it visible (no grey fill).
   Every box/card/panel on the site carries class="evo-card"; boxes inside a card that had the
   same fill carry "evo-card-fill" (white, no edge). New box anywhere → just add the class.
   Blog content can't carry classes, so its highlighted text box (Framer "code" preset) is listed here. */
.evo-card, code.framer-styles-preset-q0phno {
  background: var(--evo-white) !important;
  box-shadow: var(--evo-shadow-card) !important;
  border-radius: var(--evo-radius-card) !important;
  --border-color: transparent !important; /* Framer's own coloured edge → only the brand edge stays */
  /* the 1px edge: drawn INSIDE the box, so a parent that clips its content can never cut it off
     (a shadow ring outside the box was cut where the card touches its container's edge) */
  outline: 1px solid var(--evo-card-line) !important; outline-offset: -1px !important;
  transition: transform .3s var(--evo-ease), box-shadow .3s ease;
}
a.evo-card:hover, button.evo-card:hover { transform: translateY(-3px); box-shadow: var(--evo-shadow-card-hover) !important; }
.evo-card:focus-visible, code.framer-styles-preset-q0phno:focus-visible { outline: 2px solid var(--evo-blue) !important; outline-offset: 4px !important; }
.evo-card-fill { background: var(--evo-white) !important; }
@media (prefers-reduced-motion: reduce) { .evo-card, code.framer-styles-preset-q0phno { transition: none; } a.evo-card:hover, button.evo-card:hover { transform: none; } }

/* ===== COMPONENT: "Ești interesat de Evolvo?" CTA (framer-HZFOj) – redesign 2026-10-01 =====
   Same HTML and text on all 198 pages; only the look changes here (one place → everywhere).
   The same dark card is used by the "Cere DEMO gratuit" sections (.evo-cta, layout further below).
   Variants: DT = .framer-v-1vvyqxh, Tablet = .framer-v-1o4tkwu, Mobile = .framer-v-146ha3c */
.framer-HZFOj .framer-1wakecd { overflow: visible !important; }
.framer-HZFOj .framer-1w5wprn, .evo-cta-card {
  /* palette derived from the logo blue #2F669B (hue 210) */
  margin-block: 48px !important;
  isolation: isolate;
  overflow: hidden !important;
  justify-content: space-between !important;
  padding: 64px 72px !important;
  border-radius: var(--evo-radius-card) !important;
  --border-color: rgba(120, 165, 210, .14) !important;
  background:
    radial-gradient(60% 85% at 50% 125%, var(--evo-blue) 0%, rgba(47, 102, 155, .5) 38%, rgba(20, 45, 72, 0) 72%),
    linear-gradient(180deg, var(--evo-navy-900) 0%, var(--evo-navy-800) 100%);
  box-shadow: 0 30px 60px -28px rgba(12, 30, 50, .55), 0 2px 6px rgba(12, 30, 50, .12);
}
/* dotted "map" texture on both sides, fading towards the middle */
.framer-HZFOj .framer-1w5wprn::before, .evo-cta-card::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image: radial-gradient(rgba(150, 185, 220, .22) 1.2px, transparent 1.6px);
  background-size: 14px 14px;
  -webkit-mask-image: linear-gradient(90deg, #000 0%, rgba(0,0,0,.35) 22%, transparent 42%, transparent 58%, rgba(0,0,0,.35) 78%, #000 100%);
          mask-image: linear-gradient(90deg, #000 0%, rgba(0,0,0,.35) 22%, transparent 42%, transparent 58%, rgba(0,0,0,.35) 78%, #000 100%);
  opacity: .55;
}
/* slow breathing glow from the bottom */
.framer-HZFOj .framer-1w5wprn::after, .evo-cta-card::after {
  content: ""; position: absolute; left: 20%; right: 20%; bottom: -55%; height: 90%; z-index: -1;
  pointer-events: none; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(63, 127, 189, .45), transparent);
  filter: blur(20px);
  animation: evo-cta-breathe 7s ease-in-out infinite;
}
@keyframes evo-cta-breathe { 0%, 100% { opacity: .55; transform: scale(1); } 50% { opacity: 1; transform: scale(1.08); } }

/* old background photo + scrolling app screenshots: off */
.framer-HZFOj .framer-1w5wprn > [data-framer-background-image-wrapper],
.framer-HZFOj .framer-tctxqk-container { display: none !important; }

/* layout: text left, button right */
.framer-HZFOj .framer-7yb761 {
  width: 100% !important; overflow: visible !important;
  flex-direction: row !important; align-items: center !important; justify-content: space-between !important;
  gap: 56px !important;
}
.framer-HZFOj .framer-usrzmk { width: auto !important; flex: 1 1 auto !important; max-width: 640px; }
.framer-HZFOj .framer-usrzmk p, .evo-cta-text p {
  --framer-text-color: rgba(225, 235, 245, .8) !important; color: rgba(225, 235, 245, .8) !important;
  --framer-font-size: 19px !important; font-size: 19px !important;
  --framer-line-height: 1.6em !important; line-height: 1.6 !important;
  letter-spacing: -.005em;
}
.framer-HZFOj .framer-usrzmk strong, .evo-cta-text p strong { color: #fff !important; font-weight: 600; }
.framer-HZFOj .framer-4ek88g { width: auto !important; flex: none !important; align-items: center !important; gap: 12px !important; }

/* the button itself: see COMPONENT "evo-btn" below */

.framer-HZFOj .framer-1ylhkii { width: auto !important; }
.framer-HZFOj .framer-1ylhkii p {
  --framer-text-color: rgba(190, 210, 230, .6) !important; color: rgba(190, 210, 230, .6) !important;
  --framer-text-alignment: center !important; text-align: center !important;
}

/* desktop: break slightly out of the content column */
@media (min-width: 1200px) {
  .framer-HZFOj.framer-v-1vvyqxh .framer-1w5wprn { width: calc(100% + 80px) !important; margin-inline: -40px !important; }
}

/* tablet */
.framer-HZFOj.framer-v-1o4tkwu .framer-1w5wprn { padding: 48px 44px !important; border-radius: 24px !important; margin-block: 36px !important; }
.framer-HZFOj.framer-v-1o4tkwu .framer-7yb761 { gap: 36px !important; }
.framer-HZFOj.framer-v-1o4tkwu .framer-usrzmk p { --framer-font-size: 17px !important; font-size: 17px !important; }
.framer-HZFOj.framer-v-1o4tkwu .evo-btn { min-width: 220px; }

/* mobile: stacked, centred */
.framer-HZFOj.framer-v-146ha3c .framer-1w5wprn { padding: 40px 24px !important; border-radius: 22px !important; margin-block: 28px !important; }
.framer-HZFOj.framer-v-146ha3c .framer-7yb761 { flex-direction: column !important; gap: 28px !important; }
.framer-HZFOj.framer-v-146ha3c .framer-usrzmk { max-width: 560px; width: 100% !important; }
.framer-HZFOj.framer-v-146ha3c .framer-usrzmk p strong, .framer-HZFOj.framer-v-146ha3c .framer-usrzmk p strong a { font-size: 1.12em; line-height: 1; }
.framer-HZFOj.framer-v-146ha3c .framer-usrzmk p {
  --framer-font-size: 16px !important; font-size: 16px !important;
  --framer-text-alignment: center !important; text-align: center !important;
}
.framer-HZFOj.framer-v-146ha3c .framer-4ek88g { width: 100% !important; }
.framer-HZFOj.framer-v-146ha3c .framer-7xat3c-container { width: 100% !important; max-width: 420px; }
.framer-HZFOj.framer-v-146ha3c .evo-btn { width: 100% !important; min-width: 0; box-sizing: border-box; }

@media (prefers-reduced-motion: reduce) {
  .framer-HZFOj .framer-1w5wprn::after, .evo-cta-card::after { animation: none !important; }
}

/* CTA title: the opening question ("Ești interesat de Evolvo?"), wrapped by js/main.js */
.framer-HZFOj .evo-cta-title {
  display: block; margin-bottom: 14px;
  color: #fff; font-size: 34px; line-height: 1.15; font-weight: 600; letter-spacing: -.02em;
}
.framer-HZFOj .evo-cta-title strong { font-weight: inherit; }
.framer-HZFOj.framer-v-1o4tkwu .evo-cta-title { font-size: 30px; }
.framer-HZFOj.framer-v-146ha3c .evo-cta-title { font-size: 26px; margin-bottom: 12px; }

/* ===== COMPONENT: evo-cta – "Cere DEMO gratuit" sections (23 pages) as the dark CTA card (2026-10-02) =====
   Look = the CTA above (shared rules). HTML/text/heading unchanged; classes added: section .evo-cta,
   card .evo-cta-card, text column .evo-cta-text, button .evo-cta-action. Grey band + tile graphic off. */
.evo-cta { background: none !important; height: auto !important; min-height: 0 !important; overflow: visible !important; padding: 0 20px !important; box-sizing: border-box; }
.evo-cta-card {
  position: relative !important; display: block !important; box-sizing: border-box;
  width: 100% !important; max-width: 1200px !important; height: auto !important; margin-inline: auto !important;
}
.evo-cta > :not(.evo-cta-card), .evo-cta-card > :not(.evo-cta-text) { display: none !important; } /* old tile graphic */
.evo-cta-text {
  display: grid !important; grid-template-columns: minmax(0, 1fr) auto; align-items: center;
  width: 100% !important; max-width: none !important; height: auto !important; padding: 0 !important; gap: 0 56px !important;
}
.evo-cta-text > :not(.evo-cta-action), .evo-cta-text > .ssr-variant > :not(.evo-cta-action) { grid-column: 1; width: 100% !important; max-width: 640px; }
.evo-cta-action { grid-column: 2; grid-row: 1 / span 6; justify-self: end; width: auto !important; }
.evo-cta-text :is(h1, h2) {
  --framer-text-color: #fff !important; color: #fff !important;
  --framer-font-size: 34px !important; font-size: 34px !important; line-height: 1.15 !important;
  --framer-text-alignment: left !important; text-align: left !important; margin: 0 0 14px !important;
}
.evo-cta-text :is(h1, h2) strong { color: inherit !important; font-weight: inherit !important; }
.evo-cta-text p { --framer-text-alignment: left !important; text-align: left !important; }
/* tablet */
@media (max-width: 1199.98px) {
  .evo-cta-card { padding: 48px 44px !important; border-radius: 24px !important; margin-block: 36px !important; }
  .evo-cta-text { column-gap: 36px !important; }
  .evo-cta-text :is(h1, h2) { --framer-font-size: 30px !important; font-size: 30px !important; }
  .evo-cta-text p { --framer-font-size: 17px !important; font-size: 17px !important; }
}
/* mobile: stacked, centred */
@media (max-width: 809.98px) {
  .evo-cta { padding: 0 16px !important; }
  .evo-cta-card { padding: 40px 24px !important; border-radius: 22px !important; margin-block: 28px !important; }
  .evo-cta-text { grid-template-columns: 1fr; row-gap: 28px !important; justify-items: center; }
  .evo-cta-text > :not(.evo-cta-action), .evo-cta-text > .ssr-variant > :not(.evo-cta-action) { max-width: 560px; }
  .evo-cta-action { grid-column: 1; grid-row: auto; justify-self: stretch; max-width: 420px; width: 100% !important; margin-inline: auto; }
  .evo-cta-action .evo-btn { width: 100% !important; min-width: 0; box-sizing: border-box; }
  .evo-cta-text :is(h1, h2), .evo-cta-text p { --framer-text-alignment: center !important; text-align: center !important; }
  .evo-cta-text :is(h1, h2) { --framer-font-size: 26px !important; font-size: 26px !important; margin-bottom: 12px !important; }
  .evo-cta-text p { --framer-font-size: 16px !important; font-size: 16px !important; }
  .evo-cta-text p strong { font-size: 1.12em; line-height: 1; } /* phone number / e-mail a bit larger on phones */
}

/* ===== COMPONENT: Testimonials (#testimoniale, home page) – redesign 2026-10-01 =====
   Light panel in the logo blue (#2F669B); cards scroll vertically in two opposite columns
   (built by js/main.js), title on the right. Same HTML text, links and headings. */
#testimoniale {
  --tm-blue: var(--evo-blue); --tm-ink: var(--evo-ink);
  display: grid !important;
  grid-template-columns: minmax(0, 1.75fr) minmax(0, 1fr);
  grid-template-rows: 1fr auto 1fr;
  column-gap: 64px;
  width: min(1240px, calc(100% - 40px)) !important; margin: 56px auto !important;
  height: 680px; padding: 0 64px 0 48px !important; box-sizing: border-box;
  border-radius: var(--evo-radius-panel); overflow: hidden !important; isolation: isolate;
  background: linear-gradient(180deg, var(--evo-panel) 0%, var(--evo-panel-2) 100%);
  border: 1px solid var(--evo-line);
}
/* dotted pattern on the text side */
#testimoniale::before {
  content: ""; position: absolute; inset: 0 0 0 45%; z-index: -1; pointer-events: none;
  background-image: radial-gradient(rgba(47, 102, 155, .16) 2.4px, transparent 3px);
  background-size: 20px 20px;
  /* dots only in the top-right and bottom bands, fading out before the title/text block */
  -webkit-mask-image: radial-gradient(58% 34% at 88% 4%, #000, transparent 72%), radial-gradient(60% 34% at 70% 100%, #000, transparent 72%);
          mask-image: radial-gradient(58% 34% at 88% 4%, #000, transparent 72%), radial-gradient(60% 34% at 70% 100%, #000, transparent 72%);
}
/* dots, second layer: brighter dots revealed by a soft light that drifts slowly (minimal animation) */
#testimoniale::after {
  content: ""; position: absolute; inset: 0 0 0 45%; z-index: -1; pointer-events: none;
  background-image: radial-gradient(rgba(47, 102, 155, .38) 2.4px, transparent 3px);
  background-size: 20px 20px;
  -webkit-mask-image: radial-gradient(circle at center, #000 0, transparent 70%);
          mask-image: radial-gradient(circle at center, #000 0, transparent 70%);
  -webkit-mask-size: 340px 340px; mask-size: 340px 340px;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  animation: evo-dots-drift 16s ease-in-out infinite alternate;
}
@keyframes evo-dots-drift { /* only in the top and bottom bands – never behind the title/text block;
                               the jump between the bands happens while invisible */
  0%   { -webkit-mask-position: 95% -10%; mask-position: 95% -10%; opacity: .5; }
  28%  { -webkit-mask-position: 20% -14%; mask-position: 20% -14%; opacity: 1; }
  34%  { -webkit-mask-position: 10% -14%; mask-position: 10% -14%; opacity: 0; }
  35%  { -webkit-mask-position: 0% 112%;  mask-position: 0% 112%;  opacity: 0; }
  42%  { -webkit-mask-position: 10% 112%; mask-position: 10% 112%; opacity: .8; }
  75%  { -webkit-mask-position: 65% 114%; mask-position: 65% 114%; opacity: 1; }
  100% { -webkit-mask-position: 100% 108%; mask-position: 100% 108%; opacity: .6; }
}
@media (prefers-reduced-motion: reduce) { #testimoniale::after { animation: none; opacity: 0; } }
#testimoniale > .framer-1mxl2s3 { display: none !important; }

/* text block (right) */
#testimoniale > .framer-1yf32pi {
  grid-column: 2; grid-row: 2; width: auto !important; max-width: 480px; padding: 0 !important;
  align-items: flex-start !important; gap: 14px !important; overflow: visible !important;
}
#testimoniale .framer-10httv6 { width: 100% !important; }
#testimoniale .framer-10httv6 h2 {
  --framer-text-alignment: left !important; text-align: left !important;
  --framer-font-size: 44px !important; font-size: 44px !important;
  --framer-line-height: 1.08em !important; line-height: 1.08 !important;
  --framer-letter-spacing: -.03em !important; letter-spacing: -.03em !important;
  --framer-text-color: var(--tm-ink) !important; color: var(--tm-ink) !important;
}
#testimoniale .framer-rmvu8t { width: 100% !important; }
#testimoniale .framer-rmvu8t p {
  --framer-text-alignment: left !important; text-align: left !important;
  --framer-text-color: var(--evo-muted) !important; color: var(--evo-muted) !important;
}
/* the "Testimoniale" badge: see COMPONENT "evo-badge" */
#testimoniale > .framer-10wrezh-container { grid-column: 2; grid-row: 3; align-self: start; justify-self: start; margin-top: 26px; }

/* card columns (left) */
#testimoniale > .framer-1r54uwg-container { grid-column: 1; grid-row: 1 / 4; height: 100% !important; width: 100% !important; }
.evo-tm-cols {
  display: flex; gap: 20px; height: 100%; overflow: hidden;
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 9%, #000 91%, transparent 100%);
          mask-image: linear-gradient(180deg, transparent 0, #000 9%, #000 91%, transparent 100%);
}
.evo-tm-col { flex: 1 1 0; min-width: 0; }
.evo-tm-track {
  display: flex; flex-direction: column; gap: 20px; margin: 0; padding: 0; list-style: none;
  animation: evo-tm-up var(--evo-tm-time, 40s) linear infinite;
}
.evo-tm-col.is-reverse .evo-tm-track { animation-direction: reverse; }
.evo-tm-col:hover .evo-tm-track, .evo-tm-col:focus-within .evo-tm-track { animation-play-state: paused; }
/* -50% minus half a gap = exactly one set of cards */
@keyframes evo-tm-up { to { transform: translateY(calc(-50% - 10px)); } }
@media (prefers-reduced-motion: reduce) { .evo-tm-track { animation: none; } .evo-tm-cols { overflow-y: auto; } }

/* the cards */
#testimoniale .framer-lux5qc {
  display: flex !important; flex-direction: column !important; gap: 16px !important;
  width: 100% !important; height: auto !important; box-sizing: border-box; position: relative;
  padding: 26px 28px 28px !important; border-radius: var(--evo-radius-card) !important;
  background: var(--evo-white) !important; --border-color: transparent !important;
  box-shadow: var(--evo-shadow-card) !important;
  outline: 1px solid var(--evo-card-line); outline-offset: -1px; /* same edge as evo-card */
  transition: transform .3s var(--evo-ease), box-shadow .3s ease;
}
#testimoniale .framer-lux5qc:hover {
  transform: translateY(-3px);
  box-shadow: var(--evo-shadow-card-hover) !important;
}
/* quote mark in the top-right corner (where the reference has its X icon) */
#testimoniale .framer-lux5qc::before {
  content: ""; position: absolute; top: 28px; right: 26px; width: 22px; height: 22px;
  background: var(--tm-blue); opacity: .85;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9.6 5C6.3 6.5 4 9.6 4 13.4V19h6.4v-6.3H7.3c0-2.4 1.4-4.4 3.5-5.4L9.6 5zm10 0c-3.3 1.5-5.6 4.6-5.6 8.4V19h6.4v-6.3h-3.1c0-2.4 1.4-4.4 3.5-5.4L19.6 5z'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9.6 5C6.3 6.5 4 9.6 4 13.4V19h6.4v-6.3H7.3c0-2.4 1.4-4.4 3.5-5.4L9.6 5zm10 0c-3.3 1.5-5.6 4.6-5.6 8.4V19h6.4v-6.3h-3.1c0-2.4 1.4-4.4 3.5-5.4L19.6 5z'/%3E%3C/svg%3E") center / contain no-repeat;
}
#testimoniale .framer-lux5qc > div:first-child { padding-right: 34px; gap: 14px !important; }
#testimoniale .framer-lux5qc > div:first-child > div:first-child {
  width: 52px !important; box-shadow: 0 0 0 3px var(--evo-white), 0 0 0 4px var(--evo-line);
}
#testimoniale .framer-lux5qc > div:first-child > div:last-child { overflow: visible !important; }
#testimoniale .framer-lux5qc h3, #testimoniale .framer-lux5qc > div:first-child p { white-space: normal !important; }
#testimoniale .framer-lux5qc h3 {
  --framer-font-size: 17px !important; font-size: 17px !important;
  --framer-line-height: 1.3em !important; line-height: 1.3 !important;
  --framer-letter-spacing: -.01em !important;
  --framer-text-color: var(--tm-ink) !important; color: var(--tm-ink) !important;
}
#testimoniale .framer-lux5qc > div:first-child p {
  --framer-text-color: var(--evo-muted) !important; color: var(--evo-muted) !important;
  --framer-letter-spacing: -.01em !important;
}
#testimoniale .framer-lux5qc > div:last-child p {
  --framer-font-size: 15px !important; font-size: 15px !important;
  --framer-line-height: 1.6em !important; line-height: 1.6 !important;
  --framer-text-color: var(--evo-text) !important; color: var(--evo-text) !important;
}

/* tablet + phone: text on top (centred), cards below */
@media (max-width: 999.98px) {
  #testimoniale {
    grid-template-columns: 1fr; grid-template-rows: auto auto 560px;
    height: auto; padding: 56px 32px 0 !important; border-radius: 32px; row-gap: 0;
  }
  #testimoniale::before, #testimoniale::after { inset: 0; }
  #testimoniale > .framer-1yf32pi { grid-column: 1; grid-row: 1; max-width: 560px; justify-self: center; align-items: center !important; }
  #testimoniale .framer-10httv6 h2, #testimoniale .framer-rmvu8t p { --framer-text-alignment: center !important; text-align: center !important; }
  #testimoniale .framer-10httv6 h2 { --framer-font-size: 38px !important; font-size: 38px !important; }
  #testimoniale > .framer-10wrezh-container { grid-column: 1; grid-row: 2; justify-self: center; margin: 22px 0 32px; }
  #testimoniale > .framer-1r54uwg-container { grid-column: 1; grid-row: 3; }
}
@media (max-width: 699.98px) {
  #testimoniale { width: calc(100% - 24px) !important; padding: 44px 16px 0 !important; border-radius: 26px; margin: 40px auto !important; grid-template-rows: auto auto 520px; }
  #testimoniale .framer-10httv6 h2 { --framer-font-size: 30px !important; font-size: 30px !important; }
  #testimoniale .framer-lux5qc { padding: 22px 20px 24px !important; border-radius: 22px !important; }
  #testimoniale .framer-lux5qc::before { top: 24px; right: 20px; width: 18px; height: 18px; }
}

/* ===== COMPONENT: evo-btn – the site's standard light button (2026-10-01) =====
   One design for every button: js/main.js adds the class (EVO_BUTTONS list) + the glow element,
   so the HTML and the button texts stay unchanged. New button → add its selector to EVO_BUTTONS.
   Hover: lift, shine sweep, arrow nudge (the mouse-following light was removed 2026-10-02, Vincent). */
.evo-btn {
  position: relative !important; overflow: hidden !important; isolation: isolate;
  min-width: 260px; height: auto !important; padding: 18px 34px !important; border-radius: var(--evo-radius-btn) !important; box-sizing: border-box;
  background: linear-gradient(180deg, var(--evo-white) 0%, #e3edf7 100%) !important;
  --border-color: rgba(47, 102, 155, .16) !important;
  box-shadow: 0 10px 24px -10px rgba(47, 102, 155, .6), inset 0 1px 0 #fff !important;
  transition: transform .25s var(--evo-ease), box-shadow .25s ease;
}
.evo-btn p {
  --framer-text-color: var(--evo-ink) !important; color: var(--evo-ink) !important;
  --framer-font-size: 16px !important; font-size: 16px !important; font-weight: 600 !important;
  --framer-line-height: 1.3em !important; line-height: 1.3 !important;
}
.evo-btn svg { --21h8s6: var(--evo-ink) !important; --1m6trwb: 0 !important; transition: transform .25s var(--evo-ease); }
.evo-btn > * { position: relative; z-index: 1; }
/* compact size: header */
.evo-btn.is-sm { min-width: 0; padding: 11px 20px !important; border-radius: 12px !important; }
.evo-btn.is-sm p { --framer-font-size: 15px !important; font-size: 15px !important; }
/* dark tone – on light backgrounds (chosen automatically by js/main.js) */
.evo-btn.is-dark {
  background: linear-gradient(180deg, #1d3d5e 0%, var(--evo-navy-800) 100%) !important;
  box-shadow: 0 10px 24px -10px rgba(15, 33, 51, .7), inset 0 1px 0 rgba(255,255,255,.14) !important;
}
.evo-btn.is-dark p { --framer-text-color: #fff !important; color: #fff !important; }
.evo-btn.is-dark svg { --21h8s6: #fff !important; }
.evo-btn.is-dark::after { background: linear-gradient(100deg, transparent, rgba(255,255,255,.25), transparent); }
/* shine sweep (::after – Framer's border pseudo is replaced, the border comes from the shadow) */
.evo-btn::after {
  content: "" !important; position: absolute !important; inset: 0 auto 0 -60% !important; width: 45% !important; z-index: 2;
  border: 0 !important; border-radius: 0 !important; pointer-events: none;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,.85), transparent);
  transform: skewX(-18deg); transition: left .6s ease;
}
.evo-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 34px -12px rgba(63, 127, 189, .85), inset 0 1px 0 #fff !important;
}
.evo-btn:hover::after { left: 120% !important; }
.evo-btn:hover svg { transform: translateX(4px); }
.evo-btn:active { transform: translateY(0) scale(.98); }
.evo-btn:focus-visible { outline: 2px solid var(--evo-blue-soft); outline-offset: 3px; }

/* ===== COMPONENT: evo-faq – FAQ as a dark card with a smooth accordion (2026-10-02) =====
   Model: agentflowtemplate.webflow.io/contact-pages/contact-v3 (FAQ block). Questions as rows with a +/− button.
   Classes (set in the HTML by tools/build-faq.py, text unchanged): the FAQ box = .evo-faq;
   with a title block (.evo-faq-head) → .has-head: title left, questions right (desktop).
   Answers: in the HTML where the live site has them (home page), elsewhere in <template> exactly like
   the live site (loaded on first open). Collapsing happens only once js/main.js is ready (.is-ready). */
.evo-faq {
  position: relative !important; isolation: isolate; overflow: hidden !important; box-sizing: border-box;
  display: grid !important; grid-template-columns: minmax(0, 1fr); align-items: start; align-content: start;
  gap: 0 !important; flex: none !important;
  width: calc(100% - 40px) !important; max-width: 1280px !important; height: auto !important; min-height: 0 !important;
  margin: 48px auto 88px !important; padding: 72px 80px !important; /* 88px below: room for the whole shadow (a clipping Framer parent cut it off) */
  border-radius: var(--evo-radius-panel) !important; outline: none !important;
  background:
    radial-gradient(55% 70% at 0% 100%, rgba(47, 102, 155, .38) 0%, rgba(20, 45, 72, 0) 70%),
    linear-gradient(180deg, var(--evo-navy-900) 0%, var(--evo-navy-800) 100%) !important;
  box-shadow: 0 30px 60px -28px rgba(12, 30, 50, .55), 0 2px 6px rgba(12, 30, 50, .12) !important;
}
.evo-faq.has-head { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: 72px !important; padding: 104px 88px !important; }
/* dotted texture, only in the bottom-left corner (never behind the questions) */
.evo-faq::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image: radial-gradient(rgba(150, 185, 220, .3) 1.2px, transparent 1.6px);
  background-size: 14px 14px;
  -webkit-mask-image: radial-gradient(38% 50% at 8% 100%, #000 0%, rgba(0,0,0,.4) 45%, transparent 100%);
          mask-image: radial-gradient(38% 50% at 8% 100%, #000 0%, rgba(0,0,0,.4) 45%, transparent 100%);
}
.evo-faq::after { content: none !important; } /* no Framer border / card pseudo */
[class*="-container"]:has(> .evo-faq) { width: 100% !important; max-width: none !important; height: auto !important; } /* /faq: the Framer component holder */
/* home page: tile graphic off; of Framer's 2 list copies (2 columns / 1 column) the 1-column one
   is in reading order → shown at every width */
#faq.evo-faq > .framer-19rkmn6 { display: none !important; }
#faq.evo-faq > .ssr-variant.hidden-1q5plbh { display: none !important; }
#faq.evo-faq > .ssr-variant.hidden-jacvj3.hidden-72rtr7 { display: contents !important; }

/* title block (left on desktop) */
.evo-faq.has-head > *, .evo-faq.has-head > .ssr-variant > * { grid-column: 2; }
.evo-faq.has-head .evo-faq-head {
  grid-column: 1; grid-row: 1 / span 60; align-self: start !important; position: relative !important;
  display: flex !important; flex-direction: column !important; align-items: flex-start !important; justify-content: flex-start !important;
  width: 100% !important; max-width: none !important; height: auto !important; gap: 20px !important; padding: 0 !important; margin: 0 !important;
}
.evo-faq-head > * { width: auto !important; max-width: 100% !important; }
.evo-faq-head :is(h1, h2) {
  --framer-text-color: #fff !important; color: #fff !important;
  --framer-text-alignment: left !important; text-align: left !important;
  --framer-font-size: 44px !important; font-size: 44px !important; line-height: 1.1 !important;
}
#faq .evo-faq-head :is(h1, h2) { --framer-font-size: 52px !important; font-size: 52px !important; line-height: 1.08 !important; }
.evo-faq-head p { --framer-text-color: rgba(225, 235, 245, .74) !important; color: rgba(225, 235, 245, .74) !important; --framer-text-alignment: left !important; text-align: left !important; }
.evo-faq-head :is(h1, h2) strong { color: inherit !important; }
.evo-faq .framer-IVb6j { /* badge on dark */
  background: rgba(47, 102, 155, .22) !important; --border-color: rgba(143, 182, 220, .22) !important;
  box-shadow: none !important; --34440n: #cfe0f1 !important;
}
.evo-faq .framer-IVb6j p { --framer-text-color: #fff !important; color: #fff !important; }

/* the question list: every wrapper Framer puts around the items becomes a plain full-width block */
.evo-faq :is(.framer-rnip99, [data-framer-name="Column"], .framer-2zKuH),
.evo-faq :is(.framer-rnip99, [data-framer-name="Column"], .framer-2zKuH) > div {
  display: block !important; width: 100% !important; max-width: none !important; height: auto !important;
  min-height: 0 !important; padding: 0 !important; margin: 0 !important; gap: 0 !important;
  background: none !important; box-shadow: none !important; position: relative !important; inset: auto !important;
}
.evo-faq [class*="-container"]:has(.framer-vaz7M) { width: 100% !important; max-width: none !important; height: auto !important; position: relative !important; inset: auto !important; transform: none !important; }
.evo-faq:not(.has-head) > * { grid-area: auto !important; } /* Framer's fixed grid cells would stack the rows on top of each other */
.evo-faq [data-framer-name="Question"] > .framer-mkxvkp { position: relative !important; inset: auto !important; transform: none !important; }
.evo-faq [data-framer-name="Line"] { display: none !important; } /* Framer's separators → the rows draw their own */
.evo-faq .framer-vaz7M {
  display: grid !important; grid-template-rows: auto 1fr; grid-template-columns: minmax(0, 1fr); justify-content: stretch !important;
  width: 100% !important; height: auto !important;
  border-bottom: 1px solid rgba(143, 182, 220, .14);
  transition: grid-template-rows .55s var(--evo-ease), border-color .3s ease;
}
.evo-faq .framer-vaz7M.is-last { border-bottom-color: transparent; }
/* question row: text left, +/− button right */
.evo-faq [data-framer-name="Question"] {
  display: flex !important; justify-content: space-between !important; align-items: center !important;
  gap: 24px !important; width: 100% !important; padding: 28px 0 !important; cursor: pointer;
  border-radius: 12px; outline: none;
}
.evo-faq [data-framer-name="Question"]:focus-visible { box-shadow: 0 0 0 2px var(--evo-blue-soft); }
.evo-faq [data-framer-name="Question"] > .framer-mkxvkp { flex: 1 1 auto !important; width: auto !important; }
.evo-faq h3 {
  --framer-text-color: #fff !important; color: #fff !important;
  --framer-font-size: 20px !important; font-size: 20px !important; line-height: 1.35 !important;
  transition: color .3s ease;
}
.evo-faq [data-framer-name="Question"]:hover h3 { --framer-text-color: #d6e6f6 !important; color: #d6e6f6 !important; }
.evo-faq [data-framer-name="Plus"] {
  position: relative !important; inset: auto !important; order: 2; flex: none;
  width: 44px !important; height: 44px !important; border-radius: 12px !important;
  opacity: 1 !important; transform: none !important; overflow: visible !important;
  background: rgba(47, 102, 155, .16); box-shadow: inset 0 0 0 1px rgba(143, 182, 220, .16);
  transition: background-color .3s ease, box-shadow .3s ease;
}
.evo-faq [data-framer-name="Question"]:hover [data-framer-name="Plus"] { background: rgba(47, 102, 155, .32); }
.evo-faq [data-framer-name="Plus"] > div {
  position: absolute !important; inset: auto !important; left: 50% !important; top: 50% !important;
  width: 16px !important; height: 1.5px !important; margin: -.75px 0 0 -8px;
  background: #fff !important; border-radius: 2px;
  transition: transform .45s var(--evo-ease), opacity .3s ease;
}
.evo-faq [data-framer-name="Plus"] > div:last-child { transform: rotate(90deg); }        /* "+" */
.evo-faq .is-open [data-framer-name="Plus"] > div:last-child { transform: rotate(180deg); opacity: 0; } /* "−" */
/* answer */
.evo-faq [data-framer-name="Answer"] {
  min-height: 0; overflow: hidden !important; width: 100% !important; height: auto !important;
  padding: 0 64px 0 0 !important; opacity: 1 !important;
}
.evo-faq [data-framer-name="Answer"] > div { position: relative !important; inset: auto !important; display: block !important; width: 100% !important; height: auto !important; padding-bottom: 28px; transition: opacity .45s ease, transform .55s var(--evo-ease); }
.evo-faq [data-framer-name="Answer"] p {
  --framer-text-color: rgba(225, 235, 245, .74) !important; color: rgba(225, 235, 245, .74) !important;
  --framer-font-size: 17px !important; font-size: 17px !important; line-height: 1.6 !important;
}
/* collapsed (only when JS is running) */
.evo-faq.is-ready .framer-vaz7M:not(.is-open) { grid-template-rows: auto 0fr; }
.evo-faq.is-ready .framer-vaz7M:not(.is-open) [data-framer-name="Answer"] > div { opacity: 0; transform: translateY(-8px) scale(.98); }
.evo-faq .framer-vaz7M.is-open { border-bottom-color: rgba(143, 182, 220, .26); }

/* tablet */
@media (max-width: 1199.98px) {
  .evo-faq, .evo-faq.has-head { grid-template-columns: minmax(0, 1fr); padding: 64px 52px !important; border-radius: 32px !important; margin-block: 36px 72px !important; }
  .evo-faq.has-head > *, .evo-faq.has-head > .ssr-variant > * { grid-column: 1; }
  .evo-faq.has-head .evo-faq-head { grid-column: 1; grid-row: auto; margin-bottom: 24px !important; }
  .evo-faq-head :is(h1, h2), #faq .evo-faq-head :is(h1, h2) { --framer-font-size: 40px !important; font-size: 40px !important; }
}
/* mobile */
@media (max-width: 809.98px) {
  .evo-faq, .evo-faq.has-head { width: calc(100% - 32px) !important; padding: 44px 22px !important; border-radius: 24px !important; margin-block: 28px 64px !important; }
  .evo-faq-head :is(h1, h2), #faq .evo-faq-head :is(h1, h2) { --framer-font-size: 32px !important; font-size: 32px !important; }
  .evo-faq [data-framer-name="Question"] { padding: 22px 0 !important; gap: 16px !important; }
  .evo-faq h3 { --framer-font-size: 18px !important; font-size: 18px !important; }
  .evo-faq [data-framer-name="Plus"] { width: 40px !important; height: 40px !important; }
  .evo-faq [data-framer-name="Answer"] { padding-right: 0 !important; }
  .evo-faq [data-framer-name="Answer"] > div { padding-bottom: 22px; }
  .evo-faq [data-framer-name="Answer"] p { --framer-font-size: 16px !important; font-size: 16px !important; }
}
@media (prefers-reduced-motion: reduce) {
  .evo-faq .framer-vaz7M, .evo-faq [data-framer-name="Answer"] > div, .evo-faq [data-framer-name="Plus"] > div { transition: none !important; }
}

/* ===== COMPONENT: evo-badge – the small section label ("Testimoniale", "Avantaje"…) =====
   Framer's "Small Tittle" component everywhere (.framer-IVb6j) + .evo-badge for new markup. */
.framer-IVb6j, .evo-badge {
  display: inline-flex; align-items: center; gap: 8px;
  /* opaque (tint over white): background patterns never show through the label */
  background: linear-gradient(rgba(47, 102, 155, .1), rgba(47, 102, 155, .1)), #fff !important; --border-color: rgba(47, 102, 155, .18) !important;
  border-radius: 12px !important;
  box-shadow: 0 1px 1px rgba(18, 38, 59, .06), 0 4px 10px rgba(47, 102, 155, .08) !important;
}
.evo-badge { padding: 7px 14px; border: 1px solid rgba(47, 102, 155, .18); color: var(--evo-blue); font-size: 14px; font-weight: 500; line-height: 1.2; }

/* ===== COMPONENT: evo-grid – animated tile background (drawn by js/main.js, look on /brand) ===== */
.evo-grid-canvas { display: block; width: 100%; height: 100%; }
.evo-grid { aspect-ratio: 1311 / 362; pointer-events: none; }

/* EVO typography rule (2026-10-05, Vincent): no odd line breaks anywhere. Headings are balanced (equal-length lines,
   no lonely word on the last line), body text is "pretty" (no orphan word). Text itself is untouched. */
/* text-wrap-STYLE only (never the "text-wrap" shorthand): the shorthand also switches Framer's "do not wrap"
   (white-space: pre / nowrap) to wrapping, which shrank buttons, pills and the footer columns (bug 2026-10-05). */
h1, h2, h3, h4, h5, h6, .framer-text:is(h1, h2, h3, h4, h5, h6) { text-wrap-style: balance; }
p, li, .framer-text:is(p, li), blockquote { text-wrap-style: pretty; }

/* Forms: the typed text and the placeholder never run under the field icon (32px kept free for it);
   long placeholders get a slightly smaller, tighter type on phones and end with "…" if still too long. */
label:has(svg) .framer-form-input { padding-right: 32px !important; text-overflow: ellipsis; }
@media (max-width: 809.98px) {
  label:has(svg) .framer-form-input::placeholder { font-size: 12.5px; letter-spacing: -.02em; }
}
@media (max-width: 379.98px) {
  label:has(svg) .framer-form-input::placeholder { font-size: 11.5px; letter-spacing: -.025em; }
}

/* EVO mobile corner rule (2026-10-05, Vincent): on phones big roundings look like capsules, especially on short boxes.
   Cards 28 -> 20px, panels 40 -> 28px; boxes lower than 140px (one or two lines of text) max 14px (.evo-low-box, js/main.js). */
@media (max-width: 809.98px) {
  :root { --evo-radius-card: 20px; --evo-radius-panel: 28px; }
  .evo-low-box { border-radius: 14px !important; }
}

/* EVO logo strip (2026-10-05, Vincent): the moving client logos run edge to edge of the screen (not inside a 1000px box),
   logos 10% bigger, only a narrow fade at the screen edges. All 23 pages with the strip ([data-framer-name="tesimonials"]). */
[data-framer-name="tesimonials"] { width: 100vw !important; max-width: none !important; margin-left: calc(50% - 50vw) !important; margin-right: 0 !important; align-self: flex-start !important; flex: none !important; }
[data-framer-name="tesimonials"] > section { width: 100% !important; max-width: none !important;
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 5%, #000 95%, transparent 100%) !important;
  mask-image: linear-gradient(to right, transparent 0, #000 5%, #000 95%, transparent 100%) !important; }
[data-framer-name="tesimonials"] > section > ul { zoom: 1.1; }
.framer-POWyM:has([data-framer-name="tesimonials"]) { overflow: visible !important; }

/* Circle texts ("✦ testimoniale ✦", "Acces Online" ...) turn like on the live Framer site: one turn in 20s, clockwise
   (measured on evolvo.ro 2026-10-05). Framer's runtime did this; here pure CSS. Off with reduced motion. */
@keyframes evo-spin { to { rotate: 360deg; } }
@media (prefers-reduced-motion: no-preference) {
  svg:has(textPath) { animation: evo-spin 20s linear infinite; }
}

/* Framer scroll/appear animations were exported in their START state (inline "opacity:0;transform:translateX(-150px)"
   etc.) and only Framer's runtime moved them in. Without it they stayed invisible/shifted (campaign pages: cat-te-costa…,
   one-page/test, one-page/multumim…). Show them in their final place; evo-reveal / the page intro give the motion. */
/* both spellings: the browser rewrites the attribute with spaces once a script sets a style property on the element */
:is([style*="will-change:transform;opacity:0;transform:"], [style*="will-change: transform; opacity: 0; transform:"]) { opacity: 1 !important; transform: none !important; }

/* Footer (Vincent 2026-10-05): every footer link in ONE colour and size. Framer darkened the link of the current page
   (data-framer-page-link-current) and styled the "Setări cookie." button differently (dark grey; 16px bold on phones,
   12px on desktop). Now all = the footer link style: rgb(102,112,133), 400, 12.6px phone / 14.4px from tablet. */
.framer-styles-preset-14mtly2[data-framer-page-link-current] { color: rgb(102, 112, 133) !important; }
.__framer-cookie-component-button, .__framer-cookie-component-button * {
  color: rgb(102, 112, 133) !important; font-weight: 400 !important; font-size: 14.4px !important; line-height: 1.2 !important;
  font-family: inherit !important; letter-spacing: normal !important;
}
@media (max-width: 809.98px) { .__framer-cookie-component-button, .__framer-cookie-component-button * { font-size: 12.6px !important; } }

/* EVO form fields (Vincent 2026-10-05): focus = the whole field box (no inner rectangle on the text); the icon at the end
   shows the state: grey empty · logo blue while typing / correctly filled · red when wrong (phone, e-mail, required).
   States set by js/main.js (label.evo-valid / label.evo-invalid). Every form on the site uses this markup. */
label:has(svg) svg { transition: color .2s ease; }
label:has(svg) .framer-form-input-wrapper { transition: box-shadow .25s ease; }
label:has(svg):focus-within svg, label.evo-valid svg { --21h8s6: var(--evo-blue) !important; }
label:has(svg):focus-within .framer-form-input-wrapper { box-shadow: 0 0 0 1.5px var(--evo-blue), 0 0 20px -5px rgba(47, 102, 155, .55) !important; }
label.evo-invalid svg { --21h8s6: #d64545 !important; }
label.evo-invalid .framer-form-input-wrapper, label.evo-invalid:focus-within .framer-form-input-wrapper { box-shadow: 0 0 0 1.5px #d64545, 0 0 20px -6px rgba(214, 69, 69, .5) !important; }

/* number fields (Nr. medici, Cod fiscal): no browser up/down arrows inside the designed box */
.framer-form-input[type="number"] { -moz-appearance: textfield; appearance: textfield; }
.framer-form-input[type="number"]::-webkit-inner-spin-button, .framer-form-input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
/* one-page forms: their field icons are shared symbols with a fixed stroke colour → let the field state colour them
   (falls back to the original colour everywhere else) */
svg[id^="svg-"][data-lucide] > g[stroke="#000006"] { stroke: var(--21h8s6, #000006); }
/* one-page forms keep their icons at 50% when idle (Framer design); in a state (focus / valid / wrong) full strength */
label:has(.framer-form-input):is(:focus-within, .evo-valid, .evo-invalid) :has(> .svgContainer) { opacity: 1 !important; transition: opacity .2s ease; }

/* ===== COMPONENT: evo-calc – the "Calculator" card (cat-te-costa pages, 2026-10-05) =====
   Markup: tools/build-calc.py (inside Framer's .framer-1XWvC card) · motion: js/main.js "COMPONENT evo-calc".
   Dark brand surface, rolling number, one chart per period, Apple-like segmented switch (auto every 5 s).
   Only opacity/transform animate; sizes follow the card (container query units). */
.evo-calc {
  container-type: inline-size; width: 100% !important; box-sizing: border-box;
  min-width: min(339px, calc(100vw - 40px)); /* Framer sized the card by its old content (tablet: 339px) */
  display: flex !important; flex-direction: column !important; align-items: stretch !important; justify-content: space-between !important;
  gap: 4cqi; padding: clamp(18px, 5cqi, 30px) !important; border-radius: var(--evo-radius-card) !important;
  background: radial-gradient(120% 70% at 50% 115%, rgba(47, 102, 155, .55), transparent 62%),
    linear-gradient(180deg, var(--evo-navy-900), var(--evo-navy-800)) !important;
  box-shadow: 0 30px 60px -28px rgba(12, 30, 50, .55), inset 0 0 0 1px rgba(143, 182, 220, .12) !important;
  color: #fff; font-family: var(--evo-font); text-align: center;
  position: relative; isolation: isolate; overflow: hidden !important;
}
/* the same dotted texture as the dark CTA card (fading towards the middle) … */
.evo-calc::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image: radial-gradient(rgba(150, 185, 220, .22) 1.2px, transparent 1.6px); background-size: 14px 14px;
  -webkit-mask-image: linear-gradient(90deg, #000 0%, rgba(0,0,0,.35) 22%, transparent 42%, transparent 58%, rgba(0,0,0,.35) 78%, #000 100%);
          mask-image: linear-gradient(90deg, #000 0%, rgba(0,0,0,.35) 22%, transparent 42%, transparent 58%, rgba(0,0,0,.35) 78%, #000 100%);
  opacity: .55;
}
/* … and under the mouse a soft light that makes the dots glow and follows the pointer (js/main.js) */
.evo-calc-spot { position: absolute; left: 0; top: 0; width: 300px; height: 300px; z-index: -1; pointer-events: none; overflow: hidden; border-radius: 50%;
  opacity: 0; transition: opacity .5s ease; will-change: transform;
  -webkit-mask-image: radial-gradient(closest-side, #000, rgba(0,0,0,.45) 55%, transparent); mask-image: radial-gradient(closest-side, #000, rgba(0,0,0,.45) 55%, transparent); }
.evo-calc-spot > span { position: absolute; left: 0; top: 0; will-change: transform;
  background: radial-gradient(rgba(207, 224, 241, .95) 1.4px, transparent 1.9px) 0 0 / 14px 14px; }
.evo-calc-spot::before { content: ""; position: absolute; inset: 0; border-radius: 50%; background: radial-gradient(closest-side, rgba(63, 127, 189, .28), transparent); }
.evo-calc.is-lit .evo-calc-spot { opacity: 1; }
.evo-calc p { margin: 0; }
.evo-calc-head { display: flex; flex-direction: column; align-items: center; }
.evo-calc-label { font-size: clamp(13px, 3.1cqi, 16px); font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--evo-blue-soft); }
.evo-calc-figure { display: flex; align-items: baseline; justify-content: center; gap: 8px; margin-top: 1.2cqi !important; line-height: 1; }
.evo-calc-value { display: inline-flex; font-size: clamp(44px, 15cqi, 80px); font-weight: 700; letter-spacing: -.02em; font-variant-numeric: tabular-nums; color: #fff; }
.evo-calc-unit { font-size: clamp(18px, 5cqi, 28px); font-weight: 600; color: rgba(207, 224, 241, .7); }
.evo-calc-note { margin-top: 1.4cqi !important; font-size: clamp(12px, 2.8cqi, 14px); color: rgba(207, 224, 241, .6); }
/* rolling digits (built by JS; the plain number stays in the HTML) */
.evo-calc-digit { display: inline-block; height: 1.12em; margin-block: -.06em; overflow: hidden; line-height: 1.12;
  -webkit-mask-image: linear-gradient(transparent, #000 14%, #000 86%, transparent); mask-image: linear-gradient(transparent, #000 14%, #000 86%, transparent); }
.evo-calc-reel { display: flex; flex-direction: column; transition: transform .9s var(--evo-ease) var(--evo-delay, 0s); }
.evo-calc-reel > span { height: 1.12em; }
.evo-calc-sep { display: inline-block; }

/* chart */
.evo-calc-chart { position: relative; flex: 1 1 auto; min-height: 60px; margin-inline: 1cqi; }
.evo-calc-chart svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.evo-calc-grid line { stroke: rgba(207, 224, 241, .08); stroke-width: 1; stroke-dasharray: 3 5; vector-effect: non-scaling-stroke; }
.evo-calc-line { fill: none; stroke: var(--evo-calc-stroke); stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.evo-calc-area { fill: var(--evo-calc-fill); }
.evo-calc-bar { fill: var(--evo-calc-bar); transform-box: fill-box; transform-origin: 50% 100%; transform: scaleY(0); transition: transform 0s .4s; }
.evo-calc-series { opacity: 0; transition: opacity .4s ease; }
.evo-calc-series.is-on { opacity: 1; }
.evo-calc-sweep { transform: scaleX(0); transform-origin: 0 0; transition: transform 0s .4s; }
.evo-calc-series.is-on .evo-calc-sweep { transform: none; transition: transform 1.3s cubic-bezier(.65, 0, .35, 1) .05s; }
.evo-calc-series.is-on .evo-calc-bar { transform: none; transition: transform .9s var(--evo-ease) calc(var(--i) * 60ms + .05s); }
.evo-calc-dot { position: absolute; width: 10px; height: 10px; margin: -5px 0 0 -5px; border-radius: 50%; background: #fff;
  box-shadow: 0 0 0 4px rgba(63, 127, 189, .45), 0 0 18px 4px rgba(143, 182, 220, .55);
  opacity: 0; scale: .2; transition: opacity .25s ease, scale .25s ease; }
.evo-calc-dot.is-on { opacity: 1; scale: 1; transition: opacity .4s ease 1.2s, scale .6s cubic-bezier(.34, 1.56, .64, 1) 1.2s; }
.evo-calc-dot.is-on::after { content: ""; position: absolute; inset: -6px; border-radius: 50%; border: 1px solid rgba(207, 224, 241, .6);
  animation: evo-calc-ping 2.4s ease-out 1.8s infinite; opacity: 0; }
@keyframes evo-calc-ping { 0% { opacity: .8; transform: scale(.6); } 80%, 100% { opacity: 0; transform: scale(2.2); } }

/* segmented switch */
.evo-calc-tabs { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); width: min(100%, 380px); margin: 0 auto; padding: 4px; box-sizing: border-box;
  border-radius: 999px; background: rgba(255, 255, 255, .06); box-shadow: inset 0 0 0 1px rgba(207, 224, 241, .1); }
.evo-calc-thumb { position: absolute; top: 4px; bottom: 4px; left: 4px; width: calc((100% - 8px) / 3); border-radius: 999px; overflow: hidden;
  /* the whole pill is the 5 s loader: dark blue base, the light blue fills it slowly from the left */
  background: linear-gradient(180deg, #1f4a74, #183b5e);
  box-shadow: 0 6px 16px -6px rgba(47, 102, 155, .9), inset 0 1px 0 rgba(255, 255, 255, .12);
  transform: translateX(calc(var(--evo-calc-i, 0) * 100%)); transition: transform .55s cubic-bezier(.3, 1.25, .5, 1); }
.evo-calc-progress { position: absolute; inset: 0; background: linear-gradient(180deg, var(--evo-blue-light), var(--evo-blue));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22); transform-origin: 0 50%; transform: scaleX(0); }
.evo-calc-tab { position: relative; z-index: 1; appearance: none; border: 0; background: none; cursor: pointer; padding: clamp(9px, 2.4cqi, 12px) 6px;
  font: 600 clamp(13px, 3cqi, 15px)/1.1 var(--evo-font); color: rgba(207, 224, 241, .72); border-radius: 999px; transition: color .3s ease; }
.evo-calc-tab:hover { color: #fff; }
.evo-calc-tab[aria-pressed="true"] { color: #fff; }
.evo-calc-tab:focus-visible { outline: 2px solid var(--evo-blue-soft); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
  .evo-calc *, .evo-calc *::after { transition: none !important; animation: none !important; }
  .evo-calc-progress { transform: none; }
  .evo-calc-spot { display: none; }
}

/* ===== RULE: the fixed header is always on top (Vincent 2026-10-05) =====
   Framer gave the header holder z-index 10 – the same as several form boxes further down the page, which then
   slid OVER the header while scrolling (e-factura, pias …). Menus, cookie panel and WhatsApp keep their own higher values. */
.framer-3c0a1-container[data-framer-name="evolvo nav bar"] { z-index: 1000 !important; }

/* ===== RULE: hero title sizes (Vincent 2026-10-05) – one size everywhere, change HERE ONLY =====
   Applied to the Funcții + Avantaje pages by tools/build-hero-type.py (EVO-HERO-TYPE block in css/pages/*.css).
   H1 is about twice its subtitle, so the order is always clear. */
:root { --evo-hero-h1: 48px; --evo-hero-h1-sm: 36px; --evo-hero-sub: 24px; --evo-hero-sub-sm: 20px; }
/* Card / sub-section titles (H3) one step under the section titles (H2 ≈ 28/34px): Framer's big "PIOGSzZif"
   preset made some H3s (28/32px) as big as the H2s – e.g. the numbered benefits on /programare-pacienti-online. */
:root { --evo-h3: 24px; --evo-h3-sm: 20px; }
:is(h3.framer-styles-preset-160gx1, .framer-styles-preset-160gx1 h3) {
  --framer-font-size: var(--evo-h3) !important; font-size: var(--evo-h3) !important; --framer-line-height: 1.3 !important; line-height: 1.3 !important;
}
@media (max-width: 809.98px) { :is(h3.framer-styles-preset-160gx1, .framer-styles-preset-160gx1 h3) { --framer-font-size: var(--evo-h3-sm) !important; font-size: var(--evo-h3-sm) !important; } }
/* numbered titles (Framer list with a title inside): the number stays on the title's first line, also when centred */
ol.framer-styles-preset-160gx1 { --framer-font-size: var(--evo-h3) !important; font-size: var(--evo-h3) !important; }
@media (max-width: 809.98px) { ol.framer-styles-preset-160gx1 { --framer-font-size: var(--evo-h3-sm) !important; font-size: var(--evo-h3-sm) !important; } }
ol.framer-styles-preset-160gx1 > li { padding-left: 0 !important; --framer-line-height: 1.3 !important; line-height: 1.3 !important; }
ol.framer-styles-preset-160gx1 > li::before { position: static !important; display: inline !important; margin-right: .3em; font-size: var(--evo-h3) !important; line-height: 1.3; }
ol.framer-styles-preset-160gx1 > li > h3 { display: inline !important; }
@media (max-width: 809.98px) { ol.framer-styles-preset-160gx1 > li::before { font-size: var(--evo-h3-sm) !important; } }


/* ===== RULE: form box inner space ("the form can breathe", Vincent 2026-10-05) =====
   Every box that holds a form gets the same inner space. Change it HERE ONLY (the two tokens below).
   New form box on a page → add its Framer name to the list. Big picture panels ("Form": e-factura, pias,
   autentificare, pregatire-digitalizare-cnas) already have 50px and their own layout, so they are not listed. */
:root { --evo-form-pad-y: 44px; --evo-form-pad-x: 48px; }
/* phone: careful – several Framer form buttons have a fixed width, so the sides stay at the original 20px */
@media (max-width: 809.98px) { :root { --evo-form-pad-y: 28px; --evo-form-pad-x: 20px; } }
@media (max-width: 809.98px) {
  /* the rotating EVOLVO circle sits in the middle of the box top on phones → the content starts below it */
  [data-framer-name="Creaza Cont"]:has([data-framer-name="130"]) { padding-top: 84px !important; }
  /* submit buttons: Framer gave them a fixed 260px in a narrower holder (pushed right) → centred, never wider than the form */
  form [class*="-container"]:has(> button.framer-D5Axy) { width: 100% !important; display: flex !important; justify-content: center !important; }
  form button.framer-D5Axy { max-width: 100% !important; }
}
:is([data-framer-name="Creaza Cont"], [data-framer-name="Contact Form"], [data-framer-name="form"], [data-framer-name="FORM-nok-napja"]):has(form) {
  padding: var(--evo-form-pad-y) var(--evo-form-pad-x) !important;
}
/* EVO-HERO-TYPE:START (tools/build-hero-type.py) */
@media (max-width:809.98px) { .framer-8ugk79 h1 { --framer-font-size: var(--evo-hero-h1-sm) !important; font-size: var(--evo-hero-h1-sm) !important; --framer-line-height: 1.12 !important; line-height: 1.12 !important; font-weight: 600 !important; } }
@media (min-width:810px) and (max-width:1199.98px) { .framer-8ugk79 h1 { --framer-font-size: var(--evo-hero-h1) !important; font-size: var(--evo-hero-h1) !important; --framer-line-height: 1.12 !important; line-height: 1.12 !important; font-weight: 600 !important; } }
@media (min-width:1200px) { .framer-8ugk79 h1 { --framer-font-size: var(--evo-hero-h1) !important; font-size: var(--evo-hero-h1) !important; --framer-line-height: 1.12 !important; line-height: 1.12 !important; font-weight: 600 !important; } }
/* EVO-HERO-TYPE:END */