@charset "UTF-8";
/* ============================================================================
   JPRAXC ERP CLOUD — site.css  v3.5.4
   Engineered warmth: cream editorial canvas interrupted by deep-wine
   instrument bands. Single public stylesheet. No inline styles anywhere
   (strict CSP). Section order is mandated by the build specification.

   01 tokens          02 reset/base      03 typography      04 utilities
   05 layout/bands    06 header/nav      07 buttons/chips   08 hero
   09 mock            10 cards/grids     11 bento           12 stats
   13 compare/edition 14 steps           15 testimonials    16 downloads
   17 faq             18 cta             19 forms           20 success
   21 prose           22 footer          23 catalogue       24 motion
   25 responsive      26 print
   ========================================================================= */


/* ============================================================================
   01 — TOKENS
   ========================================================================= */

:root{
  /* ── WINE RAMP ───────────────────────────────────────────── */
  --wine-950:#1b0409;
  --wine-900:#2b0710;
  --wine-880:#3f020b;
  --wine-850:#3c0712;
  --wine-800:#520a17;
  --wine-700:#700817;
  --wine-600:#8f1022;
  --wine-500:#b0182f;

  /* ── WARM ACCENTS ────────────────────────────────────────── */
  --orange:#ff7a1a;
  --orange-deep:#e8570a;
  --orange-ink:#c9430a;
  --orange-lite:#ff9a4d;
  --amber:#ffab3d;
  --gold:#ffc35a;
  --gold-soft:#ffd98c;

  /* ── NEUTRALS ────────────────────────────────────────────── */
  --cream:#fff1d8;
  --paper:#fffaf3;
  --bg:#fbf5ee;
  --white:#ffffff;
  --ink:#1d1116;
  --ink-soft:#3a2a30;
  --muted:#5d4a51;
  --muted-2:#6b5a61;
  --green:#1f7a48;
  --blue:#35578f;

  /* ── INVERTED TEXT (on wine) ─────────────────────────────── */
  --on-wine:#fff1d8;
  --on-wine-soft:#e3cdb6;
  --on-wine-muted:#c9ab95;

  /* ── SEMANTIC SURFACES ───────────────────────────────────── */
  --surface:var(--paper);
  --surface-2:var(--bg);
  --surface-3:var(--cream);
  --elevated:var(--white);
  --surface-inv:var(--wine-900);
  --surface-inv-2:var(--wine-880);
  --surface-inv-3:rgba(255,241,216,.045);

  /* ── SEMANTIC TEXT ───────────────────────────────────────── */
  --text:var(--ink);
  --text-soft:var(--ink-soft);
  --text-muted:var(--muted);
  --text-inv:var(--on-wine);
  --text-inv-soft:var(--on-wine-soft);
  --text-inv-muted:var(--on-wine-muted);

  /* ── BORDERS / HAIRLINES ─────────────────────────────────── */
  --line:rgba(82,10,23,.12);
  --line-2:rgba(82,10,23,.07);
  --line-strong:rgba(82,10,23,.20);
  --line-inv:rgba(255,241,216,.12);
  --line-inv-2:rgba(255,241,216,.07);
  --line-inv-strong:rgba(255,241,216,.24);
  --border:1px solid var(--line);
  --border-strong:1px solid var(--line-strong);
  --border-inv:1px solid var(--line-inv);

  /* ── ACCENT SEMANTICS ────────────────────────────────────── */
  --accent:var(--orange);
  --accent-ink:var(--orange-ink);
  --accent-contrast:var(--wine-950);
  --detail:var(--gold);
  --focus:var(--wine-700);
  --focus-offset:var(--paper);

  /* ── PRODUCT ACCENT (default; overridden by .accent-*) ────── */
  --pa:var(--orange);
  --pa-ink:var(--orange-ink);
  --pa-inv:var(--orange-lite);
  --pa-soft:rgba(255,122,26,.10);

  /* ── GRADIENTS ───────────────────────────────────────────── */
  --grad-wine:linear-gradient(158deg,#2b0710 0%,#1b0409 52%,#3f020b 100%);
  --grad-deep:linear-gradient(180deg,#1b0409 0%,#120207 100%);
  --grad-accent:linear-gradient(135deg,#ffab3d 0%,#ff7a1a 46%,#e8570a 100%);
  --grad-gold-rule:linear-gradient(90deg,transparent,rgba(255,195,90,.42),transparent);
  --grad-wine-rule:linear-gradient(90deg,transparent,rgba(112,8,23,.26),transparent);
  --grad-paper:linear-gradient(180deg,#fffaf3 0%,#fbf5ee 100%);
  --grad-cream:linear-gradient(180deg,#fff5e6 0%,#fff1d8 100%);
  --grad-mock:linear-gradient(180deg,rgba(255,241,216,.07),rgba(255,241,216,.02));

  /* ── TEXTURES ────────────────────────────────────────────── */
  --grid-inv:
    linear-gradient(rgba(255,241,216,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,241,216,.055) 1px,transparent 1px);
  --grid-lite:
    linear-gradient(rgba(82,10,23,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(82,10,23,.05) 1px,transparent 1px);
  --grid-pitch:48px 48px;
  --grid-pitch-sm:32px 32px;
  --grid-mask:radial-gradient(ellipse 72% 62% at 50% 38%,#000 28%,transparent 76%);
  --noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");
  --noise-opacity:.030;

  /* ── TICK ICON (outcome-list marker, data URI) ───────────── */
  --tick:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23c9430a' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 10.5l4 4 8-9'/%3E%3C/svg%3E");
  --tick-inv:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23ffc35a' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 10.5l4 4 8-9'/%3E%3C/svg%3E");
  --caret:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%233a2a30' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 8l5 5 5-5'/%3E%3C/svg%3E");

  /* ── SHADOWS ─────────────────────────────────────────────── */
  --sh-xs:0 1px 2px rgba(27,4,9,.06);
  --sh-sm:0 2px 6px rgba(27,4,9,.07), 0 1px 2px rgba(27,4,9,.05);
  --sh-md:0 6px 18px rgba(27,4,9,.08), 0 2px 4px rgba(27,4,9,.05);
  --sh-lg:0 14px 38px rgba(27,4,9,.11), 0 3px 8px rgba(27,4,9,.06);
  --sh-xl:0 30px 70px rgba(27,4,9,.16), 0 8px 20px rgba(27,4,9,.08);
  --sh-inv:0 24px 60px rgba(0,0,0,.42), 0 4px 12px rgba(0,0,0,.28);

  /* ── RADII ───────────────────────────────────────────────── */
  --r-xs:6px; --r-sm:10px; --r-md:14px; --r-lg:18px;
  --r-xl:24px; --r-2xl:30px; --r-pill:999px;

  /* ── SPACING ─────────────────────────────────────────────── */
  --s-1:4px;  --s-2:8px;  --s-3:12px; --s-4:16px; --s-5:20px;
  --s-6:24px; --s-7:32px; --s-8:40px; --s-9:48px; --s-10:64px;
  --s-11:80px; --s-12:96px; --s-13:120px; --s-14:160px;
  --band-y:clamp(56px,7vw,112px);
  --band-y-tight:clamp(32px,4vw,56px);

  /* ── LAYOUT ──────────────────────────────────────────────── */
  --cw:1200px;
  --cw-wide:1360px;
  --cw-narrow:900px;
  --cw-prose:68ch;
  --gutter:clamp(16px,4vw,32px);
  --header-h:72px;
  --header-h-sm:62px;
  --utility-h:36px;
  --anchor-offset:calc(var(--header-h) + 20px);

  /* ── Z-INDEX ─────────────────────────────────────────────── */
  --z-base:0; --z-raise:1; --z-sticky:100; --z-header:200;
  --z-nav-panel:210; --z-mobile-nav:300; --z-skip:400;

  /* ── MOTION ──────────────────────────────────────────────── */
  --t-fast:140ms; --t:200ms; --t-slow:320ms; --t-reveal:460ms;
  --ease:cubic-bezier(.2,.7,.3,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --reveal-shift:14px;

  /* ── FONT STACKS ─────────────────────────────────────────── */
  --ff-display:"Geist","Inter Tight",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --ff-body:"Inter Tight","Geist",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --ff-mono:"JetBrains Mono",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
}

/* v3.5.3 — persistent purchase entry and page exploration cue */
.header-actions .header-buy-button{
  color:var(--gold-soft);
  border-color:rgba(255,215,154,.46);
  background:linear-gradient(135deg,rgba(255,215,154,.10),rgba(255,114,0,.045));
  box-shadow:inset 0 1px rgba(255,255,255,.08);
}
.header-actions .header-buy-button:hover{
  color:#fff7e7;
  border-color:var(--gold);
  background:rgba(255,173,24,.14);
  box-shadow:0 10px 28px rgba(20,0,5,.22),inset 0 1px rgba(255,255,255,.10);
}
.explore-cue{
  position:fixed;
  right:clamp(14px,2.2vw,30px);
  bottom:clamp(14px,2.2vw,28px);
  z-index:190;
  display:flex;
  align-items:center;
  gap:10px;
  min-height:46px;
  padding:8px 9px 8px 15px;
  border:1px solid rgba(255,215,154,.38);
  border-radius:999px;
  color:#fff7e7;
  background:rgba(55,0,11,.88);
  box-shadow:0 16px 42px rgba(32,0,8,.28),inset 0 1px rgba(255,255,255,.09);
  backdrop-filter:blur(14px) saturate(145%);
  -webkit-backdrop-filter:blur(14px) saturate(145%);
  font:700 .75rem/1 var(--ff-body);
  letter-spacing:.08em;
  text-transform:uppercase;
  cursor:pointer;
  transition:opacity .24s var(--ease),transform .24s var(--ease),border-color .2s var(--ease);
}
.explore-cue::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--orange);box-shadow:0 0 0 5px rgba(255,122,26,.12),0 0 15px rgba(255,122,26,.75)}
.explore-cue i{display:grid;place-items:center;width:29px;height:29px;border-radius:50%;color:var(--wine-950);background:var(--grad-accent);font:800 1rem/1 var(--ff-body);animation:jpraxc-explore-pulse 1.65s var(--ease-in-out, ease-in-out) infinite}
.explore-cue:hover{border-color:var(--gold);transform:translateY(-2px)}
.explore-cue.is-hidden{opacity:0;transform:translateY(14px);pointer-events:none}
.no-js .explore-cue{display:none}
@keyframes jpraxc-explore-pulse{0%,100%{transform:translateY(-1px)}50%{transform:translateY(3px)}}
@media(max-width:1023px){.header-buy-button{display:none}}
@media(min-width:1024px) and (max-width:1349px){
  .header-inner{grid-template-columns:auto minmax(0,1fr) auto;gap:12px}
  .main-nav{min-width:0;justify-content:flex-start}
  .main-nav>a[href="testimonials"],.main-nav>a[href="faq"],.main-nav>a[href="about"]{display:none}
  .header-actions{gap:6px}
  .header-actions .button-small{min-height:38px;padding:8px 11px;font-size:.78rem}
}
@media(max-width:560px){.explore-cue{left:50%;right:auto;bottom:12px;transform:translateX(-50%)}.explore-cue:hover{transform:translateX(-50%) translateY(-2px)}.explore-cue.is-hidden{transform:translateX(-50%) translateY(14px)}}
@media(prefers-reduced-motion:reduce){.explore-cue i{animation:none}}
@media print{.explore-cue{display:none!important}}

/* v3.5 private activation and seven-day feedback journeys */
.feedback-hero{padding-block:clamp(54px,8vw,92px)}.feedback-form{display:grid;gap:24px;padding:clamp(22px,4vw,42px);border:1px solid var(--line);border-radius:24px;background:#fff;box-shadow:0 22px 70px rgba(63,12,24,.08)}.feedback-section{display:flex;gap:14px;align-items:flex-start;padding-top:18px;border-top:1px solid var(--line)}.feedback-section:first-of-type{padding-top:0;border-top:0}.feedback-section>span{display:grid;place-items:center;width:38px;height:38px;flex:none;border-radius:11px;color:#fff;background:var(--wine,#650019);font:700 12px/1 Manrope,sans-serif}.feedback-section h2{margin:0;font-size:clamp(20px,3vw,28px)}.feedback-section p{margin:4px 0 0;color:var(--muted)}.feedback-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.feedback-grid label{display:grid;gap:8px;font-weight:700}.feedback-grid label span{color:var(--muted);font-weight:500}.feedback-grid input,.feedback-grid select,.feedback-grid textarea{width:100%;padding:13px 14px;border:1px solid var(--line);border-radius:11px;background:#fff;color:var(--ink);font:500 15px/1.5 'DM Sans',sans-serif}.feedback-grid textarea{resize:vertical}.feedback-grid .full{grid-column:1/-1}.feedback-consent{display:flex;gap:11px;align-items:flex-start;padding:16px;border:1px solid #e8c975;border-radius:13px;background:#fff9e9;font-weight:700}.feedback-consent input{margin-top:4px}.feedback-state{padding:clamp(30px,6vw,64px);border:1px solid var(--line);border-radius:24px;background:#fff;text-align:center}.feedback-state>span{display:grid;place-items:center;width:62px;height:62px;margin:0 auto 18px;border-radius:50%;color:#fff;background:#168357;font-size:30px}.feedback-state h2{font-size:clamp(27px,4vw,42px)}.feedback-state p{max-width:650px;margin:0 auto 24px;color:var(--muted)}.availability-badge{display:inline-flex;align-items:center;width:max-content;margin-left:9px;padding:6px 10px;border:1px solid rgba(255,255,255,.36);border-radius:999px;color:#fff;background:rgba(255,255,255,.12);font:700 11px/1 Manrope,sans-serif;letter-spacing:.04em;text-transform:uppercase}.availability-badge--card{position:absolute;top:18px;right:18px;margin:0;border-color:#e8c36e;color:#6c4500;background:#fff4d4}.product-card{position:relative}.product-card .availability-badge--card+.product-card__name{padding-right:82px}@media(max-width:720px){.feedback-grid{grid-template-columns:1fr}.feedback-grid .full{grid-column:auto}}

/* ── Per-product accent classes ───────────────────────────── */
.accent-school   {--pa:#ffab3d;--pa-ink:#8a5100;--pa-inv:#ffab3d;--pa-soft:rgba(255,171,61,.12)}
.accent-hospital {--pa:#e0596f;--pa-ink:#a51f38;--pa-inv:#ea7285;--pa-soft:rgba(224,89,111,.12)}
.accent-billing  {--pa:#ff7a1a;--pa-ink:#c9430a;--pa-inv:#ff9a4d;--pa-soft:rgba(255,122,26,.12)}
.accent-inventory{--pa:#ffc35a;--pa-ink:#8a6100;--pa-inv:#ffc35a;--pa-soft:rgba(255,195,90,.14)}
.accent-business {--pa:#8f1022;--pa-ink:#700817;--pa-inv:#f0c9b4;--pa-soft:rgba(143,16,34,.10)}

/* Aliases keyed on all_products()['accent'] values, so either naming works. */
.accent-amber    {--pa:#ffab3d;--pa-ink:#8a5100;--pa-inv:#ffab3d;--pa-soft:rgba(255,171,61,.12)}
.accent-rose     {--pa:#e0596f;--pa-ink:#a51f38;--pa-inv:#ea7285;--pa-soft:rgba(224,89,111,.12)}
.accent-orange   {--pa:#ff7a1a;--pa-ink:#c9430a;--pa-inv:#ff9a4d;--pa-soft:rgba(255,122,26,.12)}
.accent-gold     {--pa:#ffc35a;--pa-ink:#8a6100;--pa-inv:#ffc35a;--pa-soft:rgba(255,195,90,.14)}
.accent-burgundy {--pa:#8f1022;--pa-ink:#700817;--pa-inv:#f0c9b4;--pa-soft:rgba(143,16,34,.10)}

/* ── Inverted-band token overrides ────────────────────────── */
.band--wine,
.band--deep{
  --text:var(--on-wine);
  --text-soft:var(--on-wine-soft);
  --text-muted:var(--on-wine-muted);
  --line:var(--line-inv);
  --line-2:var(--line-inv-2);
  --line-strong:var(--line-inv-strong);
  --surface:var(--surface-inv);
  --surface-2:var(--surface-inv-2);
  --surface-3:var(--surface-inv-3);
  --elevated:rgba(255,241,216,.05);
  --accent-ink:var(--orange-lite);
  --pa-ink:var(--pa-inv);
  --focus:var(--gold);
  --focus-offset:var(--wine-950);
  --tick:var(--tick-inv);
  --border:1px solid var(--line-inv);
  --border-strong:1px solid var(--line-inv-strong);
}


/* ============================================================================
   02 — RESET / BASE
   ========================================================================= */

*,*::before,*::after{box-sizing:border-box}

html{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  scroll-behavior:smooth;
  overflow-x:hidden;
}

body{
  margin:0;
  min-height:100%;
  background:var(--bg);
  color:var(--text);
  font-family:var(--ff-body);
  font-size:1.0625rem;
  line-height:1.65;
  font-weight:400;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}

body.menu-open{overflow:hidden}

h1,h2,h3,h4,h5,h6,p,figure,blockquote,dl,dd{margin:0}
ul,ol{margin:0;padding:0}
img,svg,video,canvas{display:block;max-width:100%;height:auto}
img{border:0}

a{color:var(--wine-700);text-decoration-thickness:1px;text-underline-offset:.16em}
a:hover{color:var(--wine-600)}
.band--wine a,.band--deep a{color:var(--gold)}
.band--wine a:hover,.band--deep a:hover{color:var(--gold-soft)}

strong,b{font-weight:600}
em{font-style:italic}

button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}

table{border-collapse:collapse;border-spacing:0}

hr{border:0;height:1px;background:var(--line)}

::selection{background:rgba(255,122,26,.28);color:var(--ink)}
.band--wine ::selection,.band--deep ::selection{background:rgba(255,195,90,.34);color:var(--wine-950)}

/* Long strings must never force horizontal scroll. */
p,li,dd,td,th,figcaption,blockquote,address{overflow-wrap:anywhere}

/* ── Focus ring (WCAG-safe on both canvases) ──────────────── */
:focus{outline:none}
:focus-visible{
  outline:3px solid var(--focus);
  outline-offset:2px;
  box-shadow:0 0 0 5px var(--focus-offset);
  border-radius:var(--r-xs);
}
/* Legacy fallback for browsers without :focus-visible */
.no-js a:focus,.no-js button:focus{outline:3px solid var(--focus);outline-offset:2px}

/* Anchor targets clear the sticky header. */
[id]{scroll-margin-top:var(--anchor-offset)}


/* ============================================================================
   03 — TYPOGRAPHY
   ========================================================================= */

.hero__title{
  font-family:var(--ff-display);
  font-size:clamp(2.75rem,1.9rem + 3.6vw,4.5rem);
  line-height:1.02;
  letter-spacing:-.032em;
  font-weight:700;
  color:var(--text);
}

.page-title{
  font-family:var(--ff-display);
  font-size:clamp(2.25rem,1.6rem + 2.8vw,3.5rem);
  line-height:1.06;
  letter-spacing:-.028em;
  font-weight:700;
  color:var(--text);
}
.page-title em{font-style:normal;color:var(--accent-ink)}
.band--wine .page-title em,.band--deep .page-title em{color:var(--gold)}

.section-title{
  font-family:var(--ff-display);
  font-size:clamp(1.75rem,1.3rem + 2vw,2.75rem);
  line-height:1.12;
  letter-spacing:-.024em;
  font-weight:600;
  color:var(--text);
}

.h3,.bento__title,.step__title,.faq-group__title{
  font-family:var(--ff-display);
  font-size:clamp(1.25rem,1.1rem + .6vw,1.625rem);
  line-height:1.22;
  letter-spacing:-.015em;
  font-weight:600;
  color:var(--text);
}

.h4,.card__title,.role-card__who,.download-card__title,
.version-option__title,.empty-state__title,.quote-card__name{
  font-family:var(--ff-display);
  font-size:1.1875rem;
  line-height:1.30;
  letter-spacing:-.010em;
  font-weight:600;
  color:var(--text);
}

.lead,.hero__lead,.section-lead,.prose__lead{
  font-family:var(--ff-body);
  font-size:clamp(1.0625rem,1rem + .45vw,1.3125rem);
  line-height:1.60;
  letter-spacing:0;
  font-weight:400;
  color:var(--text-soft);
  max-width:var(--cw-prose);
}

.small{font-size:.9375rem;line-height:1.55}
.micro{font-size:.8125rem;line-height:1.50}

.eyebrow,.mono,.section-num,.kpi__label,.bento__label,
.mega__col-title,.stat__label,.step__meta,.module__num,
.success-ref__label,.footer-links__title{
  font-family:var(--ff-mono);
  font-size:.6875rem;
  line-height:1.20;
  letter-spacing:.12em;
  font-weight:600;
  text-transform:uppercase;
}

.eyebrow{color:var(--accent-ink);margin:0 0 var(--s-3)}
.eyebrow--light{color:var(--gold)}
.band--wine .eyebrow,.band--deep .eyebrow{color:var(--gold)}

.section-num{color:var(--text-muted);display:block;margin:0 0 var(--s-3)}
.band--wine .section-num,.band--deep .section-num{color:var(--gold)}

.file-meta,.mock__title,.success-ref__code,.mock-table__cell,
.chart__axis,.mock__badge{
  font-family:var(--ff-mono);
  font-size:.8125rem;
  line-height:1.40;
  letter-spacing:.02em;
}

/* Tabular numerals on every numeric surface. */
.kpi__value,.stat__value,.compare-table,.mock-table,
.file-meta,.bento__stat,.metric,.metric-row{
  font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum" 1;
}

.text-balance{text-wrap:balance}
.text-center{text-align:center}


/* ============================================================================
   04 — UTILITIES
   ========================================================================= */

.sr-only{
  position:absolute!important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  clip-path:inset(50%);
  white-space:nowrap;
  border:0;
}

.skip-link{
  position:absolute;
  left:var(--s-4);
  top:-100px;
  z-index:var(--z-skip);
  display:inline-block;
  padding:12px 20px;
  border-radius:var(--r-sm);
  background:var(--gold);
  color:var(--wine-950);
  font-weight:600;
  text-decoration:none;
  box-shadow:var(--sh-lg);
  transition:top var(--t) var(--ease);
}
.skip-link:focus{top:var(--s-3);color:var(--wine-950)}

.container{
  width:100%;
  max-width:var(--cw);
  margin-inline:auto;
  padding-inline:var(--gutter);
}
.container--wide{max-width:var(--cw-wide)}
.container--narrow{max-width:var(--cw-narrow)}
.container--prose{max-width:calc(var(--cw-prose) + var(--gutter) * 2)}

.hp-field{
  position:absolute!important;
  left:-9999px!important;
  top:auto!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
}

.scroll-x{
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  border-radius:var(--r-md);
}
.scroll-x:focus-visible{outline:3px solid var(--focus);outline-offset:2px}

.divider{
  height:1px;
  border:0;
  margin:var(--s-8) 0;
  background:var(--grad-wine-rule);
}
.divider--gold{background:var(--grad-gold-rule)}
.divider--wine{background:var(--grad-wine-rule)}

/* .hide-sm / .hide-lg only ever REMOVE the element — they never assert a
   display value, so they can be added to flex/grid items without side effects.
   (Hidden states live in section 25.) */
.mono{display:inline-block}


/* ============================================================================
   05 — LAYOUT / BANDS
   ========================================================================= */

main{display:block}

.band{
  position:relative;
  isolation:isolate;
  padding-block:var(--band-y);
  background:var(--grad-paper);
  color:var(--text);
}
.band > .container{position:relative;z-index:var(--z-raise)}

.band--paper{background:var(--grad-paper)}
.band--cream{background:var(--grad-cream)}
.band--wine{background:var(--grad-wine);color:var(--text-inv)}
.band--deep{background:var(--grad-deep);color:var(--text-inv)}
.band--tight{padding-block:var(--band-y-tight)}
.band--flush-top{padding-top:0}

/* Masked hairline grid — wine bands only, one per band. */
.band--grid::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:var(--z-base);
  pointer-events:none;
  background-image:var(--grid-inv);
  background-size:var(--grid-pitch);
  -webkit-mask-image:var(--grid-mask);
  mask-image:var(--grid-mask);
}

/* Exactly two blurred blobs. Static — never animated. */
.band--mesh::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:var(--z-base);
  pointer-events:none;
  background:
    radial-gradient(38% 46% at 14% 22%,rgba(112,8,23,.55),transparent 70%),
    radial-gradient(34% 40% at 88% 78%,rgba(232,87,10,.20),transparent 72%);
  filter:blur(28px);
}

.band--noise{background-image:var(--noise),var(--grad-wine);background-size:140px 140px,auto}
.band--noise.band--deep{background-image:var(--noise),var(--grad-deep)}
.band--noise.band--paper{background-image:var(--noise),var(--grad-paper)}
.band--noise.band--cream{background-image:var(--noise),var(--grad-cream)}

.band__glow{
  position:absolute;
  z-index:var(--z-base);
  pointer-events:none;
  inset:auto -10% -20% auto;
  width:min(46vw,520px);
  height:min(46vw,520px);
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,195,90,.16),transparent 68%);
  filter:blur(24px);
}

/* ── Section heads ────────────────────────────────────────── */
.section-head{
  max-width:var(--cw-prose);
  margin-bottom:var(--s-9);
}
.section-head--center{margin-inline:auto;text-align:center}
.section-head--center .section-lead{margin-inline:auto}
.section-head--split{
  max-width:none;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:var(--s-8);
  align-items:end;
}
.section-head .section-title{margin-bottom:var(--s-4)}
.section-lead{color:var(--text-soft)}

.section-actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:var(--s-4) var(--s-7);
  margin-top:var(--s-8);
}


/* ============================================================================
   06 — HEADER / NAVIGATION
   ========================================================================= */

/* ── Utility bar ──────────────────────────────────────────── */
.utility-bar{
  position:relative;
  z-index:calc(var(--z-header) + 1);
  background:var(--wine-900);
  border-bottom:1px solid rgba(255,241,216,.08);
  color:var(--on-wine-soft);
  font-size:.8125rem;
  line-height:1.4;
}
.utility-bar__inner{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:var(--s-3) var(--s-6);
  min-height:var(--utility-h);
  padding-block:6px;
}
.utility-bar__item{
  display:inline-flex;
  align-items:center;
  gap:var(--s-2);
  min-height:24px;
  color:var(--on-wine-soft);
  text-decoration:none;
  font-family:var(--ff-body);
  letter-spacing:.005em;
}
.utility-bar__item::before{
  content:"";
  width:5px;height:5px;
  border-radius:50%;
  background:var(--gold);
  opacity:.7;
  flex:none;
}
a.utility-bar__item:hover{color:var(--gold);text-decoration:underline}
.utility-bar__item--cta{color:var(--gold);font-weight:500}
.utility-bar__item--cta::before{opacity:1}

/* ── Sticky header ────────────────────────────────────────── */
.site-header{
  position:sticky;
  top:0;
  z-index:var(--z-header);
  background:var(--wine-950);
  border-bottom:1px solid var(--line-inv-2);
  transition:background var(--t) var(--ease),box-shadow var(--t) var(--ease);
}
.site-header.scrolled{
  background:rgba(27,4,9,.78);
  -webkit-backdrop-filter:blur(14px) saturate(140%);
  backdrop-filter:blur(14px) saturate(140%);
  border-bottom-color:transparent;
  box-shadow:var(--sh-md);
}
.site-header.scrolled::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:1px;
  background:var(--grad-gold-rule);
}
@supports not ((backdrop-filter:blur(2px)) or (-webkit-backdrop-filter:blur(2px))){
  .site-header.scrolled{background:var(--wine-950)}
}

.header-inner{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:var(--s-6);
  min-height:var(--header-h);
}

/* ── Brand ────────────────────────────────────────────────── */
.brand{
  display:inline-flex;
  align-items:center;
  gap:var(--s-3);
  text-decoration:none;
  color:var(--on-wine);
  padding-block:var(--s-2);
}
.brand:hover{color:var(--on-wine)}
.brand-mark{
  display:grid;
  place-items:center;
  width:46px;height:46px;
  flex:none;
  border-radius:var(--r-sm);
  background:rgba(255,241,216,.06);
  border:1px solid var(--line-inv);
  overflow:hidden;
}
.brand-mark img{width:46px;height:46px;object-fit:contain}
.brand-name{display:flex;flex-direction:column;line-height:1.05}
.brand-name strong{
  font-family:var(--ff-display);
  font-size:1.125rem;
  font-weight:700;
  letter-spacing:-.012em;
  color:var(--on-wine);
}
.brand-name small{
  font-family:var(--ff-mono);
  font-size:.625rem;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--gold);
  margin-top:3px;
}

/* ── Nav toggle ───────────────────────────────────────────── */
.nav-toggle{
  display:none;
  width:46px;height:46px;
  border-radius:var(--r-sm);
  border:1px solid var(--line-inv);
  background:rgba(255,241,216,.05);
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:5px;
  padding:0;
}
.nav-toggle__bar{
  display:block;
  width:20px;height:2px;
  border-radius:2px;
  background:var(--on-wine);
  transition:transform var(--t) var(--ease),opacity var(--t-fast) var(--ease);
}
.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] .nav-toggle__bar:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ── Main nav (desktop) ───────────────────────────────────── */
.main-nav{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:var(--s-1);
}
.nav-link{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:var(--s-1);
  padding:10px 14px;
  min-height:44px;
  border-radius:var(--r-sm);
  color:var(--on-wine-soft);
  font-size:.9375rem;
  font-weight:500;
  letter-spacing:.002em;
  text-decoration:none;
  white-space:nowrap;
  transition:color var(--t-fast) var(--ease);
}
.nav-link::after{
  content:"";
  position:absolute;
  left:14px;right:14px;bottom:6px;
  height:2px;
  border-radius:2px;
  background:var(--gold);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform var(--t) var(--ease);
}
.nav-link:hover,.nav-link:focus-visible{color:var(--gold)}
.nav-link:hover::after{transform:scaleX(1)}
.nav-link.is-active{color:var(--on-wine);font-weight:600}
.nav-link.is-active::after{transform:scaleX(1);background:var(--orange)}

/* The Products trigger is also a .nav-link; these rules only add the
   disclosure affordances (pointer, no text selection on repeated toggling). */
.nav-group__trigger{cursor:pointer;-webkit-user-select:none;user-select:none}
.nav-group__trigger[aria-expanded="true"]{color:var(--gold)}
.nav-group__trigger[aria-expanded="true"] .nav-caret{transform:rotate(180deg)}

.nav-caret{
  display:inline-block;
  font-size:.75rem;
  line-height:1;
  transition:transform var(--t) var(--ease);
}
.nav-group.is-open .nav-caret,
.nav-group:hover .nav-caret{transform:rotate(180deg)}

/* ── Mega menu ────────────────────────────────────────────── */
.nav-group{position:relative}
.nav-panel{
  position:absolute;
  top:calc(100% + 10px);
  left:50%;
  transform:translateX(-50%) translateY(-6px);
  z-index:var(--z-nav-panel);
  width:min(92vw,880px);
  padding:var(--s-6);
  border-radius:var(--r-xl);
  background:var(--wine-950);
  border:1px solid var(--line-inv-strong);
  box-shadow:var(--sh-xl);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity var(--t) var(--ease),transform var(--t) var(--ease),visibility var(--t);
}
.nav-group:hover .nav-panel,
.nav-group:focus-within .nav-panel,
.nav-group.is-open .nav-panel{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateX(-50%) translateY(0);
}

.mega{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--s-5);
}
.mega__col{display:flex;flex-direction:column;gap:var(--s-1)}
.mega__col + .mega__col{padding-left:var(--s-5);border-left:1px solid var(--line-inv-2)}
.mega__col-title{
  color:var(--gold);
  margin:0 0 var(--s-2);
  padding-left:10px;
}
.mega__item{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-height:56px;
  justify-content:center;
  padding:10px;
  border-radius:var(--r-sm);
  text-decoration:none;
  color:var(--on-wine);
  transition:background var(--t-fast) var(--ease);
}
.mega__item:hover,.mega__item:focus-visible{background:rgba(255,241,216,.06);color:var(--on-wine)}
.mega__item--plain{min-height:44px}
.mega__item-name{
  font-family:var(--ff-display);
  font-size:.9375rem;
  font-weight:600;
  color:var(--on-wine);
  letter-spacing:-.006em;
}
.mega__item-desc{
  font-size:.8125rem;
  line-height:1.4;
  color:var(--on-wine-muted);
}
.mega__foot{
  margin-top:var(--s-5);
  padding-top:var(--s-4);
  border-top:1px solid var(--line-inv-2);
}

/* ── Header actions ───────────────────────────────────────── */
.header-actions{
  display:flex;
  align-items:center;
  gap:var(--s-3);
  justify-self:end;
}
.main-nav__actions{display:none}

/* ── Site flash ───────────────────────────────────────────── */
.site-flash{
  padding:var(--s-4) 0;
  background:var(--cream);
  border-bottom:1px solid var(--line);
  color:var(--ink-soft);
  font-size:.9375rem;
}
.site-flash .container{display:flex;align-items:center;gap:var(--s-3)}
.site-flash--success{background:rgba(31,122,72,.10);border-bottom-color:rgba(31,122,72,.28);color:#14512f}
.site-flash--error{background:rgba(143,16,34,.09);border-bottom-color:rgba(143,16,34,.28);color:var(--wine-700)}


/* ============================================================================
   07 — BUTTONS / CHIPS / LABELS
   ========================================================================= */

.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5em;
  min-height:48px;
  padding:14px 24px;
  border:1px solid transparent;
  border-radius:var(--r-pill);
  font-family:var(--ff-body);
  font-size:1.0625rem;
  font-weight:600;
  line-height:1.2;
  text-align:center;
  text-decoration:none;
  cursor:pointer;
  transition:transform var(--t-fast) var(--ease),
             box-shadow var(--t) var(--ease),
             background-color var(--t) var(--ease),
             border-color var(--t) var(--ease),
             color var(--t) var(--ease),
             filter var(--t) var(--ease);
}
.button:disabled,.button[aria-disabled="true"]{opacity:.6;cursor:not-allowed}

.button__icon{display:inline-block;transition:transform var(--t) var(--ease);line-height:1}
.button:hover .button__icon{transform:translateX(3px)}

.button-primary{
  background:var(--grad-accent);
  color:var(--wine-950);
  box-shadow:var(--sh-md);
}
.button-primary:hover{
  color:var(--wine-950);
  filter:brightness(1.04);
  box-shadow:var(--sh-lg);
  transform:translateY(-1px);
}
.button-primary:active{transform:translateY(0);box-shadow:var(--sh-sm)}

.button-secondary{
  background:transparent;
  border-color:var(--line-strong);
  color:var(--wine-800);
}
.button-secondary:hover{
  color:var(--wine-700);
  background:rgba(82,10,23,.05);
  border-color:var(--wine-700);
}

.button-ghost{
  background:transparent;
  border-color:transparent;
  color:var(--wine-700);
  padding-inline:12px;
}
.button-ghost:hover{color:var(--wine-600);text-decoration:underline}

.button-light{
  background:var(--cream);
  color:var(--wine-900);
  box-shadow:var(--sh-sm);
}
.button-light:hover{background:var(--white);color:var(--wine-800);box-shadow:var(--sh-md);transform:translateY(-1px)}

.button-outline-light{
  background:transparent;
  border-color:var(--line-inv-strong);
  color:var(--on-wine);
}
.button-outline-light:hover{
  background:rgba(255,241,216,.08);
  border-color:var(--gold);
  color:var(--gold);
}

.button-login{
  background:var(--wine-950);
  border:1.5px solid var(--gold);
  color:var(--gold);
  font-weight:600;
  letter-spacing:.02em;
}
.button-login:hover{
  background:rgba(255,195,90,.08);
  border-color:var(--gold-soft);
  color:var(--gold-soft);
}

.button-small{min-height:40px;padding:10px 18px;font-size:.9375rem}
.button-large{min-height:56px;padding:16px 30px;font-size:1.125rem}
.button-block{width:100%}

/* ── Arrow link ───────────────────────────────────────────── */
.link-arrow{
  display:inline-flex;
  align-items:center;
  gap:.45em;
  min-height:44px;
  font-weight:600;
  font-size:1rem;
  color:var(--wine-700);
  text-decoration:none;
  border-bottom:1px solid transparent;
}
.link-arrow span{display:inline-block;transition:transform var(--t) var(--ease)}
.link-arrow:hover{color:var(--wine-600);border-bottom-color:currentColor}
.link-arrow:hover span{transform:translateX(3px)}
.link-arrow--light{color:var(--gold)}
.link-arrow--light:hover{color:var(--gold-soft)}
.band--wine .link-arrow,.band--deep .link-arrow{color:var(--gold)}
.band--wine .link-arrow:hover,.band--deep .link-arrow:hover{color:var(--gold-soft)}

/* ── Tags / pills / chips / badges ────────────────────────── */
.tag{
  display:inline-flex;
  align-items:center;
  gap:.4em;
  padding:5px 12px;
  border-radius:var(--r-pill);
  background:var(--pa-soft);
  color:var(--pa-ink);
  border:1px solid var(--line-strong);
  border-color:color-mix(in srgb,var(--pa) 30%,transparent);
  font-family:var(--ff-mono);
  font-size:.6875rem;
  font-weight:600;
  letter-spacing:.10em;
  text-transform:uppercase;
  line-height:1.3;
}
.tag--light{background:rgba(255,241,216,.09);color:var(--on-wine);border-color:var(--line-inv-strong)}
.tag--accent{background:rgba(255,122,26,.12);color:var(--orange-ink);border-color:rgba(255,122,26,.34)}
.band--wine .tag,.band--deep .tag{background:rgba(255,241,216,.08);color:var(--pa-inv);border-color:var(--line-inv-strong)}

.pill{
  display:inline-flex;
  align-items:center;
  gap:.45em;
  padding:6px 14px;
  border-radius:var(--r-pill);
  background:rgba(82,10,23,.07);
  border:1px solid var(--line-strong);
  color:var(--wine-800);
  font-family:var(--ff-mono);
  font-size:.6875rem;
  font-weight:600;
  letter-spacing:.10em;
  text-transform:uppercase;
}
.pill svg{width:14px;height:14px;flex:none}
.pill--gold{background:rgba(255,195,90,.14);border-color:rgba(255,195,90,.42);color:var(--wine-800)}
.pill--offline{background:rgba(53,87,143,.12);border-color:rgba(53,87,143,.34);color:var(--blue)}
.pill--cloud{background:rgba(31,122,72,.12);border-color:rgba(31,122,72,.32);color:var(--green)}
.pill--ok{background:rgba(31,122,72,.12);border-color:rgba(31,122,72,.32);color:var(--green)}
.pill--warn{background:rgba(201,67,10,.12);border-color:rgba(201,67,10,.32);color:var(--orange-ink)}
.band--wine .pill,.band--deep .pill{
  background:rgba(255,241,216,.08);
  border-color:var(--line-inv-strong);
  color:var(--on-wine);
}
.band--wine .pill--offline,.band--deep .pill--offline{color:#a9c6f2}
.band--wine .pill--cloud,.band--deep .pill--cloud{color:#8ddcae}
.band--wine .pill--gold,.band--deep .pill--gold{color:var(--gold);border-color:rgba(255,195,90,.42)}

.chip{
  display:inline-flex;
  align-items:center;
  padding:5px 11px;
  border-radius:var(--r-pill);
  background:var(--surface-2);
  border:1px solid var(--line);
  color:var(--text-soft);
  font-size:.8125rem;
  line-height:1.4;
}
.band--wine .chip,.band--deep .chip{background:rgba(255,241,216,.06);color:var(--on-wine-soft)}
.chip-row{display:flex;flex-wrap:wrap;gap:var(--s-2)}

.badge{
  display:inline-flex;
  align-items:center;
  padding:3px 9px;
  border-radius:var(--r-xs);
  background:var(--wine-800);
  color:var(--cream);
  font-family:var(--ff-mono);
  font-size:.625rem;
  font-weight:600;
  letter-spacing:.10em;
  text-transform:uppercase;
}
.badge--new{background:var(--grad-accent);color:var(--wine-950)}

/* ── Trust strip ──────────────────────────────────────────── */
.trust-strip{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:var(--s-4);
  align-items:start;
}
.trust-item{
  display:flex;
  align-items:flex-start;
  gap:var(--s-3);
  padding:var(--s-3) 0;
}
.trust-item__icon{
  width:20px;height:20px;
  flex:none;
  margin-top:2px;
  color:var(--orange-ink);
  stroke:currentColor;
  fill:none;
}
.band--wine .trust-item__icon,.band--deep .trust-item__icon{color:var(--gold)}
.trust-item__text{
  font-size:.9375rem;
  line-height:1.45;
  color:var(--text-soft);
  font-weight:500;
}


/* ============================================================================
   08 — HERO / PAGE HEADS
   ========================================================================= */

.hero{
  padding-block:clamp(48px,6vw,88px) clamp(56px,7vw,104px);
}
.hero--home{min-height:86vh;display:flex;align-items:center}
.hero--home > .container{width:100%}
.page-home .hero--home > .container{max-width:var(--cw-wide)}

.hero__grid{
  display:grid;
  grid-template-columns:46% 54%;
  gap:clamp(32px,4vw,64px);
  align-items:center;
}
.hero__copy{min-width:0}
.hero__visual{min-width:0}

.hero__title{margin:0 0 var(--s-5);text-wrap:balance}
.hero__lead{margin:0 0 var(--s-7);color:var(--text-inv-soft)}
.hero__actions{display:flex;flex-wrap:wrap;gap:var(--s-4);margin-bottom:var(--s-5)}
.page-deployments .page-hero .chip-row + .hero__actions{margin-top:var(--s-6)}
.hero__micro{
  font-size:.8125rem;
  line-height:1.55;
  color:var(--text-inv-muted);
  max-width:56ch;
}

/* ── Inner page hero ──────────────────────────────────────── */
.page-hero{padding-block:clamp(44px,5.5vw,88px)}
.page-hero .page-title{margin:0 0 var(--s-5);text-wrap:balance}
.page-hero .lead{margin:0 0 var(--s-7)}
.page-hero .tag{margin-bottom:var(--s-4)}
.page-hero--paper{background:var(--grad-paper);color:var(--ink)}
.page-hero__grid{
  display:grid;
  grid-template-columns:46% 54%;
  gap:clamp(32px,4vw,64px);
  align-items:center;
}

.web-hero-panel{
  position:relative;
  overflow:hidden;
  padding:clamp(24px,3vw,38px);
  border:1px solid rgba(255,215,154,.25);
  border-radius:var(--r-xl);
  color:var(--on-wine);
  background:
    radial-gradient(circle at 88% 12%,rgba(255,173,24,.18),transparent 34%),
    rgba(60,0,13,.82);
  box-shadow:var(--sh-inv),inset 0 1px rgba(255,255,255,.08);
  backdrop-filter:blur(16px);
}
.web-hero-panel::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:var(--grid-inv);
  background-size:var(--grid-pitch);
  opacity:.36;
  -webkit-mask-image:linear-gradient(135deg,#000,transparent 72%);
  mask-image:linear-gradient(135deg,#000,transparent 72%);
}
.web-hero-panel > *{position:relative;z-index:1}
.web-hero-panel__eyebrow{margin:0 0 var(--s-3);color:var(--gold);font-family:var(--ff-mono);font-size:.75rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.web-hero-panel h2{margin:0 0 var(--s-3);color:var(--on-wine);font-size:clamp(1.65rem,1.25rem + 1.2vw,2.35rem)}
.web-hero-panel > p:not(.web-hero-panel__eyebrow){margin:0;color:var(--on-wine-soft);max-width:48ch}
.web-hero-panel__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:var(--s-6)}
.web-hero-panel__item{display:flex;flex-direction:column;gap:5px;min-height:94px;padding:16px;border:1px solid rgba(255,215,154,.16);border-radius:14px;background:rgba(255,247,231,.055)}
.web-hero-panel__item strong{color:var(--gold-soft);font-size:.95rem}
.web-hero-panel__item span{color:var(--on-wine-soft);font-size:.82rem;line-height:1.45}

/* ── Breadcrumb ───────────────────────────────────────────── */
.breadcrumb{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:var(--s-1);
  margin-bottom:var(--s-5);
  font-size:.8125rem;
}
.breadcrumb__item{
  display:inline-flex;
  align-items:center;
  color:var(--text-muted);
  text-decoration:none;
}
a.breadcrumb__item:hover{color:var(--gold);text-decoration:underline}
.band--paper a.breadcrumb__item:hover,.page-hero--paper a.breadcrumb__item:hover{color:var(--wine-700)}
.breadcrumb__item::after{
  content:"/";
  margin-inline:.5em;
  opacity:.5;
}
.breadcrumb__item.is-current{color:var(--text);font-weight:500}
.breadcrumb__item.is-current::after{content:none}

/* ── Anchor nav ───────────────────────────────────────────── */
.anchor-nav{
  position:sticky;
  top:var(--header-h);
  z-index:var(--z-sticky);
  background:rgba(255,250,243,.94);
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
@supports not ((backdrop-filter:blur(2px)) or (-webkit-backdrop-filter:blur(2px))){
  .anchor-nav{background:var(--paper)}
}
.anchor-nav__inner{
  display:flex;
  gap:var(--s-2);
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  padding-block:var(--s-3);
  scrollbar-width:thin;
}
.anchor-nav__link{
  display:inline-flex;
  align-items:center;
  min-height:40px;
  padding:8px 16px;
  border-radius:var(--r-pill);
  border:1px solid var(--line);
  background:var(--white);
  color:var(--ink-soft);
  font-size:.875rem;
  font-weight:500;
  text-decoration:none;
  white-space:nowrap;
  transition:background var(--t-fast) var(--ease),color var(--t-fast) var(--ease),border-color var(--t-fast) var(--ease);
}
.anchor-nav__link:hover{border-color:var(--wine-700);color:var(--wine-700)}
.anchor-nav__link.is-active{
  background:var(--wine-800);
  border-color:var(--wine-800);
  color:var(--cream);
}


/* ============================================================================
   09 — MOCK "APP WINDOW" ILLUSTRATIONS
   ========================================================================= */

.mock{
  position:relative;
  border-radius:var(--r-xl);
  border:1px solid var(--line-inv);
  background:var(--grad-mock);
  box-shadow:var(--sh-inv);
  overflow:hidden;
  color:var(--on-wine);
  /* Rail width is a token so responsive rules can collapse it without
     fighting the .mock--* variant selectors on specificity. */
  --mock-rail-w:180px;
}
.band--paper .mock,.band--cream .mock,.page-hero--paper .mock{
  border-color:var(--line-strong);
  background:var(--wine-950);
  box-shadow:var(--sh-lg);
}
.mock--tilted{transform:perspective(1200px) rotateY(-2deg) rotateX(1deg)}
.mock--mobile{max-width:280px;margin-inline:auto;border-radius:var(--r-lg)}
/* Dashboard = the default rail + main split (named explicitly so page agents
   can state the variant they mean). */
.mock--dashboard{--mock-rail-w:180px}
/* Report = no module rail; a single, denser column led by a table or chart. */
.mock--report{--mock-rail-w:0px}
.mock--report .mock__rail{display:none}
.mock--report .mock__body{min-height:0}
.mock--report .mock__main{gap:var(--s-3)}
.mock--report .mock__kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
.mock--report .chart__bars{height:88px}

.mock__chrome{
  display:flex;
  align-items:center;
  gap:var(--s-3);
  height:34px;
  padding-inline:var(--s-4);
  background:rgba(255,241,216,.05);
  border-bottom:1px solid var(--line-inv);
}
.mock__dots{display:flex;gap:6px;flex:none}
.mock__dot{
  width:9px;height:9px;
  border-radius:50%;
  background:rgba(255,241,216,.22);
}
.mock__dot:first-child{background:rgba(255,122,26,.55)}
.mock__dot:nth-child(2){background:rgba(255,195,90,.45)}
.mock__title{
  color:var(--on-wine-muted);
  font-weight:400;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.mock__body{
  display:grid;
  grid-template-columns:var(--mock-rail-w,180px) minmax(0,1fr);
  min-height:260px;
}
.mock__rail{
  display:flex;
  flex-direction:column;
  gap:2px;
  padding:var(--s-3);
  border-right:1px solid var(--line-inv);
  background:rgba(0,0,0,.16);
}
.mock__rail-item{
  display:flex;
  align-items:center;
  gap:var(--s-2);
  padding:8px 10px;
  border-radius:var(--r-xs);
  font-size:.8125rem;
  color:var(--on-wine-muted);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.mock__rail-item::before{
  content:"";
  width:14px;height:14px;
  flex:none;
  border-radius:3px;
  border:1px solid currentColor;
  opacity:.55;
}
.mock__rail-item.is-active{
  background:var(--pa-soft);
  color:var(--pa-inv);
  font-weight:500;
  box-shadow:inset 2px 0 0 var(--pa-inv);
}

.mock__main{padding:var(--s-4);display:flex;flex-direction:column;gap:var(--s-4);min-width:0}

.mock__toolbar{display:flex;flex-wrap:wrap;gap:var(--s-2);align-items:center}
.mock__toolbar .chip{
  background:rgba(255,241,216,.07);
  border-color:var(--line-inv);
  color:var(--on-wine-soft);
  font-size:.75rem;
}

.mock__kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-3)}
.kpi{
  padding:var(--s-3);
  border-radius:var(--r-sm);
  border:1px solid var(--line-inv);
  background:rgba(255,241,216,.04);
  display:flex;
  flex-direction:column;
  gap:4px;
  min-width:0;
  overflow:hidden;
}
.kpi--accent{border-color:var(--line-inv-strong);background:var(--pa-soft)}
@supports (color:color-mix(in srgb,red 50%,transparent)){
  .kpi--accent{border-color:color-mix(in srgb,var(--pa-inv) 40%,transparent)}
}
.kpi__label{color:var(--on-wine-muted);font-size:.625rem;letter-spacing:.11em}
.kpi__value{
  font-family:var(--ff-display);
  font-size:clamp(1rem,.88rem + .2vw,1.125rem);
  font-weight:700;
  line-height:1.1;
  letter-spacing:-.025em;
  color:var(--on-wine);
  max-width:100%;
  white-space:nowrap;
}
.kpi__meta{font-size:.75rem;line-height:1.35;color:var(--on-wine-muted)}
.kpi__meta--up{color:#8ddcae}
.kpi__meta--down{color:#f0a5a5}

/* ── CSS bar chart ────────────────────────────────────────── */
.mock__chart,.chart{
  position:relative;
  padding-top:var(--s-3);
}
.chart__grid{
  position:absolute;
  inset:var(--s-3) 0 22px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  pointer-events:none;
}
.chart__grid::before,.chart__grid::after{
  content:"";
  height:1px;
  background:var(--line-inv-2);
}
.chart__bars{
  position:relative;
  display:flex;
  align-items:flex-end;
  gap:4px;
  height:112px;
}
.chart__bar{
  flex:1 1 0;
  min-width:4px;
  border-radius:3px 3px 0 0;
  background:linear-gradient(180deg,rgba(255,241,216,.42),rgba(255,241,216,.14));
}
.chart__bar--accent{background:var(--grad-accent)}
.chart__bar--h10{height:10%}
.chart__bar--h20{height:20%}
.chart__bar--h30{height:30%}
.chart__bar--h38{height:38%}
.chart__bar--h40{height:40%}
.chart__bar--h45{height:45%}
.chart__bar--h50{height:50%}
.chart__bar--h52{height:52%}
.chart__bar--h60{height:60%}
.chart__bar--h65{height:65%}
.chart__bar--h70{height:70%}
.chart__bar--h75{height:75%}
.chart__bar--h80{height:80%}
.chart__bar--h82{height:82%}
.chart__bar--h85{height:85%}
.chart__bar--h90{height:90%}
.chart__bar--h100{height:100%}
.chart__axis{
  display:flex;
  gap:4px;
  margin-top:6px;
  color:var(--on-wine-muted);
  font-size:.5625rem;
  letter-spacing:.06em;
}
.chart__axis span{flex:1 1 0;text-align:center;min-width:0;overflow:hidden}
.band--paper .chart__bar,.band--cream .chart__bar{background:linear-gradient(180deg,rgba(82,10,23,.30),rgba(82,10,23,.10))}
.band--paper .chart__bar--accent,.band--cream .chart__bar--accent{background:var(--grad-accent)}
.band--paper .chart__grid::before,.band--paper .chart__grid::after,
.band--cream .chart__grid::before,.band--cream .chart__grid::after{background:var(--line)}
.band--paper .chart__axis,.band--cream .chart__axis{color:var(--muted)}
/* Inside a mock the chart is always on wine, whatever the band. */
.mock .chart__bar{background:linear-gradient(180deg,rgba(255,241,216,.42),rgba(255,241,216,.14))}
.mock .chart__bar--accent{background:var(--grad-accent)}
.mock .chart__axis{color:var(--on-wine-muted)}
.mock .chart__grid::before,.mock .chart__grid::after{background:var(--line-inv-2)}

.spark{width:60px;height:20px;stroke:currentColor;fill:none;stroke-width:1.6}

/* ── Fake table ───────────────────────────────────────────── */
.mock__table,.mock-table{
  border:1px solid var(--line-inv);
  border-radius:var(--r-sm);
  overflow:hidden;
}
.mock-table__row{
  display:grid;
  grid-template-columns:minmax(76px,1.2fr) minmax(48px,.8fr) minmax(48px,.8fr) minmax(76px,1fr);
  gap:6px;
  padding:8px 10px;
  border-bottom:1px solid var(--line-inv-2);
}
.mock-table__row:last-child{border-bottom:0}
.mock-table__row.is-head{
  background:rgba(255,241,216,.05);
  color:var(--on-wine-muted);
}
.mock-table__row.is-head .mock-table__cell{
  font-family:var(--ff-mono);
  font-size:.625rem;
  letter-spacing:.10em;
  text-transform:uppercase;
  font-weight:600;
}
.mock-table__cell{
  font-size:.75rem;
  line-height:1.4;
  color:var(--on-wine-soft);
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.mock-table__cell--num{text-align:right;font-variant-numeric:tabular-nums}

.mock__caption{
  padding:var(--s-3) var(--s-4);
  border-top:1px solid var(--line-inv);
  background:rgba(0,0,0,.18);
  color:var(--on-wine-muted);
  font-family:var(--ff-mono);
  font-size:.6875rem;
  letter-spacing:.04em;
}
.mock__badge{
  position:absolute;
  top:var(--s-4);
  right:var(--s-4);
  z-index:2;
  padding:4px 10px;
  border-radius:var(--r-xs);
  background:var(--gold);
  color:var(--wine-950);
  font-size:.625rem;
  font-weight:600;
  letter-spacing:.10em;
  text-transform:uppercase;
}

/* ── Meaningful diagrams ──────────────────────────────────── */
.diagram{
  width:100%;
  height:auto;
  color:var(--text-soft);
  stroke:currentColor;
  fill:none;
}
.diagram text{fill:currentColor;stroke:none;font-family:var(--ff-mono);font-size:11px;letter-spacing:.06em}
.diagram--migration{max-width:640px;margin-inline:auto}
.diagram--roles{max-width:520px}


/* ============================================================================
   10 — CARDS & GRIDS
   ========================================================================= */

.grid{display:grid;gap:var(--s-6)}
.grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.grid--auto{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.grid--products{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid--products > *{grid-column:auto}

.card{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:var(--s-3);
  padding:var(--s-6);
  border-radius:var(--r-lg);
  background:var(--elevated);
  border:var(--border);
  box-shadow:var(--sh-sm);
  transition:transform var(--t-slow) var(--ease-out),
             box-shadow var(--t-slow) var(--ease-out),
             border-color var(--t) var(--ease);
}
.card::before{
  content:"";
  position:absolute;
  left:var(--s-6);right:var(--s-6);top:0;
  height:2px;
  border-radius:0 0 2px 2px;
  background:var(--pa);
  opacity:0;
  transition:opacity var(--t) var(--ease);
}
.card:hover{transform:translateY(-4px);box-shadow:var(--sh-lg)}
.card:hover::before{opacity:1}
.card:active{transform:scale(.985)}

.card--link{cursor:pointer}
.card--link:hover{border-color:var(--line-strong)}
.card--flush{padding:0;border:0;background:none;box-shadow:none}
.card--flush::before{content:none}
.card--flush:hover{transform:none;box-shadow:none}
.card--inv{background:var(--surface-inv-3);border-color:var(--line-inv);color:var(--text-inv)}
.card--accent{background:var(--pa-soft);border-color:var(--pa-ink)}
.band--wine .card,.band--deep .card{
  background:rgba(255,241,216,.05);
  border-color:var(--line-inv);
  box-shadow:none;
  color:var(--text-inv);
}
.band--wine .card:hover,.band--deep .card:hover{
  background:rgba(255,241,216,.075);
  box-shadow:var(--sh-inv);
}

.card__head{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:var(--s-3);
}
.card__icon-tile{
  display:grid;
  place-items:center;
  width:44px;height:44px;
  flex:none;
  border-radius:var(--r-sm);
  background:var(--pa-soft);
  color:var(--pa-ink);
}
.card__icon{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.7}
.card__title{margin:0}
.card__text{color:var(--text-soft);font-size:1rem;line-height:1.6;margin:0}
.card__text strong{font-weight:600;color:var(--text)}
.card__meta{
  margin:0;
  font-size:.9375rem;
  line-height:1.55;
  color:var(--pa-ink);
  font-weight:500;
  padding-top:var(--s-3);
  border-top:1px solid var(--line-2);
}
.card__foot{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:var(--s-3);
  margin-top:auto;
  padding-top:var(--s-3);
}

/* ── Product card ─────────────────────────────────────────── */
.product-card{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:var(--s-3);
  padding:0;
  overflow:hidden;
  border-radius:var(--r-lg);
  background:var(--elevated);
  border:var(--border);
  box-shadow:var(--sh-sm);
  transition:transform var(--t-slow) var(--ease-out),box-shadow var(--t-slow) var(--ease-out);
}
.product-card:hover{transform:translateY(-4px);box-shadow:var(--sh-lg)}
.product-card:active{transform:scale(.985)}
.band--wine .product-card,.band--deep .product-card{
  background:rgba(255,241,216,.05);
  border-color:var(--line-inv);
  box-shadow:none;
  color:var(--text-inv);
}

.product-card__art{
  position:relative;
  height:132px;
  flex:none;
  background:
    linear-gradient(180deg,var(--pa-soft),transparent),
    var(--grid-lite);
  background-size:auto,var(--grid-pitch-sm);
  border-bottom:1px solid var(--line-2);
  overflow:hidden;
}
.product-card__art::before{
  content:"";
  position:absolute;
  left:var(--s-6);
  bottom:0;
  width:56%;
  height:64%;
  border-radius:var(--r-md) var(--r-md) 0 0;
  border:1px solid var(--line);
  border-bottom:0;
  background:var(--white);
  box-shadow:var(--sh-sm);
}
.product-card__art::after{
  content:"";
  position:absolute;
  right:var(--s-5);
  bottom:var(--s-5);
  width:34%;
  height:44%;
  border-radius:var(--r-sm);
  background:var(--pa);
  opacity:.72;
}
.band--wine .product-card__art,.band--deep .product-card__art{
  background:linear-gradient(180deg,var(--pa-soft),transparent),var(--grid-inv);
  background-size:auto,var(--grid-pitch-sm);
  border-bottom-color:var(--line-inv);
}
.band--wine .product-card__art::before,.band--deep .product-card__art::before{
  background:rgba(255,241,216,.08);
  border-color:var(--line-inv);
  box-shadow:none;
}

.product-card > *:not(.product-card__art){margin-inline:var(--s-6)}
.product-card > *:not(.product-card__art):first-child{margin-top:var(--s-6)}
.product-card__tag{align-self:flex-start;margin-top:var(--s-5)}
.product-card__name{margin:0;font-family:var(--ff-display);font-size:1.3125rem;font-weight:600;letter-spacing:-.014em;line-height:1.25}
.product-card__short{margin:0;color:var(--text-soft);font-size:.9375rem;line-height:1.55}
.product-card__modules{margin-bottom:var(--s-2)}
.grid--products .product-card__modules{align-content:flex-start}.grid--products .chip--more{color:var(--pa-ink);border-color:color-mix(in srgb,var(--pa) 38%,var(--line));background:var(--pa-soft);font-weight:700}
.product-card__cta{margin-bottom:var(--s-6);margin-top:auto;color:var(--pa-ink)}
.product-card__cta:hover{color:var(--pa-ink)}
.card--flush.product-card{background:none;border:0;box-shadow:none}
.card--flush.product-card > *:not(.product-card__art){margin-inline:0}
.card--flush.product-card > *:first-child{margin-top:0}

/* ── Module grid ──────────────────────────────────────────── */
.module-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1px;
  background:var(--line);
  border:var(--border);
  border-radius:var(--r-lg);
  overflow:hidden;
}
.module{
  display:flex;
  flex-direction:column;
  gap:var(--s-3);
  padding:var(--s-5);
  background:var(--surface);
  min-height:126px;
  transition:background var(--t) var(--ease);
}
.module:hover{background:var(--white)}
.band--wine .module-grid,.band--deep .module-grid{background:var(--line-inv);border-color:var(--line-inv)}
.band--wine .module,.band--deep .module{background:var(--wine-900)}
.band--wine .module:hover,.band--deep .module:hover{background:var(--wine-850)}
.module__num{color:var(--pa-ink);letter-spacing:.14em}
.module__name{
  margin:0;
  font-family:var(--ff-display);
  font-size:1rem;
  font-weight:600;
  line-height:1.35;
  letter-spacing:-.006em;
  color:var(--text);
}

/* ── Outcome list ─────────────────────────────────────────── */
.outcome-list{list-style:none;display:flex;flex-direction:column;gap:var(--s-3)}
.outcome-list__item,.outcome-list > li{
  position:relative;
  padding-left:32px;
  font-size:1rem;
  line-height:1.55;
  color:var(--text-soft);
}
.outcome-list__item::before,.outcome-list > li::before{
  content:"";
  position:absolute;
  left:0;
  top:.15em;
  width:20px;height:20px;
  background-image:var(--tick);
  background-repeat:no-repeat;
  background-size:20px 20px;
}

/* ── Feature rows ─────────────────────────────────────────── */
.feature-row{
  display:grid;
  grid-template-columns:48% 52%;
  gap:clamp(28px,4vw,64px);
  align-items:center;
}
.feature-row + .feature-row{margin-top:var(--s-11)}
.feature-row--reverse .feature-row__copy{order:2}
.feature-row--reverse .feature-row__visual{order:1}
.feature-row__copy{min-width:0;display:flex;flex-direction:column;gap:var(--s-4)}
.feature-row__copy h3{margin:0}
.feature-row__copy p{margin:0;color:var(--text-soft);max-width:var(--cw-prose)}
.feature-row__visual{min-width:0}

/* ── Role cards ───────────────────────────────────────────── */
.role-cards{display:grid;gap:var(--s-5)}
.role-card{
  display:flex;
  flex-direction:column;
  gap:var(--s-2);
  padding:var(--s-5);
  border-radius:var(--r-md);
  background:var(--elevated);
  border:var(--border);
  border-top:3px solid var(--pa);
}
.band--wine .role-card,.band--deep .role-card{background:rgba(255,241,216,.05);border-color:var(--line-inv);border-top-color:var(--pa-inv)}
.role-card__who{margin:0}
.role-card__gain{margin:0;font-size:.9375rem;line-height:1.55;color:var(--text-soft)}


/* ============================================================================
   11 — BENTO
   ========================================================================= */

.bento{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:var(--s-6);
  grid-auto-rows:minmax(200px,auto);
}
.bento__cell{
  display:flex;
  flex-direction:column;
  gap:var(--s-3);
  grid-column:span 2;
  padding:var(--s-5);
  border-radius:var(--r-lg);
  background:var(--elevated);
  border:var(--border);
  box-shadow:var(--sh-sm);
  min-width:0;
  overflow:hidden;
  transition:transform var(--t-slow) var(--ease-out),box-shadow var(--t-slow) var(--ease-out);
}
.bento__cell:hover{transform:translateY(-4px);box-shadow:var(--sh-lg)}
.bento__cell:active{transform:scale(.985)}
.bento__cell--anchor{
  grid-column:span 4;
  grid-row:span 2;
  padding:var(--s-7);
  border-radius:var(--r-2xl);
}
.bento__cell--wide{grid-column:span 4}
.bento__cell--half{grid-column:span 3}
.bento__cell--third{grid-column:span 2}
.bento__cell--tall{grid-row:span 2}
.band--wine .bento__cell,.band--deep .bento__cell{
  background:rgba(255,241,216,.05);
  border-color:var(--line-inv);
  box-shadow:none;
}

.bento__label{margin:0;color:var(--pa-ink);font-family:var(--ff-mono);font-size:.6875rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.bento__title{margin:0}
.bento__text{margin:0;color:var(--text-soft);font-size:.9375rem;line-height:1.55}
.bento__visual{margin-top:auto;min-height:52%;display:flex;flex-direction:column;justify-content:flex-end;gap:var(--s-3)}
.bento__visual .mock__kpis{grid-template-columns:repeat(2,minmax(0,1fr))}

.bento__stat{display:flex;flex-direction:column;gap:var(--s-1)}
.bento__stat strong{
  font-family:var(--ff-display);
  font-size:clamp(1.5rem,1.2rem + 1vw,2rem);
  font-weight:700;
  line-height:1.1;
  letter-spacing:-.02em;
  color:var(--text);
}
.bento__stat span{
  font-family:var(--ff-mono);
  font-size:.6875rem;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--text-muted);
}

.bento__list{list-style:none;display:flex;flex-direction:column;gap:var(--s-2)}
.bento__list-item{
  display:flex;
  align-items:center;
  gap:var(--s-2);
  padding:8px 12px;
  border-radius:var(--r-xs);
  background:var(--surface-2);
  border:1px solid var(--line-2);
  font-size:.875rem;
  color:var(--text-soft);
}
.band--wine .bento__list-item,.band--deep .bento__list-item{background:rgba(255,241,216,.05);border-color:var(--line-inv-2)}

.bento__table{
  border:var(--border);
  border-radius:var(--r-sm);
  overflow:hidden;
  font-size:.8125rem;
}
.bento__table > div{
  display:grid;
  grid-template-columns:1.4fr 1fr .7fr;
  gap:var(--s-2);
  padding:7px var(--s-3);
  border-bottom:1px solid var(--line-2);
  color:var(--text-soft);
  min-width:0;
}
.bento__table > div:last-child{border-bottom:0}
.bento__table > div:first-child{
  background:var(--surface-2);
  font-family:var(--ff-mono);
  font-size:.625rem;
  letter-spacing:.10em;
  text-transform:uppercase;
  font-weight:600;
  color:var(--text-muted);
}
.bento__table span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.band--wine .bento__table > div:first-child,.band--deep .bento__table > div:first-child{background:rgba(255,241,216,.06)}


/* ============================================================================
   12 — STATS & METRICS
   ========================================================================= */

.stat-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:var(--s-6);
}
.stat{
  display:flex;
  flex-direction:column;
  gap:var(--s-2);
  padding:var(--s-5) 0;
  border-top:2px solid var(--line-strong);
}
.stat--inv{border-top-color:var(--line-inv-strong)}
.stat__value{
  font-family:var(--ff-display);
  font-size:clamp(1.75rem,1.4rem + 1.4vw,2.5rem);
  font-weight:700;
  line-height:1.05;
  letter-spacing:-.024em;
  color:var(--text);
}
.stat__label{color:var(--text-muted)}
.band--wine .stat__label,.band--deep .stat__label{color:var(--gold)}
.stat__note{margin:0;font-size:.8125rem;line-height:1.5;color:var(--text-muted)}

.metric,.metric-row{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:var(--s-3);
  padding:7px 0;
  border-bottom:1px solid var(--line-2);
  font-size:.875rem;
  color:var(--text-soft);
}
.metric:last-child,.metric-row:last-child{border-bottom:0}
.metric strong,.metric-row strong{font-weight:600;color:var(--text)}


/* ============================================================================
   13 — COMPARISON & EDITIONS
   ========================================================================= */

.compare{display:flex;flex-direction:column;gap:var(--s-6)}

.compare-table{
  width:100%;
  min-width:640px;
  border-collapse:separate;
  border-spacing:0;
  font-size:.9375rem;
  background:var(--surface);
  border:var(--border);
  border-radius:var(--r-md);
  overflow:hidden;
}
.band--wine .compare-table,.band--deep .compare-table{background:rgba(255,241,216,.04)}
.compare-table__th,.compare-table thead th{
  padding:var(--s-4);
  text-align:left;
  vertical-align:bottom;
  background:var(--surface-2);
  border-bottom:1px solid var(--line-strong);
  font-family:var(--ff-mono);
  font-size:.6875rem;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--text-muted);
}
.band--wine .compare-table__th,.band--deep .compare-table__th,
.band--wine .compare-table thead th,.band--deep .compare-table thead th{
  background:rgba(255,241,216,.07);
  color:var(--gold);
}
.compare-table__td,.compare-table tbody td{
  padding:var(--s-4);
  vertical-align:top;
  border-bottom:1px solid var(--line-2);
  color:var(--text-soft);
}
.compare-table__td--num{text-align:right;font-variant-numeric:tabular-nums}
.compare-table__row-label,.compare-table tbody th{
  padding:var(--s-4);
  text-align:left;
  vertical-align:top;
  border-bottom:1px solid var(--line-2);
  font-weight:600;
  color:var(--text);
  background:var(--surface);
}
.band--wine .compare-table__row-label,.band--deep .compare-table__row-label,
.band--wine .compare-table tbody th,.band--deep .compare-table tbody th{background:var(--wine-900)}
.compare-table tbody tr:last-child > *{border-bottom:0}
.compare-table tbody tr{transition:background var(--t-fast) var(--ease)}
.compare-table tbody tr:hover{background:var(--surface-2)}
.band--wine .compare-table tbody tr:hover,.band--deep .compare-table tbody tr:hover{background:rgba(255,241,216,.05)}

.compare-yes,.compare-no{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:24px;height:24px;
  border-radius:50%;
  font-weight:700;
  line-height:1;
}
.compare-yes{background:rgba(31,122,72,.14);color:var(--green)}
.compare-no{background:rgba(93,74,81,.12);color:var(--muted)}
.band--wine .compare-yes,.band--deep .compare-yes{background:rgba(141,220,174,.14);color:#8ddcae}
.band--wine .compare-no,.band--deep .compare-no{background:rgba(255,241,216,.08);color:var(--on-wine-muted)}

.compare-note{
  margin:0;
  font-size:.875rem;
  line-height:1.55;
  color:var(--text-muted);
  max-width:var(--cw-prose);
}

/* ── Version options ──────────────────────────────────────── */
.version-options{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--s-6);
}
.version-option{
  display:flex;
  flex-direction:column;
  gap:var(--s-4);
  padding:var(--s-7);
  border-radius:var(--r-xl);
  background:var(--elevated);
  border:var(--border);
  box-shadow:var(--sh-sm);
}
.band--wine .version-option,.band--deep .version-option{
  background:rgba(255,241,216,.05);
  border-color:var(--line-inv);
  box-shadow:none;
}
.version-option--offline{border-top:3px solid var(--blue)}
.version-option--cloud{border-top:3px solid var(--green)}
.version-option__head{display:flex;align-items:center;gap:var(--s-3);flex-wrap:wrap}
.version-option__title{margin:0;font-size:1.375rem}
.version-option__desc{margin:0;color:var(--text-soft);font-size:1rem;line-height:1.6}
.version-option__list{margin-top:var(--s-1)}

/* ── Migration ────────────────────────────────────────────── */
.migration{
  margin-top:var(--s-9);
  padding-top:var(--s-8);
  border-top:1px solid var(--line);
  display:flex;
  flex-direction:column;
  gap:var(--s-6);
}
.migration__steps{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:var(--s-4);
}
.migration__step{
  display:flex;
  flex-direction:column;
  gap:var(--s-2);
  padding:var(--s-4);
  border-radius:var(--r-md);
  background:var(--surface-3);
  border:1px solid var(--line-2);
  font-size:.9375rem;
  color:var(--text-soft);
}
.migration__step strong{display:block;color:var(--text);font-family:var(--ff-display);font-weight:600}
.band--wine .migration__step,.band--deep .migration__step{background:rgba(255,241,216,.05);border-color:var(--line-inv-2)}
.migration__arrow{
  width:100%;
  max-width:560px;
  height:auto;
  margin-inline:auto;
  color:var(--gold);
  stroke:currentColor;
  fill:none;
}
.band--paper .migration__arrow,.band--cream .migration__arrow{color:var(--orange-ink)}
.migration__arrow text{fill:currentColor;stroke:none;font-family:var(--ff-mono);font-size:11px;letter-spacing:.08em}


/* ============================================================================
   14 — STEPS / TIMELINE
   ========================================================================= */

.steps{
  position:relative;
  list-style:none;
  display:grid;
  gap:var(--s-6);
}
.steps--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.timeline__line{
  position:absolute;
  left:0;right:0;
  top:22px;
  height:1px;
  background:var(--grad-wine-rule);
  pointer-events:none;
}
.band--wine .timeline__line,.band--deep .timeline__line{background:var(--grad-gold-rule)}

.step{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:var(--s-3);
  padding-top:var(--s-9);
}
.step__num{
  position:absolute;
  top:0;left:0;
  display:grid;
  place-items:center;
  width:44px;height:44px;
  border-radius:50%;
  background:var(--surface);
  border:1px solid var(--line-strong);
  color:var(--accent-ink);
  font-size:.75rem;
  letter-spacing:.08em;
}
.band--wine .step__num,.band--deep .step__num{background:var(--wine-950);border-color:var(--line-inv-strong);color:var(--gold)}
.step__title{margin:0;font-size:1.1875rem;line-height:1.3}
.step__text{margin:0;color:var(--text-soft);font-size:.9375rem;line-height:1.6}
.step__meta{
  order:-1;
  color:var(--text-muted);
  font-size:.625rem;
}
.band--wine .step__meta,.band--deep .step__meta{color:var(--gold)}


/* ============================================================================
   15 — TESTIMONIALS
   ========================================================================= */

.quote-grid{display:grid;gap:var(--s-6);grid-template-columns:repeat(3,minmax(0,1fr))}
.quote-grid.grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.quote-grid.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.quote-grid.grid--3.quote-grid--count-1{grid-template-columns:minmax(0,620px)}
.quote-grid.grid--3.quote-grid--count-2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:960px}

.quote-card{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:var(--s-4);
  margin:0;
  padding:var(--s-7) var(--s-6) var(--s-6);
  border-radius:var(--r-lg);
  background:var(--elevated);
  border:var(--border);
  box-shadow:var(--sh-sm);
}
.band--wine .quote-card,.band--deep .quote-card{
  background:rgba(255,241,216,.05);
  border-color:var(--line-inv);
  box-shadow:none;
}
.quote-card__mark{
  position:absolute;
  top:var(--s-3);
  left:var(--s-6);
  font-family:var(--ff-display);
  font-size:3rem;
  line-height:1;
  color:var(--pa);
  opacity:.28;
  pointer-events:none;
}
.quote-card__text{
  margin:0;
  font-size:1.0625rem;
  line-height:1.62;
  color:var(--text);
}
.quote-card__rating{display:flex;gap:3px}
.star{
  width:15px;height:15px;
  display:inline-block;
  background:currentColor;
  color:var(--line-strong);
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l3 6.5 7 .9-5.1 4.8 1.3 6.9L12 17.8 5.8 21.1 7.1 14.2 2 9.4l7-.9z'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l3 6.5 7 .9-5.1 4.8 1.3 6.9L12 17.8 5.8 21.1 7.1 14.2 2 9.4l7-.9z'/%3E%3C/svg%3E");
  -webkit-mask-size:contain;mask-size:contain;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
}
.star--on{color:var(--amber)}
.band--wine .star,.band--deep .star{color:var(--line-inv-strong)}
.band--wine .star--on,.band--deep .star--on{color:var(--gold)}

.quote-card__person{
  display:flex;
  flex-direction:row;
  align-items:flex-start;
  gap:var(--s-3);
  margin-top:auto;
  padding-top:var(--s-4);
  border-top:1px solid var(--line-2);
}
.quote-card__logo{
  width:54px;
  height:54px;
  flex:0 0 54px;
  padding:5px;
  border:1px solid var(--line-2);
  border-radius:13px;
  background:#fff;
  object-fit:contain;
}
.quote-card__person-copy{
  min-width:0;
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  gap:var(--s-1);
  overflow-wrap:normal;
  word-break:normal;
}
.quote-card__name,.quote-card__role,.quote-card__org{overflow-wrap:break-word;word-break:normal}
.quote-card__name{display:block}
.quote-card__role,.quote-card__org{
  font-size:.875rem;
  line-height:1.45;
  color:var(--text-muted);
}
.quote-card__product{align-self:flex-start;margin-top:var(--s-2)}

.empty-state{
  display:flex;
  flex-direction:column;
  gap:var(--s-3);
  align-items:flex-start;
  padding:var(--s-9) var(--s-7);
  border-radius:var(--r-lg);
  border:1px dashed var(--line-strong);
  background:var(--surface-2);
  text-align:left;
}
.band--wine .empty-state,.band--deep .empty-state{border-color:var(--line-inv-strong);background:rgba(255,241,216,.04)}
.empty-state__title{margin:0}
.empty-state__text{margin:0;color:var(--text-soft);max-width:var(--cw-prose)}


/* ============================================================================
   16 — DOWNLOADS
   ========================================================================= */

.download-grid{display:grid;gap:var(--s-6);grid-template-columns:repeat(3,minmax(0,1fr))}

.download-card{
  display:flex;
  flex-direction:column;
  gap:var(--s-4);
  padding:var(--s-6);
  border-radius:var(--r-lg);
  background:var(--elevated);
  border:var(--border);
  box-shadow:var(--sh-sm);
  transition:transform var(--t-slow) var(--ease-out),box-shadow var(--t-slow) var(--ease-out);
}
.download-card:hover{transform:translateY(-4px);box-shadow:var(--sh-lg)}
.download-card--empty{
  background:var(--surface-2);
  border-style:dashed;
  box-shadow:none;
}
.download-card--empty:hover{transform:none;box-shadow:none}
.band--wine .download-card,.band--deep .download-card{
  background:rgba(255,241,216,.05);
  border-color:var(--line-inv);
  box-shadow:none;
}
.download-card__icon{
  width:36px;height:36px;
  flex:none;
  color:var(--pa-ink);
  stroke:currentColor;
  fill:none;
  stroke-width:1.5;
}
.download-card__body{display:flex;flex-direction:column;gap:var(--s-2);flex:1 1 auto}
.download-card__title{margin:0}
.download-card__meta{margin:0}
.download-card__cta{align-self:flex-start;margin-top:auto}

.file-meta{
  margin:0;
  color:var(--text-muted);
  font-family:var(--ff-mono);
  font-size:.8125rem;
  letter-spacing:.02em;
}
.download-empty{
  margin:0;
  color:var(--text-muted);
  font-size:.9375rem;
  line-height:1.55;
}


/* ============================================================================
   17 — FAQ (zero JS, native <details>)
   ========================================================================= */

.faq{
  max-width:var(--cw-narrow);
  border-top:1px solid var(--line);
}
.faq-group{margin-bottom:var(--s-10)}
.faq-group:last-child{margin-bottom:0}
.faq-group__title{margin:0 0 var(--s-5)}

.faq__item{
  border-bottom:1px solid var(--line);
  background:transparent;
  transition:background var(--t-fast) var(--ease);
}
.faq__q{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--s-4);
  min-height:56px;
  padding:var(--s-4) var(--s-4) var(--s-4) 0;
  cursor:pointer;
  list-style:none;
  font-family:var(--ff-display);
  font-size:1.0625rem;
  font-weight:600;
  line-height:1.4;
  letter-spacing:-.008em;
  color:var(--text);
}
.faq__q::-webkit-details-marker{display:none}
.faq__q::marker{content:""}
.faq__q:hover{background:var(--surface-2)}
.band--wine .faq__q:hover,.band--deep .faq__q:hover{background:rgba(255,241,216,.05)}
.faq__q:focus-visible{outline:3px solid var(--focus);outline-offset:2px}

.faq__marker{
  position:relative;
  flex:none;
  width:26px;height:26px;
  border-radius:50%;
  border:1px solid var(--line-strong);
  color:var(--accent-ink);
  transition:transform var(--t) var(--ease),border-color var(--t) var(--ease);
}
.faq__marker::before,.faq__marker::after{
  content:"";
  position:absolute;
  top:50%;left:50%;
  width:11px;height:1.5px;
  border-radius:2px;
  background:currentColor;
  transform:translate(-50%,-50%);
  transition:opacity var(--t) var(--ease);
}
.faq__marker::after{transform:translate(-50%,-50%) rotate(90deg)}
.faq__item[open] .faq__marker{transform:rotate(180deg);border-color:var(--accent-ink)}
.faq__item[open] .faq__marker::after{opacity:0}

.faq__a{
  padding:0 var(--s-9) var(--s-6) 0;
  max-width:var(--cw-prose);
  color:var(--text-soft);
  font-size:1rem;
  line-height:1.66;
}
.faq__a p{margin:0 0 var(--s-4)}
.faq__a p:last-child{margin-bottom:0}


/* ============================================================================
   18 — CTA BAND
   ========================================================================= */

.cta-band{position:relative}
.cta-band__inner{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(32px,4vw,64px);
  align-items:center;
}
.cta-band:not(.cta-band--form) .cta-band__inner{
  grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
}
.cta-band__copy{display:flex;flex-direction:column;gap:var(--s-4);min-width:0}
.cta-band__title{
  margin:0;
  font-family:var(--ff-display);
  font-size:clamp(1.75rem,1.3rem + 2vw,2.75rem);
  line-height:1.12;
  letter-spacing:-.024em;
  font-weight:600;
  text-wrap:balance;
}
.cta-band__text{margin:0;color:var(--text-soft);font-size:1.0625rem;line-height:1.62;max-width:var(--cw-prose)}
.cta-band__actions{display:flex;flex-wrap:wrap;gap:var(--s-4);margin-top:var(--s-2)}
.cta-band__form{
  padding:var(--s-5);
  border-radius:var(--r-xl);
  background:rgba(255,241,216,.05);
  border:1px solid var(--line-inv);
  min-width:0;
}
.cta-band--form .form{gap:var(--s-4)}
.cta-band--form .form-grid{gap:var(--s-3) var(--s-5)}
.cta-band--form .textarea{min-height:88px}
/* Keep paired enquiry controls level even when one label wraps onto two lines. */
.cta-band--form .form-grid > .form-row:not(.form-row--full) .field{
  height:100%;
}
.cta-band--form .form-grid > .form-row:not(.form-row--full) .input,
.cta-band--form .form-grid > .form-row:not(.form-row--full) .select-wrap{
  margin-top:auto;
}
.cta-band--form .form-actions .button{
  width:100%;
  justify-content:center;
}
.cta-band--form .form-note{
  max-width:none;
  text-align:center;
}
.cta-alt{
  margin:var(--s-4) 0 0;
  font-size:.9375rem;
  color:var(--text-muted);
}
.cta-alt a{color:var(--gold)}

/* Compact closing CTA: an eyebrow + title block with a single action.
   This class had no rule at all, so the heading block and the button were two
   adjacent blocks with nothing between them and the button sat hard against
   the last line of the title. */
.cta-row{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:var(--s-8);
}
.cta-row > div{
  display:flex;
  flex-direction:column;
  gap:var(--s-3);
  min-width:0;
}


/* ============================================================================
   19 — FORMS
   ========================================================================= */

.form-card{
  padding:clamp(24px,3.5vw,48px);
  border-radius:var(--r-xl);
  background:var(--elevated);
  border:var(--border);
  box-shadow:var(--sh-md);
}
.band--wine .form-card,.band--deep .form-card{
  background:rgba(255,241,216,.05);
  border-color:var(--line-inv);
  box-shadow:none;
}
.form-card__head{
  display:flex;
  flex-direction:column;
  gap:var(--s-3);
  margin-bottom:var(--s-7);
  padding-bottom:var(--s-6);
  border-bottom:1px solid var(--line-2);
}
.form-card__head h2,.form-card__head h1{margin:0}

.form{display:flex;flex-direction:column;gap:var(--s-6)}
.form-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--s-5);
}
.form-row{min-width:0}
.form-row--full{grid-column:1 / -1}

.field{display:flex;flex-direction:column;gap:var(--s-2)}
.field__label{
  font-size:.9375rem;
  font-weight:600;
  line-height:1.4;
  color:var(--text);
}
.required-mark{color:var(--accent-ink);margin-left:.15em}
.band--wine .required-mark,.band--deep .required-mark{color:var(--gold)}
.field__hint{margin:0;font-size:.8125rem;line-height:1.5;color:var(--text-muted)}
.field__error{margin:0;font-size:.8125rem;line-height:1.5;color:var(--wine-700);font-weight:500}
.band--wine .field__error,.band--deep .field__error{color:#f5b3b3}
.field.has-error .input,.field.has-error .textarea,.field.has-error .select{border-color:var(--wine-600)}

.input,.textarea,.select{
  width:100%;
  min-height:48px;
  padding:12px 14px;
  border-radius:var(--r-md);
  border:var(--border);
  background:var(--white);
  color:var(--ink);
  font-family:var(--ff-body);
  font-size:1.0625rem;
  line-height:1.5;
  transition:border-color var(--t) var(--ease),box-shadow var(--t) var(--ease);
}
.input::placeholder,.textarea::placeholder{color:var(--muted-2);opacity:.85}
.input:hover,.textarea:hover,.select:hover{border-color:var(--line-strong)}
.input:focus-visible,.textarea:focus-visible,.select:focus-visible{
  outline:3px solid var(--focus);
  outline-offset:2px;
  box-shadow:0 0 0 5px var(--focus-offset);
  border-color:var(--wine-700);
}
.textarea{min-height:132px;resize:vertical}

.select-wrap{position:relative;display:block}
.select{
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
  padding-right:44px;
  cursor:pointer;
}
.select-wrap::after{
  content:"";
  position:absolute;
  right:14px;
  top:50%;
  width:18px;height:18px;
  transform:translateY(-50%);
  background-image:var(--caret);
  background-repeat:no-repeat;
  background-size:18px 18px;
  pointer-events:none;
}

.radio-group{
  border:0;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:var(--s-3);
}
.radio-group legend{
  padding:0;
  margin-bottom:var(--s-2);
  font-size:.9375rem;
  font-weight:600;
  color:var(--text);
}
.radio-option{display:block}
.radio-option__label{
  display:flex;
  align-items:center;
  gap:var(--s-3);
  min-height:48px;
  padding:10px 16px;
  border-radius:var(--r-md);
  border:var(--border);
  background:var(--white);
  cursor:pointer;
  font-size:1rem;
  transition:border-color var(--t) var(--ease),background var(--t) var(--ease);
}
.radio-option__label:hover{border-color:var(--wine-700)}
.radio-option input{accent-color:var(--wine-700);width:20px;height:20px;flex:none}

.yes-no-row{display:flex;flex-wrap:wrap;gap:var(--s-3);margin-top:var(--s-2)}
.yes-no-row .radio-option{flex:1 1 160px}
.yes-no-row .radio-option__label:has(input:checked){
  border-color:var(--wine-700);
  box-shadow:0 0 0 1px var(--wine-700) inset;
}
.yes-no-row--locked .radio-option__label{cursor:not-allowed;opacity:.55}
.yes-no-row--locked .radio-option__label:hover{border-color:var(--line)}
.yes-no-row--locked .radio-option__label:has(input:checked){opacity:1}

.checkbox{
  display:flex;
  align-items:flex-start;
  gap:var(--s-3);
  min-height:48px;
  font-size:.9375rem;
  line-height:1.5;
  cursor:pointer;
}
.checkbox input{accent-color:var(--wine-700);width:20px;height:20px;margin-top:2px;flex:none}

.form-actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:var(--s-4);
}
.form-note{
  margin:0;
  font-size:.8125rem;
  line-height:1.55;
  color:var(--text-muted);
  max-width:var(--cw-prose);
}

.form-alert{
  padding:var(--s-4) var(--s-5);
  border-radius:var(--r-md);
  border:1px solid var(--line-strong);
  background:var(--surface-2);
  font-size:.9375rem;
  line-height:1.55;
}
.form-alert--error{
  background:rgba(143,16,34,.08);
  border-color:rgba(143,16,34,.34);
  color:var(--wine-700);
}
.form-alert--success{
  background:rgba(31,122,72,.09);
  border-color:rgba(31,122,72,.32);
  color:#14512f;
}
.band--wine .form-alert--error,.band--deep .form-alert--error{background:rgba(255,241,216,.06);border-color:rgba(240,165,165,.45);color:#f5c9c9}


/* ============================================================================
   20 — SUCCESS GREETING
   ========================================================================= */

.success-card{
  display:flex;
  flex-direction:column;
  gap:var(--s-5);
  padding:clamp(24px,3.5vw,48px);
  border-radius:var(--r-2xl);
  background:rgba(255,241,216,.05);
  border:1px solid var(--line-inv-strong);
}
.band--paper .success-card,.band--cream .success-card{
  background:var(--elevated);
  border-color:var(--line-strong);
  box-shadow:var(--sh-md);
}
.success-card__icon{
  width:56px;height:56px;
  flex:none;
  padding:14px;
  border-radius:50%;
  border:2px solid var(--gold);
  color:var(--gold);
  stroke:currentColor;
  fill:none;
  stroke-width:2.2;
  box-sizing:border-box;
}
.band--paper .success-card__icon,.band--cream .success-card__icon{border-color:var(--green);color:var(--green)}
.success-card__title{
  margin:0;
  font-family:var(--ff-display);
  font-size:clamp(1.75rem,1.3rem + 2vw,2.5rem);
  line-height:1.12;
  letter-spacing:-.024em;
  font-weight:700;
  text-wrap:balance;
}
.success-card__text{margin:0;color:var(--text-soft);font-size:1.0625rem;line-height:1.62;max-width:var(--cw-prose)}

.success-ref{
  display:flex;
  flex-direction:column;
  gap:var(--s-2);
  align-self:flex-start;
  padding:var(--s-4) var(--s-5);
  border-radius:var(--r-md);
  background:rgba(0,0,0,.22);
  border:1px solid var(--line-inv-strong);
}
.band--paper .success-ref,.band--cream .success-ref{background:var(--surface-2);border-color:var(--line-strong)}
.success-ref__label{color:var(--gold)}
.band--paper .success-ref__label,.band--cream .success-ref__label{color:var(--muted)}
.success-ref__code{
  font-family:var(--ff-mono);
  font-size:1.125rem;
  font-weight:600;
  letter-spacing:.06em;
  color:var(--text);
  user-select:all;
}
.success-card__list{margin:0}
.success-card__actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-4)}


/* ============================================================================
   21 — PROSE / LEGAL
   ========================================================================= */

.prose{max-width:var(--cw-prose);color:var(--text-soft)}
.prose > * + *{margin-top:var(--s-6)}
.prose h2{
  font-family:var(--ff-display);
  font-size:clamp(1.375rem,1.15rem + .9vw,1.75rem);
  line-height:1.2;
  letter-spacing:-.018em;
  font-weight:600;
  color:var(--text);
  margin-top:var(--s-10);
}
.prose > h2:first-child{margin-top:0}
.prose h3{
  font-family:var(--ff-display);
  font-size:1.1875rem;
  line-height:1.3;
  font-weight:600;
  color:var(--text);
  margin-top:var(--s-8);
}
.prose p{font-size:1.0625rem;line-height:1.7}
.prose ul,.prose ol{padding-left:1.35em;display:flex;flex-direction:column;gap:var(--s-2)}
.prose ul{list-style:disc}
.prose ol{list-style:decimal}
.prose li{line-height:1.65}
.prose a{color:var(--wine-700);font-weight:500}
.prose a:hover{color:var(--wine-600)}
.prose strong{color:var(--text)}
.prose__lead{color:var(--text);font-weight:400}

.legal-meta{
  margin:0;
  font-family:var(--ff-mono);
  font-size:.8125rem;
  letter-spacing:.04em;
  color:var(--text-muted);
}

.toc{
  display:flex;
  flex-direction:column;
  gap:var(--s-1);
  padding:var(--s-5) var(--s-6);
  margin-bottom:var(--s-9);
  border-radius:var(--r-md);
  background:var(--surface-2);
  border:var(--border);
}
.toc__link{
  display:block;
  min-height:36px;
  padding:6px 0;
  color:var(--wine-700);
  font-size:.9375rem;
  font-weight:500;
  text-decoration:none;
}
.toc__link:hover{text-decoration:underline}

.note{
  padding:var(--s-5);
  border-radius:var(--r-md);
  border-left:3px solid var(--accent-ink);
  background:var(--surface-3);
  color:var(--text-soft);
  font-size:.9375rem;
  line-height:1.6;
}
.note--warn{border-left-color:var(--wine-700);background:rgba(143,16,34,.07)}


/* ============================================================================
   22 — FOOTER
   ========================================================================= */

.site-footer{
  position:relative;
  background-image:var(--noise),var(--grad-deep);
  background-size:140px 140px,auto;
  color:var(--on-wine);
  border-top:1px solid var(--line-inv);
  --text:var(--on-wine);
  --text-soft:var(--on-wine-soft);
  --text-muted:var(--on-wine-muted);
  --focus:var(--gold);
  --focus-offset:var(--wine-950);
}

.footer-top{
  display:grid;
  grid-template-columns:1.6fr 1fr 1fr 1fr 1fr 1.4fr;
  gap:var(--s-8) var(--s-6);
  padding-block:clamp(48px,6vw,80px) var(--s-9);
}

.footer-intro{display:flex;flex-direction:column;gap:var(--s-4)}
.footer-brand{color:var(--on-wine)}
.footer-blurb{
  margin:0;
  font-size:.9375rem;
  line-height:1.6;
  color:var(--on-wine-soft);
  max-width:34ch;
}

.footer-links{display:flex;flex-direction:column;gap:var(--s-1);min-width:0}
.footer-links__title{
  margin:0 0 var(--s-3);
  color:var(--gold);
  font-family:var(--ff-mono);
  font-size:.6875rem;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.footer-link{
  display:flex;
  align-items:center;
  min-height:44px;
  padding:4px 0;
  color:var(--on-wine);
  font-size:1rem;
  font-weight:500;
  line-height:1.4;
  text-decoration:none;
}
.footer-link:hover,.footer-link:focus-visible{color:var(--gold);text-decoration:underline}

.footer-contact{display:flex;flex-direction:column;gap:var(--s-4);min-width:0}
.footer-address{
  font-style:normal;
  font-size:1rem;
  font-weight:500;
  line-height:1.6;
  color:var(--on-wine);
}
.footer-address b{
  display:block;
  margin-bottom:var(--s-2);
  font-family:var(--ff-mono);
  font-size:.6875rem;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--gold);
}
/* The registered office names the legal entity on its own line above the
   street address, so the block reads as a company record rather than a
   bare location. */
.footer-entity{
  display:block;
  margin-bottom:2px;
  font-weight:700;
  letter-spacing:.01em;
  color:var(--on-wine);
}
/* In the copyright bar the entity stays close to its neighbours' weight, so
   the line still reads as one sentence rather than a heading dropped into it. */
.footer-entity-inline{
  font-weight:600;
  color:var(--on-wine);
}
.footer-demo{
  display:inline-flex;
  align-items:center;
  gap:.4em;
  min-height:44px;
  color:var(--gold);
  font-weight:600;
  text-decoration:none;
  border-bottom:1px solid transparent;
  align-self:flex-start;
}
.footer-demo:hover{color:var(--gold-soft);border-bottom-color:currentColor}

.footer-identity{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:var(--s-3) var(--s-6);
  padding-block:var(--s-5);
  border-top:1px solid var(--line-inv-2);
  color:var(--on-wine-soft);
  font-family:var(--ff-mono);
  font-size:.6875rem;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.footer-origin{
  display:inline-flex;
  align-items:center;
  gap:10px;
  min-width:0;
  color:var(--gold-soft);
  white-space:nowrap;
}
.footer-origin::before{
  content:"";
  width:4px;
  height:28px;
  flex:none;
  border-radius:var(--r-pill);
  background:linear-gradient(180deg,#ff9933 0 33.333%,#fff 33.333% 66.666%,#138808 66.666% 100%);
  box-shadow:0 0 16px rgba(255,153,51,.16);
}
.footer-origin strong{font-weight:700}

.footer-bottom{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:var(--s-3) var(--s-6);
  padding-block:var(--s-5) var(--s-7);
  border-top:1px solid var(--line-inv-2);
  color:var(--on-wine-soft);
  font-size:.875rem;
}
.footer-legal{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-5)}
.footer-legal a{
  display:inline-flex;
  align-items:center;
  min-height:44px;
  color:var(--on-wine);
  font-weight:500;
  text-decoration:none;
}
.footer-legal a:hover{color:var(--gold);text-decoration:underline}


/* ============================================================================
   23 — CATALOGUE / PRINT SHEETS
   ========================================================================= */

.catalog-links{
  display:flex;
  flex-wrap:wrap;
  gap:var(--s-3) var(--s-6);
  padding-block:var(--s-5);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}

.catalog-document{
  break-inside:avoid;
  page-break-inside:avoid;
  padding:clamp(24px,3.5vw,48px);
  border-radius:var(--r-xl);
  background:var(--elevated);
  border:var(--border);
  box-shadow:var(--sh-sm);
  display:flex;
  flex-direction:column;
  gap:var(--s-8);
}
.catalog-document + .catalog-document{margin-top:var(--s-9)}
.catalog-head{
  display:flex;
  align-items:center;
  gap:var(--s-4);
  padding-bottom:var(--s-5);
  border-bottom:1px solid var(--line);
}
.catalog-head img{width:48px;height:48px;flex:none}

.print-only{display:none}


/* ============================================================================
   24 — MOTION
   ========================================================================= */

/* Scroll reveal. The .js guard means a JS failure can never blank the page. */
.js [data-reveal]{
  opacity:0;
  transform:translateY(var(--reveal-shift));
  transition:opacity var(--t-reveal) var(--ease),transform var(--t-reveal) var(--ease);
}
.js [data-reveal].is-in{opacity:1;transform:none}

/* Static stagger — no JS-computed delays. */
.reveal-stagger > *{transition-delay:0ms}
.js [data-reveal].reveal-stagger > *{
  opacity:0;
  transform:translateY(var(--reveal-shift));
  transition:opacity var(--t-reveal) var(--ease),transform var(--t-reveal) var(--ease);
}
.js [data-reveal].is-in.reveal-stagger > *{opacity:1;transform:none}
.reveal-stagger > *:nth-child(1){transition-delay:0ms}
.reveal-stagger > *:nth-child(2){transition-delay:70ms}
.reveal-stagger > *:nth-child(3){transition-delay:140ms}
.reveal-stagger > *:nth-child(4){transition-delay:210ms}
.reveal-stagger > *:nth-child(5){transition-delay:280ms}
.reveal-stagger > *:nth-child(6){transition-delay:350ms}
.reveal-stagger > *:nth-child(7){transition-delay:420ms}
.reveal-stagger > *:nth-child(8){transition-delay:490ms}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
  .card:hover,.product-card:hover,.bento__cell:hover,
  .download-card:hover,.button-primary:hover,.button-light:hover{transform:none}
}

/* Coarse pointers: no hover lift, press feedback instead. */
@media (hover:none){
  .card:hover,.product-card:hover,.bento__cell:hover,
  .download-card:hover,.button:hover{transform:none;box-shadow:var(--sh-sm)}
  .card:hover::before{opacity:0}
}


/* ============================================================================
   24B — FUTURE INTERFACE REFINEMENT
   ========================================================================= */

:root{
  --wine-950:#040914;--wine-900:#07111f;--wine-880:#0a1628;--wine-850:#0d1b30;
  --wine-800:#10233c;--wine-700:#143354;--wine-600:#1d4f74;--wine-500:#2776a0;
  --orange:#22d3ee;--orange-deep:#06b6d4;--orange-ink:#087f8c;--orange-lite:#67e8f9;
  --amber:#8b5cf6;--gold:#a5f3fc;--gold-soft:#cffafe;
  --cream:#e9eefb;--paper:#f8faff;--bg:#eef2fb;--ink:#091426;--ink-soft:#263754;
  --muted:#52617a;--muted-2:#67738a;--on-wine:#f7fbff;--on-wine-soft:#bdcbe0;--on-wine-muted:#8fa4be;
  --line:rgba(30,71,117,.14);--line-2:rgba(30,71,117,.08);--line-strong:rgba(30,71,117,.23);
  --line-inv:rgba(125,211,252,.17);--line-inv-2:rgba(125,211,252,.09);--line-inv-strong:rgba(103,232,249,.35);
  --grad-wine:radial-gradient(circle at 78% 18%,rgba(139,92,246,.20),transparent 29%),radial-gradient(circle at 14% 72%,rgba(34,211,238,.12),transparent 32%),linear-gradient(145deg,#07111f 0%,#040914 58%,#0b1630 100%);
  --grad-deep:radial-gradient(circle at 82% 20%,rgba(34,211,238,.12),transparent 27%),linear-gradient(180deg,#050b16 0%,#02050c 100%);
  --grad-accent:linear-gradient(135deg,#a5f3fc 0%,#22d3ee 48%,#8b5cf6 130%);
  --grad-gold-rule:linear-gradient(90deg,transparent,rgba(103,232,249,.58),transparent);
  --grad-wine-rule:linear-gradient(90deg,transparent,rgba(34,211,238,.30),transparent);
  --grad-paper:linear-gradient(180deg,rgba(255,255,255,.94),rgba(242,246,255,.98));
  --grad-cream:linear-gradient(180deg,#edf2fc 0%,#e7edfa 100%);
  --grad-mock:linear-gradient(160deg,rgba(255,255,255,.10),rgba(103,232,249,.025));
  --grid-inv:linear-gradient(rgba(125,211,252,.065) 1px,transparent 1px),linear-gradient(90deg,rgba(125,211,252,.065) 1px,transparent 1px);
  --grid-lite:linear-gradient(rgba(30,71,117,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(30,71,117,.045) 1px,transparent 1px);
  --sh-sm:0 2px 6px rgba(5,15,34,.06),0 1px 2px rgba(5,15,34,.04);
  --sh-md:0 12px 30px rgba(5,15,34,.09),0 2px 5px rgba(5,15,34,.05);
  --sh-lg:0 22px 55px rgba(5,15,34,.13),0 5px 14px rgba(5,15,34,.06);
  --sh-xl:0 40px 90px rgba(2,8,23,.25),0 10px 28px rgba(2,8,23,.16);
  --sh-inv:0 35px 90px rgba(0,0,0,.50),0 0 50px rgba(34,211,238,.10);
  --r-md:16px;--r-lg:22px;--r-xl:30px;--r-2xl:38px;
}

.accent-school,.accent-amber{--pa:#22d3ee;--pa-ink:#087f8c;--pa-inv:#67e8f9;--pa-soft:rgba(34,211,238,.12)}
.accent-hospital,.accent-rose{--pa:#fb7185;--pa-ink:#be123c;--pa-inv:#fda4af;--pa-soft:rgba(251,113,133,.12)}
.accent-billing,.accent-orange{--pa:#38bdf8;--pa-ink:#0369a1;--pa-inv:#7dd3fc;--pa-soft:rgba(56,189,248,.12)}
.accent-inventory,.accent-gold{--pa:#a78bfa;--pa-ink:#6d28d9;--pa-inv:#c4b5fd;--pa-soft:rgba(167,139,250,.13)}
.accent-business,.accent-burgundy{--pa:#818cf8;--pa-ink:#4338ca;--pa-inv:#a5b4fc;--pa-soft:rgba(129,140,248,.12)}

body{background:radial-gradient(circle at 10% 8%,rgba(34,211,238,.055),transparent 24rem),radial-gradient(circle at 92% 38%,rgba(139,92,246,.055),transparent 28rem),var(--bg)}
.utility-bar{background:#030812;border-bottom-color:rgba(103,232,249,.10)}
.utility-bar__item--cta{color:var(--gold)}
.site-header{background:rgba(7,17,31,.88);border-bottom:1px solid rgba(125,211,252,.11);backdrop-filter:blur(20px) saturate(145%);-webkit-backdrop-filter:blur(20px) saturate(145%)}
.site-header.scrolled{background:rgba(4,9,20,.94);box-shadow:0 18px 50px rgba(0,0,0,.30),inset 0 -1px rgba(103,232,249,.08)}
.brand-mark{box-shadow:0 0 0 1px rgba(103,232,249,.20),0 0 32px rgba(34,211,238,.14);border-radius:14px}
.brand-name strong{letter-spacing:-.025em}.brand-name small{color:#8fa4be;letter-spacing:.12em}
.nav-link::after{background:linear-gradient(90deg,var(--orange),var(--amber))}
.nav-panel{background:rgba(7,17,31,.96);border-color:rgba(125,211,252,.17);box-shadow:0 32px 80px rgba(0,0,0,.42),inset 0 1px rgba(255,255,255,.04);backdrop-filter:blur(26px)}

.button{letter-spacing:-.005em;box-shadow:inset 0 1px rgba(255,255,255,.18)}
.button-primary{color:#021016;background:var(--grad-accent);border-color:rgba(165,243,252,.75);box-shadow:0 12px 34px rgba(34,211,238,.18),inset 0 1px rgba(255,255,255,.55)}
.button-primary:hover{box-shadow:0 18px 44px rgba(34,211,238,.28),0 0 0 1px rgba(165,243,252,.22),inset 0 1px rgba(255,255,255,.6)}
.button-outline-light,.button-login{background:rgba(255,255,255,.035);border-color:rgba(125,211,252,.24);backdrop-filter:blur(12px)}
.button-outline-light:hover,.button-login:hover{background:rgba(103,232,249,.09);border-color:rgba(103,232,249,.42)}

.band--wine,.band--deep{position:relative;isolation:isolate}
.band--wine:not(.band--mesh)::after,.band--deep:not(.band--mesh)::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(115deg,transparent 38%,rgba(103,232,249,.035) 49%,transparent 60%)}
.hero--home{min-height:min(850px,calc(100vh - var(--utility-h) - var(--header-h)));overflow:hidden}
.hero--home::before{content:"";position:absolute;width:520px;height:520px;right:-180px;top:-210px;border:1px solid rgba(103,232,249,.16);border-radius:50%;box-shadow:0 0 0 70px rgba(34,211,238,.025),0 0 0 140px rgba(139,92,246,.018);pointer-events:none}
.hero__grid{position:relative;z-index:1}.hero__copy{position:relative}
.hero__title{max-width:13ch;background:linear-gradient(115deg,#fff 0%,#e2f7ff 54%,#9eeaf7 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 14px 50px rgba(34,211,238,.08)}
.hero__lead{max-width:60ch;color:#b8c7db}.hero__micro{color:#8fa4be}
.hero .eyebrow{display:inline-flex;align-items:center;gap:9px;width:fit-content;max-width:100%;padding:9px 13px;border:1px solid rgba(103,232,249,.20);border-radius:var(--r-pill);background:rgba(34,211,238,.065);box-shadow:inset 0 1px rgba(255,255,255,.06),0 0 28px rgba(34,211,238,.06);line-height:1.4;white-space:normal;overflow-wrap:normal;word-break:normal}
.hero .eyebrow::before{content:"";width:7px;height:7px;flex:none;border-radius:50%;background:var(--orange);box-shadow:0 0 0 5px rgba(34,211,238,.10),0 0 16px var(--orange)}
.hero__visual{perspective:1400px}
.hero__visual .mock{transform:rotateY(-4deg) rotateX(1.5deg);transform-origin:center left;border-color:rgba(103,232,249,.24);box-shadow:var(--sh-inv),inset 0 1px rgba(255,255,255,.08);background:rgba(7,17,31,.82);backdrop-filter:blur(18px)}
.hero__visual .mock::before{content:"";position:absolute;inset:-1px;z-index:-1;border-radius:inherit;background:linear-gradient(135deg,rgba(103,232,249,.34),transparent 28%,transparent 70%,rgba(139,92,246,.24));filter:blur(14px);opacity:.7}
.mock__chrome{background:rgba(255,255,255,.035);border-bottom-color:rgba(125,211,252,.12)}
.mock__dot:first-child{background:#fb7185}.mock__dot:nth-child(2){background:#fbbf24}.mock__dot:nth-child(3){background:#34d399}
.chart__bar{background:linear-gradient(180deg,rgba(125,211,252,.75),rgba(34,211,238,.13))}
.chart__bar--accent{background:linear-gradient(180deg,#c4b5fd,#8b5cf6);box-shadow:0 0 18px rgba(139,92,246,.38)}

.band--paper,.band--cream{background-color:transparent}.band--paper{background-image:var(--grad-paper)}.band--cream{background-image:var(--grad-cream)}
.section-num,.eyebrow{color:var(--orange-ink)}.section-title,.page-title{letter-spacing:-.036em}
.trust-strip{padding:10px;border:1px solid var(--line);border-radius:var(--r-xl);background:rgba(255,255,255,.62);box-shadow:var(--sh-sm),inset 0 1px rgba(255,255,255,.9);backdrop-filter:blur(16px)}
.trust-item{padding:14px 16px;border-radius:var(--r-md);transition:background var(--t) var(--ease),transform var(--t) var(--ease)}
.trust-item:hover{background:rgba(34,211,238,.065);transform:translateY(-2px)}
.trust-item__icon{color:var(--orange-ink);filter:drop-shadow(0 5px 10px rgba(34,211,238,.18))}

.card,.product-card,.bento__cell,.download-card,.quote-card,.version-option,.form-card,.catalog-document{border-color:rgba(30,71,117,.14);background:linear-gradient(145deg,rgba(255,255,255,.88),rgba(247,250,255,.68));box-shadow:var(--sh-sm),inset 0 1px rgba(255,255,255,.9);backdrop-filter:blur(14px)}
.card::after,.product-card::after,.bento__cell::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(135deg,rgba(34,211,238,.07),transparent 30%,transparent 72%,rgba(139,92,246,.055))}
.card:hover,.product-card:hover,.bento__cell:hover,.download-card:hover{border-color:rgba(34,211,238,.28);box-shadow:var(--sh-lg),0 0 0 1px rgba(34,211,238,.05)}
.product-card__icon,.module__num,.step__num{box-shadow:0 10px 25px var(--pa-soft),inset 0 1px rgba(255,255,255,.65)}
.chip{border-color:rgba(30,71,117,.16);background:rgba(255,255,255,.52)}
.band--wine .chip,.band--deep .chip{background:rgba(34,211,238,.055);border-color:rgba(125,211,252,.14)}
.cta-band__form{background:rgba(255,255,255,.055);border-color:rgba(125,211,252,.17);box-shadow:0 28px 70px rgba(0,0,0,.26);backdrop-filter:blur(20px)}
.form-control{border-color:rgba(30,71,117,.17);background:rgba(255,255,255,.74)}
.band--wine .form-control,.band--deep .form-control{background:rgba(255,255,255,.065);border-color:rgba(125,211,252,.19)}
.site-footer{background:#030812;border-top:1px solid rgba(103,232,249,.10)}

@media (min-width:1024px) and (hover:hover) and (prefers-reduced-motion:no-preference){
  .hero__visual .mock{animation:future-float 7s ease-in-out infinite}
  .hero .eyebrow::before{animation:future-pulse 2.6s ease-in-out infinite}
  @keyframes future-float{0%,100%{transform:rotateY(-4deg) rotateX(1.5deg) translateY(0)}50%{transform:rotateY(-2.5deg) rotateX(.8deg) translateY(-10px)}}
  @keyframes future-pulse{0%,100%{opacity:.72;box-shadow:0 0 0 4px rgba(34,211,238,.09),0 0 12px var(--orange)}50%{opacity:1;box-shadow:0 0 0 7px rgba(34,211,238,.05),0 0 22px var(--orange)}}
}

/* ============================================================================
   24C — JPRAXC SIGNATURE BRAND SYSTEM
   Burgundy, orange, champagne and ivory sampled from the supplied JPRAXC mark.
   ========================================================================= */

:root{
  --wine-950:#240107;--wine-900:#3d0510;--wine-880:#4b0613;--wine-850:#580818;
  --wine-800:#680818;--wine-700:#7a071b;--wine-600:#98091f;--wine-500:#b20d2a;
  --orange:#f87808;--orange-deep:#e96000;--orange-ink:#b94a00;--orange-lite:#ff9c2f;
  --amber:#ffad18;--gold:#f8c888;--gold-soft:#ffe1ae;
  --cream:#fff0d9;--paper:#fffaf3;--bg:#f8efe5;--white:#fffdf9;
  --ink:#261015;--ink-soft:#493036;--muted:#715b61;--muted-2:#826c71;
  --on-wine:#fff9ef;--on-wine-soft:#f4d9c3;--on-wine-muted:#d7b39d;
  --line:rgba(105,0,25,.14);--line-2:rgba(105,0,25,.075);--line-strong:rgba(105,0,25,.23);
  --line-inv:rgba(255,215,154,.18);--line-inv-2:rgba(255,215,154,.09);--line-inv-strong:rgba(255,215,154,.34);
  --grad-wine:radial-gradient(circle at 78% 14%,rgba(255,138,0,.16),transparent 28%),radial-gradient(circle at 12% 78%,rgba(255,215,154,.08),transparent 34%),linear-gradient(145deg,#690019 0%,#3b000c 52%,#250007 100%);
  --grad-deep:radial-gradient(circle at 84% 16%,rgba(255,138,0,.10),transparent 28%),linear-gradient(180deg,#36000b 0%,#1b0005 100%);
  --grad-accent:linear-gradient(135deg,#ffe4b5 0%,#ffad18 44%,#ff7200 100%);
  --grad-gold-rule:linear-gradient(90deg,transparent,rgba(255,215,154,.66),rgba(255,138,0,.66),transparent);
  --grad-wine-rule:linear-gradient(90deg,transparent,rgba(135,1,31,.28),transparent);
  --grad-paper:linear-gradient(180deg,#fffdf9 0%,#fff8ee 100%);
  --grad-cream:linear-gradient(180deg,#fff5e7 0%,#ffedd4 100%);
  --grad-mock:linear-gradient(160deg,rgba(255,244,225,.11),rgba(255,138,0,.025));
  --grid-inv:linear-gradient(rgba(255,215,154,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,215,154,.06) 1px,transparent 1px);
  --grid-lite:linear-gradient(rgba(105,0,25,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(105,0,25,.045) 1px,transparent 1px);
  --sh-sm:0 3px 9px rgba(67,0,16,.06),0 1px 2px rgba(67,0,16,.04);
  --sh-md:0 14px 34px rgba(67,0,16,.10),0 3px 8px rgba(67,0,16,.05);
  --sh-lg:0 24px 60px rgba(67,0,16,.14),0 6px 16px rgba(67,0,16,.07);
  --sh-xl:0 40px 100px rgba(34,0,8,.30),0 12px 30px rgba(34,0,8,.18);
  --sh-inv:0 38px 100px rgba(17,0,4,.54),0 0 58px rgba(255,138,0,.10);
  --ff-display:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;
  --ff-body:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --r-lg:20px;--r-xl:28px;--r-2xl:36px;
}

.accent-school,.accent-amber{--pa:#ffad18;--pa-ink:#9e5200;--pa-inv:#ffd27b;--pa-soft:rgba(255,173,24,.13)}
.accent-hospital,.accent-rose{--pa:#dc3554;--pa-ink:#a30b2b;--pa-inv:#f18498;--pa-soft:rgba(220,53,84,.12)}
.accent-billing,.accent-orange{--pa:#ff7200;--pa-ink:#c64c00;--pa-inv:#ffad55;--pa-soft:rgba(255,114,0,.12)}
.accent-inventory,.accent-gold{--pa:#f4b83f;--pa-ink:#936000;--pa-inv:#ffd77e;--pa-soft:rgba(244,184,63,.14)}
.accent-business,.accent-burgundy{--pa:#a40729;--pa-ink:#78001c;--pa-inv:#ef9aad;--pa-soft:rgba(164,7,41,.11)}
.accent-web{--pa:#d99a28;--pa-ink:#7b071d;--pa-inv:#f8c766;--pa-soft:rgba(217,154,40,.13)}

body{font-size:1.0625rem;line-height:1.66;background:radial-gradient(circle at 8% 10%,rgba(255,173,24,.06),transparent 25rem),radial-gradient(circle at 94% 42%,rgba(135,1,31,.05),transparent 30rem),var(--bg)}
.hero__title{font-size:clamp(2.8rem,2rem + 2.35vw,4.25rem);line-height:1.01;letter-spacing:-.048em;font-weight:700;max-width:16ch;background:none;color:var(--on-wine);text-shadow:0 18px 55px rgba(255,138,0,.10)}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .hero__title{background:linear-gradient(120deg,#fffdf7 0%,#ffe8bf 60%,#ffc86f 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
}
.page-title{font-size:clamp(2.6rem,1.7rem + 3.3vw,4.3rem);line-height:1.01;letter-spacing:-.05em;font-weight:700}
.section-title{font-size:clamp(2.05rem,1.35rem + 2.55vw,3.45rem);line-height:1.07;letter-spacing:-.046em;font-weight:700;max-width:18ch}
.h3,.bento__title,.step__title,.faq-group__title{font-weight:700;letter-spacing:-.028em}
.card__title,.product-card__name,.download-card__title,.version-option__title,.quote-card__name{font-family:var(--ff-display);font-weight:700;letter-spacing:-.025em}
.section-lead{max-width:58ch;font-size:clamp(1.05rem,1rem + .3vw,1.22rem);line-height:1.62}
.section-head{gap:var(--s-4);margin-bottom:clamp(34px,5vw,64px)}
.section-num,.eyebrow{color:var(--wine-600);letter-spacing:.14em}

.utility-bar{background:#250007;border-bottom-color:rgba(255,215,154,.10)}
.site-header{background:rgba(59,0,12,.93);border-bottom-color:rgba(255,215,154,.13);backdrop-filter:blur(20px) saturate(145%);-webkit-backdrop-filter:blur(20px) saturate(145%)}
.site-header.scrolled{background:rgba(37,0,7,.93);box-shadow:0 18px 50px rgba(32,0,8,.30),inset 0 -1px rgba(255,215,154,.10)}
.brand-mark{width:50px;height:50px;border-radius:15px;border-color:rgba(255,215,154,.34);box-shadow:0 0 0 1px rgba(255,138,0,.10),0 0 34px rgba(255,138,0,.15)}
.brand-mark img{width:50px;height:50px}.brand-name strong{letter-spacing:-.035em}.brand-name small{color:var(--gold);letter-spacing:.13em}
.nav-link::after{background:linear-gradient(90deg,var(--gold),var(--orange))}
.nav-panel{background:rgba(55,0,11,.98);border-color:rgba(255,215,154,.22);box-shadow:0 34px 86px rgba(32,0,8,.48),inset 0 1px rgba(255,255,255,.04)}

.button{min-height:48px;border-radius:13px;font-family:var(--ff-body);font-weight:600;letter-spacing:-.01em}
.button-large{min-height:56px;padding-inline:25px}
.button-primary{color:#3b000c;background:var(--grad-accent);border-color:rgba(255,226,175,.85);box-shadow:0 13px 34px rgba(255,114,0,.22),inset 0 1px rgba(255,255,255,.62)}
.button-primary:hover{color:#250007;box-shadow:0 19px 48px rgba(255,114,0,.30),0 0 0 1px rgba(255,215,154,.20),inset 0 1px rgba(255,255,255,.68)}
.band--wine a.button-primary,.band--deep a.button-primary{color:var(--wine-950)}
.band--wine a.button-primary:hover,.band--deep a.button-primary:hover{color:var(--wine-950)}
.band--wine a.button-light,.band--deep a.button-light{color:var(--wine-900)}
.band--wine a.button-light:hover,.band--deep a.button-light:hover{color:var(--wine-800)}
.button-outline-light,.button-login{background:rgba(255,247,231,.045);border-color:rgba(255,215,154,.26);backdrop-filter:blur(12px)}
.button-outline-light:hover,.button-login:hover{background:rgba(255,215,154,.10);border-color:rgba(255,215,154,.48)}

.band--wine:not(.band--mesh)::after,.band--deep:not(.band--mesh)::after{background:linear-gradient(115deg,transparent 38%,rgba(255,215,154,.035) 49%,transparent 60%)}
.hero--home::before{content:"";position:absolute;inset:0;width:auto;height:auto;border:0;border-radius:0;box-shadow:none;z-index:var(--z-base);pointer-events:none;background-image:var(--grid-inv);background-size:var(--grid-pitch);-webkit-mask-image:var(--grid-mask);mask-image:var(--grid-mask)}
.hero__lead{max-width:58ch;color:#f0d6c2;font-size:clamp(1.08rem,1rem + .55vw,1.32rem)}
.hero .eyebrow{color:#ffd79a;padding:9px 13px;border-color:rgba(255,215,154,.24);background:rgba(255,173,24,.075);box-shadow:inset 0 1px rgba(255,255,255,.06),0 0 28px rgba(255,138,0,.08)}
.hero .eyebrow::before{background:var(--orange);box-shadow:0 0 0 5px rgba(255,138,0,.12),0 0 16px var(--orange)}
.hero__proof{list-style:none;display:flex;flex-wrap:wrap;gap:10px 18px;margin:0;padding:0;color:var(--on-wine-muted);font-size:.9rem;font-weight:500}
.hero__proof li{display:inline-flex;align-items:center;gap:8px}.hero__proof li::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--orange);box-shadow:0 0 10px rgba(255,138,0,.65)}
.hero__visual .mock{transform:rotateY(-3.5deg) rotateX(1deg);border-color:rgba(255,215,154,.25);background:rgba(60,0,13,.84);box-shadow:var(--sh-inv),inset 0 1px rgba(255,255,255,.08)}
.hero__visual .mock::before{background:linear-gradient(135deg,rgba(255,215,154,.30),transparent 28%,transparent 70%,rgba(255,114,0,.23));filter:blur(15px)}
.mock__chrome{background:rgba(255,244,225,.045);border-bottom-color:rgba(255,215,154,.13)}
.chart__bar{background:linear-gradient(180deg,rgba(255,215,154,.80),rgba(255,138,0,.18))}
.chart__bar--accent{background:linear-gradient(180deg,#ffd79a,#ff7200);box-shadow:0 0 20px rgba(255,114,0,.42)}

.band--paper{background-image:var(--grad-paper)}.band--cream{background-image:var(--grad-cream)}
.trust-strip{grid-template-columns:repeat(4,minmax(0,1fr));padding:11px;border-color:rgba(105,0,25,.13);background:rgba(255,253,249,.72);box-shadow:var(--sh-sm),inset 0 1px rgba(255,255,255,.95)}
.trust-item{padding:16px;border-radius:15px}.trust-item:hover{background:rgba(255,173,24,.08)}
.trust-item__icon{color:var(--wine-600);filter:drop-shadow(0 5px 10px rgba(135,1,31,.15))}.trust-item__text{font-weight:600;color:var(--ink-soft)}

.card,.product-card,.bento__cell,.download-card,.quote-card,.version-option,.form-card,.catalog-document{border-color:rgba(105,0,25,.13);background:linear-gradient(145deg,rgba(255,253,249,.94),rgba(255,247,235,.76));box-shadow:var(--sh-sm),inset 0 1px rgba(255,255,255,.95);backdrop-filter:none}
.card::after,.product-card::after,.bento__cell::after{content:none}
.card:hover,.product-card:hover,.bento__cell:hover,.download-card:hover{border-color:rgba(164,7,41,.27);box-shadow:var(--sh-lg),0 0 0 1px rgba(255,173,24,.055)}
.product-card__art{height:150px;background:radial-gradient(circle at 78% 22%,var(--pa-soft),transparent 32%),linear-gradient(180deg,var(--pa-soft),transparent),var(--grid-lite)}
.product-card__art{display:grid;place-items:center;isolation:isolate}
.product-card__art::before,.product-card__art::after{content:none!important}
.product-card__logo{position:relative;z-index:1;display:block;width:min(118px,48%);height:auto;aspect-ratio:1;object-fit:contain;filter:drop-shadow(0 12px 20px rgba(46,0,10,.18))}
.product-card__logo--compact{width:82px;margin:0 0 18px!important;filter:drop-shadow(0 10px 16px rgba(23,0,6,.24))}
.product-page__logo{display:block;width:clamp(88px,9vw,126px);height:auto;aspect-ratio:1;object-fit:contain;margin:0 0 20px;filter:drop-shadow(0 16px 25px rgba(20,0,5,.3))}
.band--wine .product-card__logo,.band--deep .product-card__logo{filter:drop-shadow(0 14px 22px rgba(0,0,0,.28))}
.product-card__name{font-size:1.35rem}.product-card__short{font-size:1rem;line-height:1.62}
.product-card__icon,.module__num,.step__num{box-shadow:0 10px 26px var(--pa-soft),inset 0 1px rgba(255,255,255,.72)}
.download-card--empty{background:var(--surface-2);box-shadow:none}.download-card--empty:hover{border-color:var(--line);box-shadow:none;transform:none}
.chip{border-color:rgba(105,0,25,.14);background:rgba(255,253,249,.64)}
.band--wine .chip,.band--deep .chip{background:rgba(255,215,154,.065);border-color:rgba(255,215,154,.16)}
.bento__cell{min-height:225px}.bento__cell--anchor{min-height:480px}
.faq__item{border-color:rgba(105,0,25,.13);background:rgba(255,253,249,.66);box-shadow:0 7px 24px rgba(67,0,16,.045)}
.faq__q{font-family:var(--ff-display);font-weight:700;letter-spacing:-.02em}
.cta-band__form{background:rgba(255,248,235,.075);border-color:rgba(255,215,154,.19);box-shadow:0 30px 76px rgba(25,0,6,.30);backdrop-filter:blur(20px)}
.form-control,.input,.select,.textarea{border-color:rgba(105,0,25,.17);background:rgba(255,253,249,.82)}
.band--wine .form-control,.band--deep .form-control,.band--wine .input,.band--deep .input,.band--wine .select,.band--deep .select,.band--wine .textarea,.band--deep .textarea{background:rgba(255,250,240,.97);border-color:rgba(255,215,154,.34);color:var(--ink)}
.site-footer{background:#250007;border-top-color:rgba(255,215,154,.12)}
.footer-top{grid-template-columns:minmax(210px,1.55fr) repeat(4,minmax(120px,1fr)) minmax(220px,1.45fr);column-gap:clamp(18px,2vw,32px)}
.footer-link{overflow-wrap:anywhere}

/* Canonical logo placement: full silhouette, no surrounding frame. */
.site-header .brand{gap:14px;padding-block:8px}
.site-header .brand-mark{width:58px;height:58px;border:0;border-radius:0;background:transparent;box-shadow:none;overflow:visible}
.site-header .brand-mark img{width:58px;height:58px;object-fit:contain;filter:drop-shadow(0 8px 15px rgba(15,0,4,.28))}
@media(max-width:980px){
  .site-header .brand{gap:10px}
  .site-header .brand-mark,.site-header .brand-mark img{width:48px;height:48px}
}

/* ── Public purchase and licence request ─────────────────── */
.mega__item--purchase{
  border:1px solid rgba(255,193,62,.22);
  background:linear-gradient(135deg,rgba(255,173,24,.12),rgba(255,114,0,.055));
}
.mega__item--purchase .mega__item-name{color:var(--gold-soft)}
.footer-buy{margin-top:-2px;color:var(--cream)}

.buy-hero__grid{align-items:center}
.buy-hero__aside{
  align-self:center;
  padding:clamp(22px,3vw,34px);
  border:1px solid rgba(255,215,154,.22);
  border-radius:var(--r-xl);
  background:linear-gradient(145deg,rgba(255,247,231,.075),rgba(75,0,18,.30));
  box-shadow:0 26px 70px rgba(25,0,6,.24),inset 0 1px rgba(255,255,255,.08);
}
.buy-hero__aside > span{display:block;color:var(--gold);font-size:.75rem;letter-spacing:.16em}
.buy-hero__aside ol{margin:var(--s-5) 0;padding-left:1.35rem;display:grid;gap:var(--s-3);color:var(--cream);font-weight:600}
.buy-hero__aside li::marker{color:var(--orange)}
.buy-hero__aside p{margin:0;color:var(--text-inv-soft);font-size:.875rem}

.buy-renew-choice{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--s-4);
  margin-bottom:var(--s-6);
}
.buy-renew-choice__card{
  display:grid;
  gap:7px;
  min-height:154px;
  padding:clamp(20px,3vw,30px);
  border:1px solid var(--line-2);
  border-radius:var(--r-xl);
  color:var(--wine-950);
  background:var(--surface);
  box-shadow:var(--shadow-sm);
  text-decoration:none;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.buy-renew-choice__card:hover{transform:translateY(-2px);border-color:rgba(164,7,41,.35);box-shadow:var(--shadow-md)}
.buy-renew-choice__card.is-selected{border-color:var(--wine-600);background:linear-gradient(145deg,#fff,rgba(255,173,24,.10));box-shadow:0 0 0 3px rgba(164,7,41,.08),var(--shadow-md)}
.buy-renew-choice__card .mono{color:var(--orange-700);font-size:.72rem;letter-spacing:.14em}
.buy-renew-choice__card strong{font-family:var(--ff-display);font-size:clamp(1.35rem,1.1rem + .65vw,1.75rem);letter-spacing:-.025em}
.buy-renew-choice__card small{max-width:42ch;color:var(--text-muted);font-size:.875rem;line-height:1.55}

.buy-form-card{padding:clamp(22px,4vw,52px)}
.buy-form-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--s-5)}
.buy-form-heading .eyebrow{margin-bottom:var(--s-2)}
.buy-invite-badge{
  flex:none;
  padding:8px 12px;
  border:1px solid rgba(164,7,41,.18);
  border-radius:999px;
  background:rgba(255,173,24,.10);
  color:var(--wine-700);
  font-size:.75rem;
  font-weight:700;
}
.buy-form{gap:0}
.renewal-form .buy-safety-note{border-color:rgba(21,128,87,.25);background:#effaf5}
.buy-form-section{
  min-width:0;
  margin:0;
  padding:var(--s-8) 0;
  border:0;
  border-bottom:1px solid var(--line-2);
}
.buy-form-section:first-of-type{padding-top:0}
.buy-form-section legend{
  display:flex;
  align-items:center;
  gap:var(--s-3);
  width:100%;
  padding:0;
  color:var(--wine-900);
  font-family:var(--ff-display);
  font-size:clamp(1.25rem,1.1rem + .45vw,1.55rem);
  font-weight:750;
  letter-spacing:-.025em;
}
.buy-form-section legend span{
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border-radius:10px;
  background:linear-gradient(145deg,var(--gold-soft),var(--orange));
  color:var(--wine-950);
  font-family:var(--ff-mono);
  font-size:.72rem;
  letter-spacing:.08em;
  box-shadow:0 8px 22px rgba(255,114,0,.18);
}
.buy-form-section > p{margin:var(--s-3) 0 var(--s-6);color:var(--text-muted);line-height:1.58}
.buy-form-section .form-grid{gap:var(--s-5) var(--s-6)}
.optional-mark{margin-left:.35em;color:var(--text-muted);font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.06em}
.field-check{display:flex;align-items:center;gap:8px;margin-top:2px;color:var(--text-muted);font-size:.8125rem;cursor:pointer}
.phone-prefix-control{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:stretch;
  border:1px solid var(--line-2);
  border-radius:var(--radius-sm);
  background:var(--surface);
  overflow:hidden;
  transition:border-color .18s ease,box-shadow .18s ease;
}
.phone-prefix-control:focus-within{border-color:var(--wine-500);box-shadow:0 0 0 3px rgba(128,0,32,.1)}
.phone-prefix-control > span{display:flex;align-items:center;padding:0 14px;border-right:1px solid var(--line-2);background:var(--surface-3);color:var(--text);font-weight:700;letter-spacing:.02em}
.phone-prefix-control .input{border:0;border-radius:0;box-shadow:none!important}
.has-error .phone-prefix-control{border-color:var(--wine-700)}
.field-check input{width:18px;height:18px;accent-color:var(--wine-700)}
[data-organization-identity-field][hidden]{display:none}
[data-public-portals-choice][hidden],[data-mobile-apps-choice][hidden]{display:none!important}
.input--uppercase{text-transform:uppercase}
.textarea--compact{min-height:108px}
.locked-choice{
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-height:72px;
  padding:13px 15px;
  border:1px solid rgba(164,7,41,.18);
  border-radius:var(--r-md);
  background:linear-gradient(145deg,rgba(255,173,24,.10),rgba(255,247,231,.78));
}
.locked-choice strong{color:var(--wine-800);font-size:1.0625rem}
.locked-choice span{color:var(--text-muted);font-size:.8rem}
.buy-copy-contact{margin:var(--s-4) 0 var(--s-5);min-height:auto;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface-2)}
.buy-safety-note{
  margin:var(--s-8) 0 var(--s-6);
  padding:var(--s-5);
  border:1px solid rgba(164,7,41,.20);
  border-left:4px solid var(--orange);
  border-radius:var(--r-md);
  background:rgba(255,173,24,.075);
}
.buy-safety-note strong{color:var(--wine-800)}
.buy-safety-note p{margin:6px 0 0;color:var(--text-soft);font-size:.9rem;line-height:1.55}
.buy-consent{padding:var(--s-5);border:1px solid var(--line);border-radius:var(--r-md);background:rgba(255,253,249,.68)}
.buy-consent.has-error{border-color:var(--wine-600);background:rgba(143,16,34,.055)}
.buy-consent .checkbox{min-height:auto}
.buy-submit-row{justify-content:space-between;margin-top:var(--s-7)}
.buy-submit-row > p{max-width:250px;margin:0;color:var(--text-muted);font-size:.75rem;line-height:1.45;text-align:right}
.buy-error-summary{margin-bottom:var(--s-7)}
.buy-error-summary strong{display:block;margin-bottom:var(--s-2)}
.buy-error-summary ul{margin:0;padding-left:1.15rem;display:grid;gap:4px}
.buy-otp{
  display:grid;
  grid-template-columns:64px minmax(0,1fr);
  gap:var(--s-5);
  padding-top:var(--s-2);
}
.buy-otp__icon{
  display:grid;
  place-items:center;
  width:58px;
  height:58px;
  border:1px solid rgba(164,7,41,.18);
  border-radius:18px;
  color:var(--wine-700);
  background:linear-gradient(145deg,#fff7e7,#f8e4df);
  box-shadow:var(--shadow-sm);
}
.buy-otp__icon svg{width:29px;height:29px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.buy-otp__intro{align-self:center}
.buy-otp__intro .mono{color:var(--orange-700);font-size:.72rem;letter-spacing:.14em}
.buy-otp__intro h3{margin:6px 0 7px;color:var(--wine-950);font-family:var(--ff-display);font-size:clamp(1.4rem,1.1rem + .8vw,1.9rem);letter-spacing:-.025em}
.buy-otp__intro p{max-width:62ch;margin:0;color:var(--text-soft);line-height:1.6}
.buy-otp__alert,.buy-otp__form,.buy-otp__secondary{grid-column:1/-1}
.buy-otp__alert{margin:var(--s-3) 0 0}
.buy-otp__alert ul{margin:8px 0 0;padding-left:1.2rem}
.buy-otp__form{margin-top:var(--s-3);padding:clamp(20px,3vw,30px);border:1px solid var(--line-2);border-radius:var(--r-lg);background:linear-gradient(145deg,#fff,rgba(255,173,24,.055))}
.buy-otp__entry{display:grid;grid-template-columns:minmax(180px,.55fr) minmax(250px,1fr);gap:var(--s-3);align-items:stretch;margin-top:9px}
.buy-otp__input{height:56px;font-family:var(--ff-mono);font-size:1.45rem;font-weight:800;letter-spacing:.28em;text-align:center;font-variant-numeric:tabular-nums}
.buy-otp__entry .button{min-height:56px}
.buy-otp__secondary{display:flex;flex-wrap:wrap;gap:var(--s-3);align-items:center}
.buy-otp__secondary form{margin:0}
.buy-next-steps{list-style:none;margin:var(--s-6) 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-3)}
.buy-next-steps li{display:flex;flex-direction:column;gap:5px;padding:var(--s-4);border:1px solid rgba(255,215,154,.18);border-radius:var(--r-md);background:rgba(255,247,231,.055)}
.buy-next-steps strong{color:var(--gold-soft)}
.buy-next-steps span{color:var(--text-inv-soft);font-size:.8125rem;line-height:1.45}

@media (max-width:639px){
  .buy-renew-choice{grid-template-columns:1fr}
  .buy-renew-choice__card{min-height:0}
  .buy-form-heading{flex-direction:column}
  .buy-invite-badge{align-self:flex-start}
  .buy-form-section{padding-block:var(--s-7)}
  .buy-form-section legend{font-size:1.25rem}
  .buy-submit-row > p{max-width:none;text-align:left}
  .buy-next-steps{grid-template-columns:1fr}
  .buy-otp{grid-template-columns:50px minmax(0,1fr);gap:var(--s-4)}
  .buy-otp__icon{width:48px;height:48px;border-radius:14px}
  .buy-otp__entry{grid-template-columns:1fr}
  .buy-otp__secondary{align-items:stretch}
  .buy-otp__secondary form,.buy-otp__secondary .button{width:100%}
}

@media (min-width:1180px){.hero__grid{grid-template-columns:minmax(0,.94fr) minmax(560px,1.06fr);gap:clamp(40px,4vw,64px)}}
@media (min-width:1180px){.page-home .mock--dashboard{--mock-rail-w:clamp(140px,11vw,168px)}}
@media (prefers-reduced-motion:no-preference){
  @keyframes future-float{0%,100%{transform:rotateY(-3.5deg) rotateX(1deg) translateY(0)}50%{transform:rotateY(-2deg) rotateX(.4deg) translateY(-9px)}}
  @keyframes future-pulse{0%,100%{opacity:.72;box-shadow:0 0 0 4px rgba(255,138,0,.10),0 0 12px var(--orange)}50%{opacity:1;box-shadow:0 0 0 7px rgba(255,138,0,.055),0 0 24px var(--orange)}}
}

/* ============================================================================
   25 — RESPONSIVE
   ========================================================================= */

/* ── ≥1360px ──────────────────────────────────────────────── */
@media (min-width:1360px){
  .container--wide{max-width:var(--cw-wide)}
}

/* ── ≥1024px ──────────────────────────────────────────────── */
@media (min-width:1024px){
  .hide-lg{display:none!important}
}

/* ── 1024–1179px ──────────────────────────────────────────── */
@media (max-width:1179px){
  .nav-link{padding:10px 10px;font-size:.9063rem}
  .nav-panel{width:min(94vw,760px);padding:var(--s-5)}
  .mega{gap:var(--s-4)}
  .mega__col + .mega__col{padding-left:var(--s-4)}
  .grid--4{grid-template-columns:repeat(3,minmax(0,1fr))}
  .hero__grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
  .page-hero__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer-top{grid-template-columns:1.4fr 1fr 1fr 1fr;gap:var(--s-8) var(--s-6)}
}

@media (min-width:1024px) and (max-width:1179px){
  .page-home .mock--dashboard{--mock-rail-w:0px}
  .page-home .mock--dashboard .mock__rail{display:none}
}

/* ── <1024px — primary navigation breakpoint ──────────────── */
@media (max-width:1023px){
  .utility-bar{display:none}
  .hero__visual .mock{animation:none;transform:none}
  .bento__cell,.bento__cell--anchor{min-height:auto}
  .site-header.scrolled{
    -webkit-backdrop-filter:none;
    backdrop-filter:none;
    background:var(--wine-950);
  }
  .anchor-nav{-webkit-backdrop-filter:none;backdrop-filter:none;background:var(--paper)}

  .header-inner{grid-template-columns:auto 1fr auto;gap:var(--s-3)}
  .nav-toggle{display:flex;order:3}
  .header-actions{order:2;justify-self:end;gap:var(--s-2)}
  .header-actions .button-primary{display:none}

  .main-nav{
    position:fixed;
    left:0;right:0;
    top:var(--header-h);
    height:calc(100dvh - var(--header-h));
    z-index:var(--z-mobile-nav);
    display:none;
    flex-direction:column;
    align-items:stretch;
    justify-content:flex-start;
    gap:0;
    padding:var(--s-5) var(--gutter) var(--s-11);
    background:var(--wine-950);
    border-top:1px solid var(--line-inv);
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
  }
  .main-nav.open{display:flex}

  .nav-link{
    min-height:56px;
    padding:14px 4px;
    font-size:1.0625rem;
    border-radius:0;
    border-bottom:1px solid var(--line-inv-2);
    color:var(--on-wine);
    justify-content:flex-start;
  }
  .nav-link::after{content:none}
  .nav-link.is-active{color:var(--gold)}
  .nav-caret{display:none}

  .nav-group{position:static}
  .nav-panel{
    position:static;
    transform:none;
    width:auto;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    padding:var(--s-4) 0 var(--s-5);
    border:0;
    border-bottom:1px solid var(--line-inv-2);
    border-radius:0;
    background:transparent;
    box-shadow:none;
    transition:none;
  }
  .nav-group:hover .nav-panel,
  .nav-group.is-open .nav-panel{transform:none}
  .mega{grid-template-columns:1fr;gap:var(--s-5)}
  .mega__col + .mega__col{padding-left:0;border-left:0;padding-top:var(--s-4);border-top:1px solid var(--line-inv-2)}
  .mega__item{min-height:56px;padding:10px 4px}
  .mega__foot{margin-top:var(--s-4)}

  .main-nav__actions{
    display:flex;
    flex-direction:column;
    gap:var(--s-3);
    margin-top:var(--s-7);
  }

  .hero--home{min-height:auto;padding-block:var(--band-y)}
  .hero__grid,.page-hero__grid{grid-template-columns:1fr;gap:var(--s-8)}
  .hero__copy{order:1}
  .hero__visual{order:2}

  .feature-row{grid-template-columns:1fr;gap:var(--s-7)}
  .feature-row--reverse .feature-row__copy,
  .feature-row--reverse .feature-row__visual{order:0}
  .feature-row + .feature-row{margin-top:var(--s-9)}

  .bento{grid-template-columns:repeat(4,1fr);gap:var(--s-4)}
  .bento__cell{grid-column:span 2}
  .bento__cell--anchor{grid-column:span 4;grid-row:auto;padding:var(--s-6)}
  .bento__cell--wide{grid-column:span 4}
  .bento__cell--half{grid-column:span 2}
  .bento__cell--third{grid-column:span 2}
  .bento__cell--tall{grid-row:auto}

  .cta-band__inner,
  .cta-band:not(.cta-band--form) .cta-band__inner{grid-template-columns:1fr;gap:var(--s-8)}
  .section-head--split{grid-template-columns:1fr;gap:var(--s-5)}
  .grid{gap:var(--s-4)}
}

/* ── <860px ───────────────────────────────────────────────── */
@media (max-width:859px){
  .grid--3,.quote-grid,.quote-grid.grid--3,.download-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid--products{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid--products > *{grid-column:auto}
  .module-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .migration__steps{grid-template-columns:repeat(2,minmax(0,1fr))}

  .version-options{grid-template-columns:1fr}
  .migration__arrow{max-width:220px;transform:rotate(90deg)}

  .compare-table__row-label,.compare-table tbody th{
    position:sticky;
    left:0;
    z-index:1;
    background:var(--surface);
  }
  .band--wine .compare-table__row-label,.band--deep .compare-table__row-label,
  .band--wine .compare-table tbody th,.band--deep .compare-table tbody th{background:var(--wine-900)}

  .trust-strip{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hide-sm{display:none!important}

  .steps--4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer-top{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* ── <640px ───────────────────────────────────────────────── */
@media (max-width:639px){
  :root{--header-h:var(--header-h-sm)}

  .brand-mark,.brand-mark img{width:44px;height:44px}
  .hero__title{font-size:clamp(2.4rem,12vw,3rem);line-height:1.02;letter-spacing:-.045em}
  .section-title{max-width:none}
  .hero__proof{gap:9px 14px}

  .grid--2,.grid--3,.grid--4,.grid--products,.grid--auto,
  .quote-grid,.quote-grid.grid--2,.quote-grid.grid--3,
  .download-grid,.role-cards,.module-grid,.steps--4,
  .migration__steps,.form-grid{grid-template-columns:1fr}

  .grid,.bento{gap:var(--s-3)}

  .bento{grid-template-columns:1fr}
  .bento__cell,
  .bento__cell--anchor,
  .bento__cell--wide,
  .bento__cell--half,
  .bento__cell--third{grid-column:auto;grid-row:auto}
  .bento__cell--anchor{padding:var(--s-5);border-radius:var(--r-lg)}

  .trust-strip{grid-template-columns:repeat(2,minmax(0,1fr))}

  /* Steps become a vertical timeline with the rule on the left. */
  .steps{gap:var(--s-7)}
  .step{padding-top:0;padding-left:60px;min-height:44px}
  .step__num{top:0;left:0}
  .timeline__line{
    top:22px;bottom:22px;
    left:22px;right:auto;
    width:1px;height:auto;
    background:linear-gradient(180deg,transparent,rgba(112,8,23,.26),transparent);
  }
  .band--wine .timeline__line,.band--deep .timeline__line{
    background:linear-gradient(180deg,transparent,rgba(255,195,90,.42),transparent);
  }

  .hero__actions .button,
  .form-actions .button,
  .cta-band__actions .button,
  .success-card__actions .button{width:100%}
  .form-actions{flex-direction:column;align-items:stretch}

  .mock{--mock-rail-w:56px}
  .mock__rail{padding:var(--s-2)}
  .mock__rail-item{justify-content:center;padding:8px 0;font-size:0}
  .mock__rail-item::before{width:16px;height:16px}

  .cta-band__form{padding:var(--s-5)}
  .utility-bar__inner{justify-content:flex-start}
  .faq__a{padding-right:0}
  .catalog-document{padding:var(--s-5)}
}

/* Collapse the three-card KPI row before its currency values become cramped. */
@media (max-width:519px){
  .mock__kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mock__kpis > .kpi:nth-child(3){display:none}
}

/* ── <420px ───────────────────────────────────────────────── */
@media (max-width:419px){
  :root{--gutter:16px}
  .mock{--mock-rail-w:0px}
  .mock__rail{display:none}
  .kpi__value{font-size:1.0625rem}
  .breadcrumb__item:first-child{display:none}
  .footer-top{grid-template-columns:1fr;gap:var(--s-7)}
  .brand-name small{display:none}
  .trust-strip{grid-template-columns:1fr}
}


/* Current School ERP screens ------------------------------------------------ */
.erp-screen{margin:0;overflow:hidden;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:var(--sh-2)}
.erp-screen img{display:block;width:100%;height:auto;aspect-ratio:1168/688;object-fit:cover;object-position:top left;background:#f8f3f0}
.erp-screen figcaption{padding:10px 14px;border-top:1px solid var(--line);color:var(--text-muted);background:var(--surface);font-size:.72rem;font-weight:700;letter-spacing:.02em}
.band--wine .erp-screen{border-color:rgba(255,215,154,.28);box-shadow:0 28px 70px rgba(23,0,6,.34)}
.band--wine .erp-screen figcaption{color:rgba(255,255,255,.78);border-color:rgba(255,255,255,.14);background:rgba(36,0,9,.9)}
.erp-screen--hero{transform:rotateY(-2.5deg) rotateX(1deg);transform-origin:center left}
.erp-screen--feature{border-radius:16px}
.school-screen-section{border-block:1px solid var(--line)}
.erp-screen-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-6)}
.erp-screen-card{overflow:hidden;border:1px solid var(--line);border-radius:22px;background:var(--surface);box-shadow:var(--sh-1)}
.erp-screen-card .erp-screen{border:0;border-radius:0;box-shadow:none}
.erp-screen-card__copy{padding:var(--s-5)}
.erp-screen-card__copy h3{margin:0 0 var(--s-2);font-size:clamp(1.12rem,1.8vw,1.45rem);line-height:1.18}
.erp-screen-card__copy p{margin:0 0 var(--s-4);color:var(--text-muted);line-height:1.65}
.erp-feature-list{display:grid;gap:9px;margin:0;padding:0;list-style:none}
.erp-feature-list li{position:relative;padding-left:20px;color:var(--text-soft);font-size:.88rem;line-height:1.5}
.erp-feature-list li::before{content:"";position:absolute;left:0;top:.52em;width:8px;height:8px;border-radius:50%;background:var(--accent)}
@media(max-width:900px){.erp-screen-grid{grid-template-columns:1fr}.erp-screen--hero{transform:none}}

/* v3.5.31 — one themed rounded disclosure surface for every public FAQ. */
.faq{
  display:grid;
  gap:var(--s-3);
  border-top:0;
}
.faq__item{
  overflow:hidden;
  margin:0;
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  background:rgba(255,253,249,.82);
  box-shadow:0 8px 26px rgba(67,0,16,.055);
}
.faq__q{
  min-height:60px;
  padding:var(--s-4) var(--s-5);
  border-radius:inherit;
}
.faq__q:hover{background:var(--surface-2)}
.faq__item[open] .faq__q{
  border-bottom:1px solid var(--line-2);
  border-radius:var(--r-lg) var(--r-lg) 0 0;
  background:var(--surface-2);
}
.faq__a{
  max-width:none;
  padding:var(--s-5);
}
@media(max-width:639px){
  .faq__item{border-radius:var(--r-md)}
  .faq__q{padding:var(--s-4)}
  .faq__item[open] .faq__q{border-radius:var(--r-md) var(--r-md) 0 0}
  .faq__a{padding:var(--s-4)}
}


/* ============================================================================
   26 — PRINT
   ========================================================================= */

@media print{
  .utility-bar,
  .site-header,
  .site-footer,
  .cta-band,
  .button,
  .catalog-links,
  .anchor-nav,
  .skip-link,
  .site-flash,
  .no-print,
  .nav-panel,
  .band__glow{display:none!important}

  .band--mesh::after,
  .band--grid::before{display:none!important;content:none!important}

  html,body{background:#fff!important;color:#000!important;font-size:11pt}

  .band{
    background:#fff!important;
    color:#000!important;
    padding:0!important;
  }
  .band--wine,.band--deep{
    background:#fff!important;
    color:#000!important;
    --text:#000;--text-soft:#000;--text-muted:#333;
    --line:#bbb;--line-2:#ddd;--line-strong:#888;
  }

  .container,.container--wide,.container--narrow,.container--prose{
    max-width:none!important;
    padding:0!important;
  }

  .card,.product-card,.bento__cell,.download-card,
  .quote-card,.version-option,.form-card,.catalog-document,.mock{
    box-shadow:none!important;
    border:1px solid #bbb!important;
    background:#fff!important;
    color:#000!important;
    break-inside:avoid;
    page-break-inside:avoid;
  }

  .catalog-document{break-inside:avoid;page-break-inside:avoid;padding:0!important;border:0!important}
  .catalog-document + .catalog-document{page-break-before:always;margin-top:0}

  .print-only{display:block!important}

  /* All disclosures expanded on paper. */
  .faq__item{display:block!important}
  .faq__a{display:block!important}
  .faq__marker{display:none!important}

  /* Reveal animations must never hide printed content. */
  .js [data-reveal],
  .js [data-reveal].reveal-stagger > *{opacity:1!important;transform:none!important}

  .scroll-x{overflow:visible!important}
  .compare-table{min-width:0!important;font-size:9.5pt}

  a[href]::after{content:""}
  h1,h2,h3,h4{page-break-after:avoid;color:#000!important}
  p,li{orphans:3;widows:3}
}

/* v3.5.26 — canonical transparent logo placement. The master artwork already
   contains its safe area, so product marks must not be clipped or boxed. */
.site-header .brand-mark,
.site-footer .brand-mark{display:grid;place-items:center;flex:0 0 auto;border:0;border-radius:0;background:transparent;box-shadow:none;overflow:visible}
.site-header .brand-mark img,
.site-footer .brand-mark img,
.product-card__logo,
.product-page__logo{display:block;max-width:100%;object-fit:contain;object-position:center;border:0;background:transparent}
.site-footer .brand-mark,.site-footer .brand-mark img{width:48px;height:48px}
@media(max-width:639px){
  .site-header .brand-mark,.site-header .brand-mark img{width:48px;height:48px}
  .site-footer .brand-mark,.site-footer .brand-mark img{width:44px;height:44px}
}

/* v3.5.31 - direct-download catalogue cards; no long catalogue preview. */
.catalogue-download-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-5)}
.catalogue-download-card{display:flex;min-width:0;min-height:100%;flex-direction:column;gap:var(--s-4);padding:var(--s-5);overflow:hidden;border:1px solid rgba(105,0,25,.14);border-radius:var(--r-xl);background:linear-gradient(150deg,rgba(255,253,249,.98),rgba(255,245,228,.80));box-shadow:var(--sh-sm),inset 0 1px rgba(255,255,255,.96)}
.catalogue-download-card__top{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s-4);padding-bottom:var(--s-4);border-bottom:1px solid var(--line-2)}
.catalogue-download-card__logo{display:grid;width:92px;height:92px;place-items:center;overflow:hidden;border-radius:24px;background:var(--surface-2)}
.catalogue-download-card__logo img{display:block;width:100%;height:100%;object-fit:contain;border-radius:inherit}
.catalogue-download-card__status{display:flex;flex-direction:column;align-items:flex-end;gap:9px}
.catalogue-download-card__number{font-family:var(--ff-mono);font-size:.74rem;font-weight:800;letter-spacing:.14em;color:var(--pa-ink)}
.catalogue-download-card__copy{display:flex;flex:1;flex-direction:column;align-items:flex-start;gap:10px}
.catalogue-download-card__labels{display:flex;width:100%;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.catalogue-download-card__availability{display:inline-flex;align-items:center;min-height:28px;padding:5px 10px;border-radius:999px;font-size:.72rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.catalogue-download-card__availability.is-available{color:#0b734f;background:#e5f5ee;border:1px solid #b8e1d1}
.catalogue-download-card__availability.is-coming{color:#7b071d;background:#faedf0;border:1px solid #ecc8d1}
.catalogue-download-card__copy h2,.catalogue-download-card__copy h3{margin:0;font-size:clamp(1.25rem,2vw,1.65rem);line-height:1.16}
.catalogue-download-card__copy p{margin:0;color:var(--muted);line-height:1.65}
.catalogue-download-card__copy small{margin-top:auto;color:var(--muted);font-weight:700}
.catalogue-download-card__features{display:grid;gap:8px;width:100%;margin:4px 0 0;padding:0;list-style:none}
.catalogue-download-card__features li{position:relative;padding-left:23px;color:var(--ink-soft);font-size:.88rem;line-height:1.45}
.catalogue-download-card__features li::before{content:"";position:absolute;left:0;top:.22em;width:15px;height:15px;background-image:var(--tick);background-repeat:no-repeat;background-size:15px 15px}
.catalogue-download-card__file{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:12px 0;border-top:1px solid var(--line-2);color:var(--muted);font-size:.76rem;font-weight:700}
.catalogue-download-card__button{width:100%;justify-content:center}
@media(max-width:980px){.catalogue-download-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.catalogue-download-grid{grid-template-columns:1fr}.catalogue-download-card{padding:var(--s-4)}.catalogue-download-card__logo{width:78px;height:78px;border-radius:20px}.web-hero-panel__grid{grid-template-columns:1fr}}

/* v3.5.33 - align the JPRAXC Web mark to the visible dimensions of the other product logos. */