/* Join the club owns its presentation; checkout and the product gallery remain native. */
.tl-club-page { background:#000; color:#fff; padding:56px 0 88px; }
.tl-club { --club-lime:#ccff00; --club-line:#2b2b2b; box-sizing:border-box; color:#fff; font:400 15px/1.65 Inter,system-ui,sans-serif; }
.tl-club *, .tl-club *::before, .tl-club *::after { box-sizing:border-box; }
.tl-club-page>.tl-club { width:calc(100% - 48px); max-width:1240px; margin-inline:auto; }
.tl-club h1, .tl-club h2, .tl-club h3 { color:#fff; font-family:'Roboto Condensed','Arial Narrow',sans-serif; text-transform:uppercase; letter-spacing:-.025em; }
.tl-club a { color:inherit; text-decoration:none; }
.tl-club a:focus-visible, .tl-club button:focus-visible, .tl-club select:focus-visible, .tl-club [tabindex]:focus-visible { outline:2px solid var(--club-lime); outline-offset:4px; }
.tl-club .tl-club-eyebrow { margin:0 0 12px; color:var(--club-lime); font:700 11px/1.5 'Roboto Condensed','Arial Narrow',sans-serif; text-transform:uppercase; letter-spacing:.2em; }
.tl-club .tl-club-heading { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:20px; }
.tl-club .tl-club-heading h2 { font-size:clamp(32px,3vw,44px); font-weight:900; line-height:1; margin:0 0 12px; }
.tl-club .tl-club-heading h2>span, .tl-club-intro h1>span { color:var(--club-lime); }
.tl-club .tl-club-heading p:not(.tl-club-eyebrow), .tl-club-intro>p:not(.tl-club-eyebrow) { color:#b6b6b6; margin:0; }
.tl-club .tl-club-textlink { display:inline-flex; align-items:center; gap:12px; min-height:44px; color:#fff; font-size:13px; font-weight:500; text-decoration:underline; text-underline-offset:6px; text-decoration-color:#777; }
.tl-club .tl-club-textlink:hover { color:var(--club-lime); text-decoration-color:var(--club-lime); }
.tl-club .tl-club-card { min-width:0; margin:0; scroll-snap-align:start; }
.tl-club .tl-club-by { color:#aaa; font-size:12px; margin:0 0 10px; }
.tl-club .tl-club-controls { display:flex; justify-content:flex-end; gap:8px; padding-top:12px; }
.tl-club .tl-club-controls[hidden] { display:none; }
.tl-club .tl-club-controls button { width:48px; height:44px; padding:0; background:#111; color:#fff; border:1px solid #444; border-radius:0; font-size:21px; cursor:pointer; }
.tl-club .tl-club-controls button:disabled { opacity:.3; cursor:default; }
.tl-club .tl-club-controls button:not(:disabled):hover { color:var(--club-lime); border-color:var(--club-lime); }
.tl-club-intro { padding:24px 0 48px; border-bottom:1px solid var(--club-line); }
.tl-club-intro h1 { font-weight:900; font-size:clamp(64px,10vw,132px); line-height:.95; margin:0 0 24px; }
.tl-club-intro>p:not(.tl-club-eyebrow) { font-size:18px; }
.tl-club .tl-club-filters { display:flex; flex-wrap:wrap; gap:20px; align-items:end; padding:28px 0 36px; }
.tl-club .tl-club-filters label { display:grid; gap:8px; min-width:180px; flex:1; color:#aaa; font:700 11px/1.5 'Roboto Condensed','Arial Narrow',sans-serif; text-transform:uppercase; letter-spacing:.1em; }
.tl-club .tl-club-filters select { width:100%; max-width:100%; border:1px solid #444; border-radius:0; color:#fff; background:#111; min-height:46px; font:400 14px/1.4 Inter,system-ui,sans-serif; text-transform:none; letter-spacing:normal; padding:10px 32px 10px 12px; }
.tl-club .tl-club-button { min-height:46px; border:0; border-radius:0; background:var(--club-lime); color:#000; padding:12px 24px; cursor:pointer; font:800 14px/1.5 'Roboto Condensed','Arial Narrow',sans-serif; text-transform:uppercase; letter-spacing:.05em; }
.tl-club .tl-club-empty { padding:48px 0; color:#bbb; }
.tl-club .tl-club-empty h2 { font-size:32px; }
.tl-club .tl-club-pagination { display:flex; justify-content:center; align-items:center; gap:24px; padding:40px 0; color:#aaa; font-size:12px; }
.tl-club .tl-club-back { margin-bottom:28px; }
.tl-club .tl-club-look { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:64px; align-items:start; }
.tl-club .tl-club-hero-photo { min-width:0; }
.tl-club .tl-club-hero-photo>a { display:block; position:relative; background:#181818; }
.tl-club .tl-club-hero-photo img { width:100%; height:auto; display:block; }
.tl-club .tl-club-enlarge { position:absolute; right:16px; bottom:16px; display:grid; place-items:center; width:44px; height:44px; border:1px solid #666; background:#000b; font-size:24px; }
.tl-club .tl-club-credit { font-size:11px; color:#888; margin:12px 0; }
.tl-club .tl-club-look-copy { position:sticky; top:100px; min-width:0; }
.tl-club .tl-club-look h1 { font-size:clamp(40px,4.8vw,68px); font-weight:900; line-height:1; margin:0 0 18px; overflow-wrap:anywhere; }
.tl-club .tl-club-person { margin:0; font-size:18px; color:#ddd; }
.tl-club .tl-club-story { color:#bbb; margin:20px 0 28px; overflow-wrap:anywhere; }
.tl-club .tl-club-story p { margin:0 0 16px; }
.tl-club .tl-club-story a { text-decoration:underline; }
.tl-club .tl-club-story img { max-width:100%; height:auto; }
.tl-club .tl-club-shop { border-top:1px solid var(--club-line); padding-top:24px; }
.tl-club .tl-club-shop h2 { font-size:24px; line-height:1.2; margin:0 0 20px; }
.tl-club .tl-club-shop-card { display:flex; gap:20px; padding:16px; border:1px solid var(--club-line); margin-bottom:12px; align-items:center; background:#111; }
.tl-club .tl-club-shop-card:hover { border-color:#777; }
.tl-club .tl-club-shop-card>img { width:88px; height:104px; object-fit:contain; flex-shrink:0; background:#191919; }
.tl-club .tl-club-shop-card>div { min-width:0; }
.tl-club .tl-club-shop-card h3 { margin:0 0 6px; font-size:24px; line-height:1.1; }
.tl-club .tl-club-shop-card .fct-product-prices { display:flex; flex-wrap:wrap; gap:4px; margin:8px 0; color:#ccc; font:400 14px/1.5 Inter,system-ui,sans-serif; }
.tl-club .tl-club-shop-cta { display:block; color:var(--club-lime); font:700 13px/1.5 'Roboto Condensed','Arial Narrow',sans-serif; text-transform:uppercase; letter-spacing:.04em; margin-top:8px; }
.tl-club .fct-sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
@media(max-width:900px){
 .tl-club .tl-club-look { gap:32px; }
}
@media(max-width:600px){
 .tl-club-page { padding-block:24px 56px; }
 .tl-club-page>.tl-club { width:calc(100% - 40px); }
 .tl-club .tl-club-heading { display:block; margin-bottom:20px; }
 .tl-club .tl-club-heading>.tl-club-textlink { margin-top:8px; }
 .tl-club .tl-club-heading h2 { font-size:42px; }
 .tl-club .tl-club-filters { gap:16px 12px; }
 .tl-club .tl-club-filters label { min-width:0; flex:1 1 44%; }
 .tl-club .tl-club-filters .tl-club-button { flex:1; }
 .tl-club-intro { padding:16px 0 28px; }
 .tl-club-intro h1 { font-size:64px; }
 .tl-club .tl-club-look { grid-template-columns:minmax(0,1fr); gap:24px; }
 .tl-club .tl-club-look-copy { position:static; }
 .tl-club .tl-club-look h1 { font-size:44px; }
 .tl-club .tl-club-shop-card { gap:14px; padding:12px; }
 .tl-club .tl-club-shop-card>img { width:72px; height:88px; }
}

/* A bounded horizontal mosaic: intrinsic image ratios, never a stretched single card. */
.tl-club.tl-club-strip { width:100%; max-width:none; margin:24px 0 0; padding:32px 0; border-top:1px solid var(--club-line); }
.tl-club .tl-club-grid { display:grid; grid-auto-flow:column; grid-auto-columns:240px; grid-template-columns:none; align-items:start; gap:20px; max-width:100%; overflow-x:auto; scroll-snap-type:x proximity; overscroll-behavior-inline:contain; scrollbar-width:thin; scrollbar-color:#555 #111; padding:4px 4px 12px; }
.tl-club .tl-club-media { position:relative; }
.tl-club .tl-club-image { display:block; position:relative; width:100%; aspect-ratio:var(--club-ratio, .8); max-height:300px; overflow:hidden; background:#171717; cursor:zoom-in; }
.tl-club .tl-club-image img { display:block; width:100%; height:100%; object-fit:contain; transition:transform .2s ease; }
.tl-club .tl-club-zoom { position:absolute; bottom:8px; right:8px; display:grid; place-items:center; width:32px; height:32px; border:1px solid #777; background:#000b; color:#fff; font:400 24px/1 Inter,sans-serif; }
.tl-club .tl-club-image:hover .tl-club-zoom { color:var(--club-lime); border-color:var(--club-lime); }
.tl-club .tl-club-caption { padding:10px 0 0; }
.tl-club .tl-club-caption h3 { font-size:19px; line-height:1.2; font-weight:700; margin:0 0 4px; overflow-wrap:anywhere; }
.tl-club .tl-club-look-link { display:inline-flex; align-items:center; gap:14px; min-height:44px; padding:4px 0; border:0; color:#aaa; font:400 12px/1.3 Inter,system-ui,sans-serif; letter-spacing:normal; text-transform:none; }
.tl-club .tl-club-look-link span { color:var(--club-lime); }
.tl-club .tl-club-look-link:hover { color:#fff; }
.tl-club .tl-club-hero-photo>a { cursor:zoom-in; }
/* Native dialog isolates focus and stacking from FluentCart's own gallery. */
html.tl-club-modal-open { overflow:hidden; }
.tl-club-lightbox { box-sizing:border-box; position:fixed; inset:0; width:min(1000px, calc(100vw - 32px)); height:min(900px, calc(100dvh - 32px)); max-width:none; max-height:none; margin:auto; padding:16px; border:1px solid #444; background:#080808; color:#fff; font:400 14px/1.5 Inter,system-ui,sans-serif; overflow:hidden; }
.tl-club-lightbox[open] { display:flex; flex-direction:column; gap:12px; }
.tl-club-lightbox::backdrop { background:rgb(0 0 0 / .92); }
.tl-club-lightbox * { box-sizing:border-box; }
.tl-club-lightbox .tl-club-lightbox-bar { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-shrink:0; }
.tl-club-lightbox button { min-width:44px; min-height:44px; border:1px solid #555; border-radius:0; padding:8px 12px; background:#111; color:#fff; cursor:pointer; font:400 18px/1 Inter,sans-serif; }
.tl-club-lightbox button:disabled { opacity:.35; cursor:default; }
.tl-club-lightbox button:focus-visible, .tl-club-lightbox a:focus-visible { outline:2px solid #ccff00; outline-offset:2px; }
.tl-club-lightbox .tl-club-lightbox-stage { flex:1; min-height:0; display:grid; place-items:center; position:relative; touch-action:pan-y pinch-zoom; }
.tl-club-lightbox .tl-club-lightbox-stage img { width:100%; height:100%; min-height:0; object-fit:contain; grid-area:1/1; }
.tl-club-lightbox .tl-club-lightbox-status { grid-area:1/1; text-align:center; padding:20px; color:#bbb; z-index:1; }
.tl-club-lightbox .tl-club-lightbox-footer { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:8px 16px; flex-shrink:0; }
.tl-club-lightbox .tl-club-lightbox-title { margin:0; max-width:100%; overflow-wrap:anywhere; font:700 20px/1.2 'Roboto Condensed','Arial Narrow',sans-serif; }
.tl-club-lightbox a { color:#ccff00; min-height:44px; display:inline-flex; align-items:center; text-underline-offset:4px; }
.tl-club-lightbox [hidden] { display:none!important; }
@media(max-width:600px){
 .tl-club.tl-club-strip { padding:24px 0; }
 .tl-club .tl-club-grid { grid-auto-columns:180px; gap:12px; }
 .tl-club .tl-club-image { max-height:225px; }
 .tl-club .tl-club-heading { margin-bottom:16px; }
 .tl-club .tl-club-heading h2 { font-size:34px; }
 .tl-club-lightbox { width:calc(100vw - 16px); height:calc(100dvh - 16px); padding:12px; }
}
@media(prefers-reduced-motion:reduce){ .tl-club .tl-club-image img { transition:none; } }

.tl-club-strip .tl-club-heading p:not(.tl-club-eyebrow) { font-size:13px; line-height:1.5; }
.tl-club .tl-club-by { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.tl-club .tl-club-caption h3 { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
