/* KaddieIQ Golf Lab — the one page on the site explaining the verification
 * discipline behind every other page, rather than a product of its own.
 *
 * The hero uses the same min-height+flex pattern kiq-ballfit.css's
 * .bf-hero-img was just corrected to (see that file's own comment for the
 * bug this avoids): a fixed height on a box holding real body text will
 * eventually clip it at some viewport width, however generous the number
 * looks today. min-height plus content in normal flow can't repeat that.
 */

*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:400 17px/1.65 var(--body)}

.lab-hero-img{position:relative;width:100%;min-height:clamp(320px,46vw,520px);overflow:hidden;isolation:isolate;
  display:flex;flex-direction:column;justify-content:flex-end}
.lab-hero-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 58%;
  display:block;opacity:.94;mix-blend-mode:luminosity;
  -webkit-mask:linear-gradient(to bottom,#000 0%,#000 30%,transparent 75%);
  mask:linear-gradient(to bottom,#000 0%,#000 30%,transparent 75%)}
.lab-hero-scrim{position:absolute;inset:0;
  background:linear-gradient(to bottom,rgba(13,28,21,.0) 0%,rgba(13,28,21,.0) 32%,rgba(13,28,21,.74) 70%,rgba(13,28,21,.97) 100%)}
:root[data-theme="light"] .lab-hero-scrim{
  background:linear-gradient(to bottom,rgba(236,239,228,.0) 0%,rgba(236,239,228,.0) 32%,rgba(236,239,228,.76) 70%,rgba(236,239,228,.99) 100%)}
@media(prefers-color-scheme:light){:root[data-theme="system"] .lab-hero-scrim{
  background:linear-gradient(to bottom,rgba(236,239,228,.0) 0%,rgba(236,239,228,.0) 32%,rgba(236,239,228,.76) 70%,rgba(236,239,228,.99) 100%)}}

.lab-hero-body{position:relative;padding:clamp(24px,4vw,48px) clamp(20px,5vw,60px) clamp(32px,5vw,52px)}
.lab-kicker{font:var(--fw-label) 11px/1 var(--head);letter-spacing:.14em;text-transform:uppercase;
  color:rgba(255,255,255,.72);display:block;margin-bottom:14px}
:root[data-theme="light"] .lab-kicker,:root[data-theme="system"] .lab-kicker{color:var(--gold-hi)}
.lab-h1{font:var(--fw-display) clamp(32px,5.8vw,60px)/1.08 var(--head);letter-spacing:-.02em;color:#fff;
  margin-bottom:18px;text-shadow:0 2px 18px rgba(0,0,0,.35);max-width:16ch}
:root[data-theme="light"] .lab-h1,:root[data-theme="system"] .lab-h1{color:var(--ink);text-shadow:none}
.lab-lede{font-size:clamp(15px,1.8vw,18px);line-height:1.65;color:rgba(255,255,255,.84);max-width:56ch;
  margin-bottom:26px;text-shadow:0 1px 8px rgba(0,0,0,.25)}
:root[data-theme="light"] .lab-lede,:root[data-theme="system"] .lab-lede{color:var(--soft);text-shadow:none}

.lab-cta-row{display:flex;gap:12px;flex-wrap:wrap}

.lab-enter{padding:clamp(40px,7vw,80px) clamp(20px,5vw,60px);text-align:center;border-top:1px solid var(--rule)}
.lab-enter-label{font:var(--fw-label) 11px/1 var(--head);letter-spacing:.14em;text-transform:uppercase;color:var(--gold-hi);margin-bottom:14px}
.lab-enter h2{font:var(--fw-display) clamp(26px,4vw,42px)/1.1 var(--head);color:var(--ink);margin-bottom:12px;letter-spacing:-.01em}
.lab-enter p{color:var(--soft);margin-bottom:28px;font-size:15px;max-width:50ch;margin-left:auto;margin-right:auto}