/* Used Club Finder — brand styles (white, charcoal, golf blue; Barlow) */
/* Fonts are self-hosted (Latin subset, SIL Open Font License, see /fonts/OFL.txt): no request leaves the site. */
@font-face{font-family:"Barlow";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/Barlow-Regular.woff2) format("woff2")}
@font-face{font-family:"Barlow";font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/Barlow-Medium.woff2) format("woff2")}
@font-face{font-family:"Barlow";font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/Barlow-SemiBold.woff2) format("woff2")}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/BarlowCondensed-SemiBold.woff2) format("woff2")}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/BarlowCondensed-Bold.woff2) format("woff2")}
:root{
  --paper:#FFFFFF; --ink:#1E2227; --text:#3C4047; --muted:#5F656E; --line:#E3E5E8; --soft:#F4F5F7; --panel:#EEF3FA; --panel-line:#D3DDEA;
  --blue:#1F4E8C; --blue-ink:#FFFFFF; --strap:#1E2227; --strap-ink:#FFFFFF;
  --body:"Barlow","Helvetica Neue",Arial,sans-serif;
  --display:"Barlow Condensed","Arial Narrow",Arial,sans-serif;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --paper:#15191E; --ink:#F2F4F6; --text:#D5DAE0; --muted:#A4ABB5; --line:#2C323A; --soft:#1D2229; --panel:#1A2230; --panel-line:#2C3A4E;
  --blue:#9CC0EA; --blue-ink:#15191E; --strap:#0E1115; --strap-ink:#D5DAE0;}}
:root[data-theme="dark"]{
  --paper:#15191E; --ink:#F2F4F6; --text:#D5DAE0; --muted:#A4ABB5; --line:#2C323A; --soft:#1D2229; --panel:#1A2230; --panel-line:#2C3A4E;
  --blue:#9CC0EA; --blue-ink:#15191E; --strap:#0E1115; --strap-ink:#D5DAE0;}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
*,*::before,*::after{box-sizing:inherit}
body{margin:0;background:var(--paper);color:var(--text);font:18px/1.6 var(--body)}
a{color:var(--blue);text-underline-offset:3px}
a:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.strap{background:var(--strap);color:var(--strap-ink);font-size:14px;letter-spacing:.03em;text-align:center;padding:9px 16px}
.wrap{max-width:1040px;margin:0 auto;padding:0 24px}
header.top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 28px;padding:22px 0;border-bottom:1px solid var(--line)}
.logo{display:block;line-height:0}
.logo img{display:block;width:210px;height:auto;max-width:60vw}
nav.site{display:flex;flex-wrap:wrap;gap:6px 26px;font-weight:500;font-size:14px;letter-spacing:.14em;text-transform:uppercase}
nav.site a{color:var(--ink);text-decoration:none;padding:4px 0}
nav.site a[aria-current="page"]{text-decoration:underline;text-decoration-color:var(--blue);text-decoration-thickness:2px;text-underline-offset:6px}
main{padding:10px 0 48px}
h1{font:700 clamp(42px,6.5vw,72px)/.98 var(--display);color:var(--ink);text-transform:uppercase;letter-spacing:.005em;margin:44px 0 18px}
h2{font:700 32px/1.1 var(--display);color:var(--ink);text-transform:uppercase;letter-spacing:.01em;margin:44px 0 12px}
h3{font:600 20px/1.3 var(--body);color:var(--ink);margin:26px 0 6px}
strong{color:var(--ink)}
p,li{max-width:70ch}
.lede{font-size:20px;color:var(--text)}
.status{background:var(--soft);border-left:4px solid var(--blue);padding:14px 18px;border-radius:0 6px 6px 0;margin:26px 0}
.note{font-size:15px;color:var(--muted)}
.checked{font-size:14px;color:var(--muted)}
.scroll{overflow-x:auto;margin:14px 0 8px}
table{border-collapse:collapse;min-width:620px;width:100%;font-size:16px}
th,td{text-align:left;vertical-align:top;padding:11px 12px;border-bottom:1px solid var(--line)}
thead th{font:600 13px var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--ink);border-bottom:2px solid var(--ink)}
tbody th{font-weight:600;color:var(--ink);white-space:nowrap}
.scale{list-style:none;padding:0;margin:10px 0}
.scale li{display:grid;grid-template-columns:17ch 1fr;gap:4px 14px;padding:11px 0;border-bottom:1px solid var(--line)}
@media (max-width:560px){.scale li{grid-template-columns:1fr}}
.stores{list-style:none;padding:0}
.stores li{padding:13px 0;border-bottom:1px solid var(--line)}
.stores strong{display:block}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px;margin:22px 0}
.cards a{display:block;padding:20px;border:1px solid var(--line);border-radius:6px;background:var(--paper);color:var(--text);text-decoration:none}
.cards a:hover{border-color:var(--blue)}
.cards strong{display:block;font:700 22px/1.15 var(--display);text-transform:uppercase;letter-spacing:.01em;margin-bottom:6px}
footer{border-top:1px solid var(--line);padding:22px 0 36px;font-size:14px;color:var(--muted)}
footer p{margin:6px 0}
footer nav{display:flex;flex-wrap:wrap;gap:4px 18px;margin-bottom:10px}
footer nav a{color:var(--muted)}
footer .version{font-size:12px;color:var(--muted);opacity:.8}

/* Footer: brand + three link columns, slim bottom bar */
.site-foot{border-top:1px solid var(--line);margin-top:48px;padding:36px 0 28px;font-size:15px;color:var(--muted)}
.foot-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:28px 32px}
.foot-brand p{margin:8px 0 0}
.foot-logo{display:inline-block;line-height:0}
.foot-logo img{width:230px;max-width:100%;height:auto}
.foot-tag{font-weight:500;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--text);white-space:nowrap}
.foot-col{display:flex;flex-direction:column;gap:8px}
.foot-col h2{font:600 12px/1 var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--ink);margin:4px 0 6px}
.foot-col a{color:var(--muted);text-decoration:none}
.foot-col a:hover,.foot-brand a:hover{color:var(--blue);text-decoration:underline}
.foot-brand a{color:var(--muted)}
.foot-legal{font-size:13px;line-height:1.55;max-width:none;margin:28px 0 14px;padding-top:18px;border-top:1px solid var(--line)}
.foot-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 20px;font-size:13px}
@media (max-width:760px){.foot-grid{grid-template-columns:repeat(2,1fr)}.foot-brand{grid-column:1/-1}}

/* Model pages: the one "Buy new" box, set apart from used results */
.buy-new{display:grid;grid-template-columns:220px 1fr;gap:24px;align-items:start;margin:28px 0;padding:22px;border:1px solid var(--line);border-radius:6px}
.buy-new img{width:220px;height:220px;object-fit:contain;background:#F4F5F7;border-radius:4px}
.buy-new figure{margin:0}
.buy-new .zoom{margin:0;position:relative;z-index:1;width:220px}
.buy-new .zoom img{display:block;cursor:zoom-in;transform-origin:top left;transition:transform .2s ease,box-shadow .2s ease}
.buy-new .zoom:hover img,.buy-new .zoom:focus img{transform:scale(2.2);position:relative;z-index:5;box-shadow:0 10px 30px rgba(30,34,39,.25)}
.buy-new .zoom:focus{outline:none}
.buy-new .zoom:focus-visible img{outline:3px solid var(--blue);outline-offset:2px}
.buy-new .zoom figcaption{margin-top:6px;text-align:center;font-size:13px}
@media (prefers-reduced-motion:reduce){.buy-new .zoom img{transition:none}}
.buy-new h2{margin:0 0 6px;font-size:26px}
.buy-new p{margin:6px 0}
.buy-new .price{font:700 34px/1.1 var(--display);color:var(--ink)}
.buy-new .price span{display:block;font:400 16px/1.4 var(--body);color:var(--muted);margin-top:4px}
.btn{display:inline-block;background:var(--blue);color:var(--blue-ink);font-weight:600;padding:10px 18px;border-radius:4px;text-decoration:none;margin-top:6px}
.btn:hover{filter:brightness(1.1)}
@media (max-width:620px){.buy-new{grid-template-columns:1fr}.buy-new img{width:160px;height:160px}.buy-new .zoom{width:160px}.buy-new .zoom:hover img,.buy-new .zoom:focus img{transform:scale(2)}}

/* Driver spec facts: a two-column table, no minimum width */
table.facts{min-width:0;max-width:640px}
table.facts th{width:13ch}

/* Breadcrumbs on model pages */
.crumbs{margin:26px 0 -26px;font-size:14px;color:var(--muted)}
.crumbs a{color:var(--muted)}
.crumbs a:hover{color:var(--blue)}
.crumbs [aria-current]{color:var(--text)}

/* Brand jump links on /irons and /drivers */
.brand-jump{display:flex;flex-wrap:wrap;gap:8px 10px;margin:18px 0 8px}
.brand-jump a{display:inline-block;padding:6px 14px;border:1px solid var(--line);border-radius:999px;font-weight:500;font-size:15px;color:var(--ink);text-decoration:none}
.brand-jump a:hover{border-color:var(--blue);color:var(--blue)}
h2[id]{scroll-margin-top:16px}

/* /irons and /drivers: models in a responsive grid (3 columns wide, 2 on tablets, 1 on phones), read left to right, newest first */
.model-grid{list-style:none;padding:0;margin:10px 0 8px;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));column-gap:20px}
.model-grid li{padding:12px 0;border-top:1px solid var(--line)}
.model-grid a{display:inline-block;font-weight:600}
.model-grid span{display:block;font-size:15px;color:var(--muted);margin-top:2px}
.wrap .model-grid{max-width:none}

/* Family subheadings on /drivers */
h3.family{font:600 17px/1.3 var(--body);color:var(--ink);background:var(--soft);border-radius:4px;padding:9px 14px;margin:26px 0 2px}
h3.family span{font-weight:400;color:var(--muted);margin-left:6px}

/* Under a family band, lines go below each model instead of above, so the band isn't doubled by a rule */
h3.family + .model-grid li{border-top:0;border-bottom:1px solid var(--line)}

/* Alignment (v1.4.23): model names line up with the family label above them, and each row's prices share one line
   even when a name wraps. Each item spans three shared row tracks (name, used price, details) via subgrid; older browsers just stack. */
.model-grid li{padding-left:14px;padding-right:0}
.brand-jump + h2 + .model-grid li, h2 + .model-grid li{padding-left:0}
@supports (grid-template-rows:subgrid){
  .model-grid{grid-auto-rows:auto}
  /* v1.9.42: three rows (name, the Worker's "used from" price, details); with two, the price landed on top of the details */
  .model-grid li{display:grid;grid-row:span 3;grid-template-rows:subgrid;row-gap:0;align-content:start}
  .model-grid li > a{grid-row:1;align-self:end}
  .model-grid li > .used-from{grid-row:2;align-self:start}
  .model-grid li > span:not(.used-from){grid-row:3;align-self:start}
}
.model-grid a{font-size:17px;line-height:1.35}

/* Guide PDF download link */
.download{margin:16px 0 8px;display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px}
.download a{display:inline-block;padding:10px 20px;background:var(--blue);border:1px solid var(--blue);border-radius:999px;font-weight:600;font-size:15px;color:var(--blue-ink);text-decoration:none}
.download a::before{content:"\2193\00a0"}
.download a:hover{filter:brightness(1.12)}
.download a:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.download .note{font-size:14px}

/* Live used listings on model pages (filled in by the Worker from D1) */
.listings{margin:28px 0}
.listings table td a{white-space:nowrap;font-weight:600}

/* Buy new box without a network photo (deep links) */
.buy-new.no-img{grid-template-columns:1fr}

/* Complete my set (v1.6.8): the form, the club picker and the results the Worker fills in */
.cms-form{margin:28px 0;padding:22px;border:1px solid var(--line);border-radius:6px}
.cms-form h2{margin-top:0}
.cms-form label{display:block;font-weight:600;color:var(--ink);margin-bottom:4px}
.cms-form select{font:inherit;font-size:17px;padding:8px 10px;max-width:100%;border:1px solid var(--line);border-radius:4px;background:var(--paper);color:var(--text)}
.cms-form fieldset{border:0;padding:0;margin:0 0 16px}
.cms-form legend{font-weight:600;color:var(--ink);margin-bottom:4px}
.cms-form fieldset label{display:inline-flex;align-items:center;gap:6px;font-weight:400;margin-right:22px}
.cms-form .note{display:block;margin-top:4px}
button.btn{border:0;font:inherit;font-weight:600;cursor:pointer}
.club-pick{list-style:none;padding:0;margin:14px 0 24px;display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px}
.club-pick a{display:block;text-align:center;padding:12px 8px;border:1px solid var(--line);border-radius:6px;text-decoration:none;font-weight:600;color:var(--ink)}
.club-pick a:hover,.club-pick a:focus-visible{border-color:var(--blue);color:var(--blue)}
.club-pick span{display:block;font-weight:400;font-size:13px;color:var(--muted)}
.cms-results .summary{font-size:19px;color:var(--ink)}
.buy-new.hero .what{font-weight:600;color:var(--ink);margin:0 0 6px}
.cms-results h3 + .note{margin-top:0}
.fits li{margin:4px 0}

/* Guides (v1.6.11): driver family rows, lineage list, Ping color dots */
th.family-row{background:var(--soft);font:700 15px var(--display);letter-spacing:.06em;text-transform:uppercase;color:var(--ink)}
ul.lineage{padding-left:1.1em}
ul.lineage li{margin:6px 0}
.dot{display:inline-block;width:.85em;height:.85em;border-radius:50%;vertical-align:-.05em;margin-right:.35em;border:1px solid var(--line)}
.dot-maroon{background:#7b1e2b}.dot-silver{background:#c0c4c8}.dot-white{background:#fff}.dot-green{background:#2e7d32}
.dot-blue{background:#1f5fbf}.dot-black{background:#111}.dot-red{background:#c62828}.dot-orange{background:#ef6c00}
.dot-brown{background:#6d4c41}.dot-gold{background:#c9a227}.dot-yellow{background:#f2d12b}.dot-purple{background:#6a2c91}

/* Model-page listings layout (v1.6.14): summary cards, filter chips as links, photo rows, new offers grouped by price */
.live-summary{margin:28px 0 8px}
.live-summary .cards{display:flex;flex-wrap:wrap;gap:12px}
.live-summary.with-photo{display:flex;flex-wrap:wrap;gap:24px 40px;align-items:flex-start}
.live-summary .hero-photo{flex:1 1 260px;max-width:360px;margin:0;position:relative;z-index:2}
.live-summary .hero-photo img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:contain;background:#fff;border:1px solid var(--line);border-radius:10px;cursor:zoom-in;transform-origin:top left;transition:transform .2s ease,box-shadow .2s ease}
.live-summary .hero-photo:focus{outline:none}
.live-summary .hero-photo:focus-visible img{outline:3px solid var(--blue);outline-offset:2px}
.live-summary .hero-photo:focus img{transform:scale(2);box-shadow:0 10px 30px rgba(30,34,39,.25);cursor:zoom-out}
@media (hover:hover) and (pointer:fine){.live-summary .hero-photo:hover img{transform:scale(2);box-shadow:0 10px 30px rgba(30,34,39,.25)}}
@media (max-width:700px){.live-summary .hero-photo:focus img{transform:none;box-shadow:none}}
.live-summary .hero-main{flex:1 1 380px;min-width:0}
.live-summary .hero-main .cards{margin-top:0}
/* v1.9.71: the dated answer sentence above the price cards (UCF 12, item 1) */
.live-summary .answer{flex:1 1 100%;margin:0 0 14px;font-size:1.06rem;line-height:1.5;max-width:62ch}
/* v1.9.72a3: on a page with a photo the summary is a wrapping row, and 62ch left room for the photo beside the answer, pushing
   the price cards below both. The answer keeps a row to itself (its width plus the right margin is the full row) at 62ch. */
.live-summary.with-photo .answer{max-width:none;margin:0}   /* v1.9.72b: full width, so its edge lines up with the price cards below (Julien, Oct 17) */
.live-summary .card{flex:1 1 200px;border:1px solid var(--line);border-radius:10px;padding:14px 16px;display:flex;flex-direction:column;gap:2px}
.live-summary a.card{padding:14px 16px;border-radius:10px;background:none;color:inherit;text-decoration:none}.live-summary a.card:hover,.live-summary a.card:focus-visible{border-color:var(--blue)}   /* v1.9.72b7: the Used and New price cards jump to their listings */
.live-summary .card-label{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.live-summary .card-value{font:700 32px/1.1 var(--display);color:var(--ink)}
.live-summary .saving{font-size:18px;color:var(--ink);margin:14px 0 4px}
.listings .why{background:#EEF3FA;border-radius:8px;padding:10px 14px;color:var(--ink)}
.listings .chips{display:flex;flex-wrap:wrap;gap:12px 24px;margin:12px 0 8px}
.listings .chip-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.listings .chip-label{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);min-width:44px}
.listings .chip{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:1px solid var(--line);border-radius:999px;color:var(--ink);text-decoration:none;font-size:15px}
.listings .chip[aria-current]{background:var(--blue);border-color:var(--blue);color:var(--blue-ink)}
.listings .rows{list-style:none;margin:8px 0 0;padding:0;border-top:1px solid var(--ink)}
.listings .row{display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px;padding:16px 0;border-bottom:1px solid var(--line)}
.listings .thumb{flex:0 0 96px;width:96px;height:96px;border-radius:8px;overflow:hidden;background:var(--soft);border:1px solid var(--line);box-sizing:border-box;display:flex;align-items:center;justify-content:center;font-size:13px;color:var(--muted);text-decoration:none}
.listings .thumb img{display:block;width:100%;height:100%;object-fit:cover;color:transparent;font-size:0}
@media (hover:hover) and (pointer:fine){.listings a.thumb{position:relative;transform-origin:left center;transition:transform .2s ease,box-shadow .2s ease}.listings a.thumb:hover,.listings a.thumb:focus-visible{transform:scale(2);z-index:3;box-shadow:0 10px 30px rgba(30,34,39,.25);background:#fff}}
@media (prefers-reduced-motion:reduce){.live-summary .hero-photo img,.listings a.thumb{transition:none}}
.listings .what{flex:2 1 200px;display:flex;flex-direction:column}
.listings .what strong{color:var(--ink)}
.listings .what span{font-size:14px;color:var(--muted)}
.listings .what .hc.yes{color:var(--ink)}
.listings .what span.edition{color:var(--ink);font-weight:600}   /* v1.9.72b3: a limited edition, in bold under the heads line */
.listings .thumb img{position:relative}.listings .thumb img::after{content:"";position:absolute;inset:0;background:var(--soft)}   /* v1.9.72b3: a photo that fails to load shows the plain tile, not the browser's broken-image icon (a loaded photo has no ::after) */
.listings .cond{flex:1 1 150px;color:var(--ink)}
.listings .price{flex:1 1 130px}
.listings .price strong{font:700 24px/1.15 var(--display);color:var(--ink)}
.listings .btn-out{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:170px;padding:0 18px;border:1px solid var(--blue);border-radius:999px;color:var(--blue);font-weight:600;text-decoration:none}
.listings .btn-out.solid{background:var(--blue);color:var(--blue-ink)}
.listings .more{display:inline-flex;align-items:center;min-height:48px;padding:0 22px;border:1px solid var(--blue);border-radius:999px;font-weight:600;text-decoration:none}
.listings .tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:10px;margin:12px 0}
.listings .tile{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:72px;border:1px solid var(--line);border-radius:10px;text-decoration:none;color:var(--ink)}
.listings .tile strong{font:700 24px/1 var(--display)}
.listings .tile span{font-size:13px;color:var(--muted)}
.listings .row,.listings .rows,.live-summary .cards{max-width:none}
/* Homepage (v1.6.31): three points with line icons, then club tiles (drawn outlines now, Julien's photos later) */
.home-points{list-style:none;padding:0;margin:36px 0 8px;display:grid;grid-template-columns:repeat(3,1fr);gap:24px 32px}
.home-points li{display:flex;gap:14px;align-items:flex-start}
.home-points .pt-icon{flex:0 0 40px;width:40px;height:40px;color:var(--blue);margin-top:2px}
.home-points strong{display:block;color:var(--ink);font-weight:600;margin-bottom:2px}
.home-points span{display:block;font-size:16px;line-height:1.5;color:var(--muted)}
.club-tiles{list-style:none;padding:0;margin:16px 0 8px;display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.club-tiles a{display:flex;flex-direction:column;height:100%;padding:0 0 14px;border-radius:10px;background:var(--soft);color:var(--text);text-decoration:none;overflow:hidden;border:1px solid transparent}
.club-tiles a:hover{border-color:var(--blue)}
.club-tiles a:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.club-tiles .club-art{display:block;width:100%;height:auto;aspect-ratio:120/76;padding:18px 18px 6px;box-sizing:border-box;color:var(--blue)}
.club-tiles strong{display:block;padding:0 14px;font:700 22px/1.1 var(--display);text-transform:uppercase;color:var(--ink)}
.club-tiles span{display:block;padding:2px 16px 0;font-size:15px;color:var(--muted)}
@media (max-width:980px){.club-tiles{grid-template-columns:repeat(3,1fr)}}
@media (max-width:860px){.home-points{grid-template-columns:1fr}.club-tiles{grid-template-columns:repeat(2,1fr)}}
/* More new offers (v1.6.48): a plain details toggle under the first rows */
.more-offers{margin:4px 0 12px}
.more-offers summary{cursor:pointer;color:var(--blue);font-weight:600;padding:10px 0;list-style:none}
.more-offers summary::-webkit-details-marker{display:none}
/* v1.9.72b: each store's returns and warranty, folded under the rows */
.store-terms{margin:4px 0 12px}
.store-terms summary{cursor:pointer;color:var(--blue);font-weight:600;padding:10px 0}
.store-terms ul{margin:0 0 6px;padding-left:18px}
.store-terms li{margin:6px 0;line-height:1.45}
.more-offers summary::before{content:"+ "}
.more-offers[open] summary::before{content:"\2212 "}
.more-offers summary:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
/* Fill my bag (v1.6.57) */
.fill-results h3{margin-top:28px}
.fill-gaps{padding-left:1.2em}
.fill-gaps>li{margin:14px 0}
.fill-models{list-style:none;padding:0;margin:6px 0 0}
.fill-models li{padding:6px 0;border-bottom:1px solid var(--line)}
.fill-models li:last-child{border-bottom:0}
/* Julien's own photos (v1.6.58) */
.home-hero{margin:0 0 24px;border-radius:14px;overflow:hidden;aspect-ratio:1600/700;background:var(--panel)}
.home-hero img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 60%}
@media (max-width:640px){.home-hero{aspect-ratio:16/7;border-radius:12px;margin-bottom:16px}.home .home-hero{margin-bottom:0;border-radius:12px 12px 0 0}}   /* v1.7.57: a wide strip on phones, so the headline shows sooner */
/* v1.7.57 homepage: one panel for the headline, buttons and the three points; one soft band for Browse by club; tighter gaps */
.hero-panel{background:var(--panel);border:1px solid var(--panel-line);border-radius:12px;padding:28px 28px 24px;margin:0 0 8px}
/* v1.7.62: photo and panel as one hero: no gap, photo rounds the top corners, panel the bottom ones */
.home .home-hero{margin:0;border-radius:12px 12px 0 0}.home .home-hero + .hero-panel{border-top:0;border-radius:0 0 12px 12px}
.hero-panel h1{margin-top:0}.hero-panel .home-points{margin:28px 0 0}
.home h2{margin-top:30px}
.home .band{background:var(--soft);border-radius:12px;padding:6px 24px 20px;margin:30px 0 0}   /* v1.7.59: within the content width, like the hero panel */
.home .band h2{margin-top:24px}
.home .band .club-tiles a{background:var(--paper);border-color:var(--line)}.home .band .club-tiles a:hover{border-color:var(--blue)}   /* white cards on the soft band */
@media (max-width:640px){.hero-panel{padding:20px 18px 18px}.hero-panel .home-points{gap:18px}.home .band{padding:4px 14px 16px}}
@media (max-width:640px){.hero-panel h1{font-size:clamp(22px,calc((100vw - 86px) / 9.7),42px);white-space:nowrap}}   /* v1.7.63: one line on any phone, so Complete my set sits higher */
.page-photo{margin:16px 0 24px}
.page-photo img{display:block;width:100%;height:auto;max-height:360px;object-fit:cover;border-radius:12px}
.page-photo figcaption,.side-photo figcaption{font-size:14px;color:var(--muted);margin-top:8px}
/* v1.6.59: heading, intro and brand buttons beside the photo, its top level with the heading; on phones the photo follows the heading */
.intro-photo{display:grid;grid-template-columns:1fr 220px;grid-template-areas:"head photo" "rest photo";column-gap:32px;align-items:start;margin-bottom:8px}
.intro-photo>h1{grid-area:head}
.intro-photo>*:not(h1):not(.side-photo){grid-column:1}
.intro-photo>.side-photo{grid-area:photo;grid-row:1 / span 9;margin:53px 0 0}   /* the h1 top margin (44px) plus the space above its capitals, so the photo lines up with "DRIVERS" */
.side-photo{width:220px}
.side-photo img{display:block;width:100%;height:auto;border-radius:12px}
@media (max-width:700px){.intro-photo{display:block}.side-photo{width:100%;max-width:360px;margin:12px 0}}
/* Menu (v1.6.60): the Clubs panel opens on hover and on keyboard focus, no script */
nav.site{align-items:center}
@media (max-width:640px){nav.site{gap:6px 16px;letter-spacing:.08em}}   /* v1.7.64: the menu on two rows on phones */
@media (max-width:375px){nav.site{gap:6px 12px;font-size:13px}}
@media (max-width:340px){nav.site{gap:6px 9px;font-size:12px;letter-spacing:.05em}}
.menu{position:relative}
.menu-top::after{content:"";display:inline-block;width:6px;height:6px;margin-left:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-3px) rotate(45deg)}
.menu-panel{display:none;position:absolute;top:100%;left:-16px;padding-top:10px;z-index:30}
.menu-panel::before{content:"";position:absolute;inset:10px 0 0 0;background:var(--bg,#fff);border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.12);z-index:-1}
nav.site .menu-panel a{display:block;padding:9px 18px;min-width:180px;letter-spacing:.08em;white-space:nowrap}
nav.site .menu-panel a:first-child{margin-top:8px}
nav.site .menu-panel a:last-child{margin-bottom:8px}
nav.site .menu-panel a:hover,nav.site .menu-panel a:focus{background:var(--panel)}
nav.site .menu-panel a.all{border-top:1px solid var(--line);margin-top:6px;padding-top:12px;color:var(--blue)}
.menu:hover .menu-panel,.menu:focus-within .menu-panel{display:block}
/* v1.7.53: the Clubs panel in two columns (club types, brands); one column on phones */
.mcols{display:flex}.mcol{display:flex;flex-direction:column;padding-bottom:6px}
nav.site .menu-panel .mh{display:block;padding:14px 18px 4px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted,#6b7280)}
nav.site .menu-panel .mcol a{min-width:150px}
nav.site .menu-panel .mcol a:first-child{margin-top:0}
@media (max-width:600px){nav.site .menu-panel .mcol a{min-width:0;padding:8px 14px}nav.site .menu-panel .mh{padding:12px 14px 4px}}
/* v1.7.53: brand hubs on /clubs, and the hub link on model pages */
.brand-grid{list-style:none;padding:0;margin:14px 0 8px;display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.brand-grid a{display:flex;flex-direction:column;padding:14px 16px;border:1px solid var(--line);border-radius:12px;text-decoration:none}
.brand-grid a:hover{background:var(--panel);border-color:var(--blue)}
.brand-grid strong{font-size:18px}.brand-grid span{font-size:14px;color:var(--muted,#6b7280)}
p.brand-more{margin:-6px 0 14px;font-size:15px}
/* Two calls to action side by side (v1.6.62): the solid button, and an outline one of the same shape */
.cta-lead{margin:28px 0 4px;font-weight:600}
.cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:6px}
.cta .btn{margin-top:0}
.btn.secondary{background:transparent;color:var(--blue);box-shadow:inset 0 0 0 2px var(--blue)}
.btn.secondary:hover{filter:none;background:var(--panel)}
/* Comparisons (v1.6.64): rows where the two models differ */
table.compare tr.diff td{background:var(--panel);font-weight:600}
table.compare thead th{font-size:14px}
/* Homepage (v1.6.65): the brands line uses the full width; the last guides card links all of them */
p.brands{max-width:none}
.cards a.all-card{display:flex;flex-direction:column;justify-content:center;border:2px dashed var(--line);background:transparent;color:var(--blue)}
.cards a.all-card strong{color:var(--blue);margin:0}
.cards a.all-card:hover{border-color:var(--blue);background:var(--panel)}
/* Homepage (v1.6.66): live-prices line; "Before you buy used" as four compact questions */
p.live-note{display:flex;align-items:center;gap:10px;font-size:15px;color:var(--muted);margin-top:14px;max-width:none}
.live-note .dot{flex:0 0 auto;width:9px;height:9px;border-radius:50%;background:#2e9e5b;box-shadow:0 0 0 4px rgba(46,158,91,.15)}
.q-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:18px 0 8px}
.q-cards a{display:block;padding:16px 18px;border:1px solid var(--line);border-radius:8px;background:var(--paper);color:var(--text);text-decoration:none}
.q-cards a:hover{border-color:var(--blue)}
.q-cards strong{display:block;font:700 19px/1.2 var(--display);text-transform:uppercase;letter-spacing:.01em;margin-bottom:6px}
.q-cards span{font-size:15px;color:var(--muted)}
@media (max-width:860px){.q-cards{grid-template-columns:repeat(2,1fr)}}
/* Quick answers (v1.6.68) */
section.quick h3{font:600 17px/1.35 var(--body,inherit);text-transform:none;letter-spacing:0;margin:18px 0 4px}
section.quick p{margin-top:0}

/* Complete sets (v1.6.92) */
.listings.sets .row{display:flex;flex-wrap:wrap;align-items:center;gap:8px 24px;padding:14px 0;border-bottom:1px solid var(--line)}
.listings.sets .what{flex:1 1 320px;min-width:0}
.listings.sets .what strong{display:block;font:600 17px/1.35 var(--body);color:var(--ink)}
.listings.sets .what span{display:block;font:400 14px/1.4 var(--body);color:var(--muted);margin-top:2px}
.listings.sets .price{flex:0 0 170px}
.listings.sets .price strong{display:block;font:700 22px/1.2 var(--display,inherit)}
.listings.sets .price span{display:block;font:400 14px/1.4 var(--body);color:var(--muted)}
.listings.sets .go{margin-left:auto}
.listings.sets h2 .count{font-weight:400;color:var(--muted)}
@media (max-width:600px){.listings.sets .price{flex:1 1 auto}.listings.sets .go{margin-left:0}}
/* Skip link (v1.6.99) */
.skip{position:absolute;left:-9999px;top:8px;z-index:100;padding:8px 14px;background:var(--ink);color:#fff;border-radius:6px}
.skip:focus{left:8px}
/* Pinned cheapest used row (v1.7.0) */
.pin-label{font:600 13px/1 var(--body);text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin:14px 0 4px}
.listings .rows.pinned{border-top:2px solid var(--blue,#1F4E8C);margin-bottom:18px}
/* Best used pages (v1.7.3) */
.listings.best .what strong a{color:var(--ink);text-decoration:none}.listings.best .what strong a:hover{text-decoration:underline}
.listings.best .what span,.listings.best .price span{display:block}
/* Rows without a store photo keep the column, without a grey box (v1.7.5) */
.listings .thumb.blank{background:none;border:0}
/* Complete my set: folded rows (v1.7.6) */
.more-rows{margin:8px 0 18px}.more-rows summary{cursor:pointer;color:var(--blue,#1F4E8C);font-weight:600;padding:6px 0}
/* Best used: year headings (v1.7.8) */
.listings.best .year-head{list-style:none;font:600 13px/1 var(--body);text-transform:uppercase;letter-spacing:1px;color:var(--muted);padding:16px 0 6px;border-bottom:1px solid var(--line)}
/* Best pages: head-type groups (v1.7.9) */
.head-group{margin:22px 0 2px;font-size:20px}.head-group .count{font-weight:400;color:var(--muted)}

/* v1.8.0: model pages: merged-row count on its own line; jump links under the price cards */
.rows .price .note.same{display:block;margin-top:2px}
nav.jump{display:flex;flex-wrap:wrap;gap:6px 18px;margin:14px 0 0;font-size:15px}
nav.jump a{color:var(--blue);text-decoration:none;border-bottom:1px solid var(--line)}nav.jump a:hover{border-color:var(--blue)}
/* v1.8.0: Complete my set: club tiles on results, folded form and "How we choose", photo caption */
.club-pick.tiles{grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:8px;margin:10px 0 14px}.club-pick.tiles a{padding:8px 4px}
.club-pick a[aria-current]{background:var(--blue);border-color:var(--blue);color:var(--blue-ink,#fff)}.club-pick a[aria-current] span{color:inherit;opacity:.85}
/* v1.9.72b17: Complete my set asks the brand first (links, no script), then the brand's sets; flex help and "Not sure" */
.cms-label{font-weight:600;color:var(--ink);margin:0 0 6px}
.brand-pick{list-style:none;padding:0;margin:0 0 8px;display:flex;flex-wrap:wrap;gap:8px}
.brand-pick a{display:inline-block;padding:8px 14px;border:1px solid var(--line);border-radius:999px;text-decoration:none;font-weight:600;font-size:15px;line-height:1.4;color:var(--ink);background:var(--paper)}
.brand-pick a:hover,.brand-pick a:focus-visible{border-color:var(--blue);color:var(--blue)}
.brand-pick a[aria-current]{background:var(--blue);border-color:var(--blue);color:var(--blue-ink,#fff)}
.cms-form .cms-brand-note{margin:0 0 18px}
.cms-rest{border-top:1px solid var(--line);padding-top:18px}
.cms-flex{margin:0 0 16px}
details.flex-help{margin:6px 0 0;font-size:15px}details.flex-help summary{cursor:pointer;color:var(--blue)}
details.flex-help ul{margin:6px 0;padding-left:20px}details.flex-help li{margin:3px 0}details.flex-help p{margin:6px 0}
.home-cms .brand-pick{margin:4px 0 18px}
.club-pick.flex-pick{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));margin:12px 0 4px}.flex-pick li{display:flex}.flex-pick a{flex:1}
details.change-set,details.how{border:1px solid var(--line);border-radius:10px;padding:12px 16px;margin:20px 0}
details.change-set>summary,details.how>summary{cursor:pointer;font-weight:600;color:var(--ink)}
details.change-set[open]>summary,details.how[open]>summary{margin-bottom:10px}
details.change-set .cms-form{margin:0;border:0;padding:0}
.buy-new.hero figure figcaption{margin-top:4px;text-align:center}
/* v1.9.0 price alerts: the form on Complete my set results and the /alerts pages */
.alert-box{margin:28px 0;padding:20px 22px;border:1px solid var(--panel-line);background:var(--panel);border-radius:8px}
.alert-box h3{margin-top:0}
.alert-form label{display:block;font-weight:600;color:var(--ink);margin-bottom:4px}
.alert-form label.check{display:flex;gap:8px;align-items:flex-start;font-weight:400}
.alert-form input[type=email],.alert-form input[type=number],.alert-form select{font:inherit;font-size:17px;padding:8px 10px;border:1px solid var(--line);border-radius:4px;background:var(--paper);color:var(--text);max-width:100%}
.alert-form input[type=email]{width:22em}
.alert-form input[type=number]{width:7em}
.alert-form .dollar{display:inline-flex;align-items:center;gap:4px;color:var(--ink)}
.alert-form .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.alert-form.inline{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:6px 0}
.alert-form.inline label{display:inline;margin:0;font-weight:400}
.btn.ghost{background:transparent;color:var(--blue);border:1px solid var(--blue)}
.alert-list{list-style:none;padding:0}
.alert-row{border-top:1px solid var(--line);padding:12px 0}
/* v1.9.1 budget pages: "Start here" picks and loft links */
.best-picks{margin:24px 0 8px}
.best-picks h2{margin-bottom:10px}
ul.picks{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
ul.picks li{border:1px solid var(--panel-line);background:var(--panel);border-radius:8px;padding:14px 16px}
ul.picks .pick-label{margin:0;font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--blue)}
ul.picks h3{margin:4px 0 6px;font-size:19px}
ul.picks .pick-price{margin:0 0 6px;color:var(--ink)}
ul.picks .note{margin:0}
p.loft-pick{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:18px 0}
p.loft-pick a{display:inline-flex;min-height:36px;align-items:center;padding:0 12px;border:1px solid var(--line);border-radius:999px;text-decoration:none;color:var(--ink)}
p.loft-pick a[aria-current]{background:var(--blue);border-color:var(--blue);color:var(--blue-ink)}
/* v1.9.22: homepage, words first: headline, model search, live proof, today's picks; a short photo band; trust line in the strap */
.vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.strap a{color:inherit;text-decoration:underline;text-underline-offset:3px;margin-left:6px}
.home .home-top h1{font-size:clamp(34px,4.4vw,54px);white-space:normal;margin-bottom:12px}
.home .home-top{border-top:1px solid var(--panel-line);border-radius:12px;margin-top:28px}
.home-search{display:flex;gap:10px;margin:22px 0 10px;max-width:680px}
.home-search input{flex:1 1 auto;min-width:0;font:inherit;font-size:19px;padding:12px 14px;border:2px solid var(--panel-line);border-radius:6px;background:var(--paper);color:var(--ink)}
.home-search input:focus{outline:3px solid var(--blue);outline-offset:1px;border-color:var(--blue)}
.home-search .btn{margin:0;padding:12px 24px;font-size:18px}
p.home-alt{font-size:16px;color:var(--muted);margin:0 0 4px}
.home .home-hero{aspect-ratio:auto;height:200px;margin:24px 0 0;border-radius:12px}
.home .home-hero img{object-position:40% 18%}
.home-picks-h{font:700 22px/1.2 var(--display);text-transform:uppercase;letter-spacing:.01em;color:var(--ink);margin:26px 0 4px}
.home-picks-rule{margin:0 0 12px}
ul.home-picks{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
ul.home-picks li{min-width:0}   /* v1.9.43: a card never widens its column (a store image that fails to load kept its 200 px width and pushed the page sideways) */
ul.home-picks li{display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);border-radius:8px;padding:12px;font-size:15px;line-height:1.4}
ul.home-picks img{display:block;width:100%;max-width:100%;min-width:0;height:110px;object-fit:contain;margin:0 0 8px;background:#fff;border-radius:4px}
ul.home-picks .kind{font:600 12px var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
ul.home-picks .name{font-weight:600;color:var(--ink);margin:2px 0}
ul.home-picks .name a{color:var(--ink);text-decoration:none}
ul.home-picks .name a:hover{text-decoration:underline}
ul.home-picks .what{color:var(--muted)}
ul.home-picks .price{margin:8px 0 2px;font:700 22px/1.1 var(--display);color:var(--ink)}
ul.home-picks .price small{display:block;font:400 14px/1.3 var(--body);color:var(--muted);margin-top:2px}   /* v1.9.32 */
.home-picks-sec{margin:30px 0 0}
.home-picks-sec h2{margin-bottom:12px}.home-picks-sec h2+.home-disclose{margin:-4px 0 14px}   /* v1.9.35: disclosure under the title, before the cards */
ul.home-types{margin:4px 0 14px}
ul.home-types a strong{font-weight:600}
ul.home-chips.home-types{gap:6px}ul.home-chips.home-types a{padding:0 9px;gap:5px;font-size:15px;min-height:36px}ul.home-chips.home-types span{font-size:13px}
@media (max-width:640px){ul.home-chips.home-types{display:grid;grid-template-columns:1fr 1fr;gap:8px}ul.home-chips.home-types a{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:0;padding:6px 12px;border-radius:10px;min-height:52px;width:100%;box-sizing:border-box}ul.home-chips.home-types span{font-size:13px}}
ul.home-picks .ship{color:var(--muted);font-size:14px}
ul.home-picks .btn{margin-top:auto;padding:8px 12px;text-align:center;font-size:15px}
ul.home-picks .spacer{flex:1 1 auto;min-height:8px}
.home-pop{margin:30px 0 0}
.home-pop h2{margin-bottom:8px}
ul.home-chips{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:10px}
ul.home-chips a{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px;border:1px solid var(--line);border-radius:999px;color:var(--ink);text-decoration:none;font-size:16px}
ul.home-chips a:hover{border-color:var(--blue)}
ul.home-chips span{color:var(--muted);font-size:14px}
.home-cms{margin:34px 0 0;padding:6px 24px 8px;border:1px solid var(--line);border-radius:12px;background:var(--soft)}   /* v1.9.33: grey, so the tool stands out */
details.home-picks-rule{margin:12px 0 0}details.home-picks-rule summary{cursor:pointer;color:var(--blue);font-size:15px}details.home-picks-rule p{margin:6px 0 0}
@media (max-width:980px){ul.home-picks{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){.home .home-hero{height:120px;margin-top:16px}ul.home-picks{grid-template-columns:repeat(2,minmax(0,1fr))}.home .home-top h1{font-size:clamp(30px,8.6vw,42px)}
  .home-search .btn{padding:12px 16px}.home-cms{padding:4px 16px 4px}.home .home-top{margin-top:16px}.home .home-top .lede{font-size:18px}}
/* v1.9.27: "used from $X" beside model links on hubs, comparisons and indexes (worker/prices.js) */
.used-from{font-size:14px;color:#2e7d4f;white-space:nowrap}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .used-from{color:#7fd1a2}}
:root[data-theme="dark"] .used-from{color:#7fd1a2}
.model-grid .used-from{display:block;font-size:14px}
th .used-from,td .used-from{display:block;font-size:13px;font-weight:400}

/* v1.9.31: deals (worker/deals.js) */
.deal{display:inline-block;margin-top:4px;padding:2px 8px;border-radius:6px;background:#e7f4ec;color:#1d6b3f;font-size:14px;font-weight:600}
.deal.strong{background:#1d6b3f;color:#fff}
.listings .what span.deal{color:#1d6b3f}.listings .what span.deal.strong{color:#fff}   /* v1.9.72a4: `.listings .what span` greyed the chip text (deals are off until November) */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .deal{background:#16382a;color:#9fe0bb}:root:not([data-theme="light"]) .deal.strong{background:#2e8b57;color:#fff}}
:root[data-theme="dark"] .deal{background:#16382a;color:#9fe0bb}:root[data-theme="dark"] .deal.strong{background:#2e8b57;color:#fff}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .listings .what span.deal{color:#9fe0bb}:root:not([data-theme="light"]) .listings .what span.deal.strong{color:#fff}}:root[data-theme="dark"] .listings .what span.deal{color:#9fe0bb}:root[data-theme="dark"] .listings .what span.deal.strong{color:#fff}
ul.home-picks.home-deals{grid-template-columns:repeat(3,minmax(0,1fr))}ul.home-picks .deal{align-self:flex-start;font-size:13px}   /* v1.9.34 */
@media (max-width:640px){ul.home-picks.home-deals{grid-template-columns:1fr}}
.deal-rows{list-style:none;padding:0;margin:0 0 24px}.deal-rows li{display:grid;grid-template-columns:1fr auto;gap:4px 16px;padding:12px 0;border-bottom:1px solid var(--line)}
.deal-rows .name{font-weight:600}.deal-rows .what{grid-column:1;color:var(--muted);font-size:15px}.deal-rows .price{grid-column:2;grid-row:1;font-weight:700;text-align:right}
.deal-rows .deal{grid-column:1}.deal-rows .btn-out{grid-column:2;grid-row:2 / span 2;align-self:center}
/* v1.9.46: brand pages, "The newest <brand> clubs, used" (worker/brands.js): large photos on plain white cards */
.brand-gallery-sec{margin:28px 0 36px}
.brand-gallery-sec h2{margin-bottom:12px}.brand-gallery-sec h2+.home-disclose{margin:-4px 0 16px}
ul.brand-gallery{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
ul.brand-gallery li{min-width:0;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;font-size:15px;line-height:1.4;padding:0 16px 16px}
ul.brand-gallery .bg-photo{display:block;aspect-ratio:4/3;background:#fff;border-bottom:1px solid var(--line);margin:0 -16px 14px}
ul.brand-gallery .bg-photo img{display:block;width:100%;max-width:100%;min-width:0;height:100%;object-fit:contain;padding:18px;box-sizing:border-box}
ul.brand-gallery .kind{font:600 12px var(--body);letter-spacing:.12em;text-transform:uppercase;color:#5d6670}
ul.brand-gallery .name{font:700 20px/1.2 var(--display);text-transform:uppercase;letter-spacing:.01em;margin:4px 0 2px}
ul.brand-gallery .name a{color:#1b1f24;text-decoration:none}ul.brand-gallery .name a:hover{text-decoration:underline}
ul.brand-gallery .what,ul.brand-gallery .grade{color:#5d6670}
ul.brand-gallery .price{margin:10px 0 2px;font:700 24px/1.1 var(--display);color:#1b1f24}
ul.brand-gallery .price small{display:block;font:400 14px/1.3 var(--body);color:#5d6670;margin-top:2px}
ul.brand-gallery .price small.from{display:inline;font:600 13px var(--body);text-transform:uppercase;letter-spacing:.08em;margin:0}
ul.brand-gallery .spacer{flex:1 1 auto;min-height:12px}
ul.brand-gallery .btn{margin-top:auto;padding:10px 12px;text-align:center;font-size:15px;display:flex;align-items:center;justify-content:center;box-sizing:border-box;min-height:44px}
/* v1.9.54: the New button has a fixed height (one line, two on narrow cards), and cards without one get an invisible stand-in (.ph), so the "See at" buttons line up */
ul.brand-gallery .btn-new{display:flex;align-items:center;justify-content:center;gap:0 .3em;box-sizing:border-box;height:38px;margin-top:8px;padding:0 10px;border:1px solid var(--line);border-radius:4px;font-size:14px;line-height:1.3;color:var(--blue);text-decoration:none;background:#fff;white-space:nowrap;overflow:hidden}
ul.brand-gallery .btn-new .nl{overflow:hidden;text-overflow:ellipsis;min-width:0}
ul.brand-gallery .btn-new .np{flex:0 0 auto}
ul.brand-gallery .btn-new:hover{border-color:var(--blue);text-decoration:underline}
ul.brand-gallery .btn-new.ph{visibility:hidden}
@media (max-width:980px){ul.brand-gallery .btn-new{flex-direction:column;height:52px;font-size:13px}ul.brand-gallery .btn-new .nl,ul.brand-gallery .btn-new .np{max-width:100%}ul.brand-gallery .btn-new .c{display:none}}
@media (max-width:640px){ul.brand-gallery .btn{min-height:52px;padding:6px 8px;line-height:1.25}ul.brand-gallery .btn-new{height:60px;padding:0 6px;line-height:1.2;white-space:normal;text-align:center}ul.brand-gallery .btn-new .nl{overflow:visible}}
@media (max-width:980px){ul.brand-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){ul.brand-gallery{gap:12px}ul.brand-gallery li{padding:0 12px 12px}ul.brand-gallery .bg-photo{margin:0 -12px 12px}ul.brand-gallery .bg-photo img{padding:10px}ul.brand-gallery .name{font-size:17px}ul.brand-gallery .price{font-size:21px}}
ul.brand-gallery .launch{margin-top:4px;font-size:14px;line-height:1.35;color:#1e6b45}   /* v1.9.49: "Launched at $699.99 · 13% less" */
@media (max-width:640px){ul.brand-gallery .bg-photo{aspect-ratio:3/2}ul.brand-gallery .launch{font-size:13px}}   /* v1.9.49: shorter cards on phones */
/* v1.9.55: answers with today's numbers (budget pages' opening sentence, brand pages' cost table) */
p.answer{margin:4px 0 18px;padding:12px 16px;background:var(--panel);border-left:3px solid var(--blue);border-radius:4px;line-height:1.5}
table.used-by-year caption{caption-side:top;text-align:left;font-weight:600;padding:0 0 8px}
tr.used-row th,tr.used-row td{font-weight:600;border-top:2px solid var(--line)}
/* v1.9.56: how fast golf clubs lose value: small multiples, one per club type, in the site's colors (light and dark) */
.value-chart{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 18px;margin:8px 0 6px}
.value-panel{margin:0;min-width:0}.value-panel svg{display:block;width:100%;height:auto}
.value-panel .vg{stroke:var(--line);stroke-width:1}
.value-panel .vt{font:11px var(--body);fill:var(--muted)}
.value-panel .vh{font:600 13px var(--body);fill:var(--ink)}
.value-panel .vv{font:600 12px var(--body);fill:var(--ink)}
.value-panel .vl{fill:none;stroke:var(--blue);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.value-panel .vd{fill:var(--blue);stroke:var(--paper);stroke-width:2}
table.value-table caption{caption-side:top;text-align:left;font-weight:600;padding:0 0 8px}
@media (max-width:760px){.value-chart{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.value-chart{grid-template-columns:minmax(0,340px)}}   /* one panel a row on phones, so the labels stay readable */
table.value-table td,table.value-table th{white-space:nowrap}
/* a wide table scrolls; its caption stays in view and wraps to the screen */
.scroll table.value-table caption,.scroll table.used-by-year caption{position:sticky;left:0;max-width:calc(100vw - 32px);white-space:normal}

/* v1.9.71 (UCF 12, item 5): pages cross-fade instead of flashing (browsers that support cross-document view transitions) */
@view-transition{navigation:auto}
@media (prefers-reduced-motion:reduce){@view-transition{navigation:none}}
/* v1.9.71 (UCF 10): the market report sign-up, a link to Substack */
.report-signup{margin:40px 0 8px;padding:20px 22px;border:1px solid var(--line);border-left:4px solid var(--blue);border-radius:8px;max-width:720px}
.report-signup h2{margin:0 0 8px;font-size:1.25rem}
.report-signup p{margin:0 0 10px}
.report-signup .note{margin:6px 0 0}
/* v1.9.72 (UCF 10): the market report */
.report .report-chart{display:block;width:100%;max-width:640px;height:auto;margin:8px 0 16px;border:1px solid var(--line);border-radius:8px}
.report-list{list-style:none;padding:0}
.report-list li{margin:0 0 10px}
.report-intro,.report-tip{max-width:68ch}
/* v1.9.72 (UCF 12, item 6): print. Menus, filters, buttons and the sign-up box drop out; the answer, prices, tables and
   the page's address stay. Links print their text only; the footer line gives the source. */
@media print{
  :root{color-scheme:light}
  body{background:#fff;color:#000;font-size:11pt}
  .strap,header.top nav.site,.skip,.site-foot .foot-grid,.chips,.jump,nav.jump,.filters,.pin-label,.more,.btn,.btn-out,.report-signup,.home-search,.hero-photo,a.thumb,.tiles{display:none!important}
  .wrap{max-width:none;padding:0}
  a{color:#000;text-decoration:none}
  .live-summary .answer{background:none;border-left:3px solid #000;padding-left:10px}
  .card{break-inside:avoid;border:1px solid #999}
  table{break-inside:auto}tr,li{break-inside:avoid}
  h1,h2,h3{break-after:avoid}
  .site-foot{border-top:1px solid #999;margin-top:16px}
  .site-foot .foot-legal::after{content:" Printed from usedclubfinder.com; prices change daily, check the page for today's.";}
  .report .report-chart{border:0}
  .deal,.deal.strong{background:none!important;color:#000!important;border:1px solid #999}
}
/* v1.9.72d: model pages on phones (review of Oct 17: the price cards started 1.3 screens down and the first store button
   2.8). One-line strap, a tighter header, no product photo above the cards (the rows show the same stock photo), two-line
   rows, one-line chip rows that scroll sideways. Desktop is unchanged apart from the used buttons and the generation line. */
.listings.mp .btn-out.used{background:var(--blue);color:var(--blue-ink)}
.live-summary .gen-line{margin:8px 0 0;font-size:16px}
.live-summary .gen-line .used-from{white-space:nowrap}
.listings .pin-why{font-size:14px;color:var(--muted);margin:-2px 0 6px}
.cond-table{border-collapse:collapse;margin:10px 0 4px;font-size:16px;min-width:min(100%,420px)}
.cond-table th,.cond-table td{text-align:left;padding:6px 14px 6px 0;border-bottom:1px solid var(--line)}
.cond-table th[scope="col"]{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:500}
.cond-table td.n{color:var(--muted)}
@media (max-width:640px){
  .strap-long{display:none}
  .strap{font-size:13px;padding:7px 12px}
  header.top{padding:12px 0;gap:6px 20px}
  nav.site a{padding:2px 0}
  .crumbs{margin:16px 0 -14px}
  h1{font-size:clamp(30px,9vw,40px);margin:24px 0 10px}
  .lede{font-size:17px;line-height:1.5;margin:0 0 10px}
  .live-summary{margin:14px 0 8px}
  .live-summary.with-photo .hero-photo{display:none}
  .live-summary .answer{font-size:1rem}
  .live-summary .card{padding:10px 14px}
  .live-summary .card-value{font-size:28px}
  .listings.mp h2{font-size:26px;margin:32px 0 8px}
  .listings.mp .chip-row{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin;padding-bottom:4px}
  .listings.mp .chip{flex:0 0 auto;white-space:nowrap;padding:0 14px}
  .listings.mp .chip-label{flex:0 0 auto}
  .listings.mp .row{display:grid;grid-template-columns:72px minmax(0,1fr) auto;grid-template-areas:"thumb what what" "thumb cond cond" "price price btn";gap:2px 12px;align-items:start;padding:12px 0}
  .listings.mp .row > .thumb{grid-area:thumb;width:72px;height:72px}
  .listings.mp .row > .what{grid-area:what;min-width:0}
  .listings.mp .row > .cond{grid-area:cond;font-size:15px}
  .listings.mp .row > .price{grid-area:price;align-self:center;margin-top:6px}
  .listings.mp .row > .price strong{font-size:22px}
  .listings.mp .row > .btn-out{grid-area:btn;align-self:center;margin-top:6px;min-width:0;padding:0 16px}
}
@media (max-width:640px){.live-summary .card{flex:1 1 140px;min-width:0}.live-summary .card .note{font-size:13px}}
.cond-table tbody th{white-space:normal;font-weight:500}
@media (max-width:640px){.cond-table{width:100%;font-size:15px}.cond-table th[scope="col"]{letter-spacing:0;font-size:12px}.cond-table th,.cond-table td{padding-right:10px}}
@media (max-width:640px){.listings.mp .row > .btn-out{white-space:nowrap;font-size:15px;padding:0 14px;max-width:100%}.listings.mp .row > .price strong{font-size:20px;white-space:nowrap}}
@media (max-width:359px){.listings.mp .row{grid-template-areas:"thumb what what" "thumb cond cond" "price price price" "btn btn btn"}.listings.mp .row > .btn-out{justify-self:start}}
/* v1.9.72a5: the forum-post block on model pages */
details.share{margin:18px 0 6px;border:1px solid var(--line);border-radius:10px;padding:10px 14px}
details.share summary{cursor:pointer;font-weight:600;color:var(--blue)}
details.share label{display:block;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:12px 0 4px}
details.share textarea{display:block;width:100%;box-sizing:border-box;font:14px/1.45 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--ink);background:var(--soft,#f5f6f8);border:1px solid var(--line);border-radius:6px;padding:8px 10px;resize:vertical}
/* v1.9.72d: eBay listings (worker/ebay.js), always boxed apart from the store sections */
.ebay-box{border:2px solid var(--panel-line);background:var(--panel);border-radius:8px;padding:6px 20px 18px;margin:32px 0}.ebay-box h2,.ebay-box h3{margin-top:14px}.ebay-box .rows{background:var(--paper);border-radius:6px}.ebay-box p{max-width:none}
/* v1.9.72c9 (Julien, Oct 23): room inside the white list so photos and buttons don't touch its edges; single-iron tiles on one layout */
.ebay-box .rows .row{padding:16px 18px}
.ebay-box .tiles{grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:12px}
.ebay-box .tile{justify-content:flex-start;gap:4px;padding:12px 10px 14px;background:var(--paper);text-align:center}
.ebay-box .tile strong{margin-bottom:2px}
.ebay-box .tile .t-price{font-size:15px;font-weight:600;color:var(--ink)}.ebay-box .tile .t-price small{display:block;font-size:13px;font-weight:400;color:var(--muted)}
.ebay-box .tile .t-meta{font-size:13px;color:var(--muted)}
.ebay-box .tile:hover,.ebay-box .tile:focus-visible{border-color:var(--blue)}
@media (max-width:600px){.ebay-box{padding:4px 14px 14px}.ebay-box .rows .row{padding:14px 12px}}

