/* TrustDento — /compare-prices. Scoped to .cp-* */
.cp-hero{background:radial-gradient(120% 140% at 100% 0%,#7D45E3 0,#5C27BC 60%);color:#fff;padding:44px 0 92px;text-align:center;border-radius:0 0 32px 32px}
.cp-eyebrow{display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.14);padding:5px 14px;border-radius:999px;font-size:13px;font-weight:500;margin-bottom:14px}
.cp-hero h1{color:#fff;margin:0 0 10px;font-size:clamp(26px,5vw,42px);line-height:1.15;font-weight:600;letter-spacing:-.01em}
.cp-hero h1 em{font-style:normal;color:#FFD24A}
.cp-hero p{color:#E9DDFB;max-width:62ch;margin:0 auto 26px;font-size:clamp(14px,2vw,16.5px);line-height:1.6}
.cp-filter{display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:10px;max-width:960px;margin:0 auto;background:#fff;border-radius:18px;padding:12px;box-shadow:0 18px 44px rgba(20,4,60,.35);text-align:left}
.cp-field{display:flex;flex-direction:column;gap:3px;padding:6px 12px;border-radius:12px;background:var(--paper,#F6F5F9)}
.cp-field span{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted,#6B6A77)}
.cp-field select{border:0;background:transparent;font:400 15px var(--font);color:var(--ink,#1C1B22);outline:0;padding:2px 0;width:100%;cursor:pointer}
.cp-field:focus-within{box-shadow:0 0 0 3px var(--primary-tint-strong,#E1D4F8)}
.cp-go{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;cursor:pointer;background:var(--primary,#6A2FD0);color:#fff;font:500 15px var(--font);padding:0 28px;border-radius:12px;transition:background .15s}
.cp-go:hover{background:var(--primary-darker,#3A1480)}

.cp-main{margin-top:-52px;position:relative;z-index:2;padding-bottom:40px}
.cp-card{background:#fff;border:1px solid var(--line,#E7E5EE);border-radius:20px;box-shadow:0 8px 30px rgba(20,4,60,.07);padding:24px;margin-bottom:22px}
.cp-card-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:16px}
.cp-card-head h2{margin:0;font-size:clamp(19px,2.6vw,24px);font-weight:600;color:var(--primary-darker,#3A1480)}
.cp-card-head p{margin:4px 0 0;color:var(--muted,#6B6A77);font-size:14.5px}

.cp-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:22px}
.cp-stat{background:#fff;border:1px solid var(--line,#E7E5EE);border-radius:18px;padding:18px 20px;box-shadow:0 8px 24px rgba(20,4,60,.06);border-top:4px solid var(--primary-tint-strong,#E1D4F8)}
.cp-stat small{display:block;font-size:12px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--muted,#6B6A77)}
.cp-stat b{display:block;margin-top:6px;font-size:clamp(22px,3vw,30px);font-weight:600;color:var(--ink,#1C1B22)}
.cp-stat--low{border-top-color:#1FA971}.cp-stat--low b{color:#13794F}
.cp-stat--avg{border-top-color:var(--primary,#6A2FD0)}.cp-stat--avg b{color:var(--primary-dark,#5522B5)}
.cp-stat--high{border-top-color:#E58A1F}

.cp-sort{display:inline-flex;background:var(--paper,#F6F5F9);border-radius:999px;padding:4px;gap:2px}
.cp-sort a{padding:7px 14px;border-radius:999px;font-size:13px;font-weight:500;color:var(--ink-soft,#3A3945)}
.cp-sort a.on{background:var(--primary,#6A2FD0);color:#fff}

.cp-table-wrap{overflow-x:auto;margin:0 -8px}
.cp-table{width:100%;border-collapse:collapse;font-size:14.5px}
.cp-table th{padding:11px 12px;background:var(--primary-tint,#F2ECFC);color:var(--primary-darker,#3A1480);font-size:12px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;text-align:left;white-space:nowrap}
.cp-table th:first-child{border-radius:10px 0 0 10px}.cp-table th:last-child{border-radius:0 10px 10px 0}
.cp-table td{padding:14px 12px;border-bottom:1px solid var(--line-soft,#F0EEF5);vertical-align:middle}
.cp-table tbody tr:hover{background:#FBFAFE}
.cp-table .num{text-align:right;white-space:nowrap}.cp-table th.num{text-align:right}
.cp-table .act{text-align:right;white-space:nowrap}
.cp-avg{font-weight:600;color:var(--primary-dark,#5522B5)}
.cp-price{font-size:16px;font-weight:600;color:var(--ink,#1C1B22)}
.cp-badge{display:block;margin-top:4px;font-style:normal;font-size:11px;font-weight:600;color:#13794F;background:#E3F6EC;padding:2px 8px;border-radius:999px;width:max-content;margin-left:auto}
.cp-sub{display:block;color:var(--muted,#6B6A77);font-size:12.5px}
.cp-link{display:inline-flex;align-items:center;gap:3px;font-weight:600;color:var(--primary,#6A2FD0);font-size:13.5px}
.cp-btn{display:inline-block;padding:8px 16px;border-radius:999px;background:var(--primary-tint,#F2ECFC);color:var(--primary-dark,#5522B5);font-weight:600;font-size:13px;transition:background .15s,color .15s}
.cp-btn:hover{background:var(--primary,#6A2FD0);color:#fff}

.cp-prov{display:flex;align-items:center;gap:12px;color:inherit}
.cp-prov b{display:block;font-weight:600;color:var(--ink,#1C1B22)}.cp-prov small{color:var(--muted,#6B6A77);font-size:12.5px}
.cp-av{flex:0 0 44px;width:44px;height:44px;border-radius:50%;background:var(--primary-tint,#F2ECFC);color:var(--primary,#6A2FD0);display:flex;align-items:center;justify-content:center;overflow:hidden}
.cp-av img{width:100%;height:100%;object-fit:cover}
.cp-ver{color:#1FA971;display:inline-flex;vertical-align:-2px;font-style:normal}
.cp-trust{display:inline-flex;align-items:center;gap:5px;font-weight:600;color:var(--primary-dark,#5522B5);background:var(--primary-tint,#F2ECFC);padding:4px 10px;border-radius:999px}
.cp-rv{display:block;margin-top:4px;color:var(--muted,#6B6A77);font-size:12px}

.cp-range{display:block;position:relative;height:8px;min-width:140px;border-radius:99px;background:var(--line-soft,#F0EEF5)}
.cp-range i{position:absolute;top:0;bottom:0;border-radius:99px;background:linear-gradient(90deg,#1FA971,var(--primary,#6A2FD0))}
.cp-rtxt{display:block;margin-top:5px;color:var(--ink-soft,#3A3945);font-size:12.5px}

.cp-empty{margin:6px 0;color:var(--muted,#6B6A77)}
.cp-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:22px}
.cp-steps div{background:#fff;border:1px solid var(--line,#E7E5EE);border-radius:18px;padding:20px}
.cp-steps span{display:inline-flex;width:42px;height:42px;border-radius:12px;background:var(--primary-tint,#F2ECFC);color:var(--primary,#6A2FD0);align-items:center;justify-content:center;margin-bottom:10px}
.cp-steps h3{margin:0 0 4px;font-size:16.5px;font-weight:600}.cp-steps p{margin:0;color:var(--muted,#6B6A77);font-size:14px}

.cp-note{display:flex;gap:10px;align-items:flex-start;background:#FFF8E8;border:1px solid #F4E1B0;color:#6B5413;border-radius:14px;padding:12px 16px;font-size:13.5px;margin:0 0 22px}
.cp-note .icon{flex:0 0 auto;margin-top:2px}
.cp-cta{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;background:linear-gradient(120deg,var(--primary-darker,#3A1480),var(--primary,#6A2FD0));color:#fff;border-radius:20px;padding:26px 28px}
.cp-cta h3{margin:0 0 4px;color:#fff;font-size:20px;font-weight:600}.cp-cta p{margin:0;color:#E9DDFB;font-size:14.5px;max-width:52ch}
.cp-btn--light{background:#fff;color:var(--primary-darker,#3A1480);padding:11px 22px;font-size:14px}.cp-btn--light:hover{background:#FFD24A;color:#1C1B22}

@media (max-width:860px){
  .cp-filter{grid-template-columns:1fr 1fr}.cp-field--wide{grid-column:1/-1}.cp-go{grid-column:1/-1;padding:13px}
  .cp-stats{grid-template-columns:repeat(2,1fr)}.cp-steps{grid-template-columns:1fr}
}
@media (max-width:640px){
  .cp-hero{padding:30px 0 84px;border-radius:0 0 26px 26px}
  .cp-card{padding:18px 14px}
  /* tables become stacked cards on phones */
  .cp-table thead{display:none}
  .cp-table,.cp-table tbody,.cp-table tr,.cp-table td{display:block;width:100%}
  .cp-table tr{border:1px solid var(--line,#E7E5EE);border-radius:14px;padding:8px 12px;margin-bottom:12px}
  .cp-table td{display:flex;justify-content:space-between;align-items:center;gap:12px;border-bottom:1px solid var(--line-soft,#F0EEF5);padding:10px 0;text-align:right}
  .cp-table td:last-child{border-bottom:0}
  .cp-table td[data-label]::before{content:attr(data-label);font-size:11.5px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--muted,#6B6A77);text-align:left}
  .cp-table td[data-label="Dentist"]{display:block;text-align:left}.cp-table td[data-label="Dentist"]::before{display:none}
  .cp-table td.act{justify-content:flex-end}
  .cp-badge{margin-left:0}
}