/* lander-frame-fit.css — framed landers only (html.atb-framed; see lander-frame-fit.js).
   A 100vh hero inside a 1000px exchange frame is 1000px of hero before anything else:
   drop those minimums, and cap the headline so it fits the first screen. */
html.atb-framed .opp-shell .min-h-screen,
html.atb-framed .opp-shell .min-h-\[100vh\],
html.atb-framed .opp-shell .min-h-\[100dvh\],
html.atb-framed .opp-shell .min-h-\[90vh\],
html.atb-framed .opp-shell .min-h-\[80vh\],
html.atb-framed .opp-shell [style*="min-height:100vh"],
html.atb-framed .opp-shell [style*="min-height: 100vh"],
html.atb-framed .opp-shell [style*="min-height:100dvh"],
html.atb-framed .opp-shell [style*="min-height: 100dvh"] { min-height: 0 !important; }
html.atb-framed .opp-shell h1 {
  font-size: clamp(28px, 4.4vw, 54px) !important;
  line-height: 1.06 !important;
}
html.atb-framed .atb-frame-cta { display: flex; justify-content: center; margin: 14px 0 6px; position: relative; z-index: 2; }
html.atb-framed .atb-frame-cta--top { padding: 14px 16px 0; margin: 0; }
html.atb-framed .atb-frame-cta > a { width: auto !important; max-width: 100%; }

/* QUIZ in a frame (Sheridan 2026-09-27: "quiz make it viewable without scroll"):
   question and its answers fit the first screen of a ~1000px exchange frame. */
html.atb-framed .qz-wrap { padding-top: 10px !important; padding-bottom: 24px !important; }
html.atb-framed .qz-head { margin-bottom: 12px !important; }
html.atb-framed .qz-eyebrow { margin-bottom: 8px !important; padding: 3px 10px !important; }
html.atb-framed .qz-head h1 { font-size: clamp(24px, 3.2vw, 32px) !important; }
html.atb-framed .qz-head p { margin-top: 6px !important; font-size: 14px !important; line-height: 1.4 !important; }
html.atb-framed .qz-meter { margin-bottom: 10px !important; }
html.atb-framed .qz-q { font-size: clamp(19px, 2.1vw, 23px) !important; }
html.atb-framed .qz-help { margin-top: 4px !important; font-size: 13px !important; }
html.atb-framed .qz-opts { margin-top: 12px !important; gap: 7px !important; }
html.atb-framed label.qz-opt { min-height: 44px !important; padding: 9px 14px !important; }


/* SHORT FRAMES (2026-09-27, from frame_observations: slots 200-480px tall, e.g.
   viralmailerforyou 750x200, hotwebsitetraffic 850x400, trafficadbar 300x450,
   hitsserver 500x250). The nav and the disclosure strip alone took ~140px of a
   200px slot. Compact them (the disclosure stays, one small line) and size the
   headline for the slot; lander-frame-fit.js adds a slim CTA bar if the page's own
   button still cannot be seen. */
html.atb-short nav.top .links,
html.atb-short nav.top .signin,
html.atb-short nav.top .lang-switch { display: none !important; }
html.atb-short nav.top { min-height: 0 !important; }
html.atb-short nav.top .container.row { min-height: 0 !important; padding-top: 4px !important; padding-bottom: 4px !important; height: auto !important; }
html.atb-short nav.top .brand { font-size: 16px !important; }
html.atb-short nav.top .btn { padding: 5px 12px !important; font-size: 12.5px !important; min-height: 0 !important; }
html.atb-short div[role="note"] { font-size: 10.5px !important; line-height: 1.3 !important; }
html.atb-short div[role="note"] > div { padding: 2px 12px !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html.atb-short .opp-shell h1, html.atb-short main h1 { font-size: clamp(18px, 3.2vw, 26px) !important; line-height: 1.12 !important; }
html.atb-short .atb-short-bar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 2147482000;
  display: flex; align-items: center; justify-content: center; gap: 10px;
  padding: 6px 10px; background: rgba(255,255,255,.96); box-shadow: 0 -6px 18px -8px rgba(0,0,0,.35);
}
html.atb-short .atb-short-bar a { font-size: 14px !important; padding: 8px 16px !important; min-height: 0 !important; line-height: 1.2 !important; width: auto !important; max-width: 100%; white-space: nowrap; }
html.atb-short .opp-shell { padding-bottom: 56px; }

/* NARROW FRAMES (<=520px wide: trafficadbar 300x450, hitsserver 500x250). The mobile
   layout already applies; below ~360px the nav's sign-in link and the long hero
   words still pushed the page sideways. */
html.atb-narrow body { overflow-x: hidden; }
html.atb-narrow nav.top .signin { display: none !important; }
html.atb-narrow nav.top .btn { padding: 5px 10px !important; font-size: 12px !important; }
html.atb-narrow h1 { font-size: clamp(20px, 8.2vw, 30px) !important; overflow-wrap: anywhere; }
/* No sideways scroll inside any exchange frame: decorative SVGs and nav rows ran
   4-14px past the slot edge (measured /saveclub at 850, / and /livegood at 300). */
html.atb-framed, html.atb-framed body { overflow-x: clip; }