/* ============================ ABOUT //VENTURE (THIRD LOOK) ============================
   about/venture3.php, from the user's Claude Design "ADAPT Venture about" (second version): sizes,
   colours and type are the design's. Its pictures are empty slots for now (.a3-slot: hatching and an
   outlined mark); a slot that is set draws .a3-pic instead.
   States set by about/venture3.js: .a3-stage.on / .past, .a3-tab.on + .a3-use.on, .a3-eco.hot with
   .lit / .me on its cells. Without the script: stage 1 shows, every "who" panel shows.
   ========================================================================== */
.a3 { --k: #0a0a0a; --k2: #141414; --ln: #2a2a2a; --p: #f5f5f3; --g: #00FF50; --mut: #9a9a95; --tx: #d0d0cc; --tx2: #bdbdb8;
      --gut: clamp(20px, 4vw, 56px); --ease: cubic-bezier(.2,.7,.2,1);
      font-family: 'Archivo', sans-serif; background: var(--k); color: var(--p); overflow-x: clip; -webkit-font-smoothing: antialiased; }
.a3 *, .a3 *::before, .a3 *::after { box-sizing: border-box; }
.a3 h1, .a3 h2, .a3 h3, .a3 p { margin: 0; }
:where(.a3) a { color: inherit; text-decoration: none; }
.a3 ::selection { background: var(--g); color: var(--k); }
.a3 a:focus-visible, .a3 [tabindex]:focus-visible, .a3 button:focus-visible { outline: 2px solid var(--g); outline-offset: 3px; }
.a3 section { position: relative; overflow: hidden; }
.a3-wrap { max-width: 1440px; margin: 0 auto; padding: clamp(80px, 10vw, 140px) var(--gut); }
.a3-g { color: var(--g); }

/* shared type */
.a3-eye { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; color: var(--g); font: 800 10.5px 'Archivo', sans-serif; letter-spacing: .16em; }
.a3-eye-n { font: 800 12px 'Archivo', sans-serif; letter-spacing: .2em; }
.a3-eye-r { flex: none; width: 46px; height: 2px; background: currentColor; }
.a3-eye.dk { color: var(--k); }
.a3-h2 { font: 900 clamp(42px, 6vw, 104px)/.86 'Archivo', sans-serif; letter-spacing: -.06em; margin: 0 0 18px !important; max-width: 16ch; text-wrap: balance; overflow-wrap: break-word; }
.a3-head { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: clamp(30px, 5vw, 80px); align-items: end; margin-bottom: clamp(30px, 4vw, 50px); }
.a3-head-lg { margin-bottom: clamp(36px, 4vw, 60px); }
.a3-lead { font: 500 clamp(15px, 1.3vw, 18px)/1.6 'Archivo', sans-serif; color: var(--tx2); max-width: 52ch; }
.a3-lead-dk { font-weight: 600; line-height: 1.55; color: var(--k); }
.a3-note { margin-top: 18px; font: 600 12.5px/1.5 'Archivo', sans-serif; color: var(--mut); }
.a3-note-dk { margin-top: 14px; color: #4a4a46; }
.a3-light { background: var(--p); color: var(--k); }
.a3-dark { background: var(--k); color: var(--p); }
.a3-tick { width: 18px; height: 18px; flex: none; display: grid; place-items: center; background: var(--k); color: var(--g); font: 900 10px 'Archivo', sans-serif; margin-top: 1px; }

/* buttons */
.a3-ctas { display: flex; flex-wrap: wrap; gap: 10px; }
.a3-btn { display: inline-block; cursor: pointer; white-space: nowrap; padding: 16px 22px; font: 800 12.5px 'Archivo', sans-serif; letter-spacing: .14em; transition: background .2s, color .2s; }
.a3 .a3-btn-g { background: var(--g); color: var(--k); }
.a3 .a3-btn-g:hover { background: var(--p); }
.a3 .a3-btn-o { border: 2px solid var(--p); padding: 14px 20px; }
.a3 .a3-btn-o:hover { background: var(--p); color: var(--k); }
.a3 .a3-btn-k { background: var(--k); color: var(--g); }
.a3 .a3-btn-k:hover { background: var(--g); color: var(--k); }
.a3 .a3-btn-line { border: 2px solid var(--k); padding: 14px 20px; }
.a3 .a3-btn-line:hover { background: var(--k); color: var(--p); }
.a3 .a3-btn.is-off { cursor: default; opacity: .45; }
.a3 .a3-btn.is-off:hover { background: transparent; color: inherit; }

/* picture slots: 16:10, type and hatching while empty */
.a3-media { position: relative; aspect-ratio: 16 / 10; overflow: hidden; }
.a3-pic { position: absolute; inset: 0; background-size: cover; background-position: center; }
.a3-slot { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; gap: 10px; padding: clamp(14px, 2vw, 24px);
           background: radial-gradient(at 80% 20%, rgba(0,255,80,.12), transparent 60%), repeating-linear-gradient(-45deg, rgba(255,255,255,.06) 0 2px, transparent 2px 22px), var(--k2); }
.a3-slot-mark { font: 900 clamp(64px, 9vw, 150px)/.8 'Archivo', sans-serif; letter-spacing: -.07em; color: transparent; -webkit-text-stroke: 1.5px rgba(0,255,80,.55); }
.a3-slot-k { font: 800 10px 'Archivo', sans-serif; letter-spacing: .16em; color: var(--mut); }

/* — the hero — */
.a3-hero { min-height: 100vh; background: var(--k); display: flex; align-items: flex-end; }
.a3-hero-hatch { position: absolute; inset: 0; background: repeating-linear-gradient(-45deg, rgba(0,255,80,.05) 0 2px, transparent 2px 24px); }
.a3-hero-ghost { position: absolute; right: -4%; top: 120px; font: 900 clamp(160px, 26vw, 440px)/.8 'Archivo', sans-serif; letter-spacing: -.07em; color: transparent; -webkit-text-stroke: 1px rgba(0,255,80,.22); white-space: nowrap; pointer-events: none; }
.a3-hero-in { position: relative; max-width: 1440px; margin: 0 auto; width: 100%; padding: 150px var(--gut) clamp(50px, 7vh, 80px);
              display: grid; grid-template-columns: minmax(0,1.05fr) minmax(0,1fr); gap: clamp(28px, 4vw, 64px); align-items: end; }
.a3-hero-text { min-width: 0; }
.a3-kick { display: flex; align-items: center; gap: 12px; margin-bottom: 22px; font: 800 10.5px/1.4 'Archivo', sans-serif; letter-spacing: .16em; color: var(--g); }
.a3-kick-hatch { flex: none; width: 46px; height: 12px; background: repeating-linear-gradient(-45deg, var(--g) 0 4px, transparent 4px 8px); }
.a3-h1 { font: 900 clamp(50px, 6.6vw, 118px)/.86 'Archivo', sans-serif; letter-spacing: -.06em; margin: 0 0 24px !important; text-wrap: balance; overflow-wrap: break-word; }
.a3-hero-lede { font: 500 clamp(15px, 1.3vw, 18px)/1.6 'Archivo', sans-serif; color: var(--tx); max-width: 56ch; margin: 0 0 30px !important; }
.a3-frame-wrap { min-width: 0; position: relative; }
.a3-frame { background: var(--k2); border: 1px solid var(--ln); box-shadow: 0 40px 100px rgba(0,0,0,.6); }
.a3-frame-bar { display: flex; align-items: center; gap: 7px; padding: 10px 12px; border-bottom: 1px solid var(--ln); }
.a3-frame-bar span { width: 9px; height: 9px; border-radius: 999px; background: #3a3a3a; }
.a3-frame-bar em { margin-left: 10px; font: 700 11px 'Archivo', sans-serif; font-style: normal; color: var(--mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.a3-chipbox { position: absolute; left: -26px; bottom: -22px; display: flex; align-items: center; gap: 10px; padding: 12px 14px; background: var(--g); color: var(--k); border: 2px solid var(--k); }
.a3-chipbox b { font: 900 24px/1 'Archivo', sans-serif; letter-spacing: -.04em; }
.a3-chipbox span { max-width: 17ch; font: 800 10.5px/1.25 'Archivo', sans-serif; letter-spacing: .1em; }

/* — 01 the challenge — */
.a3-frags { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); border: 2px solid var(--k); }
.a3-frag { min-width: 0; padding: clamp(18px, 2vw, 26px); background: #fff; border-right: 2px solid var(--k); }
.a3-frag:last-child { border-right: 0; }
.a3-frag-k { font: 800 10px 'Archivo', sans-serif; letter-spacing: .16em; color: #4a4a46; }
.a3-frag-t { font: 900 clamp(22px, 2.2vw, 32px)/1 'Archivo', sans-serif; letter-spacing: -.04em; margin-top: 14px; text-decoration: line-through; text-decoration-color: var(--g); text-decoration-thickness: 4px; }
.a3-frag-d { font: 600 13px/1.45 'Archivo', sans-serif; color: var(--ln); margin-top: 10px; }
.a3-blackband { margin-top: 18px; padding: 20px 24px; background: var(--k); color: var(--p); font: 900 clamp(22px, 2.4vw, 36px)/1.05 'Archivo', sans-serif; letter-spacing: -.04em; }

/* — 02 the workflow — */
.a3-flow { position: relative; }
.a3-line { position: absolute; left: 0; right: 0; top: 34px; height: 2px; background: var(--ln); }
.a3-line span { display: block; height: 100%; background: var(--g); transition: width .4s var(--ease); }
.a3-stages { position: relative; display: grid; grid-template-columns: repeat(6, minmax(0,1fr)); gap: 10px; }
.a3-stage { min-width: 0; cursor: pointer; display: flex; flex-direction: column; gap: 14px; }
.a3-stage:focus-visible { outline: none; }
.a3-stage:focus-visible .a3-card { outline: 2px solid var(--g); outline-offset: 3px; }
.a3-dot { width: 68px; height: 68px; display: grid; place-items: center; font: 900 20px 'Archivo', sans-serif; background: var(--k); color: var(--mut); border: 2px solid #3a3a3a; transition: all .25s; }
.a3-stage.past .a3-dot { color: var(--g); border-color: var(--g); }
.a3-stage.on .a3-dot { background: var(--g); color: var(--k); border-color: var(--g); }
.a3-card { flex: 1; padding: 16px 14px; background: var(--k2); color: var(--p); border: 1px solid var(--ln); transition: all .25s; }
.a3-stage.on .a3-card { background: var(--g); color: var(--k); border-color: var(--g); transform: translateY(-6px); }
.a3-card-t { font: 900 clamp(17px, 1.5vw, 22px)/1.05 'Archivo', sans-serif; letter-spacing: -.025em; overflow-wrap: break-word; hyphens: auto; }
.a3-card-d { font: 600 12.5px/1.45 'Archivo', sans-serif; margin-top: 8px; opacity: .85; }
.a3-chips { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 12px; }
.a3-chip { padding: 3px 6px; font: 800 10px 'Archivo', sans-serif; border: 1px solid #3a3a3a; transition: background .2s, color .2s; }
.a3-stage.on .a3-chip { border-color: var(--k); }
a.a3-chip:hover { background: var(--p); color: var(--k); border-color: var(--p); }
.a3-stage.on a.a3-chip:hover { background: var(--k); color: var(--g); border-color: var(--k); }

/* — 03 the product — */
.a3-shows { display: flex; flex-direction: column; gap: clamp(50px, 7vw, 110px); }
.a3-show { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(0,1fr); gap: clamp(28px, 4vw, 64px); align-items: center; }
.a3-show-media { min-width: 0; }
.a3-show-text { min-width: 0; order: 1; }
.a3-show.flip .a3-show-media { order: 2; }
.a3-show-frame { position: relative; background: var(--k2); border: 2px solid var(--k); box-shadow: 12px 12px 0 var(--g); }
.a3-show-n { font: 900 clamp(56px, 6vw, 96px)/.8 'Archivo', sans-serif; letter-spacing: -.06em; color: transparent; -webkit-text-stroke: 2px var(--k); }
.a3-show-k { font: 800 10.5px 'Archivo', sans-serif; letter-spacing: .16em; margin: 18px 0 10px; }
.a3-show-t { font: 900 clamp(30px, 3.2vw, 50px)/.92 'Archivo', sans-serif; letter-spacing: -.045em; margin-bottom: 14px !important; text-wrap: balance; }
.a3-show-d { font: 500 15.5px/1.6 'Archivo', sans-serif; color: var(--ln); margin-bottom: 18px !important; }
.a3-pt { display: flex; gap: 12px; padding: 11px 0; border-top: 1px solid #cfcfca; font: 700 14px/1.4 'Archivo', sans-serif; }
.a3-more { display: inline-block; margin-top: 14px; border-bottom: 2px solid var(--k); padding-bottom: 3px; font: 800 11.5px 'Archivo', sans-serif; letter-spacing: .14em; transition: color .2s, border-color .2s; }
.a3-more:hover { color: #1e6b2f; border-color: var(--g); }

/* — 04 who it is for — */
.a3-h2-who { margin-bottom: 40px !important; }
.a3-tabs { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; border-bottom: 1px solid var(--ln); margin-bottom: 22px; }
.a3-tabs::-webkit-scrollbar { display: none; }
.a3-tab { flex: none; cursor: pointer; white-space: nowrap; padding: 13px 4px; margin-right: 18px; font: 800 13px 'Archivo', sans-serif; color: var(--tx2); background: none; border: 0; border-radius: 0; box-shadow: none; transition: color .2s, box-shadow .2s; }
.a3-tab:hover { color: var(--p); }
.a3-tab.on { color: var(--g); box-shadow: inset 0 -4px 0 var(--g); }
.a3-use { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(0,1fr) minmax(0,1fr); border: 1px solid var(--ln); }
.hp-js .a3-use:not(.on) { display: none; }
.a3-use + .a3-use { margin-top: 22px; }
.hp-js .a3-use + .a3-use { margin-top: 0; }
.a3-use > div { min-width: 0; padding: clamp(20px, 2.6vw, 34px); }
.a3-use-q { background: var(--g); color: var(--k); }
.a3-use-mid { border-right: 1px solid var(--ln); }
.a3-use-who { font: 800 10.5px 'Archivo', sans-serif; letter-spacing: .16em; margin-bottom: 14px; }
.a3-use-quote { font: 900 clamp(26px, 2.8vw, 42px)/.95 'Archivo', sans-serif; letter-spacing: -.045em; text-wrap: balance; }
.a3-use-lab { font: 800 10.5px 'Archivo', sans-serif; letter-spacing: .16em; color: var(--mut); margin-bottom: 12px; }
.a3-use-prob { font: 600 15px/1.6 'Archivo', sans-serif; color: var(--tx); margin-bottom: 20px; }
.a3-use-out { font: 800 16px/1.45 'Archivo', sans-serif; }
.a3-use-cap { display: flex; align-items: center; gap: 12px; padding: 11px 0; border-top: 1px solid #262626; font: 800 15px 'Archivo', sans-serif; }
.a3-use-cap span { width: 8px; height: 8px; flex: none; background: var(--g); }

/* — 05 the environment — */
.a3-eco { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; }
.a3-node { min-width: 0; cursor: default; padding: clamp(16px, 2vw, 24px); background: #fff; color: var(--k); border: 2px solid var(--k); transition: all .25s; }
.a3-node:focus-visible, .a3-core:focus-visible { outline: 2px solid var(--g); outline-offset: 3px; }
.a3-node-k { display: inline-block; padding: 3px 7px; font: 800 9.5px 'Archivo', sans-serif; letter-spacing: .14em; background: var(--k); color: var(--g); }
.a3-node-t { font: 900 clamp(20px, 2vw, 28px)/1.02 'Archivo', sans-serif; letter-spacing: -.03em; margin-top: 14px; overflow-wrap: break-word; }
.a3-node-d { font: 600 13px/1.45 'Archivo', sans-serif; margin-top: 8px; opacity: .8; }
.a3-eco.hot .a3-node { opacity: .45; }
.a3-eco.hot .a3-node.lit { opacity: 1; background: var(--g); }
.a3-eco.hot .a3-node.me { opacity: 1; background: var(--k); color: var(--g); }
.a3-eco.hot .a3-node.me .a3-node-k { background: var(--g); color: var(--k); }
.a3-core { min-width: 0; padding: clamp(20px, 2.4vw, 32px); background: var(--k); color: var(--p); border: 2px solid var(--k); transition: box-shadow .25s;
           display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
.a3-eco.hot .a3-core { box-shadow: 0 0 0 4px var(--g); }
.a3-core-k { font: 800 10.5px 'Archivo', sans-serif; letter-spacing: .16em; color: var(--g); margin-bottom: 10px; }
.a3-core-t { font: 900 clamp(40px, 4.4vw, 72px)/.86 'Archivo', sans-serif; letter-spacing: -.06em; }
.a3-core-d { font: 600 13px/1.5 'Archivo', sans-serif; color: var(--tx2); margin-top: 12px; }

/* — 06 Maverick — */
.a3-mav { background: var(--k); color: var(--p); }
.a3-mav-stripe { height: 14px; background: repeating-linear-gradient(-45deg, var(--g) 0 7px, var(--k) 7px 14px); }
.a3-mav-in { max-width: 1440px; margin: 0 auto; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,520px); gap: clamp(30px, 5vw, 80px); align-items: center; padding: clamp(80px, 10vw, 140px) var(--gut); }
.a3-h2-mav { font: 900 clamp(50px, 7.4vw, 130px)/.84 'Archivo', sans-serif; letter-spacing: -.065em; margin: 0 0 20px !important; overflow-wrap: break-word; }
.a3-mav-lead { color: var(--tx); max-width: 50ch; }
.a3-plan { min-width: 0; background: var(--p); color: var(--k); border: 2px solid var(--k); }
.a3-plan-top { padding: 22px 24px; background: var(--g); border-bottom: 2px solid var(--k); }
.a3-plan-k { font: 800 10.5px 'Archivo', sans-serif; letter-spacing: .16em; }
.a3-plan-inc .a3-plan-k { margin-bottom: 6px; }
.a3-plan-price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin-top: 10px; }
.a3-plan-amt { font: 900 clamp(56px, 6vw, 88px)/.85 'Archivo', sans-serif; letter-spacing: -.06em; }
.a3-plan-per { font: 800 14px 'Archivo', sans-serif; }
.a3-plan-billed { font: 700 12.5px 'Archivo', sans-serif; margin-top: 8px; }
.a3-plan-inc { padding: 16px 24px 6px; }
.a3-inc { display: flex; gap: 12px; padding: 10px 0; border-top: 1px solid #deded9; font: 700 14px/1.35 'Archivo', sans-serif; }
.a3-plan-btns { display: flex; flex-direction: column; gap: 8px; padding: 16px 24px 22px; }
.a3-plan-btns .a3-btn { display: block; text-align: center; }
.a3-plan-btns .a3-btn-line { padding: 13px 18px; }
.a3-plan-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 14px 24px; background: var(--k); color: var(--p); }
.a3-plan-foot span { min-width: 0; flex: 1 1 220px; font: 700 13px/1.45 'Archivo', sans-serif; }
.a3-plan-foot b { color: var(--g); font-weight: 900; }
.a3-plan-foot a { flex: none; font: 800 11px 'Archivo', sans-serif; letter-spacing: .14em; color: var(--g); border-bottom: 2px solid var(--g); padding-bottom: 2px; }
.a3-plan-foot a:hover { color: var(--p); border-color: var(--p); }

/* — the green band — */
.a3-band { background: var(--g); color: var(--k); }
.a3-band-ghost { position: absolute; right: -3%; bottom: -40px; font: 900 clamp(160px, 24vw, 420px)/.8 'Archivo', sans-serif; letter-spacing: -.07em; color: transparent; -webkit-text-stroke: 1.5px rgba(10,10,10,.18); white-space: nowrap; pointer-events: none; }
.a3-band-in { position: relative; max-width: 1440px; margin: 0 auto; padding: clamp(80px, 10vw, 140px) var(--gut); }
.a3-band-t { font: 900 clamp(56px, 9vw, 170px)/.82 'Archivo', sans-serif; letter-spacing: -.07em; margin: 0 0 24px !important; max-width: 12ch; overflow-wrap: break-word; }
.a3 .a3-band .a3-btn-line:hover { color: var(--p); }

/* — narrower screens (the design's breakpoints) — */
@media (max-width: 1100px) {
  .a3-hero-in, .a3-head, .a3-mav-in { grid-template-columns: minmax(0,1fr); }
  .a3-stages { grid-template-columns: repeat(3, minmax(0,1fr)); row-gap: 22px; }
  .a3-line { display: none; }
  .a3-use { grid-template-columns: minmax(0,1fr); }
  .a3-use > div { border-right: 0; border-bottom: 1px solid var(--ln); }
  .a3-use > div:last-child { border-bottom: 0; }
}
@media (max-width: 900px) {
  .a3-show { grid-template-columns: minmax(0,1fr); }
  .a3-show .a3-show-media, .a3-show .a3-show-text, .a3-show.flip .a3-show-media { order: 0; }
  .a3-frags { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .a3-frag { border-bottom: 2px solid var(--k); }
  .a3-frag:nth-child(2n) { border-right: 0; }
  .a3-frag:nth-child(n+3) { border-bottom: 0; }
  .a3-eco { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .a3-chipbox { left: 10px; }
}
@media (max-width: 600px) {
  .a3-hero-in { padding-top: 120px; }
  .a3-stages, .a3-frags, .a3-eco { grid-template-columns: minmax(0,1fr); }
  .a3-frag { border-right: 0; border-bottom: 2px solid var(--k); }
  .a3-frag:nth-child(n+3) { border-bottom: 2px solid var(--k); }
  .a3-frag:last-child { border-bottom: 0; }
  .a3-stage { flex-direction: row; align-items: stretch; }
  .a3-dot { width: 52px; height: 52px; flex: none; font-size: 17px; }
  .a3-stage.on .a3-card { transform: none; }
  .a3-btn { white-space: normal; }
  .a3-plan-top, .a3-plan-inc, .a3-plan-btns, .a3-plan-foot { padding-left: 18px; padding-right: 18px; }
}

/* reduced motion: nothing slides or fades */
@media (prefers-reduced-motion: reduce) {
  .a3-line span, .a3-dot, .a3-card, .a3-node, .a3-core, .a3-btn, .a3-chip, .a3-tab { transition: none; }
  .a3-stage.on .a3-card { transform: none; }
}

/* a filled slot: the picture whole, at its own proportions (product screenshots are never cropped) */
.a3-media.has-pic { aspect-ratio: auto; background: var(--k2); }
.a3-img { display: block; width: 100%; height: auto; }

/* ============================ PICTURES SET ON admin/pages/about/venture ============================
   Each slot is a gallery (shared/adapt-gallery.css); the sections' own slots (.a3-sec-media), drawn only
   once they hold a picture, wear the frame of the band they sit in: lt (light: black rule, green shadow),
   dk (dark: the hero's frame), band (green band: black rule, black shadow). */
.a3 .ag { --ag-bg: var(--k2); }
.a3-media .ag-n1 .ag-img { height: auto; }
.a3-sec-media { position: relative; margin-top: clamp(22px, 3vw, 36px); background: var(--k2); }
.a3-sec-media.lt { border: 2px solid var(--k); box-shadow: 12px 12px 0 var(--g); margin-right: 12px; }
.a3-sec-media.dk { border: 1px solid var(--ln); box-shadow: 0 40px 100px rgba(0,0,0,.6); }
.a3-sec-media.band { border: 2px solid var(--k); box-shadow: 12px 12px 0 var(--k); margin: 0 12px 12px 0; }
.a3-sec-media-top { margin: 0 12px clamp(40px, 5vw, 70px) 0; }
/* a section's pictures sit in its right-hand column, under the lead, at most 980 px wide */
.a3-sec-media.lt, .a3-sec-media.dk { max-width: 980px; margin-left: auto; }
.a3-mav-media.a3-sec-media { margin: clamp(26px, 3vw, 40px) 0 0; max-width: 640px; }
.a3-band-in.has-media { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 64px); align-items: center; }
.a3-band-in.has-media .a3-sec-media { margin-top: 0; }
@media (max-width: 900px){ .a3-band-in.has-media { grid-template-columns: minmax(0, 1fr); } }

/* an administrator looking at the draft (?preview=1) */
.a3-preview { position: sticky; top: 0; z-index: 50; display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; justify-content: center; padding: 10px var(--gut);
              background: repeating-linear-gradient(-45deg, var(--g) 0 10px, #0a0a0a 10px 20px); }
.a3-preview b, .a3-preview a { background: var(--k); color: var(--g); padding: 4px 10px; font: 800 11px 'Archivo', sans-serif; letter-spacing: .14em; }
.a3-preview a { color: var(--p); text-decoration: underline; letter-spacing: .04em; }

/* ============================ MOTION ============================
   .js-anim is set on #a3 by the page's first lines (not with reduced motion), so nothing is hidden when
   scripts do not run; it is taken off again if about/venture3.js has not started within 3 s.
   The hero plays on load (CSS only); the rest plays once as it scrolls in: about/venture3.js adds .in to
   the observed block, then .done when it is over (so hover effects keep their own speed).
   Only opacity and transform move. */
@keyframes a3-up   { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: none; } }
@keyframes a3-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes a3-left { from { opacity: 0; transform: translateX(-40px); } to { opacity: 1; transform: none; } }
@keyframes a3-pop  { 0% { opacity: 0; transform: scale(.6); } 70% { opacity: 1; transform: scale(1.06); } 100% { opacity: 1; transform: none; } }
@keyframes a3-rise { from { opacity: 0; transform: translateY(60px) scale(.98); } to { opacity: 1; transform: none; } }

/* the hero, on load: eyebrow, the headline's two lines, the lede, the buttons; the hatching and the giant
   word come up slowly; the frame slides in a little later; the badge pops last */
.js-anim .a3-hero-hatch { animation: a3-fade 1.6s ease-out both; }
.js-anim .a3-hero-ghost { animation: a3-fade 2.2s ease-out .2s both; }
.js-anim .a3-kick { animation: a3-left .7s var(--ease) .1s both; }
.js-anim .a3-h1 { animation: a3-up .8s var(--ease) .22s both; }
.js-anim .a3-h1-l { animation: a3-fade .7s ease-out .3s both; }
.js-anim .a3-h1 .a3-g { animation: a3-fade .7s ease-out .5s both; }
.js-anim .a3-hero-lede { animation: a3-up .7s var(--ease) .62s both; }
.js-anim .a3-hero .a3-ctas { animation: a3-up .7s var(--ease) .76s both; }
.js-anim .a3-frame { animation: a3-rise 1s var(--ease) .45s both; }
.js-anim .a3-chipbox { animation: a3-pop .55s var(--ease) 1.15s both; }

/* on scroll: what waits (hidden until .in) */
.js-anim .a3-eye:not(.in) .a3-eye-n { opacity: 0; transform: translateX(-24px); }
.js-anim .a3-eye:not(.in) .a3-eye-r { transform: scaleX(0); }
.js-anim .a3-eye:not(.in) > span:last-child { opacity: 0; transform: translateX(-12px); }
.a3-eye-r { transform-origin: left center; }
.js-anim :is(.a3-h2, .a3-h2-mav):not(.in) { opacity: 0; }
.js-anim .a3-w { display: inline-block; }
.js-anim :is(.a3-h2, .a3-h2-mav):not(.in) .a3-w { opacity: 0; transform: translateY(.45em); }
.js-anim :is(.a3-lead, .a3-note, .a3-blackband, .a3-tabs, .a3-plan, .a3-sec-media):not(.in) { opacity: 0; transform: translateY(28px); }
.js-anim .a3-frags:not(.in) .a3-frag, .js-anim .a3-eco:not(.in) > * { opacity: 0; transform: translateY(30px); }
.js-anim .a3-flow:not(.in) .a3-stage { opacity: 0; transform: translateY(26px); }
.js-anim .a3-flow:not(.in) .a3-line span { transform: scaleX(0); }
.a3-line span { transform-origin: left center; }
.js-anim .a3-show:not(.in) .a3-show-media { opacity: 0; transform: translateX(-60px); }
.js-anim .a3-show:not(.in) .a3-show-text { opacity: 0; transform: translateX(60px); }
.js-anim .a3-show.flip:not(.in) .a3-show-media { transform: translateX(60px); }
.js-anim .a3-show.flip:not(.in) .a3-show-text { transform: translateX(-60px); }
.js-anim .a3-band-t:not(.in) { opacity: 0; transform: scale(.86); }
.a3-band-t { transform-origin: left bottom; }

/* on scroll: how it comes (only while it plays; --d is each one's delay) */
.js-anim .a3-eye.in:not(.done) > span,
.js-anim :is(.a3-h2, .a3-h2-mav).in:not(.done) .a3-w,
.js-anim :is(.a3-lead, .a3-note, .a3-blackband, .a3-tabs, .a3-plan, .a3-sec-media, .a3-band-t).in:not(.done),
.js-anim .a3-frags.in:not(.done) .a3-frag, .js-anim .a3-eco.in:not(.done) > *,
.js-anim .a3-flow.in:not(.done) .a3-stage,
.js-anim .a3-show.in:not(.done) :is(.a3-show-media, .a3-show-text) {
    transition: opacity .75s var(--ease), transform .75s var(--ease); transition-delay: var(--d, 0s); }
.js-anim .a3-eye.in:not(.done) > span:last-child { --d: .16s; }
.js-anim .a3-eye.in:not(.done) .a3-eye-r { --d: .06s; }
.js-anim .a3-lead.in:not(.done), .js-anim .a3-note.in:not(.done) { --d: .12s; }
.js-anim .a3-show.in:not(.done) .a3-show-text { --d: .12s; }
.js-anim .a3-flow.in:not(.done) .a3-line span { transition: transform 1.3s var(--ease), width .4s var(--ease); }
.js-anim .a3-band-t.in:not(.done) { transition-duration: 1s; }
.js-anim .a3-frags .a3-frag:nth-child(2), .js-anim .a3-eco > :nth-child(2), .js-anim .a3-flow .a3-stage:nth-child(2) { --d: .08s; }
.js-anim .a3-frags .a3-frag:nth-child(3), .js-anim .a3-eco > :nth-child(3), .js-anim .a3-flow .a3-stage:nth-child(3) { --d: .16s; }
.js-anim .a3-frags .a3-frag:nth-child(4), .js-anim .a3-eco > :nth-child(4), .js-anim .a3-flow .a3-stage:nth-child(4) { --d: .24s; }
.js-anim .a3-eco > :nth-child(5), .js-anim .a3-flow .a3-stage:nth-child(5) { --d: .32s; }
.js-anim .a3-eco > :nth-child(6), .js-anim .a3-flow .a3-stage:nth-child(6) { --d: .4s; }
.js-anim .a3-eco > :nth-child(7) { --d: .48s; }
.js-anim .a3-eco > :nth-child(8) { --d: .56s; }
.js-anim .a3-eco > :nth-child(9) { --d: .64s; }
.a3-plan-amt, .a3-chipbox b { font-variant-numeric: tabular-nums; }

@media (prefers-reduced-motion: reduce){
  .js-anim *, .js-anim *::before { animation: none !important; transition: none !important; }
}

/* ---- the hero video (2026-10-24): the cover with a play button; venture3.js puts YouTube in its place ---- */
.a3-video { position: relative; display: block; width: 100%; padding: 0; margin: 0; border: 0; background: #000; cursor: pointer; aspect-ratio: 16 / 9; overflow: hidden; }
.a3-video img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease), filter .4s; }
.a3-video:hover img, .a3-video:focus-visible img { transform: scale(1.03); filter: brightness(.8); }
.a3-video-play { position: absolute; left: 50%; top: 50%; width: 72px; height: 72px; margin: -36px 0 0 -36px; display: flex; align-items: center; justify-content: center;
  background: var(--g); color: #000; border-radius: 999px; box-shadow: 0 10px 40px rgba(0,0,0,.5); transition: transform .3s var(--ease); }
.a3-video-play svg { margin-left: 3px; }
.a3-video:hover .a3-video-play, .a3-video:focus-visible .a3-video-play { transform: scale(1.08); }
.a3-video:focus-visible { outline: 2px solid var(--g); outline-offset: -2px; }
.a3-video-k { position: absolute; right: 14px; bottom: 12px; padding: 6px 10px; background: rgba(0,0,0,.7); color: var(--p); font: 800 10px 'Archivo', sans-serif; letter-spacing: .16em; }
.a3-video-on { position: relative; aspect-ratio: 16 / 9; background: #000; }
.a3-frame-wrap .a3-chipbox { transition: opacity .3s; }
.a3-frame-wrap.is-playing .a3-chipbox { opacity: 0; pointer-events: none; }
.a3-video-on iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
@media (max-width: 600px){ .a3-video-play { width: 56px; height: 56px; margin: -28px 0 0 -28px; } }
@media (prefers-reduced-motion: reduce){ .a3-video img, .a3-video-play { transition: none; } .a3-video:hover img { transform: none; } }