/* ══════════════════════════════════════════════════════════════════════════
   TechFinLens public pages: the landing page's look for every page that
   uses site_base.html (pricing, contact, products, FAQ, security, careers).
   Loaded after tfl-site.css: it swaps in the landing tokens, fonts, header,
   footer and dark mode, and lifts the older components onto them.
   ══════════════════════════════════════════════════════════════════════════ */
:root{
  --ink:#12233F; --ink-2:#3A4B66; --muted:#5A6A80; --paper:#F4F6F9; --surface:#FFFFFF;
  --rule:#D5DCE6; --rule-soft:#E6EBF1; --blue:#0B6BB8; --blue-dk:#095A9C; --violet:#5B35D0;
  --band:#12233F; --chip-bg:#FFFFFF; --head-bg:rgba(244,246,249,.82); --field:#FFFFFF;
  --serif:'Newsreader',Georgia,'Times New Roman',serif;
  --sans:'Hanken Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;
  /* old names used by tfl-site.css, pointed at the landing tokens */
  --bg:var(--paper); --alt:var(--surface); --alt2:var(--rule-soft); --slate:var(--muted);
  --line:var(--rule); --line-2:var(--rule); --brand:var(--blue); --brand-deep:var(--blue-dk);
  --brand-wash:rgba(11,107,184,.07); --accent:var(--blue); --purple:var(--violet); --ink-dark:var(--band);
  --font:var(--sans);
  color-scheme:light;
}
html[data-theme="dark"]{
  --ink:#E6EDF7; --ink-2:#B4C2D6; --muted:#8C9DB5; --paper:#0B1424; --surface:#101C31; --rule:#24344F; --rule-soft:#1B2A42;
  --blue:#4AA3EE; --blue-dk:#2F8BD8; --violet:#A98CF5; --band:#060E1B; --chip-bg:#14223B; --head-bg:rgba(11,20,36,.82); --field:#0D1829;
  --brand-wash:rgba(74,163,238,.10); color-scheme:dark;
}
body.site2{background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.6;transition:background-color .3s,color .3s}
body.site2 h1,body.site2 h2,body.site2 h3,body.site2 h4{font-family:var(--serif);font-weight:500;color:var(--ink);letter-spacing:-.015em}
.site2 .wrap{max-width:1180px;margin:0 auto;padding:0 32px}
.site2 .sec-in{max-width:1180px;padding:0 32px}
.site2 :focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:4px}

/* ── Buttons: landing pills ── */
.site2 .btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 24px;border-radius:999px;
  font:600 15.5px/1 var(--sans);border:0;cursor:pointer;white-space:nowrap;transition:background .15s,color .15s,border-color .15s}
.site2 .btn-sm{height:40px;padding:0 18px;font-size:14.5px}
.site2 .btn-lg,.site2 .btn-lg.btn-primary,.site2 .btn-lg.btn-ghost,.site2 .btn-white,.site2 .btn-outline-w,.site2 .btn-block{height:50px;padding:0 26px;border-radius:999px;font-size:15.5px}
.site2 .btn-block{width:100%}
.site2 .btn-primary{background:var(--blue);color:#fff;box-shadow:0 10px 24px -12px rgba(11,107,184,.8)}
.site2 .btn-primary:hover{background:var(--blue-dk)}
html[data-theme="dark"] .site2 .btn-primary{background:#1673C4}
.site2 .btn-ghost,.site2 .btn-quiet{background:transparent;color:var(--ink);border:1px solid var(--rule)}
.site2 .btn-ghost:hover,.site2 .btn-quiet:hover{border-color:var(--ink);background:transparent}
.site2 .btn-white,.site2 .btn-light{background:#fff;color:#12233F}
.site2 .btn-white:hover,.site2 .btn-light:hover{background:#E8EEF6}
.site2 .btn-outline-w,.site2 .btn-line-light{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.35)}
.site2 .btn-outline-w:hover,.site2 .btn-line-light:hover{border-color:#fff}
.site2 .btn-primary::after,.site2 .btn-white::after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;transform:skewX(-20deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);transition:left .6s}
.site2 .btn-primary:hover::after,.site2 .btn-white:hover::after{left:120%}

/* ── Header (same as the landing page) ── */
.site-head{position:sticky;top:0;z-index:50;transition:background .3s,box-shadow .3s}
.site-head.scrolled{background:var(--head-bg);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);
  box-shadow:0 1px 0 rgba(18,35,63,.08),0 10px 30px -18px rgba(18,35,63,.35)}
.site2 .nav{position:static;display:flex;align-items:center;gap:40px;height:76px;padding:0;max-width:none;margin:0;background:none;
  backdrop-filter:none;-webkit-backdrop-filter:none;transition:height .3s}
.site2 .nav::after{display:none}
.site-head.scrolled .nav{height:64px}
.site2 .brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:18px;letter-spacing:-.01em;color:var(--ink)}
.site2 .brand img{width:34px;height:34px}
.site2 .brand .word{font-size:18px;font-weight:700;color:var(--ink)}
.site2 .brand .word em{font-style:normal;font-weight:500;color:var(--muted)}
.site2 .nav-links{display:flex;gap:30px;margin-right:auto;font-size:15px;color:var(--ink-2);font-weight:500}
.site2 .nav-links a{position:relative;font-size:15px;color:var(--ink-2);padding:0;border:0}
.site2 .nav-links a:hover{color:var(--ink);border:0}
.site2 .nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:2px;background:var(--blue);border-radius:2px;transform:scaleX(0);transform-origin:left;transition:transform .25s}
.site2 .nav-links a:hover::after,.site2 .nav-links a[aria-current="page"]::after{transform:scaleX(1)}
.site2 .nav-links a[aria-current="page"]{color:var(--ink)}
.site2 .nav-actions{display:flex;align-items:center;gap:10px}
.site2 .nav-login{font-size:15px;font-weight:600;padding:8px 10px;color:var(--ink)}
.site2 .nav-login:hover{color:var(--blue)}
.theme-toggle{position:relative;width:40px;height:40px;border-radius:50%;border:1px solid var(--rule);background:var(--chip-bg);color:var(--ink);
  display:grid;place-items:center;cursor:pointer;padding:0;transition:border-color .2s}
.theme-toggle:hover{border-color:var(--ink)}
.theme-toggle svg{position:absolute;width:18px;height:18px;transition:transform .5s cubic-bezier(.2,.8,.2,1),opacity .3s}
.theme-toggle .sun{opacity:0;transform:rotate(-90deg) scale(.5)}
html[data-theme="dark"] .theme-toggle .sun{opacity:1;transform:none}
html[data-theme="dark"] .theme-toggle .moon{opacity:0;transform:rotate(90deg) scale(.5)}

/* ── Page head, sections and text ── */
.site2 .page-head{position:relative;padding:72px 0 16px;overflow:hidden;isolation:isolate}
.site2 .page-head::before{content:"";position:absolute;z-index:-1;width:900px;height:900px;right:-300px;top:-520px;border-radius:50%;
  background:radial-gradient(circle,rgba(124,196,245,.38),rgba(185,166,242,.12) 45%,transparent 68%);pointer-events:none}
html[data-theme="dark"] .site2 .page-head::before{opacity:.45}
.site2 .page-head .sec-in{padding:0 32px}
.site2 .crumb{font-family:var(--sans);font-size:14px;font-weight:600;color:var(--muted);margin-bottom:22px}
.site2 .crumb a{color:var(--blue)}
.site2 .page-head h1{font-size:clamp(2.4rem,4.8vw,3.8rem);line-height:1.04;letter-spacing:-.022em;max-width:17ch;margin-bottom:20px}
.site2 .page-head p.lead,.site2 .lede{color:var(--ink-2);font-size:clamp(1.05rem,1.35vw,1.2rem)}
.site2 .htitle .g,.site2 .hero h1 .g,.site2 .page-head h1 .g{color:var(--blue)}
.site2 .htitle{font-size:clamp(2rem,3.6vw,3rem);line-height:1.08;letter-spacing:-.018em}
.site2 .hsub{color:var(--ink-2)}
.site2 .eyebrow,.site2 .label,.site2 .kicker{font-family:var(--sans);letter-spacing:.06em;color:var(--blue)}
.site2 .section{padding:96px 0}
.site2 .section.tint,.site2 .stage.pale{background:var(--surface);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.site2 .section.dark,.site2 .stage.dark,.site2 .stage.ink,.site2 .cta-box{background:var(--band)}
.site2 .stage{padding:clamp(84px,12vh,140px) 0}
.site2 .stage-in{max-width:1180px;padding:0 32px}
.site2 .hero{padding:72px 0 8px}
.site2 .hero-in{max-width:1180px;padding:0 32px}
.site2 .display{font-family:var(--serif);font-weight:500}
.site2 .row-i .k,.site2 .layer .n,.site2 .stp .num,.site2 .chapter-list .k,.site2 .prod .tag,.site2 .device-url{font-family:var(--sans);font-weight:700}
.site2 .row-i b{font-family:var(--sans);font-weight:600}

/* Cards, panels and forms on the theme surface */
.site2 .card-x,.site2 .tier,.site2 .form-card,.site2 .how-viz,.site2 .shot,.site2 .device{background:var(--surface)}
.site2 .tier.feat-tier{background:var(--brand-wash)}
.site2 .tiers{border-radius:18px;overflow:hidden}
.site2 .form-card{border-radius:18px;border-color:var(--rule);padding:34px}
.site2 .fld input,.site2 .fld select,.site2 .fld textarea{background:var(--field);color:var(--ink);border-color:var(--rule);border-radius:10px;font-family:var(--sans)}
.site2 .fld input:focus,.site2 .fld select:focus,.site2 .fld textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(11,107,184,.15)}
.site2 .prod:hover{background:var(--brand-wash)}
.site2 .faq-q{font-family:var(--serif);font-weight:500;font-size:1.15rem}
.site2 .cta-box{border-radius:18px}
.site2 .cta-box h2{font-family:var(--serif);font-weight:500}
html[data-theme="dark"] .site2 .shot img,html[data-theme="dark"] .site2 .device img{filter:brightness(.92)}
html[data-theme="dark"] .site2 .device-bar{background:#13223D;border-color:#22385C}
html[data-theme="dark"] .site2 .form-msg.ok{background:rgba(30,142,90,.15);border-color:rgba(30,142,90,.4)}
html[data-theme="dark"] .site2 .form-msg.err{background:rgba(229,88,76,.12);border-color:rgba(229,88,76,.4)}

/* Reveal for .rv (landing class) */
@media (prefers-reduced-motion:no-preference){
  html.js .site2 .rv{opacity:0;transform:translateY(28px);transition:opacity .8s ease-out,transform .8s cubic-bezier(.2,.8,.2,1)}
  html.js .site2 .rv.in{opacity:1;transform:none}
}

/* ── Footer (same as the landing page, plus contact details) ── */
.footer2{padding:64px 0 40px;font-size:15px;color:var(--ink-2);border-top:1px solid var(--rule)}
.footer2 .foot-cols{display:grid;grid-template-columns:1.6fr repeat(3,1fr);gap:40px;padding-bottom:36px}
.footer2 .foot-cols h4{margin:0 0 14px;font-family:var(--sans);font-size:14.5px;color:var(--ink);font-weight:600;letter-spacing:0}
.footer2 .foot-cols a{display:block;padding:4px 0}
.footer2 .foot-cols a.brand{display:inline-flex;padding:0}
.footer2 .foot-cols a:hover{color:var(--blue)}
.footer2 .foot-about{max-width:26em;margin:16px 0 0;color:var(--muted)}
.foot-contact{display:grid;grid-template-columns:repeat(3,1fr);gap:24px 40px;padding:26px 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);font-size:14.5px}
.foot-contact b{display:block;color:var(--ink);font-weight:600;margin-bottom:4px}
.foot-contact span,.foot-contact a{display:block;color:var(--ink-2)}
.foot-contact a:hover{color:var(--blue)}
.footer2 .foot-base{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-top:24px;font-size:14px;color:var(--muted)}

/* ── Responsive ── */
@media (max-width:1020px){
  .site2 .nav-links{gap:20px}
}
@media (max-width:900px){
  .site2 .nav-links{display:none}
  .site2 .nav-actions{margin-left:auto}
  .site2 .section{padding:68px 0}
}
@media (max-width:760px){
  .site2 .wrap,.site2 .sec-in,.site2 .page-head .sec-in,.site2 .stage-in,.site2 .hero-in{padding:0 18px}
  .site2 .nav{height:64px;gap:12px}
  .site2 .brand,.site2 .brand .word{font-size:17px}
  .site2 .brand img{width:30px;height:30px}
  .site2 .page-head{padding:44px 0 8px}
  .site2 .form-card{padding:22px 18px}
  .footer2 .foot-cols{grid-template-columns:1fr 1fr}
  .footer2 .foot-cols > div:first-child{grid-column:1 / -1}
  .foot-contact{grid-template-columns:1fr}
}
@media (max-width:440px){ .site2 .nav-actions .nav-login{display:none} }
@media (max-width:380px){ .site2 .nav-actions .btn{display:none} }