/* ---------- banner ---------- */
.cmp-banner{padding:clamp(84px,11vw,130px) 0 clamp(48px,6vw,72px)}
.crumb{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:600;letter-spacing:.02em;margin-bottom:26px}
.crumb a{color:var(--on-black-muted);border-bottom:1px solid transparent;padding-bottom:1px;transition:color .2s,border-color .2s}
.crumb a:hover{color:#fff;border-color:var(--on-black-line)}
.crumb .sep{color:var(--on-black-muted);opacity:.6}
.crumb [aria-current]{color:#fff}
.cmp-title{color:#fff;font-size:clamp(38px,6vw,74px);letter-spacing:-.035em;line-height:1;max-width:16ch}
.cmp-sub{margin-top:22px;color:var(--on-black-muted);font-size:clamp(16px,1.6vw,20px);line-height:1.55;max-width:52ch}

/* ---------- body / sticky tabs ---------- */
.cmp-body{padding:0 0 clamp(64px,8vw,104px)}
.cmp-tabs-wrap{position:sticky;top:66px;z-index:40;background:rgba(245,245,243,.86);
  backdrop-filter:saturate(140%) blur(10px);-webkit-backdrop-filter:saturate(140%) blur(10px);border-bottom:1px solid var(--line)}
.cmp-tabs{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;scroll-snap-type:x proximity;cursor:grab}
.cmp-tabs.dragging{cursor:grabbing;scroll-snap-type:none}
.cmp-tabs.dragging .cmp-tab{pointer-events:none}
.cmp-tabs::-webkit-scrollbar{display:none}
.cmp-tab{position:relative;flex:0 0 auto;scroll-snap-align:start;font-family:inherit;font-weight:600;font-size:14.5px;
  letter-spacing:-.01em;color:var(--muted);background:none;border:0;padding:20px 16px 18px;cursor:pointer;white-space:nowrap;transition:color .2s var(--ease)}
@media(min-width:1000px){
  .cmp-tabs{gap:0;justify-content:space-between;cursor:default}
  .cmp-tab{flex:1 1 auto;text-align:center;padding:20px 8px 18px;font-size:13.5px}
  .cmp-tab .tnum{margin-right:6px}
}
.cmp-tab:hover{color:var(--ink)}
.cmp-tab.on{color:var(--ink)}
.cmp-tab.on::after{content:"";position:absolute;left:14px;right:14px;bottom:0;height:2.5px;background:var(--ink);border-radius:3px 3px 0 0}
.cmp-tab .tnum{font-variant-numeric:tabular-nums;color:var(--muted-2);margin-right:8px;font-weight:700;font-size:12px}
.cmp-tab.on .tnum{color:var(--ink)}

/* ---------- panels ---------- */
.cmp-panel{display:none;padding-top:clamp(34px,4vw,52px)}
.cmp-panel.on{display:block;animation:cmpFade .4s var(--ease) both}
@keyframes cmpFade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.cmp-panel-h{margin-bottom:22px;max-width:60ch}
.cmp-panel-h .eyebrow{color:var(--muted)}
.cmp-panel-h h2{font-size:clamp(22px,2.6vw,30px);font-weight:500;letter-spacing:-.025em;margin-top:10px;line-height:1.08}

/* ---------- DESKTOP TABLE ---------- */
.ctable{border:1px solid var(--line);border-radius:20px;overflow:hidden;background:var(--card)}
.crow{display:grid;grid-template-columns:1.5fr 1.15fr 1fr 1fr}
.cc{padding:16px 20px;font-size:14.5px;line-height:1.45;color:var(--ink-2);border-top:1px solid var(--line);display:flex;align-items:center}
.crow:first-child .cc{border-top:0}
.cc.wp,.cc.dev{border-left:1px solid var(--line)}
.cc.lab{font-weight:600;color:var(--ink);letter-spacing:-.01em;font-size:14.5px}
.crow:nth-child(even) .cc:not(.fd){background:#FAF8F3}
/* FrontDesk column — the dark stripe */
.cc.fd{background:var(--black);color:var(--on-black);position:relative}
.cc.fd::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:#fff;opacity:.14}
.crow:first-child .cc.fd::before{display:none}
/* header row */
.crow.chead .cc{padding-top:22px;padding-bottom:22px;align-items:flex-end}
.chead .cc.lab{font-size:12px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
.chead .chname{font-size:18px;font-weight:700;letter-spacing:-.02em;color:var(--ink)}
.chead .cc.fd{border-radius:0}
.chead .cc.fd .chname{color:#fff}
.chead .cc.fd .chsub,.chead .chsub{display:block;font-size:12px;font-weight:500;letter-spacing:0;text-transform:none;margin-top:5px;color:var(--muted)}
.chead .cc.fd .chsub{color:var(--on-black-muted)}
.chead .chwrap{display:flex;flex-direction:column;align-items:flex-start}
/* check marker inside FD cells */
.fd .fd-mark{display:inline-flex;align-items:center;gap:8px}
.fd .fd-mark svg{width:15px;height:15px;flex:none;stroke:#fff;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;opacity:.9}

/* ---------- MOBILE (single column, switchable) ---------- */
.cmp-switch{display:none;gap:5px;background:var(--paper-2);border:1px solid var(--line);border-radius:12px;padding:5px;margin-bottom:20px;position:sticky;top:57px;z-index:30}
.cs-btn{flex:1;font-family:inherit;font-weight:600;font-size:13.5px;color:var(--muted);background:transparent;border:0;border-radius:8px;padding:10px 6px;cursor:pointer;transition:background .2s var(--ease),color .2s var(--ease)}
.cs-btn.on{background:var(--card);color:var(--ink);box-shadow:0 1px 2px rgba(20,16,8,.08)}
.cmob{display:none}
.cmob-list{display:flex;flex-direction:column;gap:10px}
.cmob-row{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--card)}
.cmob-lab{font-weight:600;color:var(--ink);font-size:15px;letter-spacing:-.01em;padding:13px 16px;background:#FAF8F3;border-bottom:1px solid var(--line)}
.cmob-val{padding:14px 16px;font-size:16px;line-height:1.5;color:var(--ink-2)}
.cmob-row.is-fd .cmob-lab{background:var(--black);color:#fff;border-color:var(--black)}
.cmob-row.is-fd{border-color:var(--black)}
.cmob-row.is-fd .cmob-val{color:var(--ink)}
.cmob-val .fd-mark{display:inline-flex;align-items:center;gap:8px}
.cmob-val .fd-mark svg{width:15px;height:15px;flex:none;stroke:var(--ink);fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.cmob-fd-tag{float:right;font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);background:#fff;border-radius:20px;padding:3px 7px;line-height:1;margin-top:1px}
@media(max-width:820px){
  .ctable{display:none}
  .cmp-switch{display:flex}
  .cmob{display:block}
}

/* ---------- bottom CTA ---------- */
.cmp-cta{text-align:center;padding:clamp(64px,9vw,120px) 0}
.cmp-cta h2{color:#fff;font-size:clamp(30px,5vw,60px);letter-spacing:-.03em;line-height:1;max-width:16ch;margin:0 auto}
.cmp-cta .sub{margin:22px auto 0;max-width:44ch}
.cmp-cta-actions{margin-top:34px;display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.cmp-cta-wa{margin-top:20px;font-size:13.5px;color:var(--on-black-muted)}
.cmp-cta-wa a{color:#fff;border-bottom:1px solid var(--on-black-line);padding-bottom:1px}