/* DigiWrist News — house style (matches travel/football DWT properties) */
:root{
  --bg:#05080f; --bg2:#0a1020; --card:#0c1428; --card2:#111a30;
  --tx:#e8eefc; --mut:#8da2c8; --dim:#5b6d94;
  --blue:#3b82f6; --blue2:#60a5fa; --cyan:#22d3ee; --red:#f87171;
  --h:'Space Grotesk',sans-serif; --b:'Inter',sans-serif; --m:'JetBrains Mono',ui-monospace,monospace;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--tx);font:400 17px/1.65 var(--b);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block;border-radius:12px}
a{color:var(--blue2);text-decoration:none}
a:hover{color:var(--cyan)}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
.narrow{max-width:720px;margin:0 auto;padding:0 20px}

header.site{position:sticky;top:0;z-index:100;background:rgba(5,8,15,.92);backdrop-filter:blur(10px);border-bottom:1px solid #16223e}
header.site .bar{display:flex;align-items:center;gap:16px;padding:14px 20px;max-width:1080px;margin:0 auto}
header.site img{height:34px;width:auto;border-radius:0}
header.site .tag{font:500 12px var(--m);color:var(--cyan);letter-spacing:.12em;text-transform:uppercase}
header.site nav{margin-left:auto;display:flex;gap:22px}
header.site nav a{color:var(--mut);font:500 14px var(--b)}
header.site nav a:hover{color:var(--tx)}

.hero{padding:56px 0 40px}
.kicker{font:600 12px var(--m);color:var(--cyan);letter-spacing:.14em;text-transform:uppercase}
h1{font:700 clamp(30px,5.4vw,52px)/1.12 var(--h);margin:12px 0 14px;letter-spacing:-.01em}
.lede{color:var(--mut);font-size:19px;max-width:640px}

.feature{display:grid;grid-template-columns:1.15fr 1fr;gap:28px;align-items:center;background:linear-gradient(135deg,var(--card),var(--bg2));border:1px solid #1a2a4d;border-radius:18px;padding:28px;margin:36px 0}
.feature h2{font:700 clamp(22px,3.4vw,32px)/1.18 var(--h);margin:10px 0 12px}
.feature p{color:var(--mut)}
.feature .cta-row{margin-top:20px}

.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:22px;padding:8px 0 56px}
.card{background:var(--card);border:1px solid #16223e;border-radius:16px;overflow:hidden;display:flex;flex-direction:column;transition:transform .2s ease,border-color .2s ease}
.card:hover{transform:translateY(-3px);border-color:#2b4680}
.card img{border-radius:0;aspect-ratio:16/9;object-fit:cover}
.card .pad{padding:18px 20px 22px;display:flex;flex-direction:column;gap:8px;flex:1}
.card h3{font:600 19px/1.3 var(--h)}
.card h3 a{color:var(--tx)}
.card h3 a:hover{color:var(--blue2)}
.card p{color:var(--mut);font-size:15px;flex:1}
.meta{font:500 12px var(--m);color:var(--dim);letter-spacing:.06em;text-transform:uppercase}

.btn{display:inline-block;background:var(--blue);color:#fff;font:600 15px var(--b);padding:13px 26px;border-radius:10px;cursor:pointer;min-height:44px;transition:background .2s}
.btn:hover{background:var(--blue2);color:#fff}
.btn.ghost{background:transparent;border:1px solid #2b4680;color:var(--blue2)}
.btn.ghost:hover{border-color:var(--blue2)}
.cta-row{display:flex;gap:14px;flex-wrap:wrap}

article{padding:48px 0 24px}
article .date{font:500 13px var(--m);color:var(--dim);margin-bottom:8px;display:block}
article h1{max-width:22ch}
article h2{font:700 clamp(21px,3vw,28px)/1.25 var(--h);margin:40px 0 14px}
article h3{font:600 19px var(--h);margin:28px 0 10px}
article p{margin:0 0 18px;max-width:68ch}
article ul,article ol{margin:0 0 18px 22px;max-width:64ch}
article li{margin-bottom:8px;color:var(--tx)}
article li::marker{color:var(--cyan)}
article figure{margin:28px 0}
article figcaption{font:400 13px var(--b);color:var(--dim);margin-top:10px}
article blockquote{border-left:3px solid var(--cyan);padding:6px 0 6px 20px;margin:24px 0;color:var(--mut);font-size:18px}
article table{width:100%;border-collapse:collapse;margin:24px 0;font-size:15px}
article th{font:600 13px var(--m);color:var(--cyan);text-transform:uppercase;letter-spacing:.08em;text-align:left;padding:10px 12px;border-bottom:1px solid #2b4680}
article td{padding:12px;border-bottom:1px solid #16223e;color:var(--tx);vertical-align:top}
article td:first-child{color:var(--mut)}
.tablewrap{overflow-x:auto}
.stat-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:14px;margin:28px 0}
.stat{background:var(--card);border:1px solid #16223e;border-radius:14px;padding:18px}
.stat .n{font:700 30px var(--h);color:var(--blue2)}
.stat .l{font:500 12px var(--m);color:var(--dim);text-transform:uppercase;letter-spacing:.08em;margin-top:4px}
details{background:var(--card);border:1px solid #16223e;border-radius:12px;margin:0 0 12px;max-width:68ch}
details summary{font:600 16px var(--h);padding:16px 18px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;min-height:44px}
details summary::after{content:"+";color:var(--cyan);font:600 20px var(--m)}
details[open] summary::after{content:"–"}
details .a{padding:0 18px 16px;color:var(--mut)}
.callout{background:linear-gradient(135deg,var(--card),var(--bg2));border:1px solid #1a2a4d;border-radius:16px;padding:26px;margin:36px 0}
.callout h2{margin-top:0}

footer.site{border-top:1px solid #16223e;margin-top:48px;padding:36px 0 44px;color:var(--dim);font-size:14px}
footer.site .cols{display:flex;gap:40px;flex-wrap:wrap;justify-content:space-between;max-width:1080px;margin:0 auto;padding:0 20px}
footer.site a{color:var(--mut)}
footer.site a:hover{color:var(--tx)}
footer.site ul{list-style:none;display:flex;flex-direction:column;gap:8px}
footer.site .ft-h{font:600 12px var(--m);color:var(--dim);text-transform:uppercase;letter-spacing:.1em;margin-bottom:10px}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}html{scroll-behavior:auto}}
@media (max-width:760px){
  .feature{grid-template-columns:1fr;padding:20px}
  header.site nav{gap:14px}
  header.site .tag{display:none}
  body{font-size:16px}
  .hero{padding:36px 0 24px}
}