/* anci.app — the ANCI theme (2026-11-06), the anciai.com look for every page.
   One file for: the site header (.ax-bar), the site footer (.ax-foot) and the page
   components (.ax …) that converted pages use. Colours and type follow anciai.com
   (assets/start/start.css + site.css): Inter, ink #0f1a3d, ANCI logo blue #3b97ed.
   custom.css forces "* {font-size:3.5vw !important}" on phones, so every size
   here is !important and unsized text inherits a 16px base inside these blocks. */

:root{
  --ax-ink:#0f1a3d;--ax-ink2:#4f5d7a;--ax-ink3:#6b7690;
  --ax-blue:#3b97ed;--ax-blue2:#2a86dc;--ax-tint:#e3f2fe;
  --ax-line:#e6ebf5;--ax-bg:#f4f6fb;--ax-green:#16a34a;--ax-red:#dc2626;
  --ax-font:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --ax-bar-h:80px;
}

/* ───────────── site header ───────────── */
.ax-bar{position:fixed;top:0;left:0;right:0;z-index:1030;height:var(--ax-bar-h);background:rgba(255,255,255,.96);
  -webkit-backdrop-filter:saturate(1.4) blur(8px);backdrop-filter:saturate(1.4) blur(8px);border-bottom:1px solid var(--ax-line);font-family:var(--ax-font)}
.ax-bar *{box-sizing:border-box;font-family:var(--ax-font)}
.ax-bar-in{max-width:1180px;height:100%;margin:0 auto;padding:0 24px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.ax-bar .ax-logo{display:flex;align-items:center;text-decoration:none;border:0}
.ax-bar .ax-logo img{width:124px !important;height:auto !important;display:block;max-width:none}
.ax-nav{display:flex;align-items:center;gap:6px;margin:0;padding:0}
.ax-nav a{padding:9px 14px;border-radius:999px;font-size:15px !important;font-weight:600;line-height:1.2;color:var(--ax-ink2) !important;text-decoration:none !important;white-space:nowrap;border:0;background:transparent;transition:background .15s,color .15s}
.ax-nav a:hover{color:var(--ax-ink) !important;background:var(--ax-bg)}
.ax-nav a[aria-current="page"]{color:var(--ax-blue) !important;background:var(--ax-tint)}
.ax-nav a.ax-cta{margin-left:8px;padding:10px 20px;background:var(--ax-blue);color:#fff !important;box-shadow:0 8px 18px -8px rgba(59,151,237,.65)}
.ax-nav a.ax-cta:hover{background:var(--ax-blue2);color:#fff !important}
.ax-menu{display:none;position:relative}
.ax-menu summary{list-style:none;cursor:pointer;width:44px;height:44px;border-radius:12px;border:1.5px solid var(--ax-line);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;background:#fff}
.ax-menu summary::-webkit-details-marker{display:none}
.ax-menu summary span{display:block;width:18px;height:2px;border-radius:2px;background:var(--ax-ink)}
.ax-menu[open] summary{border-color:var(--ax-blue)}
.ax-menu .ax-nav{position:absolute;right:0;top:56px;z-index:10;flex-direction:column;align-items:stretch;gap:2px;min-width:230px;padding:10px;background:#fff;border:1.5px solid var(--ax-line);border-radius:16px;box-shadow:0 24px 50px -24px rgba(15,26,61,.35)}
.ax-menu .ax-nav a{padding:12px 14px}
.ax-menu .ax-nav a.ax-cta{margin:6px 0 0;text-align:center}
.ax-nav a:focus-visible,.ax-menu summary:focus-visible,.ax-foot a:focus-visible{outline:3px solid #9bc9f6;outline-offset:2px}
@media (max-width:991px){
  .ax-nav-wide{display:none}
  .ax-menu{display:block}
}
@media (max-width:600px){
  :root{--ax-bar-h:68px}
  .ax-bar-in{padding:0 16px}
  .ax-bar .ax-logo img{width:104px !important}
}

/* ───────────── site footer ───────────── */
.ax-foot{background:#fff;border-top:1px solid var(--ax-line);font-family:var(--ax-font);color:var(--ax-ink2);font-size:15px !important;line-height:1.5}
.ax-foot *{box-sizing:border-box;font-family:var(--ax-font)}
.ax-foot-in{max-width:1180px;margin:0 auto;padding:48px 24px 28px}
.ax-foot-top{display:grid;grid-template-columns:1.3fr 3fr;gap:40px}
.ax-foot-brand .ax-logo img{width:104px !important;height:auto !important;display:block}
.ax-foot-brand p{margin:10px 0 18px;font-size:14px !important;color:var(--ax-ink3)}
.ax-foot-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:28px 24px}
.ax-foot h3{margin:0 0 10px !important;font-size:12.5px !important;font-weight:700 !important;letter-spacing:.12em;text-transform:uppercase;color:var(--ax-ink3) !important;line-height:1.3}
.ax-foot h3 a{color:inherit !important;text-decoration:none !important}
.ax-foot nav a{display:block;padding:4px 0;font-size:14.5px !important;color:var(--ax-ink2) !important;text-decoration:none !important;border:0}
.ax-foot nav a:hover{color:var(--ax-blue) !important}
.ax-foot nav h3 a{display:inline;padding:0;font-size:inherit !important;font-weight:inherit;letter-spacing:inherit;color:inherit !important}
.ax-foot nav h3 a:hover{color:var(--ax-blue) !important}
.ax-foot nav a svg{vertical-align:middle;margin-left:4px}
.ax-foot-promos{display:grid;gap:12px;margin-bottom:18px}
.ax-foot-promo{display:flex;align-items:center;gap:12px;text-decoration:none !important;color:inherit}
.ax-foot-promo img{width:48px !important;height:48px !important;border-radius:10px;object-fit:cover;flex-shrink:0}
.ax-foot-promo b{display:block;font-size:13.5px !important;font-weight:700;color:var(--ax-ink)}
.ax-foot-promo span{display:block;font-size:12.5px !important;color:var(--ax-ink3);line-height:1.35}
.ax-foot-promo:hover b{color:var(--ax-blue)}
.ax-foot-sub p{margin:0 0 8px;font-size:13px !important;color:var(--ax-ink3)}
.ax-foot-sub form{display:flex;gap:6px;max-width:300px;position:relative}
.ax-foot-sub input[type=email]{flex:1;min-width:0;height:38px;padding:0 12px;border:1.5px solid var(--ax-line);border-radius:10px;background:#fff;color:var(--ax-ink);font-size:14px !important}
.ax-foot-sub input[type=email]:focus{outline:none;border-color:var(--ax-blue)}
.ax-foot-sub button{height:38px;padding:0 14px;background:var(--ax-blue);color:#fff;border:0;border-radius:10px;font-size:14px !important;font-weight:600;cursor:pointer;white-space:nowrap}
.ax-foot-sub button:hover{background:var(--ax-blue2)}
.ax-foot-social{display:flex;gap:10px;margin-top:16px}
.ax-foot-social a{display:inline-flex;width:34px;height:34px;align-items:center;justify-content:center;border-radius:10px;border:1px solid var(--ax-line);color:var(--ax-ink2) !important}
.ax-foot-social a:hover{border-color:var(--ax-blue);color:var(--ax-blue) !important}
.ax-foot-social svg{width:16px;height:16px;fill:currentColor}
.ax-foot-ai{margin:32px 0 0;padding-top:18px;border-top:1px solid var(--ax-line);text-align:center;font-size:13px !important;color:var(--ax-ink3)}
.ax-foot-ai a{color:var(--ax-ink) !important;font-weight:600;text-decoration:none !important;margin:0 6px}
.ax-foot-ai a:hover{color:var(--ax-blue) !important}
.ax-foot-fine{margin:14px 0 0;text-align:center;font-size:13px !important;color:var(--ax-ink3)}
.ax-foot-fine a{color:inherit !important;text-decoration:none !important}
@media (max-width:980px){
  .ax-foot-top{grid-template-columns:1fr}
}
@media (max-width:600px){
  .ax-foot-in{padding:36px 16px 24px}
  .ax-foot-cols{grid-template-columns:1fr 1fr;gap:22px 16px}
}

/* the old site CSS names a font on h1–h6, p, li, a… directly; inside themed blocks every text element takes Inter.
   .hm/.pr/.hw/.r3/.ag are the five pages built before this file (home, pricing, how it works, 3.0, meet ANCI). */
:is(.ax,.hm,.pr,.hw,.r3,.ag,.ax-bar,.ax-foot) :where(h1,h2,h3,h4,h5,h6,p,li,a,span,div,b,strong,em,q,small,label,button,input,select,textarea,td,th,summary,blockquote,figcaption){font-family:var(--ax-font)}

/* ───────────── page components (converted pages wrap their content in .ax) ───────────── */
.ax{--ink:var(--ax-ink);--ink2:var(--ax-ink2);--ink3:var(--ax-ink3);--blue:var(--ax-blue);--blue2:var(--ax-blue2);--tint:var(--ax-tint);--line:var(--ax-line);--bg:var(--ax-bg);--green:var(--ax-green);--red:var(--ax-red);
  color:var(--ink);font-family:var(--ax-font);background:#fff;line-height:1.6;overflow-x:hidden;padding-top:var(--ax-bar-h)}
.ax *{box-sizing:border-box}
.ax a{color:var(--blue)}
.ax img{max-width:100%;height:auto}
.ax .wrap{max-width:1160px;margin:0 auto;padding:0 24px}
.ax .narrow{max-width:820px;margin-left:auto;margin-right:auto}
.ax .eyebrow{display:inline-block;font-size:12.5px !important;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--blue);margin:0 0 14px}
.ax .pill{display:inline-block;background:var(--tint);color:var(--blue);border-radius:999px;padding:5px 14px;font-size:13px !important;font-weight:600;margin-bottom:16px}
.ax h1{font-family:var(--ax-font);font-size:clamp(36px,5vw,56px) !important;line-height:1.06;font-weight:700;letter-spacing:-.025em;margin:0 0 18px;color:var(--ink)}
.ax h1 span,.ax h2 span{color:var(--blue)}
.ax h2{font-family:var(--ax-font);font-size:clamp(26px,3.2vw,38px) !important;line-height:1.14;font-weight:700;letter-spacing:-.02em;margin:0 0 12px;color:var(--ink)}
.ax h3{font-family:var(--ax-font);font-size:18px !important;line-height:1.3;font-weight:700;margin:0 0 6px;color:var(--ink)}
.ax h4{font-family:var(--ax-font);font-size:16px !important;font-weight:700;margin:0 0 6px;color:var(--ink)}
.ax p,.ax li{color:var(--ink2);font-size:16px !important}
.ax p{margin:0 0 12px}
.ax .lede{font-size:clamp(17px,1.5vw,20px) !important;max-width:740px}
.ax .center{text-align:center}
.ax .center .lede{margin-left:auto;margin-right:auto}
.ax .head{margin-bottom:30px}
.ax .btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.ax .center .btns{justify-content:center}
.ax .btn-p,.ax .btn-s{display:inline-flex;align-items:center;gap:8px;padding:13px 24px;border-radius:12px;font-weight:600;font-size:16px !important;line-height:1.2;text-decoration:none !important;transition:background .15s,border-color .15s;cursor:pointer}
.ax .btn-p{background:var(--blue);color:#fff !important;border:0}
.ax .btn-p:hover{background:var(--blue2)}
.ax .btn-s{border:1.5px solid var(--line);color:var(--ink) !important;background:#fff}
.ax .btn-s:hover{border-color:var(--blue)}
.ax .hero{background:linear-gradient(180deg,#f7fbff 0%,#fff 100%);padding:56px 0 60px}
.ax .hero img.art{border-radius:20px;margin:0 auto;display:block}
.ax .sec{padding:68px 0;border-top:1px solid var(--line)}
.ax .sec.alt{background:var(--bg)}
.ax .sec.dark{background:var(--ink);border-top:0}
.ax .sec.dark h2,.ax .sec.dark h3{color:#fff}
.ax .sec.dark p,.ax .sec.dark li{color:#c8d1e6}
.ax .sec.dark .eyebrow{color:#7cc0ff}
.ax .card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px}
.ax .card p{font-size:15.5px !important;margin:0}
.ax .card img{border-radius:12px}
.ax a.card{display:block;text-decoration:none;transition:border-color .15s,transform .15s}
.ax a.card:hover{border-color:var(--blue);transform:translateY(-2px)}
.ax .g2{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.ax .g2.top{align-items:start}
.ax .g3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.ax .g4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.ax .g2>*,.ax .g3>*,.ax .g4>*{min-width:0}  /* a grid track never grows to an image's natural width (cut-off text on phones) */
.ax .num{display:inline-flex;width:34px;height:34px;border-radius:50%;background:var(--blue);color:#fff;font-weight:700;align-items:center;justify-content:center;margin-bottom:12px}
.ax .chips{display:flex;flex-wrap:wrap;gap:10px;padding:0;margin:0;list-style:none}
.ax .chips li,.ax .chips span{background:#fff;border:1px solid var(--line);border-radius:999px;padding:9px 16px;font-weight:600;font-size:15px !important;color:var(--ink)}
.ax .chips.warn li:before,.ax .chips.warn span:before{content:'!';display:inline-flex;width:18px;height:18px;border-radius:50%;background:#fff1f1;color:var(--red);font-size:12px !important;font-weight:800;align-items:center;justify-content:center;margin-right:8px}
.ax .list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ax .list li{position:relative;padding-left:28px}
.ax .list li:before{content:'✓';position:absolute;left:0;color:var(--blue);font-weight:700}
.ax .list.yes li:before{color:var(--green)}
.ax .list.no li:before{content:'✕';color:var(--red)}
.ax .quote{border-left:4px solid var(--blue);background:var(--tint);border-radius:0 14px 14px 0;padding:18px 22px;margin:22px 0;color:var(--ink);font-style:italic}
.ax .quote p{color:var(--ink);margin:0}
.ax .stat b{display:block;font-size:40px !important;font-weight:700;letter-spacing:-.02em;color:var(--blue);line-height:1.1}
.ax .stat span{font-size:14.5px !important;color:var(--ink2)}
.ax .scroll{overflow-x:auto}
.ax table.tbl{width:100%;border-collapse:collapse;font-size:14.5px !important;background:#fff;border-radius:16px;overflow:hidden;border:1px solid var(--line)}
.ax table.tbl th,.ax table.tbl td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--line);font-size:14.5px !important;vertical-align:top}
.ax table.tbl th{background:var(--bg);font-weight:700;color:var(--ink)}
.ax table.tbl .us{background:var(--tint);color:var(--blue);font-weight:700}
.ax .faq details{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px 20px;margin-bottom:10px}
.ax .faq summary{cursor:pointer;font-weight:700;color:var(--ink);font-size:16.5px !important;list-style:none}
.ax .faq summary::-webkit-details-marker{display:none}
.ax .faq summary:after{content:'+';float:right;color:var(--blue);font-weight:700}
.ax .faq details[open] summary:after{content:'–'}
.ax .faq details > div{margin-top:10px}
.ax .form{background:#fff;border:1px solid var(--line);border-radius:18px;padding:28px}
.ax .form label{display:block;font-weight:600;font-size:14.5px !important;margin:0 0 6px;color:var(--ink)}
.ax .form input[type=text],.ax .form input[type=email],.ax .form input[type=tel],.ax .form input[type=url],.ax .form input:not([type]),.ax .form select,.ax .form textarea{width:100%;border:1.5px solid var(--line);border-radius:10px;padding:11px 14px;font-size:15px !important;margin-bottom:14px;background:#fff;color:var(--ink);font-family:var(--ax-font)}
.ax .form input:focus,.ax .form select:focus,.ax .form textarea:focus{outline:none;border-color:var(--blue)}
.ax .form button,.ax .form input[type=submit]{width:100%;border:0;border-radius:12px;background:var(--blue);color:#fff;font-weight:700;font-size:16px !important;padding:13px;cursor:pointer}
.ax .form button:hover,.ax .form input[type=submit]:hover{background:var(--blue2)}
/* long reading pages (legal, research, guides) */
.ax .prose{max-width:780px;margin:0 auto}
.ax .prose h2{font-size:clamp(24px,2.6vw,30px) !important;margin:40px 0 12px}
.ax .prose h3{font-size:19px !important;margin:28px 0 8px}
.ax .prose p,.ax .prose li{font-size:17px !important;line-height:1.7}
.ax .prose ul,.ax .prose ol{padding-left:22px;margin:0 0 16px}
.ax .prose li{margin-bottom:6px}
.ax .prose img{border-radius:14px;margin:18px 0}
.ax .cta{padding:72px 0;text-align:center;background:var(--ink)}
.ax .cta h2{color:#fff}
.ax .cta p{color:#c8d1e6;max-width:640px;margin:0 auto 6px}
.ax .cta .btns{justify-content:center}
.ax .cta .btn-s{background:transparent;color:#fff !important;border-color:rgba(255,255,255,.35)}
.ax .cta .btn-s:hover{border-color:#fff}
@media (max-width:980px){
  .ax .g4{grid-template-columns:1fr 1fr}
  .ax .g3{grid-template-columns:1fr 1fr}
}
@media (max-width:860px){
  .ax .g2{grid-template-columns:1fr;gap:28px}
  .ax .sec{padding:48px 0}
  .ax .hero{padding:36px 0 44px}
}
@media (max-width:600px){
  .ax .wrap{padding:0 16px}
  .ax .g3,.ax .g4{grid-template-columns:1fr}
  .ax .btn-p,.ax .btn-s{width:100%;justify-content:center}
}

/* phones: beat custom.css's "* {font-size:3.5vw !important}" inside the header, footer and converted pages */
@media only screen and (max-width:767px){
  .ax,.ax-foot{font-size:16px !important}
  .ax *,.ax-foot *,.ax-bar *{font-size:inherit !important}
  .ax-nav a{font-size:15px !important}
  .ax h1{font-size:34px !important}
  .ax h2{font-size:26px !important}
  .ax h3{font-size:18px !important}
  .ax .eyebrow{font-size:12px !important}
  .ax-foot h3{font-size:12px !important}
  .ax-foot nav a{font-size:14.5px !important}
  .ax-foot-fine,.ax-foot-ai,.ax-foot-sub p,.ax-foot-promo span{font-size:13px !important}
}
