/* Alloro 2026: the other pages (About, Benefits, Pricing, Contact, features, blog, articles, legal).
   Loaded on every page after alloro-2026.css. Words are never changed here.
   Scope: the page content only. The hero is #main; the content is every section after it, except the closing
   terracotta band (.close-section, owned by alloro-2026.css). The home page's sections carry .a26, so
   "#main:not(.a26)" matches nothing there. The header and footer are not touched. */

/* ---------- 0. Page tokens ---------- */
#main:not(.a26), #main:not(.a26) ~ section:not(.close-section) {
  --p-terra: #d66853; --p-terra-bright: #e07a66; --p-terra-deep: #c0543a; --p-terra-text: #b1462c;
  --p-ink: #171615; --p-ink-2: #1e1d1b; --p-ink-soft: #3b3531; --p-muted: #6b635c;
  --p-paper: #f7f5f3; --p-surface: #fff; --p-surface-2: #fbf9f7; --p-line: #e8e4df; --p-line-strong: #d8d3cc;
  --p-on-ink: #f0ece8; --p-on-ink-muted: #a8a097; --p-on-ink-line: #2e2c29;
  --p-serif: "Spectral", Georgia, "Times New Roman", serif;
  --p-sans: "Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --p-sh-1: 0 1px 2px rgba(23,22,21,.05), 0 6px 18px rgba(23,22,21,.05);
  --p-sh-2: 0 2px 6px rgba(23,22,21,.06), 0 22px 48px -12px rgba(23,22,21,.2);
  --p-ease: cubic-bezier(0.16, 1, 0.3, 1);
  /* the card "glare" from the home page (.a26-pc) */
  --p-glare:
    radial-gradient(120% 90% at 0% 0%, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 55%),
    radial-gradient(90% 80% at 100% 100%, rgba(214,104,83,.09) 0%, rgba(214,104,83,0) 60%),
    linear-gradient(155deg, #ffffff 0%, #fbf6f1 100%);
  --p-glare-sh: inset 0 1px 0 rgba(255,255,255,.95), inset 0 0 0 1px rgba(255,255,255,.35), 0 1px 2px rgba(23,22,21,.05), 0 6px 18px rgba(23,22,21,.05);
  --p-ink-card:
    radial-gradient(110% 90% at 0% 0%, rgba(255,255,255,.07) 0%, rgba(255,255,255,0) 50%),
    radial-gradient(80% 90% at 100% 100%, rgba(214,104,83,.18) 0%, rgba(214,104,83,0) 60%),
    #1e1d1b;
  font-family: var(--p-sans);
}
/* Decoration from the old look (amber and terracotta blur blobs, wave dot grids, the leaf) gives way to the
   home page's plain paper, dot pattern and terracotta glow. It is aria-hidden and carries no words. */
#main:not(.a26) .decor, #main:not(.a26) ~ section:not(.close-section) .decor,
#main:not(.a26) .leaf, #main:not(.a26) .orbit { display: none !important; }

/* ---------- 1. Hero: paper, a faint terracotta wash at the top, a dot pattern that fades out ---------- */
#main:not(.a26) {
  position: relative; isolation: isolate; overflow-x: clip;
  margin-top: -4.8rem !important;
  padding-top: clamp(9rem, 4rem + 9vw, 12rem) !important;
  padding-bottom: clamp(3.5rem, 7vw, 6rem) !important;
  background: radial-gradient(1200px 520px at 70% 0%, rgba(214,104,83,.11), transparent 70%), var(--p-paper) !important;
  color: var(--p-ink) !important;
  --brand: var(--p-paper); --on-brand: var(--p-ink-soft); --on-brand-light: var(--p-ink);
}
#main:not(.a26)::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(rgba(23,22,21,.13) 1px, transparent 1.6px) 0 0 / 22px 22px;
  -webkit-mask-image: radial-gradient(70% 90% at 82% 8%, #000 0%, rgba(0,0,0,.35) 45%, transparent 75%);
  mask-image: radial-gradient(70% 90% at 82% 8%, #000 0%, rgba(0,0,0,.35) 45%, transparent 75%);
}
#main:not(.a26)::after {
  content: ""; position: absolute; z-index: -1; pointer-events: none; left: 60%; top: 30%;
  width: min(900px, 110vw); height: 620px; transform: translateX(-50%);
  background: radial-gradient(closest-side, rgba(214,104,83,.12), rgba(214,104,83,0));
}
#main:not(.a26) > .container { position: relative; z-index: 1; }

/* Eyebrow: the home page's uppercase label with a short rule before it */
#main:not(.a26) .kicker,
#main:not(.a26) ~ section:not(.close-section) .section-label {
  display: inline-flex !important; align-items: center; gap: 12px;
  font: 700 12px/1.3 var(--p-sans) !important; letter-spacing: .14em !important; text-transform: uppercase;
  color: var(--p-terra-text) !important; text-decoration: none;
}
#main:not(.a26) .kicker::before,
#main:not(.a26) ~ section:not(.close-section) .section-label::before {
  content: "" !important; width: 28px !important; height: 1px !important; background: currentColor !important; opacity: 1;
}
#main:not(.a26) a.kicker:hover { color: var(--p-ink) !important; }
/* The italic lead-in above a title (Contact, the section heads) */
#main:not(.a26) .lead-in, #main:not(.a26) ~ section:not(.close-section) .lead-in {
  font: italic 400 clamp(1.05rem, 1rem + .3vw, 1.25rem)/1.3 var(--p-serif) !important;
  color: var(--p-terra-text) !important; letter-spacing: 0 !important; text-transform: none !important; margin-bottom: 14px;
}
#main:not(.a26) ~ section.section--ink .lead-in { color: var(--p-terra-bright) !important; }

/* The big editorial title */
#main:not(.a26) h1, #main:not(.a26) .statement-grid h2 {
  font-family: var(--p-serif) !important; font-weight: 500 !important;
  font-size: clamp(3rem, 1.4rem + 5.8vw, 6.4rem) !important; line-height: .96 !important;
  letter-spacing: -0.025em !important; text-wrap: balance; color: var(--p-ink) !important;
  max-width: 16ch; margin-top: 22px;
}
#main:not(.a26) h1 .ln, #main:not(.a26) .statement-grid h2 .line { display: block; }
#main:not(.a26) h1 .accent, #main:not(.a26) .statement-grid h2 .line:last-child {
  font-style: italic !important; color: var(--p-terra-text) !important;
}
#main:not(.a26) h1 .nw { white-space: normal !important; }
#main:not(.a26) .statement-grid h2 .line { opacity: 1 !important; transform: none !important; }
/* Body copy under the title */
#main:not(.a26) .hero-def, #main:not(.a26) .hero-definition, #main:not(.a26) .lead {
  font: 400 clamp(1.05rem, 1rem + .35vw, 1.25rem)/1.6 var(--p-sans) !important;
  color: var(--p-ink-soft) !important; max-width: 36em; margin-top: 26px;
  border: 0 !important; padding: 0 !important;
}
#main:not(.a26) .lead strong { color: var(--p-ink); }
#main:not(.a26) .hero-trust, #main:not(.a26) .hero-trust span { color: var(--p-muted) !important; font-size: 14px; }
#main:not(.a26) .hero-trust svg, #main:not(.a26) .hero-trust .lucide { color: var(--p-green, #4f8a5b) !important; }
#main:not(.a26) .definition-card { background: transparent !important; border: 0 !important; padding: 0 !important; box-shadow: none !important; }
#main:not(.a26) .hero-actions { margin-top: 34px !important; gap: 14px 16px !important; }

/* Hero by page type */
/* About + Pricing: one column */
#main:not(.a26) .about-hero-grid { display: block; }
#main.about-hero:not(.a26) h1 { max-width: 15ch !important; }
/* Pricing: the price is the accent line, "a month, per location" a quiet label after it */
#main.price-hero:not(.a26) .price-line { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 18px; margin-top: 10px; }
#main.price-hero:not(.a26) .price-line .amount {
  font: italic 500 clamp(3rem, 1.4rem + 5.8vw, 6.4rem)/1 var(--p-serif) !important; color: var(--p-terra-text) !important; letter-spacing: -0.02em;
}
#main.price-hero:not(.a26) .price-line .per {
  font: 600 clamp(1rem, .95rem + .3vw, 1.2rem)/1.3 var(--p-sans) !important; color: var(--p-ink-soft) !important; letter-spacing: 0 !important; font-style: normal;
}
/* Benefits: the words-only hero, with the eight-job list beside it when the page shows it */
#main.r1-bhero:not(.a26) .hero-copy h1 { max-width: 14ch; font-size: clamp(3rem, 1.4rem + 5.8vw, 6.4rem) !important; }
/* Feature pages: one column, wider title */
#main.hero:not(.a26) .hero-grid { position: relative; z-index: 1; }
#main.hero:not(.a26) .hero-copy h1 { max-width: 20ch; font-size: clamp(3rem, 1.6rem + 4.2vw, 5.4rem) !important; }
/* AI-ready websites: the site picture beside the title. The shared CSS hides every .hero-visual until an
   animation runs, and the laurel layer swaps that animation for one with no end frame, so the picture stayed at
   opacity 0 on the original too. Resting opacity 1 lets the same rise animation end visible. */
#main:not(.a26) .r2-visual { opacity: 1; }
#main.r2-hero:not(.a26) .hero-copy h1 { max-width: 13ch; font-size: clamp(3rem, 1.6rem + 3.6vw, 5rem) !important; }
#main:not(.a26) .r2-visual figure { background: transparent !important; box-shadow: none !important; }
#main:not(.a26) .r2-visual .r2-site-desk { border-radius: 16px; overflow: hidden; box-shadow: 0 2px 6px rgba(23,22,21,.05), 0 40px 90px -30px rgba(23,22,21,.35), 0 0 0 1px rgba(23,22,21,.04); }
#main:not(.a26) .r2-visual figcaption { margin-top: 14px; font: 500 13px/1.5 var(--p-sans); color: var(--p-muted); }
/* Contact: title on the left, the form card on the right */
#main.statement--sub:not(.a26) { padding-bottom: clamp(3.5rem, 7vw, 6rem) !important; }
#main.statement--sub:not(.a26) h1 { font-size: clamp(3rem, 1.6rem + 4.4vw, 5.6rem) !important; max-width: 11ch; }
#main.statement--sub:not(.a26) .contact-hero-grid { align-items: center; gap: clamp(2.5rem, 6vw, 6rem); }
/* Blog: the title is a statement */
#main.blog-hero:not(.a26) h1 { max-width: 13ch; }
#main.blog-hero:not(.a26) { padding-bottom: clamp(2.5rem, 5vw, 4rem) !important; }
/* Articles and legal pages: a calmer title, set on the article's own column */
#main.doc-hero:not(.a26) { padding-bottom: clamp(2rem, 4vw, 3rem) !important; }
#main.doc-hero:not(.a26) + section { padding-top: 0 !important; }
#main.doc-hero:not(.a26) + section .narrow.doc { margin-top: 0 !important; }
#main.doc-hero:not(.a26) .narrow { max-width: 46rem; }
#main.doc-hero:not(.a26) h1 {
  font-size: clamp(2.5rem, 1.5rem + 3.4vw, 4.4rem) !important; line-height: 1.02 !important; letter-spacing: -0.02em !important; max-width: 18ch;
}
#main.doc-hero:not(.a26) .doc-meta { margin-top: 22px; font: 500 14px/1.5 var(--p-sans); color: var(--p-muted); display: flex; align-items: center; gap: 10px; }
#main.doc-hero:not(.a26) .doc-meta::before { content: ""; width: 28px; height: 28px; flex: none; border-radius: 50%; background: radial-gradient(circle at 35% 30%, var(--p-terra-bright), var(--p-terra-deep)); box-shadow: 0 0 0 4px rgba(214,104,83,.14); }

/* ---------- 2. Buttons: ink primary, quiet outline secondary (on paper); terracotta primary on ink ---------- */
#main:not(.a26) .hero-actions a.group,
#main:not(.a26) ~ section:not(.close-section) .hero-actions a.group,
#main:not(.a26) ~ section:not(.close-section) .founder-actions a.group {
  min-height: 54px; padding: 0 28px !important; border-radius: 999px !important; font: 700 16px/1 var(--p-sans) !important;
  letter-spacing: 0 !important; transform: none !important;
}
#main:not(.a26) a.group.bg-terracotta,
#main:not(.a26) ~ section:not(.close-section):not(.section--ink) a.group.bg-terracotta,
#main:not(.a26) ~ section:not(.close-section) button[type="submit"] {
  background: var(--p-ink) !important; color: var(--p-paper) !important; border-color: var(--p-ink) !important;
  box-shadow: 0 1px 2px rgba(23,22,21,.2), 0 10px 24px -12px rgba(23,22,21,.6) !important;
}
#main:not(.a26) a.group.bg-terracotta:hover,
#main:not(.a26) ~ section:not(.close-section):not(.section--ink) a.group.bg-terracotta:hover,
#main:not(.a26) button[type="submit"]:hover {
  background: #000 !important; box-shadow: 0 1px 2px rgba(23,22,21,.2), 0 18px 32px -14px rgba(192,84,58,.7) !important;
}
#main:not(.a26) a.group.border-line-strong, #main:not(.a26) a.group.border-white,
#main:not(.a26) ~ section:not(.close-section):not(.section--ink) a.group.border-line-strong,
#main:not(.a26) ~ section:not(.close-section) .founder-actions a.group {
  background: transparent !important; color: var(--p-ink) !important; border: 1px solid rgba(23,22,21,.35) !important; box-shadow: none !important;
}
#main:not(.a26) a.group.border-line-strong:hover, #main:not(.a26) a.group.border-white:hover,
#main:not(.a26) ~ section:not(.close-section):not(.section--ink) a.group.border-line-strong:hover,
#main:not(.a26) ~ section:not(.close-section) .founder-actions a.group:hover { background: rgba(23,22,21,.06) !important; color: var(--p-ink) !important; }
#main:not(.a26) a.group:focus-visible, #main:not(.a26) ~ section:not(.close-section) a:focus-visible,
#main:not(.a26) ~ section:not(.close-section) button:focus-visible { outline: 2px solid var(--p-terra); outline-offset: 3px; }
/* Text links: underlined ink that warms to terracotta */
#main:not(.a26) ~ section:not(.close-section) .textlink,
#main:not(.a26) ~ section:not(.close-section) a.underline { color: var(--p-terra-text) !important; font-weight: 700; }
#main:not(.a26) ~ section:not(.close-section) a.underline { color: var(--p-ink) !important; text-decoration-thickness: 1px; text-underline-offset: 5px; }
#main:not(.a26) ~ section:not(.close-section) a.underline:hover { color: var(--p-terra-text) !important; }

/* ---------- 3. Section titles and rhythm ---------- */
#main:not(.a26) ~ section:not(.close-section) .section-head { max-width: 62rem; margin-bottom: clamp(36px, 5vw, 64px); }
#main:not(.a26) ~ section:not(.close-section) .section-head h2,
#main:not(.a26) ~ section:not(.close-section) .statement-grid h2,
#main:not(.a26) ~ section:not(.close-section) .jobs-split h2,
#main:not(.a26) ~ section:not(.close-section) .contact-cols h2 {
  font-family: var(--p-serif) !important; font-weight: 500 !important;
  font-size: clamp(2.3rem, 1.3rem + 3.8vw, 4.4rem) !important; line-height: 1.02 !important;
  letter-spacing: -0.018em !important; text-wrap: balance; color: var(--p-ink);
}
#main:not(.a26) ~ section.section--ink .section-head h2 { color: var(--p-on-ink) !important; }
#main:not(.a26) ~ section:not(.close-section) .section-head h2 .lead-in { display: block; }
#main:not(.a26) ~ section:not(.close-section) .section-head p {
  font: 400 clamp(1.05rem, 1rem + .35vw, 1.25rem)/1.6 var(--p-sans) !important; color: var(--p-ink-soft) !important; max-width: 40em; margin-top: 20px;
}
#main:not(.a26) ~ section.section--ink .section-head p { color: var(--p-on-ink-muted) !important; }
#main:not(.a26) ~ section.section--ink .section-head .section-label { color: var(--p-terra-bright) !important; margin-bottom: 18px; }
/* Statement sections (a big two-line claim beside a short answer) */
#main:not(.a26) ~ section.statement .statement-grid h2 .line { display: block; }
#main:not(.a26) ~ section.statement .statement-grid h2 .line:last-child,
#main:not(.a26) ~ section.statement .r1-acc { font-style: italic; color: var(--p-terra-text) !important; }
#main:not(.a26) ~ section.statement .lead {
  font: 400 clamp(1.05rem, 1rem + .35vw, 1.2rem)/1.6 var(--p-sans) !important; color: var(--p-ink-soft) !important;
  border-left: 0 !important; padding-left: 0 !important;
}
#main:not(.a26) ~ section.statement .lead + .lead { margin-top: 14px; }

/* ---------- 4. Cards: white with the home page's glare ---------- */
#main:not(.a26) ~ section:not(.close-section) .founder-feature,
#main:not(.a26) ~ section:not(.close-section) .identity-proof,
#main:not(.a26) ~ section:not(.close-section) .svc-cta,
#main:not(.a26) ~ section:not(.close-section) .ledger > .svc,
#main:not(.a26) ~ section:not(.close-section) .founder-note,
#main:not(.a26) ~ section:not(.close-section) .jfaq,
#main:not(.a26) ~ section:not(.close-section) .al-item,
#main:not(.a26) ~ section:not(.close-section) .entity-ledger,
#main:not(.a26) .glass-card,
#main:not(.a26) .pile-card {
  position: relative; isolation: isolate;
  background: var(--p-glare) !important;
  border: 1px solid var(--p-line) !important; border-radius: 18px !important;
  box-shadow: var(--p-glare-sh) !important;
  -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
  transition: box-shadow .35s var(--p-ease), transform .35s var(--p-ease);
}
#main:not(.a26) ~ section:not(.close-section) .ledger > .svc:hover,
#main:not(.a26) ~ section:not(.close-section) .al-item:hover,
#main:not(.a26) ~ section:not(.close-section) .svc-cta:hover { box-shadow: inset 0 1px 0 rgba(255,255,255,.95), var(--p-sh-2) !important; }

/* Ledger lists (Pricing "Included", Contact ways, feature "What's included") become a grid of cards */
#main:not(.a26) ~ section:not(.close-section) .ledger { gap: 20px !important; }
#main:not(.a26) ~ section:not(.close-section) .ledger > .svc {
  padding: clamp(22px, 2.6vw, 30px) !important; column-gap: 16px !important; row-gap: 6px !important; align-content: start;
}
#main:not(.a26) ~ section:not(.close-section) .ledger > .svc .pic {
  width: 42px !important; height: 42px !important; border-radius: 12px !important;
  background: linear-gradient(140deg, var(--p-terra-bright), var(--p-terra-deep)) !important; color: #fff !important;
  box-shadow: 0 10px 22px -12px rgba(192,84,58,.8), inset 0 1px 0 rgba(255,255,255,.35);
}
#main:not(.a26) ~ section:not(.close-section) .ledger > .svc .idx {
  font: 700 12px/1.3 var(--p-sans) !important; letter-spacing: .1em !important; text-transform: uppercase; color: var(--p-muted) !important;
}
#main:not(.a26) ~ section:not(.close-section) .ledger > .svc h3 {
  font: 500 22px/1.2 var(--p-serif) !important; font-size: 22px !important; letter-spacing: -0.01em; color: var(--p-ink) !important;
}
#main:not(.a26) ~ section:not(.close-section) .ledger > .svc p { font: 400 15px/1.6 var(--p-sans) !important; color: var(--p-ink-soft) !important; }
#main:not(.a26) ~ section:not(.close-section) .svc-grid.ledger > .svc p { font-size: 16px !important; color: var(--p-ink) !important; }
#main:not(.a26) ~ section:not(.close-section) .ledger > .svc.pillar:hover h3 { color: var(--p-terra-text) !important; }
#main:not(.a26) ~ section:not(.close-section) .ledger.ledger-1 { grid-template-columns: repeat(2, minmax(0, 1fr)); }

/* Call-out cards (Pricing partners, feature "Questions before you start?") */
#main:not(.a26) ~ section:not(.close-section) .svc-cta {
  padding: clamp(26px, 4vw, 44px) !important; display: flex !important; flex-direction: row !important; flex-wrap: wrap;
  align-items: center !important; justify-content: space-between; gap: 22px 40px !important;
}
#main:not(.a26) ~ section:not(.close-section) .svc-cta h3 {
  font: 500 clamp(1.5rem, 1.2rem + 1vw, 2.1rem)/1.15 var(--p-serif) !important; font-size: clamp(1.5rem, 1.2rem + 1vw, 2.1rem) !important;
  letter-spacing: -0.012em; color: var(--p-ink) !important; max-width: 26ch;
}
#main:not(.a26) ~ section:not(.close-section) .svc-cta p { margin-top: 8px; font: 400 16px/1.6 var(--p-sans) !important; color: var(--p-ink-soft) !important; }
#main:not(.a26) ~ section:not(.close-section) .svc-cta .hero-actions { margin: 0 !important; }

/* Pricing note "What we won't do": a quote card */
#main:not(.a26) ~ section:not(.close-section) .founder-note {
  max-width: 52rem; padding: clamp(28px, 4.4vw, 52px) clamp(26px, 4.4vw, 56px) !important; border-left: 1px solid var(--p-line) !important;
}
#main:not(.a26) ~ section:not(.close-section) .founder-note h2 {
  font: 500 clamp(1.8rem, 1.3rem + 1.8vw, 2.8rem)/1.08 var(--p-serif) !important; font-size: clamp(1.8rem, 1.3rem + 1.8vw, 2.8rem) !important; letter-spacing: -0.015em;
}
#main:not(.a26) ~ section:not(.close-section) .founder-note p:not(.sig) { font: 400 clamp(1.15rem, 1.05rem + .4vw, 1.4rem)/1.5 var(--p-serif) !important; color: var(--p-ink) !important; margin-top: 18px !important; }
#main:not(.a26) ~ section:not(.close-section) .founder-note .sig { font: 600 14px/1.5 var(--p-sans) !important; color: var(--p-muted) !important; margin-top: 22px; }

/* ---------- 5. Ink bands with a soft terracotta glow ---------- */
#main:not(.a26) ~ section.section--ink:not(.close-section) {
  position: relative; overflow: clip; color: var(--p-on-ink);
  background:
    radial-gradient(900px 700px at 104% -12%, rgba(214,104,83,.26), rgba(214,104,83,0) 60%),
    radial-gradient(800px 640px at 108% 112%, rgba(214,104,83,.14), rgba(214,104,83,0) 60%),
    var(--p-ink) !important;
}
/* The glow sits on the right: the step numbers on the left (and on the rail) rest on plain ink, so the ink patch
   that hides the rail behind each number stays invisible. */
#main:not(.a26) ~ section.section--ink .step h3,
#main:not(.a26) ~ section.section--ink .method-step h3 {
  font: 500 clamp(1.35rem, 1.15rem + .8vw, 1.85rem)/1.18 var(--p-serif) !important; font-size: clamp(1.35rem, 1.15rem + .8vw, 1.85rem) !important;
  color: var(--p-on-ink) !important; letter-spacing: -0.01em;
}
#main:not(.a26) ~ section.section--ink .step p,
#main:not(.a26) ~ section.section--ink .method-step p { font: 400 16px/1.6 var(--p-sans) !important; color: var(--p-on-ink-muted) !important; }
#main:not(.a26) ~ section.section--ink .step .n,
#main:not(.a26) ~ section.section--ink .method-step .n { font-family: var(--p-serif) !important; font-weight: 500 !important; color: var(--p-terra-bright) !important; background: transparent !important; }
#main:not(.a26) ~ section.section--ink .steps::before { background: var(--p-on-ink-line) !important; }
/* the number sits on an ink patch so the progress rail passes behind it, as before */
#main:not(.a26) ~ section.section--ink .step .n { background: var(--p-ink) !important; padding-right: 14px; }
#main:not(.a26) ~ section.section--ink .method-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 3vw, 44px); }
#main:not(.a26) ~ section.section--ink .method-step { border-top-color: var(--p-on-ink-line); padding-top: 28px; }
#main:not(.a26) ~ section.section--ink .method-note {
  position: relative; background: var(--p-ink-card) !important; border: 1px solid var(--p-on-ink-line) !important; border-radius: 22px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 40px 90px -40px rgba(0,0,0,.8);
  padding: clamp(22px, 3vw, 36px) !important;
}
#main:not(.a26) ~ section.section--ink .method-note strong { font: italic 400 clamp(1.3rem, 1.1rem + .8vw, 1.75rem)/1.3 var(--p-serif); color: var(--p-on-ink) !important; }
/* Primary buttons on ink */
#main:not(.a26) ~ section.section--ink a.group.bg-terracotta { background: #b8473a !important; color: #fff !important; border-color: #b8473a !important; }

/* The ink call-to-action card at the end of the blog and the articles (a .cta-band that is not the closing band) */
#main:not(.a26) ~ section:not(.close-section) .cta-band {
  position: relative; overflow: hidden; isolation: isolate;
  width: auto !important; margin-left: 0 !important; margin-right: 0 !important;
  border-radius: 28px !important; padding: clamp(44px, 7vw, 96px) clamp(24px, 6vw, 88px) !important;
  background:
    radial-gradient(90% 120% at 0% 0%, rgba(214,104,83,.30) 0%, rgba(214,104,83,0) 55%),
    radial-gradient(70% 90% at 100% 100%, rgba(214,104,83,.18) 0%, rgba(214,104,83,0) 60%),
    radial-gradient(rgba(240,236,232,.07) 1px, transparent 1.5px) 0 0 / 22px 22px,
    var(--p-ink) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 40px 90px -40px rgba(23,22,21,.7) !important;
  color: var(--p-on-ink);
}
#main:not(.a26) ~ section:not(.close-section) .cta-band .ctac { max-width: 860px; margin-inline: auto; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 18px; position: relative; z-index: 1; }
#main:not(.a26) ~ section:not(.close-section) .cta-band h2 {
  font: 500 clamp(2.3rem, 1.3rem + 3.8vw, 4.4rem)/1.02 var(--p-serif) !important; font-size: clamp(2.3rem, 1.3rem + 3.8vw, 4.4rem) !important;
  letter-spacing: -0.018em; color: var(--p-on-ink) !important; margin: 0 !important; text-wrap: balance;
}
#main:not(.a26) ~ section:not(.close-section) .cta-band p { font: 400 clamp(1.05rem, 1rem + .35vw, 1.25rem)/1.6 var(--p-sans) !important; color: var(--p-on-ink-muted) !important; max-width: 40em; margin: 0 !important; }
#main:not(.a26) ~ section:not(.close-section) .cta-band .hero-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 14px; margin-top: 10px !important; }
#main:not(.a26) ~ section:not(.close-section) .cta-band a.group.bg-terracotta { background: #b8473a !important; color: #fff !important; border-color: #b8473a !important; box-shadow: 0 18px 36px -16px rgba(214,104,83,.7) !important; }
#main:not(.a26) ~ section:not(.close-section) .cta-band a.group.bg-terracotta:hover { background: var(--p-terra-deep) !important; }
#main:not(.a26) ~ section:not(.close-section) .cta-band a.group:not(.bg-terracotta) { background: transparent !important; color: var(--p-on-ink) !important; border: 1px solid rgba(240,236,232,.4) !important; }
#main:not(.a26) ~ section:not(.close-section) .cta-band a.group:not(.bg-terracotta):hover { background: rgba(240,236,232,.08) !important; }
#main:not(.a26) ~ section:not(.close-section) .cta-band a.group {
  min-height: 54px; padding: 0 28px !important; border-radius: 999px !important; font: 700 16px/1 var(--p-sans) !important;
}

/* Tinted bands: surface for .band, the warm founder fade for the tinted ones */
#main:not(.a26) ~ section.band:not(.close-section)::before { background: var(--p-surface-2) !important; border-block: 1px solid var(--p-line); }
#main:not(.a26) ~ section.band.band-tint:not(.close-section)::before,
#main:not(.a26) ~ section.founder-band:not(.close-section) { background: linear-gradient(180deg, var(--p-paper), #f3ece6) !important; }
#main:not(.a26) ~ section.band.band-tint:not(.close-section) { background: transparent !important; }

/* ---------- 6. Page parts ---------- */
/* About: founder card */
#main:not(.a26) ~ section:not(.close-section) .founder-feature { overflow: hidden; }
#main:not(.a26) ~ section:not(.close-section) .founder-photo { background: var(--p-surface-2) !important; }
#main:not(.a26) ~ section:not(.close-section) .founder-main h3 { font: 500 clamp(1.6rem, 1.3rem + 1vw, 2.2rem)/1.1 var(--p-serif) !important; font-size: clamp(1.6rem, 1.3rem + 1vw, 2.2rem) !important; letter-spacing: -0.015em; }
#main:not(.a26) ~ section:not(.close-section) .founder-role { font: 700 12px/1.4 var(--p-sans) !important; letter-spacing: .1em; text-transform: uppercase; color: var(--p-muted) !important; margin-top: 8px; }
#main:not(.a26) ~ section:not(.close-section) .founder-copy { font: 400 17px/1.65 var(--p-sans) !important; color: var(--p-ink-soft) !important; }
#main:not(.a26) ~ section:not(.close-section) .founder-facts { background: rgba(251,249,247,.7) !important; border-left: 1px solid var(--p-line) !important; }
#main:not(.a26) ~ section:not(.close-section) .founder-fact h3 { font: 500 19px/1.25 var(--p-serif) !important; font-size: 19px !important; color: var(--p-ink) !important; }
#main:not(.a26) ~ section:not(.close-section) .founder-fact p { font: 400 14px/1.55 var(--p-sans) !important; color: var(--p-ink-soft) !important; }
/* About: biography ledger + "Based in" card */
#main:not(.a26) ~ section:not(.close-section) .footprint-grid { align-items: stretch; gap: 20px; }
#main:not(.a26) ~ section:not(.close-section) .entity-ledger { padding: 6px clamp(20px, 2.6vw, 30px) !important; }
#main:not(.a26) ~ section:not(.close-section) .entity-row dt { font: 700 12px/1.4 var(--p-sans) !important; letter-spacing: .1em; text-transform: uppercase; color: var(--p-terra-text) !important; }
#main:not(.a26) ~ section:not(.close-section) .entity-row dd { font: 400 16px/1.6 var(--p-sans) !important; color: var(--p-ink-soft) !important; }
#main:not(.a26) ~ section:not(.close-section) .entity-row dd a { color: var(--p-terra-text) !important; }
#main:not(.a26) ~ section:not(.close-section) .entity-row + .entity-row { border-top-color: var(--p-line) !important; }
#main:not(.a26) ~ section:not(.close-section) .identity-proof h3 { font: 500 clamp(1.5rem, 1.2rem + 1vw, 2.1rem)/1.15 var(--p-serif) !important; font-size: clamp(1.5rem, 1.2rem + 1vw, 2.1rem) !important; }
#main:not(.a26) ~ section:not(.close-section) .sameas-list a { border-radius: 999px; color: var(--p-ink) !important; border-color: rgba(23,22,21,.3) !important; background: transparent; }
#main:not(.a26) ~ section:not(.close-section) .sameas-list a:hover { background: var(--p-ink) !important; color: var(--p-paper) !important; }

/* Benefits: founder quote band and the eight jobs */
#main:not(.a26) ~ section.founder-band .founder-row img { border: 4px solid #fff !important; box-shadow: 0 0 0 1px rgba(214,104,83,.35), 0 20px 40px -18px rgba(23,22,21,.35) !important; }
#main:not(.a26) ~ section.founder-band blockquote, #main:not(.a26) ~ section.founder-band blockquote p {
  font: italic 400 clamp(1.4rem, 1rem + 1.6vw, 2.3rem)/1.3 var(--p-serif) !important; font-size: clamp(1.4rem, 1rem + 1.6vw, 2.3rem) !important;
  color: var(--p-ink) !important; border: 0 !important; padding: 0 !important; margin: 0; text-wrap: pretty;
}
#main:not(.a26) ~ section.founder-band .r1-fname { font: 700 14px/1.4 var(--p-sans) !important; letter-spacing: .06em; text-transform: uppercase; color: var(--p-muted) !important; margin-top: 16px; }
#main:not(.a26) ~ section.founder-band .svc-cta:not(.r1-founder) { width: 100%; }
#main:not(.a26) ~ section.founder-band .r1-founder { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; display: block !important; }
#main:not(.a26) ~ section:not(.close-section) .jr-list .jr { border-color: var(--p-line) !important; }
#main:not(.a26) ~ section:not(.close-section) .jr-list .jr h3 { font: 500 clamp(1.3rem, 1.1rem + .7vw, 1.7rem)/1.2 var(--p-serif) !important; font-size: clamp(1.3rem, 1.1rem + .7vw, 1.7rem) !important; letter-spacing: -0.01em; color: var(--p-ink) !important; }
#main:not(.a26) ~ section:not(.close-section) .jr-list .jr p { font: 400 16px/1.6 var(--p-sans) !important; color: var(--p-ink-soft) !important; }
#main:not(.a26) ~ section:not(.close-section) .jr-list .jr-n { font-family: var(--p-serif) !important; color: var(--p-terra-text) !important; }
#main:not(.a26) ~ section:not(.close-section) .jfaq { padding: 20px 24px !important; font-size: 16px !important; color: var(--p-ink-soft) !important; }
#main:not(.a26) ~ section:not(.close-section) .jfaq strong { font-family: var(--p-serif); font-weight: 500; font-size: 1.15em; color: var(--p-ink); }

/* Feature pages: the pile of tool cards, the comparison table, the questions */
#main:not(.a26) .pile-card { border-radius: 14px !important; font: 600 14px/1.2 var(--p-sans); box-shadow: var(--p-glare-sh), 0 18px 34px -18px rgba(23,22,21,.35) !important; }
#main:not(.a26) ~ section:not(.close-section) .cmp-wrap { position: relative; }
#main:not(.a26) ~ section:not(.close-section) table.cmp thead th { font-family: var(--p-serif) !important; font-weight: 500 !important; letter-spacing: -0.01em; border-bottom-color: var(--p-ink) !important; }
#main:not(.a26) ~ section:not(.close-section) table.cmp tbody th { font: 500 19px/1.3 var(--p-serif) !important; font-size: 19px !important; color: var(--p-ink) !important; }
#main:not(.a26) ~ section:not(.close-section) table.cmp td { color: var(--p-ink-soft); font-size: 16px; }
#main:not(.a26) ~ section:not(.close-section) table.cmp thead th.col-alloro { border-radius: 18px 18px 0 0 !important; }
#main:not(.a26) ~ section:not(.close-section) table.cmp tbody tr:last-child td.col-alloro { border-radius: 0 0 18px 18px !important; }
#main:not(.a26) ~ section:not(.close-section) table.cmp .col-alloro {
  background: radial-gradient(120% 60% at 100% 100%, rgba(214,104,83,.16), rgba(214,104,83,0) 70%), var(--p-ink) !important;
}
#main:not(.a26) ~ section:not(.close-section) table.cmp thead th.col-alloro, #main:not(.a26) ~ section:not(.close-section) table.cmp tbody td.col-alloro .v { color: var(--p-on-ink) !important; }
#main:not(.a26) ~ section:not(.close-section) table.cmp .mark.yes { color: var(--p-terra-bright) !important; }
/* FAQ */
#main:not(.a26) ~ section:not(.close-section) details { border-color: var(--p-line) !important; }
#main:not(.a26) ~ section:not(.close-section) details > summary {
  font: 500 clamp(1.15rem, 1.05rem + .45vw, 1.4rem)/1.3 var(--p-serif) !important; font-size: clamp(1.15rem, 1.05rem + .45vw, 1.4rem) !important;
  color: var(--p-ink) !important; letter-spacing: -0.005em; padding-block: 22px !important; transition: color .2s;
}
#main:not(.a26) ~ section:not(.close-section) details > summary:hover { color: var(--p-terra-text) !important; }
#main:not(.a26) ~ section:not(.close-section) details > summary > span {
  display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--p-line-strong); color: var(--p-terra-text) !important;
  transition: background-color .2s, color .2s, border-color .2s;
}
#main:not(.a26) ~ section:not(.close-section) details[open] > summary > span { background: var(--p-ink); border-color: var(--p-ink); color: var(--p-paper) !important; }
#main:not(.a26) ~ section:not(.close-section) details > summary > span svg { width: 16px; height: 16px; }
#main:not(.a26) ~ section:not(.close-section) details p { font: 400 16px/1.7 var(--p-sans) !important; color: var(--p-ink-soft) !important; }

/* Contact: the form card, the next steps, the ink contact card */
#main:not(.a26) .glass-card { padding: clamp(24px, 3vw, 36px) !important; box-shadow: var(--p-glare-sh), 0 30px 70px -30px rgba(23,22,21,.3) !important; }
#main:not(.a26) .glass-card .f-field label { font: 700 12px/1.3 var(--p-sans) !important; letter-spacing: .1em !important; color: var(--p-muted) !important; }
#main:not(.a26) .glass-card .f-field label .opt { letter-spacing: 0; text-transform: none; font-weight: 600; }
#main:not(.a26) .glass-card .f-field input, #main:not(.a26) .glass-card .f-field textarea {
  min-height: 50px; border: 1px solid var(--p-line-strong) !important; border-radius: 12px !important; background: #fff !important;
  font: 400 16px/1.4 var(--p-sans) !important; color: var(--p-ink) !important;
  box-shadow: inset 0 1px 2px rgba(23,22,21,.04); transition: border-color .2s, box-shadow .2s;
}
#main:not(.a26) .glass-card .f-field input:focus, #main:not(.a26) .glass-card .f-field textarea:focus {
  outline: none; border-color: var(--p-terra) !important; box-shadow: 0 0 0 4px rgba(214,104,83,.16) !important;
}
#main:not(.a26) .glass-card button[type="submit"] {
  min-height: 54px; border-radius: 999px !important; font: 700 16px/1 var(--p-sans) !important;
  background: var(--p-ink) !important; color: var(--p-paper) !important; border-color: var(--p-ink) !important;
  box-shadow: 0 1px 2px rgba(23,22,21,.2), 0 10px 24px -12px rgba(23,22,21,.6) !important;
}
#main:not(.a26) ~ section:not(.close-section) .after-step { border-color: var(--p-line) !important; padding-block: 24px; }
#main:not(.a26) ~ section:not(.close-section) .after-step .n { font: 500 clamp(2.2rem, 1.8rem + 1.4vw, 3rem)/1 var(--p-serif) !important; color: var(--p-terra-text) !important; width: 3rem; }
#main:not(.a26) ~ section:not(.close-section) .after-step h3 { font: 500 clamp(1.3rem, 1.15rem + .6vw, 1.65rem)/1.2 var(--p-serif) !important; font-size: clamp(1.3rem, 1.15rem + .6vw, 1.65rem) !important; color: var(--p-ink); }
#main:not(.a26) ~ section:not(.close-section) .after-step p { font: 400 16px/1.6 var(--p-sans) !important; color: var(--p-ink-soft) !important; }
#main:not(.a26) ~ section:not(.close-section) .contact-card {
  background: var(--p-ink-card) !important; border: 1px solid var(--p-on-ink-line) !important; border-radius: 22px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 40px 90px -40px rgba(0,0,0,.8) !important;
}
#main:not(.a26) ~ section:not(.close-section) .contact-card h3 { font: 500 clamp(1.6rem, 1.3rem + 1vw, 2.2rem)/1.1 var(--p-serif) !important; font-size: clamp(1.6rem, 1.3rem + 1vw, 2.2rem) !important; color: var(--p-on-ink) !important; }
#main:not(.a26) ~ section:not(.close-section) .contact-card .cc-tag { color: var(--p-on-ink-muted) !important; font-size: 15px; }
#main:not(.a26) ~ section:not(.close-section) .contact-card .contact-line a { font-size: 16px !important; color: var(--p-on-ink) !important; }
#main:not(.a26) ~ section:not(.close-section) .contact-card .contact-line a:hover { color: var(--p-terra-bright) !important; }
#main:not(.a26) ~ section:not(.close-section) .ledger > .svc h3 + p { margin-top: 2px; }

/* Blog: the list of posts becomes a two-column grid of cards */
#main:not(.a26) ~ section:not(.close-section) .article-list { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
#main:not(.a26) ~ section:not(.close-section) .article-list .al-item {
  display: flex !important; flex-direction: column; gap: 12px; padding: clamp(22px, 2.8vw, 32px) !important;
  border: 1px solid var(--p-line) !important; text-decoration: none;
}
#main:not(.a26) ~ section:not(.close-section) .article-list .al-item:last-of-type { border-bottom: 1px solid var(--p-line) !important; }
#main:not(.a26) ~ section:not(.close-section) .article-list .al-item:first-of-type { grid-column: 1 / -1; }
#main:not(.a26) ~ section:not(.close-section) .article-list .al-item h3 {
  font: 500 clamp(1.3rem, 1.1rem + .7vw, 1.7rem)/1.2 var(--p-serif) !important; font-size: clamp(1.3rem, 1.1rem + .7vw, 1.7rem) !important;
  letter-spacing: -0.01em; color: var(--p-ink) !important; margin: 0 !important; text-wrap: balance; transition: color .2s;
}
#main:not(.a26) ~ section:not(.close-section) .article-list .al-item:first-of-type h3 { font-size: clamp(1.7rem, 1.3rem + 1.6vw, 2.6rem) !important; max-width: 26ch; }
#main:not(.a26) ~ section:not(.close-section) .article-list .al-item p { font: 400 15px/1.6 var(--p-sans) !important; color: var(--p-ink-soft) !important; }
#main:not(.a26) ~ section:not(.close-section) .article-list .al-item:first-of-type p { font-size: 17px !important; max-width: 46em; }
#main:not(.a26) ~ section:not(.close-section) .article-list .al-more {
  margin-top: auto !important; padding-top: 14px; border-top: 1px solid var(--p-line); align-self: stretch;
  font: 700 14px/1.4 var(--p-sans) !important; color: var(--p-terra-text) !important; display: flex !important; align-items: center; gap: 8px;
}
#main:not(.a26) ~ section:not(.close-section) .article-list .al-more::after { content: "\2192"; transition: transform .25s var(--p-ease); }
#main:not(.a26) ~ section:not(.close-section) .article-list .al-item:hover h3,
#main:not(.a26) ~ section:not(.close-section) .article-list .al-item:focus-visible h3 { color: var(--p-terra-text) !important; text-decoration: none !important; }
#main:not(.a26) ~ section:not(.close-section) .article-list .al-item:hover .al-more::after { transform: translateX(4px); }

/* ---------- 7. Articles and legal pages: a 68-character column, Spectral headings ---------- */
#main:not(.a26) ~ section:not(.close-section) .narrow.doc { max-width: 46rem; margin-top: clamp(1.5rem, 3vw, 2.5rem); font-size: 17px; }
#main:not(.a26) ~ section:not(.close-section) .doc :is(p, li) { font: 400 17px/1.75 var(--p-sans) !important; color: var(--p-ink-soft) !important; max-width: 68ch; }
#main:not(.a26) ~ section:not(.close-section) .doc strong { color: var(--p-ink) !important; font-weight: 700 !important; }
#main:not(.a26) ~ section:not(.close-section) .doc h2 {
  font: 500 clamp(1.7rem, 1.3rem + 1.4vw, 2.4rem)/1.12 var(--p-serif) !important; font-size: clamp(1.7rem, 1.3rem + 1.4vw, 2.4rem) !important;
  letter-spacing: -0.015em !important; color: var(--p-ink) !important; margin-top: clamp(2.6rem, 5vw, 3.6rem) !important; margin-bottom: 0 !important; text-wrap: balance;
}
#main:not(.a26) ~ section:not(.close-section) .doc h3 {
  font: 600 clamp(1.25rem, 1.15rem + .4vw, 1.45rem)/1.25 var(--p-serif) !important; font-size: clamp(1.25rem, 1.15rem + .4vw, 1.45rem) !important;
  color: var(--p-ink) !important; margin-top: 2rem !important;
}
#main:not(.a26) ~ section:not(.close-section) .doc h4 { font: 700 13px/1.4 var(--p-sans) !important; letter-spacing: .1em; text-transform: uppercase; color: var(--p-muted) !important; }
#main:not(.a26) ~ section:not(.close-section) .doc a {
  color: var(--p-terra-text) !important; text-decoration: underline !important; text-decoration-thickness: 1px !important;
  text-underline-offset: 3px !important; text-decoration-color: rgba(177,70,44,.4) !important; transition: text-decoration-color .2s;
}
#main:not(.a26) ~ section:not(.close-section) .doc a:hover { text-decoration-color: currentColor !important; }
#main:not(.a26) ~ section:not(.close-section) .doc :is(ul, ol) { padding-left: 1.4rem !important; }
#main:not(.a26) ~ section:not(.close-section) .doc li { margin-bottom: .45em !important; }
#main:not(.a26) ~ section:not(.close-section) .doc li::marker { color: var(--p-terra) !important; }
#main:not(.a26) ~ section:not(.close-section) .doc ol li::marker { font-family: var(--p-serif); font-weight: 600; }
/* The short answer at the top of an article */
#main:not(.a26) ~ section:not(.close-section) .doc .answer {
  position: relative; margin: 8px 0 28px !important; padding: clamp(22px, 3vw, 32px) clamp(22px, 3vw, 34px) !important;
  background: var(--p-glare) !important; border: 1px solid var(--p-line) !important; border-radius: 22px; box-shadow: var(--p-glare-sh);
  font: 400 clamp(1.2rem, 1.08rem + .5vw, 1.45rem)/1.5 var(--p-serif) !important; color: var(--p-ink) !important; max-width: none;
}
#main:not(.a26) ~ section:not(.close-section) .doc > .alloro-pc > .doc-meta:first-child,
#main:not(.a26) ~ section:not(.close-section) .doc .doc-meta { font: 600 13px/1.5 var(--p-sans) !important; color: var(--p-muted) !important; letter-spacing: .02em; }
/* Quotes */
#main:not(.a26) ~ section:not(.close-section) .doc blockquote {
  position: relative; margin: 2rem 0 !important; padding: 22px 0 0 !important; border-left: 0 !important;
  font: italic 400 clamp(1.2rem, 1.08rem + .5vw, 1.45rem)/1.5 var(--p-serif) !important; font-size: clamp(1.2rem, 1.08rem + .5vw, 1.45rem) !important; color: var(--p-ink) !important;
}
#main:not(.a26) ~ section:not(.close-section) .doc blockquote p { font: inherit !important; color: inherit !important; }
/* Tables */
#main:not(.a26) ~ section:not(.close-section) .doc table {
  margin: 1.6rem 0 !important; border-collapse: separate !important; border-spacing: 0; background: #fff; border: 1px solid var(--p-line) !important;
  border-radius: 14px; overflow: hidden; box-shadow: var(--p-sh-1);
}
#main:not(.a26) ~ section:not(.close-section) .doc th {
  font: 700 12px/1.4 var(--p-sans) !important; font-size: 12px !important; letter-spacing: .1em; text-transform: uppercase; color: var(--p-muted) !important;
  background: var(--p-surface-2); padding: 14px 16px !important; border-top: 0 !important; border-bottom: 1px solid var(--p-line) !important;
}
#main:not(.a26) ~ section:not(.close-section) .doc td { font: 400 15px/1.55 var(--p-sans) !important; color: var(--p-ink-soft) !important; padding: 14px 16px !important; border-top: 1px solid var(--p-line) !important; }
#main:not(.a26) ~ section:not(.close-section) .doc tr:first-child td { border-top: 0 !important; }
#main:not(.a26) ~ section:not(.close-section) .doc td:first-child { font-family: var(--p-serif) !important; font-weight: 600 !important; color: var(--p-terra-text) !important; }
#main:not(.a26) ~ section:not(.close-section) .doc hr { border: 0 !important; border-top: 1px solid var(--p-line) !important; margin: 2.5rem 0 !important; }
#main:not(.a26) ~ section:not(.close-section) .doc img { border-radius: 14px; }
#main:not(.a26) ~ section:not(.close-section) .post-note { font: 400 14px/1.6 var(--p-sans) !important; color: var(--p-muted) !important; border-top-color: var(--p-line) !important; }

/* ---------- 8. Phones and tablets ---------- */
@media (max-width: 960px) {
  #main:not(.a26) ~ section:not(.close-section) .ledger.ledger-1 { grid-template-columns: minmax(0, 1fr); }
  #main:not(.a26) ~ section.section--ink .method-steps { grid-template-columns: minmax(0, 1fr); }
  #main:not(.a26) ~ section:not(.close-section) .founder-facts { border-left: 0 !important; border-top: 1px solid var(--p-line) !important; }
}
@media (max-width: 720px) {
  #main:not(.a26) { margin-top: -4.8rem !important; padding-top: 8rem !important; }
  #main:not(.a26) h1 { max-width: none !important; }
  #main:not(.a26) .hero-actions a.group { width: 100%; justify-content: center; }
  #main:not(.a26) ~ section:not(.close-section) .article-list { grid-template-columns: minmax(0, 1fr); }
  #main:not(.a26) ~ section:not(.close-section) .svc-cta { flex-direction: column !important; align-items: flex-start !important; }
  #main:not(.a26) ~ section:not(.close-section) .cta-band a.group { width: 100%; justify-content: center; }
  #main:not(.a26) ~ section:not(.close-section) .doc table { display: block; overflow-x: auto; }
  #main:not(.a26) ~ section:not(.close-section) .doc :is(p, li) { font-size: 16px !important; }
}
@media (prefers-reduced-motion: reduce) {
  #main:not(.a26) ~ section:not(.close-section) .article-list .al-more::after { transition: none; }
}

/* ===== Round 2 (Jov's review, 2026-11-05) ===== */

/* No side accent bars anywhere on these pages (Jov: "on the cards avoid these types of designs").
   The shared CSS and the laurel layer draw some (the statement rule, the quote rule); they all go. */
#main:not(.a26) .lw-rule::before, #main:not(.a26) ~ section:not(.close-section) .lw-rule::before { content: none !important; display: none !important; }
#main:not(.a26) .lw-rule, #main:not(.a26) ~ section:not(.close-section) .lw-rule { border-left: 0 !important; padding-left: 0 !important; }
#main:not(.a26) ~ section:not(.close-section) .doc blockquote::before { content: ""; position: absolute; left: 0; top: 0; width: 36px; height: 2px; border-radius: 2px; background: var(--p-terra); }
#main:not(.a26) ~ section:not(.close-section) .founder-note { border: 1px solid var(--p-line) !important; border-radius: 22px !important; }

/* Benefits: the contents panel beside the hero title (01-08, each a jump link down the page).
   Its background used the brand-light token, which the paper hero now maps to ink, so the labels vanished.
   It is now an ink card: numbers in terracotta italic, labels in on-ink, arrows muted. */
#main:not(.a26) .jx {
  background: var(--p-ink-card) !important; color: var(--p-on-ink) !important; border-radius: 22px !important;
  border: 1px solid var(--p-on-ink-line) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 40px 90px -40px rgba(23,22,21,.7) !important;
}
#main:not(.a26) .jx ul { padding: 10px !important; }
#main:not(.a26) .jx li + li { border-top: 1px solid var(--p-on-ink-line) !important; }
#main:not(.a26) .jx .jx-row { color: var(--p-on-ink) !important; min-height: 52px; border-radius: 12px; }
#main:not(.a26) .jx a.jx-row:hover, #main:not(.a26) .jx a.jx-row:focus-visible { background: rgba(240,236,232,.06) !important; }
#main:not(.a26) .jx a.jx-row:focus-visible { outline: 2px solid var(--p-terra-bright); outline-offset: -2px; }
#main:not(.a26) .jx .jx-l { font: 500 clamp(1.1rem, 1rem + .4vw, 1.3rem)/1.25 var(--p-serif) !important; color: var(--p-on-ink) !important; }
#main:not(.a26) .jx .jx-n::before { font: italic 500 16px/1 var(--p-serif) !important; color: var(--p-terra-bright) !important; }
#main:not(.a26) .jx .jx-go, #main:not(.a26) .jx svg { color: var(--p-on-ink-muted) !important; }
#main:not(.a26) .jx a.jx-row:hover .jx-go { color: var(--p-terra-bright) !important; }
#main:not(.a26) .jx .jx-ic { background: rgba(214,104,83,.16) !important; color: var(--p-terra-bright) !important; box-shadow: none !important; }
#main:not(.a26) .jx .jx-soon { background: rgba(240,236,232,.04) !important; border-top-color: var(--p-on-ink-line) !important; }
#main:not(.a26) .jx .jx-h { color: var(--p-on-ink-muted) !important; }

/* FAQ rows open and close smoothly where the browser can animate to auto height */
#main:not(.a26) ~ section:not(.close-section) details { interpolate-size: allow-keywords; }
#main:not(.a26) ~ section:not(.close-section) details::details-content {
  block-size: 0; overflow: clip; transition: block-size .4s var(--p-ease), content-visibility .4s allow-discrete;
}
#main:not(.a26) ~ section:not(.close-section) details[open]::details-content { block-size: auto; }
#main:not(.a26) ~ section:not(.close-section) details > summary::-webkit-details-marker { display: none; }

/* Pricing: the plan is the hero object. One centred glare card holds the plan name, the price, the terms and
   the buttons; "Included" below is a two-column checklist inside a second card. */
#main.price-hero:not(.a26) .about-hero-grid { display: flex; justify-content: center; max-width: none !important; width: 100%; }
#main.price-hero:not(.a26) .hero-copy {
  position: relative; isolation: isolate; width: 100%; max-width: 880px !important; margin-inline: auto;
  display: flex; flex-direction: column; align-items: center; text-align: center;
  padding: clamp(36px, 6vw, 72px) clamp(22px, 6vw, 80px) !important;
  background: var(--p-glare); border: 1px solid var(--p-line); border-radius: 28px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 2px 6px rgba(23,22,21,.05), 0 50px 100px -40px rgba(23,22,21,.35), 0 0 120px -30px rgba(214,104,83,.25);
}
#main.price-hero:not(.a26) h1 {
  max-width: none !important; margin-top: 18px; display: flex; flex-direction: column; align-items: center;
  font-size: clamp(2rem, 1.5rem + 1.8vw, 3rem) !important; line-height: 1.05 !important; letter-spacing: -0.015em !important;
}
#main.price-hero:not(.a26) .price-line { justify-content: center; margin-top: clamp(14px, 2vw, 22px); gap: 4px 16px; }
#main.price-hero:not(.a26) .price-line .amount {
  font: 500 clamp(4.6rem, 2.4rem + 8vw, 8.5rem)/.9 var(--p-serif) !important; font-style: normal !important;
  color: var(--p-ink) !important; letter-spacing: -0.035em !important; font-variant-numeric: lining-nums tabular-nums;
}
#main.price-hero:not(.a26) .price-line .per { font: 600 clamp(1rem, .95rem + .3vw, 1.15rem)/1.3 var(--p-sans) !important; color: var(--p-terra-text) !important; }
#main.price-hero:not(.a26) .hero-def { margin: 26px auto 0 !important; max-width: 38em; text-align: center; padding-top: 24px !important; border-top: 1px solid var(--p-line) !important; }
#main.price-hero:not(.a26) .hero-actions { justify-content: center; }
#main.price-hero:not(.a26) .hero-actions a.group.bg-terracotta { min-height: 60px; padding: 0 36px !important; font-size: 17px !important; }
#main.price-hero:not(.a26) .kicker { justify-content: center; }
#main.price-hero:not(.a26) .kicker::after { content: ""; width: 28px; height: 1px; background: currentColor; }

#main.price-hero:not(.a26) + section .section-head { text-align: center; margin-inline: auto; }
#main.price-hero:not(.a26) + section .section-head p { margin-inline: auto; }
#main.price-hero:not(.a26) + section .svc-grid.ledger {
  max-width: 980px; margin-inline: auto; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 0 clamp(28px, 5vw, 64px) !important;
  padding: clamp(18px, 3vw, 34px) clamp(22px, 4vw, 52px);
  background: var(--p-glare); border: 1px solid var(--p-line); border-radius: 22px; box-shadow: var(--p-glare-sh);
}
#main.price-hero:not(.a26) + section .svc-grid.ledger > .svc {
  background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--p-line) !important; border-radius: 0 !important; box-shadow: none !important;
  display: grid !important; grid-template-columns: 22px minmax(0, 1fr) !important; column-gap: 14px !important; padding: 18px 0 !important; align-items: start;
}
#main.price-hero:not(.a26) + section .svc-grid.ledger > .svc:nth-last-child(-n+2):nth-child(odd),
#main.price-hero:not(.a26) + section .svc-grid.ledger > .svc:last-child { border-bottom: 0 !important; }
#main.price-hero:not(.a26) + section .svc-grid.ledger > .svc:hover { box-shadow: none !important; }
#main.price-hero:not(.a26) + section .svc-grid.ledger > .svc .pic {
  grid-column: 1; grid-row: 1; width: 22px !important; height: 22px !important; margin-top: 2px; border-radius: 50% !important;
  background: rgba(214,104,83,.14) !important; box-shadow: none !important; position: relative;
}
#main.price-hero:not(.a26) + section .svc-grid.ledger > .svc .pic > * { display: none !important; }
#main.price-hero:not(.a26) + section .svc-grid.ledger > .svc .pic::after {
  content: ""; position: absolute; left: 8px; top: 5px; width: 5px; height: 9px;
  border: solid var(--p-terra-text); border-width: 0 2px 2px 0; transform: rotate(45deg);
}
#main.price-hero:not(.a26) + section .svc-grid.ledger > .svc p { grid-column: 2; font: 500 16px/1.55 var(--p-sans) !important; color: var(--p-ink) !important; }

#main.price-hero:not(.a26) ~ section#wont-do .founder-note { margin-inline: auto; max-width: 880px; text-align: center; }
#main.price-hero:not(.a26) ~ section#wont-do .founder-note .lead-in { margin-inline: auto; }
#main.price-hero:not(.a26) ~ section#wont-do { padding-top: clamp(3.5rem, 7vw, 6rem) !important; }
#main.price-hero:not(.a26) ~ section#partners .section-head { text-align: center; margin-inline: auto; }
#main.price-hero:not(.a26) ~ section#partners .section-head p { margin-inline: auto; }
#main.price-hero:not(.a26) ~ section#partners .svc-cta { max-width: 980px; margin-inline: auto; border-radius: 22px !important; }

/* Contact: words left, the form card right; on phones one column */
#main.statement--sub:not(.a26) .contact-hero-grid { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; align-items: center; }
#main:not(.a26) .glass-card { border-radius: 22px !important; }
#main:not(.a26) .glass-card .f-field { margin-top: 18px; }
#main:not(.a26) .glass-card .f-field:first-of-type { margin-top: 0; }
#main:not(.a26) .glass-card .f-field label { display: block; margin-bottom: 8px; text-transform: uppercase; }
#main:not(.a26) .glass-card .f-field input { height: 48px; min-height: 48px; padding: 0 14px !important; }
#main:not(.a26) .glass-card .f-field textarea { min-height: 120px; padding: 12px 14px !important; }
#main:not(.a26) .glass-card button[type="submit"] { width: 100%; min-height: 54px; margin-top: 24px !important; }
#main:not(.a26) .glass-card button[type="submit"]:focus-visible { outline: 2px solid var(--p-terra); outline-offset: 3px; }
@media (max-width: 900px) {
  #main.statement--sub:not(.a26) .contact-hero-grid { grid-template-columns: minmax(0, 1fr) !important; }
}
@media (max-width: 720px) {
  #main.price-hero:not(.a26) + section .svc-grid.ledger { grid-template-columns: minmax(0, 1fr) !important; }
  #main.price-hero:not(.a26) + section .svc-grid.ledger > .svc:nth-last-child(-n+2):nth-child(odd) { border-bottom: 1px solid var(--p-line) !important; }
  #main.price-hero:not(.a26) + section .svc-grid.ledger > .svc:last-child { border-bottom: 0 !important; }
  #main.price-hero:not(.a26) .hero-actions a.group { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  #main:not(.a26) ~ section:not(.close-section) details::details-content { transition: none; }
}

/* ===== Rev 10: every call-to-action card matches the home card =====
   Same width, terracotta card, serif heading, lead text, dark pill + outline pill, the free-check phone on the right.
   Covers the closing band (About, Benefits, feature pages), the card at the end of the blog and the articles,
   and the card at the end of Pricing. ":root" lifts these above the page rules without touching them. */
:root #main ~ section.section:has(.cta-band a[href*="audit.getalloro.com"]) > .container { max-width: 1400px !important; width: 100%; margin-inline: auto !important; padding-inline: max(20px, env(safe-area-inset-left, 0px)) !important; }
:root #main ~ section.section .cta-band.reveal:has(a[href*="audit.getalloro.com"]),
:root #main ~ section.section .svc-cta.span12:has(a[href*="audit.getalloro.com"]) {
  position: relative !important; overflow: hidden !important; isolation: isolate; width: auto !important; margin-left: 0 !important; margin-right: 0 !important;
  border: 0 !important; border-radius: 28px !important; color: #171615 !important;
  padding: clamp(40px, 7vw, 96px) clamp(24px, 6vw, 88px) !important;
  background: radial-gradient(90% 120% at 0% 0%, rgba(255,255,255,.28) 0%, rgba(255,255,255,0) 50%), radial-gradient(70% 90% at 100% 100%, rgba(120,40,20,.25) 0%, rgba(120,40,20,0) 60%), #d66853 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.35), 0 40px 80px -40px rgba(192,84,58,.7) !important;
  display: flex !important; flex-direction: column !important; align-items: flex-start !important; justify-content: center; gap: 22px !important; text-align: left !important; min-height: 0;
}
/* Pricing's card sits in a narrower grid: give it the same width as the others */
:root #main ~ section.section .svc-cta.span12:has(a[href*="audit.getalloro.com"]) { grid-column: 1 / -1 !important; width: min(1360px, calc(100vw - 40px)) !important; margin-left: calc(50% - min(680px, 50vw - 20px)) !important; transform: none !important; }
/* The page's own decorations give way to one soft drifting light, as on the home card */
:root #main ~ section.section .cta-band.reveal:has(a[href*="audit.getalloro.com"]) .decor { display: block !important; position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
:root #main ~ section.section .cta-band.reveal:has(a[href*="audit.getalloro.com"]) .decor > * { display: none !important; }
:root #main ~ section.section .cta-band.reveal:has(a[href*="audit.getalloro.com"]) .decor::before,
:root #main ~ section.section .svc-cta.span12:has(a[href*="audit.getalloro.com"])::before { content: "" !important; position: absolute; z-index: 0; width: 70%; height: 140%; top: -40%; left: -10%; inset: auto; background: radial-gradient(closest-side, rgba(255,255,255,.2), rgba(255,255,255,0)) !important; pointer-events: none; animation: a26-drift 16s ease-in-out infinite alternate; opacity: 1 !important; }
/* Words: left, the same column width as the home card */
:root #main ~ section.section .cta-band.reveal:has(a[href*="audit.getalloro.com"]) .ctac,
:root #main ~ section.section .svc-cta.span12:has(a[href*="audit.getalloro.com"]) > div { position: relative; z-index: 1; max-width: min(733px, calc((100% - 56px) * .65)) !important; margin: 0 !important; text-align: left !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 22px !important; }
:root #main ~ section.section .cta-band.reveal:has(a[href*="audit.getalloro.com"]) h2,
:root #main ~ section.section .svc-cta.span12:has(a[href*="audit.getalloro.com"]) h3 { margin: 0 !important; color: #171615 !important; font: 500 clamp(2.3rem, 1.3rem + 3.8vw, 4.4rem)/1.02 "Spectral", Georgia, "Times New Roman", serif !important; font-size: clamp(2.3rem, 1.3rem + 3.8vw, 4.4rem) !important; letter-spacing: -0.018em !important; text-wrap: balance; max-width: none !important; }
:root #main ~ section.section .cta-band.reveal:has(a[href*="audit.getalloro.com"]) h2 span,
:root #main ~ section.section .svc-cta.span12:has(a[href*="audit.getalloro.com"]) h3 span { color: #171615 !important; font-style: normal !important; }
:root #main ~ section.section .cta-band.reveal:has(a[href*="audit.getalloro.com"]) .ctac > p,
:root #main ~ section.section .svc-cta.span12:has(a[href*="audit.getalloro.com"]) p { margin: 0 !important; color: #2a1a14 !important; opacity: 1 !important; font: 400 clamp(1.05rem, 1rem + .35vw, 1.25rem)/1.6 "Plus Jakarta Sans", ui-sans-serif, system-ui, sans-serif !important; letter-spacing: 0 !important; max-width: 36em; }
/* Buttons: the dark pill first, then the outline pill; no icon on the outline pill, like the home card */
:root #main ~ section.section .cta-band.reveal:has(a[href*="audit.getalloro.com"]) .hero-actions,
:root #main ~ section.section .svc-cta.span12:has(a[href*="audit.getalloro.com"]) .hero-actions { position: relative; z-index: 1; display: flex !important; flex-wrap: wrap; justify-content: flex-start !important; align-items: center; gap: 14px 24px !important; margin: 0 !important; max-width: min(733px, calc((100% - 56px) * .65)); }
:root #main ~ section.section .cta-band.reveal:has(a[href*="audit.getalloro.com"]) .hero-actions a,
:root #main ~ section.section .svc-cta.span12:has(a[href*="audit.getalloro.com"]) .hero-actions a { position: relative; overflow: hidden; display: inline-flex !important; align-items: center; gap: 10px; min-height: 54px !important; height: 54px; padding: 0 28px !important; border-radius: 999px !important; font: 700 16px/1 "Plus Jakarta Sans", ui-sans-serif, system-ui, sans-serif !important; text-decoration: none !important; transform: none; transition: background-color .45s cubic-bezier(0.22, 1, 0.36, 1), box-shadow .45s cubic-bezier(0.22, 1, 0.36, 1), color .45s, border-color .45s !important; }
:root #main ~ section.section .cta-band.reveal:has(a[href*="audit.getalloro.com"]) .hero-actions a[href*="audit.getalloro.com"],
:root #main ~ section.section .svc-cta.span12:has(a[href*="audit.getalloro.com"]) .hero-actions a[href*="audit.getalloro.com"] { order: -1; background: #171615 !important; color: #f7f5f3 !important; border: 1px solid #171615 !important; box-shadow: 0 1px 2px rgba(23,22,21,.2), 0 10px 24px -12px rgba(23,22,21,.6) !important; }
:root #main ~ section.section .cta-band.reveal:has(a[href*="audit.getalloro.com"]) .hero-actions a[href*="audit.getalloro.com"]:hover,
:root #main ~ section.section .svc-cta.span12:has(a[href*="audit.getalloro.com"]) .hero-actions a[href*="audit.getalloro.com"]:hover { background: #000 !important; box-shadow: 0 1px 2px rgba(23,22,21,.2), 0 18px 34px -14px rgba(23,22,21,.65) !important; }
:root #main ~ section.section .cta-band.reveal:has(a[href*="audit.getalloro.com"]) .hero-actions a:not([href*="audit.getalloro.com"]),
:root #main ~ section.section .svc-cta.span12:has(a[href*="audit.getalloro.com"]) .hero-actions a:not([href*="audit.getalloro.com"]) { background: transparent !important; color: #171615 !important; border: 1px solid rgba(23,22,21,.45) !important; box-shadow: none !important; }
:root #main ~ section.section .cta-band.reveal:has(a[href*="audit.getalloro.com"]) .hero-actions a:not([href*="audit.getalloro.com"]):hover,
:root #main ~ section.section .svc-cta.span12:has(a[href*="audit.getalloro.com"]) .hero-actions a:not([href*="audit.getalloro.com"]):hover { background: rgba(23,22,21,.06) !important; }
:root #main ~ section.section .cta-band.reveal:has(a[href*="audit.getalloro.com"]) .hero-actions a:not([href*="audit.getalloro.com"]) svg,
:root #main ~ section.section .cta-band.reveal:has(a[href*="audit.getalloro.com"]) .hero-actions a:not([href*="audit.getalloro.com"]) i,
:root #main ~ section.section .svc-cta.span12:has(a[href*="audit.getalloro.com"]) .hero-actions a:not([href*="audit.getalloro.com"]) svg { display: none !important; }
:root #main ~ section.section .cta-band.reveal:has(a[href*="audit.getalloro.com"]) .hero-actions a[href*="audit.getalloro.com"] svg,
:root #main ~ section.section .svc-cta.span12:has(a[href*="audit.getalloro.com"]) .hero-actions a[href*="audit.getalloro.com"] svg { width: 18px; height: 18px; transition: transform .5s cubic-bezier(0.22, 1, 0.36, 1); }
:root #main ~ section.section .cta-band.reveal:has(a[href*="audit.getalloro.com"]) .hero-actions a[href*="audit.getalloro.com"]:hover svg,
:root #main ~ section.section .svc-cta.span12:has(a[href*="audit.getalloro.com"]) .hero-actions a[href*="audit.getalloro.com"]:hover svg { transform: translateX(4px); }
/* the light sweep on the dark pill */
:root #main ~ section.section .cta-band.reveal:has(a[href*="audit.getalloro.com"]) .hero-actions a[href*="audit.getalloro.com"]::after,
:root #main ~ section.section .svc-cta.span12:has(a[href*="audit.getalloro.com"]) .hero-actions a[href*="audit.getalloro.com"]::after { content: ""; position: absolute; inset: 0; pointer-events: none; transform: translateX(-120%); background: linear-gradient(110deg, rgba(255,255,255,0) 30%, rgba(255,255,255,.22) 50%, rgba(255,255,255,0) 70%); transition: transform .9s cubic-bezier(0.22, 1, 0.36, 1); }
:root #main ~ section.section .cta-band.reveal:has(a[href*="audit.getalloro.com"]) .hero-actions a[href*="audit.getalloro.com"]:hover::after,
:root #main ~ section.section .svc-cta.span12:has(a[href*="audit.getalloro.com"]) .hero-actions a[href*="audit.getalloro.com"]:hover::after { transform: translateX(120%); }
/* The free-check phone: same size, tilt and place as on the home card, peeking out of the bottom */
:root #main ~ section.section .cta-band.reveal:has(a[href*="audit.getalloro.com"])::after,
:root #main ~ section.section .svc-cta.span12:has(a[href*="audit.getalloro.com"])::after {
  content: "" !important; display: block !important; position: absolute; z-index: 0; left: auto; bottom: auto; opacity: 1 !important;
  right: calc(clamp(24px, 6vw, 88px) + ((100% - 2 * clamp(24px, 6vw, 88px) - 56px) * .35 - 250px) / 2) !important;
  top: calc(clamp(40px, 7vw, 96px) + 14px) !important; width: 250px !important; height: auto !important; aspect-ratio: 390 / 700; border-radius: 36px !important; border: 9px solid #171615 !important;
  background: #171615 url("https://alloro-main-bucket.s3.us-east-1.amazonaws.com/uploads/ae4510ab-43bd-43f1-925a-a7dbe062ecd4/4891cdb2-phone-check.webp.webp") top center / 100% auto no-repeat !important;
  box-shadow: 0 50px 80px -30px rgba(60,20,10,.6), 0 0 0 1px rgba(255,255,255,.1) inset !important;
  transform: rotate(6deg) translateY(8px) !important; transition: transform 1.1s cubic-bezier(0.22, 1, 0.36, 1) !important; pointer-events: none;
}
:root #main ~ section.section .cta-band.reveal:has(a[href*="audit.getalloro.com"]):hover::after,
:root #main ~ section.section .svc-cta.span12:has(a[href*="audit.getalloro.com"]):hover::after { transform: rotate(2deg) translateY(-6px) !important; }
@media (max-width: 860px) {
  :root #main ~ section.section .cta-band.reveal:has(a[href*="audit.getalloro.com"])::after,
  :root #main ~ section.section .svc-cta.span12:has(a[href*="audit.getalloro.com"])::after { display: none !important; }
  :root #main ~ section.section .cta-band.reveal:has(a[href*="audit.getalloro.com"]) .ctac,
  :root #main ~ section.section .svc-cta.span12:has(a[href*="audit.getalloro.com"]) > div,
  :root #main ~ section.section .cta-band.reveal:has(a[href*="audit.getalloro.com"]) .hero-actions,
  :root #main ~ section.section .svc-cta.span12:has(a[href*="audit.getalloro.com"]) .hero-actions { max-width: none !important; }
}
@media (prefers-reduced-motion: reduce) {
  :root #main ~ section.section .cta-band.reveal:has(a[href*="audit.getalloro.com"]) .decor::before,
  :root #main ~ section.section .svc-cta.span12:has(a[href*="audit.getalloro.com"])::before { animation: none; }
}

/* Rev 10c pricing width: a page rule capped the card at 980px */
:root #main ~ section.section .svc-cta.span12:has(a[href*="audit.getalloro.com"]) { max-width: none !important; }

/* Rev 10d buttons side by side */
:root #main ~ section.section .cta-band.reveal:has(a[href*="audit.getalloro.com"]) .hero-actions,
:root #main ~ section.section .svc-cta.span12:has(a[href*="audit.getalloro.com"]) .hero-actions { flex-direction: row !important; max-width: none !important; width: auto !important; }

/* Rev 13 contact cards: the whole card is the link (stretched over the card), with a lift on hover */
:root #main ~ section.section .ledger.ledger-1 > .svc { position: relative; cursor: pointer; transition: transform .55s cubic-bezier(0.22, 1, 0.36, 1), box-shadow .55s cubic-bezier(0.22, 1, 0.36, 1), border-color .55s !important; }
:root #main ~ section.section .ledger.ledger-1 > .svc > a.textlink::after { content: ""; position: absolute; inset: 0; border-radius: inherit; z-index: 1; }
:root #main ~ section.section .ledger.ledger-1 > .svc:hover { transform: translateY(-4px); border-color: rgba(214,104,83,.35) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 28px 50px -26px rgba(23,22,21,.35) !important; }
:root #main ~ section.section .ledger.ledger-1 > .svc:hover .textlink .arw, :root #main ~ section.section .ledger.ledger-1 > .svc:hover .textlink svg { transform: translateX(4px); }
:root #main ~ section.section .ledger.ledger-1 > .svc:focus-within { outline: 2px solid #d66853; outline-offset: 3px; }
:root #main ~ section.section .ledger.ledger-1 > .svc > a.textlink:focus-visible { outline: none; }
form[id^="form-"] { scroll-margin-top: 120px; }

/* Rev 13 contact link static: the link must not be the positioned box, or its click area stays link-sized */
:root #main ~ section.section .ledger.ledger-1 > .svc > a.textlink { position: static !important; }

/* ===== Rev 13: /benefits and /pricing reworked (layout only; every word unchanged) ===== */

/* ---------- /benefits ---------- */
/* Hero: the eight-job contents panel is back, as a light card beside the title (the shared CSS kept it at opacity 0) */
html:root body #main.r1-bhero { min-height: 0 !important; padding-bottom: clamp(3.5rem, 7vw, 6rem) !important; }
html:root body #main .hero-grid.r1-bh { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 26rem) !important; align-items: center !important; gap: clamp(2.5rem, 6vw, 6rem) !important; }
html:root body #main .r1-bh .hero-visual { display: block !important; opacity: 1 !important; visibility: visible !important; animation: none !important; transform: none !important; }
html:root body #main .r1-bh .jx { background: rgba(255,255,255,.94) !important; color: #171615 !important; border: 1px solid rgba(23,22,21,.08) !important; border-radius: 24px !important;
  box-shadow: inset 0 1px 0 #fff, 0 2px 6px rgba(23,22,21,.04), 0 44px 90px -40px rgba(23,22,21,.38), 0 0 120px -40px rgba(214,104,83,.35) !important; }
html:root body #main .r1-bh .jx ul { padding: 10px !important; }
html:root body #main .r1-bh .jx li + li { border-top: 1px solid rgba(23,22,21,.07) !important; }
html:root body #main .r1-bh .jx .jx-row { color: #171615 !important; min-height: 54px; border-radius: 14px; transition: background-color .45s cubic-bezier(0.22, 1, 0.36, 1) !important; }
html:root body #main .r1-bh .jx .jx-l { font: 500 clamp(1.1rem, 1rem + .35vw, 1.3rem)/1.25 "Spectral", Georgia, serif !important; color: #171615 !important; }
html:root body #main .r1-bh .jx .jx-n::before { font: italic 500 16px/1 "Spectral", Georgia, serif !important; color: #b1462c !important; }
html:root body #main .r1-bh .jx svg, html:root body #main .r1-bh .jx .jx-go { color: #9a938a !important; transition: transform .45s cubic-bezier(0.22, 1, 0.36, 1), color .45s !important; }
html:root body #main .r1-bh .jx a.jx-row:hover { background: rgba(214,104,83,.08) !important; }
html:root body #main .r1-bh .jx a.jx-row:hover svg { color: #b1462c !important; transform: translateY(3px); }
@media (max-width: 960px) { html:root body #main .hero-grid.r1-bh { grid-template-columns: minmax(0, 1fr) !important; } html:root body #main .r1-bh .hero-visual { display: none !important; } }

/* "One tool per job": less empty space around it */
html:root body #main ~ section#problem { padding-block: clamp(3rem, 6vw, 5rem) !important; }

/* Founder quote: one clean card, a large serif quote, the name as a small label, two plain links */
html:root body #main ~ section#founder { padding-block: clamp(3rem, 6vw, 5rem) !important; background: transparent !important; }
html:root body #main ~ section#founder .founder-row {
  display: grid !important; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: clamp(24px, 4vw, 56px);
  max-width: 1000px; margin-inline: auto; padding: clamp(28px, 4.5vw, 56px) clamp(24px, 5vw, 64px);
  border-radius: 28px; background: linear-gradient(160deg, #ffffff 0%, #fbf6f2 100%); border: 1px solid rgba(23,22,21,.07);
  box-shadow: inset 0 1px 0 #fff, 0 2px 6px rgba(23,22,21,.04), 0 44px 90px -50px rgba(23,22,21,.38);
}
html:root body #main ~ section#founder .founder-row img { width: clamp(108px, 11vw, 156px) !important; height: auto !important; aspect-ratio: 1; object-fit: cover; border-radius: 50% !important; margin: 0 !important; }
html:root body #main ~ section#founder .r1-founder { background: none !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; margin: 0 !important; display: block !important; width: auto !important; max-width: none !important; }
html:root body #main ~ section#founder .r1-founder::before, html:root body #main ~ section#founder .r1-founder::after { display: none !important; }
html:root body #main ~ section#founder blockquote.r1-quote, html:root body #main ~ section#founder blockquote.r1-quote p {
  margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important; box-shadow: none !important;
  font: italic 400 clamp(1.6rem, 1.1rem + 1.9vw, 2.7rem)/1.22 "Spectral", Georgia, serif !important; font-size: clamp(1.6rem, 1.1rem + 1.9vw, 2.7rem) !important;
  color: #171615 !important; letter-spacing: -0.01em; text-wrap: balance;
}
html:root body #main ~ section#founder blockquote.r1-quote::before, html:root body #main ~ section#founder blockquote.r1-quote::after { display: none !important; }
html:root body #main ~ section#founder .r1-fname { margin: 18px 0 0 !important; font: 700 12px/1.4 "Plus Jakarta Sans", sans-serif !important; letter-spacing: .14em !important; text-transform: uppercase; color: #6b635c !important; }
html:root body #main ~ section#founder .r1-flinks { display: flex !important; flex-wrap: wrap; gap: 10px 26px; margin-top: 20px !important; }
html:root body #main ~ section#founder .r1-flinks a { font: 700 15px/1.3 "Plus Jakarta Sans", sans-serif !important; color: #b1462c !important; text-decoration: none !important; border-bottom: 1px solid rgba(177,70,44,.35); padding-bottom: 2px; transition: border-color .4s, color .4s; }
html:root body #main ~ section#founder .r1-flinks a:hover { color: #171615 !important; border-bottom-color: #171615; }
@media (max-width: 700px) { html:root body #main ~ section#founder .founder-row { grid-template-columns: minmax(0, 1fr); justify-items: start; } }

/* Eight jobs: the heading on top, the jobs as a two-column grid of cards */
html:root body #main ~ section#eight-jobs .jobs-split { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: clamp(26px, 4vw, 44px) !important; }
html:root body #main ~ section#eight-jobs .jobs-split .section-head { position: static !important; text-align: center; margin-inline: auto; }
html:root body #main ~ section#eight-jobs .jr-list { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; counter-reset: job; }
html:root body #main ~ section#eight-jobs .jr-list .jr {
  display: grid !important; grid-template-columns: 48px minmax(0, 1fr) !important; column-gap: 18px !important; align-content: start;
  padding: 26px 28px !important; margin: 0 !important; border: 1px solid rgba(23,22,21,.08) !important; border-radius: 22px !important;
  background: linear-gradient(170deg, #ffffff 0%, #fbf6f2 100%) !important; box-shadow: inset 0 1px 0 #fff, 0 26px 50px -38px rgba(23,22,21,.38) !important;
  transition: transform .55s cubic-bezier(0.22, 1, 0.36, 1), box-shadow .55s cubic-bezier(0.22, 1, 0.36, 1), border-color .55s !important;
}
html:root body #main ~ section#eight-jobs .jr-list .jr:hover { transform: translateY(-3px); border-color: rgba(214,104,83,.3) !important; box-shadow: inset 0 1px 0 #fff, 0 34px 60px -36px rgba(23,22,21,.42) !important; }
html:root body #main ~ section#eight-jobs .jr-list .jr-n { display: grid !important; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: rgba(214,104,83,.1); }
html:root body #main ~ section#eight-jobs .jr-list .jr-n::before { font: italic 500 18px/1 "Spectral", Georgia, serif !important; color: #b1462c !important; }
html:root body #main ~ section#eight-jobs .jr-list .jr h3 { margin: 8px 0 0 !important; }
html:root body #main ~ section#eight-jobs .jr-list .jr p { margin-top: 8px !important; }
html:root body #main ~ section#eight-jobs .jr-links { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-top: 14px !important; }
html:root body #main ~ section#eight-jobs .jfaq { width: fit-content; max-width: 100%; margin: 26px auto 0 !important; padding: 14px 24px !important; border-radius: 999px !important; text-align: center;
  background: rgba(255,255,255,.75) !important; border: 1px solid rgba(23,22,21,.08) !important; box-shadow: 0 16px 34px -26px rgba(23,22,21,.35) !important; }
@media (max-width: 820px) { html:root body #main ~ section#eight-jobs .jr-list { grid-template-columns: minmax(0, 1fr); } html:root body #main ~ section#eight-jobs .jfaq { border-radius: 18px !important; } }

/* ---------- /pricing ---------- */
/* Hero: one dark plan card. The plan and price on the left; the terms and buttons on the right */
html:root body #main.price-hero .about-hero-grid { display: block !important; }
html:root body #main.price-hero .hero-copy {
  display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "k k" "h p" "h a"; column-gap: clamp(32px, 6vw, 88px); align-items: start; text-align: left !important;
  max-width: 1180px !important; width: 100%; margin-inline: auto; padding: clamp(36px, 5.5vw, 80px) clamp(26px, 5.5vw, 80px) !important;
  border-radius: 32px !important; border: 1px solid #2e2c29 !important; color: #f0ece8;
  background: radial-gradient(70% 90% at 100% 0%, rgba(214,104,83,.32) 0%, rgba(214,104,83,0) 60%), radial-gradient(60% 80% at 0% 100%, rgba(224,122,102,.14) 0%, rgba(224,122,102,0) 60%), linear-gradient(160deg, #23201e 0%, #171615 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 60px 110px -50px rgba(23,22,21,.75) !important;
}
html:root body #main.price-hero .hero-copy > .kicker, html:root body #main.price-hero .hero-copy > span:first-child { grid-area: k; justify-content: flex-start !important; color: #e07a66 !important; margin-bottom: clamp(18px, 2.4vw, 28px); }
html:root body #main.price-hero .hero-copy > span:first-child::after { display: none !important; }
html:root body #main.price-hero h1 { grid-area: h; margin: 0 !important; align-items: flex-start !important; color: #f0ece8 !important; font-size: clamp(2.4rem, 1.6rem + 2.6vw, 3.8rem) !important; }
html:root body #main.price-hero .price-line { justify-content: flex-start !important; margin-top: clamp(14px, 2vw, 24px) !important; }
html:root body #main.price-hero .price-line .amount { color: #f7f5f3 !important; font-size: clamp(5rem, 2.6rem + 8vw, 9.5rem) !important; }
html:root body #main.price-hero .price-line .per { color: #e07a66 !important; }
html:root body #main.price-hero .hero-copy > p { grid-area: p; margin: 0 !important; padding: 0 !important; border: 0 !important; text-align: left !important; max-width: none; color: #cfc7bf !important;
  font: 400 clamp(1.05rem, 1rem + .35vw, 1.25rem)/1.6 "Plus Jakarta Sans", sans-serif !important; align-self: end; }
html:root body #main.price-hero .hero-copy > .hero-actions { grid-area: a; justify-content: flex-start !important; margin-top: 28px !important; }
html:root body #main.price-hero .hero-actions a[href*="audit.getalloro.com"] { background: #f7f5f3 !important; color: #171615 !important; border-color: #f7f5f3 !important; box-shadow: 0 18px 34px -16px rgba(0,0,0,.6) !important; }
html:root body #main.price-hero .hero-actions a[href*="audit.getalloro.com"]:hover { background: #fff !important; }
html:root body #main.price-hero .hero-actions a:not([href*="audit.getalloro.com"]) { background: transparent !important; color: #f0ece8 !important; border: 1px solid rgba(240,236,232,.35) !important; }
html:root body #main.price-hero .hero-actions a:not([href*="audit.getalloro.com"]):hover { background: rgba(240,236,232,.08) !important; }
@media (max-width: 860px) {
  html:root body #main.price-hero .hero-copy { grid-template-columns: minmax(0, 1fr); grid-template-areas: "k" "h" "p" "a"; }
  html:root body #main.price-hero .hero-copy > p { margin-top: 24px !important; }
}

/* Included: nine tiles, each with its own icon */
html:root body #main ~ section#included .svc-grid.ledger {
  max-width: 1180px !important; margin-inline: auto; display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 16px !important;
  padding: 0 !important; background: none !important; border: 0 !important; box-shadow: none !important;
}
html:root body #main ~ section#included .svc-grid.ledger > .svc {
  display: flex !important; align-items: flex-start; gap: 16px !important; padding: 22px 24px !important; border-radius: 20px !important;
  border: 1px solid rgba(23,22,21,.08) !important; background: linear-gradient(170deg, #ffffff 0%, #fbf6f2 100%) !important;
  box-shadow: inset 0 1px 0 #fff, 0 24px 48px -38px rgba(23,22,21,.38) !important;
  transition: transform .55s cubic-bezier(0.22, 1, 0.36, 1), box-shadow .55s cubic-bezier(0.22, 1, 0.36, 1), border-color .55s !important;
}
html:root body #main ~ section#included .svc-grid.ledger > .svc:hover { transform: translateY(-3px); border-color: rgba(214,104,83,.3) !important; box-shadow: inset 0 1px 0 #fff, 0 32px 56px -36px rgba(23,22,21,.42) !important; }
html:root body #main ~ section#included .svc-grid.ledger > .svc .pic { flex: none; display: grid !important; place-items: center; width: 42px !important; height: 42px !important; margin: 0 !important; border-radius: 12px !important; background: rgba(214,104,83,.12) !important; color: #b1462c !important; }
html:root body #main ~ section#included .svc-grid.ledger > .svc .pic::after { display: none !important; }
html:root body #main ~ section#included .svc-grid.ledger > .svc .pic > * { display: block !important; width: 20px !important; height: 20px !important; color: #b1462c !important; }
html:root body #main ~ section#included .svc-grid.ledger > .svc p { margin: 0 !important; font: 500 15.5px/1.55 "Plus Jakarta Sans", sans-serif !important; color: #171615 !important; }
@media (max-width: 960px) { html:root body #main ~ section#included .svc-grid.ledger { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
@media (max-width: 640px) { html:root body #main ~ section#included .svc-grid.ledger { grid-template-columns: minmax(0, 1fr) !important; } }

/* What we won't do: a wide note, heading left, the promise and signature right */
html:root body #main ~ section#wont-do .container > article {
  display: grid !important; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); grid-template-areas: "h b" "h s"; column-gap: clamp(28px, 6vw, 88px); align-items: start;
  max-width: 1180px !important; margin-inline: auto; text-align: left !important; padding: clamp(32px, 5vw, 64px) clamp(26px, 5vw, 72px) !important;
  border-radius: 28px !important; border: 1px solid rgba(23,22,21,.08) !important; border-left-width: 1px !important;
  background: linear-gradient(160deg, #ffffff 0%, #f8f1eb 100%) !important; box-shadow: inset 0 1px 0 #fff, 0 44px 90px -54px rgba(23,22,21,.4) !important;
}
html:root body #main ~ section#wont-do .container > article::before, html:root body #main ~ section#wont-do .container > article::after { display: none !important; }
html:root body #main ~ section#wont-do article > h2 { grid-area: h; margin: 0 !important; text-align: left !important; font-size: clamp(2rem, 1.4rem + 2vw, 3.2rem) !important; line-height: 1.05 !important; }
html:root body #main ~ section#wont-do article > h2 .lead-in, html:root body #main ~ section#wont-do article > h2 > span { margin: 0 0 12px !important; display: inline-block; }
html:root body #main ~ section#wont-do article > p:not(:last-child) { grid-area: b; margin: 0 !important; font: 400 clamp(1.2rem, 1.05rem + .6vw, 1.55rem)/1.5 "Spectral", Georgia, serif !important; color: #171615 !important; text-align: left !important; }
html:root body #main ~ section#wont-do article > p:last-child { grid-area: s; margin: 22px 0 0 !important; text-align: left !important; font: 600 14px/1.5 "Plus Jakarta Sans", sans-serif !important; color: #6b635c !important; }
@media (max-width: 860px) { html:root body #main ~ section#wont-do .container > article { grid-template-columns: minmax(0, 1fr); grid-template-areas: "h" "b" "s"; } html:root body #main ~ section#wont-do article > p:not(:last-child) { margin-top: 18px !important; } }

/* Questions: the answer as a soft pill under the heading */
html:root body #main ~ section#partners .section-head p { width: fit-content; max-width: 100%; margin: 18px auto 0 !important; padding: 12px 22px; border-radius: 999px;
  background: rgba(255,255,255,.75); border: 1px solid rgba(23,22,21,.08); }

/* Rev 13b pages: the note's label on its own line; the plan card's buttons on one row */
html:root body #main ~ section#wont-do article > h2 > span:first-child { display: block !important; margin: 0 0 14px !important; }
html:root body #main ~ section#wont-do article > h2 > span:first-child br { display: none; }
html:root body #main.price-hero .hero-copy { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); }
html:root body #main.price-hero .hero-copy > .hero-actions { flex-wrap: wrap; gap: 12px 14px !important; }
html:root body #main.price-hero .hero-copy > .hero-actions a { min-height: 54px !important; padding: 0 26px !important; font-size: 16px !important; }

/* Rev 14 pages: the closing CTA cards sit in the site column again (Rev 10 had widened them to 1360px) */
html:root body #main ~ section.section:has(.cta-band a[href*="audit.getalloro.com"]) > .container { width: min(100% - (var(--gutter) * 2), 1180px) !important; padding-inline: 0 !important; max-width: none !important; }
@media (min-width: 640px) { html:root body #main ~ section.section:has(.cta-band a[href*="audit.getalloro.com"]) > .container { max-width: 40rem !important; } }
@media (min-width: 768px) { html:root body #main ~ section.section:has(.cta-band a[href*="audit.getalloro.com"]) > .container { max-width: 48rem !important; } }
@media (min-width: 1024px) { html:root body #main ~ section.section:has(.cta-band a[href*="audit.getalloro.com"]) > .container { max-width: 64rem !important; } }
@media (min-width: 1280px) { html:root body #main ~ section.section:has(.cta-band a[href*="audit.getalloro.com"]) > .container { max-width: 80rem !important; } }
@media (min-width: 1536px) { html:root body #main ~ section.section:has(.cta-band a[href*="audit.getalloro.com"]) > .container { max-width: 96rem !important; } }
html:root body #main ~ section.section .svc-cta.span12:has(a[href*="audit.getalloro.com"]) { width: auto !important; margin-left: 0 !important; margin-right: 0 !important; }