/* "Poczta firmowa" (/hosting/poczta/) Hero-only DNA Helix override (2026-09
   review: "дай эту анимацию DNA по диагонали, увеличь её, затемни по краям").

   dna-helix.js's computeGeometry() always fits its drawn shape (fixed
   HELIX_ASPECT=4.5, tall & narrow) inside the SVG element's own
   `clientWidth`/`clientHeight` - the PRE-transform layout box (see that
   file's own comment on why it reads clientWidth/clientHeight instead of
   getBoundingClientRect()). hero.css's shared `.hero .hero-graphic` box is
   70% wide x 100% tall - far from the 1:4.5 portrait shape the strand
   wants - so left alone, the component only ever draws a narrow vertical
   column in the middle of that box, with visibly empty margins either side
   ("пустоты по краям"). A plain CSS `transform: scale()/rotate()` on this
   same element does NOT change clientWidth/clientHeight (transform is a
   pure post-layout paint effect), so it doesn't disturb dna-helix.js's own
   geometry fit at all - it just blows up and tilts the already-computed
   drawing as one image. Rotating that already-narrow-but-long portrait
   strip diagonally is what actually lets it sweep across more of the
   panel's width, not just its height - the same principle home.css's own
   90deg `.value-stats-dna` rotation relies on, generalised to an angle
   that isn't a clean width/height swap.

   The vignette mask below necessarily rotates together with the graphic
   (mask and transform both apply to this one SVG element - there is no
   separate wrapper to keep a mask axis-aligned while only the content
   rotates, the way home.css's `.value-stats-dna`/`.network-dna-helix` pair
   does). Kept close to circular (68%/62%, a mild difference) and centred
   on the element's own middle specifically so that mismatch stays close to
   invisible - a true circle centred on the rotation origin is rotation-
   invariant; this ellipse is deliberately close enough to one that a
   -22deg turn doesn't read as tilted, while still fading every edge
   (not just the original left-right-only fade `.hero .hero-graphic`
   ships by default) so the enlarged strand dissolves into the Hero's own
   dark background at the panel's corners instead of ending in a visible
   silhouette. High specificity ancestor selectors, matching the same
   `.hero .hero-graphic` pattern hero.css itself already documents, so this
   reliably wins regardless of stylesheet link order. */
.hero .hero-graphic.network-dna-helix {
  transform: scale(1.75) rotate(-22deg);
  -webkit-mask-image: radial-gradient(ellipse 68% 62% at 50% 50%, black 0%, black 40%, transparent 95%);
  mask-image: radial-gradient(ellipse 68% 62% at 50% 50%, black 0%, black 40%, transparent 95%);
}
