@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url('/assets/fonts/InterVariable.woff2') format('woff2-variations'),url('/assets/fonts/InterVariable.woff2') format('woff2');}
:root {
    --brand-primary:#0467fc;
    --brand-primary-hover:#0356d4;
    --brand-accent:#3585fd;--brand-ink:#0467fc;
    --bg: #ffffff;
    --bg-soft: #f6f8fb;
    --bg-elev: #ffffff;
    --text: #0b1220;
    --text-muted: #475569;
    --border: #e5e9f0;
    --shadow: 0 2px 8px rgba(15, 23, 42, 0.04), 0 8px 28px rgba(15, 23, 42, 0.06);
    --shadow-hover: 0 6px 18px rgba(15, 23, 42, 0.08), 0 16px 40px rgba(15, 23, 42, 0.10);
    --radius: 14px;
    --max: 1200px;
    --ease: cubic-bezier(.22,.61,.36,1);
  }
  [data-theme="dark"] {
    --bg: #070d1a;
    --bg-soft: #0c1527;
    --bg-elev: #0f1a30;
    --text: #e6edf7;
    --text-muted: #94a3b8;
    --border: #1b2740;
    --shadow: 0 2px 10px rgba(0,0,0,0.3), 0 10px 32px rgba(0,0,0,0.35);
    --shadow-hover: 0 6px 20px rgba(0,0,0,0.4), 0 20px 48px rgba(0,0,0,0.45);
    --brand-primary:#0467fc;
    --brand-primary-hover:#3585fd;
    --brand-accent:#60a5fa;--brand-ink:#7fb0fb;
  }

  *, *::before, *::after { box-sizing: border-box; }
  html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

  /* Skip,to,content link, vizibil doar la focus */
  .skip-link {
    position: absolute; left: -9999px; top: 0;
    background: var(--brand-primary); color: #fff;
    padding: 10px 18px; border-radius: 0 0 10px 0;
    font-weight: 600; font-size: .92rem; z-index: 1000;
    text-decoration: none;
  }
  .skip-link:focus {
    left: 0; outline: 3px solid var(--brand-accent); outline-offset: 2px;
  }

  /* Focus visible global pentru accesibilitate */
  :focus-visible {
    outline: 2px solid var(--brand-accent);
    outline-offset: 2px;
    border-radius: 4px;
  }
  button:focus-visible, a:focus-visible {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand-accent) 30%, transparent);
  }
  body {
    margin: 0;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
    font-size: 16px; line-height: 1.65;
    color: var(--text); background: var(--bg);
    transition: background .35s var(--ease), color .35s var(--ease);
    -webkit-font-smoothing: antialiased;
  }
  img { max-width: 100%; display: block; }
  a { color: var(--brand-ink); text-decoration: none; transition: color .2s var(--ease); }
  a:hover { color: var(--brand-primary-hover); }
  h1, h2, h3, h4 { line-height: 1.2; letter-spacing: -0.02em; margin: 0 0 .6em; font-weight: 700; }
  h1 { font-size: clamp(2rem, 4.2vw, 3.4rem); font-weight: 800; }
  h2 { font-size: clamp(1.6rem, 2.8vw, 2.2rem); }
  h3 { font-size: 1.2rem; }
  p  { margin: 0 0 1em; color: var(--text-muted); max-width: 65ch; }

  .container { max-width: var(--max); margin: 0 auto; padding: 0 24px; }
  .section { padding: clamp(64px, 10vw, 110px) 0; }
  .eyebrow { display:inline-block; font-size:.78rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color: var(--brand-ink); margin-bottom:14px; }

  /* HEADER */
  .header {
    position: sticky; top: 0; z-index: 100;
    background: color-mix(in srgb, var(--bg) 88%, transparent);
    backdrop-filter: saturate(160%) blur(14px);
    -webkit-backdrop-filter: saturate(160%) blur(14px);
    border-bottom: 1px solid transparent;
    transition: border-color .3s var(--ease), box-shadow .3s var(--ease);
  }
  .header.scrolled { border-bottom-color: var(--border); box-shadow: 0 1px 0 var(--border); }
  .nav { display: flex; align-items: center; justify-content: space-between; height: 72px; gap: 16px; }
  .brand { display:flex; align-items:center; gap:10px; font-weight:800; font-size:1.1rem; color:var(--text); letter-spacing:-0.01em; min-width: 180px; white-space:nowrap; flex-shrink:0;}
  .brand-mark{width:49px;height:34px;flex-shrink:0;object-fit:contain;display:block}
  /* Stabilize the header so it stays fixed when changing language.
     Each nav link reserves enough width for the longest translation across RO/EN/DE/IT. */
  .nav-links { display: flex; align-items: center; gap: 20px; flex-shrink: 0; }
  .nav-links a {
    color: var(--text-muted); font-weight: 500; font-size: .95rem;
    min-width: 96px; text-align: center; white-space: nowrap;
    display: inline-block;
  }
  .nav-links a:hover { color: var(--text); }
  .nav-actions { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
  /* Reserve width for the primary CTA so it does not push other header items around.
     Fits the longest variant across RO/EN/DE/IT: "Richiedi preventivo" (~166px). */
  .nav-actions .btn-primary { min-width: 180px; text-align: center; white-space: nowrap; }

  .icon-btn {
    height: 40px; min-width: 40px;
    display:inline-flex; align-items:center; justify-content:center;
    border: 1px solid var(--border); border-radius: 10px;
    background: var(--bg-elev); color: var(--text-muted);
    cursor: pointer; transition: all .2s var(--ease);
    padding: 0 10px; font: inherit;
  }
  .icon-btn:hover { color: var(--text); border-color: var(--brand-ink); }
  .icon-btn svg { width: 18px; height: 18px; }

  /* Language switcher with flag + dropdown */
  .lang-switcher { position: relative; }
  .lang-btn {
    display:inline-flex; align-items:center; justify-content: center; gap:8px;
    padding: 0 12px; font-weight:700; font-size:.82rem;
    width: 82px; /* width fix (nu min-width) ca să nu sară când schimbi limba */
  }
  .lang-btn .flag {
    width: 22px; height: 16px; border-radius: 3px; overflow: hidden;
    display:inline-block; flex-shrink: 0;
    box-shadow: 0 0 0 1px rgba(0,0,0,.08) inset;
    transition: transform .35s var(--ease), opacity .35s var(--ease);
  }
  .lang-btn:hover .flag { transform: scale(1.08); }
  .lang-btn .flag svg { width:100%; height:100%; display:block; }
  .lang-btn .lang-code { letter-spacing:.06em; min-width: 22px; text-align: left; }
  .lang-btn.switching .flag { opacity: 0; transform: rotateY(90deg); }
  .lang-btn .chev { width: 10px; height: 10px; opacity: .6; transition: transform .2s; }
  .lang-switcher.open .lang-btn .chev { transform: rotate(180deg); }
  .lang-menu {
    position: absolute; top: calc(100% + 6px); right: 0;
    background: var(--bg-elev); border: 1px solid var(--border); border-radius: 10px;
    box-shadow: var(--shadow-hover); padding: 6px; min-width: 160px;
    opacity: 0; visibility: hidden; transform: translateY(-6px);
    transition: opacity .18s var(--ease), transform .18s var(--ease), visibility .18s;
    z-index: 110;
  }
  .lang-switcher.open .lang-menu { opacity: 1; visibility: visible; transform: translateY(0); }
  .lang-menu a, .lang-menu button {
    display: flex; align-items: center; gap: 10px; width: 100%;
    padding: 9px 12px; border: 0; background: transparent;
    border-radius: 7px; font: inherit; font-size: .88rem; color: var(--text);
    cursor: pointer; text-decoration: none; text-align: left;
  }
  .lang-menu a:hover, .lang-menu button:hover { background: var(--bg-soft); text-decoration: none; }
  .lang-menu .flag { width: 20px; height: 14px; border-radius: 3px; overflow: hidden; box-shadow: 0 0 0 1px rgba(0,0,0,.08) inset; flex-shrink: 0; }
  .lang-menu .flag svg { width: 100%; height: 100%; display: block; }
  .lang-menu .lang-name { flex: 1; font-weight: 500; }
  .lang-menu .check { color: var(--brand-ink); opacity: 0; font-size: .9rem; }
  .lang-menu .active .check { opacity: 1; }
  .lang-menu .active { background: color-mix(in srgb, var(--brand-accent) 8%, transparent); }

  .btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    padding: 12px 22px; border-radius: 10px;
    font-weight: 600; font-size: .95rem; cursor: pointer;
    transition: all .2s var(--ease); border: 1px solid transparent;
    white-space: nowrap;
  }
  .btn-primary {
    background: var(--brand-primary); color: #fff;
    box-shadow: 0 4px 14px color-mix(in srgb, var(--brand-primary) 35%, transparent);
  }
  .btn-primary:hover { background: var(--brand-primary-hover); color:#fff; transform: translateY(-1px); box-shadow: 0 8px 22px color-mix(in srgb, var(--brand-primary) 50%, transparent); }
  .btn-secondary { background: transparent; color: var(--text); border-color: var(--border); }
  .btn-secondary:hover { border-color: var(--brand-ink); color: var(--brand-ink); }
  .burger { display: none; }

  /* HERO */
  .hero { position: relative; overflow: hidden; padding: clamp(80px, 12vw, 140px) 0 clamp(64px, 10vw, 110px); }
  .hero::before {
    content:""; position:absolute; inset:0; z-index:-1;
    background:
      radial-gradient(1000px 500px at 85% -10%, color-mix(in srgb, var(--brand-accent) 18%, transparent), transparent 60%),
      radial-gradient(900px 600px at -10% 110%, color-mix(in srgb, var(--brand-primary) 14%, transparent), transparent 60%);
  }
  .hero-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 60px; align-items: center; }
  .hero h1 strong { background: linear-gradient(135deg, var(--brand-primary), var(--brand-accent)); -webkit-background-clip: text; background-clip: text; color: transparent; }
  .hero p.lead { font-size: 1.14rem; color: var(--text-muted); max-width: 55ch; }
  .hero-cta { display:flex; flex-wrap:wrap; gap:14px; margin-top:32px; }
  .hero-visual {
    position: relative; aspect-ratio: 4/5; border-radius: 24px; overflow: hidden;
    background: linear-gradient(135deg, var(--bg-soft), var(--bg-elev));
    border: 1px solid var(--border); box-shadow: var(--shadow);
  }
  .hero-visual svg { width:100%; height:100%; display:block; }

  /* TRUST BAR */
  .trust { background: var(--bg-soft); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); padding: 36px 0; }
  .trust-grid { display:grid; grid-template-columns: repeat(4, 1fr); gap: 28px; }
  .trust-item { display:flex; align-items:center; gap:14px; }
  .trust-icon {
    flex:0 0 42px; width:42px; height:42px; border-radius:10px;
    background: color-mix(in srgb, var(--brand-accent) 12%, transparent);
    color: var(--brand-ink); display:grid; place-items:center;
  }
  .trust-icon svg { width:20px; height:20px; }
  .trust-item strong { display:block; color:var(--text); font-size:.95rem; }
  .trust-item span { color: var(--text-muted); font-size:.85rem; }

  .section-head { text-align:center; max-width: 720px; margin: 0 auto 56px; }
  .section-head p { margin: 0 auto; }

  /* SERVICES */
  .services-grid { display:grid; grid-template-columns: repeat(3, 1fr); gap:22px; }
  .service-card {
    position: relative; padding: 28px;
    border: 1px solid var(--border); border-radius: var(--radius);
    background: var(--bg-elev); transition: all .25s var(--ease); overflow: hidden;
  }
  .service-card::before {
    content:""; position:absolute; left:0; top:0; height:3px; width:0%;
    background: linear-gradient(90deg, var(--brand-primary), var(--brand-accent));
    transition: width .35s var(--ease);
  }
  .service-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-hover); border-color: color-mix(in srgb, var(--brand-accent) 40%, var(--border)); }
  .service-card:hover::before { width: 100%; }
  .service-icon {
    width: 46px; height: 46px; border-radius: 12px;
    background: color-mix(in srgb, var(--brand-accent) 10%, transparent);
    color: var(--brand-ink); display:grid; place-items:center; margin-bottom:18px;
  }
  .service-icon svg { width:22px; height:22px; }
  .service-card h3 { margin-bottom: 10px; color: var(--text); }
  .service-card p { font-size: .94rem; margin: 0; }
  .service-link { display:inline-flex; align-items:center; gap:6px; margin-top:16px; font-size:.88rem; font-weight:600; color: var(--brand-ink); }

  /* WHY */
  .why { background: var(--bg-soft); }
  .why-grid { display:grid; grid-template-columns: repeat(3, 1fr); gap:24px; }
  .why-item { padding: 24px; background: var(--bg-elev); border: 1px solid var(--border); border-radius: var(--radius); }
  .why-item h3 { font-size: 1.05rem; display:flex; gap:10px; align-items:center; }
  .why-item h3 svg { width:20px; height:20px; color: var(--brand-ink); flex-shrink:0; }
  .why-item p { font-size: .92rem; margin: 8px 0 0; }

  /* PROCESS */
  .process-grid { display:grid; grid-template-columns: repeat(4, 1fr); gap:20px; counter-reset: step; }
  .process-step { padding: 26px 22px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--bg-elev); position: relative; }
  .process-step::before {
    counter-increment: step; content: "0" counter(step);
    display:block; font-size:.82rem; font-weight:800; letter-spacing:.12em;
    color: var(--brand-ink); margin-bottom:10px;
  }
  .process-step h3 { font-size: 1.02rem; margin-bottom: 6px; }
  .process-step p { font-size: .9rem; margin: 0; }

  /* FLEET */
  .fleet { background: var(--bg-soft); }
  .fleet-grid { display:grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
  .fleet-card { padding: 22px; background: var(--bg-elev); border:1px solid var(--border); border-radius: var(--radius); text-align:center; transition: all .2s var(--ease); }
  .fleet-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
  .fleet-icon { margin: 0 auto 12px; width:46px; height:46px; color: var(--brand-ink); }
  .fleet-card h3, .fleet-card h4 { margin: 0 0 4px; font-size:.95rem; font-weight:700; color: var(--text); }
  .fleet-card span { font-size:.82rem; color: var(--text-muted); }

  /* FAQ */
  .faq-grid { max-width: 860px; margin: 0 auto; }
  details.faq-item {
    border: 1px solid var(--border); border-radius: var(--radius);
    background: var(--bg-elev); padding: 18px 22px; margin-bottom: 12px;
    transition: all .2s var(--ease);
  }
  details.faq-item[open] { border-color: color-mix(in srgb, var(--brand-accent) 50%, var(--border)); box-shadow: var(--shadow); }
  details.faq-item summary {
    font-weight: 600; cursor: pointer; color: var(--text);
    display:flex; justify-content:space-between; align-items:center; gap:14px;
    list-style: none; font-size: 1.02rem;
  }
  details.faq-item summary::-webkit-details-marker { display:none; }
  details.faq-item summary::after {
    content: "+"; font-weight: 400; font-size: 1.5rem; color: var(--brand-ink);
    transition: transform .25s var(--ease);
  }
  details.faq-item[open] summary::after { content: "−"; }
  details.faq-item p { margin: 14px 0 0; font-size: .96rem; }

  /* CTA */
  .cta-final {
    background: linear-gradient(135deg, var(--brand-primary) 0%, #1e3a8a 100%);
    color: #fff; padding: 72px 0; text-align:center;
    position: relative; overflow:hidden;
  }
  .cta-final::before { content:""; position: absolute; inset:0;
    background: radial-gradient(700px 400px at 80% 20%, rgba(255,255,255,0.14), transparent 60%); }
  .cta-final > * { position: relative; z-index:1; }
  .cta-final h2 { color:#fff; }
  .cta-final p { color: #cfe0ff; max-width: 640px; margin: 0 auto 28px; }
  .cta-final .btn-primary { background:#fff; color:var(--brand-primary); box-shadow: 0 10px 30px rgba(0,0,0,0.2); }
  .cta-final .btn-primary:hover { background:#f1f5f9; color: var(--brand-primary); }
  .cta-final .btn-secondary { color:#fff; border-color: rgba(255,255,255,0.3); background: transparent; }
  .cta-final .btn-secondary:hover { border-color:#fff; color:#fff; background: rgba(255,255,255,0.08); }
  .cta-final-btns { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }

  /* CONTACT */
  .contact-grid { display:grid; grid-template-columns: 1fr 1fr; gap: 42px; align-items:start; }
  .contact-info .info-block { margin-bottom: 20px; padding: 18px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--bg-elev); display:flex; gap:14px; align-items:center; }
  .contact-info .info-block .ic {
    width: 42px; height:42px; flex-shrink:0;
    background: color-mix(in srgb, var(--brand-accent) 12%, transparent);
    color: var(--brand-ink); border-radius: 10px; display:grid; place-items:center;
  }
  .contact-info .info-block .ic svg { width:20px; height:20px; }
  .contact-info .info-block strong { display:block; color: var(--text); font-size:.85rem; margin-bottom:2px; }
  .contact-info .info-block a, .contact-info .info-block span { color: var(--text-muted); font-size:.95rem; }
  .contact-info .info-block a:hover { color: var(--brand-ink); }
  .form { padding: 32px; background: var(--bg-elev); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); }
  .form .row { display:grid; grid-template-columns: 1fr 1fr; gap: 14px; }
  .field { margin-bottom: 14px; }
  .field label { display:block; margin-bottom: 6px; font-size:.86rem; font-weight:600; color: var(--text); }
  .field input, .field select, .field textarea {
    width: 100%; padding: 12px 14px;
    border: 1px solid var(--border); border-radius: 10px;
    background: var(--bg); color: var(--text);
    font: inherit; font-size: .95rem;
    transition: border-color .2s var(--ease), box-shadow .2s var(--ease);
  }
  .field input:focus, .field select:focus, .field textarea:focus {
    outline: none; border-color: var(--brand-ink);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand-accent) 18%, transparent);
  }
  .field textarea { min-height: 110px; resize: vertical; }
  /* LIVE COUNTER */
  .counter-section { background: linear-gradient(135deg, var(--brand-primary), var(--brand-accent)); color: #fff; padding: 56px 0; }
  .counter-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; text-align: center; }
  @media (max-width: 720px) { .counter-grid { grid-template-columns: repeat(2, 1fr); gap: 24px; } }
  .counter-item .cnum { font-size: clamp(2rem, 5vw, 3.4rem); font-weight: 800; letter-spacing: -.03em; display: block; line-height: 1; margin-bottom: 8px; }
  .counter-item .clabel { font-size: .82rem; font-weight: 600; text-transform: uppercase; letter-spacing: .12em; opacity: .9; }

  /* TESTIMONIAL SLIDER */
  .test-section {
    padding: 100px 0;
    background: linear-gradient(180deg, var(--bg) 0%, var(--bg-soft) 50%, var(--bg) 100%);
    position: relative;
  }
  /* soft separators top + bottom for a smoother transition from preceding/following sections */
  .test-section::before, .test-section::after {
    content: ''; position: absolute; left: 50%; transform: translateX(-50%);
    width: 80px; height: 3px; border-radius: 3px;
    background: linear-gradient(90deg, transparent, var(--brand-accent), transparent);
    opacity: .35;
  }
  .test-section::before { top: 36px; }
  .test-section::after { bottom: 36px; }

  .test-slider {
    position: relative;
    max-width: 760px;
    margin: 40px auto 0;
    min-height: 280px;          /* prevents layout jump as slides change */
  }

  /* Stack slides on top of each other, only opacity controls visibility for smooth crossfade */
  .test-slide {
    position: absolute; inset: 0;
    padding: 44px 56px;
    background: var(--bg-elev);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    text-align: center;
    box-shadow: var(--shadow);
    opacity: 0; visibility: hidden;
    transform: translateY(8px) scale(.98);
    transition: opacity .55s var(--ease), transform .55s var(--ease), visibility .55s;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
  }
  .test-slide.active {
    opacity: 1; visibility: visible;
    transform: translateY(0) scale(1);
    z-index: 2;
  }

  /* Center quote + person block within the slide */
  .test-slide .quote {
    font-size: 1.18rem;
    line-height: 1.7;
    color: var(--text);
    margin: 0 auto 24px;
    font-style: italic;
    max-width: 600px;
    text-align: center;
  }
  .test-slide .quote::before, .test-slide .quote::after {
    content: '"';
    color: var(--brand-ink);
    font-size: 1.5em;
    font-weight: 800;
    line-height: 0;
    vertical-align: -0.1em;
  }
  .test-slide .person {
    display: flex; align-items: center; justify-content: center; gap: 14px;
    margin: 0 auto;
  }
  .test-slide .avatar {
    width: 52px; height: 52px; border-radius: 50%;
    background: linear-gradient(135deg, var(--brand-primary), var(--brand-accent));
    color: #fff; display: grid; place-items: center;
    font-weight: 800; font-size: 1.1rem;
    flex-shrink: 0;
  }
  /* Person meta block: centered as a column so name and role are visually balanced */
  .test-slide .meta { text-align: center; }
  .test-slide .name { font-weight: 700; color: var(--text); font-size: .95rem; }
  .test-slide .role { font-size: .82rem; color: var(--text-muted); }

  .test-dots { display: flex; justify-content: center; gap: 10px; margin-top: 32px; }
  .test-dot {
    width: 9px; height: 9px; border-radius: 50%;
    background: var(--border); border: 0; cursor: pointer; padding: 0;
    transition: background .25s var(--ease), transform .25s var(--ease), width .25s var(--ease);
  }
  .test-dot.active {
    background: var(--brand-primary);
    width: 28px; border-radius: 6px;
  }
  .test-arrows {
    position: absolute; top: 50%; transform: translateY(-50%);
    width: 100%; display: flex; justify-content: space-between;
    pointer-events: none;
    padding: 0;
    z-index: 10;                /* above slides so arrows stay clickable */
  }
  .test-arrow {
    width: 44px; height: 44px; border-radius: 50%;
    background: var(--bg-elev); border: 1px solid var(--border);
    cursor: pointer; pointer-events: auto;
    display: grid; place-items: center;
    color: var(--text); font-weight: 700; font-size: 1.2rem;
    box-shadow: 0 4px 16px rgba(0,0,0,.12);
    transition: background .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease), transform .2s var(--ease), box-shadow .2s var(--ease);
    position: relative; z-index: 11;
  }
  .test-arrow:hover { background: var(--brand-primary); color: #fff; border-color: var(--brand-primary); transform: scale(1.08); }
  .test-arrow.prev { margin-left: -22px; }
  .test-arrow.next { margin-right: -22px; }
  @media (max-width: 720px) {
    .test-arrow { display: none; }
    .test-slide { padding: 32px 24px; }
    .test-slider { min-height: 340px; }
  }

  /* LOGO CLOUD */
  .logos-section { padding: 56px 0; border-top: 1px solid var(--border); }
  .logos-head { text-align: center; margin-bottom: 28px; }
  .logos-head h3 { font-size: .82rem; font-weight: 700; text-transform: uppercase; letter-spacing: .14em; color: var(--text-muted); margin: 0; }
  .logos-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 24px; align-items: center; max-width: 960px; margin: 0 auto; }
  @media (max-width: 720px) { .logos-grid { grid-template-columns: repeat(3, 1fr); gap: 18px; } }
  .logo-item { background: var(--bg-soft); border: 1px solid var(--border); border-radius: 10px; height: 64px; display: grid; place-items: center; font-weight: 700; color: var(--text-muted); font-size: .82rem; text-align: center; letter-spacing: .04em; transition: transform .15s, color .15s; padding: 0 8px; }
  .logo-item:hover { transform: translateY(-2px); color: var(--text); border-color: var(--brand-ink); }

  /* MULTI-STEP FORM */
  .form-progress { display: flex; gap: 8px; margin-bottom: 22px; padding-bottom: 14px; border-bottom: 1px solid var(--border); }
  .form-progress .pstep { flex: 1; display: flex; align-items: center; gap: 8px; font-size: .78rem; font-weight: 600; color: var(--text-muted); padding: 6px 0; position: relative; }
  .form-progress .pstep .pnum { width: 24px; height: 24px; border-radius: 50%; background: var(--bg-soft); border: 1.5px solid var(--border); display: grid; place-items: center; font-size: .75rem; font-weight: 700; flex-shrink: 0; transition: all .2s; }
  .form-progress .pstep.active { color: var(--brand-ink); }
  .form-progress .pstep.active .pnum { background: var(--brand-primary); color: #fff; border-color: var(--brand-primary); }
  .form-progress .pstep.done .pnum { background: #10b981; color: #fff; border-color: #10b981; }
  .form-progress .pstep.done .pnum::after { content: "✓"; font-size: .7rem; }
  .form-progress .pstep.done .pnum span { display: none; }
  .form-progress .pstep::after { content: ""; flex: 1; height: 2px; background: var(--border); margin-left: 4px; }
  .form-progress .pstep:last-child::after { display: none; }
  .form-progress .pstep.done::after { background: #10b981; }
  .form-step { display: none; animation: fadeIn .25s ease; }
  .form-step.active { display: block; }
  @keyframes fadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
  .form-nav { display: flex; justify-content: space-between; gap: 12px; margin-top: 18px; }
  .form-nav .btn { flex: 1; }
  .form-nav .btn-secondary-soft { background: var(--bg-soft); color: var(--text); border: 1px solid var(--border); }
  .form-nav .btn-secondary-soft:hover { background: var(--bg); border-color: var(--brand-ink); }
  .form-draft-banner { padding: 10px 14px; background: color-mix(in srgb, var(--brand-accent) 8%, var(--bg-soft)); border: 1px solid color-mix(in srgb, var(--brand-accent) 30%, var(--border)); border-radius: 8px; margin-bottom: 16px; font-size: .85rem; display: flex; gap: 12px; align-items: center; }
  .form-draft-banner button { background: transparent; border: 0; color: var(--brand-primary); font-weight: 700; cursor: pointer; padding: 4px 8px; border-radius: 4px; }
  .form-draft-banner button:hover { background: var(--bg); }

  .consent-field { display: flex; align-items: flex-start; gap: 10px; margin: 6px 0 18px; font-size: .88rem; line-height: 1.5; color: var(--text-muted); }
  .consent-field input[type="checkbox"] { width: 18px; height: 18px; margin: 2px 0 0; flex-shrink: 0; accent-color: var(--brand-primary); cursor: pointer; }
  .consent-field label { font-weight: 400; color: var(--text-muted); cursor: pointer; }
  .consent-field a { color: var(--brand-ink); text-decoration: underline; }
  .consent-field.error { color: #dc2626; }
  .consent-field.error a { color: #dc2626; }
  [data-theme="dark"] .consent-field.error { color: #fca5a5; }

  /* FOOTER */
  footer { background: var(--bg-soft); border-top: 1px solid var(--border); padding: 56px 0 24px; }
  .foot-grid { display:grid; grid-template-columns: 1.6fr 1fr 1fr 1fr 1fr; gap: 32px; margin-bottom: 36px; }
  .foot-grid h2, .foot-grid h3, .foot-grid h4 { font-size: .82rem; font-weight:700; letter-spacing:.12em; text-transform: uppercase; color: var(--text); margin-bottom: 14px; }
  .foot-grid ul { list-style:none; padding:0; margin:0; }
  .foot-grid li { margin-bottom: 8px; }
  .foot-grid a { color: var(--text-muted); font-size:.92rem; }
  .foot-grid a:hover { color: var(--brand-ink); }
  .foot-about p { font-size:.92rem; max-width: 340px; }
  .foot-bottom { border-top: 1px solid var(--border); padding-top:18px; display:flex; justify-content:space-between; align-items:center; gap:14px; font-size:.85rem; color: var(--text-muted); flex-wrap:wrap; }

  /* REVEAL */
  .reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s var(--ease), transform .7s var(--ease); }
  .reveal.in { opacity: 1; transform: translateY(0); }

  /* WHATSAPP FLOATING BUTTON */
  .wa-fab { position: fixed; bottom: 22px; right: 22px; width: 58px; height: 58px; border-radius: 50%; background: #25D366; display: grid; place-items: center; box-shadow: 0 6px 22px rgba(37, 211, 102, 0.45); z-index: 90; transition: transform .2s, box-shadow .2s; cursor: pointer; }
  .wa-fab:hover { transform: scale(1.08); box-shadow: 0 8px 28px rgba(37, 211, 102, 0.55); }
  .wa-fab svg { width: 30px; height: 30px; fill: #fff; }
  .wa-fab::after { content: ""; position: absolute; inset: -4px; border-radius: 50%; border: 2px solid #25D366; opacity: .6; animation: wa-pulse 2.4s ease-out infinite; }
  @keyframes wa-pulse { 0% { transform: scale(1); opacity: .7; } 100% { transform: scale(1.4); opacity: 0; } }
  @media (max-width: 480px) { .wa-fab { width: 52px; height: 52px; bottom: 16px; right: 16px; } .wa-fab svg { width: 26px; height: 26px; } }

  /* EXIT INTENT POPUP */
  .exit-popup-overlay { position: fixed; inset: 0; background: rgba(7,13,26,.6); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); z-index: 200; display: none; align-items: center; justify-content: center; padding: 20px; opacity: 0; transition: opacity .25s; }
  .exit-popup-overlay.visible { display: flex; opacity: 1; }
  .exit-popup { background: var(--bg-elev); border: 1px solid var(--border); border-radius: var(--radius); padding: 36px; max-width: 480px; width: 100%; box-shadow: var(--shadow-hover); position: relative; transform: scale(.94); transition: transform .25s var(--ease); }
  .exit-popup-overlay.visible .exit-popup { transform: scale(1); }
  .exit-popup h3 { margin: 0 0 8px; font-size: 1.4rem; }
  .exit-popup p { color: var(--text-muted); margin: 0 0 20px; }
  .exit-popup .close { position: absolute; top: 14px; right: 14px; background: transparent; border: 0; cursor: pointer; color: var(--text-muted); font-size: 1.4rem; padding: 4px 8px; }
  .exit-popup .close:hover { color: var(--text); }

  /* NEWSLETTER */
  .newsletter { background: var(--bg); border: 1px solid var(--border); border-radius: 10px; padding: 14px; display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap; }
  .newsletter input { flex: 1; min-width: 160px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-soft); color: var(--text); font-size: .9rem; }
  .newsletter button { background: var(--brand-primary); color: #fff; padding: 10px 16px; border-radius: 8px; border: 0; font-weight: 600; font-size: .9rem; cursor: pointer; }
  .newsletter button:hover { background: var(--brand-accent); }
  .newsletter-msg { font-size: .82rem; color: var(--text-muted); margin-top: 8px; }
  .newsletter-msg.success { color: #10b981; }
  .newsletter-msg.error { color: #ef4444; }

  /* TRUST BADGES */
  .trust-badges { display: flex; gap: 14px; flex-wrap: wrap; align-items: center; justify-content: center; margin: 28px 0 8px; padding-top: 22px; border-top: 1px solid var(--border); }
  .trust-badge { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; background: var(--bg-soft); border: 1px solid var(--border); border-radius: 999px; font-size: .82rem; font-weight: 600; color: var(--text-muted); }
  .trust-badge svg { width: 16px; height: 16px; stroke: var(--brand-accent); }

  /* CALENDLY CTA */
  .calendly-cta { display: inline-flex; align-items: center; gap: 8px; background: transparent; color: var(--brand-ink); border: 1px solid var(--brand-accent); padding: 10px 20px; border-radius: 10px; font-weight: 600; font-size: .92rem; }
  .calendly-cta:hover { background: var(--brand-accent); color: #fff; text-decoration: none; }
  .calendly-cta svg { width: 16px; height: 16px; }

  /* Sticky mobile CTA, apare dupa ce hero-ul iese din ecran */
  .mobile-cta { position: fixed; left: 0; right: 0; bottom: 0; z-index: 900;
    display: none; gap: 10px; padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
    background: color-mix(in srgb, var(--bg) 92%, transparent);
    backdrop-filter: blur(10px); border-top: 1px solid var(--border);
    transform: translateY(110%); transition: transform .25s var(--ease); }
  .mobile-cta.is-visible { transform: none; }
  .mobile-cta .btn { flex: 1; justify-content: center; padding: 12px 14px; font-size: .92rem; }
  @media (max-width: 860px) { .mobile-cta { display: flex; } body { padding-bottom: 4px; } }
  @media (prefers-reduced-motion: reduce) { .mobile-cta { transition: none; } }

  /* 5.5 blocurile lungi de text nu se centreaza pe desktop */
  .section-head p { max-width: 62ch; }
  @media (min-width: 861px) { .section-head p { margin-inline: auto; text-align: left; } }

  /* RESPONSIVE */
  @media (max-width: 960px) {
    .hero-grid { grid-template-columns: 1fr; gap: 36px; }
    .hero-visual { max-width: 520px; width: 100%; margin-inline: auto; }
    .services-grid, .why-grid { grid-template-columns: repeat(2, 1fr); }
    .process-grid, .fleet-grid { grid-template-columns: repeat(2, 1fr); }
    .trust-grid { grid-template-columns: repeat(2, 1fr); }
    .contact-grid { grid-template-columns: 1fr; }
    .foot-grid { grid-template-columns: 1fr 1fr; }
    .nav-links { display:none; }
    .burger { display:inline-flex; }
    .nav-actions .btn { display: none; }
  }
  @media (max-width: 560px) {
    .services-grid, .why-grid { grid-template-columns: 1fr; }
    .process-grid, .fleet-grid, .trust-grid { grid-template-columns: 1fr; }
    .form .row { grid-template-columns: 1fr; }
    .foot-grid { grid-template-columns: 1fr; }
    .nav { height: 64px; padding-inline: 4px; } /* nav side padding */
    .brand span.brand-name { display:none; }
    .icon-btn { height: 38px; min-width: 38px; }
    .hero { padding-top: 60px; padding-bottom: 48px; }
  }

  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
    .reveal { opacity:1; transform:none; }
  }

  .mobile-menu {
    position: fixed; inset: 0; background: var(--bg);
    z-index: 200; padding: 24px; display:none; flex-direction: column;
    transform: translateX(100%); transition: transform .35s var(--ease);
  }
  .mobile-menu.open { transform: translateX(0); }
  .mobile-menu .mm-top { display:flex; justify-content:space-between; align-items:center; margin-bottom: 30px; }
  .mobile-menu nav { display:flex; flex-direction:column; gap: 8px; }
  .mobile-menu nav a { padding: 14px 4px; color: var(--text); font-weight: 600; font-size:1.1rem; border-bottom: 1px solid var(--border); }
  .mobile-menu .mm-actions { display:flex; gap:10px; margin-top:auto; padding-top:20px; }
  .mobile-menu .mm-actions .btn { flex:1; }
  @media (max-width: 960px) { .mobile-menu { display: flex; } }

  /* ============ COOKIE CONSENT BANNER ============ */
  .cc-banner {
    position: fixed; left: 20px; right: 20px; bottom: 20px;
    z-index: 300;
    background: var(--bg-elev);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 20px 22px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.18), 0 4px 12px rgba(0,0,0,0.08);
    display: flex; align-items: center; gap: 18px;
    max-width: 880px; margin: 0 auto;
    transform: translateY(140%);
    transition: transform .45s var(--ease), opacity .35s var(--ease);
    opacity: 0;
  }
  .cc-banner.visible { transform: translateY(0); opacity: 1; }
  .cc-icon {
    flex-shrink: 0; width: 40px; height: 40px; border-radius: 10px;
    background: color-mix(in srgb, var(--brand-accent) 14%, transparent);
    color: var(--brand-ink);
    display: grid; place-items: center;
  }
  .cc-icon svg { width: 20px; height: 20px; }
  .cc-text { flex: 1; min-width: 0; }
  .cc-text p { margin: 0; font-size: .9rem; color: var(--text-muted); line-height: 1.55; }
  .cc-text strong { color: var(--text); display: block; margin-bottom: 2px; font-size: .92rem; }
  .cc-text a { color: var(--brand-ink); }
  .cc-actions { display: flex; gap: 10px; flex-shrink: 0; }
  .cc-btn {
    padding: 10px 18px; border-radius: 8px; cursor: pointer;
    font: inherit; font-size: .88rem; font-weight: 600;
    border: 1px solid transparent; white-space: nowrap;
    transition: all .18s var(--ease);
  }
  .cc-btn-primary { background: var(--brand-primary); color: #fff; }
  .cc-btn-primary:hover { background: var(--brand-primary-hover); }
  .cc-btn-secondary { background: transparent; color: var(--text); border-color: var(--border); }
  .cc-btn-secondary:hover { border-color: var(--brand-ink); color: var(--brand-ink); }

  @media (max-width: 720px) {
    .cc-banner { flex-direction: column; align-items: stretch; padding: 18px; gap: 14px; }
    .cc-icon { display: none; }
    .cc-actions { flex-direction: row; }
    .cc-actions .cc-btn { flex: 1; }
  }

  /* ============ LIVE FLEET MAP (Leaflet) ============ */
  .hero-visual { padding: 0; background: var(--bg-soft); }
  #harta {
    position: absolute; inset: 0;
    z-index: 1;
    border-radius: 24px;
    background: var(--bg-soft);
  }
  /* OSM dark treatment: OSM ships no dark basemap, so recolour the raster */
  [data-theme="dark"] #harta .leaflet-tile-pane {
    filter: invert(1) hue-rotate(185deg) brightness(.92) contrast(.88) saturate(.7);
  }
  #harta .leaflet-control-attribution {
    font-size: 9px;
    background: rgba(255,255,255,0.82);
    color: #64748b;
    padding: 2px 6px;
    margin: 0 0 4px 4px !important;
    border-radius: 4px;
  }
  [data-theme="dark"] #harta .leaflet-control-attribution {
    background: rgba(15,26,48,0.85);
    color: #94a3b8;
  }
  #harta .leaflet-control-attribution a { color: inherit; }

  .map-overlay {
    position: absolute;
    z-index: 10;
    pointer-events: none;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
  }
  .map-overlay.pill {
    background: rgba(255,255,255,0.92);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-radius: 10px;
    padding: 8px 12px;
    box-shadow: 0 4px 14px rgba(15,23,42,0.08);
  }
  [data-theme="dark"] .map-overlay.pill {
    background: rgba(15,26,48,0.88);
    color: var(--text);
  }

  .map-title { top: 14px; left: 14px; }
  .map-title-label { font-size: 11px; font-weight: 800; color: #64748b; letter-spacing: 0.16em; }
  .map-title-sub { font-size: 10px; font-weight: 700; color: #94a3b8; letter-spacing: 0.12em; margin-top: 2px; }

  .map-live { top: 14px; right: 14px; display: flex; align-items: center; gap: 7px; border-radius: 20px; }
  .map-live-dot { width: 8px; height: 8px; border-radius: 50%; background: #22c55e; position: relative; }
  .map-live-dot::after {
    content: ''; position: absolute; inset: -2px; border-radius: 50%;
    background: #22c55e; opacity: 0.5; animation: livePulse 1.8s infinite;
  }
  @keyframes livePulse {
    0% { transform: scale(1); opacity: 0.5; }
    100% { transform: scale(2.4); opacity: 0; }
  }
  .map-live-label { font-size: 11px; font-weight: 800; color: #15803d; letter-spacing: 0.1em; }
  [data-theme="dark"] .map-live-label { color: #4ade80; }

  .map-legend { top: 56px; right: 14px; padding: 10px 12px; min-width: 110px; }
  .map-legend-title { font-size: 11px; font-weight: 800; color: #64748b; letter-spacing: 0.16em; margin-bottom: 8px; }
  .map-legend-item { display: flex; align-items: center; gap: 7px; font-size: 11px; font-weight: 600; color: #334155; margin-bottom: 5px; }
  [data-theme="dark"] .map-legend-item { color: #cbd5e1; }
  .map-legend-item:last-child { margin-bottom: 0; }
  .map-legend-dot { width: 14px; height: 14px; border-radius: 50%; flex-shrink: 0; position: relative; display:grid; place-items:center; color:#fff; font-size:9px; font-weight:900; }

  .map-info-card {
    bottom: 14px; left: 14px; right: 14px;
    padding: 12px 14px;
    border-radius: 10px;
    pointer-events: none;
    background: rgba(255,255,255,0.95);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 4px 16px rgba(15,23,42,0.1);
    border-left: 4px solid var(--brand-primary);
  }
  [data-theme="dark"] .map-info-card { background: rgba(15,26,48,0.92); }
  .map-info-row { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; flex-wrap: wrap; }
  .map-info-id {
    font-size: 11px; font-weight: 800;
    background: color-mix(in srgb, var(--brand-primary) 12%, transparent);
    color: var(--brand-primary);
    padding: 3px 8px; border-radius: 4px;
    letter-spacing: 0.06em;
  }
  .map-info-type {
    font-size: 9px; font-weight: 700;
    color: #ffffff;
    padding: 3px 8px; border-radius: 4px;
    letter-spacing: 0.08em;
  }
  .map-info-status { display: flex; align-items: center; gap: 5px; font-size: 10px; font-weight: 700; color: #15803d; }
  .map-info-status::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: #22c55e; }
  .map-info-route { font-size: 11px; font-weight: 700; color: var(--text); margin-bottom: 2px; }
  .map-info-meta { font-size: 10px; font-weight: 600; color: var(--text-muted); display:flex; justify-content:space-between; align-items:center; gap: 10px; }
  .map-info-progress { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
  .map-info-progress-bar { width: 60px; height: 3px; background: var(--border); border-radius: 2px; overflow: hidden; }
  .map-info-progress-fill { height: 100%; background: var(--brand-accent); border-radius: 2px; transition: width .4s ease; }
  .map-info-progress-text { font-size: 8px; font-weight: 800; color: var(--text-muted); letter-spacing: 0.08em; }

  /* Truck markers (DivIcons) */
  .truck-marker-icon { background: transparent !important; border: none !important; }
  .truck-marker {
    width: 100%; height: 100%;
    border-radius: 50%;
    display: grid; place-items: center;
    color: white; font-weight: 900;
    border: 2.5px solid white;
    box-shadow: 0 3px 10px rgba(0,0,0,0.3);
    position: relative;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
  }
  .truck-marker::before {
    content: '';
    position: absolute; inset: -4px;
    border-radius: 50%;
    background: inherit;
    opacity: 0.45;
    animation: truckPulse 2.4s ease-out infinite;
    z-index: -1;
  }
  .truck-marker.active { border-width: 3px; box-shadow: 0 4px 14px rgba(0,0,0,0.35); }
  .truck-marker.active::before { animation-duration: 1.8s; opacity: 0.55; }
  @keyframes truckPulse {
    0%   { transform: scale(1);   opacity: 0.5; }
    100% { transform: scale(2.4); opacity: 0; }
  }

  /* Hide legend on narrow hero for mobile */
  @media (max-width: 560px) {
    .map-legend { display: none; }
    .map-title { top: 10px; left: 10px; padding: 6px 10px; }
    .map-live { top: 10px; right: 10px; }
    .map-info-card { bottom: 10px; left: 10px; right: 10px; padding: 10px 12px; }
  }

/* 6.2: headerul depasea viewportul pe mobil: brand 180px + actiuni 182px > latimea navului,
   asa ca butonul de meniu iesea 16px in afara ecranului. */
.nav { min-width: 0; }
.nav .brand { min-width: 0; flex-shrink: 1; white-space:nowrap;}
.nav-actions { flex-shrink: 0; }
@media (max-width: 560px) {
  .nav { gap: 8px; padding-inline: 0; }
  .nav .brand-name { display: none; }
  .nav-actions { gap: 6px; }
  .lang-switcher .lang-code { display: none; }
  .lang-switcher .chev { display: none; }
}

/* 11.1: ultimele combinatii sub AA, dupa masuratori pe pagina reala:
   #059669 pe alb = 3.77:1, pe chip = 3.37:1  ->  #047857 = 5.48 / 4.91
   #d97706 pe alb = 3.19:1, pe chip = 2.90:1  ->  #b45309 = 5.02 / 4.58
   #15803d si #2563eb ca text pe suprafete dark = 3.4:1 -> variante deschise */
.calc-formula .frow.discount .flabel,
.calc-formula .frow.discount .famount,
.calc-formula .frow.discount .ftag,
.calc-group.discount h4,
.opt-card .opt-pct.neg { color: #047857; }
.calc-formula .frow.surcharge .flabel,
.calc-formula .frow.surcharge .famount,
.calc-formula .frow.surcharge .ftag,
.calc-group.surcharge h4,
.opt-card .opt-pct.pos { color: #b45309; }
.map-legend-dot { color: #fff; }
.map-legend-dot[style*="3b82f6"] { background: #1d4ed8 !important; }
[data-theme="dark"] .map-live-label,
[data-theme="dark"] .map-info-status { color: #4ade80; }
[data-theme="dark"] .map-info-id,
[data-theme="dark"] .calc-formula .frow .flabel { color: var(--brand-ink); }
[data-theme="dark"] .calc-formula .frow.discount .flabel,
[data-theme="dark"] .calc-formula .frow.discount .famount,
[data-theme="dark"] .calc-formula .frow.discount .ftag,
[data-theme="dark"] .calc-group.discount h4,
[data-theme="dark"] .opt-card .opt-pct.neg { color: #6ee7b7; }
[data-theme="dark"] .calc-formula .frow.surcharge .flabel,
[data-theme="dark"] .calc-formula .frow.surcharge .famount,
[data-theme="dark"] .calc-formula .frow.surcharge .ftag,
[data-theme="dark"] .calc-group.surcharge h4,
[data-theme="dark"] .opt-card .opt-pct.pos { color: #fcd34d; }
/* pastilele verzi „done" au text alb pe #10b981 = 2.5:1 */
.form-progress .pstep.done .pnum { background: #047857; border-color: #047857; }
/* identificarea comerciantului, ceruta de Legea 365/2002 art. 5 */
.af-legal-line{margin:22px 0 0;padding-top:16px;border-top:1px solid var(--border);
  font-size:.8rem;color:var(--text-muted);line-height:1.6}

.page-photo{margin:22px 0 26px}
.page-photo img{width:100%;height:auto;display:block;border-radius:12px;border:1px solid var(--border)}
.page-photo figcaption{margin-top:9px;font-size:.85rem;color:var(--text-muted)}
.photo-side{float:right;width:min(280px,38%);margin:4px 0 18px 26px}
.photo-side img{border-radius:12px}
.photo-side figcaption{margin-top:9px;font-size:.85rem;color:var(--text-muted);line-height:1.45}
.photo-side figcaption strong{display:block;color:var(--text);font-size:.95rem}
@media (max-width:640px){.photo-side{float:none;width:100%;margin:18px 0}}


/* Cardurile de serviciu au inaltime egala, dar linkul "Vezi detalii" statea
   direct sub text, deci in acelasi rand statea la 30px sau la 55px de baza,
   dupa cat de lung era paragraful. Impins la baza, se aliniaza toate. */
.service-card { display:flex; flex-direction:column; }
.service-card .service-link { margin-top:auto; padding-top:16px; }

/* logo-nou.py: latimea blocului de brand */
.nav .brand{min-width:max-content;flex-shrink:0}

/* antet-consecvent.py */
.header > .container{max-width:1320px}

/* antet-consecvent.py */
.header > .container{max-width:1320px}
.header .nav{justify-content:space-between}
.header .nav .brand{min-width:max-content;flex-shrink:0}
.header .nav-links{margin:0;flex-shrink:0}

/* antet-consecvent.py */
.header > .container{max-width:1320px}
.header .nav{justify-content:space-between}
.header .nav .brand{min-width:max-content;flex-shrink:0}
.header .nav-links{margin:0;flex-shrink:0}
.header > .container{margin-inline:auto;padding-inline:24px;width:100%}
@media (max-width:560px){.header > .container{padding-inline:16px}}

/* antet-consecvent.py */
.header > .container{max-width:1320px}
.header .nav{justify-content:space-between}
.header .nav .brand{min-width:max-content;flex-shrink:0}
.header .nav-links{margin:0;flex-shrink:0}
.header > .container{margin-inline:auto;padding-inline:24px;width:100%}
@media (max-width:560px){.header > .container{padding-inline:16px}}
@media (min-width:961px){.header .nav-links{gap:clamp(12px,1.4vw,20px)}}
/* Casuta de acord pentru newsletter si ghidul CMR (nebifata implicit) */
.nl-consent { display: flex; align-items: flex-start; gap: 8px; margin-top: 10px; font-size: .78rem; line-height: 1.45; color: var(--text-muted); cursor: pointer; }
.nl-consent input[type="checkbox"] { width: 16px; height: 16px; margin: 1px 0 0; flex-shrink: 0; accent-color: var(--brand-primary); cursor: pointer; }
.nl-consent a { color: var(--brand-ink); text-decoration: underline; }

/* harta de acoperire (docs/harta-acoperire.py) */
/* ".hero-visual svg" (100% x 100%, pentru ilustratia veche din hero) intindea
   si stratul SVG in care Leaflet deseneaza cercurile, si steagul din atribuire */
#harta svg { width: auto; height: auto; display: inline; }
.map-hint { pointer-events: auto; left: auto; right: 14px; bottom: 30px; max-width: 340px; }
/* deasupra atribuirii OpenStreetMap (obligatorie) si departe de Madrid, jos-stanga */
@media (max-width: 760px) { .map-hint { left: 10px; right: 10px; bottom: 26px; max-width: none; } }
.map-hint .map-info-route { margin-bottom: 4px; }
.map-hint a { font-size: 12px; font-weight: 700; color: var(--brand-ink); text-decoration: underline; text-underline-offset: .15em; }
.map-legend-dot.cov-plecare { background: var(--brand-primary); border: 2px solid #fff; box-shadow: 0 0 0 1px var(--brand-primary); }
.map-legend-dot.cov-destinatie { background: #fff; border: 2.5px solid var(--brand-primary); }
#harta .leaflet-popup-content { font-size: 13px; line-height: 1.5; margin: 10px 12px; }
#harta .leaflet-popup-content a { color: var(--brand-ink); text-decoration: underline; }
/* /harta de acoperire */

/* tipografie comuna (docs/tipografie.py) */
:root{--fs-h1:clamp(2rem,2.6vw + 1rem,3rem);--fs-h2:clamp(1.4rem,1.2vw + 1rem,1.9rem);--masura:68ch}
:root body h1{font-size:var(--fs-h1);line-height:1.12;letter-spacing:-.025em}
:root body main h2{font-size:var(--fs-h2);line-height:1.2;letter-spacing:-.015em}
:root body main :is(p, li:not([class]), dd, blockquote){max-width:var(--masura)}
/* /tipografie comuna */

/* numele firmei in antet, pe telefon (docs/antet-mobil.py) */
@media (min-width:385px) and (max-width:560px){
  :root body .nav .brand .brand-name{display:inline;font-size:.9rem;letter-spacing:-.01em}
}
/* /numele firmei in antet */

/* randul cu datele firmei, centrat pe toata latimea (docs/subsol-aliniat.py) */
footer .af-legal-line{max-width:none;text-align:center}
/* sfarsit rand date firma */

/* subsolul homepage-ului pe telefon si tableta, centrat ca pe subpagini (docs/subsol-aliniat.py) */
@media (max-width:960px){
footer .foot-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:28px 32px;text-align:center}
footer .foot-grid>*{flex:1 1 170px;max-width:240px}
footer .foot-grid>.foot-about{flex:1 1 100%;max-width:520px}
footer .foot-about .brand{justify-content:center}
footer .foot-about p{margin-left:auto;margin-right:auto}
footer .foot-about .nl-consent{text-align:left}
footer .foot-bottom{justify-content:center;flex-wrap:wrap;text-align:center;gap:6px 24px}
}
@media (max-width:440px){footer .foot-grid{column-gap:16px}footer .foot-grid>*{flex-basis:140px}footer .foot-grid a{overflow-wrap:anywhere}}
footer .foot-grid li>span{font-size:.92rem;color:var(--text-muted)}
/* sfarsit subsol homepage centrat */
