/* "Anatomy of a decision kit" — a big, elegant horizontal carousel. Self-contained
   (brand tokens with fallbacks) so it drops onto Buyers, Sellers, Listing, etc. */
.dk{max-width:none;margin:0;padding:clamp(4rem,9vw,7rem) 0;overflow:hidden}
.dk-eyebrow,.dk-title,.dk-sub{padding-inline:clamp(1.25rem,5vw,2.5rem)}
.dk-eyebrow{font-family:'Rimini Sans','DM Mono',monospace;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--accent,#e9f056);margin:0 0 18px;display:flex;align-items:center;gap:14px}
.dk-eyebrow::before{content:'';width:32px;height:1px;background:var(--accent,#e9f056)}
.dk-title{font-family:'Instrument Serif',Georgia,serif;font-weight:400;font-size:clamp(40px,6vw,74px);line-height:1;letter-spacing:-.015em;margin:0 0 16px;color:var(--text,#d7e8bc)}
.dk-title em{font-style:italic;color:var(--accent,#e9f056)}
.dk-sub{color:var(--muted,#9aa88c);font-size:clamp(1rem,1.5vw,1.22rem);line-height:1.65;max-width:64ch;margin:0 0 2.4rem}

/* carousel track */
.dk-grid{display:flex;gap:clamp(18px,2.5vw,28px);overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding:4px clamp(1.25rem,5vw,2.5rem) 1.6rem;scroll-padding-left:clamp(1.25rem,5vw,2.5rem);scrollbar-width:thin;scrollbar-color:rgba(233,240,86,.35) transparent}
.dk-grid::-webkit-scrollbar{height:6px}
.dk-grid::-webkit-scrollbar-track{background:rgba(215,232,188,.06);border-radius:3px}
.dk-grid::-webkit-scrollbar-thumb{background:rgba(233,240,86,.35);border-radius:3px}
.dk-card{flex:0 0 min(90vw,510px);scroll-snap-align:start;background:rgba(215,232,188,.03);border:1px solid rgba(215,232,188,.16);border-radius:20px;padding:clamp(30px,3.4vw,42px);display:flex;flex-direction:column;gap:22px;transition:border-color .2s,transform .2s}
.dk-card:hover{border-color:rgba(233,240,86,.45);transform:translateY(-4px)}
.dk-page{font-family:'Rimini Sans','DM Mono',monospace;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--accent,#e9f056)}
.dk-page-title{font-family:'Instrument Serif',Georgia,serif;font-weight:400;font-size:clamp(2.1rem,3vw,2.9rem);line-height:1.02;margin:0;color:var(--text,#d7e8bc)}
.dk-desc{font-size:1.08rem;line-height:1.62;color:var(--muted,#9aa88c);margin:auto 0 0}
.dk-visual{background:rgba(20,22,19,.4);border-radius:14px;padding:24px;min-height:210px;display:flex;flex-direction:column;justify-content:center;gap:14px}
/* comps */
.dk-comp{display:flex;justify-content:space-between;font-size:1.12rem;color:var(--muted,#9aa88c);font-variant-numeric:tabular-nums}
.dk-comp b{color:var(--text,#d7e8bc);font-weight:400}
.dk-comp.dk-on,.dk-comp.dk-on b{color:var(--accent,#e9f056)}
/* pricing tiers */
.dk-tier{display:grid;gap:5px;font-size:.82rem;color:var(--muted,#9aa88c)}
.dk-tier i{display:block;height:10px;border-radius:5px;background:rgba(215,232,188,.18);width:var(--w)}
.dk-tier.dk-on i{background:var(--accent,#e9f056)}
.dk-tier b{color:var(--text,#d7e8bc);font-size:.98rem;font-weight:400;font-variant-numeric:tabular-nums}
.dk-tier.dk-on b{color:var(--accent,#e9f056)}
/* objection math */
.dk-obj{display:flex;align-items:center;gap:12px;font-size:.78rem;color:var(--muted,#9aa88c);text-align:center}
.dk-obj-a,.dk-obj-b{flex:1;display:flex;flex-direction:column;gap:6px;padding:14px 10px;border-radius:8px;background:rgba(215,232,188,.05)}
.dk-obj-b{background:rgba(233,240,86,.1)}
.dk-obj b{color:var(--text,#d7e8bc);font-size:1.2rem;font-family:'Instrument Serif',Georgia,serif}
.dk-obj-b b{color:var(--accent,#e9f056)}
.dk-arrow{color:var(--accent,#e9f056);flex:0 0 auto;font-size:1.2rem}
/* visual story */
.dk-vis{flex-direction:row;padding:0;gap:8px;overflow:hidden;background:none}
.dk-vis img{width:50%;height:180px;object-fit:cover;border-radius:10px;display:block}
/* swipe hint */
.dk-hint{font-family:'Rimini Sans','DM Mono',monospace;font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted,#9aa88c);margin:.4rem 0 0;display:flex;align-items:center;gap:8px;opacity:.75}
.dk-hint::after{content:'\2192';color:var(--accent,#e9f056);font-size:1rem}

/* Internal motion: the highlighted "your number" / "sharp" row breathes; tier bars shimmer. */
@keyframes dkPulse{0%,100%{opacity:1}50%{opacity:.6}}
@keyframes dkShimmer{0%{background-position:-140% 0}100%{background-position:240% 0}}
.dk-comp.dk-on b,.dk-tier.dk-on b{animation:dkPulse 2.6s ease-in-out infinite}
.dk-tier.dk-on i{background:linear-gradient(100deg,var(--accent,#e9f056) 0%,#fff 45%,var(--accent,#e9f056) 90%);background-size:220% 100%;animation:dkShimmer 3.4s linear infinite}
.dk-arrow{animation:dkPulse 1.8s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.dk-comp.dk-on b,.dk-tier.dk-on b,.dk-tier.dk-on i,.dk-arrow{animation:none}}