/* TennisFinalsPro night hero. Scoped exclusively to #hero.tfp-night-hero. */
#hero.tfp-night-hero { position:relative; isolation:isolate; width:100%; margin:0; padding:56px 0 42px; overflow:hidden; color:#fff; font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif; background:#050b14; }
#hero.tfp-night-hero::before { content:""; position:absolute; inset:0; z-index:-2; pointer-events:none; background:linear-gradient(90deg,#050b14a6 0%,#050b1460 55%,#050b1440),url('/frontend/img/hero-premium/night-court.webp') center 58%/cover no-repeat; }
#hero.tfp-night-hero::after { content:""; position:absolute; inset:0; z-index:-1; pointer-events:none; background:linear-gradient(0deg,#050b14 0%,transparent 28%),radial-gradient(ellipse at 73% 44%,#0861ad25,transparent 43%); }
#hero.tfp-night-hero * { box-sizing:border-box; }
#hero.tfp-night-hero :is(a,button):focus-visible,#hero.tfp-night-hero #heroAppBadge:focus-visible { outline:3px solid #b2e6ff; outline-offset:5px; }
#hero.tfp-night-hero [hidden] { display:none!important; }
#hero .nhr-inner { width:min(1480px,calc(100% - 64px)); margin:0 auto; display:grid; grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); align-items:center; gap:20px 42px; }
#hero .nhr-content { min-width:0; }
#hero .nhr-eyebrow { display:flex; align-items:center; gap:15px; margin:0 0 24px; }
#hero .nhr-app { flex-shrink:0; display:flex; flex-direction:column; align-items:flex-start; gap:3px; padding:8px 11px; border:1px solid #3aa5ed80; border-radius:9px; background:#07172b99; font-size:11px; color:#72b6ff; }
#hero #heroAppBadgeLabel { font-size:11px; letter-spacing:1px; font-weight:650; }
#hero #heroAppBadgeStatus { color:#a6bdd4; font-size:9px; font-weight:450; }
#hero #installAppBtn { min-height:36px; background:#1463e3; color:#fff; border:0; padding:6px 8px; cursor:pointer; }
#hero #heroAppBadge.is-install-ready { cursor:pointer; }
#hero .nhr-online { display:flex; align-items:center; gap:9px; max-width:260px; color:#bccddd; font-size:11px; line-height:1.5; }
#hero .nhr-online i { width:7px; height:7px; flex-shrink:0; border-radius:50%; background:#66ed98; box-shadow:0 0 12px #45e98966; }
#hero #nhr-title { margin:0; color:white; font-size:clamp(42px,4.2vw,68px); line-height:1.08; letter-spacing:-2.6px; font-weight:800; }
#hero .nhr-line { display:block; }
#hero .nhr-line--last { font-size:.72em; margin-top:8px; letter-spacing:-1.5px; }
#hero .nhr-accent,#hero #nhr-title>span:not(.nhr-line) { color:#85e7b1; background:linear-gradient(100deg,#29cfeb,#86e5be 55%,#e3f578); background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
#hero .nhr-intro { margin:24px 0 0; color:#b8cbe0; font-size:16px; line-height:1.7; max-width:520px; }
#hero .nhr-actions { display:flex; flex-wrap:wrap; gap:13px; margin-top:27px; }
#hero .nhr-cta { display:inline-flex; align-items:center; justify-content:center; gap:22px; min-height:54px; min-width:195px; padding:12px 24px; border:1px solid transparent; border-radius:9px; text-decoration:none; font-size:14px; font-weight:650; transition:background .18s,box-shadow .18s; }
#hero .nhr-cta--primary { background:#0866ff; color:white; box-shadow:0 7px 30px #004bca26; }
#hero .nhr-cta--primary:hover { background:#287aff; box-shadow:0 7px 28px #0866ff44; }
#hero .nhr-cta--secondary { background:#f5f8ff; color:#10213a; }
#hero .nhr-cta--secondary:hover { background:#dfeaff; }
#hero .nhr-network { position:relative; height:550px; min-width:0; width:100%; }
#hero .nhr-orbit { position:absolute; inset:0; width:100%; height:100%; fill:none; stroke:#288bb8; stroke-width:1; opacity:.3; pointer-events:none; }
#hero .nhr-ball { position:absolute; width:35%; aspect-ratio:1; left:50%; top:47%; transform:translate(-50%,-50%); pointer-events:none; }
#hero .nhr-ball::before { content:""; position:absolute; inset:-35%; background:radial-gradient(ellipse,#168ace38,transparent 65%); z-index:-1; }
#hero .nhr-ball::after { content:""; position:absolute; width:90%; height:13%; bottom:-4%; left:5%; border:1px solid #26a5df4d; border-radius:50%; background:#08162970; box-shadow:0 0 25px #048cff26; }
#hero .nhr-ball img { display:block; width:100%; height:auto; filter:drop-shadow(0 8px 18px #007bc233); animation:nhr-float 7s ease-in-out infinite; }
#hero .nhr-node { --node-color:#7abaff; position:absolute; z-index:2; display:flex; align-items:center; gap:11px; width:36%; min-height:88px; padding:15px 13px; border:1px solid #278ac180; border-radius:11px; background:linear-gradient(130deg,#0a2033ef,#040d19f5); color:#fff; text-decoration:none; box-shadow:0 8px 25px #0004; transition:background .2s,border-color .2s,box-shadow .2s; }
#hero .nhr-node:hover { background:#102b43f5; border-color:var(--node-color); box-shadow:0 0 24px #2585d329; }
#hero .nhr-node--top { top:0; left:32%; --node-color:#b093ff; }
#hero .nhr-node--left { top:23%; left:0; }
#hero .nhr-node--right { top:23%; right:0; --node-color:#fb82ae; }
#hero .nhr-node--bottom-left { top:60%; left:0; --node-color:#5ae0b1; }
#hero .nhr-node--bottom-right { top:60%; right:0; --node-color:#f3c165; }
#hero .nhr-node--bottom { top:83%; left:32%; --node-color:#ba96ff; }
#hero .nhr-icon { flex-shrink:0; width:39px; height:43px; display:flex; align-items:center; justify-content:center; border:1px solid currentColor; border-radius:9px; color:var(--node-color); background:#ffffff04; }
#hero .nhr-icon svg { width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
#hero .nhr-copy { min-width:0; }
#hero .nhr-copy strong { display:block; color:#f6f9ff; font-size:15px; font-weight:650; line-height:1.25; }
#hero .nhr-copy small { display:block; color:#afc3d8; font-size:10px; line-height:1.45; margin-top:5px; }
#hero .nhr-node em { font-style:normal; font-size:24px; font-weight:300; color:#b6d2ed; margin-left:auto; }
#hero .nhr-hint { position:absolute; top:100%; left:0; width:100%; text-align:center; margin:13px 0 0; font-size:11px; color:#8eafcd; }
#hero .nhr-metrics { grid-column:1/-1; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); width:min(950px,100%); margin:58px auto 0; gap:16px; }
#hero .nhr-metrics>div { display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:84px; padding:12px; border:1px solid #90b5d833; border-radius:10px; background:#071320c7; }
#hero .nhr-metrics strong { font-size:30px; line-height:1.2; color:#f3f7ff; font-weight:700; }
#hero .nhr-metrics span { font-size:12px; color:#a8bfd5; margin-top:4px; }
@keyframes nhr-float { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-8px); } }
@media(max-width:1200px) {
 #hero.tfp-night-hero { padding:40px 0 32px; }
 #hero .nhr-inner { width:calc(100% - 48px); gap:18px 26px; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); }
 #hero #nhr-title { font-size:clamp(38px,4.1vw,52px); letter-spacing:-1.8px; }
 #hero .nhr-network { height:490px; }
 #hero .nhr-node { min-height:80px; padding:12px 10px; gap:8px; width:37%; }
 #hero .nhr-node--top,#hero .nhr-node--bottom { left:31.5%; }
 #hero .nhr-icon { width:30px; height:36px; }
 #hero .nhr-icon svg { width:21px; height:21px; }
 #hero .nhr-copy strong { font-size:13px; }
 #hero .nhr-copy small { font-size:9px; }
 #hero .nhr-node em { display:none; }
 #hero .nhr-cta { min-width:0; padding:12px 18px; font-size:13px; gap:12px; }
 #hero .nhr-intro { font-size:14px; }
}
@media(max-width:900px) {
 #hero .nhr-inner { grid-template-columns:1fr; width:min(700px,calc(100% - 40px)); gap:28px; }
 #hero .nhr-content { text-align:center; }
 #hero .nhr-eyebrow,#hero .nhr-actions { justify-content:center; }
 #hero #nhr-title { font-size:52px; }
 #hero .nhr-intro { margin:18px auto 0; }
 #hero .nhr-network { height:500px; }
 #hero .nhr-node { width:35%; min-height:83px; padding:14px; }
 #hero .nhr-node--top,#hero .nhr-node--bottom { left:32.5%; }
 #hero .nhr-node em { display:block; }
 #hero .nhr-copy strong { font-size:14px; }
 #hero .nhr-copy small { font-size:10px; }
 #hero .nhr-metrics { margin-top:24px; gap:10px; }
}
@media(max-width:600px) {
 #hero.tfp-night-hero { padding:28px 0; }
 #hero.tfp-night-hero::before { background-position:65% top; opacity:.72; }
 #hero .nhr-inner { width:calc(100% - 28px); gap:23px; }
 #hero .nhr-eyebrow { gap:10px; margin-bottom:18px; }
 #hero .nhr-app { padding:6px 8px; }
 #hero .nhr-online { font-size:9px; text-align:left; max-width:200px; }
 #hero #nhr-title { font-size:clamp(34px,9.5vw,49px); letter-spacing:-1.4px; }
 #hero .nhr-line--last { letter-spacing:-.6px; font-size:.69em; }
 #hero .nhr-intro { font-size:12px; margin-top:15px; }
 #hero .nhr-actions { gap:10px; margin-top:19px; flex-wrap:nowrap; }
 #hero .nhr-cta { flex:1; min-height:48px; font-size:12px; padding:11px 8px; gap:8px; }
 #hero .nhr-network { height:auto; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; padding-top:152px; }
 #hero .nhr-orbit { display:none; }
 #hero .nhr-ball { width:137px; height:137px; left:50%; top:0; transform:translateX(-50%); }
 #hero .nhr-node { position:relative; inset:auto; width:auto; min-height:91px; padding:12px 9px; gap:9px; }
 #hero .nhr-copy strong { font-size:13px; }
 #hero .nhr-copy small { font-size:10px; }
 #hero .nhr-node em { display:none; }
 #hero .nhr-icon { width:30px; height:36px; border-radius:7px; }
 #hero .nhr-hint { position:static; grid-column:1/-1; margin:5px 0 0; font-size:10px; }
 #hero .nhr-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); margin-top:0; gap:10px; }
 #hero .nhr-metrics>div { min-height:68px; padding:9px; }
 #hero .nhr-metrics strong { font-size:25px; }
 #hero .nhr-metrics span { font-size:11px; }
}
@media(prefers-reduced-motion:reduce) { #hero .nhr-ball img { animation:none; } #hero :is(.nhr-node,.nhr-cta) { transition:none; } }