/* HairLossPrice additions on top of the shared design system */
/* logo (kept here so the site works whatever the shared stylesheet does with logos) */
.sub{display:block;font-size:12px;color:var(--muted);font-weight:400}
.answer .tiny{margin:0;padding:8px 16px 12px;color:var(--muted)}
.qbox{border-left:3px solid var(--green-btn);background:var(--subtle);padding:12px 16px;border-radius:0 var(--r) var(--r) 0;margin:0;max-width:880px}
.qa h2{margin-top:8px}
.code{font-family:var(--fm);font-size:13px;border:1px dashed var(--green);border-radius:6px;padding:2px 8px;background:var(--green-bg);color:var(--green)}
table.mini{width:100%;border-collapse:collapse;font-size:13px}
.mini th,.mini td{padding:7px 16px;text-align:left;border-top:1px solid var(--border2);vertical-align:top}
.mini thead th{font-size:12px;color:var(--muted);font-weight:600;background:var(--subtle);border-top:0}
table.mini2{width:100%}
.cmp.hl td{min-width:0}
.cmp.hl td[data-label="What is included"],.cmp.hl td[data-label="Delivery"]{font-size:13px;max-width:220px}
.cmp.hl td[data-label="Regulator"]{font-size:13px;max-width:150px}
.split+.split{margin-top:0}
.narrow0{max-width:760px;margin-top:24px}
@media (max-width:960px){
  .cmp.hl td[data-label="Lowest monthly price"]{grid-column:1/-1;background:var(--subtle);border:1px solid var(--border2);border-radius:var(--r);padding:8px 10px}
  .cmp.hl td[data-label="Lowest monthly price"] .num{font-size:18px}
  .cmp.hl td[data-label="What is included"],.cmp.hl td[data-label="Delivery"],.cmp.hl td[data-label="Regulator"]{max-width:none}
  .cmp.hl td[data-label="What is included"]{grid-column:1/-1}
  .cmp.pp td,.cmp.mini2 td{min-width:0}
  .cmp.hl tr.st-pending td[data-label="Consultation"],.cmp.hl tr.st-pending td[data-label="What is included"],.cmp.hl tr.st-pending td[data-label="Regulator"]{display:none}
  .cmp.hl tr.st-pending td[data-label="Lowest monthly price"]{background:none;border:0;padding:0}
  .mini th,.mini td{padding:7px 12px}
}
/* interactive price list */
.pl-bar{position:sticky;top:62px;z-index:4;background:var(--canvas);padding:10px 0;display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;border-bottom:1px solid var(--border2);margin-bottom:12px}
.seg{display:inline-flex;border:1px solid var(--border);border-radius:var(--r);overflow:hidden;background:var(--subtle)}
.segb{font:500 13px/20px var(--f);padding:5px 12px;border:0;background:none;color:var(--fg);cursor:pointer;border-right:1px solid var(--border)}
.segb:last-child{border-right:0}
.segb[aria-checked="true"]{background:var(--canvas);font-weight:600;box-shadow:inset 0 -2px 0 var(--green-btn)}
.dchips{display:flex;gap:6px;flex-wrap:wrap}
.dchip{font:600 13px/18px var(--f);padding:5px 11px;border:1px solid var(--border);border-radius:2em;background:var(--canvas);color:var(--fg);cursor:pointer}
.dchip[aria-pressed="true"]{background:var(--fg);border-color:var(--fg);color:#fff}
.pl-tools{display:flex;gap:12px;align-items:center;margin-left:auto}
.pl-tools input[type=search]{font:inherit;font-size:14px;padding:5px 10px;border:1px solid var(--border);border-radius:var(--r);min-width:180px}
.pl-tools .count{margin:0;padding:0;white-space:nowrap}
.matrix{position:relative;overflow-x:auto;border:1px solid var(--border);border-radius:var(--r)}
.matrix.more{box-shadow:inset -18px 0 14px -14px rgba(31,35,40,.25)}
table.mtx{width:100%;border-collapse:separate;border-spacing:0;font-size:14px;background:var(--canvas)}
.mtx-cap{margin:0 0 8px;font-size:12px;color:var(--muted)}
.mtx th,.mtx td{padding:10px 12px;border-bottom:1px solid var(--border2);text-align:left;vertical-align:top;background:var(--canvas)}
.mtx thead th{background:var(--subtle);font-size:12px;font-weight:600;color:var(--muted);white-space:nowrap;border-bottom:1px solid var(--border)}
.mtx .pcol{position:sticky;left:0;z-index:2;min-width:210px;border-right:1px solid var(--border2)}
.mtx thead .pcol{z-index:3}
.mtx .pcol .chip{display:inline-flex;margin-top:4px}
.mtx .pcol .cn{display:block}
.mtx td.pc{min-width:112px;max-width:150px}
.mtx td.pc .pv-v{display:block;white-space:nowrap}
.mtx .pk{display:block;font-size:11px;line-height:1.35;color:var(--muted);margin-top:2px}
.mtx .pk-s{display:inline-block;font-size:11px;margin-top:2px}
.mtx td.pc.na .pv-v{color:var(--muted);font-size:12px;white-space:normal}
.mtx td.pc.low{background:var(--green-bg)}
.mtx td.pc.low .pv-v{color:var(--green);font-weight:600}
.mtx td.pc.low .pv-v::after{content:"Lowest";display:block;font:600 10px/1.4 var(--f);letter-spacing:.02em;color:var(--green)}
.mtx .dcol.sel{box-shadow:inset 0 0 0 9999px rgba(9,105,218,.04)}
.mtx thead .dcol.sel{color:var(--fg)}
.sortb{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;text-decoration:underline dotted;text-underline-offset:3px}
.mtx .ocol{min-width:190px;font-size:13px}
.mtx tr:last-child>*{border-bottom:0}
@media (max-width:960px){
  .pl-bar{position:static;gap:8px}
  .seg{width:100%}.segb{flex:1;padding:6px 4px;font-size:13px}
  .dchips{flex-wrap:nowrap;overflow-x:auto;width:100%;padding-bottom:4px;-webkit-overflow-scrolling:touch}
  .dchip{flex:0 0 auto}
  .pl-tools{margin-left:0;width:100%}.pl-tools input[type=search]{flex:1;min-width:0}
  .mtx .pcol{min-width:130px;max-width:150px}
  .mtx .pcol .lg{display:none}
  /* one product selected: compact cards, nothing to scroll */
  table.mtx.one thead{display:none}
  table.mtx.one,table.mtx.one tbody{display:block}
  table.mtx.one tbody tr{display:grid;grid-template-columns:1fr auto;gap:6px 12px;padding:12px 14px;border-bottom:1px solid var(--border2)}
  table.mtx.one tbody tr[hidden]{display:none}
  table.mtx.one th,table.mtx.one td{border:0;padding:0;position:static;min-width:0;max-width:none;background:none}
  table.mtx.one td.pc{display:none}
  table.mtx.one td.pc.sel{display:block;grid-column:2;grid-row:1;text-align:right;align-self:start;max-width:150px}
  table.mtx.one td.pc.sel .pv-v{font-size:18px}
  table.mtx.one td.pc.low{background:none}
  table.mtx.one .pcol{grid-column:1;grid-row:1;border:0}
  table.mtx.one .pcol .lg{display:grid}
  table.mtx.one .dcol.sel{box-shadow:none}
  table.mtx.one .ocol{grid-column:1/-1;white-space:normal}
  table.mtx.one td.cta{grid-column:1/-1;text-align:left}
}
.mt16{margin-top:16px}


@media (max-width:1240px){
.cmp.cmp-wide.hl td{min-width:0}
.cmp.cmp-wide.hl td[data-label="What is included"],.cmp.cmp-wide.hl td[data-label="Delivery"]{font-size:13px;max-width:220px}
.cmp.cmp-wide.hl td[data-label="Regulator"]{font-size:13px;max-width:150px}
  .cmp.cmp-wide.hl td[data-label="Lowest monthly price"]{grid-column:1/-1;background:var(--subtle);border:1px solid var(--border2);border-radius:var(--r);padding:8px 10px}
  .cmp.cmp-wide.hl td[data-label="Lowest monthly price"] .num{font-size:18px}
  .cmp.cmp-wide.hl td[data-label="What is included"],.cmp.cmp-wide.hl td[data-label="Delivery"],.cmp.cmp-wide.hl td[data-label="Regulator"]{max-width:none}
  .cmp.cmp-wide.hl td[data-label="What is included"]{grid-column:1/-1}
  .cmp.cmp-wide.hl tr.st-pending td[data-label="Consultation"],.cmp.cmp-wide.hl tr.st-pending td[data-label="What is included"],.cmp.cmp-wide.hl tr.st-pending td[data-label="Regulator"]{display:none}
  .cmp.cmp-wide.hl tr.st-pending td[data-label="Lowest monthly price"]{background:none;border:0;padding:0}
}
.tcs{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.tc{display:flex;align-items:center;gap:14px;padding:16px;border-radius:14px;border:1px solid transparent;color:var(--fg);transition:transform .12s ease,box-shadow .12s ease}
.tc:hover{text-decoration:none;transform:translateY(-1px);box-shadow:0 6px 18px rgba(31,35,40,.08)}
.tc-i{flex:0 0 52px;height:52px;border-radius:12px;background:rgba(255,255,255,.75);display:grid;place-items:center}
.tc-i svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.tc-b{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.tc-e{font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;opacity:.75}
.tc-t{font-size:17px;font-weight:650;letter-spacing:-.01em}
.tc-d{font-size:13px;color:var(--muted)}
.tc-from{font-size:12px;margin-top:2px}.tc-from b{font-size:13px}
.tc-a{flex:0 0 34px;height:34px;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:16px}
.tc-mint{background:#E7F6EE;border-color:#CDEBD9}.tc-mint .tc-i{color:#1A6B43}
.tc-amber{background:#FDF3D7;border-color:#F4E2A8}.tc-amber .tc-i{color:#8A5A00}
.tc-peach{background:#FCEBE3;border-color:#F5D3C2}.tc-peach .tc-i{color:#A3461F}
.tc-sand{background:#F5F1E8;border-color:#E6DECB}.tc-sand .tc-i{color:#6B5A2E}
.tc-sky{background:#E6F0FB;border-color:#C9DDF4}.tc-sky .tc-i{color:#1F5FA8}
.tc-lav{background:#EFEAFB;border-color:#DCD2F4}.tc-lav .tc-i{color:#6440B8}
.tc-teal{background:#E2F5F3;border-color:#BFE7E1}.tc-teal .tc-i{color:#0E6D63}
.tc-rose{background:#FCEAF1;border-color:#F5CFDE}.tc-rose .tc-i{color:#A3305F}
.split2{display:grid;grid-template-columns:1fr 1fr;gap:20px}@media (max-width:960px){.split2{grid-template-columns:1fr}}
.vs-links a{white-space:nowrap}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin:14px 0}
.kpi{border:1px solid var(--border);border-radius:var(--r);padding:10px 12px}.kpi b{display:block;font-size:20px}.kpi span{font-size:12px;color:var(--muted)}
.mtx .pk-m{display:block;color:var(--green);font-weight:600}