.board-types-hub { --bt-ink:#07172b; --bt-cream:#f7f1e8; --bt-sand:#eadcc8; --bt-orange:#ff8a3d; --bt-yellow:#ffd479; --bt-line:#ccd7df; --bt-copy:#324b61; --bt-gap:clamp(1rem,2vw,1.5rem); }
.board-types-hub .bt-shell { width:min(calc(100% - 2rem),80rem); margin-inline:auto; }
.board-types-hub .bt-hero-section { padding:clamp(1.25rem,3vw,2.25rem) 0 clamp(3rem,6vw,5rem); background:var(--bt-cream); }
.board-types-hub .qx-breadcrumbs { margin-top:clamp(1rem,2vw,1.75rem); }
.board-types-hub .bt-hero { display:grid; grid-template-columns:minmax(0,48fr) minmax(0,52fr); overflow:hidden; background:linear-gradient(115deg,var(--bt-ink) 0%,#0e3858 100%); color:#fff; }
.board-types-hub .bt-hero-copy { display:flex; flex-direction:column; justify-content:center; padding:clamp(2rem,4.5vw,4.75rem); }
.board-types-hub .bt-hero-copy h1 { max-width:13ch; margin:.35rem 0 1.15rem; color:#fff; font-size:clamp(3rem,4.3vw,5rem); line-height:.9; letter-spacing:-.06em; }
.board-types-hub .bt-hero-copy p:not(.qx-eyebrow) { max-width:30rem; margin:0; color:#d7e4ef; font-size:clamp(1rem,1.4vw,1.15rem); line-height:1.65; }
.board-types-hub .bt-hero-stat { margin:1.75rem 0 0; color:var(--bt-yellow); font:700 .76rem "Courier Prime",monospace; letter-spacing:.13em; }
.board-types-hub .bt-hero-visual { position:relative; display:flex; align-items:center; justify-content:center; min-width:0; margin:0; overflow:hidden; background:transparent; }
.board-types-hub .bt-hero-visual::before { position:absolute; z-index:1; inset:0 auto 0 0; width:clamp(4.5rem,22%,13rem); content:""; pointer-events:none; background:linear-gradient(90deg,#0a2d4e 0%,#0e3858 46%,rgba(14,56,88,0) 100%); }
.board-types-hub .bt-hero-wave { position:relative; z-index:0; display:block; width:100%; height:auto; max-height:100%; object-fit:contain; object-position:center; }

.board-types-hub .bt-guides-section { padding:clamp(3.5rem,7vw,6rem) 0; background:#fff; }
.board-types-hub .bt-guides-intro { display:grid; grid-template-columns:minmax(0,.85fr) minmax(18rem,.65fr); gap:clamp(1.5rem,4vw,3rem); align-items:end; margin-bottom:clamp(2rem,4vw,3.5rem); }
.board-types-hub .bt-guides-intro h2 { max-width:14ch; margin:0; color:var(--bt-ink); font-size:clamp(2.25rem,4vw,4.1rem); line-height:.96; letter-spacing:-.045em; }
.board-types-hub .bt-guides-intro p { max-width:34rem; margin:0; color:var(--bt-copy); line-height:1.65; }
.board-types-hub .bt-card-grid { display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:var(--bt-gap); }
.board-types-hub .bt-card { display:grid; grid-column:span 2; grid-template-rows:minmax(12rem,52%) minmax(0,1fr); min-height:clamp(27rem,32vw,30rem); overflow:hidden; border:1px solid var(--bt-line); background:#fff; color:var(--bt-ink); text-decoration:none; transition:transform 180ms ease,box-shadow 180ms ease,border-color 180ms ease; }
.board-types-hub .bt-card:nth-child(5) { grid-column:2 / span 2; }
.board-types-hub .bt-card:nth-child(6) { grid-column:4 / span 2; }
.board-types-hub .bt-card:nth-child(7) { grid-column:6 / span 2; }
.board-types-hub .bt-card:hover,.board-types-hub .bt-card:focus-visible { border-color:var(--bt-orange); box-shadow:0 1.25rem 2.5rem rgba(7,23,43,.16); transform:translateY(-4px); }
.board-types-hub .bt-card:focus-visible { outline:3px solid var(--bt-yellow); outline-offset:4px; }
.board-types-hub .bt-card-visual { display:grid; place-items:center; overflow:hidden; background:linear-gradient(145deg,var(--bt-card-a),var(--bt-card-b)); }
.board-types-hub .bt-card-visual img { width:min(64%,12rem); max-height:85%; color:#fff7e8; filter:drop-shadow(0 .7rem .55rem rgba(0,0,0,.24)); transform:rotate(var(--bt-board-rotation)); }
.board-types-hub .bt-card-copy { display:grid; grid-template-rows:auto minmax(2.1rem,auto) minmax(3.3rem,auto) 1fr; align-content:start; gap:.6rem; padding:1.35rem; }
.board-types-hub .bt-card-kicker { color:#647d91; font:700 .68rem "Courier Prime",monospace; letter-spacing:.12em; text-transform:uppercase; }
.board-types-hub .bt-card h3 { margin:0; font-size:clamp(1.45rem,2.1vw,2rem); line-height:1; }
.board-types-hub .bt-card p { margin:0; color:#526d82; font-size:.92rem; line-height:1.5; }
.board-types-hub .bt-card-copy::after { content:"Explore guide  →"; align-self:end; color:var(--bt-orange); font:700 .74rem "Courier Prime",monospace; letter-spacing:.06em; text-transform:uppercase; }
.board-types-hub .bt-card[data-card="performance"] { --bt-card-a:#0d365e; --bt-card-b:#4e91b7; --bt-board-rotation:-18deg; }
.board-types-hub .bt-card[data-card="fish"] { --bt-card-a:#c85e30; --bt-card-b:#f3af4b; --bt-board-rotation:18deg; }
.board-types-hub .bt-card[data-card="hybrid"] { --bt-card-a:#226e69; --bt-card-b:#80bfae; --bt-board-rotation:-8deg; }
.board-types-hub .bt-card[data-card="daily"] { --bt-card-a:#273f78; --bt-card-b:#8098d1; --bt-board-rotation:10deg; }
.board-types-hub .bt-card[data-card="groveller"] { --bt-card-a:#bc7331; --bt-card-b:#f5cf74; --bt-board-rotation:-22deg; }
.board-types-hub .bt-card[data-card="step-up"] { --bt-card-a:#533664; --bt-card-b:#a77aa4; --bt-board-rotation:8deg; }
.board-types-hub .bt-card[data-card="mid-length"] { --bt-card-a:#1f5861; --bt-card-b:#7bb6bc; --bt-board-rotation:-12deg; }

.board-types-hub .bt-bodhi-section { padding:clamp(3rem,6vw,5rem) 0; background:var(--bt-ink); }
.board-types-hub .bt-bodhi { display:grid; grid-template-columns:minmax(18rem,.72fr) minmax(0,1.28fr); min-height:20rem; overflow:hidden; background:var(--bt-ink); color:#fff; }
.board-types-hub .bt-bodhi-portrait-wrap { display:grid; place-items:center; padding:1.5rem; background:#0e3858; }
.board-types-hub .bt-bodhi-portrait { width:min(100%,18rem); height:100%; max-height:21rem; object-fit:contain; filter:drop-shadow(0 1.4rem 1.5rem rgba(7,23,43,.23)); }
.board-types-hub .bt-bodhi-copy { display:flex; flex-direction:column; justify-content:center; padding:clamp(2rem,4.5vw,4rem); }
.board-types-hub .bt-bodhi-logo { display:block; width:min(15rem,100%); height:auto; margin-bottom:1.25rem; }
.board-types-hub .bt-bodhi-copy h2 { margin:.4rem 0 1rem; color:#fff; font-size:clamp(2.2rem,4vw,3.75rem); line-height:.95; letter-spacing:-.045em; }
.board-types-hub .bt-bodhi-copy p:not(.qx-eyebrow) { max-width:37rem; margin:0; color:#d7e4ef; line-height:1.65; }
.board-types-hub .bt-bodhi-copy .qx-button { align-self:flex-start; margin-top:1.5rem; background:var(--bt-orange); color:var(--bt-ink); }

html[data-theme="dark"] .board-types-hub .bt-hero-section,html[data-theme="dark"] .board-types-hub .bt-guides-section { background:#071020; }
html[data-theme="dark"] .board-types-hub .bt-guides-intro h2 { color:#fff; }
html[data-theme="dark"] .board-types-hub .bt-guides-intro p,html[data-theme="dark"] .board-types-hub .bt-card p { color:#c7d8e5; }
html[data-theme="dark"] .board-types-hub .bt-card { border-color:#38516a; background:#101f32; color:#fff; }
html[data-theme="dark"] .board-types-hub .bt-card-kicker { color:#a9c2d3; }
html[data-theme="dark"] .board-types-hub .bt-card:hover,html[data-theme="dark"] .board-types-hub .bt-card:focus-visible { border-color:var(--bt-yellow); box-shadow:0 1.25rem 2.5rem rgba(0,0,0,.42); }
html[data-theme="dark"] .board-types-hub .bt-bodhi-section { background:#0d1b2d; }

@media (max-width:900px) { .board-types-hub .bt-hero { grid-template-columns:1fr; } .board-types-hub .bt-hero-copy { min-height:25rem; } .board-types-hub .bt-hero-visual { min-height:0; } .board-types-hub .bt-guides-intro { grid-template-columns:1fr; } .board-types-hub .bt-card-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .board-types-hub .bt-card,.board-types-hub .bt-card:nth-child(5),.board-types-hub .bt-card:nth-child(6),.board-types-hub .bt-card:nth-child(7) { grid-column:span 1; } }
@media (max-width:620px) { .board-types-hub .bt-shell { width:min(calc(100% - 1.25rem),80rem); } .board-types-hub .bt-hero-copy { min-height:22rem; padding:2rem 1.5rem; } .board-types-hub .bt-hero-visual { min-height:0; } .board-types-hub .bt-card-grid { grid-template-columns:1fr; } .board-types-hub .bt-card { min-height:27rem; } .board-types-hub .bt-card-visual { min-height:14rem; } .board-types-hub .bt-bodhi { grid-template-columns:1fr; } .board-types-hub .bt-bodhi-portrait-wrap { min-height:17rem; } .board-types-hub .bt-bodhi-copy { padding:2.5rem 1.5rem; } }
@media (prefers-reduced-motion:reduce) { .board-types-hub .bt-card { transition:none; } .board-types-hub .bt-card:hover { transform:none; } }