/* PhotoGraph — commercial site styles (shared by every page)
   Layout: one centered 1200px column; white and cream bands alternate,
   navy is reserved for proof figures, calls to action and the footer. */
:root {
  --navy: #1C2D50;
  --navy-deep: #111D36;
  --navy-mid: #243454;
  --gold: #B8934A;
  --gold-lt: #D4AE71;
  --gold-ink: #8A5F20;      /* AA-contrast gold for text on light grounds */
  --cream: #F6F3EE;
  --warm: #EAE6DF;
  --ink: #1C2D50;
  --muted: #5A6478;
  --white: #FFFFFF;
  --line: rgba(28, 45, 80, 0.12);
  --serif: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --sans: 'DM Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --wrap: 1200px;
  --gut: clamp(16px, 4vw, 64px);
  --sec: clamp(3.5rem, 7vw, 6.5rem);
  --head-h: 70px;
  color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.6;
  color: var(--ink);
  background: var(--white);
  -webkit-font-smoothing: antialiased;
}
[hidden] { display: none !important; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
h1, h2, h3, h4, p, ul, ol, figure, dl, dd, blockquote { margin: 0; }
[id] { scroll-margin-top: calc(var(--head-h) + 70px); }
:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; border-radius: 3px; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  html { scroll-behavior: auto; }
}

.wrap { max-width: calc(var(--wrap) + 2 * var(--gut)); margin-inline: auto; padding-inline: var(--gut); }
.skip {
  position: absolute; left: 0; top: -100px; z-index: 999;
  background: var(--navy); color: var(--white); padding: .7rem 1.2rem; text-decoration: none;
}
.skip:focus { top: 0; }

/* Brand wordmark: Photo (bold) + Graph (light italic), always Arial / sans-serif.
   BRAND RULE: applies everywhere, including inside serif headings. Do not inherit the surrounding font. */
.pg, .pg b, .pg i { font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif; letter-spacing: normal; text-transform: none; }
.pg { white-space: nowrap; }
.pg b { font-weight: 700; font-style: normal; }
.pg i { font-weight: 300; font-style: italic; }
h1 .pg, h2 .pg { font-size: .9em; }  /* Arial runs larger than the heading serif; scale to match */

/* ── Header ── */
.site-head {
  position: sticky; top: env(safe-area-inset-top, 0px); z-index: 50;
  background: rgba(255, 255, 255, 0.97);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line);
}
.head-row { display: flex; align-items: center; gap: 1.75rem; height: var(--head-h); }
.brand { display: flex; align-items: center; gap: 10px; text-decoration: none; font-size: 20px; color: var(--navy); flex-shrink: 0; }
.brand-logo { height: 36px; width: auto; }
.brand-logo.ph-missing { display: none; }
.menu { display: flex; align-items: center; justify-content: space-between; flex: 1; gap: 1rem; }
.menu > ul { display: flex; gap: .15rem; list-style: none; padding: 0; margin: 0; }
.menu > ul > li { position: relative; }
.menu > ul > li > a {
  display: block; padding: .55rem .75rem; font-size: 14.5px; color: var(--muted);
  text-decoration: none; border-radius: 4px; transition: color .2s;
}
.menu > ul > li > a:hover { color: var(--navy); }
.menu > ul > li > a[aria-current="page"] { color: var(--navy); box-shadow: inset 0 -2px 0 var(--gold); border-radius: 0; }
.has-sub > a::after {
  content: ""; display: inline-block; width: 6px; height: 6px; margin-left: 7px;
  border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor;
  transform: translateY(-3px) rotate(45deg); opacity: .55;
}
.sub {
  position: absolute; top: 100%; left: -.5rem; min-width: 310px; display: none;
  background: var(--white); border: 1px solid var(--line); border-radius: 10px; padding: .5rem;
  box-shadow: 0 18px 40px -18px rgba(17, 29, 54, 0.35);
}
.has-sub:hover .sub, .has-sub:focus-within .sub { display: block; }
.sub ul { list-style: none; padding: 0; }
.sub a { display: block; padding: .6rem .75rem; border-radius: 6px; text-decoration: none; }
.sub a:hover { background: var(--cream); }
.sub strong { display: block; font-size: 14px; font-weight: 500; color: var(--navy); }
.sub span { display: block; font-size: 12.5px; font-weight: 300; color: var(--muted); line-height: 1.45; }
.menu-cta { display: flex; align-items: center; gap: 1.1rem; flex-shrink: 0; }
.menu-cta .link { font-size: 14px; font-weight: 500; color: var(--navy); text-decoration: none; }
.menu-cta .link:hover { text-decoration: underline; text-underline-offset: 4px; }
.nav-toggle {
  display: none; margin-left: auto; width: 44px; height: 44px; padding: 13px 9px;
  background: none; border: 0; cursor: pointer; flex-direction: column; justify-content: space-between;
}
.nav-toggle span { display: block; height: 2px; background: var(--navy); border-radius: 2px; transition: transform .25s, opacity .25s; }
.nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

/* ── Buttons & links ── */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  padding: 13px 24px; border-radius: 4px; border: 1.5px solid transparent;
  font: 500 15px/1.2 var(--sans); letter-spacing: .01em; text-decoration: none; cursor: pointer;
  transition: background .2s, border-color .2s, transform .15s;
}
.btn:hover { transform: translateY(-1px); }
.btn-navy { background: var(--navy); color: var(--white); }
.btn-navy:hover { background: var(--navy-deep); }
.btn-ghost { background: transparent; color: var(--navy); border-color: rgba(28, 45, 80, 0.28); }
.btn-ghost:hover { border-color: var(--navy); }
.btn-gold { background: var(--gold); color: var(--navy-deep); }
.btn-gold:hover { background: var(--gold-lt); }
.btn-light { background: transparent; color: var(--white); border-color: rgba(255, 255, 255, 0.4); }
.btn-light:hover { border-color: var(--white); }
.btn-sm { padding: 9px 18px; font-size: 13.5px; }
.more {
  justify-self: start; font-weight: 500; font-size: 15px; color: var(--navy); text-decoration: none;
  border-bottom: 1.5px solid rgba(184, 147, 74, 0.55); padding-bottom: 2px;
}
.more::after { content: " \2192"; }
.more:hover { border-color: var(--navy); }

/* ── Type & bands ── */
.band { padding-block: var(--sec); }
.band-cream { background: var(--cream); }
.band-tight { padding-block: clamp(2.5rem, 5vw, 4rem); }
.eyebrow { font-size: 12.5px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-ink); }
h1 {
  font-family: var(--serif); font-weight: 600; font-size: clamp(2.2rem, 4.2vw, 3.35rem);
  line-height: 1.14; letter-spacing: -.02em; color: var(--navy-deep); text-wrap: balance;
}
h1 em, h2 em { font-style: italic; color: var(--gold-ink); }
h1 .quiet { display: block; font-weight: 400; color: var(--navy); }
h2 {
  font-family: var(--serif); font-weight: 600; font-size: clamp(1.75rem, 3vw, 2.45rem);
  line-height: 1.2; letter-spacing: -.02em; color: var(--navy-deep); text-wrap: balance;
}
h3 { font-size: 17px; font-weight: 500; color: var(--navy); line-height: 1.35; }
.lead { font-size: clamp(16px, 1.55vw, 18px); font-weight: 300; color: var(--muted); line-height: 1.72; max-width: 62ch; }
.body { font-size: 15px; font-weight: 300; color: var(--muted); line-height: 1.7; max-width: 66ch; }
.body strong { font-weight: 500; color: var(--navy); }
.small { font-size: 12.5px; font-weight: 300; color: var(--muted); line-height: 1.6; }
.sec-head { display: grid; gap: 1rem; margin-bottom: clamp(2rem, 4vw, 3.25rem); max-width: 780px; }
.sec-head.center { margin-inline: auto; text-align: center; justify-items: center; }
.stack { display: grid; gap: 1.25rem; align-content: start; min-width: 0; }

/* ── Hero (home) ── */
.hero { background: var(--cream); padding-block: clamp(2.75rem, 6vw, 5rem); }
.hero-grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
.hero-copy { display: grid; gap: 1.35rem; min-width: 0; }
.badge {
  justify-self: start; display: inline-flex; align-items: center; gap: 8px;
  background: rgba(184, 147, 74, 0.12); border: 1px solid rgba(184, 147, 74, 0.32); color: var(--gold-ink);
  padding: 6px 14px; border-radius: 100px; font-size: 12px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase;
}
.badge::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--gold); flex-shrink: 0; }
.actions { display: flex; flex-wrap: wrap; gap: .9rem; align-items: center; }
.ticks { display: flex; flex-wrap: wrap; gap: .5rem 1.4rem; list-style: none; padding: 0; font-size: 14px; color: var(--muted); }
.ticks li { display: flex; align-items: center; gap: .5rem; }
.ticks li::before, .checks li::before {
  content: ""; width: 16px; height: 16px; border-radius: 50%; flex-shrink: 0;
  background: var(--navy) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2 5 8.6l4.5-5' fill='none' stroke='%23fff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/10px no-repeat;
}
.hero-graph { min-width: 0; }
.hero-graph svg { width: 100%; height: auto; overflow: visible; }
.hero-graph figcaption { font-size: 12.5px; color: var(--muted); text-align: center; margin-top: .25rem; }
.hg text { font-family: var(--sans); }
.hg .cap { font-size: 11.5px; fill: var(--muted); paint-order: stroke; stroke: var(--cream); stroke-width: 5px; stroke-linejoin: round; }
.hg .ring { transform-origin: center; transform-box: fill-box; animation: hg-spin 60s linear infinite; }
@keyframes hg-spin { to { transform: rotate(360deg); } }

/* ── Inner-page hero ── */
.page-hero { background: var(--cream); padding-block: clamp(2.75rem, 5.5vw, 4.75rem); }
.page-hero .wrap { display: grid; gap: 1.2rem; justify-items: start; }
.page-hero h1 { max-width: 22ch; }

/* ── In-page section tabs ── */
.anchor-bar {
  position: sticky; top: calc(var(--head-h) + env(safe-area-inset-top, 0px)); z-index: 40;
  background: var(--white); border-bottom: 1px solid var(--line);
}
.anchor-bar ul { display: flex; gap: .25rem; list-style: none; padding: 0; overflow-x: auto; scrollbar-width: none; }
.anchor-bar ul::-webkit-scrollbar { display: none; }
.anchor-bar a {
  display: block; padding: .95rem .9rem; font-size: 14px; color: var(--muted); text-decoration: none;
  white-space: nowrap; border-bottom: 2px solid transparent; transition: color .2s, border-color .2s;
}
.anchor-bar a:hover { color: var(--navy); }
.anchor-bar a.on { color: var(--navy); border-color: var(--gold); }

/* ── Proof strip ── */
.proof { background: var(--navy); color: var(--white); padding-block: 2.5rem; }
.proof ul { display: grid; grid-template-columns: repeat(4, 1fr); list-style: none; padding: 0; }
.proof li { padding: .25rem 1.75rem; border-left: 1px solid rgba(255, 255, 255, 0.12); min-width: 0; }
.proof li:first-child { padding-left: 0; border-left: 0; }
.proof-n { font-family: var(--serif); font-size: 2.05rem; font-weight: 700; line-height: 1.05; font-variant-numeric: lining-nums; }
.proof-n span { color: var(--gold-lt); }
.proof-l { font-size: 13px; font-weight: 300; color: rgba(255, 255, 255, 0.72); margin-top: 6px; line-height: 1.5; }

/* ── Layout helpers ── */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 5vw, 4.5rem); align-items: start; }
.split.mid { align-items: center; }
.split.wide-left { grid-template-columns: 1.15fr 1fr; }
.split > * { min-width: 0; }

/* Ask pair & pillars */
.ask-pair { border-left: 3px solid var(--gold); padding: .35rem 0 .35rem 1.1rem; display: grid; gap: .45rem; }
.ask-row { font-size: 16px; line-height: 1.55; font-weight: 300; color: var(--muted); }
.ask-row b { font-weight: 500; color: var(--navy); }
.ask-row q { font-family: var(--serif); font-style: italic; color: var(--navy-deep); }
.ask-row.ours q { color: var(--gold-ink); font-weight: 600; }
.pillars { list-style: none; padding: 0; }
.pillars li { display: grid; grid-template-columns: 1fr; gap: 2px; padding: .85rem 0; border-top: 1px solid var(--line); }
.pillars li:last-child { border-bottom: 1px solid var(--line); }
.pillars strong { font-size: 15px; font-weight: 500; color: var(--navy); }
.pillars p { font-size: 14px; font-weight: 300; color: var(--muted); line-height: 1.6; }

/* Evidence card */
.find-card { background: var(--white); border: 1px solid var(--line); border-radius: 12px; padding: 1.6rem 1.6rem 0; overflow: hidden; }
.find-card h3 { font-family: var(--serif); font-size: 1.35rem; font-weight: 600; color: var(--navy-deep); margin-bottom: .3rem; }
.find-sub { font-size: 13px; font-weight: 300; color: var(--muted); line-height: 1.55; margin-bottom: 1.2rem; }
.find-label { font-size: 10.5px; font-weight: 600; letter-spacing: .11em; text-transform: uppercase; margin-bottom: .6rem; }
.find-label.them { color: #6E655B; }
.find-label.us { color: var(--gold-ink); }
.find-them { display: grid; grid-template-columns: 92px 1fr; gap: 1rem; align-items: center; background: #F0EDE8; border-radius: 8px; padding: .75rem; margin-bottom: 1.1rem; }
.find-them .ph { width: 92px; height: 110px; }
.find-them p { font-size: 13px; font-weight: 300; color: #5E574F; line-height: 1.55; }
.find-them p b { display: block; font-weight: 500; color: #3F3A34; font-size: 13.5px; }
.find-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px 8px; list-style: none; padding: 0; margin-bottom: 1.25rem; }
.find-grid .ph { aspect-ratio: 480 / 331; border: 1px solid rgba(184, 147, 74, 0.4); }
.find-grid figcaption { font-size: 11px; color: var(--muted); line-height: 1.3; margin-top: 4px; }
.find-band { margin: 0 -1.6rem; background: var(--navy); color: var(--white); display: grid; grid-template-columns: 1fr 1fr; }
.find-band > div { padding: 1rem 1.6rem 1.1rem; }
.find-band > div + div { border-left: 1px solid rgba(255, 255, 255, 0.12); }
.find-band-n { font-family: var(--serif); font-size: 1.5rem; font-weight: 700; line-height: 1.1; }
.find-band-n span { color: var(--gold-lt); }
.find-band-l { font-size: 12px; font-weight: 300; color: rgba(255, 255, 255, 0.75); line-height: 1.45; margin-top: 3px; }

/* Image slots: real files on the live site, a labeled stand-in if a file is missing */
.ph { position: relative; background: var(--warm); border-radius: 6px; overflow: hidden; max-width: 100%; }
.ph img { width: 100%; height: 100%; object-fit: cover; }
.ph.ph-missing img { opacity: 0; }
.ph.ph-missing::after {
  content: attr(data-file); position: absolute; inset: 0; display: grid; place-items: center;
  padding: .4rem; text-align: center; word-break: break-all; font-size: 10px; color: var(--muted);
  background: repeating-linear-gradient(135deg, var(--cream) 0 8px, var(--warm) 8px 16px);
}

/* Process steps (a real sequence, so numbered) */
.steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; list-style: none; padding: 0; }
.steps li { border-top: 2px solid var(--gold); padding-top: 1rem; display: grid; gap: .45rem; align-content: start; }
.step-n { font-family: var(--serif); font-weight: 600; color: var(--gold-ink); font-size: .95rem; }
.steps p { font-size: 14px; font-weight: 300; color: var(--muted); line-height: 1.6; }

/* Solution tabs */
.tabs { display: grid; grid-template-columns: 250px 1fr; gap: 1.75rem; align-items: start; }
.tablist { display: grid; gap: .3rem; }
.tab {
  font: inherit; text-align: left; cursor: pointer; background: transparent; border: 0;
  padding: .85rem 1rem; border-radius: 8px; color: var(--muted); font-size: 15px; font-weight: 500;
  transition: background .2s, color .2s;
}
.tab small { display: block; font-size: 12.5px; font-weight: 300; color: var(--muted); margin-top: 2px; }
.tab:hover { color: var(--navy); }
.tab[aria-selected="true"] { background: var(--white); color: var(--navy); box-shadow: 0 0 0 1px var(--line), 0 10px 24px -18px rgba(17, 29, 54, 0.4); }
.tabpanel {
  background: var(--white); border: 1px solid var(--line); border-radius: 12px;
  padding: clamp(1.5rem, 3vw, 2.5rem); display: grid; grid-template-columns: 1.25fr 1fr; gap: 2rem; align-items: start;
}
.tabpanel > * { min-width: 0; }
.tabpanel .ph { aspect-ratio: 4 / 3; border-radius: 8px; }
.tabpanel figcaption { font-size: 12.5px; color: var(--muted); margin-top: .5rem; line-height: 1.5; }

/* Checklists */
.checks { list-style: none; padding: 0; display: grid; gap: .65rem; }
.checks li { display: grid; grid-template-columns: 16px 1fr; gap: .7rem; font-size: 14.5px; font-weight: 300; line-height: 1.55; color: var(--ink); }
.checks li::before { margin-top: 3px; background-color: var(--gold-ink); }
.checks strong { font-weight: 500; color: var(--navy); }

/* Performance gap card */
.gap-card { background: var(--cream); border: 1px solid var(--line); border-radius: 12px; padding: clamp(1.5rem, 3vw, 2.25rem); }
.band-cream .gap-card { background: var(--white); }
.gap-card h3 { font-family: var(--serif); font-size: 1.4rem; font-weight: 600; color: var(--navy-deep); margin-bottom: .5rem; }
.gap-test { font-size: 13.5px; font-weight: 300; color: var(--muted); line-height: 1.6; margin-bottom: 1.25rem; }
.gap-test b { font-weight: 500; color: var(--navy); }
.bars { display: grid; gap: 1.15rem; }
.bar-row { display: grid; gap: .45rem; }
.bar-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: .25rem 1rem; }
.bar-who { font-size: 15px; font-weight: 600; color: var(--navy); }
.bar-who small { font-size: 12.5px; font-weight: 300; color: var(--muted); margin-left: .5rem; }
.bar-n { font-size: 13.5px; font-weight: 300; color: var(--muted); font-variant-numeric: tabular-nums; }
.bar-n b { font-family: var(--serif); font-size: 1.55rem; font-weight: 700; color: var(--navy); margin-right: 2px; }
.bar-track {
  height: 18px; border-radius: 4px; overflow: hidden;
  background: repeating-linear-gradient(135deg, rgba(28, 45, 80, 0.07) 0 6px, rgba(28, 45, 80, 0.13) 6px 12px);
}
.bar-fill { display: block; height: 100%; background: rgba(28, 45, 80, 0.55); border-radius: 4px 0 0 4px; }
.bar-foot { font-size: 12px; font-weight: 500; color: #9A4A2A; }
.bar-row.ours { background: var(--white); border: 1.5px solid var(--gold); border-radius: 10px; padding: 1rem; margin: .25rem -1rem 0; }
.band-cream .bar-row.ours { background: #FFFBF3; }
.bar-row.ours .bar-n b { color: var(--gold-ink); }
.bar-row.ours .bar-fill { background: var(--gold); border-radius: 4px; }
.bar-row.ours .bar-foot { color: #2E6B40; }
.gap-note { font-size: 13px; font-weight: 300; color: var(--muted); line-height: 1.6; margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.gap-note b { font-weight: 500; color: var(--navy); }

/* Case study */
.case { background: var(--cream); border-radius: 12px; padding: clamp(1.5rem, 3.5vw, 3rem); display: grid; grid-template-columns: 1.35fr 1fr; gap: clamp(1.5rem, 4vw, 3rem); align-items: start; }
.band-cream .case { background: var(--white); border: 1px solid var(--line); }
.case > * { min-width: 0; }
.case-org { font-family: var(--serif); font-size: 1.45rem; font-weight: 600; color: var(--navy); }
.status {
  justify-self: start; display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 500;
  color: #2E6B40; background: rgba(46, 107, 64, 0.1); padding: 5px 12px; border-radius: 100px;
}
.status::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #2E6B40; }
.metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.metric { background: var(--white); border: 1px solid var(--line); border-radius: 8px; padding: 1.1rem; }
.band-cream .metric { background: var(--cream); }
.metric-n { font-family: var(--serif); font-size: 1.45rem; font-weight: 700; color: var(--navy); line-height: 1.1; }
.metric-l { font-size: 12.5px; font-weight: 300; color: var(--muted); margin-top: 5px; line-height: 1.45; }

/* Feature cards */
.cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
.cards.two { grid-template-columns: repeat(2, 1fr); }
.cards.four { grid-template-columns: repeat(4, 1fr); }
.card { background: var(--white); border: 1px solid var(--line); border-radius: 10px; padding: 1.75rem; display: grid; gap: .75rem; align-content: start; min-width: 0; }
.card p { font-size: 14px; font-weight: 300; color: var(--muted); line-height: 1.65; }
a.card { text-decoration: none; transition: border-color .2s, transform .2s; }
a.card:hover { border-color: rgba(28, 45, 80, 0.3); transform: translateY(-2px); }
.icon { width: 42px; height: 42px; background: var(--navy); border-radius: 8px; display: grid; place-items: center; }
.icon svg { width: 22px; height: 22px; fill: none; stroke: var(--white); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.tag { justify-self: start; font-size: 11px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--gold-ink); background: rgba(184, 147, 74, 0.1); border-radius: 100px; padding: 4px 10px; }

/* Before / after photo pair */
.pair { display: grid; grid-template-columns: 1fr 64px 1fr; align-items: start; }
.pair .ph { aspect-ratio: 4 / 3; border-radius: 8px; }
.pair figcaption { font-size: 13px; font-weight: 300; color: var(--muted); margin-top: .6rem; }
.pair figcaption b { font-weight: 500; color: var(--navy); }
.pair-arrow { align-self: center; margin-top: -2rem; text-align: center; font-size: 10.5px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--gold-ink); line-height: 1.2; }
.pair-arrow svg { width: 26px; height: 26px; display: block; margin: 4px auto 0; stroke: var(--gold); fill: none; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }

/* Show-me-all scenarios */
.scenario { display: grid; grid-template-columns: 150px 1fr; gap: 1.25rem; align-items: start; }
.scenario .ph { aspect-ratio: 1; border-radius: 8px; }
.scenario .q { font-size: 10.5px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--navy); margin-bottom: .45rem; }
.scenario .results { aspect-ratio: auto; min-height: 120px; background: var(--white); }
.scenario .results img { height: auto; object-fit: contain; }

/* Comparison table */
.table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 12px; background: var(--white); }
table.compare { width: 100%; border-collapse: collapse; min-width: 640px; font-size: 14.5px; }
.compare th, .compare td { text-align: left; padding: 1rem 1.25rem; border-bottom: 1px solid var(--line); vertical-align: top; line-height: 1.55; }
.compare tr:last-child th, .compare tr:last-child td { border-bottom: 0; }
.compare thead th { font-size: 11.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); font-weight: 600; background: var(--cream); }
.compare thead th.us { color: var(--gold-ink); }
.compare tbody th { font-weight: 500; color: var(--navy); width: 26%; }
.compare td { font-weight: 300; color: var(--muted); }
.compare td.us { background: rgba(184, 147, 74, 0.07); color: var(--navy); font-weight: 400; }

/* Spec list */
.specs { display: grid; grid-template-columns: 220px 1fr; border-top: 1px solid var(--line); }
.specs dt, .specs dd { padding: .95rem 0; border-bottom: 1px solid var(--line); font-size: 14.5px; }
.specs dt { font-weight: 500; color: var(--navy); padding-right: 1rem; }
.specs dd { font-weight: 300; color: var(--muted); }

/* Architecture diagram */
.diagram { overflow-x: auto; background: var(--white); border: 1px solid var(--line); border-radius: 12px; padding: clamp(1rem, 2.5vw, 2rem); }
.diagram svg { display: block; width: 100%; min-width: 640px; height: auto; }
.diagram text { font-family: var(--sans); }

/* Editions */
.editions { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; align-items: stretch; }
.edition {
  background: var(--white); border: 1.5px solid var(--line); border-radius: 12px; padding: 1.75rem 1.5rem;
  display: flex; flex-direction: column; gap: 1rem; min-width: 0;
  transition: border-color .2s, box-shadow .2s, transform .2s;
}
/* The highlighted edition follows the pointer: whichever card is hovered or focused takes the gold style */
.edition.featured, .edition:hover, .edition:focus-within {
  border-color: var(--gold); box-shadow: 0 22px 44px -26px rgba(17, 29, 54, 0.45); transform: translateY(-3px);
}
.editions:hover .edition.featured:not(:hover), .editions:focus-within .edition.featured:not(:focus-within) {
  border-color: var(--line); box-shadow: none; transform: none;
}
.edition-name { font-family: var(--serif); font-size: 1.4rem; font-weight: 600; color: var(--navy-deep); }
.edition-for { font-size: 13.5px; font-weight: 300; color: var(--muted); line-height: 1.55; }
.edition-price { font-size: 13px; font-weight: 500; color: var(--gold-ink); letter-spacing: .02em; padding-block: .6rem; border-block: 1px solid var(--line); }
.edition .checks li { font-size: 13.5px; }
.edition .btn { margin-top: auto; }

/* FAQ */
.faq { max-width: 860px; margin-inline: auto; }
.faq details { border-top: 1px solid var(--line); }
.faq details:last-child { border-bottom: 1px solid var(--line); }
.faq summary { list-style: none; cursor: pointer; padding: 1.15rem 2.5rem 1.15rem 0; font-weight: 500; font-size: 16.5px; color: var(--navy); position: relative; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: .25rem; top: .85rem; font-size: 24px; font-weight: 300; color: var(--gold-ink); }
.faq details[open] summary::after { content: "\2013"; }
.faq details p { padding-bottom: 1.25rem; font-size: 15px; font-weight: 300; color: var(--muted); line-height: 1.7; }

/* Quote */
.quote { font-family: var(--serif); font-size: clamp(1.2rem, 2.2vw, 1.55rem); font-weight: 600; color: var(--navy-deep); line-height: 1.5; max-width: 40ch; }
.quote em { color: var(--gold-ink); }

/* Forms */
.form-card { background: var(--white); border: 1px solid var(--line); border-radius: 12px; padding: clamp(1.4rem, 3vw, 2.25rem); }
.form { display: grid; grid-template-columns: 1fr 1fr; gap: 1.1rem; }
.field { display: grid; gap: 6px; min-width: 0; }
.field.full { grid-column: 1 / -1; }
.field label { font-size: 12px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.field input, .field select, .field textarea {
  width: 100%; padding: 11px 14px; border: 1px solid rgba(28, 45, 80, 0.22); border-radius: 6px;
  font: 300 15px/1.4 var(--sans); color: var(--ink); background: var(--white);
}
.field textarea { min-height: 120px; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus { outline: 3px solid var(--navy); outline-offset: 1px; border-color: var(--navy); }
.form .btn { grid-column: 1 / -1; width: 100%; }
.form-done { display: grid; gap: .6rem; padding: 1.25rem; border-radius: 8px; background: rgba(46, 107, 64, 0.08); color: var(--navy); font-size: 15px; }
.copy-line { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; font-size: 15px; }
.copy-line code { font-family: var(--sans); font-weight: 500; color: var(--navy); user-select: all; }
.copy-btn { font: 500 12.5px var(--sans); color: var(--navy); background: var(--cream); border: 1px solid var(--line); border-radius: 4px; padding: 4px 10px; cursor: pointer; }

/* Call-to-action band */
.cta-band { background: var(--navy-mid); color: var(--white); padding-block: clamp(3.5rem, 6vw, 5rem); text-align: center; }
.cta-band .wrap { display: grid; justify-items: center; gap: 1.2rem; }
.cta-band .eyebrow { color: var(--gold-lt); }
.cta-band h2 { color: var(--white); max-width: 22ch; }
.cta-band h2 em { color: var(--gold-lt); }
.cta-band p { color: rgba(255, 255, 255, 0.72); font-weight: 300; font-size: 17px; max-width: 56ch; }
.cta-band .actions { justify-content: center; }

/* ── Footer ── */
.site-foot { background: var(--navy-deep); color: rgba(255, 255, 255, 0.62); padding-block: 3.5rem 2rem; font-size: 14px; }
.foot-grid { display: grid; grid-template-columns: 1.6fr repeat(4, 1fr); gap: 2.5rem; padding-bottom: 2.5rem; border-bottom: 1px solid rgba(255, 255, 255, 0.08); }
.foot-brand { display: grid; gap: 1rem; align-content: start; }
.foot-brand .pg { font-size: 19px; color: var(--white); }
.foot-brand p { font-weight: 300; line-height: 1.7; max-width: 34ch; }
.foot-brand address { font-style: normal; font-size: 12.5px; font-weight: 300; line-height: 1.7; color: rgba(255, 255, 255, 0.5); }
.site-foot h2 { font-family: var(--sans); font-size: 11.5px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: rgba(255, 255, 255, 0.45); margin-bottom: 1rem; }
.site-foot ul { list-style: none; padding: 0; display: grid; gap: .6rem; }
.site-foot a { color: rgba(255, 255, 255, 0.75); text-decoration: none; font-weight: 300; }
.site-foot a:hover { color: var(--white); }
.foot-bottom { padding-top: 1.5rem; display: flex; flex-wrap: wrap; justify-content: space-between; gap: .75rem 1.5rem; font-size: 12px; color: rgba(255, 255, 255, 0.42); }

/* ── Responsive ── */
@media (max-width: 1080px) {
  .nav-toggle { display: flex; }
  .menu {
    display: none; position: fixed; left: 0; right: 0; bottom: 0;
    top: calc(var(--head-h) + env(safe-area-inset-top, 0px));
    flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 1.5rem;
    background: var(--white); padding: 1rem var(--gut) calc(2rem + env(safe-area-inset-bottom, 0px)); overflow-y: auto;
  }
  .menu.open { display: flex; }
  .menu > ul { flex-direction: column; gap: 0; }
  .menu > ul > li { border-bottom: 1px solid var(--line); }
  .menu > ul > li > a { font-size: 17px; padding: .9rem 0; color: var(--navy); }
  .menu > ul > li > a[aria-current="page"] { box-shadow: none; color: var(--gold-ink); }
  .has-sub > a::after { display: none; }
  .sub { position: static; display: block; border: 0; box-shadow: none; padding: 0 0 .75rem; min-width: 0; }
  .sub a { padding: .35rem 0 .35rem .9rem; }
  .sub span { display: none; }
  .sub strong { font-weight: 400; color: var(--muted); }
  .menu-cta { flex-direction: column; align-items: stretch; gap: .75rem; }
  .menu-cta .link { text-align: center; padding: .5rem; }
  .cards.four { grid-template-columns: repeat(2, 1fr); }
  .editions { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 960px) {
  .hero-grid, .split, .split.wide-left, .case, .tabs, .tabpanel { grid-template-columns: 1fr; }
  .hero-graph { max-width: 520px; justify-self: center; width: 100%; }
  .steps { grid-template-columns: repeat(2, 1fr); }
  .cards { grid-template-columns: repeat(2, 1fr); }
  .proof ul { grid-template-columns: repeat(2, 1fr); row-gap: 1.5rem; }
  .proof li:nth-child(3) { padding-left: 0; border-left: 0; }
  .tablist { grid-auto-flow: column; grid-auto-columns: max-content; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
  .tab small { display: none; }
  .foot-grid { grid-template-columns: repeat(2, 1fr); }
  .foot-brand { grid-column: 1 / -1; }
}
@media (max-width: 620px) {
  .steps, .cards, .cards.two, .cards.four, .editions, .form { grid-template-columns: 1fr; }
  .find-card { padding: 1.25rem 1.25rem 0; }
  .find-band { margin: 0 -1.25rem; grid-template-columns: 1fr; }
  .find-band > div + div { border-left: 0; border-top: 1px solid rgba(255, 255, 255, 0.12); }
  .find-grid { grid-template-columns: repeat(2, 1fr); }
  .pair { grid-template-columns: 1fr; gap: .75rem; }
  .pair-arrow { margin-top: 0; }
  .pair-arrow svg { transform: rotate(90deg); }
  .scenario { grid-template-columns: 1fr; }
  .scenario > div:first-child { max-width: 160px; }
  .specs { grid-template-columns: 1fr; }
  .specs dt { border-bottom: 0; padding-bottom: 0; }
  .actions .btn { flex: 1 1 100%; }
  .foot-grid { grid-template-columns: 1fr 1fr; gap: 2rem; }
  .foot-bottom { flex-direction: column; }
}
@media (max-width: 400px) {
  .proof ul, .metrics { grid-template-columns: 1fr; }
  .proof li { padding-left: 0; border-left: 0; }
  .foot-grid { grid-template-columns: 1fr; }
}

/* Pricing: the highlighted edition's button follows the highlight too */
.edition:hover .btn, .edition:focus-within .btn { background: var(--navy); color: var(--white); border-color: var(--navy); }
.editions:hover .edition.featured:not(:hover) .btn,
.editions:focus-within .edition.featured:not(:focus-within) .btn { background: transparent; color: var(--navy); border-color: rgba(28, 45, 80, 0.28); }

/* ── Solutions header: resolution animation ── */
.page-hero.has-art .wrap { grid-template-columns: 1.05fr 1fr; align-items: center; gap: clamp(2rem, 5vw, 4rem); justify-items: stretch; }
.page-hero-copy { display: grid; gap: 1.2rem; justify-items: start; min-width: 0; }
.resolve-art { min-width: 0; margin: 0; }
.resolve-art svg { display: block; width: 100%; height: auto; overflow: visible; }
.resolve-art text { font-family: var(--sans); }
.ra-phase { font-size: 11px; font-weight: 600; letter-spacing: .12em; fill: var(--gold-ink); text-transform: uppercase; }
.ra-title { font-family: var(--serif) !important; font-size: 26px; font-weight: 700; fill: var(--navy-deep); }
.ra-title tspan.em { font-style: italic; fill: var(--gold-ink); }
@media (max-width: 960px) {
  .page-hero.has-art .wrap { grid-template-columns: 1fr; }
  .resolve-art { max-width: 480px; width: 100%; justify-self: center; }
}

/* ── Solutions: text records vs pixels (illustrative) ── */
.xr { background: var(--white); border: 1px solid var(--line); border-radius: 12px; padding: clamp(1.1rem, 2.5vw, 1.6rem); min-width: 0; }
.xr-cols, .xr-grid { display: grid; grid-template-columns: minmax(0, 1fr) 64px 92px; column-gap: .9rem; }
.xr-cols { font-size: 10.5px; font-weight: 600; letter-spacing: .11em; text-transform: uppercase; color: var(--muted); margin-bottom: .6rem; }
.xr-grid { grid-template-rows: repeat(3, auto); row-gap: .7rem; align-items: center; }
.xr-rec { display: grid; gap: 1px; padding: .6rem .75rem; border: 1px dashed rgba(28, 45, 80, 0.22); border-radius: 8px; background: var(--cream); min-width: 0; }
.xr-rec b { font-size: 14px; font-weight: 500; color: var(--navy); }
.xr-rec span { font-size: 12px; font-weight: 300; color: var(--muted); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.xr-rec i { font-style: normal; font-size: 11px; font-weight: 500; color: #9A4A2A; }
.xr-ph { width: 64px; height: 52px; display: block; }
.xr-link { grid-column: 3; grid-row: 1 / 4; position: relative; align-self: stretch; }
.xr-link svg { position: absolute; inset: 0; width: 70%; height: 100%; }
.xr-one { position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 56px; height: 56px; border-radius: 50%; background: var(--navy); color: var(--white); display: grid; place-content: center; text-align: center; box-shadow: 0 0 0 4px var(--white), 0 0 0 5.5px var(--gold); }
.xr-one span { font-family: var(--serif); font-size: 22px; font-weight: 700; line-height: 1; }
.xr-one small { font-size: 8px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-lt); }
.xr-foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem 1rem; margin-top: 1rem; padding-top: .9rem; border-top: 1px solid var(--line); font-size: 13.5px; color: var(--muted); }
.xr-foot b { font-weight: 500; color: var(--navy); }
.xr-foot span:last-child b { color: var(--gold-ink); }
.xr-note { font-size: 11px; color: var(--muted); margin-top: .6rem; }

/* ── Use Cases / Fraud: four hard images, one person ── */
.fv { min-width: 0; }
.fv-grid { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.fv-card { margin: 0; background: var(--white); border: 1px solid var(--line); border-radius: 10px; padding: 8px; display: grid; gap: .5rem; min-width: 0; }
.fv-card svg { display: block; width: 100%; height: auto; border-radius: 6px; }
.fv-card text { font-family: var(--sans); }
.fv-card figcaption { display: grid; gap: 1px; padding: 0 .25rem .2rem; }
.fv-card figcaption b { font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--gold-ink); }
.fv-card figcaption span { font-size: 12.5px; font-weight: 300; color: var(--muted); line-height: 1.45; }
.fv-one { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 62px; height: 62px; border-radius: 50%; background: var(--navy); color: var(--white); display: grid; place-content: center; text-align: center; box-shadow: 0 0 0 5px var(--white), 0 0 0 6.5px var(--gold), 0 14px 28px -12px rgba(17, 29, 54, .5); }
.fv-one span { font-family: var(--serif); font-size: 24px; font-weight: 700; line-height: 1; }
.fv-one small { font-size: 8px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-lt); }
.fv-cap { margin-top: .9rem; font-size: 13.5px; color: var(--muted); text-align: center; }
@media (max-width: 420px) {
  .xr-cols, .xr-grid { grid-template-columns: minmax(0, 1fr) 56px 64px; column-gap: .55rem; }
  .xr-ph { width: 56px; height: 46px; }
  .xr-one { width: 46px; height: 46px; }
  .fv-grid { gap: 10px; }
  .fv-one { width: 50px; height: 50px; }
}

/* ── Media: caption names one person, the frame holds four ── */
.mv { margin: 0; background: var(--white); border: 1px solid var(--line); border-radius: 12px; padding: 10px; display: grid; gap: .65rem; min-width: 0; }
.mv-meta { display: grid; gap: 2px; padding: .35rem .5rem; background: var(--cream); border-radius: 6px; font-size: 12px; color: var(--muted); min-width: 0; }
.mv-file { font-size: 10.5px; letter-spacing: .04em; color: var(--muted); overflow-wrap: anywhere; }
.mv-cap b { font-weight: 500; color: var(--navy); }
.mv-photo { display: block; width: 100%; height: auto; border-radius: 6px; }
.mv-photo text { font-family: var(--sans); }
.mv-names { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.mv-names li { display: grid; gap: 1px; padding: .4rem .5rem; border-radius: 6px; border: 1.5px solid var(--gold); background: #FFFBF3; min-width: 0; }
.mv-names li.tagged { border: 1.5px dashed #C9CDD6; background: var(--white); }
.mv-names b { font-size: 12px; font-weight: 500; color: var(--navy); line-height: 1.3; }
.mv-names span { font-size: 10.5px; color: var(--gold-ink); line-height: 1.3; }
.mv-names li.tagged span { color: var(--muted); }
.mv figcaption { font-size: 12.5px; color: var(--muted); line-height: 1.5; padding: 0 .25rem .2rem; }
.mv-note { display: block; font-size: 11px; margin-top: 2px; }
@media (max-width: 520px) { .mv-names { grid-template-columns: 1fr 1fr; } }

/* ── Research / journalism / legal: one setup, separate datasets ── */
.silo { margin: 0; background: var(--white); border: 1px solid var(--line); border-radius: 12px; padding: clamp(1rem, 2.5vw, 1.5rem); min-width: 0; }
.silo-top { background: var(--navy); color: var(--white); border-radius: 8px; padding: .8rem 1rem; text-align: center; display: grid; gap: 2px; }
.silo-top span { font-weight: 500; font-size: 15px; }
.silo-top .pg { color: var(--white); }
.silo-top small { font-size: 12px; font-weight: 300; color: rgba(255, 255, 255, .72); }
.silo-arrows { display: block; width: 100%; height: 30px; padding-inline: 16.6%; box-sizing: border-box; }
.silo-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; }
.silo-box { position: relative; display: grid; gap: 3px; justify-items: center; text-align: center; padding: .8rem .5rem .9rem; margin: 0 6px; border: 1.5px solid var(--gold); border-radius: 8px; background: #FFFBF3; min-width: 0; }
.silo-box + .silo-box::before { content: ""; position: absolute; left: -8px; top: 6px; bottom: 6px; border-left: 2px dashed rgba(28, 45, 80, .35); }
.silo-box svg { width: 100%; max-width: 110px; height: auto; display: block; }
.silo-box b { font-size: 12.5px; font-weight: 500; color: var(--navy); line-height: 1.3; }
.silo-box span { font-size: 11px; color: var(--gold-ink); font-weight: 500; }
.silo-lock { position: absolute; top: -10px; right: -8px; width: 22px; height: 22px; border-radius: 50%; background: var(--navy); display: grid; place-items: center; }
.silo-lock svg { width: 12px; height: 12px; fill: none; stroke: var(--white); stroke-width: 2; }
.silo figcaption { margin-top: .9rem; font-size: 12.5px; color: var(--muted); text-align: center; }

/* ── Trust: usage-statistics-only callout ── */
.verify { margin-top: 1.5rem; display: grid; grid-template-columns: auto minmax(0, 1fr) minmax(0, 300px); gap: 1.25rem 1.5rem; align-items: center; background: var(--cream); border: 1.5px solid var(--gold); border-radius: 12px; padding: clamp(1.2rem, 3vw, 1.75rem); }
.verify h3 { font-family: var(--serif); font-size: 1.25rem; font-weight: 600; color: var(--navy-deep); line-height: 1.35; }
.verify p { font-size: 14.5px; font-weight: 300; color: var(--muted); line-height: 1.65; }
.verify-icon { width: 46px; height: 46px; border-radius: 10px; background: var(--navy); display: grid; place-items: center; align-self: start; }
.verify-icon svg { width: 24px; height: 24px; fill: none; stroke: var(--gold-lt); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.verify-list { list-style: none; padding: 0; display: grid; gap: .6rem; }
.verify-list li { display: grid; gap: 1px; padding: .65rem .85rem; border-radius: 8px; background: var(--white); font-size: 13.5px; color: var(--navy); border-left: 3px solid; }
.verify-list b { font-size: 10.5px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }
.verify-list .yes { border-color: #2E6B40; } .verify-list .yes b { color: #2E6B40; }
.verify-list .no { border-color: #9A4A2A; } .verify-list .no b { color: #9A4A2A; }
@media (max-width: 860px) { .verify { grid-template-columns: auto minmax(0, 1fr); } .verify-list { grid-column: 1 / -1; } }
@media (max-width: 480px) { .verify { grid-template-columns: 1fr; } }

/* Homepage hero now carries the resolution animation */
.hero-grid .resolve-art { justify-self: stretch; }
@media (max-width: 960px) { .hero-grid .resolve-art { max-width: 480px; width: 100%; justify-self: center; } }

.hero-more { font-size: 15.5px; font-weight: 300; color: var(--muted); line-height: 1.7; max-width: 62ch; padding-left: 1rem; border-left: 3px solid var(--gold); }
.hero-more strong { font-weight: 500; color: var(--navy); }

/* Images shown at their own shape (no forced crop or stretch) */
.ph.ph-natural, .tabpanel .ph.ph-natural { aspect-ratio: auto; background: transparent; }
.ph.ph-natural img { height: auto; object-fit: contain; }
.ph.ph-natural { max-width: 440px; margin-inline: auto; }  /* stays sharp: source is 898px wide */
figure:has(> .ph-natural) figcaption { max-width: 440px; margin-inline: auto; }

/* ── Mobile menu fix ──
   The header's blur (backdrop-filter) makes the header the containing block for the
   fixed-position menu, so on phones the open menu was squeezed to one line inside the
   70px header. On small screens: no blur, and the menu gets an explicit full-screen height. */
@media (max-width: 1080px) {
  .site-head { -webkit-backdrop-filter: none; backdrop-filter: none; background: var(--white); }
  .menu {
    bottom: auto;
    height: calc(100vh - var(--head-h) - env(safe-area-inset-top, 0px));
    height: calc(100dvh - var(--head-h) - env(safe-area-inset-top, 0px));
    z-index: 60; box-shadow: 0 1px 0 var(--line) inset;
    -webkit-overflow-scrolling: touch; overscroll-behavior: contain;
  }
  .menu > ul > li > a { font-size: 17px; font-weight: 500; }
  .has-sub .sub ul { display: grid; gap: 0; }
  .sub a { padding: .45rem 0 .45rem .9rem; border-left: 2px solid var(--line); }
}

/* Contact form: spam trap and error message */
.hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.form-error { margin-top: 1rem; padding: 1rem 1.25rem; border-radius: 8px; background: rgba(168, 50, 50, 0.07); color: #7a2323; font-size: 15px; }
.form-error a { color: inherit; font-weight: 600; }
.form .btn[disabled] { opacity: .7; cursor: progress; }
.form-done a { color: inherit; font-weight: 600; white-space: nowrap; }