/* =============================================================
   LAVORA CON NOI — /rabotete-s-nas/            (01/10/2026)
   Caricato solo da page-rabotete-s-nas.php.
   Stile «lusso» della maison: contenuti/stile-lusso.md (nato su /junior,
   junior.css) — stesse variabili, stessi componenti, prefisso .lv-.
   - colori: nero, rosso del marchio, bianco in trasparenza (mai sotto .56);
   - display Barlow Condensed SOLO 700; testo Inter 400/600;
   - filetti da 1 px invece di scatole; raggi 10 px, pillole 999 px;
   - si anima solo transform/opacity; prefers-reduced-motion ferma tutto;
   - senza JS si vede tutto (l'ingresso .lv-pre lo mette lo script in pagina);
   - le classi .rabotete-form* restano quelle che main.js cerca: qui cambia
     solo l'aspetto (le regole vecchie di style.css vengono scavalcate con .lv).
   ============================================================= */

.lv {
  --lv-ink:     #0a0a0a;
  --lv-ink-2:   #0f0f0f;
  --lv-red:     var(--accent-red);          /* #B0111E: superfici, linee forti */
  --lv-red-hi:  var(--accent-red-testo);    /* #fb3d48: testo e dettagli rossi su nero */
  --lv-t1:      #ffffff;
  --lv-t2:      rgba(255, 255, 255, .72);
  --lv-t3:      rgba(255, 255, 255, .56);
  --lv-line:    rgba(255, 255, 255, .12);
  --lv-line-2:  rgba(255, 255, 255, .07);
  --lv-ease:    cubic-bezier(.16, 1, .3, 1);
  --lv-display: 'Barlow Condensed', sans-serif;
  --lv-gutter:  20px;
  --lv-grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .6 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background: var(--lv-ink);
  overflow-x: clip;
}
@media (max-width: 359px) { .lv { --lv-gutter: 16px; } }
@media (min-width: 600px) { .lv { --lv-gutter: 32px; } }

.lv-wrap { width: 100%; max-width: calc(1160px + 2 * var(--lv-gutter)); margin: 0 auto; padding: 0 var(--lv-gutter); }
.lv .lv-red { color: var(--lv-red-hi); }
.lv-grain {
  position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image: var(--lv-grain); background-size: 180px 180px; opacity: .06;
}
.lv a:focus-visible,
.lv button:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }

/* ---------- etichetta: pillola sottile con il punto vivo ---------- */
.lv-flag {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 8px 15px 8px 13px; border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, .16); background: rgba(10, 10, 10, .42);
  color: var(--lv-t1); font: 600 12px/1.3 'Inter', sans-serif; letter-spacing: .22em; text-transform: uppercase;
}
.lv-flag__dot { position: relative; width: 6px; height: 6px; border-radius: 50%; background: var(--lv-red-hi); flex: none; }
.lv-flag__dot::after { content: ''; position: absolute; inset: 0; border-radius: 50%; background: var(--lv-red-hi); }

/* ---------- numerazione delle sezioni: 01 ——— NOME ---------- */
.lv-idx {
  display: flex; align-items: center; gap: 14px; margin-bottom: 22px;
  font: 600 12px/1.3 'Inter', sans-serif; letter-spacing: .26em; text-transform: uppercase; color: var(--lv-t3);
}
.lv-idx b {
  display: flex; align-items: center; gap: 14px; flex: none;
  font-family: var(--lv-display); font-weight: 700; font-size: 14px; letter-spacing: .08em; color: var(--lv-red-hi);
}
.lv-idx b::after { content: ''; width: 36px; height: 1px; background: rgba(255, 255, 255, .28); }

/* ---------- titoli e testo ---------- */
.lv-h2 {
  font-family: var(--lv-display); font-weight: 700; text-transform: uppercase; color: #fff;
  font-size: clamp(30px, 10.4vw, 76px); line-height: .92; letter-spacing: -.005em;   /* 03/10: min 30, come sotto */
  text-wrap: balance;
}
.lv-lead { max-width: 34em; margin-top: 18px; font-size: 16px; line-height: 1.65; color: rgba(255, 255, 255, .68); }

/* ---------- pulsanti: il pulsante unico dello studio .bs-cta (style.css, copia di .jr-cta).
   Qui solo ciò che è di questa pagina: la freccia in giù di «Кандидатствайте» scende invece di andare a destra. ---------- */
.lv-cta[href^="#"]:hover .bs-cta__arrow svg { transform: translateY(3px); }

/* =============================================================
   HERO
   ============================================================= */
.lv-hero {
  position: relative; isolation: isolate; overflow: hidden;
  padding: calc(var(--header-height) + 18px) 0 56px;
}
.lv-hero__media {
  /* telefono: la foto del team intera in alto, poi sfuma nel nero; il testo sta sotto */
  position: relative; z-index: -3; margin: 0 0 -26vw;
  aspect-ratio: 4 / 3; overflow: hidden;
}
.lv-hero__media img {
  display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%;
  transform-origin: 50% 60%;
}
.lv-hero__media::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(180deg,
    rgba(10, 10, 10, .5) 0%, rgba(10, 10, 10, 0) 18%, rgba(10, 10, 10, 0) 46%,
    rgba(10, 10, 10, .62) 70%, rgba(10, 10, 10, .92) 88%, var(--lv-ink) 100%);
}
.lv-hero__light {
  position: absolute; inset: 0; z-index: -2; pointer-events: none;
  background: radial-gradient(110% 34% at 50% 100%, rgba(176, 17, 30, .26), transparent 70%);
}
.lv-hero__inner { position: relative; display: flex; flex-direction: column; align-items: flex-start; }
.lv-hero__inner > .lv-flag { margin-bottom: 22px; }

.lv-hero__title {
  margin: 0; font-family: var(--lv-display); font-weight: 700; text-transform: uppercase;
  text-shadow: 0 2px 22px rgba(0, 0, 0, .55), 0 1px 3px rgba(0, 0, 0, .35);
}
.lv-hero__pre {
  display: block; margin-bottom: 10px;
  font-size: clamp(17px, 5vw, 24px); line-height: 1.12; color: rgba(255, 255, 255, .82);
}
.lv-hero__main {
  display: block; color: #fff;
  font-size: clamp(40px, 12.2vw, 96px); line-height: .9; letter-spacing: -.005em; text-wrap: balance;
}
.lv-hero__main.lv-red { color: var(--lv-red-hi); }
.lv-hero__lead {
  max-width: 34em; margin-top: 20px;
  font-size: 16px; line-height: 1.65; color: rgba(255, 255, 255, .72);
}
.lv-hero__ctas { display: flex; flex-direction: column; gap: 12px; width: 100%; margin-top: 28px; }

.lv-stats {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  width: 100%; margin-top: 44px; border-top: 1px solid var(--lv-line);
}
.lv-stats li { padding: 20px 14px 18px 0; border-bottom: 1px solid var(--lv-line-2); }
.lv-stats li:nth-child(2n) { padding-left: 18px; border-left: 1px solid var(--lv-line-2); }
.lv-stats strong {
  display: block; font-family: var(--lv-display); font-weight: 700;
  font-size: clamp(40px, 11vw, 60px); line-height: .9; letter-spacing: -.01em; color: #fff; margin-bottom: 10px;
}
.lv-stats li > span {
  display: block; font: 600 12px/1.4 'Inter', sans-serif; letter-spacing: .18em; text-transform: uppercase;
  color: var(--lv-t3);
}

@media (min-width: 600px) {
  .lv-hero__media { aspect-ratio: 16 / 9; margin-bottom: -18vw; }
  .lv-hero__ctas { flex-direction: row; align-items: center; }
  .lv-hero__ctas .lv-cta { width: auto; min-width: 280px; }
}
@media (min-width: 768px) {
  .lv-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .lv-stats li { border-bottom: 0; padding-left: 18px; border-left: 1px solid var(--lv-line-2); }
  .lv-stats li:first-child { padding-left: 0; border-left: 0; }
}
@media (min-width: 960px) {
  /* computer: foto a destra, tutta l'altezza, sfumata verso sinistra; testo sul nero */
  .lv-hero { min-height: min(100vh, 920px); padding: calc(var(--header-height) + 96px) 0 72px; display: flex; align-items: flex-end; }
  .lv-hero__media {
    position: absolute; top: 0; right: 0; bottom: 0; margin: 0;
    width: 60%; aspect-ratio: auto;
  }
  .lv-hero__media::after {
    background:
      linear-gradient(90deg, var(--lv-ink) 0%, rgba(10, 10, 10, .78) 22%, rgba(10, 10, 10, 0) 58%),
      linear-gradient(0deg, var(--lv-ink) 0%, rgba(10, 10, 10, .7) 22%, rgba(10, 10, 10, 0) 48%),
      linear-gradient(180deg, rgba(10, 10, 10, .65) 0%, rgba(10, 10, 10, 0) 24%);
  }
  .lv-hero__light { background: radial-gradient(60% 50% at 18% 100%, rgba(176, 17, 30, .22), transparent 70%); }
  .lv-hero__inner > .lv-flag { margin-bottom: 26px; }
  .lv-hero__title, .lv-hero__lead { max-width: 640px; }
  .lv-hero__pre { font-size: 26px; }
  .lv-hero__main { font-size: min(6.6vw, 98px); }
  .lv-hero__lead { font-size: 17px; }
  .lv-stats { margin-top: 72px; }
}

/* =============================================================
   SEZIONI
   ============================================================= */
.lv-sec { position: relative; padding: 96px 0; }
.lv-sec--deep {
  background:
    radial-gradient(70% 30% at 50% 0%, rgba(176, 17, 30, .10), transparent 70%),
    var(--lv-ink-2);
  border-top: 1px solid var(--lv-line-2); border-bottom: 1px solid var(--lv-line-2);
}
.lv-head { margin-bottom: 36px; max-width: 820px; }
@media (min-width: 600px) { .lv-sec { padding: 120px 0; } }
@media (min-width: 900px) {
  .lv-sec { padding: 150px 0; }
  .lv-head { margin-bottom: 56px; }
}

/* 01 — elenco «menu»: righe a filetti, numero romano rosso */
.lv-menu { border-top: 1px solid var(--lv-line); }
.lv-menu li {
  display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 0 12px;
  padding: 24px 0 26px; border-bottom: 1px solid var(--lv-line);
}
.lv-menu__n {
  font-family: var(--lv-display); font-weight: 700; font-size: 15px; letter-spacing: .06em;
  color: var(--lv-red-hi); padding-top: 6px;
}
.lv-menu__t {
  font-family: var(--lv-display); font-weight: 700; text-transform: uppercase;
  font-size: clamp(24px, 7vw, 28px); line-height: 1.05; color: #fff; margin-bottom: 8px;
}
.lv-menu__p { font-size: 15.5px; line-height: 1.6; color: rgba(255, 255, 255, .68); max-width: 34em; }
@media (min-width: 900px) {
  .lv-menu { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 64px; }
  .lv-menu li { padding: 32px 0 34px; }
  .lv-menu__t { font-size: 28px; }
}

/* 02 — due strade */
.lv-roads { display: grid; border-top: 1px solid var(--lv-line); }
.lv-road { position: relative; padding: 28px 0 30px; border-bottom: 1px solid var(--lv-line); }
.lv-road__k {
  display: flex; align-items: center; gap: 12px; margin-bottom: 12px;
  font: 600 12px/1.3 'Inter', sans-serif; letter-spacing: .22em; text-transform: uppercase; color: var(--lv-red-hi);
}
.lv-road__k::before { content: ''; width: 28px; height: 1px; background: currentColor; flex: none; }
.lv-road__t {
  font-family: var(--lv-display); font-weight: 700; text-transform: uppercase;
  font-size: clamp(30px, 8.6vw, 44px); line-height: .95; color: #fff; margin-bottom: 12px;
}
.lv-road__p { font-size: 16px; line-height: 1.65; color: rgba(255, 255, 255, .68); max-width: 30em; }
.lv-road__flow { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 5px; margin-top: 20px; }
.lv-road__flow > span:not(.lv-road__sep) {
  display: inline-flex; align-items: center; min-height: 32px; padding: 4px 10px;
  border: 1px solid rgba(255, 255, 255, .16); border-radius: 999px;
  font: 600 12px/1.2 'Inter', sans-serif; letter-spacing: .1em; text-transform: uppercase; color: #fff;
}
.lv-road__sep { width: 9px; height: 1px; background: var(--lv-red-hi); flex: none; }
@media (min-width: 768px) {
  .lv-roads { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 0; }
  .lv-road { padding: 36px 40px 40px 0; }
  .lv-road + .lv-road { padding-left: 40px; border-left: 1px solid var(--lv-line); }
}

/* 02 — i cinque livelli */
.lv-sub {
  display: flex; align-items: center; gap: 14px; margin: 64px 0 26px;
  font: 600 12px/1.3 'Inter', sans-serif; letter-spacing: .26em; text-transform: uppercase; color: var(--lv-t3);
}
.lv-sub::after { content: ''; flex: 1; height: 1px; background: var(--lv-line-2); }
.lv-ladder { position: relative; display: grid; }
.lv-ladder::before {   /* il filo che unisce i gradini (telefono) */
  content: ''; position: absolute; left: 21px; top: 22px; bottom: 30px; width: 1px;
  background: linear-gradient(180deg, rgba(255, 255, 255, .16), var(--lv-red-hi));
}
.lv-step { position: relative; display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 18px; padding-bottom: 26px; }
.lv-step:last-child { padding-bottom: 0; }
.lv-step__n {
  position: relative; z-index: 1;
  width: 44px; height: 44px; border-radius: 50%;
  display: grid; place-items: center;
  background: var(--lv-ink-2); border: 1px solid rgba(255, 255, 255, .28);
  font-family: var(--lv-display); font-weight: 700; font-size: 15px; letter-spacing: .04em; color: #fff;
}
.lv-step--top .lv-step__n {
  background: linear-gradient(180deg, #c3131f, var(--lv-red) 55%, #a00f1b); border-color: transparent;
  box-shadow: 0 14px 30px -14px rgba(176, 17, 30, .95);
}
.lv-step__body { padding-top: 8px; }
.lv-step__t {
  font-family: var(--lv-display); font-weight: 700; text-transform: uppercase;
  font-size: 26px; line-height: 1.05; color: #fff; margin-bottom: 6px;
}
.lv-step__p { font-size: 15px; line-height: 1.6; color: rgba(255, 255, 255, .68); }

@media (min-width: 960px) {
  /* computer: una scala che sale verso destra, fatta di filetti */
  .lv-ladder { grid-template-columns: repeat(5, minmax(0, 1fr)); align-items: end; gap: 0; }
  .lv-ladder::before { display: none; }
  .lv-step {
    display: flex; flex-direction: column; gap: 22px;
    padding: 26px 22px 28px; border-left: 1px solid var(--lv-line); border-top: 1px solid var(--lv-line);
  }
  .lv-step:last-child { padding-bottom: 28px; border-right: 1px solid var(--lv-line); }
  .lv-step:nth-child(1) { min-height: 240px; }
  .lv-step:nth-child(2) { min-height: 280px; }
  .lv-step:nth-child(3) { min-height: 320px; }
  .lv-step:nth-child(4) { min-height: 360px; }
  .lv-step:nth-child(5) { min-height: 400px; }
  .lv-step--top {   /* la scheda evidenziata della maison */
    border: 1px solid rgba(251, 61, 72, .55);
    background: radial-gradient(90% 60% at 100% 0%, rgba(176, 17, 30, .3), transparent 70%);
    box-shadow: 0 34px 60px -34px rgba(176, 17, 30, .8);
    border-radius: 10px 10px 0 0;
  }
  .lv-step__body { margin-top: auto; padding-top: 0; }
  .lv-step__t { font-size: 28px; }
}

/* 02 — una storia vera: Ценко */
.lv-story { margin: 72px 0 0; display: grid; gap: 28px; }
.lv-story__photo { position: relative; aspect-ratio: 4 / 5; overflow: hidden; border-radius: 10px; }
.lv-story__photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; }
.lv-story__photo::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, rgba(10, 10, 10, 0) 60%, rgba(10, 10, 10, .45));
}
.lv-story__txt { display: flex; flex-direction: column; align-items: flex-start; }
.lv-story__k {
  display: flex; align-items: center; gap: 12px; margin-bottom: 18px;
  font: 600 12px/1.3 'Inter', sans-serif; letter-spacing: .22em; text-transform: uppercase; color: var(--lv-red-hi);
}
.lv-story__k::before { content: ''; width: 36px; height: 1px; background: currentColor; flex: none; }
.lv-story__q {
  display: block; font-family: var(--lv-display); font-weight: 700; text-transform: uppercase;
  font-size: clamp(28px, 7.8vw, 46px); line-height: 1; letter-spacing: -.005em; color: #fff; text-wrap: balance;
}
.lv-story__who {
  display: block; margin-top: 22px; padding-top: 16px; border-top: 1px solid var(--lv-line); align-self: stretch;
  font-size: 13px; line-height: 1.55; color: var(--lv-t3);
}
@media (min-width: 768px) {
  .lv-story { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 56px; align-items: center; }
  .lv-story__photo { aspect-ratio: 4 / 5; }
}

/* 03 — chi cerchiamo */
.lv-list { border-top: 1px solid var(--lv-line); }
.lv-list li {
  display: flex; align-items: center; gap: 16px; min-height: 64px; padding: 14px 0;
  border-bottom: 1px solid var(--lv-line);
  font-size: 16.5px; line-height: 1.45; color: #fff;
}
.lv-check {
  width: 20px; height: 20px; flex: none; fill: none; stroke: var(--lv-red-hi);
  stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round;
}
@media (min-width: 900px) {
  .lv-who { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 72px; align-items: start; }
  .lv-who .lv-head { margin-bottom: 0; }
  .lv-who .lv-h2 { font-size: clamp(44px, 4.6vw, 60px); }
  .lv-list li { min-height: 76px; font-size: 18px; }
}

/* =============================================================
   04 MODULO — stesso markup, aspetto della maison
   ============================================================= */
.lv .rabotete-form-section {
  position: relative; isolation: isolate; overflow: hidden;
  padding: 96px 0 120px; border-top: 1px solid var(--lv-line-2);
  scroll-margin-top: var(--header-height);
}
.lv-apply__light {
  position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(80% 36% at 50% 0%, rgba(176, 17, 30, .16), transparent 70%);
}
.lv .rabotete-form-card {
  max-width: 760px; margin: 0 auto; padding: 0;
  background: none; border-radius: 0;
}
.lv .rabotete-form-card__heading {
  font-family: var(--lv-display); font-weight: 700; text-transform: uppercase;
  /* 03/10 (spazzata, m2): minimo 30 px e niente break-word — a 320 «КАНДИДАТСТВАЙТЕ» si
     spezzava in «КАНДИДАТСТВАЙТ / Е»; a 30 px la parola sta intera nella colonna. */
  font-size: clamp(30px, 10.4vw, 76px); line-height: .92; letter-spacing: -.005em;
  margin: 0 0 18px;
}
.lv-form-intro { font-size: 16px; line-height: 1.65; color: rgba(255, 255, 255, .68); margin-bottom: 36px; max-width: 34em; }

.lv .rabotete-form { gap: 20px; padding-top: 32px; border-top: 1px solid var(--lv-line); }
.lv .rabotete-form__row { gap: 20px; }
.lv .rabotete-form__group { gap: 10px; }
.lv .rabotete-form__label {
  font: 600 12px/1.3 'Inter', sans-serif; letter-spacing: .2em; text-transform: uppercase; color: var(--lv-t2);
}
.lv .rabotete-form__input,
.lv .rabotete-form__select,
.lv .rabotete-form__textarea {
  min-height: 56px; padding: 16px 18px; line-height: 1.4;
  background: rgba(255, 255, 255, .025); border: 1px solid var(--lv-line); border-radius: 10px;
  color: #fff; font-size: 16px;
}
.lv .rabotete-form__select { padding-right: 46px; }
.lv .rabotete-form__select-wrap::after { right: 18px; background: var(--lv-t2); }
.lv .rabotete-form__select option { background: #151515; }
.lv .rabotete-form__textarea { min-height: 156px; }
.lv .rabotete-form__input::placeholder,
.lv .rabotete-form__textarea::placeholder { color: var(--lv-t3); }
.lv .rabotete-form__input:hover,
.lv .rabotete-form__select:hover,
.lv .rabotete-form__textarea:hover { border-color: rgba(255, 255, 255, .24); }
.lv .rabotete-form__input:focus,
.lv .rabotete-form__select:focus,
.lv .rabotete-form__textarea:focus {
  border-color: var(--lv-red-hi); outline: 2px solid var(--lv-red-hi); outline-offset: 2px;
}
/* Campo compilato male: solo dopo che la persona ci ha scritto */
.lv .rabotete-form__input:user-invalid,
.lv .rabotete-form__textarea:user-invalid { border-color: var(--lv-red-hi); }

/* Il pulsante d'invio è un <button> il cui testo lo cambia main.js («Изпращане…»):
   cerchio con freccia disegnati nei pseudo-elementi, così il testo resta solo testo. */
.lv .rabotete-form__submit {
  position: relative; isolation: isolate; overflow: hidden;
  display: flex; align-items: center; justify-content: flex-start;
  width: 100%; min-height: 60px; margin-top: 12px; padding: 8px 64px 8px 26px; border-radius: 999px;
  background: linear-gradient(180deg, #c3131f 0%, var(--lv-red) 55%, #a00f1b 100%);
  color: #fff; text-align: left; white-space: normal;
  font: 600 13.5px/1.2 'Inter', sans-serif; letter-spacing: .16em; text-transform: uppercase;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), 0 22px 44px -20px rgba(176, 17, 30, .95);
  transition: transform .5s var(--lv-ease), opacity .3s ease;
}
.lv .rabotete-form__submit::before {
  content: ''; position: absolute; right: 8px; top: 50%; width: 44px; height: 44px; margin-top: -22px; border-radius: 50%;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B0111E' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / 18px 18px no-repeat;
  transition: transform .5s var(--lv-ease);
}
.lv .rabotete-form__submit::after {   /* il riflesso di .bs-cta (il ::before è già il cerchio con la freccia) */
  content: ''; position: absolute; top: 0; bottom: 0; left: 0; width: 40%; z-index: -1;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .2), transparent);
  transform: translateX(-130%) skewX(-18deg);
  animation: lv-shine 6s ease-in-out 1.6s infinite;
}
.lv .rabotete-form__submit:disabled::after { animation: none; opacity: 0; }
.lv .rabotete-form__submit:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
.lv .rabotete-form__submit:hover { background: linear-gradient(180deg, #c3131f 0%, var(--lv-red) 55%, #a00f1b 100%); transform: none; }
.lv .rabotete-form__submit:hover::before { transform: translateX(3px); }
.lv .rabotete-form__submit:active { transform: scale(.975); }
.lv .rabotete-form__submit:disabled { opacity: .6; cursor: progress; }

.lv .rabotete-form-error {
  color: var(--lv-red-hi);   /* #B0111E su fondo scuro non si leggeva */
  background: rgba(176, 17, 30, .12); border: 1px solid rgba(251, 61, 72, .45); border-radius: 10px;
  margin-bottom: 20px;
}
.lv .rabotete-form-error[hidden] { display: none; }
.lv .rabotete-form-success h2 { font-family: var(--lv-display); font-weight: 700; font-size: clamp(36px, 10vw, 56px); }
.lv .rabotete-form-success svg { color: var(--lv-red-hi); }
.lv .rabotete-form-success p { max-width: 30em; color: rgba(255, 255, 255, .68); }

@media (min-width: 600px) {
  .lv .rabotete-form-section { padding: 120px 0 150px; }
  .lv .rabotete-form__submit { justify-content: center; text-align: center; padding-left: 64px; }
}

/* =============================================================
   MOVIMENTO — solo transform/opacity
   ============================================================= */
@keyframes lv-up    { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes lv-kb    { from { transform: scale(1.09); } to { transform: none; } }
@keyframes lv-ping  { 0% { transform: scale(1); opacity: .7; } 80%, 100% { transform: scale(3.2); opacity: 0; } }
@keyframes lv-shine { 0% { transform: translateX(-130%) skewX(-18deg); } 22%, 100% { transform: translateX(340%) skewX(-18deg); } }

/* Hero: CSS puro, finisce visibile anche senza JS */
.lv-hero__media img { animation: lv-kb 3.2s var(--lv-ease) both; }
.lv-hero__inner > .lv-flag, .lv-hero__title > span, .lv-hero__lead, .lv-hero__ctas, .lv-stats { animation: lv-up 1s var(--lv-ease) both; }
.lv-hero__inner > .lv-flag      { animation-delay: .05s; }
.lv-hero__title > :nth-child(1) { animation-delay: .12s; }
.lv-hero__title > :nth-child(2) { animation-delay: .2s; }
.lv-hero__title > :nth-child(3) { animation-delay: .28s; }
.lv-hero__lead                  { animation-delay: .36s; }
.lv-hero__ctas                  { animation-delay: .44s; }
.lv-stats                       { animation-delay: .52s; }
.lv-flag__dot::after { animation: lv-ping 2.4s cubic-bezier(0, 0, .2, 1) infinite; }

/* Ingresso delle sezioni: la classe .lv-pre la mette lo script in pagina, solo sotto lo schermo */
.lv-pre { opacity: 0; transform: translateY(30px); transition: opacity 1.1s var(--lv-ease), transform 1.1s var(--lv-ease); }
.lv-pre.is-in { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  .lv *, .lv *::before, .lv *::after { animation: none !important; transition: none !important; }
  .lv-pre { opacity: 1; transform: none; }
}