@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800;900&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{--bg:#101413;--fg:#f4f4ee;--accent:#b9ec5b;--muted:#a9afaa}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--fg);font-family:'DM Sans',Arial,sans-serif}header{height:86px;display:flex;align-items:center;justify-content:space-between;padding:0 6%;background:#f8f8f5;color:#111;position:relative;z-index:2}.brand img{width:205px;height:68px;object-fit:contain;mix-blend-mode:multiply}nav{display:flex;gap:34px;align-items:center}nav a{color:#151515;text-decoration:none;font-size:13px;font-weight:700}nav .navcta{background:#101413;color:white;padding:14px 20px}.hero{height:min(850px,calc(100svh - 86px));min-height:600px;position:relative;overflow:hidden}.heroPhoto{position:absolute;inset:0;background-image:url('assets/court.jpg');background-position:center 47%;background-size:cover}.shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,11,9,.92),rgba(4,11,9,.65) 40%,rgba(4,11,9,.12) 85%),linear-gradient(0deg,rgba(4,11,9,.55),transparent 55%)}.heroContent{position:relative;z-index:1;padding:clamp(90px,11vw,170px) 6% 0;max-width:920px}.eyebrow,.kicker{font-size:12px;letter-spacing:3px;font-weight:700}.dot{display:inline-block;background:var(--accent);width:8px;height:8px;border-radius:50%;margin-right:12px}h1,h2{font-family:'Barlow Condensed','Arial Narrow',sans-serif;letter-spacing:-1px;font-weight:800;line-height:.88;margin:24px 0}h1{font-size:clamp(85px,11.3vw,175px)}h1 em{color:var(--accent);font-style:normal}.heroContent p{font-size:16px;line-height:1.7;max-width:440px;color:#e2e8e2}.button{display:inline-flex;align-items:center;gap:55px;padding:19px 23px;background:var(--accent);color:#0e160d;text-decoration:none;font-weight:800;font-size:13px;margin-top:25px}.button span{font-size:20px}.heroSide{position:absolute;right:4%;bottom:35px;font-size:11px;letter-spacing:2px;writing-mode:vertical-rl}.intro{display:grid;grid-template-columns:1fr 1fr;gap:8%;padding:135px 9%;align-items:center;background:#f3f3ee;color:#121714}.kicker{color:#638329}.intro h2,.details h2,.buy h2{font-size:clamp(65px,7vw,115px)}.intro h2 span{color:#7c897c}.intro p,.detailText p{max-width:460px;font-size:16px;line-height:1.85;color:#616a62}.productPhoto{background:#fff;padding:30px 40px 20px;display:flex;align-items:center;flex-direction:column}.productPhoto img{height:590px;max-height:65vw;max-width:100%;object-fit:contain}.productPhoto span{font-size:10px;letter-spacing:2px;color:#777}.statement{padding:125px 6%;text-align:center;background:var(--accent);color:#101413}.statement>span{font-size:12px;letter-spacing:3px;font-weight:800}.statement h2{font-size:clamp(70px,9vw,145px);margin:30px 0 0}.statement i{font-style:normal;color:#567727}.details{display:grid;grid-template-columns:1fr 1fr;min-height:670px}.detailPhoto img{width:100%;height:100%;object-fit:cover}.detailText{padding:110px 11%;display:flex;flex-direction:column;justify-content:center}.detailText .kicker{color:var(--accent)}.detailText p{color:#a9b1aa}.smallLine{border-top:1px solid #4c544e;margin-top:30px;padding-top:22px;font-size:11px;letter-spacing:2px;display:flex;justify-content:space-between}.buy{background:#e7ebe4;color:#101413;display:grid;grid-template-columns:1fr 1fr;gap:10%;padding:125px 9%}.buy h2 i{font-style:normal;color:#6e8b49}.buy p{line-height:1.7}.buyBox{background:white;padding:48px;align-self:center}.buyHeading{font-weight:800;letter-spacing:2px}.price{font-family:'Barlow Condensed',sans-serif;font-size:68px;font-weight:800;margin-top:15px}.buyBox p{color:#677066;font-size:14px}.buySlot{border:1px dashed #9aa69b;padding:25px;font-size:13px;line-height:1.6;color:#596259}footer{display:flex;justify-content:space-between;align-items:center;gap:20px;background:#f8f8f5;color:#252a25;padding:25px 6%;font-size:10px;letter-spacing:1.5px}footer img{width:140px;height:48px;object-fit:contain;mix-blend-mode:multiply}@media(max-width:760px){header{height:74px;padding:0 5%}.brand img{width:155px}nav{gap:12px}nav a:not(.navcta){display:none}nav .navcta{font-size:11px;padding:12px}.hero{height:740px;min-height:0}.heroPhoto{background-position:55% center}.shade{background:linear-gradient(90deg,rgba(4,11,9,.9),rgba(4,11,9,.5)),linear-gradient(0deg,rgba(4,11,9,.6),transparent)}.heroContent{padding:125px 6% 0}h1{font-size:clamp(72px,17vw,110px)}.heroContent p{font-size:14px;max-width:330px}.intro,.details,.buy{grid-template-columns:1fr}.intro{padding:75px 6%;gap:40px}.intro h2,.details h2,.buy h2{font-size:75px}.productPhoto img{height:450px;max-height:none}.statement{padding:90px 5%}.statement h2{font-size:70px}.detailPhoto{height:470px}.detailText{padding:75px 7%}.buy{padding:80px 6%;gap:35px}.buyBox{padding:30px}footer{flex-wrap:wrap}footer span{font-size:9px}}

/* Version 4: integrated hero commerce */
.hero{min-height:820px;height:auto;display:flex;align-items:center}
.heroPhoto{background-position:center 46%}
.shade{background:linear-gradient(90deg,rgba(4,11,9,.95) 0%,rgba(4,11,9,.88) 29%,rgba(4,11,9,.43) 63%,rgba(4,11,9,.1) 100%),linear-gradient(0deg,rgba(4,11,9,.62),transparent 50%)}
.heroContent{padding:46px 6% 70px;max-width:850px;width:100%}
.heroBrand{display:block;width:min(410px,65%);margin-bottom:42px;background:#f8f8f5;padding:12px 20px;border-radius:2px}
.heroBrand img{display:block;width:100%;height:auto;mix-blend-mode:multiply}
.hero h1{font-size:clamp(78px,8.7vw,132px);margin:20px 0 20px}
.heroProduct{max-width:560px;background:rgba(10,19,15,.65);border:1px solid rgba(255,255,255,.2);padding:24px 28px;backdrop-filter:blur(8px)}
.heroProductTitle{font-weight:800;letter-spacing:1.5px;font-size:16px}.heroProductTitle span{font-size:11px;font-weight:600;color:#c4cec4}
.heroProduct p{max-width:none;margin:13px 0 18px;font-size:14px;line-height:1.65;color:#f0f3ee}
.heroFeatures{display:flex;flex-wrap:wrap;gap:8px}.heroFeatures span{font-size:11px;padding:8px 10px;border:1px solid #738575;color:#e5eee3}
.heroPurchase{display:flex;gap:24px;align-items:center;flex-wrap:wrap;margin-top:20px}.heroPurchase strong{font-family:'Barlow Condensed',sans-serif;font-size:46px;white-space:nowrap;line-height:1}
.heroPurchase .button{margin:0;gap:24px;padding:17px 19px}.heroMore{display:inline-block;margin-top:20px;color:#e9f4e9;font-size:12px;text-decoration:none;letter-spacing:1px}
.detailList{list-style:none;padding:0;margin:20px 0 8px;border-top:1px solid #465049}.detailList li{padding:12px 0;border-bottom:1px solid #465049;color:#d2dbd3;font-size:13px;line-height:1.5}.detailList b{color:#fff}
.bottomCta{background:#e7ebe4;color:#101413;display:flex;align-items:center;justify-content:space-between;gap:40px;padding:85px 9%}.bottomCta h2{font-size:clamp(54px,6vw,96px)}.bottomCta h2 i{font-style:normal;color:#668743}.bottomCta .button{margin:0;white-space:nowrap}
footer{min-height:150px;padding:30px 6%}footer img{width:310px;height:auto;max-height:120px}
@media(max-width:760px){.hero{min-height:0;height:auto;display:block}.heroPhoto{background-position:60% center}.shade{background:linear-gradient(90deg,rgba(4,11,9,.9),rgba(4,11,9,.57)),linear-gradient(0deg,rgba(4,11,9,.7),transparent)}.heroContent{padding:32px 5% 68px}.heroBrand{width:min(300px,82%);margin-bottom:58px;padding:10px 15px}.hero h1{font-size:clamp(67px,14vw,104px);margin:16px 0 25px}.heroProduct{padding:19px 17px}.heroProduct p{font-size:13px}.heroPurchase{gap:16px}.heroPurchase strong{font-size:43px}.heroPurchase .button{width:100%;justify-content:space-between}.heroSide{display:none}.bottomCta{padding:65px 6%;flex-direction:column;align-items:flex-start;gap:12px}.bottomCta h2{font-size:clamp(54px,12vw,78px)}.bottomCta .button{white-space:normal}footer{flex-direction:column;align-items:flex-start;gap:15px}footer img{width:min(310px,80vw)}}
@media(min-width:761px) and (max-width:1050px){.heroContent{max-width:710px}.hero h1{font-size:100px}.heroBrand{width:350px}}

/* Version 5 — transparent brand integrated in hero, SPOKE-inspired placement */
.hero{min-height:830px;align-items:stretch}
.heroContent{max-width:100%;padding:0 6% 80px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}
.heroBrand{position:absolute;top:24px;left:6%;z-index:3;width:clamp(255px,28vw,420px);margin:0;padding:0;background:none;border:0;border-radius:0}
.heroBrand img{width:100%;height:auto;display:block;mix-blend-mode:normal;filter:brightness(0) invert(1);object-fit:contain}
.hero .eyebrow{margin-top:110px}
.hero h1{font-size:clamp(76px,8.3vw,126px)}
.heroProduct{background:rgba(7,18,13,.47);border:1px solid rgba(255,255,255,.15);backdrop-filter:blur(5px)}
.shade{background:linear-gradient(90deg,rgba(4,11,9,.91),rgba(4,11,9,.73) 33%,rgba(4,11,9,.12) 83%),linear-gradient(0deg,rgba(4,11,9,.45),transparent 60%)}
@media(max-width:760px){.hero{min-height:850px}.heroContent{padding:145px 5% 60px;justify-content:flex-start}.heroBrand{top:22px;left:5%;width:min(310px,76vw)}.hero .eyebrow{margin-top:20px}.hero h1{font-size:clamp(67px,14vw,102px)}.heroProduct{background:rgba(7,18,13,.68)}.shade{background:linear-gradient(90deg,rgba(4,11,9,.88),rgba(4,11,9,.5)),linear-gradient(0deg,rgba(4,11,9,.7),transparent)}}
/* Version 6: restrained corner logo, zoomed-out hero and breathing room */
.hero{background:#0b1714;min-height:900px}
.heroPhoto{background-size:auto 100%;background-repeat:no-repeat;background-position:right center}
.shade{background:linear-gradient(90deg,#07130ff2 0%,#07130fe6 32%,#07130f8c 57%,#07130f10 100%)}
.heroBrand{top:22px;left:4%;width:clamp(105px,9.3vw,140px)}
.heroContent{padding-left:6%;padding-right:6%;max-width:780px}
.hero .eyebrow{margin-top:95px}
.hero h1{font-size:clamp(68px,7.6vw,112px)}
@media(max-width:760px){.hero{min-height:890px}.heroPhoto{background-size:auto 100%;background-position:70% center;opacity:.67}.shade{background:linear-gradient(90deg,#07130ff0,#07130fc2 60%,#07130f6b)}.heroBrand{top:18px;left:5%;width:105px}.heroContent{padding:130px 5% 65px}.hero .eyebrow{margin-top:12px}.hero h1{font-size:clamp(62px,13vw,90px)}}

/* Version 7 — original integrated full-bleed hero and watermark logo */
.hero{min-height:860px;background:#07130f;overflow:hidden}
.heroPhoto{inset:0;background-image:url('assets/court.jpg');background-size:cover;background-position:center 47%;opacity:1}
.shade{background:linear-gradient(90deg,rgba(4,11,9,.94) 0%,rgba(4,11,9,.84) 29%,rgba(4,11,9,.34) 65%,rgba(4,11,9,.08) 100%),linear-gradient(0deg,rgba(4,11,9,.52),transparent 62%)}
.heroBrand{position:absolute;top:18px;left:4%;width:clamp(115px,11vw,165px);height:auto;background:transparent!important;padding:0!important;box-shadow:none!important;opacity:.78;mix-blend-mode:screen}
.heroBrand img{display:block;width:100%;height:auto;filter:brightness(0) invert(1);mix-blend-mode:screen}
.heroContent{max-width:850px;padding-left:6%;padding-right:6%}
.hero .eyebrow{margin-top:100px}
.heroProduct{max-width:560px}
@media(max-width:760px){.hero{min-height:900px}.heroPhoto{background-size:cover;background-position:57% center;opacity:1}.shade{background:linear-gradient(90deg,rgba(4,11,9,.94),rgba(4,11,9,.58)),linear-gradient(0deg,rgba(4,11,9,.66),transparent)}.heroBrand{top:15px;left:5%;width:120px}.heroContent{padding:135px 5% 65px}.hero .eyebrow{margin-top:10px}.hero h1{font-size:clamp(62px,13vw,90px)}}

/* Version 8: new hero image and demonstration video */
.heroPhoto{background-image:url('assets/hero-badmintonhal.jpeg');background-position:center 53%}
.productVideo{background:#0b1210;display:flex;flex-direction:column;justify-content:center;align-items:center;min-width:0;overflow:hidden}
.productVideo video{display:block;width:100%;height:auto;max-height:570px;object-fit:contain;background:#0b1210}
.productVideo span{padding:15px;color:#e9eee8;font-size:10px;letter-spacing:2px}
@media(max-width:760px){.heroPhoto{background-position:58% center}.productVideo video{max-height:none}}

/* Version 9: clear product in hero, unboxed logo, no video */
.heroPhoto{background-image:url('assets/hero-shifted.jpg');background-position:center center;background-size:cover}
.heroContent{max-width:760px}
.heroProduct{max-width:540px}
.heroBrand{background:none!important;border:0!important;box-shadow:none!important;mix-blend-mode:normal!important;opacity:1;width:clamp(145px,14vw,205px)}
.heroBrand img{filter:brightness(0) invert(1);mix-blend-mode:normal!important}
@media(max-width:760px){.heroPhoto{background-position:62% center}.heroBrand{width:145px}.heroProduct{max-width:100%}}

/* Journal: isolated responsive typography and cards */
.journal{background:#f5f5f3;color:#14201b;padding:clamp(64px,8vw,120px) 6vw}.journalInner{max-width:1240px;margin:auto}.journal .kicker{color:#526b5a}.journal h2{font-size:clamp(42px,6vw,84px);line-height:.98;margin:22px 0;font-weight:900;letter-spacing:-.04em}.journal h2 span{color:#4d7359}.journalLead{font-size:clamp(17px,2vw,22px);line-height:1.55;max-width:670px;margin:20px 0 40px}.journalGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.journalCard{display:flex;flex-direction:column;min-width:0;background:#fff;border:1px solid #dbe1da;padding:clamp(22px,3vw,36px);border-radius:4px;color:#14201b!important;text-decoration:none!important;transition:transform .2s,box-shadow .2s}.journalCard:hover{transform:translateY(-4px);box-shadow:0 14px 36px #14201b15}.journalLabel{font-size:11px;letter-spacing:.13em;font-weight:800;color:#4e735a}.journalCard h3{font-size:clamp(23px,2.5vw,34px);line-height:1.12;letter-spacing:-.025em;margin:25px 0 15px;color:#14201b}.journalCard p{font-size:16px;line-height:1.65;color:#3b4b42;margin:0 0 30px}.journalRead{margin-top:auto;font-weight:800;color:#22583c;font-size:15px}.journalRead span{margin-left:10px}.journalCard:focus-visible{outline:3px solid #80b451;outline-offset:4px}
@media(max-width:900px){.journalGrid{grid-template-columns:1fr}.journal{padding:65px 22px}.journalCard{padding:25px}.journal h2{overflow-wrap:anywhere}.journalCard h3{font-size:27px}}

/* Version 12: readable journal cards on the homepage, desktop and mobile */
.journal{background:#f5f5f3;color:#18241e}
.journal h2{font-family:'DM Sans',Arial,sans-serif;font-size:clamp(35px,4.4vw,62px);font-weight:800;line-height:1.13;letter-spacing:-.045em;max-width:900px;overflow-wrap:normal}
.journalLead{font-family:'DM Sans',Arial,sans-serif;font-size:clamp(17px,1.7vw,20px);line-height:1.65;color:#33453a}
.journalGrid{gap:22px;align-items:stretch}
.journalCard{background:#fff;border:1px solid #cdd8ce;border-radius:8px;padding:30px;box-shadow:0 4px 18px rgba(20,32,27,.05)}
.journalCard h3{font-family:'DM Sans',Arial,sans-serif;font-size:clamp(21px,1.8vw,26px);font-weight:800;line-height:1.35;letter-spacing:-.025em;margin:22px 0 16px;color:#18241e;overflow-wrap:break-word}
.journalCard p{font-family:'DM Sans',Arial,sans-serif;font-size:16px;line-height:1.75;color:#405047;margin:0 0 28px;overflow-wrap:break-word}
.journalLabel{font-family:'DM Sans',Arial,sans-serif;font-size:11px;line-height:1.5;letter-spacing:.11em}
.journalRead{font-family:'DM Sans',Arial,sans-serif;font-size:15px;line-height:1.5;color:#235b3c}
@media(max-width:900px){.journalGrid{grid-template-columns:1fr;gap:16px}.journal h2{font-size:clamp(34px,7vw,50px);line-height:1.18}.journalCard{padding:26px}.journalCard h3{font-size:24px;line-height:1.35}}
@media(max-width:480px){.journal{padding:62px 20px}.journal h2{font-size:clamp(31px,8.5vw,40px);letter-spacing:-.035em}.journalCard{padding:23px}.journalCard h3{font-size:22px}.journalCard p{font-size:16px;line-height:1.7}}


/* Version 13: mobile-first corrections. */
.mobileHeroVisual { display: none; }
@media (max-width: 760px) {
  html, body { width: 100%; overflow-x: clip; }
  .hero {
    display: flex;
    flex-direction: column;
    height: auto;
    min-height: 0;
    overflow: hidden;
    background: #0b1712;
  }
  .heroPhoto { display: none; }
  .hero > .shade { display: none; }
  .mobileHeroVisual {
    display: block;
    order: 0;
    width: 100%;
    height: clamp(275px, 85vw, 430px);
    background-image: linear-gradient(180deg, rgba(5,14,10,.12), rgba(5,14,10,.08)), url('assets/hero-shifted.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 75% 50%;
  }
  .heroContent {
    order: 1;
    display: flex;
    flex-direction: column;
    padding: 26px 20px 40px !important;
    width: 100%;
    max-width: none;
    background: #0b1712;
  }
  .heroBrand {
    position: absolute;
    top: 15px;
    left: 18px;
    width: 155px;
    z-index: 5;
    margin: 0;
    padding: 0;
    background: transparent !important;
  }
  .hero .eyebrow { margin: 0 0 8px; font-size: 10px; letter-spacing: 2px; }
  .hero h1 { font-size: clamp(54px, 13vw, 76px); margin: 12px 0 22px; line-height: .92; }
  .heroProduct {
    width: 100%;
    max-width: none;
    background: #14251b;
    border: 1px solid #385343;
    backdrop-filter: none;
    padding: 20px;
  }
  .heroProductTitle { font-size: 16px; }
  .heroProduct p { font-size: 15px; line-height: 1.65; }
  .heroFeatures { display: flex; flex-wrap: wrap; gap: 8px; }
  .heroFeatures span { font-size: 12px; }
  .heroPurchase { gap: 16px; }
  .heroPurchase strong { font-size: 46px; }
  .heroPurchase .button { width: 100%; justify-content: space-between; }
  .heroMore { margin-top: 22px; }
  .journal {
    background: #f5f5f3 !important;
    color: #18241e !important;
    padding: 56px 18px !important;
  }
  .journalInner { width: 100%; max-width: 100%; }
  .journal .kicker { color: #526b5a !important; }
  .journal h2 {
    color: #18241e !important;
    font: 800 clamp(31px, 8vw, 42px)/1.15 'DM Sans', Arial, sans-serif !important;
    letter-spacing: -.035em !important;
    overflow-wrap: anywhere;
  }
  .journal h2 span { color: #4d7359 !important; }
  .journalLead { color: #33453a !important; font-size: 17px !important; line-height: 1.6 !important; }
  .journalGrid { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: 16px !important; }
  .journalCard, .journalCard:link, .journalCard:visited {
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
    background: #fff !important;
    color: #18241e !important;
    text-decoration: none !important;
    border: 1px solid #d2ddd3 !important;
    border-radius: 8px !important;
    padding: 22px !important;
  }
  .journalCard *, .journalCard:link *, .journalCard:visited * { text-decoration: none !important; }
  .journalCard .journalLabel { color: #526b5a !important; font-size: 11px !important; }
  .journalCard h3 { color: #18241e !important; font: 800 22px/1.35 'DM Sans',Arial,sans-serif !important; margin: 20px 0 14px !important; }
  .journalCard p { color: #405047 !important; font: 400 15px/1.7 'DM Sans',Arial,sans-serif !important; margin: 0 0 22px !important; }
  .journalCard .journalRead { color: #235b3c !important; font: 800 15px/1.5 'DM Sans',Arial,sans-serif !important; }
}