/* Operator enterprise design system — AXE brand booklet.
   Shared by every /enterprise/* page so the surface stays one system, not divergent one-offs. */
:root{
  --field:#1F3A93;        /* Rand Blue — the bold full-bleed field (Paul Rand / IBM blue) */
  --field-2:#16296b;
  --panel:#FBFAF7;        /* Paper — the document panel floating in the field */
  --panel-2:#efede7;
  --ink:#2b2b30; --dim:#6a6a72; --faint:#9a9aa2; --line:rgba(20,20,24,.14);  /* Apple-style soft greys on the paper panel (not pure black) */
  --accent:#3D5AFE;       /* Cobalt — the pop, on the cream panels */
  --deep:#2A43C8;         /* deep cobalt — button hover */
  --signal:#E54340;
  --onfield:#FBFAF7;      /* field is dark now → on-field chrome is paper */
  --onfield-dim:rgba(251,250,247,.74);
  --onfield-line:rgba(251,250,247,.2);
  /* Booklet faces (authoritative): Didone display + the Courier "evidence face". */
  --display:'Instrument Serif',Georgia,'Times New Roman',serif;  /* one-line display, >=28px, mixed case, not letterspaced */
  --mono:'Courier New','Courier',ui-monospace,monospace;         /* the evidence face — labels (caps) + data */
  --sans:'Inter',-apple-system,BlinkMacSystemFont,system-ui,sans-serif;  /* running body (readability) */
}
*{box-sizing:border-box}
html,body{max-width:100%;overflow-x:clip}
body{margin:0;background:var(--field);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
.mono{font-family:var(--mono)}
/* top bar */
header{position:sticky;top:0;z-index:30;background:var(--field);border-bottom:1px solid var(--onfield-line)}
.bar{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:16px clamp(16px,4vw,40px);color:var(--onfield)}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:.02em;font-size:15px;color:var(--onfield)}
.brand .chip{width:26px;height:26px;border-radius:7px;background:var(--ink);display:grid;place-items:center}
.brand .chip svg{width:16px;height:16px;display:block}
nav{display:flex;gap:24px;align-items:center;font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase}
nav a{color:var(--onfield-dim)}
nav a:hover,nav a.on{color:var(--onfield)}
.req{border:1px solid rgba(251,250,247,.5);border-radius:6px;padding:7px 14px;color:var(--onfield)!important}
.req:hover{background:var(--onfield);color:var(--field)!important}
@media(max-width:860px){nav .hide-sm{display:none}}
/* shell + document panel */
.shell{max-width:1200px;margin:0 auto;padding:clamp(14px,2.5vw,26px) clamp(14px,4vw,40px) 60px}
.doc{background:var(--panel);border:1px solid var(--onfield-line);border-radius:4px}
.pad{padding:clamp(26px,5vw,72px) clamp(22px,5vw,76px)}
.rule{border-top:1px solid var(--line)}
.lbl{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin:0 0 20px;display:flex;align-items:center;gap:10px}
.lbl::before{content:"//";color:var(--accent);opacity:.9}
.back{font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim);margin:0 0 18px;display:inline-block}
.back:hover{color:var(--ink)}
/* hero / headings */
h1,h2,h3,h4{letter-spacing:-.02em}
.hero h1{font-size:clamp(40px,7.5vw,92px);font-weight:700;letter-spacing:-.035em;line-height:.98;margin:0 0 24px;max-width:15ch}
.hero h1 .thin{font-weight:300;color:var(--dim)}
.h2{font-size:clamp(26px,4vw,44px);font-weight:700;letter-spacing:-.03em;line-height:1.04;margin:0 0 18px;max-width:22ch}
.hero .sub,.lead{font-size:clamp(16px,2vw,21px);color:var(--dim);font-weight:400;line-height:1.55;max-width:62ch;margin:0 0 34px}
/* buttons */
.cta{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);font-size:13px;letter-spacing:.06em;text-transform:uppercase;padding:14px 22px;border:1px solid var(--ink);border-radius:5px;transition:all .18s;cursor:pointer}
.btn.primary{background:var(--ink);color:var(--panel)}
.btn.primary:hover{background:var(--deep);border-color:var(--deep);color:#fff}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:var(--panel)}
.cta-note{font-family:var(--mono);font-size:12px;color:var(--faint);margin:16px 0 0;letter-spacing:.03em}
/* trusted by */
.trust{display:flex;align-items:center;gap:clamp(22px,5vw,60px);flex-wrap:wrap}
.trust .org{font-family:var(--mono);font-weight:600;font-size:clamp(14px,1.8vw,19px);letter-spacing:.02em;color:var(--ink);opacity:.82;white-space:nowrap}
.trust .org .sm{display:block;font-weight:400;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);margin-top:3px}
/* grids */
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid var(--line);border-radius:4px;overflow:hidden}
@media(max-width:760px){.grid3{grid-template-columns:1fr}}
.cell{padding:28px;border-right:1px solid var(--line)}
.cell:last-child{border-right:0}
@media(max-width:760px){.cell{border-right:0;border-bottom:1px solid var(--line)}.cell:last-child{border-bottom:0}}
.cell .k{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:12px}
.cell h3{margin:0 0 8px;font-size:19px;font-weight:600}
.cell p{margin:0;color:var(--dim);font-size:14px;line-height:1.6}
/* 2-col feature list (security items) */
.sec{display:grid;grid-template-columns:repeat(2,1fr);gap:0;border:1px solid var(--line);border-radius:4px;overflow:hidden}
@media(max-width:700px){.sec{grid-template-columns:1fr}}
.sitem{padding:22px 24px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.sitem:nth-child(2n){border-right:0}
.sitem .n{font-family:var(--mono);font-size:11px;color:var(--faint);letter-spacing:.1em}
.sitem h4{margin:7px 0 6px;font-size:15.5px;font-weight:600}
.sitem p{margin:0;color:var(--dim);font-size:13.5px;line-height:1.6}
/* stat row */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid var(--line);border-radius:4px;overflow:hidden;text-align:left}
@media(max-width:640px){.stats{grid-template-columns:1fr}}
.stat{padding:26px 28px;border-right:1px solid var(--line)}
.stat:last-child{border-right:0}
@media(max-width:640px){.stat{border-right:0;border-bottom:1px solid var(--line)}.stat:last-child{border-bottom:0}}
.stat .big{font-size:clamp(30px,4.4vw,46px);font-weight:700;letter-spacing:-.03em;line-height:1}
.stat .cap{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--dim);margin-top:10px}
/* spec table (data handling / compliance) */
.spec{width:100%;border-collapse:collapse;border:1px solid var(--line);border-radius:4px;overflow:hidden}
.spec tr{border-bottom:1px solid var(--line)}
.spec tr:last-child{border-bottom:0}
.spec td{padding:15px 20px;vertical-align:top;font-size:14px;line-height:1.55}
.spec td:first-child{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);width:34%;white-space:nowrap}
.spec td:last-child{color:var(--dim)}
@media(max-width:620px){.spec td:first-child{width:40%}}
/* pills */
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pill{font-family:var(--mono);font-size:11px;letter-spacing:.05em;text-transform:uppercase;border:1px solid var(--line);border-radius:20px;padding:5px 11px;color:var(--ink)}
.pill.soon{color:var(--faint)}
/* FAQ */
.faq details{border-bottom:1px solid var(--line);padding:16px 0}
.faq details[open] summary{color:var(--ink)}
.faq summary{list-style:none;cursor:pointer;font-weight:600;font-size:15.5px;display:flex;justify-content:space-between;gap:16px;color:var(--ink)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--mono);color:var(--accent)}
.faq details[open] summary::after{content:"\2212"}
.faq p{color:var(--dim);font-size:14px;line-height:1.65;margin:12px 0 0;max-width:68ch}
/* closing band + footer */
.band{color:var(--onfield);text-align:center;padding:clamp(48px,8vw,92px) 24px}
.band h2{font-size:clamp(30px,5vw,60px);font-weight:700;letter-spacing:-.03em;margin:0 0 14px;line-height:1.02}
.band p{font-family:var(--mono);font-size:13px;letter-spacing:.04em;color:var(--onfield-dim);margin:0 0 30px;text-transform:uppercase}
.btn.onfield{border-color:var(--onfield);color:var(--onfield)}
.btn.onfield.primary{background:var(--onfield);color:var(--field)}
.btn.onfield.primary:hover{background:var(--ink);color:var(--panel)}
.fcols{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:24px;padding:48px clamp(16px,4vw,40px) 10px;color:var(--onfield)}
@media(max-width:760px){.fcols{grid-template-columns:1fr 1fr}}
.fcols h5{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--onfield-dim);margin:0 0 12px}
.fcols a{display:block;font-size:13.5px;color:var(--onfield-dim);padding:4px 0}
.fcols a:hover{color:var(--onfield)}
.fcols .lede{font-size:13px;color:var(--onfield-dim);line-height:1.6;max-width:34ch}
footer{color:var(--onfield-dim);font-family:var(--mono);font-size:11.5px;letter-spacing:.04em;text-align:center;padding:22px 24px 50px;border-top:1px solid var(--onfield-line);margin-top:20px}
footer a{color:var(--onfield)}
.flag{position:fixed;left:12px;bottom:12px;z-index:50;font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;background:var(--ink);color:var(--panel);padding:5px 10px;border-radius:5px;opacity:.78}
/* ---- distinctive wordmark + bare animated star (no chip box) ---- */
.hero h1,.h2,.band h2{font-family:var(--display);font-weight:400;letter-spacing:-.01em}
.wordmark{font-family:var(--display);font-weight:500;font-size:23px;letter-spacing:0;text-transform:none;color:var(--onfield)}
.brand{gap:12px}
.mark{width:30px;height:30px;flex:0 0 30px;display:block}
.mark svg{width:100%;height:100%;display:block;overflow:visible}
.mark .s{transform-origin:50% 50%;animation:starspin 26s linear infinite}
.mark .s2{transform-origin:50% 50%;animation:starspin 26s linear infinite reverse}
@keyframes starspin{to{transform:rotate(360deg)}}
.hero-mark{width:clamp(76px,10vw,116px);height:clamp(76px,10vw,116px);margin:0 0 30px;display:block}
.hero-mark svg{width:100%;height:100%;overflow:visible}
.hero-mark .s{transform-origin:50% 50%;animation:starspin 46s linear infinite, starin 1.1s cubic-bezier(.2,1,.3,1) both}
.hero-mark .s2{transform-origin:50% 50%;animation:starspin 46s linear infinite reverse}
.hero-mark .ring{fill:none;stroke:var(--accent);stroke-width:1;opacity:.5;stroke-dasharray:3 7;transform-origin:50% 50%;animation:starspin 60s linear infinite}
@keyframes starin{from{transform:rotate(-50deg) scale(.4);opacity:0}to{transform:rotate(0) scale(1);opacity:1}}
@media(prefers-reduced-motion:reduce){.mark .s,.mark .s2,.hero-mark .s,.hero-mark .s2,.hero-mark .ring{animation:none}}
/* ---- signature hero/section visual: the Operator ASCII character-sphere (not the logo) ---- */
.op-sphere-wrap{margin:0 0 30px;display:flex;justify-content:flex-start}
.op-sphere{font-family:var(--mono);font-size:clamp(7px,1.08vw,11px);line-height:1;color:var(--ink);margin:0;white-space:pre;letter-spacing:0;user-select:none}
@media(max-width:620px){.op-sphere{font-size:6px}}
/* ---- reveal-on-scroll (axetechnologies.ca-style entrance) ---- */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .8s cubic-bezier(.22,1,.36,1),transform .8s cubic-bezier(.22,1,.36,1)}
.reveal.in{opacity:1;transform:none}
/* stagger: children of a revealed grid rise in sequence (axe pattern) */
.reveal.in .grid3 .cell,.reveal.in .sec .sitem,.reveal.in .stats .stat,.reveal.in .pills .pill{animation:axeFadeUp .55s cubic-bezier(.22,1,.36,1) both}
.reveal.in .grid3 .cell:nth-child(2),.reveal.in .sec .sitem:nth-child(2),.reveal.in .stats .stat:nth-child(2){animation-delay:.08s}
.reveal.in .grid3 .cell:nth-child(3),.reveal.in .sec .sitem:nth-child(3),.reveal.in .stats .stat:nth-child(3){animation-delay:.16s}
.reveal.in .sec .sitem:nth-child(4){animation-delay:.24s}.reveal.in .sec .sitem:nth-child(5){animation-delay:.32s}.reveal.in .sec .sitem:nth-child(6){animation-delay:.4s}
@keyframes axeFadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
/* scan-line sweep (axe scanSweep) — a thin pop-coloured strip traversing a frame */
.scan{position:relative;overflow:hidden}
.scan::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--accent) 22%,transparent),transparent);width:36%;transform:translateX(-120%) skewX(-12deg);animation:scanSweep 6.5s linear infinite;pointer-events:none}
@keyframes scanSweep{to{transform:translateX(360%) skewX(-12deg)}}
/* live status dot + terminal caret (axe) */
.livedot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 60%,transparent);animation:ping 2s ease-in-out infinite;vertical-align:middle;margin-right:8px}
@keyframes ping{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 55%,transparent)}50%{box-shadow:0 0 0 5px transparent}}
.caret{display:inline-block;width:8px;height:1em;background:var(--accent);vertical-align:-2px;animation:blink 1.1s steps(1) infinite}
@keyframes blink{0%,49%{opacity:1}50%,100%{opacity:0}}
.status{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);display:inline-flex;align-items:center}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}.scan::after,.livedot,.caret{animation:none}.reveal.in .cell,.reveal.in .sitem,.reveal.in .stat,.reveal.in .pill{animation:none}}