:root { --ink:#142126; --muted:#677278; --paper:#f5f3ee; --card:#fffefa; --line:#d8ddd9; --green:#92d23c; --orange:#ff7b42; --blue:#b4e4f5; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Manrope,Arial,sans-serif; }
.site-header { height:78px; display:flex; align-items:center; justify-content:space-between; max-width:1240px; margin:auto; padding:0 28px; border-bottom:1px solid rgba(20,33,38,.08); }
.brand { display:flex; align-items:center; gap:11px; color:var(--ink); text-decoration:none; font-size:20px; font-weight:800; letter-spacing:-.8px; }.brand-mark { display:flex; gap:3px; align-items:end; height:24px; }.brand-mark i { display:block; width:5px; border-radius:5px; background:var(--green); }.brand-mark i:nth-child(1){height:10px}.brand-mark i:nth-child(2){height:17px}.brand-mark i:nth-child(3){height:24px}
.header-note,.section-heading>p { font-size:12px; color:var(--muted); }.hero { isolation:isolate; position:relative; overflow:hidden; max-width:1240px; min-height:620px; margin:auto; padding:105px 28px; background:#06111d url('assets/table-tennis-rackets-hero.png?v=20260803-clean-gloss') center/cover no-repeat; color:white; }.hero:before { content:""; position:absolute; z-index:-1; inset:0; background:linear-gradient(90deg,rgba(3,11,19,.88) 0%,rgba(3,11,19,.54) 46%,rgba(3,11,19,.08) 100%); }.hero-content{max-width:590px}.hero .eyebrow{color:#b1e762}.hero h1{color:#fff}.hero h1 em{color:#b4e4f5}.hero-copy{color:#d0d8df}.hero-setups{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:34px 0 28px;color:#e2e9ef;font-size:11px}.hero-setups b{font-size:12px}.blue-dot,.red-dot{width:8px;height:8px;border-radius:50%;display:inline-block}.blue-dot{background:#4bafff;box-shadow:0 0 9px #4bafff}.red-dot{background:#ff4c4c;box-shadow:0 0 9px #ff4c4c}.hero-vs{margin:0 8px;color:#aebac6;font-size:17px}.hero .scroll-cta{color:#fff;border-color:#b4e4f5}
.eyebrow { color:#578114; font-family:"DM Mono",monospace; font-size:11px; letter-spacing:.09em; font-weight:500; margin:0 0 17px; }.hero h1 { font-size:clamp(45px,6vw,78px); letter-spacing:-.065em; line-height:1.02; margin:0; max-width:850px; }.hero h1 em { color:#56830f; font-style:normal; }.hero-copy { max-width:480px; color:var(--muted); line-height:1.65; margin:28px 0; }.scroll-cta { color:var(--ink); font-weight:700; text-decoration:none; border-bottom:2px solid var(--green); padding-bottom:5px; }.scroll-cta span,.primary-button span { margin-left:10px; font-size:20px; }
.comparator-section,.profile-section,.results { max-width:1240px; margin:0 auto; padding:80px 28px; }.comparator-section { background:#e9efea; }.section-heading { display:flex; justify-content:space-between; align-items:end; gap:30px; margin-bottom:35px; }.section-heading h2,.result-intro h2 { font-size:clamp(29px,4vw,45px); letter-spacing:-.055em; margin:0; }.section-heading>p { width:310px; line-height:1.6; margin:0; }.setup-grid { display:grid; grid-template-columns:1fr 44px 1fr; align-items:stretch; }.setup-card { padding:31px; background:var(--card); border:1px solid var(--line); }.setup-card.current { border-radius:9px 0 0 9px; }.setup-card.target { border-radius:0 9px 9px 0; }.vs-divider { display:flex; align-items:center; justify-content:center; z-index:1; }.vs-divider span { border-radius:50%; background:var(--ink); color:white; font:500 11px "DM Mono"; padding:10px 7px; }.card-title { display:flex; gap:13px; align-items:center; border-bottom:1px solid var(--line); padding-bottom:20px; margin-bottom:7px; }.card-title h3 { margin:0; font-size:17px; letter-spacing:-.04em; }.tag { color:#4e7c0b; background:#e2f3c8; border-radius:20px; padding:5px 8px; font:500 9px "DM Mono"; letter-spacing:.08em; }.tag.orange { color:#b94614; background:#ffe1d4; }.form-row { padding:18px 0 0; }.form-row label,.profile-form label { display:block; font-size:13px; font-weight:700; }.form-row label span { color:#899295; font-size:10px; font-weight:500; margin-left:5px; } select { display:block; appearance:none; width:100%; border:1px solid var(--line); border-radius:5px; margin-top:8px; padding:12px 36px 12px 12px; background:white url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='m1 1 5 5 5-5' fill='none' stroke='%23596368' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right 13px center; color:var(--ink); font:500 13px Manrope; cursor:pointer; }.setup-stats { display:flex; gap:14px; border-top:1px solid var(--line); margin-top:23px; padding-top:18px; }.mini-stat { font:500 10px "DM Mono"; color:var(--muted); }.mini-stat b { display:block; color:var(--ink); font:700 15px Manrope; margin-top:3px; }
.profile-section { background:var(--ink); color:#f8f9f4; }.profile-section .eyebrow { color:var(--green); }.profile-section .section-heading>p { color:#aab5b4; }.profile-form { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }.profile-form select { border-color:#3e4a4d; background-color:#1e2d31; color:white; }.primary-button { display:block; margin:38px 0 0 auto; padding:16px 21px; border:0; border-radius:5px; color:var(--ink); background:var(--green); font:700 14px Manrope; cursor:pointer; transition:transform .2s,background .2s; }.primary-button:hover { transform:translateY(-2px); background:#a6e450; }
.results { background:#f8f7f2; }.hidden { display:none; }.result-intro { max-width:720px; }.result-intro>p:not(.eyebrow) { color:var(--muted); line-height:1.7; max-width:610px; }.compatibility-card { display:flex; align-items:center; gap:26px; margin:42px 0 24px; padding:25px; border-radius:8px; background:#e4f0d1; }.score-ring { width:82px; height:82px; flex:0 0 82px; border-radius:50%; display:flex; align-items:baseline; justify-content:center; padding-top:27px; background:conic-gradient(#5e9714 calc(var(--score) * 1%), #cedac1 0); position:relative; font-size:24px; font-weight:800; letter-spacing:-.07em; }.score-ring:before { content:""; position:absolute; inset:7px; border-radius:50%; background:#e4f0d1; }.score-ring span,.score-ring small { position:relative; z-index:1; }.score-ring small { font-size:10px; letter-spacing:0; }.compatibility-card h3 { margin:0 0 5px; letter-spacing:-.04em; }.compatibility-card p:not(.eyebrow) { margin:0; color:#4e5c4c; font-size:13px; }.comparison-details { display:grid; grid-template-columns:1.2fr .8fr; gap:24px; }.performance-card,.advice-card { border:1px solid var(--line); border-radius:8px; padding:28px; background:var(--card); }.performance-card h3,.advice-card h3 { margin:0 0 20px; letter-spacing:-.04em; }.metric { display:grid; grid-template-columns:115px 1fr 78px; align-items:center; gap:12px; padding:12px 0; border-top:1px solid #e8ece8; font-size:13px; }.bar { height:7px; overflow:hidden; border-radius:10px; background:#e8ece7; }.bar i { display:block; height:100%; border-radius:10px; background:var(--green); }.delta { text-align:right; color:#557c18; font:500 11px "DM Mono"; }.delta.negative { color:#be562d; }.advice-card { color:#f7f9f6; background:#23434a; border:0; }.advice-card p { color:#d3e1df; line-height:1.65; font-size:14px; }.advice-icon { display:grid; place-items:center; width:33px; height:33px; margin-bottom:18px; border-radius:50%; color:var(--ink); background:var(--blue); font-size:19px; }.advice-card .disclaimer { margin-top:25px; padding-top:15px; border-top:1px solid rgba(255,255,255,.15); color:#9eb2b2; font-size:10px; } footer { max-width:1240px; margin:auto; padding:28px; color:var(--muted); font-size:11px; text-align:center; } footer span { color:var(--green); padding:0 8px; }
@media(max-width:700px){.site-header{padding:0 18px}.header-note{display:none}.hero{padding:70px 20px}.comparator-section,.profile-section,.results{padding:55px 20px}.section-heading{display:block}.section-heading>p{width:auto;margin-top:15px}.setup-grid{grid-template-columns:1fr;gap:0}.setup-card.current,.setup-card.target{border-radius:8px}.vs-divider{height:36px}.vs-divider span{padding:8px 6px}.profile-form{grid-template-columns:1fr}.primary-button{width:100%;margin-top:28px}.comparison-details{grid-template-columns:1fr}.metric{grid-template-columns:90px 1fr 65px}.compatibility-card{align-items:flex-start;padding:18px;gap:16px}.compact{margin-bottom:25px}}

.product-picker{display:grid;grid-template-columns:.42fr 1fr;gap:8px}.product-picker select{min-width:0}
.product-picker.rubber-picker{grid-template-columns:.30fr 1fr .28fr}
.product-picker .thickness-input{display:block;width:100%;border:1px solid var(--line);border-radius:5px;margin-top:8px;padding:12px;color:var(--ink);font:500 13px Manrope;background:#fff}
@media(max-width:700px){.brand{font-size:15px}.hero{min-height:620px;background-position:60% center}.hero:before{background:linear-gradient(90deg,rgba(3,11,19,.9),rgba(3,11,19,.35))}.product-picker{grid-template-columns:1fr}}

.language-toggle{display:inline-flex;align-items:center;gap:7px;margin-left:16px;border:1px solid #aab5b4;border-radius:4px;background:transparent;color:var(--ink);padding:6px 9px;font:700 10px "DM Mono";cursor:pointer}.language-label{font-size:9px;letter-spacing:.08em}.language-flag{font-size:15px;line-height:1}.other-product{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:8px}.other-product input{min-width:0;width:100%;border:1px dashed #94a19f;border-radius:5px;padding:10px;background:#fbfcfa;color:var(--ink);font:500 12px Manrope}.other-product small{grid-column:1/-1;color:#a45b2b;font-size:10px}.hero{max-width:none}

.site-header{display:none}.hero{min-height:410px}.hero-language{position:absolute;z-index:4;right:28px;top:24px;color:#fff;border-color:rgba(255,255,255,.65)}
.comparator-section{padding-top:28px;padding-bottom:54px}
.feedback-section{max-width:1240px;margin:0 auto;padding:76px 28px;display:grid;grid-template-columns:1fr 1fr;gap:80px;background:#f5f3ee}.feedback-copy h2{margin:0 0 18px;font-size:clamp(29px,3.5vw,43px);line-height:1.05;letter-spacing:-.055em}.feedback-copy>p:not(.eyebrow){max-width:430px;color:var(--muted);font-size:14px;line-height:1.7}.feedback-form{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:25px;background:#fffefa;border:1px solid var(--line);border-radius:9px}.feedback-form label{font-size:12px;font-weight:700}.feedback-form label span{font-size:10px;font-weight:500;color:var(--muted)}.feedback-form select,.feedback-form input,.feedback-form textarea{display:block;width:100%;margin-top:7px;border:1px solid var(--line);border-radius:5px;background:#fff;padding:11px;color:var(--ink);font:500 13px Manrope}.feedback-form textarea{min-height:112px;resize:vertical}.feedback-form label:nth-of-type(3){grid-column:1/-1}.feedback-button{justify-self:start;border:0;border-radius:5px;padding:13px 17px;background:var(--ink);color:#fff;font:700 13px Manrope;cursor:pointer}.feedback-button span{margin-left:8px;font-size:17px}.feedback-status{grid-column:1/-1;margin:0;color:#56830f;font-size:12px;font-weight:700}.feedback-status:empty{display:none}
.comparison-details{display:block}.brief-result{padding:30px;border:1px solid var(--line);border-radius:9px;background:#fffefa}.brief-rubber{margin:0 0 22px;color:var(--muted);font-size:13px}.brief-table{width:100%;border-collapse:collapse;font-size:13px}.brief-table th,.brief-table td{padding:11px 10px;border-bottom:1px solid #e5eae5;text-align:right}.brief-table th:first-child,.brief-table td:first-child{text-align:left}.brief-table th{font-size:11px;color:var(--muted);font-weight:700}.brief-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 36px;margin-top:24px}.brief-grid section{padding:17px 0;border-top:1px solid #e5eae5}.brief-grid h3,.brief-takeaway h3{margin:0 0 7px;font-size:15px;letter-spacing:-.03em}.brief-grid p,.brief-takeaway li{margin:0;color:#526168;font-size:13px;line-height:1.6}.brief-takeaway{margin-top:8px;padding:18px;background:#e9f2da;border-radius:6px}.brief-takeaway ul{margin:8px 0 0;padding-left:18px}.brief-method{margin:18px 0 0;color:#8a9596;font-size:10px;line-height:1.5}
.long-analysis{margin-top:34px;padding:34px;border-radius:9px;background:#183137;color:#eef4f1}.long-analysis h2{margin:0 0 16px;color:#b8e66f;font-size:18px;letter-spacing:.04em}.long-lead{max-width:830px;margin:0 0 26px;color:#d6e3df;line-height:1.7;font-size:14px}.long-analysis-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 38px}.long-analysis-grid article{padding:19px 0;border-top:1px solid rgba(255,255,255,.14)}.long-analysis-grid h3{margin:0 0 8px;font-size:15px;letter-spacing:-.02em}.long-analysis-grid p{margin:0;color:#c8d6d3;font-size:13px;line-height:1.7}
.validation-audit{margin:0 0 26px;padding:20px;border:1px solid #efc4be;border-left:5px solid var(--red);border-radius:7px;background:#fff8f6}.validation-heading{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:14px}.validation-heading span{color:var(--red);font-size:10px;font-weight:800;letter-spacing:.08em}.validation-heading h3{margin:4px 0 0;font-size:17px}.validation-heading>b{display:grid;place-items:center;min-width:48px;height:48px;border-radius:50%;background:var(--red);color:#fff;font-size:14px}.validation-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px 24px}.validation-grid article{padding:11px 0;border-top:1px solid #eadbd7}.validation-grid h4{margin:0 0 5px;font-size:12px}.validation-grid p,.review-check{margin:0;color:#596569;font-size:11px;line-height:1.55}.review-check{margin-top:10px;padding:12px;border-radius:5px;background:#f1eee8}.short-result-title{margin:0 0 12px;font-size:16px;letter-spacing:.05em}
@media(max-width:700px){.feedback-section{grid-template-columns:1fr;gap:28px;padding:55px 20px}.feedback-form{grid-template-columns:1fr}.feedback-form label:nth-of-type(3){grid-column:auto}}
@media(max-width:700px){.brief-result{padding:18px}.brief-table{font-size:11px}.brief-table th,.brief-table td{padding:9px 5px}.brief-grid{grid-template-columns:1fr}}
@media(max-width:700px){.validation-grid{grid-template-columns:1fr}.validation-heading h3{font-size:15px}}
@media(max-width:700px){.long-analysis{padding:22px}.long-analysis-grid{grid-template-columns:1fr}}

/* Compact hero: the comparison form begins within the first screen. */
.hero{min-height:385px;padding:46px 28px;background-position:center}.hero:before{background:linear-gradient(90deg,rgba(3,11,19,.54),rgba(3,11,19,.04) 47%,rgba(3,11,19,.54))}.hero-title{position:absolute;z-index:2;top:35%;left:50%;transform:translate(-50%,-50%);margin:0;text-align:center;color:#fff;font-size:clamp(36px,5.2vw,72px)!important;line-height:.88!important;letter-spacing:-.075em!important;text-shadow:0 3px 22px rgba(0,0,0,.8);white-space:nowrap}.hero-arrow{position:absolute;z-index:1;display:flex;gap:15px;top:62%;left:50%;transform:translateX(-50%);width:255px}.hero-arrow i{position:relative;display:block;width:120px;height:16px;border:2px solid #fff;border-radius:5px;box-shadow:0 0 13px rgba(255,255,255,.65)}.arrow-left{background:#1673d1}.arrow-right{background:#d82727}.arrow-left:after,.arrow-right:after{content:"";position:absolute;top:50%;width:0;height:0;transform:translateY(-50%)}.arrow-left:after{left:-15px;border-top:10px solid transparent;border-bottom:10px solid transparent;border-right:15px solid #fff}.arrow-left:before{content:"";position:absolute;z-index:1;left:-11px;top:50%;transform:translateY(-50%);border-top:7px solid transparent;border-bottom:7px solid transparent;border-right:11px solid #1673d1}.arrow-right:after{right:-15px;border-top:10px solid transparent;border-bottom:10px solid transparent;border-left:15px solid #fff}.arrow-right:before{content:"";position:absolute;z-index:1;right:-11px;top:50%;transform:translateY(-50%);border-top:7px solid transparent;border-bottom:7px solid transparent;border-left:11px solid #d82727}.hero-sport{position:absolute;z-index:2;top:68%;left:50%;transform:translateX(-50%);margin:0;color:rgba(255,255,255,.88);font-family:Manrope,sans-serif;font-size:clamp(10px,1vw,14px);font-weight:500;letter-spacing:.28em;text-indent:.28em;text-shadow:0 2px 10px rgba(0,0,0,.75);white-space:nowrap}.hero-proof{position:absolute;z-index:2;top:75%;left:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;gap:9px;width:max-content;max-width:calc(100% - 40px);margin:0;color:rgba(255,255,255,.78);font:500 9px "DM Mono",monospace;letter-spacing:.07em;text-align:center;text-shadow:0 2px 10px rgba(0,0,0,.75);white-space:nowrap}.hero-proof b{color:#fff;font:700 10px Manrope,sans-serif;letter-spacing:0}.hero-proof i{color:rgba(180,228,245,.72);font-style:normal}.hero-content{position:absolute;z-index:3;bottom:28px;left:28px;max-width:360px}.hero-content .eyebrow{margin-bottom:7px;font-size:9px}.hero-content .hero-copy{font-size:11px;line-height:1.45;margin:0 0 12px}.hero-setups{display:none}.hero .scroll-cta{font-size:12px}
@media(max-width:700px){.hero{min-height:360px;padding:20px;background-position:center}.hero-title{top:47%;font-size:clamp(31px,11vw,52px)!important}.hero-arrow{top:61%;width:164px;gap:10px}.hero-arrow i{width:77px;height:13px}.hero-sport{top:68%;font-size:9px;letter-spacing:.22em;text-indent:.22em}.hero-proof{top:75%;width:190px;gap:4px;flex-wrap:wrap;font-size:7px;line-height:1.25;white-space:normal}.hero-proof b{font-size:8px}.hero-proof i{display:none}.hero-proof span+span:before{content:"·";margin-right:4px;color:rgba(180,228,245,.72)}.hero-content{bottom:16px;left:20px;max-width:230px}.hero-content .hero-copy{display:none}.hero-content .eyebrow{font-size:8px}.hero .scroll-cta{font-size:11px}}
@media(max-width:700px){.other-product{grid-template-columns:1fr}.language-toggle{margin-left:auto}.site-header{gap:8px}}
@media(max-width:700px){.product-picker.rubber-picker{grid-template-columns:1fr}}

.blade-year-picker{display:grid;grid-template-columns:145px 1fr;align-items:end;gap:12px;margin-top:10px;padding:10px 12px;border:1px solid #e1e6e1;border-radius:6px;background:#f6f8f4}.blade-year-picker label{min-width:0}.blade-year-picker label span{margin-left:0;color:var(--ink);font-size:11px;font-weight:700}.blade-year-picker select{margin-top:5px;padding-top:9px;padding-bottom:9px}.blade-year-picker small{align-self:center;color:var(--muted);font-size:10px;line-height:1.45}

/* Give comparison-heavy screens more breathing room on wide desktop monitors. */
@media(min-width:1500px){
  .comparator-section,.profile-section,.results,.feedback-section,footer{max-width:1520px}
  .comparator-section,.profile-section,.results{padding-left:48px;padding-right:48px}
  .feedback-section{padding-left:48px;padding-right:48px;gap:110px}
  .setup-grid{grid-template-columns:minmax(0,1fr) 58px minmax(0,1fr)}
  .setup-card{padding:38px 42px}
  .product-picker{grid-template-columns:.36fr 1fr;gap:11px}
  .product-picker.rubber-picker{grid-template-columns:.27fr 1fr .22fr;gap:11px}
  .profile-form{grid-template-columns:repeat(4,minmax(0,1fr));gap:22px 24px}
  .brief-result{padding:40px 44px}
  .brief-grid{gap:0 60px}
  .long-analysis{padding:42px 46px}
  .long-analysis-grid{gap:0 60px}
  .hero-content{left:max(48px,calc((100vw - 1520px)/2 + 48px))}
  .hero-language{right:max(48px,calc((100vw - 1520px)/2 + 48px))}
}
@media(min-width:2100px){
  .hero{background-size:1920px auto;background-repeat:no-repeat;background-color:#06111d}
  .comparator-section,.profile-section,.results,.feedback-section,footer{max-width:1680px}
  .hero-content{left:max(64px,calc((100vw - 1680px)/2 + 64px))}
  .hero-language{right:max(64px,calc((100vw - 1680px)/2 + 64px))}
}
@media(max-width:700px){.blade-year-picker{grid-template-columns:1fr}.blade-year-picker small{padding-bottom:2px}}
