:root{
  --ink:#13223a;
  --navy:#0a1b31;
  --navy-2:#112846;
  --navy-3:#1b3558;
  --blue:#34529e;
  --icy:#98d7f9;
  --periwinkle:#9698e0;
  --blue-deep:#263f82;
  --blue-soft:#a9c8f2;
  --ivory:#fbf9f5;
  --cream:#f4efe6;
  --line:#d9dbe0;
  --muted:#5b6272;
  --white:#ffffff;
  --serif: Georgia, 'Times New Roman', serif;
  --sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --shadow:0 24px 70px rgba(10,27,49,.12);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:var(--ivory);font-family:var(--sans);line-height:1.55}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button,input,textarea{font:inherit}
.container{width:min(1180px,calc(100% - 40px));margin:0 auto}
.eyebrow{font-size:.72rem;text-transform:uppercase;letter-spacing:.16em;color:var(--blue-deep);font-weight:750}
.section-title{font-family:var(--serif);font-weight:500;font-size:clamp(2rem,4vw,3.25rem);line-height:1.08;margin:.4rem 0 1rem}
.section-copy{max-width:760px;color:var(--muted);font-size:1.02rem}
.gold-rule{width:52px;height:2px;background:linear-gradient(90deg,#7fc6f2,var(--blue) 55%,#6f73cf);margin:18px 0 22px}

.topbar{position:sticky;top:0;z-index:40;background:var(--navy);border-bottom:1px solid rgba(152,200,245,.14);color:#e6edf7}
.nav{height:92px;display:flex;align-items:center;gap:26px}
/* Anchored sections land below the sticky header (92px; 80px on phones). */
section[id]{scroll-margin-top:92px}
@media (max-width:620px){section[id]{scroll-margin-top:80px}}
.brand{display:flex;align-items:center;gap:13px;margin-right:auto}
/* Original Paradigm logo (navy-backed artwork, #0a1b31). The box crops the artwork's
   built-in padding; the navy around it matches var(--navy) exactly. */
.brand-logo{position:relative;display:block;width:122px;height:72px;overflow:hidden;flex-shrink:0}
.brand-logo img{position:absolute;left:-13.3%;top:-18.97%;width:126.6%;height:auto;max-width:none}
.footer .brand-logo{width:152px;height:90px}
.brand-mark{width:42px;height:42px;border:1px solid var(--blue);display:grid;place-items:center;font-family:var(--serif);font-size:1.65rem;color:var(--blue-deep)}
.brand-text strong{display:block;font-family:var(--serif);letter-spacing:.11em;font-weight:500;font-size:1.03rem}
.brand-text span{display:block;font-size:.58rem;letter-spacing:.28em;color:#636b7b}
.nav-links{display:flex;align-items:center;gap:27px;font-size:.84rem;font-weight:600}
.nav-links a{position:relative}
.nav-links a::after{content:"";position:absolute;left:0;right:100%;bottom:-7px;height:1px;background:var(--icy);transition:.25s}
.nav-links a:hover::after,.nav-links a.active::after{right:0}
.nav-cta{border:1px solid var(--blue-soft);padding:10px 15px;border-radius:4px;font-size:.78rem;font-weight:700;background:#fff}
.menu-btn{display:none;border:0;background:transparent;font-size:1.45rem;color:#e6edf7}

.hero{position:relative;min-height:690px;background:linear-gradient(135deg,var(--ivory) 0%,var(--cream) 100%);overflow:hidden}
.hero-inner{position:relative;z-index:2;padding:64px 0 70px}
.hero-heading{text-align:center;max-width:980px;margin:0 auto 18px}
.hero-heading h1{font-family:var(--serif);font-size:clamp(2.6rem,5.2vw,4.65rem);font-weight:500;line-height:1.02;margin:0;text-shadow:0 1px 20px rgba(255,255,255,.45)}
.hero-heading p{max-width:830px;margin:18px auto 0;font-size:1.02rem;color:#3a4252}
.hero-split{width:min(1280px,calc(100% - 40px));display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:48px;align-items:stretch;position:relative;z-index:2}
.hero-inner.hero-split{padding:48px 0 64px}
.hero-left{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding-bottom:80px}
.hero-left .eyebrow{font-size:.84rem;letter-spacing:.16em;line-height:1.4;max-width:40ch}
.hero-left h1{font-family:var(--serif);font-weight:500;line-height:1.06;letter-spacing:-.005em;margin:18px 0 0;max-width:100%;font-size:min(2.95rem,calc((min(1280px,100vw - 40px) - 48px) * .0378))}
.hero-left .gold-rule{width:52px;margin:22px auto 26px}
.hero-left p{max-width:45ch;margin:0 auto;font-size:1.1rem;line-height:1.6;color:#3a4252;text-wrap:pretty}
.hero-left .btn{padding:15px 28px;font-size:.95rem}
.hero-right{position:relative;align-self:center}
.hero-image{display:block;width:100%;max-width:500px;height:auto;aspect-ratio:784/1168;object-fit:contain;margin-left:auto;border-radius:14px;border:1px solid rgba(58,95,200,.28);background:var(--cream);box-shadow:var(--shadow)}
/* Hero video: the frame matches the 496x608 video (and its first-frame poster) exactly, so
   neither is ever cropped or stretched. */
.hero-video{aspect-ratio:496/608;object-fit:cover}
.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:48px auto 0;max-width:1050px;position:relative}
.choice-card{min-height:355px;padding:42px 44px 36px;background:rgba(255,255,255,.92);border:1px solid rgba(58,95,200,.58);border-radius:8px;text-align:center;box-shadow:var(--shadow);display:flex;flex-direction:column;align-items:center;justify-content:center}
.choice-card.dark{background:rgba(10,27,49,.95);color:#f4f7fb;border-color:var(--navy-3)}
.choice-icon{width:66px;height:66px;border:1px solid var(--blue);border-radius:50%;display:grid;place-items:center;color:var(--blue);margin-bottom:16px}
.choice-icon svg{width:31px;height:31px}
.choice-card h2{font-family:var(--serif);font-size:clamp(1.7rem,3vw,2.45rem);font-weight:500;line-height:1.12;margin:7px 0 15px}
.choice-card p{font-size:.94rem;max-width:430px;margin:0 auto 22px;color:#525a6c}
.choice-card.dark p{color:#cdd6e4}
.choice-label{font-size:.67rem;letter-spacing:.15em;text-transform:uppercase;color:var(--blue);font-weight:800}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:13px 22px;border-radius:3px;background:var(--blue);color:white;border:1px solid var(--blue);font-weight:750;font-size:.9rem;transition:.2s}
.btn:hover{transform:translateY(-1px);background:var(--blue-deep)}
.btn.secondary{background:transparent;color:var(--blue-deep)}
.dark .btn.secondary{color:#b9dcf7}
.choice-or{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--ivory);border:1px solid var(--blue-soft);font-family:var(--serif);z-index:5}

.trust-strip{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.trust-grid{display:grid;grid-template-columns:repeat(4,1fr);padding:18px 0}
.trust-item{display:flex;gap:13px;padding:7px 22px;border-right:1px solid var(--line);align-items:center}
.trust-item:last-child{border-right:0}
.trust-symbol{font-family:var(--serif);font-size:1.7rem;color:var(--blue-deep);width:38px;text-align:center}
.trust-item b{display:block;font-family:var(--serif);font-weight:500;font-size:1rem}
.trust-item span{display:block;color:var(--muted);font-size:.75rem;line-height:1.35}

.section{padding:84px 0}
.section.white{background:#fff}
.two-col{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.panel{background:#fff;border:1px solid var(--line);border-radius:10px;padding:34px;box-shadow:0 12px 30px rgba(10,27,49,.06)}
.panel.dark{background:var(--navy);color:#f4f7fb;border-color:var(--navy-3)}
.panel.dark .section-copy,.panel.dark p{color:#cdd6e4}
.checklist{display:grid;grid-template-columns:1fr 1fr;gap:13px 26px;padding:0;margin:24px 0 0;list-style:none}
.checklist li{position:relative;padding-left:25px;font-size:.91rem}
.checklist li::before{content:"✓";position:absolute;left:0;top:0;color:var(--blue);font-weight:800}

.standard-band{padding:66px 0;background:var(--navy);color:#f4f7fb;text-align:center}
.standard-band h2{font-family:var(--serif);font-size:clamp(2rem,4vw,3.2rem);font-weight:500;margin:0 auto 16px;max-width:940px}
.standard-band p{max-width:900px;margin:0 auto;color:#cdd6e4}
.standard-steps{margin:30px auto 0;display:flex;flex-wrap:wrap;justify-content:center;gap:8px;max-width:980px}
.standard-steps span{border:1px solid rgba(152,200,245,.35);padding:8px 11px;border-radius:99px;font-size:.75rem;color:#b9dcf7}
/* Comparison semicircle: the CTA sits at the top centre and the six held-constant topics
   hang below it in a 180-degree arc.
   Mobile first: CTA, then a stacked list; lines are hidden until the arc layout. */
/* Label above the diagram (same values the inline style had). The closing "Different results"
   label and the shortened opening label are phone-only; see the phone rules at the end. */
.cmp-label{margin-top:34px;font-size:.72rem;text-transform:uppercase;letter-spacing:.14em;color:var(--icy);font-weight:700}
.cmp-label--close{display:none}
.cmp-arc{position:relative;margin:24px auto 0;display:flex;flex-direction:column;align-items:center}
.cmp-lines{display:none}
.cmp-cta{position:relative;z-index:2;display:inline-flex;align-items:center;justify-content:center;max-width:100%;padding:18px 30px;border-radius:999px;background:var(--navy-2);border:1px solid rgba(152,200,245,.45);color:#f4f7fb;font-family:var(--serif);font-size:1.22rem;line-height:1.25;text-align:center;text-wrap:balance;box-shadow:0 10px 28px rgba(0,0,0,.22);transition:background-color .25s ease,border-color .25s ease,box-shadow .25s ease}
.cmp-cta:hover,.cmp-cta:focus-visible{background:#2d56c2;border-color:#9cc0f5;color:#fff;box-shadow:0 0 0 4px rgba(120,160,240,.16),0 12px 40px rgba(60,110,230,.38)}
.cmp-cta:focus-visible{outline:2px solid #d6e8fb;outline-offset:4px}
.cmp-cta{max-width:calc(100% - 28px)}
/* Same light gray outline and 3px gray ring as the site's matching button (.journey-cta
   "More Detail on the Process"), with the outline softened slightly for the navy background.
   Border colour and box-shadow only, so size and position are unchanged; hover/focus as before. */
.cmp-cta{border-color:rgba(197,204,214,.7);box-shadow:0 0 0 3px rgba(197,204,214,.3),0 10px 28px rgba(0,0,0,.22)}
.cmp-topics{list-style:none;margin:28px auto 0;padding:0;display:grid;gap:10px;width:100%;max-width:340px}
.cmp-topic{display:flex;align-items:center;justify-content:center;min-height:48px;padding:12px 20px;border-radius:12px;background:#10264a;border:1px solid rgba(152,200,245,.3);font-family:var(--serif);font-size:1.02rem;color:#e8eef8;white-space:nowrap}
@media (prefers-reduced-motion:reduce){.cmp-cta{transition:none}}
/* Intermediate widths: a compact centred wrap. */
@media (min-width:620px){
  .cmp-topics{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;max-width:760px}
}
/* Wide screens: inverted semicircle. Offsets are from the CTA centre (550,40 in the 1100x380
   box), and the SVG lines use the same coordinates. Needs ~1070px, so it starts at 1120px. */
@media (min-width:1120px){
  .cmp-arc{display:block;height:380px;max-width:1100px;margin-top:30px}
  .cmp-lines{display:block;position:absolute;top:0;left:50%;width:1100px;height:380px;transform:translateX(-50%);pointer-events:none}
  .cmp-lines line{stroke:rgba(152,200,245,.3);stroke-width:1;vector-effect:non-scaling-stroke}
  .cmp-cta{position:absolute;left:50%;top:40px;transform:translate(-50%,-50%);white-space:nowrap}
  .cmp-topics{display:block;margin:0;max-width:none}
  .cmp-topic{position:absolute;left:calc(50% + var(--dx));top:calc(40px + var(--dy));transform:translate(-50%,-50%);min-width:128px}
}
/* Comparison entrance: the outer boxes arrive in left/right pairs (outermost first), each fading
   in while sliding 16px inward from its own side; the lines then draw toward the centre and the
   button fades in last. About 0.9s in total and plays once. Hidden states apply only after the
   script adds .cmp-anim, so the diagram stays visible without JavaScript or with reduced motion.
   `translate` (not `transform`) leaves each box's positioning untouched, so it ends exactly in place. */
.cmp-anim .cmp-topic{opacity:0;transition:opacity .38s ease var(--cmp-d,0s),translate .38s ease var(--cmp-d,0s)}
.cmp-anim .cmp-topic:nth-child(-n+3){translate:-16px 0}
.cmp-anim .cmp-topic:nth-child(n+4){translate:16px 0}
.cmp-anim .cmp-topic:nth-child(2),.cmp-anim .cmp-topic:nth-child(5),
.cmp-anim .cmp-lines line:nth-of-type(2),.cmp-anim .cmp-lines line:nth-of-type(5){--cmp-d:.08s}
.cmp-anim .cmp-topic:nth-child(3),.cmp-anim .cmp-topic:nth-child(4),
.cmp-anim .cmp-lines line:nth-of-type(3),.cmp-anim .cmp-lines line:nth-of-type(4){--cmp-d:.16s}
/* The three situation boxes (7-9) arrive last: left one from the left, centre one from below, right one from the right. */
.cmp-anim .cmp-topic:nth-child(7){translate:-16px 0}
.cmp-anim .cmp-topic:nth-child(8){translate:0 12px}
.cmp-anim .cmp-topic:nth-child(n+7),.cmp-anim .cmp-lines line:nth-of-type(n+7){--cmp-d:.24s}
.cmp-anim .cmp-lines line{stroke-dasharray:var(--len);stroke-dashoffset:var(--len);transition:stroke-dashoffset .3s ease calc(var(--cmp-d,0s) + .18s)}
.cmp-anim .cmp-cta{opacity:0;transition:opacity .34s ease .56s,background-color .25s ease,border-color .25s ease,box-shadow .25s ease}
.cmp-anim.is-visible .cmp-topic:nth-child(n),.cmp-anim.is-visible .cmp-cta{opacity:1;translate:none}
.cmp-anim.is-visible .cmp-lines line{stroke-dashoffset:0}
/* Below the arc layout the boxes form a stacked or wrapped list: one simple, simultaneous fade. */
@media (max-width:1119px){
  .cmp-anim .cmp-topic:nth-child(n){translate:none;--cmp-d:0s}
  .cmp-anim .cmp-cta{transition-delay:0s}
}
@media (prefers-reduced-motion:reduce){
  .cmp-anim .cmp-topic:nth-child(n),.cmp-anim .cmp-cta{opacity:1;translate:none;transition:none}
  .cmp-anim .cmp-lines line{stroke-dashoffset:0;transition:none}
}
@media print{.cmp-anim .cmp-topic:nth-child(n),.cmp-anim .cmp-cta{opacity:1;translate:none}.cmp-anim .cmp-lines line{stroke-dashoffset:0}}
/* Phones: the button and the six boxes are simply visible (no fade); instead, once the list
   scrolls into view, each box pulses three times (a 3% scale and a brighter border and fill, then
   back), waiting 4s before each pulse, including the first. Each 4.7s cycle is a 4s rest then a
   0.7s pulse; the 0.11s stagger between boxes is kept, and it stops after the third cycle.
   Transform only, so nothing around them moves. The script adds .cmp-pulse once per page load
   (never with reduced motion) and pauses the timing (.cmp-pulse-paused) while the list is offscreen. */
@media (max-width:620px){
  .cmp-anim .cmp-topic:nth-child(n){opacity:1;translate:none;transition:none}
  .cmp-anim .cmp-cta{opacity:1;transition:background-color .25s ease,border-color .25s ease,box-shadow .25s ease}
  .cmp-topics.cmp-pulse .cmp-topic{animation:cmp-pulse 4.7s linear 3 both}
  .cmp-topics.cmp-pulse.cmp-pulse-paused .cmp-topic{animation-play-state:paused}
  .cmp-topics.cmp-pulse .cmp-topic:nth-child(2){animation-delay:.11s}
  .cmp-topics.cmp-pulse .cmp-topic:nth-child(3){animation-delay:.22s}
  .cmp-topics.cmp-pulse .cmp-topic:nth-child(4){animation-delay:.33s}
  .cmp-topics.cmp-pulse .cmp-topic:nth-child(5){animation-delay:.44s}
  .cmp-topics.cmp-pulse .cmp-topic:nth-child(6){animation-delay:.55s}
}
@keyframes cmp-pulse{
  0%,85.11%,100%{transform:scale(1);border-color:rgba(152,200,245,.3);background-color:#10264a;animation-timing-function:ease-in-out}
  91.81%{transform:scale(1.03);border-color:rgba(152,200,245,.75);background-color:#16325e;animation-timing-function:ease-in-out}
}
@media (max-width:620px) and (prefers-reduced-motion:reduce){.cmp-topics.cmp-pulse .cmp-topic{animation:none}}

.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:34px}
.concepts-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:34px}
.service-card{padding:30px 26px;border:1px solid var(--line);background:#fff;border-radius:8px;min-height:205px}
.service-card .num{font-family:var(--serif);color:var(--blue);font-size:1.45rem}
.service-card h3{font-family:var(--serif);font-size:1.35rem;font-weight:500;margin:16px 0 10px}
.service-card p{font-size:.88rem;color:var(--muted);margin:0}
/* "A better retirement question": centred heading and card text, no step numbers. */
.question-block{text-align:center}
.question-block .concepts-grid{grid-auto-rows:1fr}
.question-block .service-card{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;padding:34px 26px 32px}
.question-block .service-card h3{margin:0 0 14px;text-wrap:balance}
.question-block .service-card p{max-width:28ch;font-size:.92rem;line-height:1.6;text-wrap:balance}

.process{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:34px}
.process-block{text-align:center}
.journey{display:grid;grid-template-columns:repeat(4,1fr);margin-top:.55rem}
.journey-title{display:contents}
.journey-word{order:1;display:block;padding:0 12px 24px;font-family:var(--serif);font-weight:500;font-size:min(2.75rem,calc((100vw - 82px) * .041));line-height:1.1;letter-spacing:-.005em;white-space:nowrap}
.journey-step{order:2;position:relative;margin:0;padding:28px 18px 0;border-top:1px solid rgba(58,95,200,.42);font-family:var(--serif);font-size:1.22rem;line-height:1.4;color:var(--ink)}
.journey-step::before{content:"";position:absolute;left:calc(50% - 4.5px);top:-5px;width:9px;height:9px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 5px #fff}
.journey-num{display:block;margin-bottom:9px;font-family:var(--sans);font-size:.84rem;font-weight:750;letter-spacing:.16em;color:var(--blue-deep)}
/* Each step: serif question, then a short plain-language description in the body face. */
.journey-q{margin:0;font:inherit;font-size:1.14rem;font-weight:500;line-height:1.35;color:var(--ink);text-wrap:balance}
.journey-text{margin:12px auto 0;max-width:32ch;font-family:var(--sans);font-size:.95rem;line-height:1.6;color:var(--muted);text-wrap:pretty}
/* Four-across layout: number, question and description share rows across the steps (subgrid),
   so every description starts on the same line however the questions wrap. */
@media (min-width:1101px){
  .journey-word{grid-row:1}
  .journey-step{grid-row:2 / span 3;display:grid;grid-template-rows:subgrid}
}
.journey + .journey-cta{margin-top:40px}
/* Homepage Process button: dark blue fill, subtle light gray outline, light text. Same size and
   shape as other secondary buttons; hover and focus match the site's primary buttons. */
.journey-cta .btn.secondary{background:var(--navy-2);color:#f4f7fb;border-color:#c5ccd6;box-shadow:0 0 0 3px rgba(197,204,214,.3),0 8px 22px rgba(10,27,49,.16)}
.journey-cta .btn.secondary:hover,.journey-cta .btn.secondary:focus-visible{background:#2d56c2;color:#fff;border-color:#e3e8ef;box-shadow:0 0 0 4px rgba(120,160,240,.32),0 12px 34px rgba(60,110,230,.34)}
/* Secondary next step under that button: a clearly visible text link (not a second button). */
.journey-link{display:table;margin:14px auto 0;padding:10px 8px;font-family:var(--sans);font-size:1.02rem;font-weight:600;line-height:1.5;color:var(--blue-deep);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;border-radius:4px;transition:color .2s ease}
.journey-link:hover{color:#1f3f9c;text-decoration-thickness:2px}
.journey-link:focus-visible{outline:2px solid var(--blue-deep);outline-offset:2px;text-decoration-thickness:2px}

.standard-band .standard-intro{max-width:620px;font-size:1.08rem;line-height:1.65}
/* Supporting line under the section heading (2026-10-07): a smaller serif line between the heading and the intro. */
.standard-band .standard-sub{max-width:620px;margin:0 auto 24px;font-family:var(--serif);font-size:clamp(1.12rem,1.9vw,1.32rem);line-height:1.45;color:#eef3fb;text-wrap:balance}
.standard-band .standard-close{max-width:700px;margin-top:40px;font-family:var(--serif);font-size:clamp(1.3rem,2.2vw,1.6rem);line-height:1.35;color:#eef3fb}

.process-card{border:1px solid var(--line);background:var(--ivory);padding:26px 22px;border-radius:8px;position:relative}
.process-card .step{width:34px;height:34px;border-radius:50%;background:var(--blue);color:#fff;display:grid;place-items:center;font-size:.78rem;font-weight:800;margin-bottom:13px}
.process-card h3{font-family:var(--serif);font-size:1.25rem;font-weight:500;margin:0 0 8px}
.process-card p{font-size:.84rem;color:var(--muted);margin:0}

.hero-mini{background:url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxNjAwIDM2MCIgcHJlc2VydmVBc3BlY3RSYXRpbz0ieE1pZFlNaWQgc2xpY2UiPgogIDxkZWZzPgogICAgPGxpbmVhckdyYWRpZW50IGlkPSJza3kyIiB4MT0iMCIgeTE9IjAiIHgyPSIxIiB5Mj0iMSI+CiAgICAgIDxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iI2U3ZWRmMCIvPjxzdG9wIG9mZnNldD0iLjUyIiBzdG9wLWNvbG9yPSIjZmFmNWViIi8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjZGNlMmU0Ii8+CiAgICA8L2xpbmVhckdyYWRpZW50PgogICAgPGxpbmVhckdyYWRpZW50IGlkPSJyaWRnZSIgeDE9IjAiIHkxPSIwIiB4Mj0iMCIgeTI9IjEiPjxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iIzZmN2Q3OCIvPjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iIzM0NDQzZiIvPjwvbGluZWFyR3JhZGllbnQ+CiAgPC9kZWZzPgogIDxyZWN0IHdpZHRoPSIxNjAwIiBoZWlnaHQ9IjM2MCIgZmlsbD0idXJsKCNza3kyKSIvPgogIDxwYXRoIGQ9Ik0wIDI3NSBMMTIwIDE5NSBMMTkwIDIzMCBMMjk1IDEyNSBMNDAwIDIzMCBMNTA1IDE3MCBMNjIwIDI3NiBMMCAzNjBaIiBmaWxsPSIjN2U4YTg0IiBvcGFjaXR5PSIuMzgiLz4KICA8cGF0aCBkPSJNMCAzMjAgTDEyMCAyMjUgTDIxMCAyODUgTDMyMCAxNjAgTDQzMCAyODUgTDU0MCAyMDAgTDY5MCAzMTggTDAgMzYwWiIgZmlsbD0idXJsKCNyaWRnZSkiLz4KICA8ZyBmaWxsPSIjNTI2MzZhIiBvcGFjaXR5PSIuOSI+CiAgICA8cmVjdCB4PSIxMTI1IiB5PSIxNDAiIHdpZHRoPSIyOCIgaGVpZ2h0PSIxODgiLz48cmVjdCB4PSIxMTYxIiB5PSIxMTAiIHdpZHRoPSI0NCIgaGVpZ2h0PSIyMTgiLz4KICAgIDxyZWN0IHg9IjEyMTIiIHk9IjE5MCIgd2lkdGg9IjMxIiBoZWlnaHQ9IjEzOCIvPjxyZWN0IHg9IjEyNTAiIHk9IjkyIiB3aWR0aD0iNDgiIGhlaWdodD0iMjM2Ii8+CiAgICA8cmVjdCB4PSIxMzA4IiB5PSIxNzAiIHdpZHRoPSIzMiIgaGVpZ2h0PSIxNTgiLz48cmVjdCB4PSIxMzQ4IiB5PSIxMzUiIHdpZHRoPSI1NCIgaGVpZ2h0PSIxOTMiLz4KICAgIDxyZWN0IHg9IjE0MTIiIHk9IjIwNiIgd2lkdGg9IjM1IiBoZWlnaHQ9IjEyMiIvPjxyZWN0IHg9IjE0NTUiIHk9IjE1NSIgd2lkdGg9IjQ4IiBoZWlnaHQ9IjE3MyIvPgogIDwvZz4KICA8cGF0aCBkPSJNMTA1NSAzMzMgUTEyNjUgMjQ1IDE1MTAgMzMwIiBmaWxsPSJub25lIiBzdHJva2U9IiNiOThiNDQiIHN0cm9rZS13aWR0aD0iNCIgb3BhY2l0eT0iLjQ1Ii8+CiAgPHJlY3Qgd2lkdGg9IjE2MDAiIGhlaWdodD0iMzYwIiBmaWxsPSIjZmZmIiBvcGFjaXR5PSIuMTIiLz4KPC9zdmc+Cg==') center/cover no-repeat;padding:72px 0 54px;text-align:center;border-bottom:1px solid var(--line)}
.hero-mini h1{font-family:var(--serif);font-size:clamp(2.6rem,5vw,4.35rem);font-weight:500;line-height:1.03;margin:0}
.hero-mini p{max-width:800px;margin:18px auto 0;color:#475064}

.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:38px}
.team-card{background:#fff;border:1px solid var(--line);border-radius:9px;overflow:hidden}
.team-photo{aspect-ratio:4/4.6;object-fit:cover;width:100%;background:#e9e3d8}
.team-copy{padding:24px}
.team-copy h3{font-family:var(--serif);font-size:1.55rem;font-weight:500;margin:0 0 4px}
.team-role{font-size:.75rem;letter-spacing:.09em;text-transform:uppercase;color:var(--blue-deep);font-weight:800}
.team-copy p{font-size:.88rem;color:var(--muted);margin:12px 0 0}

.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:32px}
.pillar{border:1px solid var(--line);padding:26px;border-radius:8px;background:#fff}
.pillar h3{font-family:var(--serif);font-size:1.2rem;font-weight:500;margin:0 0 8px}
.pillar p{font-size:.86rem;color:var(--muted);margin:0}

.cta-band{background:linear-gradient(135deg,#10264a,var(--navy));color:#fff;padding:76px 0}
.cta-inner{display:flex;flex-direction:column;align-items:center;text-align:center}
.cta-inner > div{display:flex;flex-direction:column;align-items:center}
.cta-inner .eyebrow{font-size:.84rem;letter-spacing:.16em;line-height:1.4}
.cta-inner h2{font-family:var(--serif);font-size:clamp(2rem,4vw,3rem);font-weight:500;line-height:1.1;max-width:22ch;margin:14px 0 22px;text-wrap:balance}
.cta-inner p{color:#cdd6e4;margin:0;max-width:50ch;font-size:1.1rem;line-height:1.55;text-wrap:pretty}
.cta-inner > .btn{margin-top:40px;border-color:rgba(152,200,245,.45)}

.path-hero{padding:85px 0 70px;background:linear-gradient(135deg,#fbf8f2 0%,#f3ede2 55%,#e8eceb 100%);border-bottom:1px solid var(--line)}
.path-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:52px;align-items:center}
.path-hero h1{font-family:var(--serif);font-size:clamp(2.8rem,5.6vw,4.7rem);font-weight:500;line-height:1.02;margin:.5rem 0 1.2rem}
.path-hero p{color:var(--muted);font-size:1.04rem;max-width:680px}
.quote-box{padding:32px;background:var(--navy);color:#f4f7fb;border-radius:10px;box-shadow:var(--shadow)}
.quote-box blockquote{font-family:var(--serif);font-size:1.7rem;line-height:1.25;margin:0 0 16px}
.quote-box small{color:#b9dcf7}

.contact-wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:34px;align-items:start}
.contact-form{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.contact-form .full{grid-column:1/-1}
.contact-form label{display:block;font-size:.77rem;font-weight:750;margin-bottom:6px}
.contact-form input,.contact-form textarea{width:100%;border:1px solid var(--line);background:#fff;border-radius:4px;padding:12px 13px;outline:none}
.contact-form input:focus,.contact-form textarea:focus{border-color:var(--blue)}
.contact-form textarea{min-height:130px;resize:vertical}

.footer{background:var(--navy);color:#cdd6e4;padding:46px 0 24px}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}
.footer h4{font-size:.67rem;letter-spacing:.13em;text-transform:uppercase;color:var(--icy);margin:0 0 12px}
.footer a,.footer p{display:block;color:#bfc9da;font-size:.77rem;margin:0 0 8px}
.footer-bottom{border-top:1px solid var(--navy-3);margin-top:28px;padding-top:18px;display:flex;justify-content:space-between;gap:20px;color:#8d9ab0;font-size:.68rem}
.disclosure{max-width:820px}

/* Process steps: two by two below 1100px, where four columns get too narrow for the
   descriptions (the phone layout below overrides this). */
@media (max-width:1100px){
  .journey{grid-template-columns:1fr 1fr}.journey-word{font-size:clamp(2rem,5vw,2.5rem)}.journey-step{padding-bottom:40px}
  .journey-word:nth-child(1){order:1}.journey-word:nth-child(2){order:2}.journey-step:nth-of-type(1){order:3}.journey-step:nth-of-type(2){order:4}
  .journey-word:nth-child(3){order:5}.journey-word:nth-child(4){order:6}.journey-step:nth-of-type(3){order:7}.journey-step:nth-of-type(4){order:8}
  .journey + .journey-cta{margin-top:0}.journey-text{max-width:40ch}
}
@media (max-width:900px){
  .nav-links,.nav-cta{display:none}.menu-btn{display:block}
  .nav-links.open{display:flex;position:absolute;top:92px;left:0;right:0;background:var(--navy);padding:20px;flex-direction:column;border-bottom:1px solid var(--navy-3)}
  .choice-grid,.two-col,.path-grid,.contact-wrap,.hero-split{grid-template-columns:1fr}.choice-or{display:none}
  .hero-split{gap:28px}.hero-left{padding-bottom:0}.hero-left h1{font-size:clamp(2.1rem,6.4vw,2.8rem)}.hero-left p{max-width:45ch}.hero-image{max-width:560px;margin:0 auto}.hero-break{display:none}
  .trust-grid{grid-template-columns:1fr 1fr}.trust-item:nth-child(2){border-right:0}.trust-item{border-bottom:1px solid var(--line)}
  .services-grid,.concepts-grid{grid-template-columns:1fr 1fr}.process{grid-template-columns:1fr 1fr}
  .team-grid{grid-template-columns:1fr 1fr}.pillars{grid-template-columns:1fr 1fr}
  .footer-grid{grid-template-columns:1fr 1fr}.cta-band{padding:64px 0}
}
@media (max-width:620px){
  .container{width:min(100% - 28px,1180px)}.nav{height:80px}.nav-links.open{top:80px}.brand-logo{width:102px;height:60px}
  .hero{min-height:auto}.hero-inner{padding-top:34px}.hero-inner.hero-split{padding:34px 0 48px}.choice-card{padding:32px 22px;min-height:320px}
  .trust-grid,.services-grid,.concepts-grid,.process,.team-grid,.pillars,.footer-grid,.contact-form{grid-template-columns:1fr}.trust-item{border-right:0}
  .journey{grid-template-columns:1fr;text-align:left}.journey + .journey-cta{margin-top:4px}.journey-word{position:relative;padding:0 0 12px 30px;border-left:1px solid rgba(58,95,200,.42);font-size:clamp(2rem,9vw,2.4rem)}
  .journey-word::before{content:"";position:absolute;left:-5px;top:.42em;width:9px;height:9px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 5px #fff}
  .journey-step{border-top:0;border-left:1px solid rgba(58,95,200,.42);padding:0 0 36px 30px}.journey-step::before{display:none}
  .journey-step:nth-of-type(4){border-left-color:transparent}.journey-text{margin-left:0;max-width:40ch}
  .journey-word:nth-child(1){order:1}.journey-step:nth-of-type(1){order:2}.journey-word:nth-child(2){order:3}.journey-step:nth-of-type(2){order:4}
  .journey-word:nth-child(3){order:5}.journey-step:nth-of-type(3){order:6}.journey-word:nth-child(4){order:7}.journey-step:nth-of-type(4){order:8}
  .checklist{grid-template-columns:1fr}.footer-bottom{flex-direction:column}.section{padding:64px 0}
}
/* Phone hero: the headline, paragraph and button stay together as one group with slightly
   tighter spacing, and the video follows closer and in a square frame anchored to the bottom.
   The square trims only empty sky above the couple, so they appear on the first screen. */
@media (max-width:620px){
  .hero-inner.hero-split{padding-top:24px;gap:18px}
  .hero-left h1{margin-top:12px}
  .hero-left .gold-rule{margin:16px auto 18px}
  .hero-video{aspect-ratio:1/1;object-position:50% 100%}
}
/* Phone process steps: every line centred (heading word, number, catchphrase, paragraph). The
   left-hand timeline becomes a centred one: a dot above each heading and a short connector
   line below each step, so the steps still read as one sequence. */
@media (max-width:620px){
  .journey{text-align:center}
  .journey-word{padding:28px 0 10px;border-left:0}
  .journey-word::before{left:calc(50% - 4.5px);top:4px}
  .journey-step{border-left:0;padding:0 0 34px}
  .journey-step::after{content:"";position:absolute;left:50%;bottom:0;width:1px;height:26px;background:rgba(58,95,200,.42)}
  .journey-step:nth-of-type(4)::after{display:none}
  .journey-text{margin-left:auto;margin-right:auto;max-width:34ch}
}

/* Phone Paradigm Standard labels: "Same conditions" above the button and "Different results"
   after the six bubbles, styled as a matching pair of bookends with mirrored short rules. */
@media (max-width:620px){
  .cmp-label-rest{display:none}
  .cmp-label{font-size:.8rem;letter-spacing:.16em}
  .cmp-label--open::after,.cmp-label--close::before{content:"";display:block;width:36px;height:1px;margin:12px auto;background:rgba(152,200,245,.55)}
  .cmp-label--open::after{margin-bottom:0}
  .cmp-label--close{display:block;margin-top:24px}
  .cmp-label--close::before{margin-top:0}
}
/* The end-of-section copy of the diagram button is phone-only. */
.cmp-cta-end{display:none}
/* Phone Paradigm Standard order: Same conditions, the six bubbles, the three closing lines
   (Different results / Different options / Measurable results, one per line in the same eyebrow
   style), the button, then the paragraph. The diagram's own button is hidden here; the end copy is
   the same .cmp-cta, so it keeps the desktop treatment exactly (thin light gray-blue outline and
   soft drop shadow). Spacing mirrors around the bubbles (24px) and steps down through the closing. */
@media (max-width:620px){
  .cmp-arc > .cmp-cta{display:none}
  .cmp-topics{margin-top:0}
  .cmp-label-line{display:block}
  .cmp-label-line + .cmp-label-line{margin-top:6px}
  .cmp-roll,.cmp-roll-track{display:block}
  .cmp-roll-repeat{display:none}
  .cmp-cta-end{display:block;margin-top:28px}
  .standard-band .standard-close{margin-top:36px}
}
/* Phone closing lines as a slot-style rotation: a fixed one-line window shows one of the two
   phrases at a time; each holds 3s, then the track rolls up 0.5s to the next. The hidden repeat of
   the first phrase lets the loop keep rolling upward seamlessly. Transform only, so the window (and
   the section) never changes height. The text itself is untouched, so screen readers read the two
   phrases once, with no announcements as it moves. Reduced motion keeps the static two lines. */
@media (max-width:620px) and (prefers-reduced-motion:no-preference){
  .cmp-roll{height:1.6em;overflow:hidden}
  .cmp-roll .cmp-label-line{height:1.6em;line-height:1.6em;margin-top:0}
  .cmp-roll-repeat{display:block}
  .cmp-roll-track{animation:cmp-roll 7s cubic-bezier(.45,0,.2,1) infinite}
}
@keyframes cmp-roll{
  0%,42.86%{transform:translateY(0)}
  50%,92.86%{transform:translateY(-1.6em)}
  100%{transform:translateY(-3.2em)}
}
/* ==========================================================================
   Homepage phone polish (<=620px, homepage only via body.page-home).
   Layout and spacing only: wording, order, links, colours and behaviour are unchanged.
   ========================================================================== */
@media (max-width:620px){
  /* One consistent 20px side margin and an even 72px rhythm between sections. */
  .page-home .container{width:calc(100% - 40px)}
  .page-home .section,.page-home .standard-band{padding:72px 0}
  .page-home .menu-btn{min-width:44px;min-height:44px;display:grid;place-items:center}

  /* Hero: headline given room, paragraph at a relaxed line height, the button and its note
     kept together as one group, and the video separated as its own block below. */
  .page-home .hero-inner.hero-split{padding-top:28px;gap:32px}
  .page-home .hero-left h1{margin-top:14px;font-size:clamp(1.95rem,8.6vw,2.4rem);line-height:1.12}
  .page-home .hero-left .gold-rule{margin:18px auto 20px}
  .page-home .hero-left > p{line-height:1.65}
  .page-home .hero-left > div > p{margin-top:12px}

  /* "What would you like more of in life?" cards: natural heights (no forced equal rows),
     even spacing, roomier padding, and quiet depth from a soft border, a faint surface tint
     and a light shadow. */
  .page-home .question-block .concepts-grid{grid-auto-rows:auto;gap:16px;margin-top:32px}
  .page-home .question-block .service-card{padding:28px 24px 30px;border:1px solid rgba(19,34,58,.09);border-radius:12px;background:linear-gradient(180deg,#ffffff 0%,#f6f8fc 100%);box-shadow:0 1px 2px rgba(10,27,49,.04),0 12px 28px -12px rgba(10,27,49,.16)}
  .page-home .question-block .service-card h3{margin:0 0 12px}
  .page-home .question-block .service-card p{max-width:32ch}

  /* Paradigm Standard: "Same conditions" as the anchor, evenly spaced bubbles, the rotating
     result lines given room as the conclusion, then the button after a deliberate gap. */
  .page-home .cmp-label{font-size:.86rem;letter-spacing:.18em}
  .page-home .cmp-label--open{margin-top:40px}
  .page-home .cmp-topics{gap:12px}
  .page-home .cmp-label--close{margin-top:32px}
  .page-home .cmp-cta-end{margin-top:36px}
  .page-home .standard-band .standard-close{margin-top:40px}

  /* The process: one consistent structure per step, with more prominent numbers and quieter
     supporting paragraphs. Heights follow the content. */
  .page-home .journey-word{padding:32px 0 12px}
  .page-home .journey-num{font-size:1.05rem;margin-bottom:12px}
  .page-home .journey-text{font-size:.93rem;line-height:1.65}
  .page-home .journey-step{padding-bottom:40px}
  .page-home .journey-step::after{height:30px}
}
/* Narrow phones: a slightly smaller hero headline keeps the primary button close to the first screen. */
@media (max-width:360px){
  .page-home .hero-left h1{font-size:1.8rem}
}

/* ==========================================================================
   v7E: homepage phone redesign (<=620px, homepage only via body.page-home).
   Visual only: wording, links, media, button labels and animation timing unchanged.
   ========================================================================== */
@media (max-width:620px){
  /* Hero: question, then the framed video, then the paragraph, then the button and its note.
     The hero's text column is flattened (display:contents) so its pieces can be ordered around the
     video; the video sits in a quiet blue frame and no text is placed over it. */
  .page-home .hero-inner.hero-split{gap:0;padding-top:28px}
  .page-home .hero-left{display:contents}
  .page-home .hero-left .eyebrow{order:1;margin-left:auto;margin-right:auto}
  .page-home .hero-left h1{order:2}
  .page-home .hero-left .gold-rule{order:3;margin:18px auto 22px}
  .page-home .hero-right{order:4;margin:0 0 26px;padding:10px;background:#e9eff8;border:1px solid rgba(52,82,158,.16);border-radius:22px}
  .page-home .hero-right .hero-video{border:0;border-radius:14px;box-shadow:0 6px 18px rgba(10,27,49,.12)}
  .page-home .hero-left > p{order:5}
  .page-home .hero-left > div{order:6;padding-bottom:4px}

  /* Cards: a soft blue-gray page behind white cards, a blue top accent, a clearer heading with a
     short rule beneath it, and the same internal spacing in every card. */
  .page-home #services{background:#eef3f9}
  .page-home .question-block .service-card{background:#fff;border:1px solid rgba(52,82,158,.16);border-top:3px solid var(--blue);border-radius:14px;padding:26px 22px 28px;box-shadow:0 1px 2px rgba(10,27,49,.05),0 12px 26px -16px rgba(10,27,49,.22)}
  .page-home .question-block .service-card h3{margin:0;font-size:1.4rem;line-height:1.25;color:var(--ink)}
  .page-home .question-block .service-card h3::after{content:"";display:block;width:28px;height:2px;margin:14px auto;border-radius:2px;background:rgba(52,82,158,.35)}
  .page-home .question-block .service-card p{margin:0}

  /* Paradigm Standard as four linked stages: the Same conditions label, the six bubbles in their own
     panel, the rotating result lines in a quiet band, then the button. Thin vertical connectors join
     the stages. Bubble outlines, pulse, rotation timing and button styling are unchanged. */
  .page-home .cmp-label--open::after{width:1px;height:22px;margin:12px auto 0;background:rgba(152,200,245,.45)}
  .page-home .cmp-arc{margin-top:0}
  .page-home .cmp-topics{padding:16px;max-width:none;background:rgba(152,200,245,.05);border:1px solid rgba(152,200,245,.16);border-radius:18px}
  .page-home .cmp-label--close{position:relative;max-width:300px;margin:46px auto 0;padding:14px 16px;background:rgba(152,200,245,.07);border:1px solid rgba(152,200,245,.2);border-radius:14px}
  .page-home .cmp-label--close::before{position:absolute;left:50%;top:-35px;width:1px;height:22px;margin:0 0 0 -.5px;background:rgba(152,200,245,.45)}
  .page-home .cmp-cta-end{position:relative;margin-top:46px}
  .page-home .cmp-cta-end::before{content:"";position:absolute;left:50%;top:-35px;width:1px;height:22px;margin-left:-.5px;background:rgba(152,200,245,.45)}

  /* The process as a journey: each step becomes a light card (heading on top, then number,
     catchphrase and paragraph, all still centred), with open space between cards for a trail of
     small footprints that drifts from side to side and gathers just above the button. The prints
     are decorative background images on pseudo-elements: never over text, never tappable, and
     invisible to screen readers. */
  .page-home .journey-word{padding:28px 20px 10px;background:#f5f8fd;border:1px solid rgba(52,82,158,.14);border-bottom:0;border-radius:16px 16px 0 0}
  .page-home .journey-word::before{display:none}
  .page-home .journey-step{padding:0 20px 28px;margin-bottom:104px;background:#f5f8fd;border:1px solid rgba(52,82,158,.14);border-top:0;border-radius:0 0 16px 16px}
  .page-home .journey-step:nth-of-type(4){margin-bottom:0}
  .page-home .journey + .journey-cta{margin-top:100px}
  .page-home .journey-step::after,.page-home .journey-step:nth-of-type(4)::after{content:"";display:block;position:absolute;top:100%;bottom:auto;left:50%;width:200px;height:104px;margin-left:-100px;background:none center/200px 104px no-repeat;pointer-events:none}
  .page-home .journey-step:nth-of-type(1)::after{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20200%20104%22%20fill%3D%22%2334529e%22%3E%3Cg%20transform%3D%22translate(103.7%2010.0)%20rotate(152.2)%22%20fill-opacity%3D%220.3%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.3%22%20rx%3D%222.6%22%20ry%3D%224.1%22%2F%3E%3Cellipse%20cx%3D%220%22%20cy%3D%224.3%22%20rx%3D%222%22%20ry%3D%222.3%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate(105.3%2032.9)%20rotate(157.1)%22%20fill-opacity%3D%220.3%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.3%22%20rx%3D%222.6%22%20ry%3D%224.1%22%2F%3E%3Cellipse%20cx%3D%220%22%20cy%3D%224.3%22%20rx%3D%222%22%20ry%3D%222.3%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate(120.5%2049.7)%20rotate(162.0)%22%20fill-opacity%3D%220.3%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.3%22%20rx%3D%222.6%22%20ry%3D%224.1%22%2F%3E%3Cellipse%20cx%3D%220%22%20cy%3D%224.3%22%20rx%3D%222%22%20ry%3D%222.3%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate(118.0%2072.2)%20rotate(167.0)%22%20fill-opacity%3D%220.3%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.3%22%20rx%3D%222.6%22%20ry%3D%224.1%22%2F%3E%3Cellipse%20cx%3D%220%22%20cy%3D%224.3%22%20rx%3D%222%22%20ry%3D%222.3%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate(130.2%2091.4)%20rotate(171.9)%22%20fill-opacity%3D%220.3%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.3%22%20rx%3D%222.6%22%20ry%3D%224.1%22%2F%3E%3Cellipse%20cx%3D%220%22%20cy%3D%224.3%22%20rx%3D%222%22%20ry%3D%222.3%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")}
  .page-home .journey-step:nth-of-type(2)::after{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20200%20104%22%20fill%3D%22%2334529e%22%3E%3Cg%20transform%3D%22translate(129.9%2013.5)%20rotate(-159.6)%22%20fill-opacity%3D%220.3%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.3%22%20rx%3D%222.6%22%20ry%3D%224.1%22%2F%3E%3Cellipse%20cx%3D%220%22%20cy%3D%224.3%22%20rx%3D%222%22%20ry%3D%222.3%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate(113.2%2031.3)%20rotate(-154.3)%22%20fill-opacity%3D%220.3%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.3%22%20rx%3D%222.6%22%20ry%3D%224.1%22%2F%3E%3Cellipse%20cx%3D%220%22%20cy%3D%224.3%22%20rx%3D%222%22%20ry%3D%222.3%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate(109.6%2055.7)%20rotate(-149.0)%22%20fill-opacity%3D%220.3%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.3%22%20rx%3D%222.6%22%20ry%3D%224.1%22%2F%3E%3Cellipse%20cx%3D%220%22%20cy%3D%224.3%22%20rx%3D%222%22%20ry%3D%222.3%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate(89.6%2070.7)%20rotate(-144.0)%22%20fill-opacity%3D%220.3%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.3%22%20rx%3D%222.6%22%20ry%3D%224.1%22%2F%3E%3Cellipse%20cx%3D%220%22%20cy%3D%224.3%22%20rx%3D%222%22%20ry%3D%222.3%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate(81.2%2094.7)%20rotate(-139.1)%22%20fill-opacity%3D%220.3%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.3%22%20rx%3D%222.6%22%20ry%3D%224.1%22%2F%3E%3Cellipse%20cx%3D%220%22%20cy%3D%224.3%22%20rx%3D%222%22%20ry%3D%222.3%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")}
  .page-home .journey-step:nth-of-type(3)::after{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20200%20104%22%20fill%3D%22%2334529e%22%3E%3Cg%20transform%3D%22translate(81.8%2010.3)%20rotate(155.8)%22%20fill-opacity%3D%220.3%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.3%22%20rx%3D%222.6%22%20ry%3D%224.1%22%2F%3E%3Cellipse%20cx%3D%220%22%20cy%3D%224.3%22%20rx%3D%222%22%20ry%3D%222.3%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate(83.2%2033.7)%20rotate(155.8)%22%20fill-opacity%3D%220.3%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.3%22%20rx%3D%222.6%22%20ry%3D%224.1%22%2F%3E%3Cellipse%20cx%3D%220%22%20cy%3D%224.3%22%20rx%3D%222%22%20ry%3D%222.3%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate(99.8%2050.3)%20rotate(155.8)%22%20fill-opacity%3D%220.3%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.3%22%20rx%3D%222.6%22%20ry%3D%224.1%22%2F%3E%3Cellipse%20cx%3D%220%22%20cy%3D%224.3%22%20rx%3D%222%22%20ry%3D%222.3%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate(101.2%2073.7)%20rotate(155.8)%22%20fill-opacity%3D%220.3%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.3%22%20rx%3D%222.6%22%20ry%3D%224.1%22%2F%3E%3Cellipse%20cx%3D%220%22%20cy%3D%224.3%22%20rx%3D%222%22%20ry%3D%222.3%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate(117.8%2090.3)%20rotate(155.8)%22%20fill-opacity%3D%220.3%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.3%22%20rx%3D%222.6%22%20ry%3D%224.1%22%2F%3E%3Cellipse%20cx%3D%220%22%20cy%3D%224.3%22%20rx%3D%222%22%20ry%3D%222.3%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")}
  .page-home .journey-step:nth-of-type(4)::after{height:96px;background-size:200px 96px;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20200%2096%22%20fill%3D%22%2334529e%22%3E%3Cg%20transform%3D%22translate(118.2%2010.6)%20rotate(-172.4)%22%20fill-opacity%3D%220.3%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.3%22%20rx%3D%222.6%22%20ry%3D%224.1%22%2F%3E%3Cellipse%20cx%3D%220%22%20cy%3D%224.3%22%20rx%3D%222%22%20ry%3D%222.3%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate(106.7%2027.5)%20rotate(-167.4)%22%20fill-opacity%3D%220.3%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.3%22%20rx%3D%222.6%22%20ry%3D%224.1%22%2F%3E%3Cellipse%20cx%3D%220%22%20cy%3D%224.3%22%20rx%3D%222%22%20ry%3D%222.3%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate(110.4%2045.2)%20rotate(-160.5)%22%20fill-opacity%3D%220.3%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.3%22%20rx%3D%222.6%22%20ry%3D%224.1%22%2F%3E%3Cellipse%20cx%3D%220%22%20cy%3D%224.3%22%20rx%3D%222%22%20ry%3D%222.3%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate(97.3%2053.9)%20rotate(-150.6)%22%20fill-opacity%3D%220.3%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.3%22%20rx%3D%222.6%22%20ry%3D%224.1%22%2F%3E%3Cellipse%20cx%3D%220%22%20cy%3D%224.3%22%20rx%3D%222%22%20ry%3D%222.3%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate(104.2%2071.0)%20rotate(180.0)%22%20fill-opacity%3D%220.33%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.3%22%20rx%3D%222.6%22%20ry%3D%224.1%22%2F%3E%3Cellipse%20cx%3D%220%22%20cy%3D%224.3%22%20rx%3D%222%22%20ry%3D%222.3%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate(95.0%2087.0)%20rotate(180.0)%22%20fill-opacity%3D%220.36%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.3%22%20rx%3D%222.6%22%20ry%3D%224.1%22%2F%3E%3Cellipse%20cx%3D%220%22%20cy%3D%224.3%22%20rx%3D%222%22%20ry%3D%222.3%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate(105.0%2087.0)%20rotate(180.0)%22%20fill-opacity%3D%220.36%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.3%22%20rx%3D%222.6%22%20ry%3D%224.1%22%2F%3E%3Cellipse%20cx%3D%220%22%20cy%3D%224.3%22%20rx%3D%222%22%20ry%3D%222.3%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")}
  /* One slow reveal per segment as it scrolls into view (the script adds .fp-anim, then .fp-in per
     segment); the prints then stay still. Without the script, or with reduced motion, the whole
     trail simply shows. */
  .page-home .journey.fp-anim .journey-step::after{clip-path:inset(0 0 100% 0)}
  .page-home .journey.fp-anim .journey-step.fp-in::after{clip-path:inset(0 0 0 0);transition:clip-path 2.4s cubic-bezier(.4,0,.6,1)}
}
@media (max-width:620px) and (prefers-reduced-motion:reduce){
  .page-home .journey.fp-anim .journey-step::after{clip-path:none;transition:none}
}
/* v7E homepage footer: the logo and its short line are centred as one group across the full width,
   and the three link columns sit centred beneath them as a balanced set. Wording, navigation and
   the legal row are unchanged. */
.page-home .footer-grid{grid-template-columns:repeat(3,minmax(0,1fr));max-width:760px;margin:0 auto;row-gap:36px;text-align:center}
.page-home .footer-grid > div:first-child{grid-column:1/-1;display:flex;flex-direction:column;align-items:center}
.page-home .footer .brand{margin-left:auto;margin-right:auto}
.page-home .footer-grid > div:first-child p{max-width:44ch;margin:0 auto}
@media (max-width:620px){
  .page-home .footer-grid{grid-template-columns:1fr;row-gap:28px}
  .page-home .footer-grid > div:first-child{padding-bottom:4px}
}
/* v7E homepage phone: the six conditions as a restrained asymmetric cascade, and the two result
   lines set left and right beneath it (no rotation). Uses the site's existing information-block
   language: rounded rectangles (not pills, which are reserved for buttons), the phase-block navy
   gradient, a pale gray outline and a faint top highlight. Desktop is unaffected. */
@media (max-width:620px){
  .page-home .cmp-topics{display:flex;flex-direction:column;gap:10px;padding:18px 14px}
  .page-home .cmp-topic{width:var(--w);min-width:fit-content;max-width:100%;border-radius:12px;background:linear-gradient(160deg,var(--navy-2) 0%,#0d2140 100%);border:1px solid rgba(197,204,214,.3);box-shadow:inset 0 1px 0 rgba(255,255,255,.05);color:#f1f5fb;cursor:default}
  .page-home .cmp-topic:nth-child(1){--w:72%;--from:-10px;--i:0;align-self:flex-start;margin-left:2%}
  .page-home .cmp-topic:nth-child(2){--w:78%;--from:10px;--i:1;align-self:flex-end;margin-right:2%}
  .page-home .cmp-topic:nth-child(3){--w:62%;--from:-10px;--i:2;align-self:flex-start;margin-left:9%}
  .page-home .cmp-topic:nth-child(4){--w:70%;--from:10px;--i:3;align-self:flex-end;margin-right:7%}
  .page-home .cmp-topic:nth-child(5){--w:74%;--from:-10px;--i:4;align-self:flex-start;margin-left:4%}
  .page-home .cmp-topic:nth-child(6){--w:86%;--from:10px;--i:5;align-self:flex-end;margin-right:0}
  .page-home .cmp-topic:nth-child(7){--w:68%;--from:-10px;--i:6;align-self:flex-start;margin-left:6%}
  .page-home .cmp-topic:nth-child(8){--w:80%;--from:10px;--i:7;align-self:flex-end;margin-right:4%}
  .page-home .cmp-topic:nth-child(9){--w:84%;--from:-10px;--i:8;align-self:flex-start;margin-left:1%}
  /* One short staggered entrance (script adds .cmp-cascade on phones, then .cmp-pulse in view). */
  .page-home .cmp-topics.cmp-cascade .cmp-topic{opacity:0;translate:var(--from) 0;transition:opacity .5s ease calc(var(--i) * .08s),translate .5s cubic-bezier(.2,.7,.3,1) calc(var(--i) * .08s)}
  .page-home .cmp-topics.cmp-cascade.cmp-pulse .cmp-topic{opacity:1;translate:none}
  /* Three pulse sequences, each starting 4s after the previous one began, staggered gently through
     the six shapes after the entrance, then stopping. Paused while offscreen, as before. */
  .page-home .cmp-topics.cmp-pulse .cmp-topic{animation:cmp-pulse-e 4s linear calc(1.1s + var(--i) * .11s) 3 both}
  .page-home .cmp-topics.cmp-pulse.cmp-pulse-paused .cmp-topic{animation-play-state:paused}

  /* Result lines: static, same small light blue eyebrow type, DIFFERENT OPTIONS on the left and
     MEASURABLE RESULTS on the right, with no box. */
  .page-home .cmp-label--close{max-width:none;margin:28px 0 0;padding:0 6px;background:none;border:0;border-radius:0}
  .page-home .cmp-label--close::before{display:none}
  .page-home .cmp-roll{height:auto;overflow:visible}
  .page-home .cmp-roll-track{animation:none;transform:none}
  .page-home .cmp-roll .cmp-label-line{height:auto;line-height:1.5}
  .page-home .cmp-roll-repeat{display:none}
  .page-home .cmp-label--close .cmp-label-line:nth-child(1){text-align:left}
  .page-home .cmp-label--close .cmp-label-line:nth-child(2){text-align:right;margin-top:8px}
}
@keyframes cmp-pulse-e{
  0%,17.5%,100%{scale:1;border-color:rgba(197,204,214,.3);filter:none;animation-timing-function:ease-in-out}
  8%{scale:1.03;border-color:rgba(197,204,214,.65);filter:brightness(1.14);animation-timing-function:ease-in-out}
}
@media (max-width:620px) and (prefers-reduced-motion:reduce){
  .page-home .cmp-topics.cmp-cascade .cmp-topic,.page-home .cmp-topics.cmp-pulse .cmp-topic{opacity:1;translate:none;transition:none;animation:none}
}

/* v7E homepage desktop (four-across layout only, >=1101px): a faint footprint trail along the
   existing line, marker to marker (Measure > Understand > Compare > Decide), in the mobile print
   shape and colour. Each step's ::after spans from 24px past its own marker to 24px before the
   next one, inside the text-free band around the line. Decorative only: no pointer events and no
   content for screen readers. Mobile and tablet are untouched. */
@media (min-width:1101px){
  .page-home .journey-step:nth-of-type(-n+3)::after{content:"";position:absolute;top:-9.5px;left:calc(50% + 24px);width:calc(100% - 48px);height:18px;background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22100%25%22%20height%3D%2218%22%20fill%3D%22%2334529e%22%3E%3Csvg%20x%3D%226.00%25%22%20y%3D%224.5%22%20overflow%3D%22visible%22%3E%3Cg%20transform%3D%22rotate(90)%22%20fill-opacity%3D%220.3%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.3%22%20rx%3D%222.6%22%20ry%3D%224.1%22%2F%3E%3Cellipse%20cx%3D%220%22%20cy%3D%224.3%22%20rx%3D%222%22%20ry%3D%222.3%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E%3Csvg%20x%3D%2228.00%25%22%20y%3D%2213.5%22%20overflow%3D%22visible%22%3E%3Cg%20transform%3D%22rotate(90)%22%20fill-opacity%3D%220.3%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.3%22%20rx%3D%222.6%22%20ry%3D%224.1%22%2F%3E%3Cellipse%20cx%3D%220%22%20cy%3D%224.3%22%20rx%3D%222%22%20ry%3D%222.3%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E%3Csvg%20x%3D%2250.00%25%22%20y%3D%224.5%22%20overflow%3D%22visible%22%3E%3Cg%20transform%3D%22rotate(90)%22%20fill-opacity%3D%220.3%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.3%22%20rx%3D%222.6%22%20ry%3D%224.1%22%2F%3E%3Cellipse%20cx%3D%220%22%20cy%3D%224.3%22%20rx%3D%222%22%20ry%3D%222.3%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E%3Csvg%20x%3D%2272.00%25%22%20y%3D%2213.5%22%20overflow%3D%22visible%22%3E%3Cg%20transform%3D%22rotate(90)%22%20fill-opacity%3D%220.3%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.3%22%20rx%3D%222.6%22%20ry%3D%224.1%22%2F%3E%3Cellipse%20cx%3D%220%22%20cy%3D%224.3%22%20rx%3D%222%22%20ry%3D%222.3%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E%3Csvg%20x%3D%2294.00%25%22%20y%3D%224.5%22%20overflow%3D%22visible%22%3E%3Cg%20transform%3D%22rotate(90)%22%20fill-opacity%3D%220.3%22%3E%3Cellipse%20cx%3D%220%22%20cy%3D%22-2.3%22%20rx%3D%222.6%22%20ry%3D%224.1%22%2F%3E%3Cellipse%20cx%3D%220%22%20cy%3D%224.3%22%20rx%3D%222%22%20ry%3D%222.3%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E%3C%2Fsvg%3E") 0 0/100% 18px no-repeat;pointer-events:none}
  /* One reveal per segment, left to right, in sequence, once (script adds .fp-desk, then .fp-desk-in). */
  .page-home .journey.fp-desk .journey-step::after{clip-path:inset(0 100% 0 0)}
  .page-home .journey.fp-desk.fp-desk-in .journey-step::after{clip-path:inset(0 0 0 0);transition:clip-path 1.4s cubic-bezier(.4,0,.6,1)}
  .page-home .journey.fp-desk.fp-desk-in .journey-step:nth-of-type(2)::after{transition-delay:1.5s}
  .page-home .journey.fp-desk.fp-desk-in .journey-step:nth-of-type(3)::after{transition-delay:3s}
  /* A larger, more generous 'More Detail on the Process' button, same navy styling and position. */
  .page-home .journey-cta .btn.secondary{min-height:58px;padding:16px 40px;font-size:1.12rem}
}
@media (min-width:1101px) and (prefers-reduced-motion:reduce){
  .page-home .journey.fp-desk .journey-step::after{clip-path:none;transition:none}
}

/* v7F homepage phones only: the "What would you like more of in life?" cards. A navy stroke, a
   little bolder than each card's top line, starts at that line and traces down and around the
   card's edge, alternating direction card to card (left side first, then right side first) so the
   stack reads as a gentle zigzag. While it draws, the stroke has a lightly irregular, crayon-like
   edge; it then settles into a clean border. The stroke is an overlay (script-built SVG) sitting on
   the card's own border, so copy, spacing, typography and the top lines are unchanged. Decorative
   only: hidden from screen readers and clicks. Outside phone widths (for example, a window widened after
   loading) the overlay stays hidden, so it can never join the card's layout and stretch it. */
.page-home .card-trace{display:none}
@media (max-width:620px){
  .page-home .question-block .service-card{position:relative}
  .page-home .card-trace{display:block;position:absolute;overflow:visible;pointer-events:none}
  .page-home .card-trace path{fill:none;stroke:var(--blue);stroke-width:4;stroke-linecap:round;stroke-linejoin:round}
  .page-home .card-trace .trace-rough{filter:url(#card-crayon);stroke-dasharray:var(--len) var(--len);stroke-dashoffset:var(--len);opacity:.94}
  .page-home .card-trace .trace-clean{opacity:0}
  .page-home .card-trace.is-drawing .trace-rough{stroke-dashoffset:0;transition:stroke-dashoffset 1.6s cubic-bezier(.45,.05,.35,1)}
  .page-home .card-trace.is-settled .trace-rough{stroke-dashoffset:0;opacity:0;transition:opacity .7s ease}
  .page-home .card-trace.is-settled .trace-clean{opacity:1;transition:opacity .7s ease}
}
@media (max-width:620px) and (prefers-reduced-motion:reduce){
  .page-home .card-trace .trace-rough{display:none}
  .page-home .card-trace .trace-clean{opacity:1;transition:none}
}

/* v7G homepage phones only: the "More Detail on the Process" button beneath Decide, sized to match the
   "Let's compare the results together!" button above it: the same padding and text size, the same width
   (the column less 28px, up to 360px) and the same height (86px while that label wraps to two lines,
   below 428px wide; about 62px above). Its own label, colours, outline and link are unchanged. */
@media (max-width:620px){
  .page-home .journey-cta .btn.secondary{box-sizing:border-box;width:min(calc(100% - 28px),360px);max-width:calc(100% - 28px);min-height:86.1px;padding:18px 30px;font-size:1.22rem;line-height:1.25;text-align:center}
}
/* From 428px the reference label fits on one line, so both buttons drop to its one-line height. */
@media (min-width:428px) and (max-width:620px){
  .page-home .journey-cta .btn.secondary{min-height:0}
}

/* Homepage four-card section (#services), 2026-10-07: the label and heading were removed, so the
   cards start the section. Warm off-white background at every width (cards keep their own styling);
   no gap where the heading was; a shorter top padding above phones. Phone card layout unchanged. */
/* Same beige as the hero above: the hero runs ivory -> cream at 135deg, so along its bottom edge the
   colour goes from part-way (left) to cream (right). Continuing that left-to-right ramp here (ivory
   stop placed one hero-height to the left) makes the seam disappear. Offsets approximate the hero
   height per layout; the two colours are so close that any error is under one RGB step. */
.page-home #services,.page-home #strategies{background:linear-gradient(90deg,var(--ivory) -720px,var(--cream) 100%)}
@media (max-width:900px){.page-home #services,.page-home #strategies{background:linear-gradient(90deg,var(--ivory) -1300px,var(--cream) 100%)}}
@media (max-width:620px){.page-home #services,.page-home #strategies{background:linear-gradient(90deg,var(--ivory) -1000px,var(--cream) 100%)}}
.page-home #services .concepts-grid{margin-top:0}
@media (min-width:621px){.page-home #services{padding-top:48px}}

/* Homepage "Situations we help with" (#strategies), moved from the Business Owners & HNW page 2026-10-07.
   Card rules copied from that page (same breakpoints: two columns, one column at 900px and below, and
   the stacked label/answer format on phones); background shared with #services; follows the Fair Comparison Standard band (order set 2026-10-07). */
.page-home #strategies{padding:76px 0 84px}
.page-home .bo-strategies{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:34px}
.page-home .bo-strategy{border:1px solid var(--line);border-radius:8px;background:#fff;padding:28px 28px 24px}
.page-home .bo-strategy h3{font-family:var(--serif);font-size:1.3rem;font-weight:500;line-height:1.2;margin:0 0 16px}
.page-home .bo-strategy dl{margin:0;display:grid;grid-template-columns:8.5rem 1fr;gap:10px 16px}
.page-home .bo-strategy dt{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;font-weight:750;color:var(--blue-deep);padding-top:3px}
.page-home .bo-strategy dd{margin:0;font-size:.9rem;line-height:1.6;color:var(--muted)}
@media (max-width:900px){.page-home .bo-strategies{grid-template-columns:1fr}}
@media (max-width:620px){
  .page-home #strategies{padding:60px 0 64px}
  .page-home .bo-strategy{padding:24px 22px 22px}
  .page-home .bo-strategy dl{grid-template-columns:1fr;gap:4px}
  .page-home .bo-strategy dd{margin-bottom:10px}
}

/* Homepage hero (2026-10-08): above phones the supporting paragraph matches the About page's "The life you
   want to live..." paragraph (Inter 1.06rem, 400, #3a4252, 1.7) at its original 427px width; phones keep the
   original paragraph style. The hero button is slightly larger: 1.08rem -> 1.17rem, each padding +3px. */
@media (min-width:621px){.page-home .hero-left > p{max-width:427px;font-size:1.06rem;font-weight:400;line-height:1.7;color:#3a4252}}
.page-home .hero-left > div > .btn{padding:19px 35px;font-size:1.17rem}
@media (max-width:620px){.page-home .hero-left > div > .btn{padding:18px 29px}}

/* Homepage Fair Comparison Standard on phones (2026-10-08): the button sits in the middle of the bubbles
   (Your goals, Market scenarios, Roth Conversions, Inflation, Spending needs / button / Time horizon, Tax
   calculation method, Charitable Strategies, Business Exit Planning). The framed panel moves from the list
   to the whole arrangement and the list's items join it directly (display:contents) so the diagram's own
   button can be placed among them; the end-of-section copy is hidden, so one button shows. Entrance: the
   upper five descend and the lower four rise into place together, easing out, once (same trigger as before:
   .cmp-cascade, released by .cmp-pulse); the button never moves. Desktop is unaffected. */
@media (max-width:620px){
  .page-home .cmp-arc{display:flex;flex-direction:column;gap:10px;padding:18px 14px;background:rgba(152,200,245,.05);border:1px solid rgba(152,200,245,.16);border-radius:18px}
  .page-home .cmp-topics{display:contents}
  .page-home .cmp-arc > .cmp-cta{display:inline-flex;order:6;align-self:center;margin:8px 0}
  .page-home .cmp-cta-end{display:none}
  .page-home .cmp-topic:nth-child(1){order:1;--w:72%;--rise:-18px;--i:0;align-self:flex-start;margin:0 0 0 2%}
  .page-home .cmp-topic:nth-child(2){order:2;--w:78%;--rise:-18px;--i:1;align-self:flex-end;margin:0 2% 0 0}
  .page-home .cmp-topic:nth-child(7){order:3;--w:66%;--rise:-18px;--i:2;align-self:flex-start;margin:0 0 0 8%}
  .page-home .cmp-topic:nth-child(3){order:4;--w:62%;--rise:-18px;--i:3;align-self:flex-end;margin:0 6% 0 0}
  .page-home .cmp-topic:nth-child(5){order:5;--w:74%;--rise:-18px;--i:4;align-self:flex-start;margin:0 0 0 4%}
  .page-home .cmp-topic:nth-child(4){order:7;--w:70%;--rise:18px;--i:5;align-self:flex-end;margin:0 4% 0 0}
  .page-home .cmp-topic:nth-child(6){order:8;--w:86%;--rise:18px;--i:6;align-self:flex-start;margin:0}
  .page-home .cmp-topic:nth-child(8){order:9;--w:78%;--rise:18px;--i:7;align-self:flex-end;margin:0 3% 0 0}
  .page-home .cmp-topic:nth-child(9){order:10;--w:84%;--rise:18px;--i:8;align-self:flex-start;margin:0 0 0 1%}
  .page-home .cmp-topics.cmp-cascade .cmp-topic{opacity:0;translate:0 var(--rise);transition:opacity .6s ease,translate .8s cubic-bezier(.2,.7,.3,1)}
  .page-home .cmp-topics.cmp-cascade.cmp-pulse .cmp-topic{opacity:1;translate:none}
}
@media (max-width:620px) and (prefers-reduced-motion:reduce){
  .page-home .cmp-topics.cmp-cascade .cmp-topic{opacity:1;translate:none;transition:none}
}

/* Homepage Fair Comparison Standard on phones (2026-10-08): the bubble flashes travel inward from both ends of
   the stack to the centred button, in pairs: Your goals + Business Exit Planning, Market scenarios +
   Charitable Strategies, Roth Conversions + Tax calculation method, Inflation + Time horizon, then Spending
   needs. Same flash (cmp-pulse-e), 4s cycle, three cycles, 0.11s step and 1.1s start (after the 0.8s
   entrance has settled); only the step order changes (--s, by DOM position). Reduced motion: no flash. */
@media (max-width:620px){
  .page-home .cmp-topic:nth-child(1),.page-home .cmp-topic:nth-child(9){--s:0}
  .page-home .cmp-topic:nth-child(2),.page-home .cmp-topic:nth-child(8){--s:1}
  .page-home .cmp-topic:nth-child(7),.page-home .cmp-topic:nth-child(6){--s:2}
  .page-home .cmp-topic:nth-child(3),.page-home .cmp-topic:nth-child(4){--s:3}
  .page-home .cmp-topic:nth-child(5){--s:4}
  .page-home .cmp-topics.cmp-pulse .cmp-topic{animation-delay:calc(1.1s + var(--s) * .11s)}
}
@media (max-width:620px) and (prefers-reduced-motion:reduce){
  .page-home .cmp-topics.cmp-pulse .cmp-topic{animation:none}
}

/* Homepage Fair Comparison Standard on phones (2026-10-08): when the inward flashes reach the centred button,
   it gives a small pulse (4% scale) one step after Spending needs (1.1s + 5 x 0.11s) and turns a few tones
   lighter, holding briefly, then fades back by about 1.8s into each 4s cycle, well before the next flashes
   arrive. Same three cycles and pause-while-offscreen as the bubbles; no fill, so once finished the button
   is exactly as before (hover unchanged). Reduced motion: none. */
@keyframes cmp-cta-glow{
  0%{scale:1;background-color:#112846;border-color:rgba(197,204,214,.7);animation-timing-function:ease-out}
  8%{scale:1.04;background-color:#24467a;border-color:rgba(214,224,236,.95);animation-timing-function:ease-in-out}
  16%{scale:1;background-color:#24467a;border-color:rgba(214,224,236,.95)}
  22%{background-color:#24467a;border-color:rgba(214,224,236,.95);animation-timing-function:ease-in-out}
  45%,100%{scale:1;background-color:#112846;border-color:rgba(197,204,214,.7)}
}
@media (max-width:620px){
  .page-home .cmp-arc:has(> .cmp-topics.cmp-pulse) > .cmp-cta{animation:cmp-cta-glow 4s linear calc(1.1s + 5 * .11s) 3 none}
  .page-home .cmp-arc:has(> .cmp-topics.cmp-pulse-paused) > .cmp-cta{animation-play-state:paused}
}
@media (max-width:620px) and (prefers-reduced-motion:reduce){
  .page-home .cmp-arc:has(> .cmp-topics.cmp-pulse) > .cmp-cta{animation:none}
}

/* What you can expect (home): three white cards, symbol on the blue top line, all text centered. Fonts: var(--serif) and var(--sans) only. */
.page-home #expect { background: color-mix(in srgb, var(--ivory) 50%, var(--cream)); text-align: center; }
.page-home .expect-title { margin: 0 auto; color: var(--navy); text-wrap: balance; }
.page-home .expect-sub { margin: 18px auto 0; max-width: 46ch; font-family: var(--serif); font-size: clamp(1.12rem, 1.9vw, 1.3rem); line-height: 1.5; color: rgb(58, 66, 82); text-wrap: balance; }
.page-home .expect-grid { display: grid; grid-template-columns: 1fr; gap: 58px; max-width: 560px; margin: 66px auto 0; text-align: center; }
.page-home .expect-item { position: relative; min-width: 0; display: flex; flex-direction: column; padding: 52px 24px 26px; background: var(--white); border: 1px solid rgba(52, 82, 158, .16); border-top: 3px solid var(--blue); border-radius: 14px; box-shadow: 0 1px 2px rgba(10, 27, 49, .05), 0 12px 26px -16px rgba(10, 27, 49, .22); }
.page-home .expect-icon { position: absolute; top: -33px; left: 50%; width: 64px; height: 64px; margin-left: -32px; display: grid; place-items: center; border-radius: 50%; background: #ece6da; border: 1px solid rgba(52, 82, 158, .14); box-shadow: 0 0 0 5px color-mix(in srgb, var(--ivory) 50%, var(--cream)); color: var(--navy-3); }
.page-home .expect-icon svg { width: 30px; height: 30px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.page-home .expect-head { margin: 0; font-family: var(--serif); font-weight: 500; font-size: 1.45rem; line-height: 1.22; color: var(--navy); text-wrap: balance; }
.page-home .expect-head span { display: block; color: var(--blue-deep); }
.page-home .expect-point { min-width: 0; padding-top: 18px; }
.page-home .expect-head + .expect-point { margin-top: 18px; border-top: 1px solid rgba(52, 82, 158, .14); }
.page-home .expect-label { margin: 0; font-family: var(--sans); font-size: 1rem; font-weight: 750; color: var(--blue-deep); }
.page-home .expect-text { margin: 6px auto 0; max-width: 34ch; font-family: var(--sans); font-size: 1.125rem; font-weight: 400; line-height: 1.7; color: rgb(58, 66, 82); text-wrap: pretty; }
@media (min-width: 861px) {
  .page-home .expect-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: auto auto auto; gap: 0 24px; max-width: none; margin-top: 78px; }
  .page-home .expect-item { display: grid; grid-row: span 3; grid-template-rows: subgrid; padding: 52px 28px 28px; }
}

/* Homepage four benefit cards (#services) above phones, 2026-10-14: same card treatment as the
   "What you can expect" cards (blue top bar, soft blue-gray border, rounded corners, light shadow)
   with a light gray line between the heading and the text. Subgrid shares the heading and text rows
   across the cards in a row, so the gray lines line up. Phones keep their own card styling above. */
@media (min-width:621px){
  .page-home .question-block .concepts-grid{grid-auto-rows:auto}
  .page-home .question-block .service-card{display:grid;grid-row:span 2;grid-template-rows:subgrid;row-gap:0;justify-items:center;align-items:stretch;min-height:0;background:var(--white);border:1px solid rgba(52,82,158,.16);border-top:3px solid var(--blue);border-radius:14px;box-shadow:0 1px 2px rgba(10,27,49,.05),0 12px 26px -16px rgba(10,27,49,.22)}
  .page-home .question-block .service-card h3{justify-self:stretch;margin:0;padding-bottom:16px;border-bottom:1px solid rgba(52,82,158,.14)}
  .page-home .question-block .service-card p{margin:16px 0 0}
}

/* Fair Comparison Standard emblem (homepage navy band), 2026-10-15: the shared emblem
   (assets/brand/fair-comparison-emblem.svg, balance scale with laurels) above the heading, light-gray lines
   on the navy; --emblem-bg fills the shapes that sit in front of lines. Decorative (aria-hidden). */
.page-home .fcs-emblem{display:block;width:110px;height:auto;margin:0 auto 16px;color:#cdd6e4;--emblem-bg:var(--navy);overflow:visible}
@media (max-width:620px){.page-home .fcs-emblem{width:90px}}