/* Shared men’s presentation approved 10 September 2026. */



.pf-refined{--pf-paper:#f7f4ee;--pf-surface:#fffcf7;--pf-ink:#28251f;--pf-muted:#70695f;--pf-line:#ded7cc;--pf-accent:#393f38;background:var(--pf-paper);color:var(--pf-ink)}
.pf-refined .nav{background:#f7f4eef5;color:var(--pf-ink);border-color:var(--pf-line);backdrop-filter:blur(12px)}
.pf-refined .nav-inner{max-width:1280px;height:76px;padding:0 40px}.pf-refined .nav-logo{font-size:25px;letter-spacing:-1.3px;color:var(--pf-ink);gap:9px}.pf-refined .brand-mark{width:30px;height:30px;flex-basis:30px}.pf-refined .nav-logo .brand-mark{filter:none;opacity:1}.pf-refined .nav-logo span{display:inline}
.pf-refined .nav-right{gap:18px}.pf-refined .nav-secondary{border-color:transparent;background:transparent;color:var(--pf-muted);font-size:14px;font-weight:500;padding:10px 3px;min-height:44px}.pf-refined .nav-secondary:hover{color:var(--pf-ink);background:transparent}.pf-refined .nav-cta{background:var(--pf-accent);border-color:var(--pf-accent);color:#fffcf7;min-height:44px;border-radius:8px;font-size:14px;font-weight:600;padding:11px 17px}.pf-refined .nav-cta:hover{background:#51584e;border-color:#51584e;color:#fff}.pf-refined .nav-saved-count{background:#e5e2d9;color:var(--pf-ink);font-size:12px;font-weight:500}
.pf-refined .saved-nav-preview,.pf-refined .saved-nav-preview:before{background:var(--pf-surface);border-color:var(--pf-line);color:var(--pf-ink);box-shadow:0 8px 24px #28251f12}.pf-refined .saved-nav-preview strong{font-size:14px;font-weight:600}.pf-refined .saved-nav-preview>span{font-size:12px;color:var(--pf-muted)}.pf-refined .saved-nav-preview button{font-size:13px;color:var(--pf-ink);font-weight:500;min-height:32px}
.pf-refined .hero{max-width:1280px;min-height:0;margin:auto;padding:48px 40px 52px;grid-template-columns:minmax(0,.87fr) minmax(0,1.13fr);gap:60px;align-items:center;overflow:visible;background:var(--pf-paper);color:var(--pf-ink);border:0}
.pf-refined .hero-copy{max-width:510px;width:100%;padding:0;justify-self:start}.pf-refined .hero-product-kicker{color:var(--pf-muted);font-size:12px;font-weight:500;letter-spacing:.08em;line-height:1.5;margin-bottom:24px}
.pf-refined .hero-title{font-size:clamp(38px,4.1vw,56px);font-weight:800;line-height:1.08;letter-spacing:-2.5px;white-space:normal;color:var(--pf-ink);margin-bottom:21px;font-feature-settings:normal}.pf-refined .hero-title span{display:inline;white-space:normal}
.pf-refined .hero-sub{margin:0 0 27px;max-width:410px}.pf-refined .hero-sub-primary{font-size:17px;line-height:1.6;font-weight:400;color:var(--pf-muted);text-wrap:initial}.pf-refined .hero-primary-action{margin:0;gap:12px}.pf-refined .btn-hero{background:var(--pf-accent);color:#fffcf7;border-radius:8px;min-height:50px;padding:14px 23px;font-size:15px;font-weight:600;transform:none}.pf-refined .btn-hero:hover{background:#51584e;opacity:1;transform:none}.pf-refined .hero-primary-action p{font-size:12px;line-height:1.5;font-weight:400;color:var(--pf-muted)}
.pf-refined .hero-battle-stage{width:100%;max-width:640px;min-height:0;margin:0;padding:0;border:0;background:transparent;box-shadow:none;border-radius:0;gap:15px;align-self:center}.pf-refined .hero-battle-head{padding:0;gap:16px}.pf-refined .hero-battle-kicker{font-size:12px;font-weight:500;letter-spacing:.07em;color:var(--pf-muted);margin-bottom:8px}.pf-refined .hero-battle-head h2{color:var(--pf-ink);font-size:20px;line-height:1.3;font-weight:600;letter-spacing:-.5px}
.pf-refined .hero-battle-grid{aspect-ratio:auto;height:auto;gap:14px}.pf-refined .hero-battle-card{aspect-ratio:2/3;min-height:0;border:0;border-radius:12px;background:#e5dfd5;box-shadow:none;transition:box-shadow .15s,opacity .15s;transform:none}.pf-refined .hero-battle-card::after{display:none}.pf-refined .hero-battle-card:hover{box-shadow:0 0 0 3px var(--pf-accent);transform:none}.pf-refined .hero-battle-image{background:#e5dfd5;aspect-ratio:2/3;height:100%}.pf-refined .hero-battle-image img,.pf-refined .hero-battle-card:hover .hero-battle-image img{object-fit:contain;object-position:center;transform:none;filter:none}
.pf-refined .hero-battle-label{top:12px;left:12px;bottom:auto;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#fffcf3ef;color:var(--pf-ink);text-shadow:none}.pf-refined .hero-battle-label small{display:none}.pf-refined .hero-battle-label strong{font-family:var(--fb);font-size:13px;font-weight:600;line-height:1}.pf-refined .hero-battle-vs{width:33px;height:33px;background:var(--pf-paper);border:0;color:var(--pf-muted);box-shadow:none;font-size:10px;font-weight:500;letter-spacing:0}.pf-refined .hero-battle-stage.is-choosing .hero-battle-card.is-selected{box-shadow:0 0 0 3px var(--pf-accent);transform:none}.pf-refined .hero-battle-stage.is-choosing .hero-battle-card:not(.is-selected){opacity:.5}
.pf-refined .hero-battle-foot{padding:0;font-size:12px;font-weight:400;line-height:1.5;color:var(--pf-muted);gap:12px;flex-wrap:wrap}.pf-refined .hero-battle-foot>span{display:block}.pf-refined .hero-battle-foot button{font-size:12px;font-weight:500;min-height:32px;color:var(--pf-ink)}.pf-refined .hero-battle-foot button:hover{color:var(--pf-accent);text-decoration:underline;text-underline-offset:4px}
.pf-refined :is(.nav-secondary,.nav-cta,.btn-hero,.hero-battle-card,.hero-battle-foot button):focus-visible{outline:3px solid #696348;outline-offset:4px}
.pf-refined .capsules-home{padding:42px 40px 60px;background:var(--pf-paper);border-top:1px solid var(--pf-line);scroll-margin-top:90px}.pf-refined .inspiration-inner{max-width:1200px}.pf-refined .inspiration-head{margin:0 0 28px}.pf-refined .section-kicker{font-size:12px;line-height:1.5;font-weight:500;letter-spacing:.09em;color:var(--pf-muted);margin-bottom:12px}.pf-refined .inspiration-head h2{font-size:40px;font-weight:700;line-height:1.15;letter-spacing:-1.5px;color:var(--pf-ink)}.pf-refined .capsule-deck{font-size:16px;font-weight:400;line-height:1.5;margin-top:12px;color:var(--pf-muted)}
.pf-refined .capsule-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;overflow:visible;margin:0;padding:0}.pf-refined .capsule-card{aspect-ratio:auto;border:0;border-radius:0;background:transparent;box-shadow:none;overflow:visible;transform:none}.pf-refined .capsule-card:hover{transform:none;box-shadow:none}.pf-refined .capsule-card::after{display:none}.pf-refined .capsule-images{display:block;position:relative;inset:auto;width:100%;height:auto;aspect-ratio:2/3;border-radius:12px;overflow:hidden;background:#e4ded3}.pf-refined .capsule-images img{width:100%;height:100%;object-fit:contain;object-position:center}.pf-refined .capsule-card:hover .capsule-images img{transform:none;filter:brightness(1.035)}.pf-refined .capsule-copy{position:static;padding:15px 0 0}.pf-refined .capsule-copy strong{font-family:var(--fb);font-size:17px;line-height:1.35;letter-spacing:-.3px;font-weight:600;color:var(--pf-ink);text-shadow:none}.pf-refined .capsule-copy>span{font-size:13px;line-height:1.5;font-weight:400;letter-spacing:0;color:var(--pf-muted);margin-top:6px}
.pf-refined .capsule-cta-row{justify-content:space-between;align-items:center;gap:18px;margin-top:30px}.pf-refined .capsule-view-all{border:1px solid var(--pf-line);border-radius:8px;min-height:46px;padding:12px 19px;font-size:14px;font-weight:500;transform:none}.pf-refined .capsule-battle-cta{border:0;border-radius:0;background:none;color:var(--pf-ink);min-height:44px;padding:10px 0;font-size:14px;font-weight:500;transform:none;text-decoration:underline;text-underline-offset:4px;text-decoration-color:#aba391}.pf-refined .capsule-battle-cta:hover{background:none;transform:none;text-decoration-color:var(--pf-ink)}
.pf-refined .capsule-style-note{margin-top:34px;padding-top:23px}.pf-refined .capsule-style-note-label{font-size:12px}.pf-refined .capsule-style-note h3{font-size:18px;font-weight:600}.pf-refined .capsule-style-note p{font-size:14px;font-weight:400}
.pf-refined .value-proof{padding:58px 40px;background:#eeebe4;border-top:1px solid var(--pf-line);border-bottom:1px solid var(--pf-line);scroll-margin-top:90px}.pf-refined .value-proof-inner{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:60px;max-width:1200px}.pf-refined .value-proof-copy{max-width:490px}.pf-refined .value-proof-copy h2{font-size:36px;line-height:1.15;font-weight:700;letter-spacing:-1.2px;margin-bottom:24px}.pf-refined .value-proof-steps li{padding:14px 0;gap:12px;grid-template-columns:30px minmax(0,1fr)}.pf-refined .value-proof-number{font-size:12px;line-height:1.5;font-weight:500;color:var(--pf-muted)}.pf-refined .value-proof-steps strong{font-size:15px;font-weight:600;line-height:1.4}.pf-refined .value-proof-steps small{font-size:14px;font-weight:400;line-height:1.5;margin-top:2px}.pf-refined .hero-rec.value-proof-card{border-radius:14px;border:1px solid var(--pf-line);box-shadow:none;background:var(--pf-surface)}.pf-refined .hero-rec .hero-rec-title{font-size:25px;line-height:1.2;font-weight:700;letter-spacing:-.8px}.pf-refined .hero-rec .hero-rec-kicker{font-size:12px;font-weight:500}.pf-refined .hero-rec .hero-rec-slot{font-size:12px;font-weight:500;text-transform:none;letter-spacing:0}.pf-refined .hero-rec .hero-rec-name{font-weight:500}.pf-refined .hero-rec .hero-rec-why{font-size:14px;line-height:1.5}
.pf-refined .fast-prompt{font-size:32px;line-height:1.2;font-weight:700;letter-spacing:-1px}.pf-refined .choice-kicker{font-size:12px;font-weight:500;color:var(--pf-muted);margin-bottom:12px}.pf-refined .choice-card,.pf-refined .choice-grid:not(.archive-grid) .choice-card{border:1px solid var(--pf-line);border-radius:12px;box-shadow:none;transform:none}.pf-refined .choice-card:hover{box-shadow:0 0 0 2px var(--pf-accent);transform:none}.pf-refined .choice-img,.pf-refined .choice-grid:not(.archive-grid) .choice-img{aspect-ratio:2/3;height:auto}.pf-refined .choice-img img,.pf-refined .choice-card:hover .choice-img img,.pf-refined .choice-grid:not(.archive-grid) .choice-img img{object-fit:contain;transform:none}.pf-refined .choice-home-back{font-size:14px;font-weight:500;min-height:44px}.pf-refined .saved-fits-view{background:var(--pf-paper)}.pf-refined .saved-fits-title{font-size:44px;line-height:1.15;font-weight:700;letter-spacing:-1.5px}.pf-refined .saved-fit-card{box-shadow:none;border-color:var(--pf-line)}
/* Restore the original comparison motion and green selection feedback in Fit Battles. */
@media(hover:hover) and (pointer:fine){
  .pf-refined #choiceGrid:not(.archive-grid):not(.capsule-archive-grid) .choice-card:not(:disabled):hover{
    transform:translateY(-5px);
    box-shadow:var(--shadow2);
    border-color:rgba(10,10,10,.2);
  }
  .pf-refined #choiceGrid:not(.archive-grid):not(.capsule-archive-grid) .choice-card:not(:disabled):hover .choice-img img{transform:scale(1.018)}
}
.pf-refined #choiceGrid:not(.archive-grid):not(.capsule-archive-grid) .choice-card:is(:active,.pf-tap-pressed,.tap-registered){transform:scale(.985)}
@media(prefers-reduced-motion:reduce){
  .pf-refined #choiceGrid .choice-card,
  .pf-refined #choiceGrid .choice-img img{transform:none!important}
}

@media(max-width:1000px){.pf-refined .hero{gap:34px;padding:42px 32px}.pf-refined .hero-title{font-size:42px;letter-spacing:-1.7px}.pf-refined .nav-inner{padding:0 32px}.pf-refined .hero-battle-head h2{font-size:19px}}
@media(max-width:760px){.pf-refined .nav-inner{padding:0 24px;height:68px}.pf-refined .nav-logo{font-size:23px}.pf-refined .nav-right{gap:14px}.pf-refined .hero{grid-template-columns:1fr;max-width:620px;gap:30px;padding:32px 24px 40px}.pf-refined .hero-copy{max-width:500px}.pf-refined .hero-product-kicker{margin-bottom:17px}.pf-refined .hero-title{font-size:44px;letter-spacing:-1.9px;max-width:460px;margin-bottom:18px}.pf-refined .hero-sub{margin-bottom:23px}.pf-refined .hero-battle-stage{width:100%;max-width:100%;margin:0}.pf-refined .hero-battle-grid{height:auto;gap:12px}.pf-refined .hero-battle-head h2{font-size:20px}.pf-refined .hero-battle-foot{justify-content:space-between}.pf-refined .nav-secondary[data-mobile-label],.pf-refined .nav-cta[data-mobile-label]{font-size:14px}.pf-refined [data-mobile-label]::after{display:none}}
@media(max-width:440px){.pf-refined .nav-inner{padding:0 18px}.pf-refined .nav-right{gap:10px}.pf-refined .nav-guides{display:inline-flex}.pf-refined .nav-cta{padding:10px 12px;font-size:13px}.pf-refined .nav-logo{font-size:22px}.pf-refined .brand-mark{width:25px;height:25px;flex-basis:25px}.pf-refined .hero{padding:30px 20px 32px}.pf-refined .hero-title{font-size:39px;letter-spacing:-1.6px}.pf-refined .hero-battle-label{top:9px;left:9px;width:27px;height:27px}.pf-refined .hero-battle-foot>span{max-width:145px}.pf-refined .hero-battle-foot button{max-width:130px;white-space:normal;text-align:right}}
@media(max-width:1000px){.pf-refined .capsules-home{padding:36px 32px 48px}.pf-refined .capsule-grid{gap:18px}.pf-refined .value-proof{padding:45px 32px}.pf-refined .value-proof-inner{gap:35px}.pf-refined .value-proof-copy h2{font-size:32px}}
@media(max-width:760px){.pf-refined .capsules-home{padding:32px 24px 42px}.pf-refined .inspiration-head h2{font-size:33px;letter-spacing:-1px}.pf-refined .capsule-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 16px}.pf-refined .capsule-card{flex:auto}.pf-refined .capsule-copy strong{font-size:16px}.pf-refined .capsule-cta-row{align-items:flex-start;flex-direction:row;flex-wrap:wrap;margin-top:25px;gap:10px}.pf-refined .capsule-view-all,.pf-refined .capsule-battle-cta{width:auto;max-width:100%}.pf-refined .capsule-style-note{flex-direction:column;align-items:flex-start;gap:12px}.pf-refined .value-proof{padding:38px 24px}.pf-refined .value-proof-inner{grid-template-columns:1fr;gap:28px}.pf-refined .value-proof-copy{margin:0;max-width:100%}.pf-refined .value-proof-copy h2{font-size:32px}.pf-refined .hero-rec.value-proof-card{max-width:560px;margin:0 auto}.pf-refined .fast-prompt{font-size:26px;max-width:100%;line-height:1.25}.pf-refined .saved-fits-title{font-size:36px}}
@media(max-width:440px){.pf-refined .capsules-home{padding-left:20px;padding-right:20px}.pf-refined .inspiration-head h2{font-size:30px}.pf-refined .capsule-grid{gap:25px 14px}}
@media(prefers-reduced-motion:reduce){.pf-refined *, .pf-refined *::before,.pf-refined *::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}


.pf-refined .nav{background:#191916f7;color:#f5f0e7;border-color:#ffffff17}
.pf-refined .nav-logo{color:#f5f0e7}.pf-refined .nav-logo .brand-mark{filter:brightness(0) invert(1)}
.pf-refined .nav-secondary{color:#cec8bd}.pf-refined .nav-secondary:hover{color:#fffaf1}
.pf-refined .nav-cta{background:#f1ece2;border-color:#f1ece2;color:#24241e}.pf-refined .nav-cta:hover{background:#fffaf1;border-color:#fffaf1;color:#24241e}
.pf-refined .hero{max-width:none;margin:0;padding-left:max(40px,calc((100vw - 1200px)/2));padding-right:max(40px,calc((100vw - 1200px)/2));background:#191916;color:#f5f0e7}
.pf-refined .hero-title,.pf-refined .hero-battle-head h2{color:#f5f0e7}
.pf-refined .hero-product-kicker,.pf-refined .hero-battle-kicker,.pf-refined .hero-primary-action p,.pf-refined .hero-battle-foot{color:#b5afa4}
.pf-refined .hero-sub-primary{color:#cec8bd}
.pf-refined .btn-hero{background:#f1ece2;color:#24241e}.pf-refined .btn-hero:hover{background:#fffaf1;color:#24241e}
.pf-refined .hero-battle-vs{background:#191916;color:#e1d9cc}
.pf-refined .hero-battle-card:hover,.pf-refined .hero-battle-stage.is-choosing .hero-battle-card.is-selected{box-shadow:0 0 0 3px #e9e0d4}
.pf-refined .hero-battle-foot button{color:#e1d9cc}.pf-refined .hero-battle-foot button:hover{color:#fffaf1}
.pf-refined :is(.nav-secondary,.nav-cta,.btn-hero,.hero-battle-card,.hero-battle-foot button):focus-visible{outline-color:#e9e0d4}
.pf-refined .return-visit,.pf-refined .capsule-style-note{display:none!important}
/* Keep the desktop preview reachable while crossing the gap below Saved Fits. */
.pf-refined .saved-nav-preview::after{content:'';position:absolute;left:0;right:0;top:-13px;height:13px}
.pf-refined .capsules-home{border-top:0}

.pf-refined .value-proof-card .hero-rec-img img{object-position:44% bottom}
.pf-refined .saved-fits-head{align-items:start;margin-bottom:26px}.pf-refined .saved-fits-head>p{font-size:14px;font-weight:400;line-height:1.5;max-width:300px}.pf-refined .saved-fits-head .section-kicker[hidden]{display:none}
.pf-personal-tabs[hidden]{display:none!important}.pf-refined .pf-personal-tabs{display:flex;gap:28px;border-bottom:1px solid var(--pf-line);margin-bottom:30px}.pf-refined .pf-personal-tabs button{position:relative;min-height:48px;padding:12px 0;border:0;background:none;color:var(--pf-muted);font-size:15px;font-weight:500}.pf-refined .pf-personal-tabs button[aria-selected=true]{color:var(--pf-ink)}.pf-refined .pf-personal-tabs button[aria-selected=true]::after{content:'';position:absolute;bottom:-1px;left:0;right:0;height:2px;background:var(--pf-ink)}.pf-refined .pf-personal-tabs button:focus-visible,.pf-refined .pf-personal-browse:focus-visible{outline:2px solid #696348;outline-offset:4px}
.pf-refined .pf-recent-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 22px}.pf-refined .pf-recent-card{min-width:0}.pf-refined .pf-recent-card a{display:block}.pf-refined .pf-recent-image{display:block;aspect-ratio:2/3;border-radius:12px;overflow:hidden;background:#e4ded3}.pf-refined .pf-recent-image img{height:100%;width:100%;object-fit:contain}.pf-refined .pf-recent-copy{display:grid;gap:7px;padding:16px 0 0}.pf-refined .pf-recent-copy>span:first-child{font-size:12px;color:var(--pf-muted);line-height:1.4}.pf-refined .pf-recent-copy strong{font-size:17px;line-height:1.4;font-weight:600;letter-spacing:-.2px}.pf-refined .pf-recent-action{font-size:14px;color:var(--pf-muted);text-decoration:underline;text-underline-offset:4px;margin-top:3px}.pf-refined .pf-recent-card a:hover .pf-recent-action{color:var(--pf-ink)}.pf-refined .pf-recent-card a:focus-visible{outline:2px solid #696348;outline-offset:5px}
.pf-refined .saved-fits-empty{max-width:480px;margin:32px auto 45px;gap:0}.pf-refined .saved-fits-empty h2{font-size:26px;font-weight:600;letter-spacing:-.6px;line-height:1.25}.pf-refined .saved-fits-empty p{font-size:15px;line-height:1.6;margin:13px 0 24px}.pf-refined .pf-personal-browse{min-height:46px;padding:12px 20px;border:1px solid var(--pf-line);border-radius:8px;background:var(--pf-surface);color:var(--pf-ink);font-size:14px;font-weight:500}
@media(max-width:1000px){.pf-refined .hero{padding-left:32px;padding-right:32px}}
@media(max-width:760px){.pf-refined .hero{padding-left:max(24px,calc((100vw - 572px)/2));padding-right:max(24px,calc((100vw - 572px)/2))}}
@media(max-width:760px){.pf-refined .saved-fits-head{flex-direction:column;gap:15px}.pf-refined .saved-fits-head>p{text-align:left;max-width:100%}.pf-refined .pf-personal-tabs{gap:24px;margin-bottom:25px}.pf-refined .pf-recent-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:27px 16px}.pf-refined .pf-recent-copy strong{font-size:15px}.pf-refined .saved-fits-empty h2{font-size:24px}}
@media(max-width:440px){.pf-refined .hero{padding-left:20px;padding-right:20px}}


.pf-refined .capsule-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.pf-refined .capsule-card{cursor:pointer}
.pf-refined .capsule-explore{
  position:absolute;right:14px;bottom:14px;z-index:2;display:flex;align-items:center;gap:0;
  min-height:40px;padding:10px;border:1px solid #fffcf770;border-radius:999px;
  background:var(--pf-surface);color:var(--pf-ink);box-shadow:0 2px 10px #28251f14;
  font-size:14px;line-height:20px;font-weight:500;pointer-events:none;
  transition:gap .2s ease,padding .2s ease;
}
.pf-refined .capsule-explore-label{max-width:0;overflow:hidden;opacity:0;white-space:nowrap;transition:max-width .2s ease,opacity .2s ease}
.pf-refined .capsule-explore-arrow{width:18px;height:18px;flex:none;transition:transform .2s ease}
.pf-refined .capsule-card:focus-visible .capsule-explore{gap:9px;padding-inline:14px}
.pf-refined .capsule-card:focus-visible .capsule-explore-label{max-width:130px;opacity:1}
.pf-refined .capsule-card:focus-visible .capsule-images img{filter:brightness(1.035)}
@media(hover:hover) and (pointer:fine){
  .pf-refined .capsule-card:hover .capsule-explore{gap:9px;padding-inline:14px}
  .pf-refined .capsule-card:hover .capsule-explore-label{max-width:130px;opacity:1}
  .pf-refined .capsule-card:hover .capsule-explore-arrow{transform:translateX(2px)}
}
@media(max-width:760px),(hover:none){
  .pf-refined .capsule-explore{display:none}
}
.pf-refined .pf-capsule-variants{display:flex;justify-content:center;margin:28px 0 0}
.pf-refined .pf-capsule-variants[hidden]{display:none}
.pf-refined .pf-capsule-variants button{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;
  max-width:100%;padding:11px 18px;border:1px solid var(--pf-line);border-radius:999px;
  background:transparent;color:var(--pf-ink);font-size:14px;line-height:20px;font-weight:500;
  transition:background .18s ease,border-color .18s ease;
}
.pf-refined .pf-capsule-variants button:hover{background:var(--pf-surface);border-color:var(--pf-muted)}
.pf-refined .pf-capsule-variants button:focus-visible{outline:2px solid #696348;outline-offset:4px}
.pf-refined .pf-variants-arrow{width:16px;height:16px;flex:none;transition:transform .18s ease}
.pf-refined .pf-capsule-variants button[aria-expanded=true] .pf-variants-arrow{transform:rotate(180deg)}


@media(max-width:760px){.pf-refined .capsule-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}


.pf-refined .nav{background:#141411f7}
.pf-refined #hero-section{
  grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);
  gap:48px;
  background:#141411;
}


.pf-refined #heroBattleStage{
  width:100%;
  max-width:none;
  min-height:0;
  margin:0;
  padding:20px;
  gap:16px;
  border:1px solid #ffffff21;
  border-radius:20px;
  background:#1c1b17;
  box-shadow:0 16px 40px #00000016;
}
.pf-refined #heroBattleStage .hero-battle-head{padding:2px 2px 0}
.pf-refined #heroBattleStage .hero-battle-kicker{
  display:block;
  margin-bottom:9px;
  color:#b5afa4;
  font-size:11px;
  font-weight:700;
  letter-spacing:.11em;
}
.pf-refined #heroBattleStage h2{
  margin:0;
  color:#f5f0e7;
  font-family:var(--fd);
  font-size:clamp(25px,2.4vw,31px);
  font-weight:700;
  line-height:1.1;
  letter-spacing:-.75px;
}
.pf-refined #heroBattleStage .hero-battle-grid{height:auto;aspect-ratio:auto;gap:12px}
.pf-refined #heroBattleStage .hero-battle-card{
  aspect-ratio:2/3;
  min-height:0;
  border:1px solid #ffffff26;
  border-radius:12px;
  background:#27241f;
  box-shadow:none;
  transform:none;
  transition:opacity .18s ease;
}
.pf-refined #heroBattleStage .hero-battle-image{height:100%;aspect-ratio:2/3;background:#27241f}
.pf-refined #heroBattleStage .hero-battle-image img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  transform:none;
  filter:none;
  transition:transform .3s ease;
}
.pf-refined #heroBattleStage .hero-battle-card::after{
  display:block;
  content:'';
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(180deg,transparent 68%,#00000066 100%);
}
.pf-refined #heroBattleStage .hero-battle-label{
  top:auto;
  bottom:12px;
  left:13px;
  display:flex;
  align-items:baseline;
  gap:5px;
  width:auto;
  height:auto;
  border-radius:0;
  background:none;
  color:#fffaf3;
  text-shadow:0 2px 10px #0009;
}
.pf-refined #heroBattleStage .hero-battle-label small{display:inline;font-size:9px;font-weight:750;letter-spacing:.1em}
.pf-refined #heroBattleStage .hero-battle-label strong{font-family:var(--fd);font-size:23px;font-weight:800;line-height:1}
.pf-refined #heroBattleStage .hero-battle-vs{
  width:36px;
  height:36px;
  border:1px solid #ffffff29;
  background:#1c1b17;
  color:#e1d9cc;
  box-shadow:0 4px 14px #0003;
  font-size:9px;
  font-weight:750;
  letter-spacing:.04em;
}
.pf-refined #heroBattleStage .hero-battle-card:hover,
.pf-refined #heroBattleStage.is-choosing .hero-battle-card.is-selected{border-color:#ffffff26;box-shadow:none;transform:none}
@media(hover:hover) and (pointer:fine){
  .pf-refined #heroBattleStage .hero-battle-card:hover .hero-battle-image img{transform:scale(1.028)}
}
.pf-refined #heroBattleStage.is-choosing .hero-battle-card.is-selected .hero-battle-image img{transform:scale(1.028)}
.pf-refined #heroBattleStage.is-choosing .hero-battle-card:not(.is-selected){opacity:.4}
.pf-refined #heroBattleStage .hero-battle-foot{
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:6px 16px;
  padding:0 2px;
  color:#b5afa4;
  font-size:12px;
  font-weight:500;
  line-height:1.5;
}
.pf-refined #heroBattleStage .hero-battle-foot>span{display:block;max-width:none}
.pf-refined #heroBattleStage .hero-battle-foot button{
  max-width:none;
  min-height:44px;
  padding:8px 0;
  color:#e1d9cc;
  font-size:12px;
  font-weight:650;
  text-align:left;
  white-space:nowrap;
}
.pf-refined #heroBattleStage :is(.hero-battle-card,.hero-battle-foot button):focus-visible{outline:3px solid #f1ece4;outline-offset:4px}


.pf-refined :is(.inspiration-head h2,.value-proof-copy h2,#heroBattleTitle,#choicePrompt){
  font-family:var(--fd);
  font-weight:700;
  line-height:1.15;
  letter-spacing:-.035em;
}
.pf-refined #fast-flow:not(.capsule-mode) #choicePrompt{
  max-width:760px;
  margin:0 auto 16px;
  font-size:clamp(24px,2.5vw,32px);
  text-wrap:balance;
}
.pf-refined #fast-flow:not(.capsule-mode) #choiceKicker{
  font-family:var(--fb);
  font-size:12px;
  font-weight:500;
  line-height:1.5;
  letter-spacing:.09em;
  margin-bottom:12px;
}


.pf-refined #fast-flow:not(.capsule-mode) #discoveryBaseSwitcher{
  display:block;
  width:100%;
  max-width:900px;
  margin:0 auto 24px;
  text-align:center;
}
.pf-refined #discoveryBaseToggle{
  display:inline-flex;
  min-height:44px;
  gap:8px;
  padding:8px 12px;
  border:1px solid var(--pf-line);
  border-radius:8px;
  background:transparent;
  color:var(--pf-ink);
  box-shadow:none;
  transform:none;
  font-size:13px;
  font-weight:500;
  list-style:none;
}
.pf-refined #discoveryBaseToggle::-webkit-details-marker{display:none}
.pf-refined #discoveryBaseFilterLabel{color:var(--pf-muted);font-size:13px;font-weight:400;letter-spacing:0;text-transform:none}
.pf-refined .pf-piece-change{margin-left:8px;color:var(--pf-muted);text-decoration:underline;text-underline-offset:3px}
.pf-refined #discoveryBaseToggle:hover{background:var(--pf-surface)}
.pf-refined #discoveryBaseSwitcher[open] .fast-base-toggle-arrow{transform:rotate(180deg)}
.pf-refined #discoveryBaseDrawer{
  position:static;
  width:100%;
  max-width:620px;
  margin:12px auto 0;
  padding:16px;
  border:1px solid var(--pf-line);
  border-radius:12px;
  background:var(--pf-surface);
  box-shadow:none;
  animation:none;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
}
.pf-refined #discoveryBaseSwitcher[open] #discoveryBaseDrawer{display:grid}
.pf-refined .pf-piece-help{grid-column:1/-1;margin:0 0 6px;font-size:13px;line-height:1.5;font-weight:400;color:var(--pf-muted)}
.pf-refined #discoveryBaseDrawer .fast-base-opt{min-height:44px;justify-content:center;padding:10px 8px;font-size:13px;font-weight:500;border:1px solid var(--pf-line);border-radius:8px;background:transparent;color:var(--pf-ink);transform:none;white-space:normal}
.pf-refined #discoveryBaseDrawer .fast-base-opt.on{background:var(--pf-accent);border-color:var(--pf-accent);color:#fffcf7}
.pf-refined #discoveryBaseDrawer .fast-base-opt:disabled{opacity:.45;cursor:not-allowed}
.pf-refined #discoveryBaseDrawer .fast-base-opt:focus-visible{outline:2px solid var(--pf-accent);outline-offset:3px}
@media(prefers-reduced-motion:reduce){
  .pf-refined #heroBattleStage .hero-battle-card:hover .hero-battle-image img,
  .pf-refined #heroBattleStage.is-choosing .hero-battle-card.is-selected .hero-battle-image img{transform:none}
}
@media(max-width:1000px){
  .pf-refined #hero-section{gap:32px}
  .pf-refined #heroBattleStage{padding:16px;gap:14px}
  .pf-refined #heroBattleStage h2{font-size:25px}
}
@media(max-width:760px){
  .pf-refined #hero-section{grid-template-columns:1fr;gap:30px}
  .pf-refined #heroBattleStage{padding:16px;border-radius:18px}
  .pf-refined #heroBattleStage h2{font-size:27px}
  .pf-refined #heroBattleStage .hero-battle-grid{gap:10px}
}
@media(max-width:440px){
  .pf-refined #discoveryBaseDrawer{grid-template-columns:repeat(2,minmax(0,1fr));padding:12px}
  .pf-refined #heroBattleStage{padding:12px;gap:12px;border-radius:16px}
  .pf-refined #heroBattleStage h2{font-size:23px;letter-spacing:-.5px}
  .pf-refined #heroBattleStage .hero-battle-kicker{font-size:10px;margin-bottom:7px}
  .pf-refined #heroBattleStage .hero-battle-grid{gap:8px}
  .pf-refined #heroBattleStage .hero-battle-card{border-radius:10px}
  .pf-refined #heroBattleStage .hero-battle-label{left:9px;bottom:10px;gap:4px}
  .pf-refined #heroBattleStage .hero-battle-label small{font-size:8px}
  .pf-refined #heroBattleStage .hero-battle-label strong{font-size:20px}
  .pf-refined #heroBattleStage .hero-battle-vs{width:30px;height:30px;font-size:8px}
  .pf-refined #heroBattleStage .hero-battle-foot{gap:2px 12px;font-size:11px}
  .pf-refined #heroBattleStage .hero-battle-foot button{font-size:11px}
}

/* Keep the entire comparison in view while retaining navigation and a visible piece control. */
.pf-refined.discovery-active .nav-inner{height:58px}
.pf-refined.discovery-active .nav-logo{font-size:22px;letter-spacing:-.8px}
.pf-refined.discovery-active .nav-logo .brand-mark{width:25px;height:25px;flex-basis:25px}
.pf-refined.discovery-active #fast-flow:not(.capsule-mode):not(.recommendation-mode):not(.fitfix-mode){padding-top:20px;align-items:flex-start}
.pf-refined #fast-flow:not(.capsule-mode):not(.recommendation-mode) #choiceGrid:not(.archive-grid){width:min(100%,var(--battle-max-width,900px));max-width:900px}
.pf-refined #fast-flow:not(.capsule-mode) #choicePrompt{font-size:clamp(24px,2.3vw,30px);margin-bottom:10px}
.pf-refined #fast-flow:not(.capsule-mode) #choiceKicker{margin-bottom:8px}
.pf-refined #fast-flow:not(.capsule-mode) #discoveryBaseSwitcher{margin:12px auto 0}

/* One readable type size across all mobile navigation destinations. */
@media(max-width:760px){
  .pf-refined .nav-logo,.pf-refined.discovery-active .nav-logo{font-size:20px;letter-spacing:-.8px;gap:7px}
  .pf-refined .nav-logo .brand-mark,.pf-refined.discovery-active .nav-logo .brand-mark{width:22px;height:22px;flex-basis:22px}
  .pf-refined .nav-right :is(.nav-secondary,.nav-cta){font:500 14px/1 var(--fb);white-space:nowrap}
  .pf-refined .nav-right .nav-saved-label{font:inherit}
}
@media(max-width:440px){
  .pf-refined .nav-inner{padding:0 16px;gap:10px}
  .pf-refined .nav-right{gap:8px}
  .pf-refined .nav-cta{padding:10px}
}
@media(max-width:360px){
  .pf-refined .nav-logo span{display:none}
  .pf-refined .nav-logo{gap:0;flex-shrink:0}
}
