/* 4NextSport — brand universe page (E04), identities: ts=navy vz=mint default=pine */
:root{--fnx-ink:#0A2423;--fnx-pine2:#123A33;--fnx-mint:#2FCFB0;--fnx-mintd:#1FA98E;--fnx-msoft:#DFF7F1;--fnx-navy:#1D2B3F;--fnx-slate:#5C6B68;--fnx-line:#E4E9E7;--fnx-paper:#F4F6F5}
.fnxbr{font-family:'Outfit',sans-serif;color:var(--fnx-ink)}
.fnxbr-wrap{max-width:1240px;margin:0 auto;padding:0 24px}

/* hero — identity backgrounds */
.fnxbr-hero{color:#fff;padding:60px 0;position:relative;overflow:hidden}
.fnxbr-ts .fnxbr-hero{background:radial-gradient(110% 130% at 85% 0%,rgba(90,130,200,.35),transparent 55%),linear-gradient(135deg,#22334E,var(--fnx-navy))}
.fnxbr-vz .fnxbr-hero{background:radial-gradient(110% 130% at 85% 0%,rgba(47,207,176,.3),transparent 55%),linear-gradient(135deg,var(--fnx-pine2),var(--fnx-ink))}
.fnxbr-default .fnxbr-hero{background:radial-gradient(110% 130% at 85% 0%,rgba(47,207,176,.18),transparent 55%),linear-gradient(135deg,#123A33,#0A2423)}
.fnxbr-herogrid{display:grid;grid-template-columns:1.05fr .95fr;gap:52px;align-items:center;position:relative;z-index:1}
.fnxbr-chip{display:inline-block;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;padding:6px 14px;border-radius:999px;margin-bottom:18px}
.fnxbr-logo{display:inline-block;background:#fff;border-radius:12px;padding:10px 18px;margin-bottom:16px}
.fnxbr-logo img{display:block;height:36px;width:auto;max-width:230px;object-fit:contain}
.fnxbr-logotext{display:block;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:34px;letter-spacing:-.01em;margin-bottom:12px}
.fnxbr-hero h1{font-family:'Space Grotesk',sans-serif;font-size:clamp(26px,3vw,36px);font-weight:700;line-height:1.15;margin:0 0 12px;color:#fff}
.fnxbr-hero p{color:rgba(255,255,255,.75);font-weight:300;max-width:48ch;margin:0 0 26px;font-size:15.5px;line-height:1.65}
.fnxbr-cta{display:inline-flex;align-items:center;gap:10px;background:var(--fnx-mint);color:var(--fnx-ink);border-radius:12px;padding:15px 26px;font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:15px;text-decoration:none;transition:filter .15s}
.fnxbr-cta:hover{filter:brightness(1.07);color:var(--fnx-ink)}
.fnxbr-cta span{transition:transform .15s}
.fnxbr-cta:hover span{transform:translateX(3px)}
.fnxbr-visual{height:300px;border-radius:20px;border:1px solid rgba(255,255,255,.15);position:relative;overflow:hidden}
.fnxbr-ts .fnxbr-visual{background:radial-gradient(120% 90% at 70% 20%,rgba(255,255,255,.14),transparent 55%),linear-gradient(160deg,#2A3D5C,#16223A)}
.fnxbr-vz .fnxbr-visual,.fnxbr-default .fnxbr-visual{background:radial-gradient(120% 90% at 70% 20%,rgba(47,207,176,.2),transparent 55%),linear-gradient(160deg,#16453C,#0A2423)}
.fnxbr-pc i{position:absolute;top:50%;left:52%;width:44%;aspect-ratio:1;border-left:2px solid rgba(255,255,255,.28);border-bottom:2px solid rgba(255,255,255,.28);transform:translate(-50%,-50%) rotate(45deg)}
.fnxbr-vz .fnxbr-pc i,.fnxbr-default .fnxbr-pc i{border-color:rgba(47,207,176,.4)}
.fnxbr-pc i:nth-child(2){width:62%;opacity:.55}
.fnxbr-pc i:nth-child(3){width:80%;opacity:.28}

/* body sections */
.fnxbr-body{padding:52px 24px 80px}
.fnxbr-sechead{margin:0 0 22px}
.fnxbr-eyebrow{display:block;font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--fnx-mintd);margin-bottom:8px}
.fnxbr-sechead h2{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:clamp(22px,2.4vw,30px);margin:0}

/* category cards */
.fnxbr-cats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:0 0 44px}
.fnxbr-cat{background:#fff;border:1px solid var(--fnx-line);border-radius:14px;padding:18px;display:flex;gap:14px;align-items:center;text-decoration:none;color:var(--fnx-ink);transition:transform .15s,box-shadow .15s}
.fnxbr-cat:hover{transform:translateY(-3px);box-shadow:0 14px 36px rgba(10,36,35,.1);color:var(--fnx-ink)}
.fnxbr-cat .ic{width:44px;height:44px;border-radius:11px;display:grid;place-items:center;flex-shrink:0;background:var(--fnx-msoft)}
.fnxbr-cat .ic svg{width:24px;height:24px;stroke:var(--fnx-mintd);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.fnxbr-ts .fnxbr-cat .ic{background:#E8EEF7}
.fnxbr-ts .fnxbr-cat .ic svg{stroke:var(--fnx-navy)}
.fnxbr-cat b{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:14.5px;display:block}
.fnxbr-cat small{font-size:12px;color:var(--fnx-slate)}

/* selection grid uses shop.css cards; spacing + bottom CTA */
.fnxbr-body ul.products{margin-bottom:34px!important}
.fnxbr-more{text-align:center}
.fnxbr-cta2{background:none;border:1.5px solid var(--fnx-line);color:var(--fnx-ink)}
.fnxbr-cta2:hover{border-color:var(--fnx-ink);filter:none;color:var(--fnx-ink)}

@media(max-width:1080px){
  .fnxbr-herogrid{grid-template-columns:1fr}
  .fnxbr-visual{height:220px}
  .fnxbr-cats{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:640px){
  .fnxbr-hero{padding:44px 0}
  .fnxbr-cats{grid-template-columns:1fr 1fr;gap:10px}
  .fnxbr-cat{padding:13px;gap:10px}
  .fnxbr-cat .ic{width:36px;height:36px}
  .fnxbr-body{padding:36px 24px 60px}
}
