/* Heart & Soul Accounting. Built from the approved design: styles.css + home-b.css + pages-b.css + chat/cookie styles. */
/* Heart & Soul Accounting: high-fidelity design (homepage + package template)
   Tokens map 1:1 to GeneratePress Global Colors / theme.json at build time. */

/* Elementor strips link underlines inside page content; the design relies on the browser default.
   Placed first so the design's own link rules below still win; class-only link styles are restated. */
.elementor a { text-decoration: revert; }
.elementor a.btn, .elementor a.problem, .elementor a.post { text-decoration: none; }

:root {
  /* Brand: navy #181c3e and teal #52c1ca, taken from her logo SVGs */
  --navy-950: #181c3e;
  --navy-900: #1e2350;
  --indigo-800: #282d72;
  --deep-teal: #1f5a72;
  --teal-600: #1a7f88; /* teal for text on white (AA contrast) */
  --teal-500: #52c1ca; /* brand teal */
  --teal-300: #8fd8de;
  --teal-50: #ecf8f9;
  --ink: #181c3e;
  --muted: #5f6480;
  --line: #e3e6ee;
  --soft: #f5f7fa;
  --white: #ffffff;
  --star: #f5b941;

  --grad-hero: radial-gradient(60% 70% at 85% 10%, rgba(82,193,202,.28), transparent 60%),
               radial-gradient(50% 60% at 10% 100%, rgba(82,193,202,.18), transparent 60%),
               linear-gradient(135deg, #181c3e 0%, #282d72 42%, #1f5a72 78%, #3aa9b3 100%);
  --grad-card: linear-gradient(135deg, #181c3e 0%, #282d72 50%, #3aa9b3 130%);
  --grad-teal: linear-gradient(135deg, #61cad2, #44b5bf);

  --r-sm: 10px;
  --r: 16px;
  --r-lg: 24px;
  --shadow: 0 10px 30px rgba(26, 28, 74, .08);
  --shadow-lg: 0 24px 60px rgba(26, 28, 74, .16);
  --wrap: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: "Poppins", system-ui, sans-serif;
  color: var(--ink);
  background: var(--white);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; display: block; }
a { color: inherit; }
h1, h2, h3, h4 { margin: 0; line-height: 1.12; letter-spacing: -.02em; }
p { margin: 0; }

.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 24px; }
.eyebrow {
  font-size: 12px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase;
  color: var(--teal-600);
}
.section { padding: 96px 0; }
.section-head { text-align: center; max-width: 680px; margin: 0 auto 48px; }
.section-head h2 { font-size: clamp(28px, 3.4vw, 40px); margin-top: 10px; }
.section-head p { color: var(--muted); margin-top: 14px; }
.hl { color: var(--teal-500); }

/* Buttons */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 15px 26px; border-radius: 999px; font: 600 15px/1 "Poppins", sans-serif;
  text-decoration: none; cursor: pointer; border: 1.5px solid transparent;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.btn:hover { transform: translateY(-1px); }
/* Navy text on brand teal: white on #52c1ca fails contrast */
.btn-teal { background: var(--grad-teal); color: var(--navy-950); box-shadow: 0 8px 20px rgba(82,193,202,.35); }
.btn-ghost { border-color: rgba(255,255,255,.45); color: var(--white); }
.btn-ghost:hover { background: rgba(255,255,255,.08); }
.btn-white { background: var(--white); color: var(--navy-900); }
.btn-navy { background: var(--navy-900); color: var(--white); }
.btn-outline { border-color: var(--line); color: var(--ink); background: var(--white); }
.arrow::after { content: "→"; transition: transform .15s; }
a:hover .arrow::after, .arrow:hover::after { transform: translateX(3px); }

/* Logo: her "Main Reverse" SVG */
.logo { display: inline-block; line-height: 0; }
.logo img { height: 46px; width: auto; }

/* Header */
.site-header {
  background: var(--navy-950); position: sticky; top: 0; z-index: 50;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.nav { display: flex; align-items: center; justify-content: space-between; height: 84px; }
.nav-links { display: flex; gap: 30px; list-style: none; margin: 0; padding: 0; }
.nav-links a { color: rgba(255,255,255,.8); text-decoration: none; font-size: 14px; font-weight: 500; }
.nav-links a:hover, .nav-links a[aria-current] { color: var(--white); }
.nav-links a[aria-current] { box-shadow: inset 0 -2px 0 var(--teal-500); padding-bottom: 6px; }
.nav-cta { padding: 12px 22px; font-size: 14px; }
.menu-btn { display: none; background: none; border: 0; color: var(--white); cursor: pointer; padding: 8px; }

/* Hero */
.hero { background: var(--grad-hero); color: var(--white); padding: 80px 0 96px; position: relative; overflow: hidden; }
.hero::after {
  content: ""; position: absolute; width: 520px; height: 520px; right: -160px; bottom: -260px;
  border: 1px solid rgba(255,255,255,.1); border-radius: 50%;
  box-shadow: 0 0 0 70px rgba(255,255,255,.02), inset 0 0 0 70px rgba(255,255,255,.02);
}
.hero-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 64px; align-items: center; position: relative; z-index: 1; }
.pill {
  display: inline-block; padding: 8px 16px; border-radius: 999px; border: 1px solid rgba(127,211,214,.5);
  font-size: 11.5px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--teal-300);
}
.hero h1 { font-size: clamp(40px, 5.6vw, 68px); font-weight: 700; margin: 24px 0 22px; min-height: 2.24em; }
.hero h1 .hl { color: var(--teal-300); }
.hero-sub { font-size: 18px; color: rgba(255,255,255,.78); max-width: 560px; font-weight: 300; }
.hero-actions { display: flex; gap: 14px; margin-top: 34px; flex-wrap: wrap; }
.stars { color: var(--star); letter-spacing: 2px; }
.hero-proof { display: flex; align-items: center; gap: 12px; margin-top: 30px; font-size: 14px; color: rgba(255,255,255,.75); }
.fade { transition: opacity .25s ease, transform .25s ease; }
.fade.out { opacity: 0; transform: translateY(6px); }

.picker {
  background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.18); border-radius: var(--r-lg);
  padding: 30px; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 30px 60px rgba(0,0,0,.18);
}
.picker .eyebrow { color: var(--teal-300); }
.picker h2 { font-size: 21px; font-weight: 600; margin: 10px 0 20px; letter-spacing: -.01em; }
.opt {
  display: flex; align-items: center; gap: 14px; width: 100%; text-align: left;
  padding: 16px 18px; margin-bottom: 10px; border-radius: 14px; cursor: pointer;
  background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.16);
  color: rgba(255,255,255,.85); font: 500 15px/1.35 "Poppins", sans-serif;
  transition: background .15s, border-color .15s;
}
.opt:hover { background: rgba(255,255,255,.09); }
.opt .dot { width: 20px; height: 20px; border-radius: 50%; border: 1.5px solid rgba(255,255,255,.55); flex: none; position: relative; }
.opt[aria-checked="true"] { background: rgba(59,180,187,.22); border-color: var(--teal-500); color: var(--white); }
.opt[aria-checked="true"] .dot { border-color: var(--teal-300); background: var(--teal-500); box-shadow: inset 0 0 0 4px #2b4f7a; }
.picker-result { font-size: 13.5px; color: rgba(255,255,255,.7); margin: 8px 2px 18px; min-height: 42px; }
.picker-result strong { color: var(--white); font-weight: 600; }
.picker .btn { width: 100%; }

/* Trust bar */
.trust { background: var(--soft); border-bottom: 1px solid var(--line); }
.trust ul { display: flex; justify-content: center; gap: 48px; flex-wrap: wrap; list-style: none; margin: 0; padding: 20px 24px; }
.trust li { display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 500; color: var(--ink); }
.tick { width: 22px; height: 22px; border-radius: 50%; background: var(--grad-teal); display: grid; place-items: center; flex: none; }
.tick svg { width: 12px; height: 12px; }

/* Problem cards */
.problems { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.problem {
  background: var(--white); border: 1px solid var(--line); border-left: 4px solid var(--teal-500);
  border-radius: var(--r); padding: 28px 26px; box-shadow: var(--shadow); text-decoration: none;
  display: flex; flex-direction: column; gap: 18px; transition: transform .2s, box-shadow .2s;
}
.problem:hover { transform: translateY(-3px); box-shadow: var(--shadow-lg); }
.problem q { font-size: 18px; font-weight: 600; line-height: 1.4; quotes: "“" "”"; }
.problem span { margin-top: auto; font-size: 14px; font-weight: 600; color: var(--teal-600); }

/* Steps */
.how { background: linear-gradient(180deg, var(--white), var(--teal-50)); }
.steps { display: grid; grid-template-columns: repeat(3, 1fr); position: relative; max-width: 960px; margin: 0 auto; }
.steps::before {
  content: ""; position: absolute; top: 36px; left: 16.6%; right: 16.6%; height: 3px;
  background: linear-gradient(90deg, var(--teal-500), var(--teal-300), var(--teal-500)); border-radius: 3px;
}
.step { text-align: center; position: relative; padding: 0 16px; }
.step-num {
  width: 72px; height: 72px; border-radius: 50%; margin: 0 auto 20px; display: grid; place-items: center;
  background: var(--teal-50); box-shadow: 0 0 0 10px rgba(59,180,187,.12);
}
.step-num b { width: 46px; height: 46px; border-radius: 50%; background: var(--grad-teal); color: var(--navy-950); display: grid; place-items: center; font-size: 18px; }
.step h3 { font-size: 18px; font-weight: 600; }
.step p { color: var(--muted); font-size: 14.5px; margin-top: 8px; }

/* Package cards */
.packages { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; align-items: stretch; }
.pkg {
  border: 1px solid var(--line); border-radius: var(--r-lg); padding: 34px 30px; background: var(--white);
  display: flex; flex-direction: column; box-shadow: var(--shadow); position: relative;
}
.pkg h3 { font-size: 22px; font-weight: 600; }
.pkg .for { color: var(--muted); font-size: 14.5px; margin-top: 6px; min-height: 46px; }
.price { margin: 22px 0 4px; display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
.price small { font-size: 13px; color: var(--muted); font-weight: 500; }
.price b { font-size: 38px; font-weight: 700; letter-spacing: -.03em; }
.price-note { font-size: 13px; color: var(--muted); }
.incl { list-style: none; padding: 22px 0 0; margin: 22px 0 28px; border-top: 1px solid var(--line); display: grid; gap: 12px; }
.incl li { display: flex; gap: 12px; font-size: 14.5px; }
.incl li::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--teal-500); flex: none; margin-top: 8px; }
.pkg .btn { margin-top: auto; }
.pkg.featured { background: var(--grad-card); color: var(--white); border-color: transparent; box-shadow: var(--shadow-lg); transform: translateY(-10px); }
.pkg.featured .for, .pkg.featured .price small, .pkg.featured .price-note { color: rgba(255,255,255,.72); }
.pkg.featured .incl { border-color: rgba(255,255,255,.18); }
.pkg.featured .incl li::before { background: var(--teal-300); }

/* Unstuck session */
.unstuck {
  margin-top: 56px; border-radius: var(--r-lg); border: 1.5px dashed var(--teal-500); background: var(--teal-50);
  padding: 34px 40px; display: grid; grid-template-columns: auto 1fr auto; gap: 32px; align-items: center;
}
.unstuck-badge {
  width: 84px; height: 84px; border-radius: 22px; background: var(--grad-teal); color: var(--navy-950);
  display: grid; place-items: center; text-align: center; font-weight: 700; font-size: 26px; line-height: 1;
}
.unstuck-badge small { display: block; font-size: 11px; font-weight: 500; letter-spacing: .06em; margin-top: 4px; }
.unstuck h3 { font-size: 22px; }
.unstuck p { color: var(--muted); margin-top: 6px; max-width: 620px; }
.unstuck .meta { display: flex; gap: 18px; margin-top: 12px; font-size: 13.5px; font-weight: 600; color: var(--ink); flex-wrap: wrap; }
.unstuck .meta span::before { content: "•"; color: var(--teal-500); margin-right: 8px; }

/* Cost comparison */
.compare { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--shadow-lg); max-width: 980px; margin: 0 auto; }
.compare > div { padding: 42px 40px; }
.compare .inhouse { background: var(--soft); }
.compare .fractional { background: var(--grad-card); color: var(--white); }
.compare h3 { font-size: 15px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.compare .inhouse h3 { color: var(--muted); }
.compare .fractional h3 { color: var(--teal-300); }
.compare .big { font-size: 46px; font-weight: 700; letter-spacing: -.03em; margin: 14px 0 4px; }
.compare .big small { font-size: 16px; font-weight: 500; opacity: .75; }
.compare ul { list-style: none; padding: 0; margin: 22px 0 0; display: grid; gap: 10px; font-size: 15px; }
.compare .inhouse li::before { content: "✕"; color: #c0566b; margin-right: 10px; font-weight: 700; }
.compare .fractional li::before { content: "✓"; color: var(--teal-300); margin-right: 10px; font-weight: 700; }

/* Meet Hayley */
.meet { display: grid; grid-template-columns: .8fr 1.2fr; gap: 64px; align-items: center; }
.photo {
  aspect-ratio: 4 / 5; border-radius: var(--r-lg); background:
    linear-gradient(160deg, rgba(59,180,187,.25), rgba(38,41,109,.35)), var(--soft);
  display: grid; place-items: center; color: var(--muted); font-size: 14px; text-align: center; position: relative;
  border: 1px solid var(--line); overflow: hidden; margin: 0;
}
.photo img { width: 100%; height: 100%; object-fit: cover; }
.photo.wide { aspect-ratio: 3 / 2; }
.photo::after {
  content: "ACA · ICAEW"; position: absolute; left: 20px; bottom: 20px; background: var(--white); color: var(--navy-900);
  font-size: 12px; font-weight: 700; letter-spacing: .12em; padding: 10px 14px; border-radius: 10px; box-shadow: var(--shadow);
}
.meet h2 { font-size: clamp(28px, 3.4vw, 40px); margin: 10px 0 18px; }
.meet p { color: var(--muted); font-size: 17px; margin-bottom: 14px; }
.meet blockquote { margin: 26px 0 30px; padding-left: 20px; border-left: 3px solid var(--teal-500); font-size: 19px; font-weight: 500; color: var(--ink); }

/* Reviews */
.reviews { background: var(--navy-950); color: var(--white); padding: 72px 0; }
.reviews-grid { display: grid; grid-template-columns: 200px 1fr 1fr; gap: 28px; align-items: stretch; }
.score .stars { font-size: 18px; }
.score b { display: block; font-size: 54px; line-height: 1; margin: 10px 0 6px; letter-spacing: -.03em; }
.score span { color: rgba(255,255,255,.65); font-size: 14px; }
.review {
  background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.12); border-radius: var(--r);
  padding: 26px 28px; display: flex; flex-direction: column; gap: 14px;
}
.review p { font-style: italic; color: rgba(255,255,255,.88); }
.review cite { font-style: normal; font-size: 13.5px; font-weight: 600; color: var(--teal-300); margin-top: auto; }
.g-badge { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; color: rgba(255,255,255,.6); margin-top: 16px; }

/* Check CTA */
.check-cta { background: var(--grad-teal); color: var(--navy-950); padding: 56px 0; }
.check-cta .btn-white { background: var(--navy-950); color: var(--white); }

/* Badges */
.badges { display: flex; align-items: center; gap: 28px; flex-wrap: wrap; margin-top: 34px; padding-top: 28px; border-top: 1px solid var(--line); }
.badges img { height: 44px; width: auto; object-fit: contain; }
.badges img.tall { height: 56px; }
.check-cta .wrap { display: flex; align-items: center; justify-content: space-between; gap: 32px; flex-wrap: wrap; }
.check-cta h2 { font-size: clamp(24px, 3vw, 32px); }
.check-cta p { opacity: .9; margin-top: 6px; }

/* Footer */
.site-footer { background: var(--navy-950); color: rgba(255,255,255,.7); padding: 64px 0 28px; font-size: 14px; }
.foot-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 40px; }
.site-footer h4 { color: var(--white); font-size: 14px; font-weight: 600; margin-bottom: 14px; }
.site-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.site-footer a { text-decoration: none; }
.site-footer a:hover { color: var(--white); }
.foot-existing { color: var(--teal-300) !important; font-weight: 600; }
.legal { border-top: 1px solid rgba(255,255,255,.1); margin-top: 48px; padding-top: 22px; font-size: 12.5px; color: rgba(255,255,255,.5); display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap; }

/* ---------- Package page ---------- */
.pkg-hero { background: var(--grad-hero); color: var(--white); padding: 64px 0 80px; }
.crumbs { font-size: 13px; color: rgba(255,255,255,.6); margin-bottom: 26px; }
.crumbs a { text-decoration: none; }
.pkg-hero-grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 56px; align-items: center; }
.pkg-hero h1 { font-size: clamp(36px, 4.8vw, 58px); margin: 18px 0 20px; }
.price-card {
  background: var(--white); color: var(--ink); border-radius: var(--r-lg); padding: 32px; box-shadow: var(--shadow-lg);
}
.price-card .price b { font-size: 44px; }
.price-card .incl { margin-bottom: 24px; }
.price-card .btn { width: 100%; }
.price-card .alt { display: block; text-align: center; font-size: 13.5px; color: var(--muted); margin-top: 14px; }
.price-card .alt a { color: var(--teal-600); font-weight: 600; }

.fit-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.fit { border-radius: var(--r-lg); padding: 36px; }
.fit.yes { background: var(--teal-50); }
.fit.no { background: var(--soft); }
.fit h3 { font-size: 20px; margin-bottom: 18px; }
.fit ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.fit li { position: relative; padding-left: 26px; }
.fit li::before { position: absolute; left: 0; font-weight: 700; }
.fit.yes li::before { content: "✓"; color: var(--teal-600); }
.fit.no li::before { content: "–"; color: var(--muted); }
.fit a { color: var(--teal-600); font-weight: 600; }
.fit.no li { color: var(--muted); }

.monthly { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.month-card { border: 1px solid var(--line); border-radius: var(--r); padding: 26px; background: var(--white); box-shadow: var(--shadow); }
.month-card .ico { width: 44px; height: 44px; border-radius: 12px; background: var(--grad-teal); color: var(--navy-950); display: grid; place-items: center; font-weight: 700; margin-bottom: 16px; }
.month-card h3 { font-size: 17px; }
.month-card p { color: var(--muted); font-size: 14.5px; margin-top: 8px; }

.timeline { max-width: 820px; margin: 0 auto; display: grid; gap: 0; }
.tl { display: grid; grid-template-columns: 120px 1fr; gap: 28px; padding: 26px 0; border-bottom: 1px solid var(--line); }
.tl b { color: var(--teal-600); font-size: 14px; letter-spacing: .1em; text-transform: uppercase; }
.tl h3 { font-size: 18px; }
.tl p { color: var(--muted); margin-top: 6px; }

.faq { max-width: 820px; margin: 0 auto; }
.faq details { border-bottom: 1px solid var(--line); padding: 22px 0; }
.faq summary { font-weight: 600; font-size: 17px; cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: 20px; }
.faq summary::after { content: "+"; color: var(--teal-600); font-size: 22px; line-height: 1; }
.faq details[open] summary::after { content: "–"; }
.faq details p { color: var(--muted); margin-top: 12px; }

.qualify { background: var(--soft); }
.qualify-box { max-width: 760px; margin: 0 auto; background: var(--white); border-radius: var(--r-lg); padding: 44px; box-shadow: var(--shadow-lg); }
.qualify-box h2 { font-size: 28px; }
.qualify-box > p { color: var(--muted); margin: 10px 0 28px; }
.q { margin-bottom: 24px; }
.q label.q-label { display: block; font-weight: 600; font-size: 15px; margin-bottom: 12px; }
.chips { display: flex; flex-wrap: wrap; gap: 10px; }
.chip {
  padding: 11px 18px; border-radius: 999px; border: 1.5px solid var(--line); background: var(--white);
  font: 500 14px/1 "Poppins", sans-serif; cursor: pointer; color: var(--ink);
}
.chip[aria-pressed="true"] { background: var(--grad-teal); border-color: transparent; color: var(--navy-950); }
.q-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 24px; }
.q-row input {
  width: 100%; padding: 14px 16px; border: 1.5px solid var(--line); border-radius: 12px; font: 400 15px "Poppins", sans-serif;
}
.q-row input:focus, .chip:focus-visible, .opt:focus-visible, .btn:focus-visible { outline: 3px solid var(--teal-300); outline-offset: 2px; }
.qualify-box .btn { width: 100%; }
.small-print { font-size: 12.5px; color: var(--muted); text-align: center; margin-top: 14px; }

/* ---------- Shared: CTA band, simple page hero ---------- */
.cta-band { background: var(--grad-card); color: var(--white); border-radius: var(--r-lg); padding: 48px; display: flex; align-items: center; justify-content: space-between; gap: 32px; flex-wrap: wrap; }
.cta-band h2 { font-size: clamp(26px, 3vw, 34px); }
.cta-band p { color: rgba(255,255,255,.75); margin-top: 8px; max-width: 560px; }
.cta-band .actions { display: flex; gap: 12px; flex-wrap: wrap; }
.page-hero { background: var(--grad-hero); color: var(--white); padding: 72px 0 80px; }
.page-hero h1 { font-size: clamp(36px, 4.8vw, 58px); margin: 18px 0 18px; max-width: 820px; }
.page-hero .hero-sub { max-width: 640px; }

/* ---------- About ---------- */
.about-hero { display: grid; grid-template-columns: 1.1fr .9fr; gap: 56px; align-items: center; }
.about-hero .photo { box-shadow: var(--shadow-lg); border: 0; }
.story { max-width: 760px; margin: 0 auto; }
.story h2 { font-size: clamp(26px, 3vw, 34px); margin: 40px 0 14px; }
.story h2:first-child { margin-top: 0; }
.story p { color: var(--muted); font-size: 17px; margin-bottom: 16px; }
.split-photos { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; max-width: 980px; margin: 0 auto; }
.split-photos .photo::after { display: none; }
.award-strip { display: flex; align-items: center; gap: 32px; background: var(--navy-950); color: var(--white); border-radius: var(--r-lg); padding: 32px 40px; flex-wrap: wrap; }
.award-strip img { height: 72px; border-radius: 10px; }
.award-strip p { color: rgba(255,255,255,.72); margin-top: 4px; }

/* ---------- Unstuck Session ---------- */
.discuss { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: start; }
.num-list { list-style: none; margin: 0; padding: 0; counter-reset: n; display: grid; gap: 18px; }
.num-list li { counter-increment: n; display: grid; grid-template-columns: 44px 1fr; gap: 16px; align-items: start; font-size: 16.5px; }
.num-list li::before { content: counter(n, decimal-leading-zero); width: 44px; height: 44px; border-radius: 12px; background: var(--teal-50); color: var(--teal-600); font-weight: 700; display: grid; place-items: center; font-size: 14px; }
.takeaway { background: var(--grad-card); color: var(--white); border-radius: var(--r-lg); padding: 40px; }
.takeaway h3 { font-size: 22px; margin: 10px 0 14px; }
.takeaway p { color: rgba(255,255,255,.8); margin-bottom: 14px; }
.booker { max-width: 980px; margin: 0 auto; background: var(--white); border-radius: var(--r-lg); box-shadow: var(--shadow-lg); display: grid; grid-template-columns: .9fr 1.1fr; overflow: hidden; }
.booker-info { background: var(--soft); padding: 36px; border-right: 1px solid var(--line); }
.booker-info h3 { font-size: 22px; margin: 10px 0 12px; }
.booker-info .row { display: flex; gap: 10px; font-size: 14.5px; color: var(--muted); margin-top: 10px; }
.booker-info .row b { color: var(--ink); font-weight: 600; min-width: 88px; }
.booker-cal { padding: 36px; }
.cal-head { display: flex; justify-content: space-between; align-items: center; font-weight: 600; margin-bottom: 16px; }
.cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; text-align: center; font-size: 13.5px; }
.cal-grid span { color: var(--muted); font-size: 12px; font-weight: 600; padding-bottom: 4px; }
.cal-grid button { aspect-ratio: 1; border: 0; border-radius: 10px; background: none; font: 500 14px "Poppins", sans-serif; color: #b4b8c8; }
.cal-grid button.open { background: var(--teal-50); color: var(--ink); cursor: pointer; }
.cal-grid button.sel { background: var(--grad-teal); color: var(--navy-950); font-weight: 700; }
.slots { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 22px 0; }
.slots .chip { text-align: center; }
.booker-cal .btn { width: 100%; }

/* ---------- Contact ---------- */
.contact-grid { display: grid; grid-template-columns: 1.35fr .65fr; gap: 32px; align-items: start; }
.contact-grid .qualify-box { max-width: none; margin: 0; }
.contact-side { display: grid; gap: 20px; }
.side-card { background: var(--white); border: 1px solid var(--line); border-radius: var(--r); padding: 26px; box-shadow: var(--shadow); }
.side-card h3 { font-size: 17px; margin-bottom: 10px; }
.side-card p, .side-card li { color: var(--muted); font-size: 14.5px; }
.side-card a { color: var(--teal-600); font-weight: 600; text-decoration: none; }
.side-card ul { margin: 0; padding-left: 18px; display: grid; gap: 6px; }
.q textarea, .q select { width: 100%; padding: 14px 16px; border: 1.5px solid var(--line); border-radius: 12px; font: 400 15px "Poppins", sans-serif; color: var(--ink); background: var(--white); }
.q textarea { min-height: 110px; resize: vertical; }
.states { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.state { border-radius: var(--r-lg); padding: 36px; }
.state.good { background: var(--grad-card); color: var(--white); }
.state.notyet { background: var(--white); border: 1px solid var(--line); box-shadow: var(--shadow); }
.state .tag { display: inline-block; font-size: 11.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; padding: 6px 12px; border-radius: 999px; margin-bottom: 16px; }
.state.good .tag { background: rgba(82,193,202,.25); color: var(--teal-300); }
.state.notyet .tag { background: var(--soft); color: var(--muted); }
.state h3 { font-size: 22px; margin-bottom: 10px; }
.state p { margin-bottom: 18px; }
.state.good p { color: rgba(255,255,255,.8); }
.state.notyet p { color: var(--muted); }
.state-label { text-align: center; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); margin-bottom: 18px; }

/* ---------- Other services ---------- */
.services-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.notice { background: var(--teal-50); border-left: 4px solid var(--teal-500); border-radius: var(--r-sm); padding: 20px 24px; color: var(--ink); }

/* ---------- Article ---------- */
.article-hero { background: var(--soft); padding: 64px 0 48px; border-bottom: 1px solid var(--line); }
.article-hero .crumbs { color: var(--muted); }
.article-hero h1 { font-size: clamp(34px, 4.4vw, 52px); max-width: 860px; margin: 14px 0 18px; }
.article-hero .lede { font-size: 19px; color: var(--muted); max-width: 760px; }
.byline { display: flex; align-items: center; gap: 14px; margin-top: 28px; font-size: 14px; color: var(--muted); }
.byline img { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; object-position: top; }
.byline b { color: var(--ink); display: block; }
.article-wrap { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 64px; padding: 64px 0 96px; }
.prose { font-size: 17.5px; line-height: 1.75; }
.prose h2 { font-size: 28px; margin: 44px 0 14px; }
.prose h3 { font-size: 20px; margin: 30px 0 10px; }
.prose p { margin-bottom: 18px; color: #3b3f5c; }
.prose ul { padding-left: 22px; margin: 0 0 18px; color: #3b3f5c; }
.prose li { margin-bottom: 8px; }
.prose .callout { background: var(--teal-50); border-left: 4px solid var(--teal-500); border-radius: var(--r-sm); padding: 22px 26px; margin: 28px 0; font-weight: 500; color: var(--ink); }
.prose figure { margin: 32px 0; }
.prose figure img { border-radius: var(--r); }
.prose figcaption { font-size: 13.5px; color: var(--muted); margin-top: 8px; }
.aside-stick { position: sticky; top: 108px; display: grid; gap: 20px; }
.toc { border: 1px solid var(--line); border-radius: var(--r); padding: 24px; }
.toc h4 { font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); margin-bottom: 12px; }
.toc ol { margin: 0; padding-left: 18px; display: grid; gap: 8px; font-size: 14.5px; }
.toc a { text-decoration: none; }
.toc a:hover { color: var(--teal-600); }
.aside-cta { background: var(--grad-card); color: var(--white); border-radius: var(--r); padding: 28px; }
.aside-cta h4 { font-size: 19px; margin: 8px 0 10px; }
.aside-cta p { color: rgba(255,255,255,.78); font-size: 14.5px; margin-bottom: 18px; }
.aside-cta .btn { width: 100%; }
.author-box { display: grid; grid-template-columns: 96px 1fr; gap: 22px; align-items: center; background: var(--soft); border-radius: var(--r); padding: 26px; margin-top: 48px; }
.author-box img { width: 96px; height: 96px; border-radius: 50%; object-fit: cover; object-position: top; }
.author-box p { color: var(--muted); font-size: 15px; margin-top: 4px; }

/* ---------- Two-minute check ---------- */
.check-box { max-width: 760px; margin: -56px auto 0; background: var(--white); border-radius: var(--r-lg); box-shadow: var(--shadow-lg); padding: 44px; position: relative; }
.progress { height: 8px; background: var(--soft); border-radius: 8px; overflow: hidden; margin: 10px 0 30px; }
.progress i { display: block; height: 100%; background: var(--grad-teal); border-radius: 8px; transition: width .3s ease; }
.step-meta { display: flex; justify-content: space-between; font-size: 13px; color: var(--muted); font-weight: 500; }
.check-q h2 { font-size: 26px; margin-bottom: 22px; }
.answers { display: grid; gap: 12px; }
.answer {
  text-align: left; padding: 18px 20px; border: 1.5px solid var(--line); border-radius: 14px; background: var(--white);
  font: 500 16px/1.4 "Poppins", sans-serif; color: var(--ink); cursor: pointer; transition: border-color .15s, background .15s;
}
.answer:hover { border-color: var(--teal-500); background: var(--teal-50); }
.check-nav { display: flex; justify-content: space-between; margin-top: 24px; }
.link-btn { background: none; border: 0; color: var(--muted); font: 500 14px "Poppins", sans-serif; cursor: pointer; padding: 0; }
.result { text-align: center; }
.result .score-ring { width: 120px; height: 120px; border-radius: 50%; margin: 0 auto 22px; display: grid; place-items: center; background: conic-gradient(var(--teal-500) var(--p, 70%), var(--soft) 0); }
.result .score-ring b { width: 92px; height: 92px; border-radius: 50%; background: var(--white); display: grid; place-items: center; font-size: 26px; }
.result h2 { font-size: 30px; margin-bottom: 12px; }
.result > p { color: var(--muted); max-width: 540px; margin: 0 auto 26px; }
.result .rec { text-align: left; background: var(--teal-50); border-radius: var(--r); padding: 24px 26px; margin-bottom: 26px; }
.result .rec b { font-size: 18px; }
.result .rec p { color: var(--muted); margin-top: 6px; }
.result .actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }

/* ---------- Design system ---------- */
.ds { padding: 64px 0 96px; }
.ds h2 { font-size: 26px; margin: 56px 0 20px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.ds h2:first-of-type { margin-top: 0; }
.swatches { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; }
.swatch { border-radius: var(--r); overflow: hidden; border: 1px solid var(--line); }
.swatch i { display: block; height: 96px; }
.swatch div { padding: 12px 14px; font-size: 13px; }
.swatch b { display: block; font-size: 14px; }
.swatch span { color: var(--muted); font-family: ui-monospace, Consolas, monospace; font-size: 12.5px; }
.type-row { display: grid; grid-template-columns: 180px 1fr; gap: 24px; align-items: baseline; padding: 16px 0; border-bottom: 1px dashed var(--line); }
.type-row small { color: var(--muted); font-size: 12.5px; font-family: ui-monospace, Consolas, monospace; }
.ds-row { display: flex; gap: 16px; flex-wrap: wrap; align-items: center; padding: 28px; border-radius: var(--r); }
.ds-row.dark { background: var(--grad-hero); }
.ds-row.light { background: var(--soft); }
.ds-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; align-items: start; }

/* ---------- Responsive ---------- */
@media (max-width: 1024px) {
  .nav-links { gap: 20px; }
  .hero-grid, .pkg-hero-grid, .meet { grid-template-columns: 1fr; gap: 44px; }
  .monthly { grid-template-columns: 1fr 1fr; }
  .reviews-grid { grid-template-columns: 1fr 1fr; }
  .score { grid-column: 1 / -1; }
  .foot-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 860px) {
  .nav-links, .nav-cta { display: none; }
  .menu-btn { display: block; }
  .nav.open .nav-links {
    display: grid; position: absolute; top: 84px; left: 0; right: 0; background: var(--navy-950);
    padding: 12px 24px 24px; gap: 4px;
  }
  .nav.open .nav-links a { display: block; padding: 12px 0; font-size: 16px; }
  .problems, .packages, .steps, .compare, .fit-grid { grid-template-columns: 1fr; }
  .steps { gap: 36px; }
  .steps::before { display: none; }
  .pkg.featured { transform: none; }
  .unstuck { grid-template-columns: 1fr; text-align: left; padding: 28px; gap: 20px; }
}
@media (max-width: 600px) {
  .wrap { padding: 0 16px; }
  .section { padding: 64px 0; }
  .hero { padding: 48px 0 64px; }
  .hero h1 { min-height: 0; }
  .hero-sub { font-size: 16px; }
  .hero-actions .btn { flex: 1 1 100%; }
  .picker { padding: 22px; }
  .trust ul { gap: 14px 22px; justify-content: flex-start; }
  .reviews-grid, .monthly, .foot-grid, .q-row { grid-template-columns: 1fr; }
  .compare > div, .fit, .qualify-box { padding: 28px 22px; }
  .tl { grid-template-columns: 1fr; gap: 6px; }
  .logo img { height: 38px; }
  .badges { gap: 20px; }
  .badges img { height: 36px; }
}
@media (max-width: 1024px) {
  .about-hero, .discuss, .contact-grid, .article-wrap { grid-template-columns: 1fr; }
  .aside-stick { position: static; }
  .swatches { grid-template-columns: repeat(3, 1fr); }
  .ds-cards, .services-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 860px) {
  .booker, .states, .split-photos { grid-template-columns: 1fr; }
  .booker-info { border-right: 0; border-bottom: 1px solid var(--line); }
}
@media (max-width: 600px) {
  .cta-band, .takeaway, .state, .booker-info, .booker-cal, .check-box { padding: 28px 22px; }
  .award-strip { padding: 26px 22px; }
  .services-grid, .ds-cards, .swatches { grid-template-columns: 1fr; }
  .type-row { grid-template-columns: 1fr; gap: 4px; }
  .author-box { grid-template-columns: 1fr; }
  .check-box { margin-top: -40px; }
  .slots { grid-template-columns: 1fr 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; scroll-behavior: auto !important; }
}

/* ==========================================================================
   Brand refresh (v4), applied to every page. From the design research:
   flat brand colour instead of gradients, smaller radii, no pill badges,
   no uppercase eyebrow labels, no icon tiles, darker teal for text on white.
   ========================================================================== */
:root {
  --grad-hero: linear-gradient(#181c3e, #181c3e);
  --grad-card: linear-gradient(#181c3e, #181c3e);
  --grad-teal: linear-gradient(#52c1ca, #52c1ca);
  --r-sm: 6px; --r: 8px; --r-lg: 12px;
  --shadow: 0 1px 2px rgba(24,28,62,.05), 0 8px 24px rgba(24,28,62,.06);
}
.btn { border-radius: 8px; }
.btn-teal { box-shadow: none; }
.hero::after { display: none; }
.hl { color: var(--teal-600); }
.hero .hl, .hero h1 .hl, .pkg-hero .hl, .page-hero .hl, .compare .fractional .hl { color: var(--teal-300); }

/* Eyebrows become plain sentence-case labels */
.eyebrow { text-transform: none; letter-spacing: 0; font-size: 15px; font-weight: 600; }

/* Pills become a short teal rule plus text */
.pill { border: 0; border-radius: 0; padding: 0; text-transform: none; letter-spacing: 0; font-size: 15px; font-weight: 500; color: var(--teal-300); display: inline-flex; align-items: center; gap: 12px; }
.pill::before { content: ""; width: 28px; height: 2px; background: var(--teal-500); }

/* Icon tiles become plain teal text */
.month-card .ico, .step-num b, .unstuck-badge { background: none; box-shadow: none; }
.month-card .ico { width: auto; height: auto; display: block; color: var(--teal-600); font-size: 15px; margin-bottom: 10px; border-radius: 0; }
.month-card { box-shadow: none; border-color: var(--line); }
.step-num { background: none; box-shadow: none; width: auto; height: auto; margin-bottom: 12px; }
.step-num b { color: var(--teal-600); width: auto; height: auto; font-size: 30px; }
.steps::before { display: none; }

/* Cards: flatter and quieter */
.problem { box-shadow: none; }
.pkg, .price-card, .qualify-box, .check-box, .booker, .side-card, .state.notyet { box-shadow: 0 1px 2px rgba(24,28,62,.05), 0 10px 28px rgba(24,28,62,.07); }
.pkg.featured { transform: none; }
.picker { backdrop-filter: none; -webkit-backdrop-filter: none; background: rgba(255,255,255,.06); box-shadow: none; }
.unstuck { border-style: solid; border-color: #cdecef; }
.unstuck-badge { background: var(--navy-950); color: var(--white); }
.check-cta { background: var(--teal-500); }
.result .score-ring { background: conic-gradient(var(--teal-600) var(--p, 70%), var(--soft) 0); }
.progress i { background: var(--teal-500); }

/* Six-item menu (Insights added 4 Nov): keep labels on one line, tighten on smaller laptops,
   and switch to the menu button before the links can wrap. */
.nav-links a { white-space: nowrap; }
@media (max-width: 1280px) { .nav-links { gap: 20px; } .nav-links a { font-size: 13.5px; } }
@media (max-width: 1120px) {
  .nav-links, .nav-cta { display: none; }
  .menu-btn { display: block; }
  .nav.open .nav-links { display: grid; position: absolute; top: 84px; left: 0; right: 0; background: var(--navy-950); padding: 12px 24px 24px; gap: 4px; }
  .nav.open .nav-links a { display: block; padding: 12px 0; font-size: 16px; }
}

/* Homepage option B: its own layout. Brand gradients (navy, indigo, deep teal, teal), frosted glass,
   bento problem grid, dark pricing stage. Loads after styles.css only. */

body.b {
  --mesh:
    radial-gradient(60% 75% at 88% 8%, rgba(82,193,202,.55), transparent 60%),
    radial-gradient(55% 65% at 6% 96%, rgba(40,45,114,.95), transparent 65%),
    radial-gradient(45% 55% at 55% 55%, rgba(31,90,114,.55), transparent 70%),
    #181c3e;
  --mesh-light:
    radial-gradient(40% 55% at 95% 5%, rgba(82,193,202,.22), transparent 70%),
    radial-gradient(40% 55% at 2% 95%, rgba(40,45,114,.10), transparent 70%),
    #f6f8fb;
  --g-teal: linear-gradient(135deg, #8adde2 0%, #52c1ca 45%, #2f9ea8 100%);
  --g-text: linear-gradient(95deg, #b5ecef 0%, #52c1ca 55%, #e3f8f9 100%);
  --g-ink: linear-gradient(95deg, #181c3e, #2f3a8a);
  --glass: rgba(255,255,255,.08);
  --glass-line: rgba(255,255,255,.16);
  --glass-light: rgba(255,255,255,.74);
  --hair: #e3e8f1;
  --ink-2: #4b5068;
  --pen: #e0675f;
  background: var(--white);
}
body.b .wrap { max-width: 1180px; }
.glass { background: var(--glass); border: 1px solid var(--glass-line); backdrop-filter: blur(18px) saturate(150%); -webkit-backdrop-filter: blur(18px) saturate(150%); }
.glass-light { background: var(--glass-light); border: 1px solid rgba(255,255,255,.95); backdrop-filter: blur(16px) saturate(150%); -webkit-backdrop-filter: blur(16px) saturate(150%); }
.g-text { background: var(--g-text); -webkit-background-clip: text; background-clip: text; color: transparent; }
.g-ink { background: var(--g-ink); -webkit-background-clip: text; background-clip: text; color: transparent; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Header and buttons */
body.b .site-header { background: rgba(24,28,62,.9); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border-bottom: 1px solid rgba(255,255,255,.08); }
body.b .btn { border-radius: 999px; }
body.b .btn-teal, body.b .nav-cta { background: var(--g-teal); color: var(--navy-950); box-shadow: 0 10px 30px rgba(82,193,202,.4); }
body.b .btn-glass { background: var(--glass); border: 1px solid var(--glass-line); color: var(--white); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
body.b .btn-glass:hover { background: rgba(255,255,255,.16); }
body.b .btn-ink { background: var(--g-ink); color: var(--white); }
.chip { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px; font-size: 13.5px; font-weight: 500; }

/* Section scaffolding */
.x-sec { padding: 112px 0; position: relative; }
.x-head { max-width: 720px; }
.x-head.center { margin: 0 auto; text-align: center; }
.x-kick { display: inline-block; font-size: 14px; font-weight: 600; color: var(--teal-600); margin-bottom: 14px; }
.on-dark .x-kick { color: var(--teal-300); }
.x-title { font-size: clamp(32px, 4vw, 52px); font-weight: 700; line-height: 1.06; letter-spacing: -.03em; }
.x-lead { font-size: 18px; color: var(--ink-2); margin-top: 16px; }
.on-dark .x-lead { color: rgba(255,255,255,.75); }

/* ---------- 1. Hero ---------- */
.x-hero { background: var(--mesh); color: var(--white); overflow: hidden; position: relative; isolation: isolate; }
.x-hero::after { content: ""; position: absolute; width: 640px; height: 640px; right: -180px; top: -240px; border-radius: 50%; background: radial-gradient(circle, rgba(82,193,202,.45), transparent 65%); filter: blur(30px); z-index: -1; animation: drift 16s ease-in-out infinite alternate; }
@keyframes drift { to { transform: translate(-140px, 160px) scale(1.12); } }
.x-hero-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 56px; align-items: center; padding: 96px 24px 120px; }
.x-hero .who { margin-bottom: 26px; color: rgba(255,255,255,.88); }
.x-hero .who i { width: 8px; height: 8px; border-radius: 50%; background: var(--teal-300); box-shadow: 0 0 12px var(--teal-300); }
.x-hero h1 { font-size: clamp(46px, 6.2vw, 84px); font-weight: 700; line-height: 1.06; letter-spacing: -.04em; }
.x-hero .intro { font-size: 18.5px; font-weight: 300; line-height: 1.65; color: rgba(255,255,255,.8); margin-top: 28px; max-width: 540px; }
.x-hero .intro b { color: var(--white); font-weight: 600; }
.x-hero .acts { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 36px; }
.x-hero .acts .btn { padding: 17px 28px; }
.x-hero .sub { margin-top: 22px; font-size: 14.5px; color: rgba(255,255,255,.65); }
.x-hero .sub b { color: var(--white); font-weight: 600; }

.x-stage { position: relative; height: 600px; }
.x-stage .ph { position: absolute; right: 0; top: 0; width: 78%; height: 100%; border-radius: 32px; overflow: hidden; box-shadow: 0 0 0 1px rgba(255,255,255,.14), 0 40px 90px rgba(0,0,0,.35); }
.x-stage .ph img { width: 100%; height: 100%; object-fit: cover; object-position: center 10%; }
.x-stage .ph::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, rgba(24,28,62,.55)); }
.x-stage .name { position: absolute; right: 24px; bottom: 24px; z-index: 2; text-align: right; font-size: 14px; color: rgba(255,255,255,.85); }
.x-stage .name b { display: block; font-size: 17px; color: var(--white); }
.x-card { position: absolute; z-index: 3; border-radius: 22px; padding: 20px 22px; color: var(--white); box-shadow: 0 24px 60px rgba(0,0,0,.25); }
.x-card small { display: block; font-size: 12.5px; color: rgba(255,255,255,.65); }
.x-card .row2 { display: flex; justify-content: space-between; gap: 18px; align-items: baseline; margin-top: 8px; }
.x-card .row2 span { font-size: 13.5px; color: rgba(255,255,255,.75); }
.x-card .row2 b { font-size: 22px; font-weight: 700; letter-spacing: -.02em; font-variant-numeric: tabular-nums; position: relative; }
.x-cash { left: 0; top: 70px; width: 270px; }
.x-cash .row2 + .row2 { border-top: 1px solid rgba(255,255,255,.14); padding-top: 10px; }
.x-cash .row2 b svg { position: absolute; inset: -10px -14px -8px -14px; width: calc(100% + 28px); height: calc(100% + 18px); color: var(--pen); overflow: visible; }
.x-session { left: 30px; bottom: 96px; display: flex; gap: 16px; align-items: center; padding: 16px 20px; }
.x-session .t { font-size: 34px; font-weight: 700; line-height: 1; }
.x-session .t small { font-size: 13px; font-weight: 500; color: rgba(255,255,255,.7); display: block; }
.x-session p { font-size: 14px; color: rgba(255,255,255,.85); max-width: 150px; line-height: 1.35; }

/* ---------- 2. Proof strip ---------- */
.x-proof { margin-top: -56px; position: relative; z-index: 4; }
.x-proof-card { border-radius: 26px; padding: 26px 34px; display: grid; grid-template-columns: auto 1fr auto auto auto; gap: 34px; align-items: center; box-shadow: 0 30px 70px rgba(24,28,62,.14); }
.x-proof-card .stars { color: var(--star); font-size: 18px; letter-spacing: 2px; }
.x-proof-card .big { font-size: 34px; font-weight: 700; line-height: 1; }
.x-proof-card .lab { font-size: 13.5px; color: var(--ink-2); }
.x-proof-card .sep { width: 1px; height: 44px; background: var(--hair); }
.x-proof-card img { height: 40px; width: auto; }

/* ---------- 3. Bento of problems ---------- */
.x-bento-sec { background: var(--mesh-light); padding-top: 140px; margin-top: -60px; }
.x-bento-top { display: grid; grid-template-columns: 1fr auto; gap: 40px; align-items: end; margin-bottom: 40px; }
.bento { display: grid; grid-template-columns: repeat(6, 1fr); grid-auto-rows: minmax(170px, auto); gap: 16px; }
.tile {
  position: relative; text-align: left; font: inherit; color: inherit; cursor: pointer; border-radius: 26px; padding: 26px;
  display: flex; flex-direction: column; justify-content: space-between; gap: 20px; transition: transform .2s, box-shadow .2s;
  box-shadow: 0 12px 34px rgba(24,28,62,.07);
}
.tile:hover { transform: translateY(-3px); box-shadow: 0 20px 44px rgba(24,28,62,.12); }
.tile q { quotes: "“" "”"; font-size: clamp(18px, 1.7vw, 22px); font-weight: 600; line-height: 1.35; letter-spacing: -.01em; }
.tile .meta { display: flex; justify-content: space-between; align-items: center; font-size: 13.5px; color: var(--ink-2); }
.tile .tk { width: 30px; height: 30px; border-radius: 50%; border: 1.5px solid #c3cbdc; display: grid; place-items: center; flex: none; transition: all .2s; }
.tile .tk svg { width: 16px; height: 16px; opacity: 0; color: var(--white); }
.tile[aria-pressed="true"] { box-shadow: 0 0 0 2px var(--teal-500), 0 20px 44px rgba(82,193,202,.25); }
.tile[aria-pressed="true"] .tk { background: var(--g-teal); border-color: transparent; }
.tile[aria-pressed="true"] .tk svg { opacity: 1; color: var(--navy-950); }
.t1 { grid-column: span 3; grid-row: span 2; background: var(--mesh); color: var(--white); border: 0; }
.t1 q { font-size: clamp(26px, 2.8vw, 38px); line-height: 1.15; }
.t1 .meta { color: rgba(255,255,255,.7); }
.t1 .tk { border-color: rgba(255,255,255,.4); }
.t1 .big-n { font-size: 15px; color: var(--teal-300); font-weight: 600; }
.t2, .t3 { grid-column: span 3; }
.t4, .t5, .t6 { grid-column: span 2; }
.t3 { background: var(--g-teal); border: 0; color: var(--navy-950); }
.t3 .meta { color: #164552; }
.t3 .tk { border-color: rgba(24,28,62,.35); }
.x-tally {
  position: sticky; bottom: 20px; z-index: 5; margin-top: 22px; border-radius: 999px; padding: 12px 12px 12px 26px;
  display: flex; align-items: center; gap: 20px; justify-content: space-between; box-shadow: 0 20px 50px rgba(24,28,62,.18);
}
.x-tally p { font-size: 15.5px; color: var(--ink-2); }
.x-tally p b { color: var(--navy-950); }
.x-tally .n { font-weight: 700; font-size: 22px; color: var(--navy-950); margin-right: 10px; }

/* ---------- 4. Profit vs cash band ---------- */
.x-gap { background: var(--mesh); color: var(--white); overflow: hidden; isolation: isolate; }
.x-gap-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 64px; align-items: center; }
.gap-vis { border-radius: 30px; padding: 36px; }
.gap-vis .lbl { font-size: 13.5px; color: rgba(255,255,255,.65); }
.gap-row { display: grid; grid-template-columns: 150px 1fr auto; gap: 18px; align-items: center; margin-top: 22px; }
.gap-row span { font-size: 14.5px; color: rgba(255,255,255,.8); }
.gap-row .bar { height: 14px; border-radius: 10px; background: rgba(255,255,255,.08); overflow: hidden; }
.gap-row .bar i { display: block; height: 100%; border-radius: 10px; }
.gap-row.p .bar i { width: 100%; background: var(--g-teal); }
.gap-row.c .bar i { width: 2%; min-width: 8px; background: var(--pen); }
.gap-row b { font-size: 26px; font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.gap-row.c b { color: #ff8d85; }
.gap-vis .note { margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--glass-line); display: flex; justify-content: space-between; font-size: 13px; color: rgba(255,255,255,.6); }
.gap-vis .note em { font-style: normal; color: #ff8d85; font-weight: 600; }
.causes { display: flex; flex-wrap: wrap; gap: 10px; margin: 26px 0 30px; }
.causes span { padding: 10px 16px; border-radius: 999px; font-size: 14.5px; color: rgba(255,255,255,.9); }
.x-gap .b-link { color: var(--teal-300); font-weight: 600; text-underline-offset: 4px; }

/* ---------- 5. Pricing stage ---------- */
.x-price { background: var(--mesh-light); }
.x-price-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-top: 56px; align-items: stretch; }
.p-card { border-radius: 30px; padding: 36px 32px; display: flex; flex-direction: column; background: var(--white); border: 1px solid var(--hair); box-shadow: 0 16px 44px rgba(24,28,62,.07); position: relative; }
.p-card .lvl { display: flex; gap: 6px; margin-bottom: 20px; }
.p-card .lvl i { width: 30px; height: 6px; border-radius: 6px; background: #e3e8f1; }
.p-card .lvl i.on { background: var(--g-teal); }
.p-card h3 { font-size: 24px; font-weight: 700; letter-spacing: -.015em; }
.p-card .what { color: var(--ink-2); font-size: 15px; margin-top: 10px; min-height: 68px; }
.p-card .amt { margin-top: 26px; font-size: 50px; font-weight: 700; letter-spacing: -.035em; line-height: 1; font-variant-numeric: tabular-nums; }
.p-card .amt small { margin-right: 6px; }
.p-card .per { font-size: 13.5px; color: var(--ink-2); margin-top: 6px; }
.p-card ul { list-style: none; padding: 0; margin: 26px 0 30px; display: grid; gap: 12px; }
.p-card li { display: flex; gap: 12px; font-size: 15px; }
.p-card li svg { flex: none; width: 20px; height: 20px; margin-top: 1px; }
.p-card .btn { margin-top: auto; }
.p-card.hot { background: var(--mesh); color: var(--white); border: 0; box-shadow: 0 40px 90px rgba(24,28,62,.35); transform: scale(1.04); z-index: 2; }
.p-card.hot::before { content: ""; position: absolute; inset: -1.5px; border-radius: 31px; padding: 1.5px; background: linear-gradient(160deg, #8adde2, rgba(82,193,202,0) 40%, rgba(82,193,202,.6)); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; }
.p-card.hot .what, .p-card.hot .per { color: rgba(255,255,255,.72); }
.p-card.hot .lvl i { background: rgba(255,255,255,.18); }
.p-card.hot .lvl i.on { background: var(--g-teal); }
.p-card .badge { position: absolute; top: 26px; right: 26px; font-size: 12.5px; color: var(--navy-950); background: var(--g-teal); }
.x-session-bar { margin-top: 30px; border-radius: 999px; padding: 14px 14px 14px 30px; display: flex; align-items: center; justify-content: space-between; gap: 24px; background: var(--g-ink); color: var(--white); box-shadow: 0 24px 60px rgba(24,28,62,.25); }
.x-session-bar b { font-size: 18px; }
.x-session-bar span { color: rgba(255,255,255,.75); font-size: 15px; }
.x-session-bar .amt { font-size: 26px; font-weight: 700; margin-left: auto; white-space: nowrap; }
.x-vs { text-align: center; margin-top: 22px; font-size: 14.5px; color: var(--ink-2); }

/* ---------- 6. Meet Hayley ---------- */
.x-meet-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.x-meet-ph { position: relative; isolation: isolate; }
.x-meet-ph::before { content: ""; position: absolute; inset: 8% -6% -6% 8%; border-radius: 40px; background: var(--g-teal); z-index: -1; filter: blur(2px); opacity: .9; }
.x-meet-ph img { width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: center 15%; border-radius: 32px; }
.x-meet-ph .aw { position: absolute; left: -22px; bottom: 32px; border-radius: 20px; padding: 14px 18px 14px 14px; display: flex; gap: 12px; align-items: center; box-shadow: 0 20px 50px rgba(24,28,62,.2); }
.x-meet-ph .aw img { width: 110px; height: 40px; object-fit: cover; border-radius: 10px; aspect-ratio: auto; }
.x-meet-ph .aw b { display: block; font-size: 14px; }
.x-meet-ph .aw small { font-size: 12.5px; color: var(--ink-2); }
.x-quote { font-size: clamp(22px, 2.4vw, 30px); font-weight: 600; line-height: 1.3; letter-spacing: -.015em; margin: 26px 0 22px; }
.x-meet p { color: var(--ink-2); font-size: 17px; line-height: 1.7; margin-bottom: 14px; }
.x-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 30px 0; }
.x-stats div { border-radius: 20px; padding: 18px; background: var(--mesh-light); border: 1px solid var(--hair); }
.x-stats b { display: block; font-size: 28px; font-weight: 700; letter-spacing: -.03em; }
.x-stats span { font-size: 13px; color: var(--ink-2); }

/* ---------- 7. Reviews ---------- */
.x-rev { background: var(--mesh); color: var(--white); overflow: hidden; isolation: isolate; }
.x-rev-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 48px; }
.x-rev figure { margin: 0; border-radius: 26px; padding: 30px; display: flex; flex-direction: column; gap: 18px; }
.x-rev figure:nth-child(2) { transform: translateY(28px); }
.x-rev .stars { color: var(--star); letter-spacing: 2px; }
.x-rev p { font-size: 16.5px; line-height: 1.6; color: rgba(255,255,255,.9); }
.x-rev cite { margin-top: auto; font-style: normal; display: flex; gap: 12px; align-items: center; font-size: 14px; font-weight: 600; }
.x-rev cite i { width: 40px; height: 40px; border-radius: 50%; background: var(--g-teal); color: var(--navy-950); display: grid; place-items: center; font-style: normal; }
.x-rev cite small { display: block; font-weight: 400; color: rgba(255,255,255,.6); }

/* ---------- 8. Journey ---------- */
.journey { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; margin-top: 56px; position: relative; }
.journey::before { content: ""; position: absolute; top: 28px; left: 8%; right: 8%; height: 3px; border-radius: 3px; background: linear-gradient(90deg, #52c1ca, #282d72); }
.journey div { position: relative; text-align: center; padding: 0 12px; }
.journey b { width: 58px; height: 58px; margin: 0 auto 22px; border-radius: 50%; display: grid; place-items: center; background: var(--g-ink); color: var(--white); font-size: 18px; box-shadow: 0 0 0 8px #fff, 0 12px 30px rgba(24,28,62,.25); position: relative; }
.journey h3 { font-size: 19px; font-weight: 600; }
.journey p { color: var(--ink-2); font-size: 15px; margin-top: 8px; }

/* ---------- 9. FAQ ---------- */
.x-faq { background: var(--mesh-light); }
.x-faq-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 64px; align-items: start; }
.x-faq details { border-radius: 20px; padding: 22px 26px; margin-bottom: 12px; background: var(--white); border: 1px solid var(--hair); box-shadow: 0 8px 24px rgba(24,28,62,.04); }
.x-faq details[open] { box-shadow: 0 0 0 2px rgba(82,193,202,.5), 0 14px 34px rgba(24,28,62,.08); }
.x-faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 20px; font-weight: 600; font-size: 17.5px; }
.x-faq summary::-webkit-details-marker { display: none; }
.x-faq summary::after { content: "+"; flex: none; width: 28px; height: 28px; border-radius: 50%; background: var(--g-teal); color: var(--navy-950); display: grid; place-items: center; font-size: 18px; transition: transform .2s; }
.x-faq details[open] summary::after { transform: rotate(45deg); }
.x-faq details p { color: var(--ink-2); margin-top: 12px; line-height: 1.7; }
.x-faq .b-link { color: var(--teal-600); font-weight: 600; }

/* ---------- 10. Final ---------- */
.x-final { background: var(--mesh); color: var(--white); text-align: center; overflow: hidden; isolation: isolate; }
.x-final::after { content: ""; position: absolute; width: 700px; height: 700px; left: 50%; top: -400px; transform: translateX(-50%); border-radius: 50%; background: radial-gradient(circle, rgba(82,193,202,.4), transparent 65%); z-index: -1; }
.x-final h2 { font-size: clamp(38px, 5.4vw, 76px); font-weight: 700; line-height: 1.02; letter-spacing: -.04em; max-width: 900px; margin: 0 auto; }
.x-final p { font-size: 19px; color: rgba(255,255,255,.75); max-width: 560px; margin: 22px auto 36px; }
.x-final .acts { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.x-final .acts .btn { padding: 18px 30px; }

/* Mobile sticky bar */
.m-bar { display: none; }

/* Capture mode (?capture): screenshots and PDF. Very tall pages break blur layers in headless browsers. */
html.capture * { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; animation: none !important; }
html.capture .glass { background: rgba(24,28,62,.62); }
html.capture .glass-light { background: rgba(255,255,255,.92); }

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
  .x-hero-grid { grid-template-columns: 1fr; padding: 64px 24px 110px; }
  .x-stage { height: 560px; max-width: 560px; }
  .x-proof-card { grid-template-columns: 1fr 1fr; gap: 20px 28px; }
  .x-proof-card .sep { display: none; }
  .x-gap-grid, .x-meet-grid, .x-faq-grid { grid-template-columns: 1fr; gap: 48px; }
  .x-meet-ph { max-width: 480px; }
}
@media (max-width: 860px) {
  .bento { grid-template-columns: 1fr 1fr; }
  .t1, .t2, .t3 { grid-column: span 2; grid-row: auto; }
  .t4, .t5 { grid-column: span 1; }
  .t6 { grid-column: span 2; }
  .x-price-grid, .x-rev-grid, .journey { grid-template-columns: 1fr; }
  .p-card.hot { transform: none; }
  .p-card .what { min-height: 0; }
  .x-rev figure:nth-child(2) { transform: none; }
  .journey::before { top: 0; bottom: 0; left: 28px; right: auto; width: 3px; height: auto; background: linear-gradient(180deg, #52c1ca, #282d72); }
  .journey div { text-align: left; padding-left: 84px; min-height: 58px; }
  .journey b { position: absolute; left: 0; top: 0; margin: 0; }
  .x-session-bar { border-radius: 24px; flex-wrap: wrap; padding: 22px 24px; }
  .x-session-bar .amt { margin-left: 0; }
  .x-bento-top { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  body.b { padding-bottom: 82px; }
  .m-bar { display: flex; gap: 10px; position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); background: rgba(255,255,255,.82); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border-top: 1px solid rgba(255,255,255,.9); }
  .m-bar .btn { flex: 1; min-height: 50px; padding: 14px 10px; font-size: 14.5px; }
  html.capture .m-bar { background: rgba(255,255,255,.96); }
  .x-tally { bottom: 96px; }
}
@media (max-width: 600px) {
  .x-sec { padding: 72px 0; }
  .x-hero-grid { padding: 40px 16px 96px; }
  .x-hero h1 { font-size: 44px; }
  .x-hero .intro { font-size: 16.5px; }
  .x-hero .acts .btn { width: 100%; }
  .x-stage { height: 470px; }
  .x-stage .ph { width: 86%; border-radius: 26px; }
  .x-cash { width: 220px; top: 30px; padding: 16px; }
  .x-card .row2 b { font-size: 18px; }
  .x-session { left: 0; bottom: 24px; }
  .x-stage .name { display: none; } /* the £150 card sits here on phones; the photo alt text carries her name */
  .x-proof-card { grid-template-columns: 1fr; padding: 24px; border-radius: 22px; }
  .x-bento-sec { padding-top: 120px; }
  .bento { grid-template-columns: 1fr; }
  .t1, .t2, .t3, .t4, .t5, .t6 { grid-column: auto; }
  .tile { min-height: 150px; }
  .x-tally { border-radius: 22px; flex-wrap: wrap; padding: 16px 18px; }
  .x-tally .btn { width: 100%; }
  .gap-vis { padding: 24px 20px; }
  .gap-row { grid-template-columns: 1fr auto; }
  .gap-row .bar { grid-column: 1 / -1; grid-row: 2; }
  .p-card { padding: 30px 24px; }
  .x-stats { grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
  .x-stats div { padding: 14px 10px; }
  .x-stats b { font-size: 22px; }
  .x-meet-ph .aw { left: 12px; right: 12px; bottom: 16px; }
  .x-final h2 { font-size: 40px; }
}
@media (prefers-reduced-motion: reduce) { .x-hero::after { animation: none; } }


/* Enquiry assistant and cookie banner */

.hs-chat{position:fixed;right:20px;bottom:20px;z-index:80;font-family:Poppins,sans-serif}
.hs-btn{display:flex;align-items:center;gap:10px;border:0;cursor:pointer;padding:14px 20px;border-radius:999px;background:linear-gradient(135deg,#8adde2,#52c1ca 45%,#2f9ea8);color:#181c3e;font:600 15px Poppins,sans-serif;box-shadow:0 14px 36px rgba(24,28,62,.3)}
.hs-btn svg{width:22px;height:22px}
.hs-panel{position:absolute;right:0;bottom:66px;width:370px;max-width:calc(100vw - 32px);border-radius:24px;overflow:hidden;background:#fff;box-shadow:0 30px 80px rgba(24,28,62,.3);border:1px solid #e3e8f1}
.hs-head{display:flex;gap:12px;align-items:center;padding:16px 18px;color:#fff;background:radial-gradient(60% 90% at 90% 0%,rgba(82,193,202,.55),transparent 60%),#181c3e}
.hs-head img{width:34px;height:34px;padding:7px;border-radius:50%;background:rgba(255,255,255,.12);filter:brightness(0) invert(1)}
.hs-head b{display:block;font-size:15px}.hs-head small{font-size:12px;color:rgba(255,255,255,.7)}
.hs-x{margin-left:auto;background:none;border:0;color:#fff;font-size:24px;cursor:pointer;line-height:1}
.hs-body{padding:16px;display:grid;gap:10px;max-height:340px;overflow:auto;background:#f6f8fb}
.hs-msg{max-width:86%;padding:11px 14px;border-radius:16px;font-size:13.5px;line-height:1.5}
.hs-msg.bot{background:#fff;border:1px solid #e3e8f1;color:#181c3e;border-bottom-left-radius:4px}
.hs-msg.me{justify-self:end;background:#181c3e;color:#fff;border-bottom-right-radius:4px}
.hs-acts{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.hs-acts a{font-size:12.5px;font-weight:600;padding:7px 11px;border-radius:999px;text-decoration:none;background:#ecf8f9;color:#1a7f88}
.hs-input{display:flex;gap:8px;padding:12px;border-top:1px solid #e3e8f1}
.hs-input input{flex:1;border:1px solid #e3e8f1;border-radius:999px;padding:10px 14px;font:14px Poppins,sans-serif}
.hs-input button{width:40px;height:40px;border:0;border-radius:50%;background:#181c3e;color:#fff;cursor:pointer;font-size:16px}
.hs-note{font-size:11.5px;color:#5f6480;padding:0 14px 12px;margin:0}.hs-note a{color:#1a7f88}
.hs-cookie{position:fixed;left:20px;bottom:20px;z-index:79;max-width:460px;display:flex;flex-direction:column;gap:14px;padding:20px 22px;border-radius:22px;background:rgba(255,255,255,.96);border:1px solid #e3e8f1;box-shadow:0 24px 60px rgba(24,28,62,.2);font-family:Poppins,sans-serif}
.hs-cookie p{font-size:14px;color:#4b5068;line-height:1.55;margin:0}.hs-cookie b{color:#181c3e;margin-right:6px}.hs-cookie a{color:#1a7f88;font-weight:600}
.hs-cookie div{display:flex;gap:10px;justify-content:flex-end}.hs-cookie .btn{padding:11px 20px;font-size:14px;border-radius:999px}
@media (max-width:760px){.hs-chat{bottom:88px;right:12px;display:none}html.hs-scrolled:not(.hs-banner) .hs-chat{display:block}.hs-btn span{display:none}.hs-btn{padding:14px}.hs-cookie{left:0;right:0;bottom:0;max-width:none;border-radius:22px 22px 0 0;padding:16px 16px calc(16px + env(safe-area-inset-bottom));z-index:81}.hs-cookie div{flex-wrap:wrap}.hs-cookie .btn{flex:1}html.hs-banner .m-bar{display:none}}
html.capture .hs-chat, html.capture .hs-cookie{display:none}
/* ==========================================================================
   Elementor compatibility. Each design section sits in one full-width
   Elementor container holding one HTML widget; strip Elementor's spacing.
   ========================================================================== */
body { margin: 0; }
:root { --kit-widget-spacing: 0px; }
.elementor .e-con.hs-sec, .elementor .e-con.hs-sec > .e-con-inner { padding: 0 !important; gap: 0 !important; max-width: none !important; width: 100%; }
.elementor .e-con.hs-sec { --padding-top: 0px; --padding-bottom: 0px; --padding-left: 0px; --padding-right: 0px; --gap: 0px; --row-gap: 0px; --column-gap: 0px; --display: block; }
.elementor .hs-sec > .elementor-element, .elementor .hs-sec .elementor-widget-html, .elementor .hs-sec .elementor-widget-container { width: 100%; max-width: none; margin: 0 !important; }
/* The design's sections are siblings: the positioned hero paints over the next section's pulled-up background.
   Elementor's positioned wrappers would reverse that, so they stay out of the stacking order. */
.elementor .e-con.hs-sec, .elementor .hs-sec > .elementor-element { position: static; z-index: auto; }
.elementor-widget:not(:last-child) { margin-block-end: 0; }
.elementor-page .site-main, .elementor-page .page-content { margin: 0; padding: 0; max-width: none; }
img { height: auto; }

/* Reviews: the rating reads as text, each card opens the review on Google, and a bar links to all reviews */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.x-rev figure { position: relative; transition: border-color .2s ease, background-color .2s ease; }
.x-rev .rev-top { display: flex; align-items: center; gap: 10px; }
.x-rev .rate { font-size: 13px; font-weight: 600; color: rgba(255,255,255,.75); }
.x-rev .rev-go { margin-left: auto; align-self: center; font-size: 13px; font-weight: 600; color: var(--teal-300); text-decoration: none; white-space: nowrap; }
.x-rev .rev-go::after { content: ""; position: absolute; inset: 0; border-radius: 26px; }
.x-rev figure:hover { border-color: rgba(143,216,222,.55); }
.x-rev figure:hover .rev-go { text-decoration: underline; }
.x-rev .rev-go:focus-visible { outline: none; }
.x-rev .rev-go:focus-visible::after { outline: 2px solid var(--teal-300); outline-offset: 3px; }
.rev-more { margin-top: 68px; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 12px 20px; text-align: center; }
.rev-more .stars { color: var(--star); letter-spacing: 2px; font-size: 18px; }
.rev-more p { font-size: 15.5px; color: rgba(255,255,255,.85); }
.rev-more p b { color: var(--white); font-weight: 600; }
@media (max-width: 860px) { .rev-more { margin-top: 36px; } }
/* Proof strip: Google rating and reviewer name link to the Google profile */
.x-proof-card a.proof-g { display: block; color: inherit; text-decoration: none; }
.x-proof-card a.proof-g .stars, .x-proof-card a.proof-g .lab { display: block; }
.x-proof-card a.proof-g:hover .lab, .x-proof-card a.proof-g:focus-visible .lab { color: var(--navy-950); text-decoration: underline; text-underline-offset: 3px; }
.x-proof-card a.proof-src { color: inherit; text-decoration: none; }
.x-proof-card a.proof-src:hover b, .x-proof-card a.proof-src:focus-visible b { text-decoration: underline; text-underline-offset: 3px; }
.x-hero .sub a.sub-g { color: inherit; text-decoration: none; }
.x-hero .sub a.sub-g:hover, .x-hero .sub a.sub-g:focus-visible { text-decoration: underline; text-underline-offset: 3px; }