/* ============================================================
   Bibnor — accessibility view
   A floating panel (built by assets/a11y.js) toggles classes on
   <html>. Each mode below is independent and can be combined.
   Preferences are saved on the visitor's device.
   ============================================================ */

/* ---------- skip link (always available) ---------- */
.skip{
  position:fixed; left:16px; top:12px; z-index:200;
  padding:12px 18px; border-radius:12px;
  background:var(--pm-green,#1F3D2E); color:#fff;
  font:600 14px/1 var(--font-display,system-ui); text-decoration:none;
  transform:translateY(-160%); transition:transform .25s ease;
}
.skip:focus{ transform:none; outline:3px solid var(--pm-amber,#E8A33D); outline-offset:3px; }
main:focus{ outline:none; }

/* ---------- launcher ---------- */
.ax-btn{
  position:fixed; right:20px; bottom:20px; z-index:90;
  width:54px; height:54px; border-radius:50%; padding:0; cursor:pointer;
  display:grid; place-items:center;
  color:#fff; background:var(--pm-green,#1F3D2E);
  border:0; box-shadow:0 10px 24px -10px rgba(23,42,33,.6), 0 0 0 3px #FAF8F4;
  transition:transform .3s cubic-bezier(.16,1,.3,1), box-shadow .3s;
}
.ax-btn:hover{ transform:scale(1.06); }
.ax-btn:focus-visible{ outline:3px solid var(--pm-amber,#E8A33D); outline-offset:3px; }
.ax-btn svg{ width:28px; height:28px; }
.ax-btn[aria-expanded="true"]{ transform:rotate(-12deg) scale(1.02); }
.ax-dot{
  position:absolute; top:2px; right:2px; width:12px; height:12px; border-radius:50%;
  background:var(--pm-amber,#E8A33D); box-shadow:0 0 0 2px #fff; display:none;
}
.ax-btn.active .ax-dot{ display:block; }

/* ---------- panel ---------- */
.ax-panel{
  position:fixed; right:20px; bottom:86px; z-index:91;
  width:min(372px, calc(100vw - 32px)); max-height:calc(100svh - 120px); overflow:auto;
  padding:20px; border-radius:22px;
  background:#fff; color:var(--pm-text,#172A21);
  border:1px solid var(--pm-hair-2,#D5CEBF);
  box-shadow:0 24px 60px -24px rgba(23,42,33,.4);
  font-family:var(--font-display,system-ui); font-size:14px; line-height:1.45;
  opacity:0; visibility:hidden; transform:translateY(10px) scale(.98); transform-origin:100% 100%;
  transition:opacity .25s cubic-bezier(.16,1,.3,1), transform .3s cubic-bezier(.16,1,.3,1), visibility .25s;
}
.ax-panel.open{ opacity:1; visibility:visible; transform:none; }
.ax-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:16px; }
.ax-head h2{ margin:0; font-size:17px; font-weight:700; letter-spacing:-.02em; }
.ax-head p{ margin:4px 0 0; font-size:13px; color:var(--pm-muted,#56655D); }
.ax-x{
  flex:none; width:34px; height:34px; border-radius:10px; cursor:pointer;
  display:grid; place-items:center; color:var(--pm-muted,#56655D);
  background:#fff; border:1px solid var(--pm-hair-2,#D5CEBF);
}
.ax-x:hover{ color:var(--pm-text,#172A21); background:var(--pm-bg,#FAF8F4); }
.ax-x svg{ width:16px; height:16px; }
.ax-label{ margin:0 0 8px; font-size:13px; font-weight:600; color:var(--pm-text,#172A21); }
.ax-seg{
  display:grid; grid-template-columns:repeat(3,1fr); gap:4px; padding:4px; margin-bottom:16px;
  border-radius:10px; background:var(--pm-bg-2,#F2EFE7); border:0;
}
.ax-seg button{
  height:38px; border:0; border-radius:9px; cursor:pointer; background:transparent;
  color:var(--pm-muted,#56655D); font:600 13px var(--font-display,system-ui);
}
.ax-seg button span{ font-size:1.15em; }
.ax-seg button:nth-child(2) span{ font-size:1.3em; }
.ax-seg button:nth-child(3) span{ font-size:1.5em; }
.ax-seg button[aria-checked="true"]{ background:#fff; color:var(--pm-text,#172A21); box-shadow:0 1px 3px rgba(23,42,33,.15); }
.ax-seg button:focus-visible, .ax-row:focus-visible, .ax-reset:focus-visible, .ax-x:focus-visible{ outline:2px solid var(--pm-green-2,#2E6B4E); outline-offset:2px; }
.ax-list{ display:grid; gap:6px; }
.ax-row{
  display:flex; align-items:center; gap:12px; width:100%; text-align:left; cursor:pointer;
  padding:11px 12px; border-radius:13px; color:inherit; font:inherit;
  background:#fff; border:1px solid var(--pm-hair,#E6E1D6);
  transition:background .2s, border-color .2s;
}
.ax-row:hover{ background:var(--pm-bg,#FAF8F4); }
.ax-row[aria-checked="true"]{ background:var(--pm-green-bg,#E8F2EC); border-color:#A9CBB6; }
.ax-ic{
  flex:none; width:34px; height:34px; border-radius:10px; display:grid; place-items:center;
  background:var(--pm-bg-2,#F2EFE7); color:var(--pm-green,#1F3D2E);
}
.ax-ic svg{ width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.ax-txt{ flex:1; min-width:0; }
.ax-txt b{ display:block; font-size:14px; font-weight:600; }
.ax-txt small{ display:block; font-size:12.5px; color:var(--pm-muted,#56655D); margin-top:1px; }
.ax-sw{
  flex:none; position:relative; width:40px; height:24px; border-radius:999px;
  background:var(--pm-control-border,#928B7E); transition:background .2s;   /* off state: 3.4:1 against the panel */
}
.ax-sw::after{
  content:""; position:absolute; top:3px; left:3px; width:18px; height:18px; border-radius:50%;
  background:#fff; transition:transform .2s cubic-bezier(.16,1,.3,1);
}
.ax-row[aria-checked="true"] .ax-sw{ background:var(--pm-green-2,#2E6B4E); }
.ax-row[aria-checked="true"] .ax-sw::after{ transform:translateX(16px); }
.ax-foot{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:16px; padding-top:14px; border-top:1px solid var(--pm-hair,#E6E1D6); }
.ax-foot p{ margin:0; font-size:13px; color:var(--pm-muted,#56655D); }
.ax-foot a{ color:var(--pm-green-2,#2E6B4E); }
.ax-reset{
  flex:none; height:34px; padding:0 14px; border-radius:10px; cursor:pointer;
  font:600 13px var(--font-display,system-ui); color:var(--pm-text,#172A21);
  background:#fff; border:1px solid var(--pm-hair-2,#D5CEBF);
}
.ax-reset:hover{ border-color:var(--pm-text,#172A21); }
@media (max-width:640px){
  /* on phones the button sits bottom-left, beside the sticky "Book a demo" bar */
  .ax-btn{ left:12px; right:auto; bottom:calc(12px + env(safe-area-inset-bottom)); width:48px; height:48px; }
  .ax-btn svg{ width:26px; height:26px; }
  .ax-panel{ right:12px; left:12px; bottom:calc(72px + env(safe-area-inset-bottom)); width:auto;
    max-height:calc(100svh - 96px); border-radius:18px; transform-origin:0 100%; }
}
html.pm-menu-open .ax-btn{ display:none; }

/* ============================================================
   MODES
   ============================================================ */

/* ---------- 1. larger text (whole-page zoom keeps layouts intact) ---------- */
html.a11y-text-1 body{ zoom:1.14; }
html.a11y-text-2 body{ zoom:1.3; }
/* keep the panel itself at a predictable size */
html.a11y-text-1 .ax-panel, html.a11y-text-1 .ax-btn{ zoom:calc(1 / 1.14); }
html.a11y-text-2 .ax-panel, html.a11y-text-2 .ax-btn{ zoom:calc(1 / 1.3); }

/* ---------- 2. high contrast: black on white, solid borders ---------- */
html.a11y-contrast{
  --pm-bg:#FFFFFF; --pm-bg-2:#FFFFFF; --pm-card:#FFFFFF;
  --pm-text:#000000; --pm-body:#000000; --pm-muted:#1A1A1A; --pm-faint:#2B2B2B;
  --pm-hair:#000000; --pm-hair-2:#000000;
  --pm-green:#0B3D24; --pm-green-2:#0B3D24; --pm-amber-ink:#5A3300;
  --paper:#fff; --ink:#000; --ink-soft:#000; --ink-faint:#1A1A1A; --line:#000;
}
html.a11y-contrast, html.a11y-contrast body{ background:#fff !important; }
html.a11y-contrast .board-scrim{ background:#fff !important; }
html.a11y-contrast #field{ display:none !important; }
html.a11y-contrast .pm-band{ background:#fff !important; box-shadow:none !important; border-block:2px solid #000; }
html.a11y-contrast :is(.pm-card,.ui,.app,.app-card,.app-kpis > div,.ct-form,.cmp,.ui-box,.int-tile,.phone-in,.ph-row,.ph-kid,
  .toast-card,.mega,.ax-panel,.ax-row,.lg-glance,.lg-short,.lg-contact,.lg-toc-help,.sec-badges span,.card,.f-chips span,.lg-switch,.mod .mi){
  background:#fff !important; border:2px solid #000 !important; box-shadow:none !important;
}
html.a11y-contrast :is(small,.pm-sub,.board-lede,p,.pt-list li,.int-list li){ color:#000 !important; }
html.a11y-contrast .pm-btn-primary, html.a11y-contrast .ui-btn:not(.ghost), html.a11y-contrast .ax-btn{ background:#000 !important; color:#fff !important; }
html.a11y-contrast input, html.a11y-contrast select, html.a11y-contrast textarea{ background:#fff !important; border:2px solid #000 !important; color:#000 !important; }
html.a11y-contrast ::placeholder{ color:#444 !important; }
/* dark blocks (hero, footer) become pure black with white text */
html.a11y-contrast{ --pm-deep:#000; --pm-on-deep:#fff; }
html.a11y-contrast :is(.board.hv2,.site-foot){ background:#000 !important; }
html.a11y-contrast :is(.board.hv2 .board-copy,.site-foot) :is(p,small,a,h2,h4,b,.board-lede,.foot-note){ color:#fff !important; }
html.a11y-contrast :is(.board.hv2,.site-foot) .pm-btn-primary{ background:#fff !important; color:#000 !important; }
html.a11y-contrast :is(.board.hv2,.site-foot) .pm-btn-ghost{ background:#000 !important; color:#fff !important; border:2px solid #fff !important; }
html.a11y-contrast .m-cta{ background:#000 !important; color:#fff !important; outline:2px solid #fff; }
/* the campus scene stays a dark band: make it pure black with white text */
html.a11y-contrast #campus{ --pm-bg:#000; --pm-text:#fff; --pm-muted:#fff; --pm-faint:#fff; --pm-hair:#fff; background:#000 !important; }

/* ---------- 3. reduce motion ---------- */
html.a11y-motion *, html.a11y-motion *::before, html.a11y-motion *::after{
  animation-duration:.001ms !important; animation-iteration-count:1 !important; animation-delay:0s !important;
  transition-duration:.001ms !important; transition-delay:0s !important; scroll-behavior:auto !important;
}
html.a11y-motion{ scroll-behavior:auto !important; }
html.a11y-motion #field, html.a11y-motion .pm-orb{ display:none !important; }
html.a11y-motion .app{ transform:none !important; }
html.a11y-motion .pm-card:hover, html.a11y-motion .mini:hover{ transform:none !important; }

/* ---------- 4. readable font ---------- */
html.a11y-font{ --font-display:'Atkinson Hyperlegible', Verdana, Tahoma, sans-serif; --font-serif:'Atkinson Hyperlegible', Verdana, Tahoma, sans-serif; }
html.a11y-font body{ letter-spacing:.012em !important; word-spacing:.08em; }
html.a11y-font :is(h1,h2,h3,.pm-h2,.foot-cta h2){ letter-spacing:-.01em !important; }
html.a11y-font :is(p,li,small,.a,dd){ line-height:1.75 !important; }
html.a11y-font :is(.pm-kicker,.pt-k,.eyebrow,.mega-h,.ui-sub,.ph-h){ letter-spacing:.06em !important; }

/* ---------- 5. highlight links & focus ---------- */
html.a11y-links a:not(.pm-btn):not(.brand):not(.ghost):not(.skip):not(.mega a){
  text-decoration:underline !important; text-decoration-thickness:2px !important;
  text-underline-offset:3px !important; text-decoration-color:currentColor !important;
}
html.a11y-links a:hover:not(.pm-btn), html.a11y-links a:focus-visible:not(.pm-btn){
  background:#F6DDB0 !important; color:#172A21 !important; -webkit-text-fill-color:#172A21 !important;
}
html.a11y-links :focus-visible{ outline:3px solid var(--pm-green-2,#2E6B4E) !important; outline-offset:3px !important; box-shadow:0 0 0 6px #F6DDB0 !important; }

/* ---------- 6. reading guide ---------- */
.ax-guide{ position:fixed; inset:0; z-index:85; pointer-events:none; display:none; }
html.a11y-guide .ax-guide{ display:block; }
.ax-guide i{ position:absolute; left:0; right:0; background:rgba(23,42,33,.55); }
.ax-guide i:first-child{ top:0; height:var(--gy,40vh); }
.ax-guide i:last-child{ bottom:0; top:calc(var(--gy,40vh) + var(--gh,96px)); }
.ax-guide b{
  position:absolute; left:0; right:0; top:var(--gy,40vh); height:var(--gh,96px);
  border-block:2px solid var(--pm-amber,#F0AC46);
}