/**
 * File role: what /ro/contab-asist/ (VOGO Contab Asist) adds to the shared e-Registratura frame (/ro/e-reg/e-reg.css,
 * body.ereg-pk): the hero with the home page picture (/ro/img/bk-image-hero.webp) on the right, and the two
 * lists of the "for the firm / for its clients" band. Colours are the frame's tokens.
 *
 * $file_version: 1.1.0 (1.1.0: the screens as on /ro/aiao/, the clients' portal and app — user, 23.10.2026; 1.0.2: the home page hero picture on the right — user, 19.10.2026; 1.0.1: the lists on the blue band in light text, with a small indent — user, 19.10.2026:
 *                       "vizibilitatea nu este adecvată")
 */
/* The hero: the home page hero picture on the right, under the frame's dark veil (as /ro/download/), 19.10.2026. */
body.casist-pk .pk-hero {
  background:
    linear-gradient(90deg, rgba(0,17,32,.95) 0%, rgba(0,17,32,.88) 42%, rgba(4,32,60,.55) 72%, rgba(4,32,60,.35) 100%),
    url('/ro/img/bk-image-hero.webp') right center / cover no-repeat,
    var(--pk-abyss);
}

/* The two sides (the accounting firm, its clients): the list of what each gets, left-aligned under the card text. */
body.casist-pk .casist-side ul { margin: 12px 0 0; padding: 0 0 0 20px; text-align: left; list-style: disc; }
/* The band is dark: the list text is light, as the band's paragraphs, a little brighter to be read. */
body.casist-pk .casist-side li { margin: 6px 0; padding: 0; font-size: 14.5px; line-height: 1.5; color: rgba(255,255,255,.88); }
body.casist-pk .casist-side li::marker { color: var(--vogo-orange); }

/* ---- 1.1.0 (23.10.2026): the screens, as /ro/aiao/ shows its own — a dark field the full width of the window, the
        capture and its comment side by side, alternating; the ember rule marks where a screen starts. ---- */
body.casist-pk .casist-screens {
  padding: clamp(56px, 7vw, 92px) 0;
  background:
    radial-gradient(circle at 82% 10%, rgba(255,255,255,.06), transparent 46%),
    linear-gradient(135deg, var(--pk-abyss) 0%, var(--pk-deep) 55%, var(--pk-abyss) 100%);
  color: #fff;
}
body.casist-pk .casist-screens__kicker {
  margin: 0 0 10px; font-size: .78rem; font-weight: 700; letter-spacing: .14em; color: var(--pk-ember);
}
body.casist-pk .casist-screens__h2 {
  margin: 0 0 clamp(18px, 3vw, 30px); max-width: 760px;
  font-family: "Inter Tight", Inter, system-ui, sans-serif; font-size: clamp(1.6rem, 3vw, 2.3rem);
  font-weight: 700; line-height: 1.18; letter-spacing: -.02em; color: #fff;
}
body.casist-pk .casist-screen {
  display: grid; grid-template-columns: .82fr 1.18fr; gap: 48px; align-items: center;
  padding: clamp(26px, 4vw, 44px) 0;
}
body.casist-pk .casist-screen + .casist-screen { border-top: 1px solid rgba(255,255,255,.1); }
body.casist-pk .casist-screen--flip .casist-screen__text { order: 2; }
body.casist-pk .casist-screen h3 {
  margin: 0 0 14px;
  font-family: "Inter Tight", Inter, system-ui, sans-serif; font-size: clamp(1.3rem, 2.2vw, 1.75rem);
  font-weight: 700; line-height: 1.22; letter-spacing: -.015em; color: #fff;
}
body.casist-pk .casist-screen h3::before {
  content: ""; display: block; width: 34px; height: 3px; margin-bottom: 16px;
  background: var(--pk-ember); border-radius: 2px;
}
body.casist-pk .casist-screen p { margin: 0; font-size: 1rem; line-height: 1.7; color: rgba(255,255,255,.8); }
body.casist-pk .casist-screen__shot { margin: 0; }
body.casist-pk .casist-screen__shot img {
  width: 100%; height: auto; display: block; border-radius: 14px;
  border: 1px solid rgba(228,129,47,.22); box-shadow: 0 34px 70px -34px rgba(0,0,0,.85);
}

/* The clients' portal and mobile app: four steps of a request, then the links. */
body.casist-pk .casist-app__lead { max-width: 760px; margin: 0 0 28px; font-size: 1.05rem; line-height: 1.7; color: var(--pk-muted); }
body.casist-pk .casist-app__steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
body.casist-pk .casist-app__step {
  position: relative; padding: 22px 20px 20px; background: var(--pk-paper);
  border: 1px solid var(--pk-line); border-radius: 14px;
}
body.casist-pk .casist-app__no {
  position: absolute; top: 16px; right: 18px; font-size: .8rem; font-weight: 700; color: var(--pk-ember);
}
body.casist-pk .casist-app__step .bi { font-size: 1.6rem; color: var(--vogo-blue, #0F6CBD); }
body.casist-pk .casist-app__step h3 { margin: 10px 0 6px; font-size: 1.05rem; color: var(--pk-ink); }
body.casist-pk .casist-app__step p { margin: 0; font-size: .93rem; line-height: 1.55; color: var(--pk-muted); }
body.casist-pk .casist-app__actions { margin-top: 26px; }
body.casist-pk .casist-app__btn { background: var(--pk-paper); color: var(--pk-ink); border: 1px solid var(--pk-line); }
body.casist-pk .casist-app__btn:hover { border-color: var(--pk-ember); color: var(--pk-ink); }

/* ---- Tablets and phones ---- */
@media (max-width: 1040px) {
  body.casist-pk .casist-screen { grid-template-columns: 1fr; gap: 26px; }
  body.casist-pk .casist-screen--flip .casist-screen__text { order: 0; }
  body.casist-pk .casist-app__steps { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  body.casist-pk .casist-app__steps { grid-template-columns: 1fr; }
}