/* TMC — Buying A Multihull (2026): live matched boats, member-only listing views, panel animations. Scoped to .tmc-buy */

/* toolkit: live matched boats */
.tmc-buy a.tb-match{color:#fff!important;transition:border-color .2s,transform .2s}
.tmc-buy a.tb-match:hover{border-color:var(--red-lt);transform:translateY(-2px)}
.tmc-buy .tb-match .tb-thumb{display:block;background:var(--ink-3) center/cover no-repeat}
.tmc-buy .tb-match b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* toolkit: broker-guided profile */
.tb-broker{border:2px solid var(--red);border-radius:12px;padding:22px 24px;display:flex;flex-direction:column;gap:16px;background:#fff}
.tb-broker-top{display:flex;gap:16px;align-items:center}
.tb-broker-top i{width:48px;height:48px;flex-shrink:0;border-radius:50%;background:var(--red);display:flex;align-items:center;justify-content:center}
.tb-broker-top i svg{width:24px;height:24px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.tb-broker-top small{display:block;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
.tb-broker-top b{display:block;font-family:var(--display);font-size:20px;font-weight:800;line-height:1.2}
.tb-broker-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.tb-broker-steps li{display:grid;grid-template-columns:32px minmax(0,1fr);gap:12px;align-items:start}
.tb-broker-steps em{width:32px;height:32px;border-radius:50%;background:var(--ink);color:#fff;font-style:normal;font-family:var(--display);font-weight:800;font-size:14px;display:flex;align-items:center;justify-content:center}
.tb-broker-steps b{display:block;font-size:16px}
.tb-broker-steps span{display:block;font-size:14px;color:var(--muted);line-height:1.45}
.tb-broker-cta{align-self:flex-start;font-weight:700;color:var(--red)!important;border-bottom:2px solid var(--red);padding-bottom:2px}
.tb-acct-broker{display:flex;gap:12px;align-items:center;padding:10px 14px;border-radius:10px;background:rgba(190,76,70,.18);border:1px solid var(--red-lt)}
.tb-av{width:40px;height:40px;flex-shrink:0;border-radius:50%;background:var(--red);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:800;font-size:12px;letter-spacing:.04em}
.tb-acct-broker b{display:block;font-size:15px}
.tb-acct-broker span{display:block;font-size:13px;color:var(--lt)}

/* member-only listing views */
.tb-new{display:inline-block;margin-left:10px;padding:3px 10px;border-radius:12px;background:var(--red);color:#fff;font-size:11px;letter-spacing:.1em;vertical-align:2px}
.tb-perks{display:flex;flex-direction:column;gap:12px}
.tb-perk{display:flex;gap:16px;align-items:flex-start;padding:18px 20px;border-radius:10px;background:var(--paper)}
.tb-perk svg{width:28px;height:28px;flex-shrink:0;fill:none;stroke:var(--red);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;margin-top:2px}
.tb-perk b{display:block;font-size:18px}
.tb-tier{display:inline-block;margin-bottom:4px;padding:2px 9px;border-radius:10px;background:var(--ink);color:#fff;font-style:normal;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.tb-tier.is-free{background:#fff;color:var(--ink);border:1px solid var(--rule)}
.tb-reg .tb-btn-ink{min-height:56px}
.tb-perk span{display:block;font-size:15px;color:var(--muted);line-height:1.45}
.tb-lock-card{background:var(--ink);color:#fff;border-radius:16px;padding:28px;display:flex;flex-direction:column;gap:16px;box-shadow:0 24px 60px rgba(0,26,55,.22)}
.tb-lock-head{display:flex;justify-content:space-between;align-items:center;gap:12px}
.tb-lock-head b{font-family:var(--display);font-weight:800;font-size:20px}
.tb-lock-tag{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:14px;background:var(--red);font-size:12px;font-weight:700;letter-spacing:.06em}
.tb-lock-tag svg{fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.tb-lock-block{padding:16px 18px;border-radius:10px;background:var(--ink-2);border:1px solid var(--line-dk);display:flex;flex-direction:column;gap:10px}
.tb-lock-block small{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--red-lt)}
.tb-comp{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;font-size:14px;color:var(--lt)}
.tb-comp i{display:block;height:8px;border-radius:4px;background:var(--ink-3)}
.tb-comp b,.tb-range-k span:first-child,.tb-range-k span:last-child{filter:blur(4px);color:#fff}
.tb-range i{display:block;position:relative;height:14px;border-radius:7px;background:var(--ink-3)}
.tb-range-band{position:absolute;left:22%;right:30%;top:0;bottom:0;border-radius:7px;background:linear-gradient(90deg,#3D6E9E,#6D9BC6,#3D6E9E)}
.tb-range-ask{position:absolute;left:58%;top:-5px;width:4px;height:24px;border-radius:2px;background:var(--red)}
.tb-range-k{display:flex;justify-content:space-between;font-size:13px;color:var(--lt-2)}
.tb-note-lines{display:flex;flex-direction:column;gap:8px}
.tb-note-lines i{display:block;height:10px;border-radius:5px;background:var(--ink-3)}
.tb-note-lines i:nth-child(2){width:88%}
.tb-note-lines i:nth-child(3){width:62%}
.tb-lock-cta{display:flex;align-items:center;justify-content:center;gap:10px;min-height:52px;border-radius:6px;border:1.5px dashed var(--red-lt);color:#fff!important;font-weight:700}
.tb-lock-cta svg{fill:none;stroke:var(--red-lt);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.tb-lock-cta:hover{background:rgba(190,76,70,.18)}

/* panel animations: JS adds .tb-anim, then .is-play once the panel is in view */
.tb-anim .tb-meter .tb-fill{width:0;transition:width 1.2s cubic-bezier(.2,.7,.2,1) .2s}
.tb-anim.is-play .tb-meter .tb-fill{width:80%}
.tb-anim .tb-chips li,.tb-anim .tb-match,.tb-anim .tb-lock-block{opacity:0;transform:translateY(12px);transition:opacity .5s ease,transform .5s ease}
.tb-anim.is-play .tb-chips li,.tb-anim.is-play .tb-match,.tb-anim.is-play .tb-lock-block{opacity:1;transform:none}
.tb-anim.is-play .tb-chips li:nth-child(2){transition-delay:.1s}
.tb-anim.is-play .tb-chips li:nth-child(3){transition-delay:.2s}
.tb-anim.is-play .tb-chips li:nth-child(4){transition-delay:.3s}
.tb-anim.is-play .tb-chips li:nth-child(5){transition-delay:.4s}
.tb-anim.is-play .tb-chips li:nth-child(6){transition-delay:.5s}
.tb-anim.is-play .tb-d1{transition-delay:.7s}
.tb-anim.is-play .tb-d2{transition-delay:.9s}
.tb-anim.is-play .tb-d3{transition-delay:1.1s}
.tb-anim.is-play .tb-match.tb-d1 em{animation:tbPulse 1.6s ease 1.8s 2}
@keyframes tbPulse{0%,100%{box-shadow:0 0 0 0 rgba(232,146,140,.6)}60%{box-shadow:0 0 0 10px rgba(232,146,140,0)}}
.tb-comp i,.tb-note-lines i,.tb-range i{background:linear-gradient(90deg,#1D3F66 0%,#2B5785 50%,#1D3F66 100%);background-size:200% 100%;animation:tbShimmer 2.4s linear infinite}
@keyframes tbShimmer{to{background-position:-200% 0}}
.tb-anim .tb-range-ask{left:20%;transition:left 1.4s cubic-bezier(.2,.7,.2,1) 1.2s}
.tb-anim.is-play .tb-range-ask{left:58%}
@media (prefers-reduced-motion:reduce){.tb-comp i,.tb-note-lines i,.tb-range i{animation:none}}
@media (max-width:640px){
	.tb-lock-card{padding:20px 16px}
	.tb-comp{grid-template-columns:minmax(0,1fr) auto}
	.tb-comp i{display:none}
	.tb-new{display:table;margin:8px 0 0}
}
