/*
Theme Name: TAB Signup
Theme URI: https://signup.tab.co.za
Description: Ultra-lean single-page theme for the TAB fixed-odds signup landing. One page, no chrome, no logos, no scripts. Portable — built on sportportal.co.za, deployed as-is to signup.tab.co.za.
Version: 0.1.0
Author: sportportal
Text Domain: tab-signup
*/

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html,body{margin:0;padding:0;background:#fff;color:#1a1a1a}
body{font:400 16px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;height:auto;display:block}
a{color:inherit}

.sp-wrap{max-width:1120px;margin:0 auto;padding:0}

.sp-hero{position:relative;overflow:hidden;min-height:clamp(360px,42vw,560px);background:#0b0b0b;display:flex;align-items:flex-end}
.sp-hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;z-index:0}
.sp-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.35) 55%,rgba(0,0,0,.75) 100%);z-index:1;pointer-events:none}
.sp-hero-copy{position:relative;z-index:2;width:100%;max-width:1120px;margin:0 auto;padding:clamp(28px,5vw,64px) clamp(18px,4vw,42px);color:#fff}
.sp-hero-copy h1{margin:0 0 8px;font:800 clamp(32px,5.2vw,58px)/1.02 inherit;letter-spacing:-.02em;color:#fff;text-shadow:0 2px 14px rgba(0,0,0,.45)}
.sp-hero-copy .lede{margin:0 0 10px;font:700 clamp(17px,2.2vw,26px)/1.25 inherit;color:#fff;text-shadow:0 1px 10px rgba(0,0,0,.45)}
.sp-hero-copy .body{margin:0;font-size:clamp(14px,1.5vw,17px);line-height:1.55;max-width:720px;color:rgba(255,255,255,.94);text-shadow:0 1px 10px rgba(0,0,0,.45)}

.sp-card{background:#efefef;border-radius:0 0 18px 18px;overflow:hidden;box-shadow:0 10px 28px rgba(0,0,0,.14)}

.sp-frame{position:relative;padding:8px 14px 0;min-height:400px}
.sp-frame .note{position:absolute;inset:8px 14px 0;display:flex;align-items:center;justify-content:center;color:#666;font-size:14px;background:#fff;border:1px dashed #bbb;border-radius:12px;text-align:center;padding:20px}
.sp-iframe{position:relative;display:block;width:100%;height:1680px;border:0;background:transparent;border-radius:12px}

.sp-copy{padding:24px 42px 10px;color:#222}
.sp-copy h2{margin:0 0 8px;font:700 20px/1.3 inherit;color:#1a1a1a}
.sp-copy p{margin:0 0 16px;line-height:1.7;color:#333}

.sp-legal{background:#111;color:#fff;padding:28px 42px;text-align:center}
.sp-legal p{margin:0 0 14px;font-size:15px;line-height:1.65}
.sp-legal strong{font-weight:700}
.sp-legal .links{margin:0}
.sp-legal .links a{color:#fff;text-decoration:underline}
.sp-legal .links span{display:inline-block;padding:0 8px;opacity:.7}

@media (max-width:782px){
  .sp-wrap{max-width:none}
  .sp-hero{min-height:clamp(420px,85vw,560px)}
  .sp-hero-copy{padding:26px 18px 28px}
  .sp-card{border-radius:0;box-shadow:none}
  .sp-frame{padding:8px 0 0}
  .sp-frame .note{inset:8px 0 0;border-radius:0;border-left:0;border-right:0}
  .sp-iframe{height:1880px;border-radius:0}
  .sp-copy{padding:20px 18px 8px}
  .sp-legal{padding:24px 18px}
  .sp-legal .links span{padding:0 5px}
}