/* QuickScope marketing site: the shared look for the plain pages (privacy, not found).
   Same colours, face, head and foot as the home page. */
@font-face{font-family:'Inter Fallback';src:local('Arial');size-adjust:107%;ascent-override:90%;descent-override:22.4%;line-gap-override:0%;unicode-range:U+0000-00FF;}
/* inter-latin-var-site.woff2 is inter-latin-var.woff2 with every character kept but only the OpenType features this
   site uses (shaping defaults + cv05, cv08, tnum): 66 KB instead of 103 KB, for a faster first paint on phones.
   Using another feature (e.g. "zero", "ss01", "case") means re-cutting it from the full file, which stays in fonts/. */
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url('/fonts/inter-latin-var-site.woff2') format('woff2-variations'),url('/fonts/inter-latin-var-site.woff2') format('woff2');}

/* every token for the site lives here; .studio is the home page's dark room and takes the dark set */
:root{
  --bg:#F7F7F9;--surf:#FFFFFF;--surf-2:#F0F0F4;--tray:#E6E6EC;--line:#E6E6EC;--line-2:#858592;
  --txt:#14121F;--txt-2:#3F3F52;--dim:#6B6B7B;--dim-2:#858592;
  --accent:#6E46DC;--on-accent:#FFFFFF;--accent-bg:#EBEAFE;
  --ok:#047857;--ok-bg:#ECFDF5;--warn:#B45309;--warn-bg:#FFFBEB;
  --head:#FFFFFF;
  --p-400:#9F8DFE;
  --cam:#16181C;--cam-ink:#F2F4F6;--cam-txt:#C3C9D2;--cam-dim:#98A1AC;--cam-line:#3A3E45;
  --paper:#FFFFFF;--paper-ink:#14171B;--paper-dim:#5A6472;--paper-line:#C8CFD8;--paper-hi:#F0F2F5;
  --shadow-card:0 1px 2px rgba(20, 18, 31, 0.05);
  --shadow-float:0 10px 28px rgba(20, 18, 31, 0.14);
  /* showroom (marketing only, Design System §3.5): studio shadow, accent glow, glass */
  --studio:0 50px 90px -30px rgba(52, 36, 105, 0.45),0 18px 36px -18px rgba(20, 18, 31, 0.35);
  --glow:rgba(131, 99, 242, 0.30);--glow-2:rgba(159, 141, 254, 0.22);
  --w-strong:700;--w-med:600;--w-row:550;--w-regular:400;
  --radius-card:10px;--radius-control:8px;--radius-badge:6px;--radius-pill:999px;--radius-phone-inner:24px;--radius-phone-bezel:30px;
  --space-target-min:48px;
  --fs-body:16px;--fs-sub:14px;--fs-eyebrow:13px;--fs-badge:13px;--fs-display-m:18px;--fs-display-l:23px;--fs-display-xl:30px;
  --ui:'Inter','Inter Fallback',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
  --ease:cubic-bezier(.2,.8,.2,1);
  color-scheme:light;
}
:root[data-theme="dark"],.studio{
  --bg:#0E0E13;--surf:#16161D;--surf-2:#1E1E26;--tray:#26262D;--line:#292931;--line-2:#6A6A77;
  --txt:#F4F4F8;--txt-2:#CECED7;--dim:#9A9AA8;--dim-2:#6A6A77;
  --accent:#9F8DFE;--on-accent:#14121F;--accent-bg:#29214B;
  --ok:#35C08A;--ok-bg:#10231C;--warn:#E0A030;--warn-bg:#271E10;
  --head:#16161D;
  --shadow-card:none;--shadow-float:0 10px 28px rgba(0, 0, 0, 0.55);
  --studio:0 50px 90px -30px rgba(0, 0, 0, 0.8),0 0 0 1px rgba(255, 255, 255, 0.06);
  --glow:rgba(131, 99, 242, 0.34);--glow-2:rgba(159, 141, 254, 0.18);
  --w-med:550;--w-row:500;
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--txt);font-family:var(--ui);font-size:var(--fs-body);line-height:1.6;font-weight:var(--w-regular);
  font-feature-settings:"cv05" 1,"cv08" 1;font-optical-sizing:auto}
:root[data-theme="dark"] body{-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:var(--radius-badge)}
.wrap{max-width:1200px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left));padding-right:max(20px,env(safe-area-inset-right))}
.skip{position:absolute;left:-999px;top:8px;background:var(--surf);padding:10px 14px;border-radius:var(--radius-control);z-index:100}
.skip:focus{left:16px}
.ic{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* head */
.head{position:sticky;top:0;z-index:50;background:var(--head);border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top,0px)}
.head .wrap{display:flex;align-items:center;gap:20px;height:68px}
.lockup{display:flex;align-items:center;gap:10px;flex:none;min-height:44px}
.lockup svg{width:32px;height:32px}
.tile{fill:var(--accent)}
.br{stroke:var(--on-accent)}
.word{font-size:var(--fs-display-l);font-weight:var(--w-strong);letter-spacing:-.02em;line-height:1;color:var(--txt)}
.word b{font-weight:inherit;color:var(--accent)}
.head-end{margin-left:auto;display:flex;align-items:center;gap:6px}
.icon-btn{width:44px;height:44px;border-radius:var(--radius-control);display:grid;place-items:center;color:var(--dim)}
.icon-btn:hover{background:var(--surf-2);color:var(--txt)}
.theme-btn .moon{display:none}
:root[data-theme="dark"] .theme-btn .sun{display:none}
:root[data-theme="dark"] .theme-btn .moon{display:block}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 16px;border-radius:var(--radius-control);font-weight:var(--w-med);font-size:15px;white-space:nowrap;transition:background-color .18s var(--ease),border-color .18s var(--ease)}
.btn-line{border:1px solid var(--line-2);color:var(--txt);background:var(--surf)}
.btn-line:hover{border-color:var(--txt)}
.btn-fill{background:var(--accent);color:var(--on-accent);box-shadow:0 10px 24px -10px var(--glow)}
/* on a phone the logo is the way home; the button would push the head past the screen edge */
@media (max-width:480px){.head .wrap{gap:10px}.word{font-size:20px}.head .btn-line{display:none}}

/* the document */
.doc{padding-block:clamp(48px,7vw,96px) clamp(64px,8vw,120px)}
.doc .wrap{max-width:760px}
.label{font-size:var(--fs-eyebrow);font-weight:var(--w-med);color:var(--accent);margin-bottom:14px}
.doc h1{font-size:clamp(34px,5vw,54px);line-height:1.04;letter-spacing:-.04em;font-weight:var(--w-strong);text-wrap:balance}
.doc .meta{color:var(--dim);font-size:var(--fs-sub);margin-top:14px}
.doc .lede{font-size:clamp(17px,1.6vw,19px);color:var(--txt-2);margin-top:22px;text-wrap:pretty}
.doc h2{font-size:var(--fs-display-l);font-weight:var(--w-strong);letter-spacing:-.02em;line-height:1.2;margin-top:48px;padding-top:28px;border-top:1px solid var(--line)}
.doc h3{font-size:var(--fs-display-m);font-weight:var(--w-strong);margin-top:26px}
.doc p,.doc ul{margin-top:12px;color:var(--txt-2)}
.doc ul{padding-left:1.2em}
.doc li{margin-top:6px}
.doc li::marker{color:var(--dim-2)}
.doc strong{color:var(--txt);font-weight:var(--w-med)}
.doc p a,.doc li a,.doc td a{color:var(--txt);text-decoration:underline;text-underline-offset:2px;overflow-wrap:anywhere}
.tbl{margin-top:16px;border:1px solid var(--line);border-radius:var(--radius-card);background:var(--surf);overflow:hidden}
.tbl table{width:100%;border-collapse:collapse;font-size:var(--fs-sub)}
.tbl th,.tbl td{text-align:left;vertical-align:top;padding:12px 14px;border-top:1px solid var(--line);color:var(--txt-2)}
.tbl thead th{border-top:0;background:var(--surf-2);color:var(--txt);font-weight:var(--w-med)}
@media (max-width:560px){
  .tbl thead{display:none}
  .tbl tr{display:block;border-top:1px solid var(--line);padding:6px 0}
  .tbl tr:first-child{border-top:0}
  .tbl td{display:block;border-top:0;padding:4px 14px}
  .tbl td::before{content:attr(data-h);display:block;font-size:var(--fs-eyebrow);color:var(--dim);font-weight:var(--w-med)}
}
.note{margin-top:16px;background:var(--surf);border:1px solid var(--line);border-radius:var(--radius-card);padding:16px 18px;color:var(--txt-2)}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}

/* foot */
footer{background:var(--surf);border-top:1px solid var(--line);padding-block:40px calc(28px + env(safe-area-inset-bottom,0px))}
.foot-top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px}
.foot-links{display:flex;flex-wrap:wrap;align-content:flex-start;gap:0 28px;font-size:var(--fs-sub);color:var(--txt-2)}
.foot-links a{display:inline-flex;align-items:center;min-height:44px}
.foot-links a:hover{color:var(--txt)}
.foot-meta{margin-top:28px;padding-top:24px;border-top:1px solid var(--line);color:var(--dim);font-size:var(--fs-sub);text-align:center}
.foot-ver{white-space:nowrap}
/* Bascorp agency badge: the brand prompt's rules, verbatim. Never restyle. Centred at every width. */
.foot-badge{text-align:center}
.bascorp-badge{display:inline-flex;line-height:0;margin:12px}
.bascorp-badge img{height:36px;width:auto}
.bascorp-badge .bb-dark{display:none}
@media (max-width:480px){.bascorp-badge img{height:30px}}
:root[data-theme="dark"] .bascorp-badge .bb-light{display:none}
:root[data-theme="dark"] .bascorp-badge .bb-dark{display:inline}
