/* ════════════════════════════════════════════════════════════
   V4 — REVISION 8 POLISH
   Readable section labels · hero balance · comparison cards ·
   three-plan grid · a believable 2018 "before" · richer "after"
   (No palette, type-family or spacing-scale changes.)
   ════════════════════════════════════════════════════════════ */

/* ---------- 1. section labels become real hierarchy ---------- */
.eyebrow{
  font-size:.86rem;letter-spacing:.26em;font-weight:500;
  color:rgba(11,20,32,.62);
  gap:18px;
}
.eyebrow::before{width:46px;height:1.5px;background:var(--gold);opacity:.95}
.on-dark .eyebrow,.ba2 .eyebrow{color:rgba(245,242,234,.82)}
.on-dark .eyebrow::before,.ba2 .eyebrow::before{background:var(--gold-2)}
.hero-cine .eyebrow{
  font-size:.95rem;letter-spacing:.3em;font-weight:500;
  color:rgba(245,242,234,.95);
  text-shadow:0 0 26px rgba(201,165,92,.55),0 1px 12px rgba(11,20,32,.6);
}
.hero-cine .eyebrow::before{background:var(--gold-2);width:54px;box-shadow:0 0 14px rgba(201,165,92,.7)}
/* supporting labels: mono micro-copy that was disappearing */
.svc-panel .svc-eyebrow,.plan-inc .t,.form-head .ref,.audit-panel .ap-ref,
.iw-sig,.path-card .pc-day,.trust-card .ic + h3{letter-spacing:.2em}
.svc-panel .svc-eyebrow{font-size:.78rem;color:var(--gold-2)}
.plan-inc .t{font-size:.74rem;color:rgba(11,20,32,.55)}
.plan-feat .plan-inc .t{color:rgba(245,242,234,.66)}
.audit-panel .ap-ref,.form-head .ref{font-size:.7rem;color:rgba(245,242,234,.6)}
.path-card .pc-day{font-size:.75rem}
.svc-count{font-size:.76rem;color:rgba(245,242,234,.68)}
.band-cap,.photo-card .cap,.coord{font-size:.68rem}
.plans-note{font-size:.92rem;color:rgba(11,20,32,.6)}

/* ---------- 2. hero balance ---------- */
.hero-cine h1{font-size:clamp(2.1rem,1.35rem + 2.85vw,3.7rem);margin-top:.2rem}
.hero-cine .hero-sub{max-width:52ch;line-height:1.75;color:rgba(245,242,234,.86)}

/* ---------- 3. The Idea: 20% shorter, calmer measure ---------- */
.statement-v2{padding-block:clamp(4.4rem,8vw,7.6rem)}
.statement-v2 .h-sub{max-width:26ch;line-height:1.28}
.statement-v2 .bignum-row{margin-top:clamp(2.8rem,5.6vw,4.8rem);padding-top:clamp(1.6rem,3.2vw,2.4rem)}
.photo-card img{aspect-ratio:4/4.15}

/* ---------- 4. Why us: an unmistakable side-by-side ---------- */
.audit-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(1.2rem,2.4vw,2rem);align-items:stretch;
}
.audit-left{position:static}
.audit-head{grid-column:1/-1;max-width:56ch;margin-bottom:clamp(1.4rem,3vw,2.4rem)}
.cmp-card{
  border-radius:20px;padding:clamp(1.7rem,3vw,2.6rem);
  display:flex;flex-direction:column;position:relative;
}
.cmp-card .cmp-head{
  display:flex;align-items:center;gap:.7em;
  font-family:var(--sans);font-weight:500;letter-spacing:-.01em;
  font-size:clamp(1.08rem,.98rem + .55vw,1.4rem);
  padding-bottom:1.1rem;margin-bottom:.4rem;border-bottom:1px solid currentColor;
}
.cmp-card .cmp-head .mk{
  display:grid;place-items:center;width:1.9em;height:1.9em;border-radius:50%;
  font-size:.62em;flex:none;
}
/* left — what you usually get */
.cmp-them{background:rgba(11,20,32,.035);border:1px solid var(--line)}
.cmp-them .cmp-head{color:rgba(11,20,32,.55);border-color:var(--line)}
.cmp-them .cmp-head .mk{background:rgba(179,86,74,.12);color:#B3564A}
.cmp-them li{
  position:relative;padding:1.05rem 0;border-bottom:1px solid var(--line-soft);
  color:var(--steel);font-size:.99rem;line-height:1.6;
}
.cmp-them li:last-child{border-bottom:0}
.cmp-them li .sline{position:absolute;left:0;top:58%;height:1.5px;width:100%;background:#B3564A;transform:scaleX(0);transform-origin:left;opacity:.6}
.cmp-them li.is-in .sline{transform:scaleX(1);transition:transform .8s var(--ease) var(--d,0s)}
/* right — the PracticeReach difference */
.cmp-us{
  background:linear-gradient(168deg,#13223A 0%,#0B1420 60%);
  border:1px solid rgba(201,165,92,.34);color:var(--paper);
  box-shadow:0 60px 120px -55px rgba(11,20,32,.55);
}
.cmp-us .cmp-head{color:var(--paper);border-color:var(--line-dark)}
.cmp-us .cmp-head .mk{background:rgba(201,165,92,.16);color:var(--gold-2)}
.cmp-us li{
  display:flex;gap:.9em;align-items:flex-start;
  padding:1.05rem 0;border-bottom:1px solid var(--line-dark);
  color:rgba(245,242,234,.86);font-size:.99rem;line-height:1.6;
}
.cmp-us li:last-of-type{border-bottom:0}
.cmp-us li b{color:var(--paper);font-weight:500}
.cmp-us .ic{color:var(--gold-2);flex:none;margin-top:.3em}
.cmp-us .serp{margin-top:auto}
@media (max-width:860px){
  .audit-grid{grid-template-columns:1fr}
  .cmp-us{order:-1}
}

/* ---------- 5. three plans ---------- */
.plans{grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;gap:clamp(1rem,1.8vw,1.6rem)}
.plan{padding:clamp(1.6rem,2.6vw,2.2rem)}
.plan .for{min-height:4.2em;font-size:.93rem}
.plan-price .amt{font-size:clamp(1.85rem,1.4rem + 1.5vw,2.5rem)}
/* Authority = the premium tier */
.plan-top{transform:translateY(-16px);border-color:rgba(201,165,92,.42)}
.plan-top:hover{transform:translateY(-24px)}
.plan-top .plan-badge{background:var(--ink);color:var(--gold-2);border:1px solid rgba(201,165,92,.5)}
.plan-mid .plan-badge{background:var(--gold-2);color:var(--ink)}
@media (max-width:1000px){
  .plans{grid-template-columns:1fr;max-width:560px;margin-inline:auto}
  .plan-top,.plan-top:hover{transform:none}
  .plan .for{min-height:0}
}

/* ---------- 6. BEFORE: a real, dated 2018 firm site ---------- */
.mk-old{
  background:#fff;color:#333;font-family:Arial,Helvetica,sans-serif;
  font-size:1.05em;line-height:1.45;display:flex;flex-direction:column;filter:saturate(.9);
}
.mk-old .o-top{background:#1F4E79;color:#fff;padding:1.1em 1.8em;display:flex;justify-content:space-between;align-items:center}
.mk-old .o-brand{font-size:1.5em;font-weight:700;letter-spacing:.01em}
.mk-old .o-brand small{display:block;font-size:.46em;font-weight:400;color:#BBD3E8;letter-spacing:.06em;margin-top:.3em}
.mk-old .o-contact{font-size:.85em;color:#D6E4F0;text-align:right;line-height:1.5}
.mk-old .o-nav{background:#F2F2F2;border-bottom:1px solid #DDD;display:flex;padding:0 1.2em}
.mk-old .o-nav span{padding:.85em 1.15em;font-size:.86em;color:#1F4E79}
.mk-old .o-nav span.on{border-bottom:3px solid #1F4E79;font-weight:700}
.mk-old .o-hero{
  background:linear-gradient(#5B87AF,#3C6B94);color:#fff;text-align:center;
  padding:2.6em 2em;
}
.mk-old .o-hero h2{font-size:1.7em;font-weight:700;margin-bottom:.5em}
.mk-old .o-hero p{font-size:.92em;color:#E4EDF5;max-width:44em;margin:0 auto .9em}
.mk-old .o-btn{display:inline-block;background:#F0AD4E;color:#fff;padding:.6em 1.5em;border-radius:3px;font-size:.86em;font-weight:700}
.mk-old .o-cards{display:flex;gap:1.2em;padding:1.8em;flex:1}
.mk-old .o-card{flex:1;border:1px solid #E0E0E0;border-radius:3px;padding:1.2em;text-align:center;box-shadow:0 1px 2px rgba(0,0,0,.06)}
.mk-old .o-ico{width:2.6em;height:2.6em;border-radius:50%;background:#EAF1F7;margin:0 auto .7em;display:grid;place-items:center;color:#1F4E79;font-size:1em}
.mk-old .o-card h4{font-size:.98em;color:#1F4E79;margin-bottom:.4em}
.mk-old .o-card p{font-size:.82em;color:#777}
.mk-old .o-foot{background:#333;color:#AAA;font-size:.78em;padding:.9em 1.8em;display:flex;justify-content:space-between}

/* ---------- 7. AFTER: pushed further ---------- */
.mk-a1{background:radial-gradient(120% 90% at 78% 12%,#1D3026 0%,#17251E 55%,#101913 100%)}
.mk-a1 .a-nav{border-bottom:1px solid rgba(241,237,227,.1)}
.mk-a1 .a-links span{position:relative}
.mk-a .a-eyebrow{
  font-family:var(--mono);font-size:.72em;letter-spacing:.26em;text-transform:uppercase;
  opacity:.7;display:block;margin-bottom:1.4em;
}
.mk-a1 .a-eyebrow{color:#D8C29A}
.mk-a .a-glass{
  position:absolute;right:2.4em;bottom:2.4em;width:34%;
  border-radius:1em;padding:1.3em 1.5em;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  box-shadow:0 2em 4em -1.6em rgba(0,0,0,.5);
}
.mk-a .a-glass .q{font-family:var(--serif);font-size:1.12em;line-height:1.35;font-style:italic}
.mk-a .a-glass .n{font-family:var(--mono);font-size:.68em;letter-spacing:.16em;text-transform:uppercase;opacity:.62;margin-top:.9em}
.mk-a1 .a-stats{border-top:1px solid rgba(241,237,227,.12);padding-top:1.4em;max-width:70%}
.mk-a3 h2{letter-spacing:-.03em}
.mk-a3 .a-rule{height:1px;background:linear-gradient(90deg,#8FB3D9,transparent);margin:1.6em 0 1.2em;max-width:60%}

/* ---------- 8. readability everywhere ---------- */
.lede{font-size:1.02rem;line-height:1.72;max-width:60ch}
.svc-panel p{line-height:1.72}
.faq-a p{line-height:1.75}
.plan-inc li{line-height:1.55}
.iw-item p{line-height:1.65}
