/* ============================================================================
   Instant Funding band 6 — final CTA. Figma 804:88121 (1512 x 1668).

   Structurally identical to the home final band (705:77958): same 1512x1668
   frame, same #303030 -> #0F0F0F ramp, same Ellipse 473 glow, same blurred
   black plate at (388,725), same 1488x874 footer nested at (12,794).
   So it reuses .afxf / atlas-final.css wholesale and this file carries only
   the three things that actually differ:

     1. the background art. Home's is imageRef 314c87…; this frame's
        804:88122 is 04959a5d… — a different image at the same 1516x853
        offset with the same SCREEN blend.
     2. the content column sits at y=160, not y=120.
     3. the proof row is 524 wide with gap 36 (three items), against home's
        706 with three wider ones.

   Load AFTER atlas-final.css.
   ========================================================================= */

/* 804:88122 — "image 1167", 1516x853 at (-4,5), blendMode SCREEN */
.afxf--if .afxf__bg { background-image: url('/assets/figma/if-final-art.webp'); }

/* 804:88139 — content column 558x392 at (477,160). atlas-final.css already
   expresses home's y=120 as `margin: 120px auto 0`, so this overrides that
   margin rather than adding padding on top of it. */
.afxf--if .afxf__inner { margin-top: 160px; }

/* 804:88147 — 400x63, three lines. The shared rule is width:100% (558), which
   wraps this string to two lines and costs the band 21px. */
.afxf--if .afxf__body { width: 400px; }

/* 804:88235 — proof row 524x16 at (494.5,734), gap 36.
   734 - (160 + 392) = 182px below the content column, so that is the margin,
   against home's 223.

   DECLARED DEVIATION, 6 Aug 2026 — the 524 is NOT reproduced as a pinned
   width. Measured in Chrome the three labels render 482 wide, which with the
   two 36 gaps needs 554: the node's own 524 is 30 short, so pinning it pushed
   the items 30px past the box's right edge and the row read as off-centre at
   every viewport above 1512. Below 1512 the shared max-width block freed the
   width, which also dropped the auto side margins, and with no
   justify-content on .afxf__proof the items then packed hard left — the same
   bug from the other side, all the way down to 761.
   Sizing to content and centring satisfies the node's real intent (the row is
   centred on the frame: 494.5 = (1512 - 524) / 2) at every width, and is
   robust to the label copy changing. */
.afxf--if .afxf__proof { width: auto; justify-content: center; gap: 36px; margin-top: 182px; }

/* 804:88151 — footer at y=794. 794 - (734 + 16) = 44. */
.afxf--if .afxf__footer { margin-top: 44px; }

/* 804:88143 — chars 0-6 ("Instant") are white at 60%, chars 7-13 (" Access")
   at full. Read off the node's characterStyleOverrides, not eyeballed. */
.afxf--if .afxf__eyebrow i { font-style: normal; opacity: .6; }

/* atlas-final.css's own max-width:1512 block re-pads .afxf__inner (96px) and
   frees the proof width. The inner's offset is a margin here, so the padding
   is zeroed rather than re-stated — adding to it is what put the band 146px
   over on the first pass. */
@media (max-width: 1512px) {
  .afxf--if .afxf__inner { padding-top: 0; margin-top: 120px; }
  /* the proof row is width:auto and centred at every width now, so the
     override this block used to carry is redundant. */
}
/* ---- 393 mobile — Figma 804:118065 (393 x 2596) -------------------------
   804:118083 content 394x435 at y=100, 804:118097 proof 179x80 at y=655,
   804:118111 footer 377x1821 at y=775. */
@media (max-width: 768px) {
  .afxf--if .afxf__inner { margin-top: 100px; width: 346px; gap: 24px; }
  /* 804:118084 — head 346x201, gap 12 */
  .afxf--if .afxf__head { gap: 12px; }
  /* 804:118088 — 346x156: three 52px lines. The frame breaks them
     "Skip The" / "Evaluation. Get Funded Today", which is a different split
     from the desktop node, so the two spans flow as one wrapping paragraph
     here instead of holding their own lines. The gradient then covers
     "Skip The Evaluation." rather than "Skip The" — two words' difference,
     declared rather than forking the markup per breakpoint. */
  .afxf--if .afxf__h2 { width: 346px; font-size: 52px; line-height: 52px; letter-spacing: -1.56px; }
  .afxf--if .afxf__h2 span { display: inline; white-space: normal; }
  /* 804:118091 — 346x63 */
  .afxf--if .afxf__body { width: 346px; }
  /* 804:118092 — 293x123, the two buttons STACKED with gap 12 */
  .afxf--if .afxf__ctas { flex-direction: column; gap: 12px; width: 293px; }
  .afxf--if .afxf__lime, .afxf--if .afxf__ghost { width: 100%; }
  .afxf--if .afxf__proof { margin-top: 120px; flex-wrap: wrap; gap: 16px 24px; }
  .afxf--if .afxf__footer { margin-top: 40px; }
}
