/* --- Numberline modern layer (2026-09-09) ----------------------------------------------------------
   The homepage redesign, generalized: Plus Jakarta Sans at medium weights, near-black copy (no gray body
   text), pill buttons, soft gray panels instead of bordered cards, a Signal Blue press band, and one type
   system for nav and footer. Loaded AFTER canon.css on every page except the homepage (which carries the
   same system inline as body.home2), scoped to body.m2 so it outranks canon's shared components.
   Edit HERE, never per page. ------------------------------------------------------------------------ */
.m2{--panel:#F5F5F7;--ink:#111114;--body:#1D1D1F;--muted:#6E6E76;--line:#E6E6EB;--display:'Plus Jakarta Sans',var(--sans);color:var(--ink);-webkit-font-smoothing:antialiased;}
/* type */
.m2 h1,.m2 h2,.m2 h3,.m2 h4{font-family:var(--display);font-weight:500;letter-spacing:-.03em;text-wrap:balance;color:var(--ink);}
.m2 h1{font-size:clamp(2.4rem,5vw,3.9rem);line-height:1.06;}
.m2 h2{line-height:1.08;}
.m2 h3{letter-spacing:-.02em;}
/* page-level heading rules that outrank the generic ones above (about, legal, forms, auth, status, pricing) */
.m2 header.about-hero h1,.m2 .ch h2,.m2 .ea-form-card .fc-head h2,.m2 article.legal h2,.m2 article.legal h3,.m2 .auth-card h1,.m2 .sec-head h1,.m2 .quote h3,.m2 .faq h2,.m2 .st-hero h1,.m2 .legal-hero h1,.m2 h1[style]{font-weight:500!important;}
.m2 .jx-plan li,.m2 .plans-note{font-weight:500;}
.m2 .plans-note .ck{background:var(--cta);color:#fff;border-radius:50%;} .m2 .plans-note .ck svg{width:11px;height:11px;stroke-width:3;} .m2 .plans-note li{gap:10px;}
.m2 .qcmp-sec .sec-head{text-align:center;max-width:720px;margin:0 auto 36px;}
.m2 .upd{font-weight:400;color:var(--body);}
.m2 header.about-hero .cred,.m2 .cred,.m2 .pfx-note,.m2 .tips-note,.m2 .qcmp-foot,.m2 .avail,.m2 .ea-form-fine{color:var(--body);font-weight:400;}
.m2 .eyebrow{border-radius:999px;font-weight:600;letter-spacing:.06em;font-size:.8rem;}
.m2 .hero-sub,.m2 .hero-answer,.m2 .lede,.m2 .sec-head p,.m2 .jx-head p,.m2 .jx-hero p,.m2 .step-copy>p,.m2 .fsub p,.m2 .fcard p,.m2 .feat p,.m2 .faq-q .ans,.m2 .pdesc,.m2 .rc-sub,.m2 .closer-card p,.m2 .pr p,.m2 .cta-sub,.m2 .sec-p,.m2 .sec-sub,.m2 .flow-foot,.m2 .nvl-foot,.m2 .ready-in p,.m2 .next-in p,.m2 .fdev p,.m2 .ig-bd p,.m2 .why-card p,.m2 .ea-what p,.m2 .grow-note,.m2 .qa .a,.m2 .rel-col span,.m2 .device-list li,.m2 .hero-checks li,.m2 .hero-bullets li,.m2 .ac-card p,.m2 .ac-near,.m2 .serve-list li,.m2 .rel-list dd,.m2 .rel-body p,.m2 .commit li,.m2 .st-sub,.m2 .empty,.m2 .card p,.m2 .legend,.m2 .hstep-desc,.m2 .step-list li small,.m2 .fc-head p,.m2 .ea-hero-note,.m2 .ea-form-fine,.m2 .ea-confirm p{color:var(--body);}
.m2 .hero-sub,.m2 .hero-answer,.m2 .lede,.m2 .jx-hero p{font-weight:400;font-size:clamp(1.08rem,1.5vw,1.25rem);line-height:1.55;}
.m2 .hero-sub b,.m2 .lede b,.m2 .hero-answer b{font-weight:500;color:var(--ink);}
.m2 .sec-head p,.m2 .jx-head p,.m2 .step-copy>p{font-weight:400;}
.m2 .hero-checks li,.m2 .hero-bullets li,.m2 .device-list li{font-weight:500;}
.m2 .cta-sub{font-weight:400;}
/* buttons: pill, medium weight */
.m2 .btn{border-radius:999px;font-weight:600;letter-spacing:-.01em;}
.m2 .btn-lg{padding:16px 30px;font-size:1.05rem;}
.m2 .btn-secondary,.m2 .btn-ghost{background:#fff;border:1.5px solid #D9D9E0;color:var(--ink);}
.m2 .btn-secondary:hover,.m2 .btn-ghost:hover{border-color:var(--ink);color:var(--ink);}
.m2 .cta-link,.m2 .link-arrow,.m2 .m-link{font-weight:600;}
/* nav */
.m2 nav .nav-links a{font-weight:500;font-size:.98rem;color:var(--body);letter-spacing:-.01em;}
.m2 nav .nav-cta{border-radius:999px;font-weight:600!important;padding:11px 20px;}
.m2 .lw{letter-spacing:.02em;}
/* press band: canon.css owns the Signal Blue marquee now */
/* numbered step tiles: solid Signal Blue so the number reads at a glance (owner 2026-09-09) */
.m2 .step .sn{background:var(--cta);color:#fff;}
.m2 .pr-n,.m2 .steps-grid .step .sn{width:44px;height:44px;border-radius:50%;background:var(--cta);color:#fff;font-size:1.05rem;font-weight:700;letter-spacing:0;padding:0;display:inline-grid;place-items:center;}
/* cards become soft panels */
.m2 .fcard,.m2 .feat,.m2 .rm-card,.m2 .quote,.m2 .why-card,.m2 .ac-card,.m2 .nvl-col,.m2 .fsub,.m2 .ig,.m2 .faq-q,.m2 .il,.m2 .card,.m2 .check,.m2 .ea-form-card,.m2 .ea-confirm,.m2 .pr,.m2 .glance-tiles .hstep,.m2 .fnlist-card{border-color:transparent;background:var(--panel);box-shadow:none;border-radius:20px;}
/* Feature cards (.fgrid > .fcard > .fd), owner 2026-09-11: the illustration sits directly on the panel (no white box around a white box),
   the inner UI detail is one clean white card, and the heading and copy get real size and breathing room. */
.m2 .fcard{padding:22px 22px 24px;gap:0;}
.m2 .fcard .fd,.m2 .fd{background:transparent;border:0;padding:0;min-height:0;margin-bottom:18px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;}
@media(min-width:601px){.m2 .fcard .fd,.m2 .fd{height:132px;margin-bottom:14px;}}
.m2 .fd-call>div{flex:1;min-width:0;}
@media(max-width:600px){.m2 .fd-call b{font-size:.88rem;} .m2 .fd-out small{font-size:.74rem;}}
.m2 .fcard h3{font-size:1.2rem;line-height:1.25;margin-bottom:8px;}
.m2 .fcard p{font-size:1rem;line-height:1.55;}
.m2 .fd-call,.m2 .fd-vm,.m2 .fd-out,.m2 .fd-cid{border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:#fff;}
.m2 .fd-call b{font-size:.92rem;} .m2 .fd-call small,.m2 .fd-out small{font-size:.78rem;}
.m2 .fd-vm{font-size:.86rem;line-height:1.45;} .m2 .fd-vm .fd-att{display:block;width:max-content;margin-top:10px;font-size:.72rem;}
.m2 .fd-out{gap:12px;} .m2 .fd-out>div{flex:1;min-width:0;} .m2 .fd-out .fd-num{font-size:.92rem;}
.m2 .fd-fwd{gap:6px;} .m2 .fd-fwd span{background:#fff;border-color:var(--line);padding:8px 12px;font-size:.88rem;border-radius:10px;}
.m2 .fd-int{gap:8px;} .m2 .fd-int span{background:#fff;border-color:var(--line);padding:7px 12px;font-size:.84rem;}
.m2 .fd-menu{gap:8px 10px;} .m2 .fd-menu b{font-size:.92rem;}
.m2 .fgrid{gap:16px;}
@media(max-width:600px){.m2 .fgrid{gap:14px;} .m2 .fcard{padding:20px 20px 22px;} .m2 .fcard .fd{margin-bottom:16px;}}
.m2 .faq-q{margin-bottom:10px;} .m2 .faq-q summary{font-weight:500;font-size:1.05rem;padding:20px 22px;} .m2 .faq-q .ans{font-size:1rem;}
.m2 .fsubs-more summary{font-weight:600;}
.m2 .step-tag .num{border-radius:14px;font-weight:600;}
.m2 .fsub b,.m2 .fcard h3,.m2 .feat h3,.m2 .rm-card b,.m2 .why-card h3,.m2 .ac-card b,.m2 .ig-bd h3,.m2 .quote h3,.m2 .card b,.m2 .pr h3{font-weight:500;letter-spacing:-.02em;}
/* plan cards: soft panel, Grow keeps its ring */
.m2 .jx-plan{border-color:transparent;background:var(--panel);box-shadow:none;border-radius:24px;}
.m2 .jx-plan.pop{background:#fff;border:2px solid var(--cta);}
.m2 .jx-plan .pname{font-weight:500;letter-spacing:-.02em;}
.m2 .pcta{border-radius:999px;font-weight:600;}
.m2 .ctable th,.m2 .ctable td{border-color:#ECECF0;}
/* closer + reliability */
.m2 .closer-card{background:var(--panel);border:0;border-radius:36px;}
.m2 .closer-card h2{font-size:clamp(2rem,4.2vw,3.4rem);letter-spacing:-.035em;line-height:1.06;max-width:18ch;margin-left:auto;margin-right:auto;font-weight:500;}
.m2 .closer-card p{font-size:1.15rem;font-weight:400;max-width:44ch;}
.m2 .nup-stamp{display:none;}
/* closer: tighter card, same filled check marks as the hero lists */
.m2 .closer-card{padding:64px 48px 60px;}
.m2 .closer-card h2{margin-bottom:14px;}
.m2 .closer-card p{margin:0 auto 26px;}
.m2 .closer-micro{margin-top:24px;gap:12px 26px;font-size:.98rem;font-weight:500;color:var(--ink);}
.m2 .closer-micro span{display:inline-flex;align-items:center;gap:10px;color:var(--ink);}
.m2 .closer-micro svg{width:20px;height:20px;padding:5px;box-sizing:border-box;border-radius:50%;background:var(--cta);color:#fff;stroke-width:3;}
@media(max-width:620px){.m2 .closer-card{padding:44px 24px 40px;} .m2 .closer-micro{flex-direction:column;align-items:flex-start;gap:10px;width:max-content;max-width:100%;margin-left:auto;margin-right:auto;}}
.m2 .rel{border:0;} .m2 .rel-col b{font-weight:500;} .m2 .rel-col .rel-big{font-weight:600;} .m2 .rel-col + .rel-col{border-left:1px solid var(--line);}
/* footer */
.m2 footer{border-top:1px solid var(--line);}
.m2 .foot-brand p{color:var(--body);font-weight:400;font-size:.98rem;line-height:1.6;}
.m2 .foot-col h5{color:var(--muted);font-weight:600;font-size:.72rem;letter-spacing:.14em;margin-bottom:16px;}
.m2 .foot-col a{color:var(--body);font-weight:500;font-size:.98rem;margin-bottom:11px;letter-spacing:-.01em;}
.m2 .foot-col a:hover{color:var(--cta);}
.m2 .foot-join input{border-radius:999px;padding:13px 18px;border-color:#D9D9E0;}
.m2 .foot-join .btn{border-radius:999px;padding:13px 18px;}
.m2 .foot-base{color:var(--muted);font-size:.9rem;}
.m2 .foot-legal a{font-weight:500;color:var(--body);}
/* forms */
.m2 .ea-input,.m2 .ea-hero-form input,.m2 .contact-form input,.m2 .contact-form textarea,.m2 input[type=email],.m2 input[type=text]{border-radius:16px;}
.m2 .ea-hero-form input{border-radius:999px;}
.m2 .btn-submit,.m2 .ea-submit{border-radius:999px;font-weight:600;}
/* landing heroes: breathing room above the eyebrow, and the reassurance line under the CTAs becomes a check list */
.m2 .hero:has(.hero-grid){padding-top:64px;}
/* the press band never touches the hero: a little air below every hero that precedes it */
.m2 .hero:has(+ .strip),.m2 .ea-hero:has(+ .strip),.m2 header:has(+ .strip){padding-bottom:72px;}
/* two-column landing hero: the copy column gets more room and the headline sizes to it (3 lines, not 5) */
.m2 .hero-grid{grid-template-columns:1.15fr 1fr;gap:56px;}
.m2 .hero-grid h1{font-size:clamp(2.2rem,3.6vw,3.15rem);line-height:1.08;letter-spacing:-.03em;max-width:16ch;}
.m2 .glance h1{font-size:clamp(2.2rem,4.4vw,3.5rem);max-width:26ch;margin-left:auto;margin-right:auto;}
.m2 .cta-sub{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:inherit;align-items:center;gap:10px 26px;text-align:left;margin-top:0;font-size:.98rem;font-weight:500;color:var(--ink);line-height:1.3;}
.m2 .glance .cta-sub,.m2 .jx-acts+.cta-sub{justify-content:center;}
.m2 .cta-sub .dot,.m2 .cta-sub i{display:none;}
.m2 .jx-acts+.cta-sub{margin-top:20px;}
/* one guillemet, drawn lighter so Plus Jakarta Sans does not read it as two arrows */
.m2 .btn-guillemet{font-size:1em;font-weight:500;}
.m2 .cta-sub>span{display:inline-flex;align-items:center;gap:10px;white-space:nowrap;}
.m2 .cta-sub>span::before{content:"";width:20px;height:20px;border-radius:50%;flex:none;background:var(--cta) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E") center/11px no-repeat;}
.m2 .hero-bullets li{font-weight:500;font-size:.98rem;gap:10px;} .m2 .hero-bullets .ck{background:var(--cta);color:#fff;border-radius:50%;} .m2 .hero-bullets .ck svg{width:11px;height:11px;stroke-width:3;}
/* quick compare: the homepage hairline table, everywhere */
.m2 .qcmp{max-width:920px;border:0;border-radius:0;overflow:visible;background:transparent;box-shadow:none;gap:0;}
.m2 .qcmp-row{grid-template-columns:1fr 1.1fr 1.3fr;gap:24px;padding:18px 0;border-bottom:1px solid #ECECF0;align-items:center;}
.m2 .qcmp-row:last-child{border-bottom:0;}
.m2 .qcmp-row>div{padding:0;background:transparent;font-size:1.02rem;gap:12px;line-height:1.35;}
.m2 .qc-feat{font-weight:600;color:var(--ink);}
.m2 .qc-gv{color:#3C3C43;font-weight:400;}
.m2 .qcmp-row .qc-nl{background:transparent;font-weight:500;color:var(--body);}
.m2 .qcmp-head{border-bottom:1px solid #D9D9E0;padding:0 0 14px;}
.m2 .qcmp-head>div{font-size:.78rem;letter-spacing:.08em;font-weight:600;color:var(--muted);background:transparent;}
.m2 .qcmp-head .qc-nl{color:var(--cta);background:transparent;}
.m2 .qi{width:22px;height:22px;} .m2 .qi svg{width:11px;height:11px;stroke-width:2.6;} .m2 .qi.yes{background:var(--cta);} .m2 .qc-gv .qi.yes{background:#B5B5BD;}
@media(max-width:620px){.m2 .hero:has(.hero-grid){padding-top:40px;} .m2 .hero-grid{grid-template-columns:1fr;gap:34px;} .m2 .hero-grid h1{max-width:none;} .m2 .cta-sub{flex-direction:column;align-items:flex-start;gap:10px;justify-content:flex-start;} .m2 .glance .cta-sub,.m2 .jx-acts+.cta-sub{width:max-content;max-width:100%;margin-left:auto;margin-right:auto;} .m2 .cta-sub>span{white-space:normal;align-items:flex-start;}}
@media(max-width:560px){
  /* phones keep the three-column table (owner 2026-09-09): tighter type, the feature name stacks above its two cells */
  .m2 .qcmp-row{grid-template-columns:.9fr 1fr 1fr;gap:8px;padding:12px 0;}
  .m2 .qcmp-row>div{font-size:.8rem;gap:6px;align-items:flex-start;line-height:1.3;}
  .m2 .qcmp-head>div{font-size:.62rem;letter-spacing:.06em;}
  .m2 .qi{width:16px;height:16px;margin-top:1px;} .m2 .qi svg{width:9px;height:9px;}
  .m2 .qcmp-row .qc-feat{grid-column:auto;text-transform:none;letter-spacing:0;font-size:.8rem;color:var(--ink);font-weight:600;padding:0;background:transparent;}
  .m2 .qcmp-head .qc-feat{display:block;}
}
}
