/* Ontario Business Brokers — campaign design system
   Tokens sampled from ontariobusinessbrokers.ca (navy/gold, Roboto/Inter).
   Contrast verified: gold #DDAB2C on navy #1F3051 = 6.21:1 · on #151C28 = 7.94:1
   Type-size floor enforced: reading >=15px, inputs >=16px, fine print >=11.5px. */

:root{
  --navy:#1F3051;
  --navy-deep:#122549;
  --ink:#151C28;
  --ink-2:#1A2333;
  --gold:#DDAB2C;
  --gold-hi:#E7AB17;
  --paper:#FFFFFF;
  --bone:#F4F2ED;
  --line:rgba(255,255,255,.10);
  --line-strong:rgba(255,255,255,.20);
  --mute:rgba(255,255,255,.62);
  --mute-2:rgba(255,255,255,.56);
  --display:'Roboto',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;
  --body:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;
  --wrap:1180px;
  --pad:clamp(20px,5vw,40px);
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--ink);color:#fff;
  font-family:var(--body);font-size:17px;line-height:1.62;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad)}

/* ---------- type ---------- */
h1,h2,h3,h4{font-family:var(--display);margin:0;line-height:1.1;letter-spacing:-.018em;font-weight:700}
h1{font-size:clamp(2.05rem,5.4vw,3.85rem)}
h2{font-size:clamp(1.7rem,3.8vw,2.65rem);line-height:1.13}
h3{font-size:clamp(1.15rem,2vw,1.4rem);line-height:1.25}
p{margin:0 0 1.05em}
.lede{font-size:clamp(1.06rem,1.9vw,1.28rem);line-height:1.6;color:var(--mute);max-width:60ch}
.eyebrow{
  font-family:var(--body);font-size:.72rem;font-weight:600;text-transform:uppercase;
  letter-spacing:.19em;color:var(--gold);margin:0 0 .95rem;display:block;
}
.eyebrow.q{color:var(--mute-2)}
.body-2{font-size:1rem;line-height:1.65;color:var(--mute)}
.fine{font-size:.75rem;line-height:1.55;color:var(--mute-2)}   /* 12.75px >= 11.5 floor */
strong{color:#fff;font-weight:600}
.gold{color:var(--gold)}

/* ---------- shell ---------- */
section{padding:clamp(58px,8vw,104px) 0;position:relative}
.panel{background:var(--ink-2)}
.paper{background:var(--bone);color:var(--navy)}
.paper h1,.paper h2,.paper h3{color:var(--navy)}
.paper .lede,.paper .body-2{color:#4A5568}
.paper .fine{color:#5A6478}
.paper strong{color:var(--navy)}
.paper .eyebrow.q{color:#7A8496}
.rule{height:1px;background:var(--line);border:0;margin:0}

/* ---------- nav ---------- */
.nav{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:16px var(--pad);max-width:var(--wrap);margin:0 auto;
}
.nav img{height:34px;width:auto}
.nav-right{display:flex;align-items:center;gap:14px;flex-shrink:0}
.nav-tel{
  font-size:.95rem;font-weight:600;text-decoration:none;color:#fff;white-space:nowrap;
  border-bottom:1px solid var(--gold);padding-bottom:2px;
}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6em;
  font-family:var(--body);font-size:.98rem;font-weight:600;letter-spacing:.005em;
  padding:16px 30px;border-radius:6px;text-decoration:none;border:1px solid transparent;
  cursor:pointer;transition:transform .16s ease,background .16s ease;line-height:1.2;
}
.btn-primary{background:var(--gold);color:#151C28;border-color:var(--gold)}
.btn-primary:hover{background:var(--gold-hi);transform:translateY(-1px)}
.btn-ghost{background:transparent;color:#fff;border-color:var(--line-strong)}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold)}
.paper .btn-ghost{color:var(--navy);border-color:rgba(31,48,81,.28)}
.btn-lg{padding:19px 38px;font-size:1.04rem}
.btn-row{display:flex;flex-wrap:wrap;gap:14px;align-items:center}

/* ---------- hero ---------- */
.hero{padding:clamp(46px,7vw,86px) 0 clamp(40px,6vw,64px)}
.hero h1{max-width:17ch}
.hero .lede{margin-top:1.4rem}
.hero-cta{margin-top:2.2rem}

/* stat rail */
.rail{display:flex;flex-wrap:wrap;gap:clamp(24px,5vw,58px);margin-top:2.6rem;padding-top:1.7rem;border-top:1px solid var(--line)}
.rail-i{min-width:104px}
.rail-v{font-family:var(--display);font-size:1.42rem;font-weight:700;font-variant-numeric:tabular-nums;color:#fff;line-height:1.1}
.rail-v.g{color:var(--gold)}
.rail-l{font-size:.7rem;text-transform:uppercase;letter-spacing:.15em;color:var(--mute-2);margin-top:.42rem;font-weight:600}

/* ---------- marquee ---------- */
.marq{overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0;background:var(--ink-2)}
.marq-t{display:flex;width:max-content;animation:marq 42s linear infinite}
.marq-t span{
  font-family:var(--display);font-weight:800;font-size:clamp(1rem,1.8vw,1.28rem);
  text-transform:uppercase;letter-spacing:.03em;color:rgba(255,255,255,.52);
  padding:0 26px;white-space:nowrap;display:flex;align-items:center;gap:26px;
}
.marq-t span::after{content:"";width:5px;height:5px;border-radius:50%;background:var(--gold);flex:none}
@keyframes marq{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.marq-t{animation:none}}

/* ---------- grids ---------- */
.grid{display:grid;gap:1px;background:var(--line)}
.grid.g2{grid-template-columns:repeat(2,1fr)}
.grid.g3{grid-template-columns:repeat(3,1fr)}
.grid.g4{grid-template-columns:repeat(4,1fr)}
.cell{background:var(--ink);padding:clamp(24px,3vw,34px)}
.panel .cell{background:var(--ink-2)}
.paper .grid{background:rgba(31,48,81,.16)}
.paper .cell{background:var(--bone)}
.cell h3{margin-bottom:.6rem}
.cell p:last-child{margin-bottom:0}
.num{font-family:var(--display);font-size:.9rem;font-weight:700;color:var(--gold);letter-spacing:.1em;display:block;margin-bottom:1rem}

/* ---------- steps ---------- */
.steps{border-top:1px solid var(--line);margin-top:2.4rem}
.step{display:grid;grid-template-columns:66px 1fr;gap:clamp(16px,3vw,34px);padding:26px 0;border-bottom:1px solid var(--line)}
.step-n{font-family:var(--display);font-size:.9rem;font-weight:700;color:var(--gold);letter-spacing:.1em;padding-top:.32rem}
.step h3{margin-bottom:.45rem}
.step p:last-child{margin-bottom:0}
.paper .steps,.paper .step{border-color:rgba(31,48,81,.16)}

/* ---------- tombstones ---------- */
.tomb{background:var(--ink);padding:26px 24px;text-align:center;border-top:2px solid var(--gold)}
.panel .tomb{background:var(--ink-2)}
.tomb-k{font-size:.72rem;text-transform:uppercase;letter-spacing:.16em;color:var(--mute-2);font-weight:600}
.tomb-n{font-family:var(--display);font-size:1.06rem;font-weight:700;margin:.5rem 0 .3rem;line-height:1.2}
.tomb-s{font-size:.95rem;color:var(--mute);margin-bottom:1rem}
.tomb-b{font-size:.98rem;color:var(--gold);font-weight:600}

/* ---------- quotes ---------- */
.q-card{background:var(--ink-2);padding:clamp(24px,3vw,32px);display:flex;flex-direction:column;gap:1rem}
.panel .q-card{background:var(--ink)}
.stars{color:var(--gold);letter-spacing:.22em;font-size:.94rem}
.q-card blockquote{margin:0;font-size:1.02rem;line-height:1.66;color:rgba(255,255,255,.9)}
.q-attr{font-size:.94rem;color:var(--mute-2);margin-top:auto;letter-spacing:.01em}
.paper .q-card{background:#fff}
.paper .q-card blockquote{color:var(--navy)}
.paper .q-attr{color:#6B7484}

/* ---------- CTA band ---------- */
.band{background:linear-gradient(140deg,var(--navy-deep) 0%,var(--navy) 62%,#25406B 100%);padding:clamp(52px,7vw,86px) 0}
.band h2{max-width:19ch}
.band .lede{color:rgba(255,255,255,.78)}

/* ---------- FAQ ---------- */
.faq{border-top:1px solid var(--line);margin-top:2.2rem}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{
  cursor:pointer;list-style:none;padding:22px 44px 22px 0;position:relative;
  font-family:var(--display);font-weight:700;font-size:1.06rem;line-height:1.35;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:8px;top:50%;transform:translateY(-50%);color:var(--gold);font-size:1.5rem;font-weight:400;line-height:1}
.faq details[open] summary::after{content:"–"}
.faq-a{padding:0 0 24px;max-width:74ch}
.faq-a p:last-child{margin-bottom:0}
.paper .faq,.paper .faq details{border-color:rgba(31,48,81,.16)}

/* ---------- form ---------- */
.form-card{background:var(--ink-2);padding:clamp(26px,4vw,42px);border-top:3px solid var(--gold)}
.paper .form-card{background:#fff;box-shadow:0 1px 3px rgba(31,48,81,.10)}
.f-row{display:grid;gap:16px;grid-template-columns:1fr 1fr;margin-bottom:16px}
.f-g{display:flex;flex-direction:column;gap:.45rem}
.f-g.full{grid-column:1/-1}
label{font-size:.94rem;font-weight:600;letter-spacing:.04em;color:rgba(255,255,255,.8)}
.paper label{color:var(--navy)}
input,select,textarea{
  font-family:var(--body);font-size:16px;   /* iOS zoom floor */
  padding:14px 15px;border-radius:5px;border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.05);color:#fff;width:100%;
}
.paper input,.paper select,.paper textarea{background:#fff;border-color:rgba(31,48,81,.24);color:var(--navy)}
input:focus,select:focus,textarea:focus{outline:2px solid var(--gold);outline-offset:1px;border-color:transparent}
.consent{display:flex;gap:11px;align-items:flex-start;margin:6px 0 18px}
.consent input{width:19px;height:19px;flex:none;margin-top:2px;accent-color:var(--gold)}
.consent span{font-size:.78rem;line-height:1.55;color:var(--mute-2)}
.paper .consent span{color:#5A6478}
.f-note{margin-top:14px;font-size:.94rem;color:var(--mute-2)}
.paper .f-note{color:#5A6478}
.f-msg{display:none;margin-top:14px;padding:13px 15px;border-radius:5px;background:rgba(221,171,44,.12);border:1px solid rgba(221,171,44,.4);font-size:.94rem;color:var(--gold)}
.paper .f-msg{color:#8A6A10}

/* ---------- sticky mobile bar ---------- */
.sticky{
  position:fixed;left:0;right:0;bottom:0;z-index:60;display:none;gap:1px;
  background:rgba(255,255,255,.14);
  box-shadow:0 -6px 22px rgba(0,0,0,.42);
  transform:translateY(100%);transition:transform .26s ease;
}
.sticky.on{transform:translateY(0)}
.sticky a{
  flex:1;text-align:center;padding:15px 8px;text-decoration:none;font-weight:600;
  font-size:.92rem;background:var(--ink-2);color:#fff;
}
.sticky a.p{background:var(--gold);color:#151C28}
@media(max-width:860px){.sticky{display:flex}body{padding-bottom:54px}}

/* ---------- footer ---------- */
footer{background:#0F141D;padding:clamp(42px,5vw,64px) 0 30px;border-top:1px solid var(--line)}
footer img{height:38px;margin-bottom:20px}
.f-cols{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:clamp(24px,4vw,48px);margin-bottom:32px}
.f-h{font-size:.72rem;text-transform:uppercase;letter-spacing:.16em;color:var(--gold);font-weight:600;margin-bottom:.9rem}
.f-cols p,.f-cols address{font-size:.94rem;line-height:1.72;color:var(--mute-2);font-style:normal;margin:0 0 .5rem}
.f-bot{border-top:1px solid var(--line);padding-top:22px;font-size:.75rem;color:var(--mute-2);line-height:1.6}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease}
.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}

/* ---------- responsive ---------- */
@media(max-width:900px){
  .grid.g4{grid-template-columns:repeat(2,1fr)}
  .grid.g3{grid-template-columns:1fr}
  .f-cols{grid-template-columns:1fr 1fr}
}
@media(max-width:620px){
  body{font-size:16px}
  .grid.g2,.grid.g4{grid-template-columns:1fr}
  .f-row{grid-template-columns:1fr}
  .f-cols{grid-template-columns:1fr}
  .step{grid-template-columns:44px 1fr;gap:14px}
  .nav img{height:28px}
  .nav-tel{font-size:.94rem}
  .btn{width:100%}
  .btn-row .btn{width:100%}
}

/* ---------- paper mode: the light register ----------
   Gold #DDAB2C on bone is 1.9:1 and unusable, so paper mode swaps to a dark gold.
   #7A5C0A on #F4F2ED = 5.58:1 (AA pass). */
.paper .eyebrow,.paper .num,.paper .step-n,.paper .gold,.paper .f-h{color:#7A5C0A}
.paper .stars{color:#7A5C0A}
.paper a{color:#7A5C0A}
/* .eyebrow.q is 0-3-0 and outranks .paper .eyebrow at 0-2-0, so it needs its own rule */
.paper .eyebrow.q{color:#6A5209}
.paper .rail{border-color:rgba(31,48,81,.18)}
.paper .rail-v{color:var(--navy)}
.paper .rail-v.g{color:#7A5C0A}
.paper .rail-l{color:#6B7484}
.paper .tomb{background:#fff;border-top-color:#7A5C0A}
.paper .tomb-k,.paper .tomb-s{color:#5A6478}
.paper .tomb-n{color:var(--navy)}
.paper .tomb-b{color:#7A5C0A}
.paper .q-attr{color:#6B7484}
.paper .bio-av{background:var(--navy);color:#DDAB2C}
.paper .bio-role{color:#7A5C0A}
