/* Two Points Marketing, twopoints.agency. Built Nov. 4, 2026 from drafts/two-points-site-mock.html.
   The cascade is kept in the mock's order on purpose: later dated blocks override earlier ones, and
   reordering them would change the design. Edit the latest rule for a selector, or add a new block at the end. */
/* Layout: a one-page site for Two Points Marketing, selling Year1, in the joint palette (petrol, gold, mint, stone). Bands stack: the marks page's A4 header on stone (Two Points in the nav, the Year1 badge beside a four-stage rule that runs off the edge, the headline), the buyer's questions, why it works, benefits, built to outlast, a split "who you get" band where each half wears its own practice's brand, case example, booking CTA, footer. Deliberately single-theme. */
:root{
  color-scheme:light;
  --paper:#FFFFFF; --stone:#F2F0EA; --ink:#121617; --mute:#5C6467; --rule:#D8D6CF;
  --deep:#17383A; --deep-fg:#F4F3EE; --deep-mute:#C9D6D3; --label:#2B5E5A;
  --signal:#6FD6C4; --gold:#E2B13A;
  --display:'Bricolage Grotesque', 'Helvetica Neue', Arial, sans-serif;
  --sans:'IBM Plex Sans', 'Helvetica Neue', Arial, sans-serif;
  /* Amanda: AN Strategy */
  --an-teal:#00464D; --an-deep:#002A2E; --an-gold:#E5C25E; --an-sage:#A6D4D2; --an-cream:#FCFAF7;
  --an-display:'Playfair Display', Georgia, serif; --an-sans:'Roboto', 'Helvetica Neue', Arial, sans-serif;
  /* Kate: Kate Hamilton Consulting */
  --kh-turq:#6FD6C4; --kh-yellow:#F3C427; --kh-black:#111111; --kh-char:#2E3338;
  --kh-sans:'Montserrat', 'Helvetica Neue', Arial, sans-serif;
  --w:1120px;
}
html{scroll-behavior:smooth}
/* Type C (Oct. 23): Bricolage Grotesque headings at 600, tighter tracking, no italics. */
.head h2,.hero h1,.asks li,.hold .lede,.together p,.story h3,.mini h3,.fact b,.q,.faq h3,.cta h2,.lockup{font-weight:600;letter-spacing:-.025em}
.hero h1 em{font-style:normal}
body{background:var(--paper);color:var(--ink);font-family:var(--sans);margin:0;font-size:16px;line-height:1.6}
.inner{max-width:var(--w);margin:0 auto;padding-left:max(24px,env(safe-area-inset-left,0px));padding-right:max(24px,env(safe-area-inset-right,0px))}
a{color:inherit}
:focus-visible{outline:2px solid var(--signal);outline-offset:3px}
.lockup{display:inline-flex;align-items:center;gap:10px;font-family:var(--display);font-size:24px;line-height:1;letter-spacing:.02em;text-decoration:none}
.lockup i{display:block;width:2px;height:22px;background:var(--gold)}
.eyebrow{font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase}
.btn{display:inline-flex;align-items:center;gap:8px;background:var(--gold);color:var(--deep);font-weight:700;font-size:15px;letter-spacing:.02em;padding:15px 24px;text-decoration:none;border:0}
.btn.ghost{background:transparent;color:var(--deep-fg);box-shadow:inset 0 0 0 1px rgba(244,243,238,.5)}
.btn:hover{filter:brightness(1.05)}
.mark{display:block;width:44px;height:3px;background:var(--gold)}
.head{display:flex;flex-direction:column;gap:8px}
.head h2{margin:0;font-family:var(--display);font-weight:400;font-size:clamp(30px,4vw,42px);line-height:1.08;letter-spacing:-.01em;text-wrap:balance}
.head .k{font-size:12px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--label)}
section{padding-block:88px}

/* Nav + hero */
.top{background:var(--deep);color:var(--deep-fg);position:relative;overflow:hidden}
nav.inner{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:22px}
nav .links{display:flex;gap:28px;align-items:center;font-size:14px}
nav .links a{text-decoration:none;color:var(--deep-mute)}
nav .links a:hover{color:var(--deep-fg)}
nav .btn{padding:11px 18px;font-size:14px}
nav .links a.btn,nav .links a.btn:hover{color:var(--deep)}
.lines{display:block;width:100%;height:auto;margin-top:8px}
.lines path{stroke-dasharray:2000;stroke-dashoffset:0;animation:draw 2.2s ease-out both}
@keyframes draw{from{stroke-dashoffset:2000}to{stroke-dashoffset:0}}
.hero{padding-block:28px 0;display:flex;flex-direction:column;gap:22px}
.hero .eyebrow{color:var(--signal);font-weight:500}
.hero h1{margin:0;font-family:var(--display);font-weight:400;font-size:clamp(34px,5.6vw,72px);line-height:1.02;letter-spacing:-.015em}
.hero h1 em{color:var(--gold)}
.hero p{margin:0;max-width:62ch;font-size:17px;line-height:1.6;color:var(--deep-fg)}
.hero p .lt{font-weight:300;color:var(--deep-mute)}
.hero .ctas{display:flex;gap:14px;flex-wrap:wrap;margin-top:6px}
.tl{padding-block:56px 64px}
.tl .line{position:relative;height:14px}
.tl .line::before{content:"";position:absolute;left:0;right:calc(-1 * max(24px,env(safe-area-inset-right,0px)) - 50vw);top:6px;height:2px;background:var(--signal)}
.tl .dots{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;position:absolute;inset:0}
.tl .dots span{width:13px;height:13px;border-radius:50%;background:var(--signal);display:block;margin-top:0}
.tl .dots span:last-child{background:var(--gold)}
.tl .labels{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:16px}
.tl .labels div{font-size:14px;line-height:1.5;color:var(--deep-mute)}
.tl .labels b{display:block;font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--deep-fg)}
.tl .labels small{display:block;font-size:13px;font-weight:300;color:var(--deep-mute);margin:2px 0 8px}
.tl .labels div:last-child b{color:var(--gold)}
.top{overflow-x:clip}

/* Buyer questions */
.asks{background:var(--stone)}
.asks .grid{display:grid;grid-template-columns:1fr 1.4fr;gap:56px;align-items:start}
.asks ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.asks li{font-family:var(--display);font-size:clamp(22px,2.6vw,30px);line-height:1.2;padding:14px 0;border-bottom:1px solid var(--rule)}
.asks li:last-child{border-bottom:0}
.asks .side{display:flex;flex-direction:column;gap:18px}
.asks .side p{margin:0;color:var(--mute);max-width:42ch}

/* Why it works */
.why{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:40px}
.w .big{font-family:var(--display);font-size:72px;line-height:.9;color:var(--signal)}
.w b{display:block;font-size:17px;margin:14px 0 8px;line-height:1.3}
.w p{margin:0;color:var(--mute);font-size:15px}

/* Benefits */
.ben{background:var(--paper)}
.outcomes{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;margin-top:40px}
.out{position:relative;border-top:1px solid var(--rule);padding-top:22px}
.out::before{content:"";position:absolute;top:-6px;left:50%;margin-left:-6px;width:12px;height:12px;border-radius:50%;background:var(--signal)}
.outcomes .out:nth-child(1)::before{left:12.5%}.outcomes .out:nth-child(2)::before{left:37.5%}.outcomes .out:nth-child(3)::before{left:62.5%}.outcomes .out:nth-child(4)::before{left:87.5%}
.out b{display:block;font-size:18px;margin-bottom:6px}
.out p{margin:0;color:var(--mute);font-size:15px}
.hold{display:grid;grid-template-columns:1fr 3fr;gap:40px;background:var(--stone);padding:36px 40px;margin-top:44px;align-items:start}
.hold .lede{font-family:var(--display);font-size:25px;line-height:1.25}
.hold .lede b{font-weight:700}
.hold .lede strong{font-weight:700;color:var(--deep)}
.holds{display:grid;grid-template-columns:1fr 1fr;gap:16px 28px;margin:0;padding:0;list-style:none}
.holds li{display:grid;grid-template-columns:10px 1fr;gap:12px;font-size:15px;line-height:1.5}
.holds li::before{content:"";width:10px;height:10px;background:var(--signal);margin-top:7px}

/* Outlast */
.intro{max-width:66ch;margin:28px 0 0;font-size:17px}
.intro.third{font-weight:600;color:var(--deep);margin-top:14px}
.tablewrap{overflow-x:auto;margin-top:32px}
table{border-collapse:collapse;width:100%;min-width:640px;font-size:15px;table-layout:fixed}
th,td{text-align:left;padding:14px 16px;border-bottom:1px solid var(--rule);vertical-align:top;line-height:1.45}
th{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
th:first-child,td:first-child{padding-left:0;color:var(--mute);font-weight:600;width:25%}
th.us,td.us{background:var(--deep);color:var(--deep-fg);border-bottom-color:rgba(244,243,238,.18)}
th.us{color:var(--signal)}
tr:last-child td{border-bottom:0}
th .ico{display:inline-flex;align-items:center;gap:8px}
th .ico svg{width:18px;height:18px}
.cap{font-size:14px;color:var(--mute);font-style:italic;margin:18px 0 0;max-width:80ch}

/* Who you get: the split */
.who-head{padding-block:88px 40px}
.split{display:grid;grid-template-columns:1fr 1fr}
.half{padding:64px max(24px,6vw) 72px;display:flex;flex-direction:column;gap:18px}
.half .stats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:10px}
.half .stats div{display:flex;flex-direction:column;gap:4px;font-size:13px;line-height:1.4}
.kh .stats div{font-size:12.5px}
.half .go{margin-top:8px;font-weight:600;text-decoration:none;align-self:flex-start}
.an{background:var(--an-cream);color:var(--an-deep);font-family:var(--an-sans)}
.an .lab{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--an-teal);font-weight:500}
.an h3{margin:0;font-family:var(--an-display);font-weight:600;font-size:clamp(34px,3.6vw,46px);line-height:1.08;color:var(--an-teal)}
.an .role{font-family:var(--an-display);font-style:italic;font-size:20px;color:var(--an-deep)}
.an p{margin:0;font-size:16px;font-weight:400;line-height:1.65;color:#333;max-width:46ch}
.an .rule{width:56px;height:3px;background:var(--an-gold)}
.an .stats b{font-family:var(--an-display);font-size:32px;color:var(--an-teal);font-weight:600}
.an .stats span{color:#333}
.an .go{color:var(--an-deep);border-bottom:2px solid var(--an-gold);padding-bottom:2px}
.kh{background:var(--kh-turq);color:var(--kh-black);font-family:var(--kh-sans)}
.kh .lab{font-size:12px;letter-spacing:.2em;text-transform:uppercase;font-weight:700}
.kh h3{margin:0;font-weight:800;font-size:clamp(34px,3.6vw,46px);line-height:1.05;letter-spacing:-.02em}
.kh h3 .hl{background:linear-gradient(transparent 62%, var(--kh-yellow) 62%, var(--kh-yellow) 92%, transparent 92%)}
.kh .role{font-weight:300;font-size:20px}
.kh p{margin:0;font-size:15px;font-weight:400;line-height:1.75;max-width:46ch;color:var(--kh-black)}
.kh .rule{width:56px;height:3px;background:var(--kh-black)}
.kh .stats b{font-size:30px;font-weight:800;letter-spacing:-.02em}
.kh .go{color:var(--kh-black);border-bottom:3px solid #F18C4F;padding-bottom:2px}
.together{background:var(--deep);color:var(--deep-fg)}
.together .inner{padding-block:30px;display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;align-items:center}
.together p{margin:0;font-family:var(--display);font-size:clamp(22px,2.4vw,28px);line-height:1.25;max-width:52ch}
.together .lockup{color:var(--deep-fg)}

/* Case */
.case{background:var(--stone)}
.proof{display:grid;grid-template-columns:1fr 1fr;gap:56px;margin-top:36px;align-items:start}
.story h3{margin:0 0 14px;font-family:var(--display);font-weight:400;font-size:30px;line-height:1.15}
.story p{margin:0 0 14px;font-size:16px}
.facts{display:flex;flex-direction:column;gap:20px}
.proof{align-items:stretch}.facts .q{margin-top:auto}
.built ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;border-top:1px solid var(--rule);padding-top:16px}
.built li{position:relative;padding-left:22px;font-size:16px;line-height:1.45}
.built li::before{content:"";position:absolute;left:0;top:.5em;width:9px;height:9px;background:var(--signal)}
.casewho{display:block;font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--mute);margin-bottom:10px}
.more{display:grid;grid-template-columns:1fr 1fr;gap:56px;margin-top:56px;padding-top:40px;border-top:1px solid var(--rule)}
.mini{display:flex;flex-direction:column}.mini p{flex:1}
.mini h3{margin:0 0 12px;font-family:var(--display);font-weight:400;font-size:26px;line-height:1.15}
.mini p{margin:0 0 18px;font-size:16px}
.mini .row{display:flex;gap:28px;flex-wrap:wrap}
.mini .row .fact{flex:1 1 180px}
@media (max-width:820px){.more{grid-template-columns:1fr;gap:40px}}
.fact{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start;border-top:1px solid var(--rule);padding-top:16px}
.fact b{font-family:var(--display);font-size:44px;line-height:1;font-weight:400;color:var(--deep);min-width:2.6ch}
.fact span{font-size:15px;color:var(--mute)}
.fact span i{font-style:normal;color:var(--ink)}
.q{border-left:3px solid var(--gold);padding-left:18px;font-family:var(--display);font-size:22px;line-height:1.3;margin-top:6px}
.q small{display:block;font-family:var(--sans);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin-top:10px;font-weight:700}

.faq{display:grid;grid-template-columns:1fr 1fr;gap:8px 56px;margin-top:36px}
.faq div{border-top:1px solid var(--rule);padding-block:18px 10px}
.faq h3{margin:0 0 8px;font-family:var(--display);font-weight:400;font-size:23px;line-height:1.2}
.faq p{margin:0;color:var(--mute);font-size:15.5px;max-width:52ch}

/* CTA + footer */
.cta{background:var(--deep);color:var(--deep-fg)}
.cta .inner{padding-block:80px;display:grid;grid-template-columns:1.4fr 1fr;gap:40px;align-items:center}
.cta h2{margin:0;font-family:var(--display);font-weight:400;font-size:clamp(34px,4.4vw,52px);line-height:1.05}
.cta p{margin:14px 0 0;color:var(--deep-mute);max-width:52ch}
.book{background:rgba(244,243,238,.06);box-shadow:inset 0 0 0 1px rgba(244,243,238,.16);padding:26px;display:flex;flex-direction:column;gap:14px}
.book .slots{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.book .slots span{font-size:13px;text-align:center;padding:9px 6px;box-shadow:inset 0 0 0 1px rgba(244,243,238,.3);color:var(--deep-fg)}
.book small{color:var(--deep-mute);font-size:12px}
footer .inner{padding-block:28px 36px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;align-items:center}
footer .names{font-size:13px;letter-spacing:.16em;text-transform:uppercase}
footer .names .lt{font-weight:300}
footer .names .hv{font-weight:700}
footer .names .sep{color:var(--rule);margin:0 10px}
footer .c{font-size:13px;color:var(--mute);text-align:right}

.photo{width:132px;height:132px;border-radius:50%;object-fit:cover;display:block}
.an .photo{box-shadow:0 0 0 4px var(--an-cream),0 0 0 6px var(--an-gold)}
.kh .photo{box-shadow:0 0 0 5px #FFFFFF}
.half .idrow{display:flex;align-items:center;gap:22px}
.half .idrow > div{display:flex;flex-direction:column;gap:6px}
.kh .rule{background:#F18C4F}

@media (max-width:860px){
  nav .links a:not(.btn){display:none}
  .asks .grid,.proof,.cta .inner,.hold{grid-template-columns:1fr;gap:28px}
  .why{grid-template-columns:1fr;gap:28px}
  .outcomes{grid-template-columns:1fr 1fr}
  .tl .labels{grid-template-columns:1fr 1fr;row-gap:22px}
  .split{grid-template-columns:1fr}
  .holds{grid-template-columns:1fr}
  .faq{grid-template-columns:1fr}
  section{padding-block:64px}
  footer .c{text-align:left}
}
@media (max-width:480px){
  .outcomes,.half .stats{grid-template-columns:1fr}
}
@media (prefers-reduced-motion: reduce){ .lines path{animation:none} html{scroll-behavior:auto} }
/* Bios (Oct. 23): both halves keep their own colors but share the joint type, so neither reads as a different brand. */
.an,.kh{font-family:var(--sans)}
.an h3,.kh h3,.an .stats b,.kh .stats b{font-family:var(--display);font-weight:600;letter-spacing:-.025em}
.an h3,.kh h3{font-size:clamp(34px,3.6vw,46px);line-height:1.08}
.an .role,.kh .role{font-family:var(--sans);font-style:normal;font-weight:400;font-size:20px}
.an p,.kh p{font-size:16px;line-height:1.7;font-weight:400}
.an .stats b,.kh .stats b{font-size:32px}
.kh h3 .hl{background:none}
/* Who-you-get bar: more room left and right */
.together .inner{box-sizing:border-box;padding:40px max(64px,7vw)}
.together .inner{flex-wrap:nowrap}
.together p{flex:1;min-width:0}
.together .lockup{flex-shrink:0}
@media (max-width:860px){.together .inner{flex-wrap:wrap;padding:32px 24px}}
/* FAQ (Oct. 23): copy on the left, an accordion of questions on the right */
.faqwrap{display:grid;grid-template-columns:1fr 1.6fr;gap:64px;align-items:start}
.faqwrap .side{display:flex;flex-direction:column;gap:18px;position:sticky;top:24px}
.faqwrap .side p{margin:0;color:var(--mute);max-width:38ch;font-size:17px}
.acc{border-top:1px solid var(--rule)}
.acc details{border-bottom:1px solid var(--rule)}
.acc summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:22px 0;font-family:var(--display);font-weight:600;letter-spacing:-.02em;font-size:22px;line-height:1.25;color:var(--ink)}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"+";font-family:var(--sans);font-weight:300;font-size:30px;line-height:1;color:var(--deep);flex-shrink:0}
.acc details[open] summary::after{content:"\2212"}
.acc summary:focus-visible{outline:2px solid var(--signal);outline-offset:4px}
.acc details p{margin:0 0 22px;color:var(--mute);font-size:16px;max-width:60ch}
@media (max-width:860px){.faqwrap{grid-template-columns:1fr;gap:28px}.faqwrap .side{position:static}}
/* Oct. 23, round 2 */
#how{scroll-margin-top:0}
.together .inner{justify-content:space-between;padding-left:max(24px,env(safe-area-inset-left,0px));padding-right:max(24px,env(safe-area-inset-right,0px))}
.together p{flex:0 0 66.666%;max-width:none}
/* Bios: content lines up with the page column above at any width; each half takes half the column */
.split .an{padding:64px 48px 72px max(24px,calc((100vw - var(--w)) / 2))}
.split .kh{padding:64px max(24px,calc((100vw - var(--w)) / 2)) 72px 64px}
.an p,.kh p{max-width:52ch}
/* Bio rule and headshot ring in the joint gold, the same for both */
.an .rule,.kh .rule{width:56px;height:3px;background:var(--gold)}
.an .photo,.kh .photo{box-shadow:0 0 0 7px #FBFBF8,0 0 0 12px var(--gold)}
.half .idrow{gap:34px;padding-left:12px}
/* Case minis: headings, text and the rules above the stats line up across both */
.more{grid-template-rows:auto auto 1fr auto;row-gap:0}
.mini{display:grid;grid-row:span 4;grid-template-rows:subgrid}
.mini p{flex:none}
.mini .row{align-self:start}
/* Plan box: three equal columns */
.hold{grid-template-columns:1fr 2fr;gap:40px}
.holds{column-gap:40px}
table{min-width:760px}
@media (max-width:860px){.split .an,.split .kh{padding:56px 24px}.together p{flex:1 1 auto}.hold{grid-template-columns:1fr}}
/* Oct. 23, round 3 */
.intro.third{margin-top:28px}
.intro.third + .intro{margin-top:14px}
th:first-child,td:first-child{width:auto}
.hold{align-items:center}
.cap{max-width:none}
.an .photo,.kh .photo{box-shadow:0 0 0 7px #FBFBF8,0 0 0 12px var(--gold)}
/* Oct. 23: the deck's line, two rising lines ending in two points (gold above, turquoise below) */
.lines{max-height:170px}
.lines circle{animation:dotin .5s 1.9s ease-out both}
@keyframes dotin{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion: reduce){.lines circle{animation:none}}
/* Coral #E0775A: the third accent (Oct. 23). Accent only, never body text on light backgrounds. */
:root{--coral:#E0775A}
/* Oct. 23, round 4 */
.half .idrow > div .rule{margin-top:10px}
.cta{overflow:hidden}
.ctalines{display:block;width:100%;height:auto;max-height:150px;margin:0}
.ctalines path,.ctalines circle{animation:none;stroke-dasharray:none}
.cta .inner{padding-top:24px}
th .ico{align-items:flex-start}
th .ico svg{margin-top:-1px}
/* A4 header (Nov. 4): the marks page's website header. Stone ground, Two Points in the nav, the Year1 badge (C2) beside a straight four-stage rule that runs off the right edge. Mark colors on light are the marks page's: turquoise #3FB5A2, gold text #93690A. */
.top.a4{background:var(--stone);color:var(--ink)}
.a4 nav.inner{padding-block:18px}
.a4 .tpnav{display:block;line-height:0}
.a4 .tpnav svg{height:34px;width:auto;display:block}
.a4 nav .links a{color:var(--ink);font-weight:500}
.a4 nav .links a:hover{color:var(--deep)}
.a4 nav .links a.btn,.a4 nav .links a.btn:hover{color:var(--deep);font-weight:700}
.a4 .navrule{border-top:1px solid #CFCBC0}
.a4 .y1row{display:grid;grid-template-columns:auto 1fr;gap:72px;align-items:center;padding-block:64px 8px}
.a4 .y1badge svg{display:block;height:100px;width:auto}
.a4 .stages{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);position:relative}
.a4 .stages::before{content:"";position:absolute;left:-40px;right:calc(-50vw - 24px);top:8px;height:2.5px;background:#3FB5A2}
.a4 .stages li{position:relative;padding-top:34px;text-align:center;display:flex;flex-direction:column;gap:2px}
.a4 .stages li::before{content:"";position:absolute;top:4px;left:50%;width:10px;height:10px;margin-left:-5px;border-radius:50%;background:var(--deep)}
.a4 .stages li:last-child::before{top:1px;width:16px;height:16px;margin-left:-8px;background:var(--gold)}
.a4 .stages b{font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--mute)}
.a4 .stages small{font-size:13px;color:var(--mute)}
.a4 .hero{padding-block:44px 88px;gap:14px}
.a4 .hero h1{color:var(--deep);font-size:clamp(34px,4.6vw,60px);line-height:1.04}
.a4 .hero p.sub{font-size:19px;color:var(--mute);max-width:60ch}
.a4 .hero p.own{font-size:20px;font-weight:700;color:#93690A}
.a4 .hero .ctas{margin-top:14px}
.a4 .btn.ghost{color:var(--deep);box-shadow:inset 0 0 0 1px var(--deep)}
.a1mark{display:block;line-height:0;flex-shrink:0}
.a1mark svg{display:block;height:40px;width:auto}
@media (max-width:860px){
  .a4 .y1row{grid-template-columns:1fr;gap:36px;padding-top:44px}
  .a4 .y1badge svg{height:72px}
  .a4 .stages::before{left:0}
  .a4 .stages li{text-align:left}
  .a4 .stages li::before{left:0;margin-left:0}
  .a4 .stages li:last-child::before{margin-left:0;top:1px}
  .a4 .stages b{letter-spacing:.12em;font-size:11px}
  .a4 .hero{padding-block:32px 64px}
}
@media (max-width:480px){.a4 .tpnav svg{height:28px}.a1mark svg{height:32px}}
/* Nov. 4, Kate's comments: full Two Points Marketing wordmark in the nav, the Year1 badge as its nav link, and the hero back on petrol (nav and Sound familiar stay stone). */
.a4 .tpnav svg{height:46px}
.a4 nav .links a.y1nav{display:inline-flex;align-items:center;line-height:0}
.a4 .y1nav svg{height:22px;width:auto;display:block}
.a4hero{background:var(--deep);color:var(--deep-fg)}
.a4hero .stages::before{background:var(--signal)}
.a4hero .stages li::before{background:var(--deep-fg)}
.a4hero .stages li:last-child::before{background:var(--gold)}
.a4hero .stages b{color:var(--deep-fg)}
.a4hero .stages li:last-child b{color:var(--gold)}
.a4hero .stages small{color:var(--deep-mute)}
.a4hero .hero h1{color:var(--deep-fg)}
.a4hero .hero p.sub{color:var(--deep-mute)}
.a4hero .hero p.own{color:var(--gold)}
.a4hero .btn.ghost{color:var(--deep-fg);box-shadow:inset 0 0 0 1px rgba(244,243,238,.5)}
@media (max-width:860px){.a4 nav .links a.y1nav{display:none}}
@media (max-width:480px){.a4 .tpnav svg{height:38px}}
/* Nov. 4, matching the one-pager: section heads without periods, the Year1 badge in the Benefits head and the table header. */
.head h2 .y1inline{display:inline-block;height:1.3em;width:auto;vertical-align:-.3em}
th.us .y1th{display:block;height:28px;width:auto;margin-top:-5px}
/* Nov. 4, Kate: hero leads with the headline; the Year1 badge and stage rule close the petrol band, below the buttons. */
.a4 .hero{padding-block:72px 8px}
.a4 .y1row{padding-block:56px 80px}
@media (max-width:860px){.a4 .hero{padding-block:48px 0}.a4 .y1row{padding-block:40px 56px}}