/* Heepsy alternatives: layout, the rolodex illustration and the flip cards only.
   Type, colour, buttons, cards, tables and FAQ come from landing-system.css. */

.bespoke-alt-heepsy .he-hero{padding-top:48px}
/* site-wide guide styles zero heading margins; restore the system's .5em gap */
.bespoke-alt-heepsy :is(h1,h2,h3){margin-bottom:.5em}
.bespoke-alt-heepsy .ls-table{margin:0}
/* the build wraps every table in .table-wrap; let .ls-table-wrap be the only frame */
.bespoke-alt-heepsy .ls-table-wrap > .table-wrap{margin:0;border:0;border-radius:0;background:none;overflow:visible}

/* ---------- house illustration: a rolodex ---------- */
.bespoke-alt-heepsy .he-illo .o{stroke:var(--ls-ink);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;fill:none;vector-effect:non-scaling-stroke}
.bespoke-alt-heepsy .he-illo .o-peach{stroke:var(--ls-peach);stroke-width:3;stroke-linecap:round}
.bespoke-alt-heepsy .he-illo .f-paper{fill:var(--ls-paper)}
.bespoke-alt-heepsy .he-illo .f-cream{fill:var(--ls-cream)}
.bespoke-alt-heepsy .he-illo .f-mint{fill:var(--ls-mint)}
.bespoke-alt-heepsy .he-illo .f-blue{fill:var(--ls-blue)}
.bespoke-alt-heepsy .he-illo .f-yellow{fill:var(--ls-yellow)}
.bespoke-alt-heepsy .he-illo .f-lav{fill:var(--ls-lavender)}
.bespoke-alt-heepsy .he-illo .f-peach{fill:var(--ls-peach)}
.bespoke-alt-heepsy .he-illo text{font-family:var(--ls-font);fill:var(--ls-ink)}
.bespoke-alt-heepsy .he-illo .t-tab{font-size:13px;font-weight:800}
.bespoke-alt-heepsy .he-illo .t-head{font-size:19px;font-weight:800;letter-spacing:-.01em}
.bespoke-alt-heepsy .he-illo .t-name{font-size:15px;fill:var(--ls-text)}
.bespoke-alt-heepsy .he-illo .t-b{font-weight:800;fill:var(--ls-ink)}

/* ---------- shared card bits ---------- */
.bespoke-alt-heepsy .he-top{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:14px}
.bespoke-alt-heepsy .he-letter{min-width:34px;text-align:center}
.bespoke-alt-heepsy .he-field{display:block;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ls-muted);margin:0 0 4px}
.bespoke-alt-heepsy .he-dl{display:grid;gap:4px;margin:0}
.bespoke-alt-heepsy .he-dl dt{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ls-muted);margin-top:8px}
.bespoke-alt-heepsy .he-dl dt:first-child{margin-top:0}
.bespoke-alt-heepsy .he-dl dd{margin:0;font-size:16px;line-height:1.5;color:var(--ls-text)}
.bespoke-alt-heepsy .he-dl--2{grid-template-columns:130px minmax(0,1fr);gap:12px 18px}
.bespoke-alt-heepsy .he-dl--2 dt{margin-top:2px}
.bespoke-alt-heepsy .he-first{align-items:start}
.bespoke-alt-heepsy .he-bigcard h3{margin-bottom:18px}

/* ---------- the drawer: flip cards ---------- */
.bespoke-alt-heepsy .he-drawer{list-style:none;margin:36px 0 20px;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.bespoke-alt-heepsy .he-slot{position:relative;display:flex;flex-direction:column}
.bespoke-alt-heepsy .he-slot .ls-source{margin-top:10px}
.bespoke-alt-heepsy .he-flip{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.bespoke-alt-heepsy .he-card{display:grid;flex:1;transform-style:preserve-3d;transition:transform .5s ease}
.bespoke-alt-heepsy .he-face{grid-area:1/1;display:flex;flex-direction:column;cursor:pointer;backface-visibility:hidden;-webkit-backface-visibility:hidden;min-height:100%}
.bespoke-alt-heepsy .he-face h3{margin-bottom:14px}
.bespoke-alt-heepsy .he-face p{font-size:16px;line-height:1.5;margin:0 0 14px}
.bespoke-alt-heepsy .he-back{transform:rotateY(180deg)}
.bespoke-alt-heepsy .he-backname{font-weight:800;color:var(--ls-ink)}
.bespoke-alt-heepsy .he-turn{margin-top:auto;padding-top:12px;font-size:14px;font-weight:700;color:var(--ls-blue-deep)}
.bespoke-alt-heepsy .he-flip:checked + .he-card{transform:rotateY(180deg)}
.bespoke-alt-heepsy .he-flip:focus-visible + .he-card .he-face{outline:3px solid var(--ls-blue-deep);outline-offset:3px}
.bespoke-alt-heepsy .he-face:hover{border-color:var(--ls-ink)}
.bespoke-alt-heepsy .he-us .he-face{background:var(--ls-paper);border:2px solid var(--ls-blue-deep)}
.bespoke-alt-heepsy .he-us .he-face:hover{border-color:var(--ls-ink)}

/* ---------- comparison table ---------- */
.bespoke-alt-heepsy .ls-table th[scope="row"]{font-size:15px;font-weight:700;color:var(--ls-ink);text-transform:none;letter-spacing:0;background:transparent;border-bottom:1px solid var(--ls-line);white-space:nowrap;padding:14px 16px;vertical-align:top}
.bespoke-alt-heepsy .ls-table tr:last-child th[scope="row"]{border-bottom:0}
.bespoke-alt-heepsy .he-table{font-size:15px}
.bespoke-alt-heepsy .he-table .is-us th{color:var(--ls-blue-deep)}
.bespoke-alt-heepsy .he-table .he-ref{background:var(--ls-yellow-tint)}

/* ---------- live search ---------- */
.bespoke-alt-heepsy .he-live{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:24px;align-items:start;margin-top:36px}
.bespoke-alt-heepsy .he-pfacts{list-style:none;padding:0;margin:16px 0;gap:14px}
.bespoke-alt-heepsy .he-pfacts b{font-size:30px}
.bespoke-alt-heepsy .he-pfacts span{font-size:14px}
.bespoke-alt-heepsy .he-arrow{margin:18px 0 10px;font-weight:700;color:var(--ls-ink)}
.bespoke-alt-heepsy .he-found{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.bespoke-alt-heepsy .he-found li{background:var(--ls-peach-tint);border-radius:var(--ls-radius-sm);padding:10px 14px;font-size:16px}
.bespoke-alt-heepsy .he-found b{font-size:20px;margin-right:6px}
.bespoke-alt-heepsy .he-results > .he-field{margin-bottom:10px}
.bespoke-alt-heepsy .he-minis{list-style:none;margin:0 0 24px;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.bespoke-alt-heepsy .he-minis li{padding:16px;display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.bespoke-alt-heepsy .he-mini-h{font-size:15px;font-weight:700;color:var(--ls-ink)}
.bespoke-alt-heepsy .he-mini-v{font-size:14px;color:var(--ls-muted)}
.bespoke-alt-heepsy .he-mini-v b{display:block;font-size:22px;color:var(--ls-ink);letter-spacing:-.02em}
.bespoke-alt-heepsy .he-minis .ls-small{font-size:13px}
.bespoke-alt-heepsy .he-minis .ls-tag{font-size:11px}
.bespoke-alt-heepsy .he-why p{font-size:16px}
.bespoke-alt-heepsy .he-fig{margin:24px 0 0}
.bespoke-alt-heepsy .he-fig > p{max-width:720px}

/* chart rules: bars blue-deep, gridlines line, labels 13px muted */
.bespoke-alt-heepsy .he-chart{display:block;width:100%;height:auto;margin:16px 0 4px}
.bespoke-alt-heepsy .he-chart--desk{max-width:1180px}
.bespoke-alt-heepsy .he-chart--mob{display:none}
.bespoke-alt-heepsy .he-chart .grid{stroke:var(--ls-line);stroke-width:1}
.bespoke-alt-heepsy .he-chart .bar{fill:var(--ls-blue-deep)}
.bespoke-alt-heepsy .he-chart .bar:hover{fill:var(--ls-blue)}
.bespoke-alt-heepsy .he-chart .lbl{font-family:var(--ls-font);font-size:13px;fill:var(--ls-muted)}
.bespoke-alt-heepsy .he-chart .lbl-ink{fill:var(--ls-ink);font-weight:700}

/* ---------- steps, picks, prompt ---------- */
.bespoke-alt-heepsy .he-steps{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:48px;align-items:start}
.bespoke-alt-heepsy .he-steps-table .he-us{background:var(--ls-blue-tint)}
.bespoke-alt-heepsy .he-steps-table thead .he-us{color:var(--ls-blue-deep)}
.bespoke-alt-heepsy .he-steps-table th[scope="row"]{white-space:normal;min-width:170px}
.bespoke-alt-heepsy .he-picks{list-style:none;margin:32px 0 0;padding:0;gap:16px}
.bespoke-alt-heepsy .he-picks li{display:flex;align-items:flex-start;gap:14px;padding:20px 22px}
.bespoke-alt-heepsy .he-picks p{margin:0;font-size:17px}
.bespoke-alt-heepsy .he-pick-us{grid-column:1/-1}
.bespoke-alt-heepsy .he-pick-us p{font-size:19px}
.bespoke-alt-heepsy .ls-prompt{margin-top:12px}
.bespoke-alt-heepsy .he-narrow{max-width:860px}
.bespoke-alt-heepsy .he-sources{columns:2;column-gap:32px;padding-left:20px;margin:0 0 16px}
.bespoke-alt-heepsy .he-sources li{margin-bottom:6px;break-inside:avoid}

@media (max-width:960px){
  .bespoke-alt-heepsy .he-drawer{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bespoke-alt-heepsy .he-live,.bespoke-alt-heepsy .he-steps{grid-template-columns:1fr;gap:24px}
}
@media (max-width:640px){
  .bespoke-alt-heepsy .he-hero{padding-top:32px}
  .bespoke-alt-heepsy .he-drawer{grid-template-columns:1fr;gap:20px}
  .bespoke-alt-heepsy .he-dl--2{grid-template-columns:1fr;gap:2px}
  .bespoke-alt-heepsy .he-dl--2 dd{margin-bottom:10px}
  .bespoke-alt-heepsy .he-pfacts{grid-template-columns:repeat(3,minmax(0,1fr))}
  .bespoke-alt-heepsy .he-pfacts b{font-size:24px}
  .bespoke-alt-heepsy .he-minis{grid-template-columns:1fr}
  .bespoke-alt-heepsy .he-chart--desk{display:none}
  .bespoke-alt-heepsy .he-chart--mob{display:block}
  .bespoke-alt-heepsy .he-sources{columns:1}
  /* tables stack into one block per row */
  .bespoke-alt-heepsy :is(.he-table,.he-steps-table) thead{display:none}
  .bespoke-alt-heepsy :is(.he-table,.he-steps-table) :is(tbody,tr,th,td){display:block}
  .bespoke-alt-heepsy :is(.he-table,.he-steps-table) tr{border-bottom:1.5px solid var(--ls-line);padding:4px 0 10px}
  .bespoke-alt-heepsy :is(.he-table,.he-steps-table) tr:last-child{border-bottom:0}
  .bespoke-alt-heepsy :is(.he-table,.he-steps-table) th[scope="row"]{border:0;padding:14px 16px 6px;font-size:17px;white-space:normal}
  .bespoke-alt-heepsy :is(.he-table,.he-steps-table) td{border:0;padding:4px 16px;font-size:15px}
  .bespoke-alt-heepsy :is(.he-table,.he-steps-table) td::before{content:attr(data-label);margin-right:8px;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ls-muted)}
  .bespoke-alt-heepsy .he-steps-table td.he-us{background:transparent}
  .bespoke-alt-heepsy .he-steps-table td.he-us::before{color:var(--ls-blue-deep)}
}
@media (prefers-reduced-motion:reduce){.bespoke-alt-heepsy .he-card{transition:none}}
