/* CenseoAI, ported brand tokens from the Manus export's client/src/index.css
   (Censeo Solutions Brand Colors block). oklch() used directly, no hex
   approximation, matching the real, current brand. */
:root{
  --navy:oklch(0.30 0.06 250);
  --navy-light:oklch(0.40 0.08 250);
  --blue-accent:oklch(0.58 0.12 240);
  --cta-orange:oklch(0.72 0.18 55);
  --cta-orange-hover:oklch(0.65 0.18 55);
  --success-green:oklch(0.60 0.16 145);
  --light-bg:oklch(0.98 0.002 250);
  --text-dark:oklch(0.25 0.01 250);
  --line:#E3E6EA;
  --font-heading:"Poppins",system-ui,sans-serif;
  --font-body:"Open Sans",system-ui,sans-serif;
}
*{box-sizing:border-box}
body{margin:0;font-family:var(--font-body);color:var(--text-dark);line-height:1.6;background:#fff}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
h1,h2,h3,h4{font-family:var(--font-heading);color:var(--navy);line-height:1.15;margin:0 0 16px}
a{color:var(--blue-accent);text-decoration:none}
.wrap{max-width:1180px;margin-inline:auto;padding-inline:24px}
.site-header .wrap{max-width:1340px}
.nav-links > li > a{white-space:nowrap}

/* ---------- header ---------- */
.site-header{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.95);backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:80px}
.wordmark{font-family:var(--font-heading);font-size:22px;font-weight:700;color:var(--navy)}
.wordmark-ai{color:var(--cta-orange)}
.nav-links{list-style:none;display:flex;gap:28px;margin:0;padding:0;align-items:center}
.nav-links > li > a{font-size:15px;font-weight:600;color:var(--navy);display:inline-flex;align-items:center;gap:5px}
.nav-links > li > a:hover{color:var(--blue-accent)}
.nav-links li.has-sub{position:relative}
.nav-links li.has-sub::after{content:"";position:absolute;top:100%;left:0;right:0;height:12px}
.nav-links li.has-sub .caret{width:11px;height:11px;transition:transform .15s ease}
.nav-links li.has-sub:hover .caret{transform:rotate(180deg)}
.nav-links .submenu{position:absolute;top:100%;left:0;margin-top:8px;min-width:260px;max-height:70vh;overflow-y:auto;
  background:#fff;border:1px solid var(--line);border-radius:10px;padding:8px;list-style:none;
  box-shadow:0 18px 34px rgba(20,32,48,.16);opacity:0;visibility:hidden;transform:translateY(4px);
  transition:opacity .15s ease,transform .15s ease;z-index:90}
.nav-links li.has-sub:hover > .submenu,.nav-links li.has-sub:focus-within > .submenu{opacity:1;visibility:visible;transform:translateY(0)}
.nav-links .submenu li a{display:block;padding:9px 12px;font-size:14px;font-weight:500;color:var(--navy);border-radius:6px}
.nav-links .submenu li a:hover{background:var(--light-bg);color:var(--blue-accent)}
.submenu-label{font-size:11px;font-weight:700;color:#8a94a3;text-transform:uppercase;letter-spacing:.06em;padding:8px 12px 2px}
.header-ctas{display:flex;align-items:center;gap:14px}
.header-call{gap:7px}
.btn,.btn-cta,.btn-outline{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;padding:11px 20px;border-radius:8px;font-weight:700;font-size:14px;white-space:nowrap;transition:transform .1s ease,box-shadow .15s ease,background .15s ease}
/* A handful of CTA buttons have long enough text that forcing them onto
   one line pushes past the viewport on narrow phones (found via the
   2026-08-26 mobile scan). Wrapping to two lines is far better than
   pushing the whole page into horizontal scroll. */
@media(max-width:480px){.btn,.btn-cta,.btn-outline{white-space:normal;text-align:center}}
.btn::before,.btn-cta::before,.btn-outline::before{content:"";position:absolute;top:0;left:8%;right:8%;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.7),transparent);pointer-events:none}
.btn-cta{background:linear-gradient(180deg,#ffc17d 0%,var(--cta-orange) 50%,#c85f0d 100%);color:#fff;border:1px solid rgba(0,0,0,.08);text-shadow:0 1px 1px rgba(0,0,0,.22);box-shadow:inset 0 1.5px 0 rgba(255,255,255,.55),inset 0 -3px 5px rgba(0,0,0,.2),0 10px 22px -8px rgba(180,88,10,.65),0 2px 4px rgba(0,0,0,.25)}
.btn-cta:hover{background:linear-gradient(180deg,#ffcb90 0%,var(--cta-orange-hover) 50%,#b6560c 100%);box-shadow:inset 0 1.5px 0 rgba(255,255,255,.6),inset 0 -3px 5px rgba(0,0,0,.22),0 14px 28px -8px rgba(217,86,10,.6)}
.btn-cta:active{transform:translateY(1px);box-shadow:inset 0 2px 5px rgba(0,0,0,.3)}
.btn-outline{background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,0));border:1.5px solid var(--navy);color:var(--navy);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),inset 0 -2px 3px rgba(20,32,48,.1),0 4px 10px -5px rgba(20,32,48,.35)}
.btn-outline:hover{background:linear-gradient(180deg,#1c3a63,var(--navy));color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.2),inset 0 -2px 4px rgba(0,0,0,.3),0 12px 22px -8px rgba(20,32,48,.65)}
.btn-outline:active{transform:translateY(1px)}
.btn-mob{display:none}

/* ---------- mobile menu ---------- */
.navtoggle{position:absolute;width:1px;height:1px;opacity:0}
.burger{display:none}
.mobile-bottom-bar{display:none}
@media(max-width:900px){
  .header-ctas > *:not(.btn-cta){display:none}
  .nav{position:relative}
  .burger{display:grid;place-items:center;width:44px;height:44px;border:1.5px solid var(--navy);border-radius:8px;cursor:pointer;order:3}
  .burger > span,.burger > span::before,.burger > span::after{display:block;width:20px;height:2px;background:var(--navy);content:""}
  .burger > span{position:relative}
  .burger > span::before{position:absolute;top:-6px;left:0}
  .burger > span::after{position:absolute;top:6px;left:0}
  .menu-panel{display:none}
  .navtoggle:checked ~ .menu-panel{
    display:flex;flex-direction:column;position:absolute;right:0;top:calc(100% + 8px);left:0;
    background:#fff;border:1px solid var(--line);border-radius:10px;padding:14px;
    box-shadow:0 18px 34px rgba(20,32,48,.16);z-index:80}
  .navtoggle:checked ~ .menu-panel .nav-links{flex-direction:column;align-items:stretch;gap:0}
  .navtoggle:checked ~ .menu-panel .nav-links > li > a{padding:12px 4px;border-bottom:1px solid var(--line)}
  .nav-links .submenu{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:none;padding-left:12px}
  .btn-mob{display:flex;margin-top:12px}
  .mobile-bottom-bar{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:70;background:#fff;border-top:1px solid var(--line);height:56px}
  .mobile-bottom-bar a{flex:1;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:var(--navy);border-right:1px solid var(--line)}
  .mobile-bottom-bar a.cta{background:var(--cta-orange);color:#fff;border-right:none}
  main{padding-bottom:56px}
}

/* ---------- footer ---------- */
.site-footer{position:relative;background:radial-gradient(1100px 420px at 18% -8%,rgba(56,110,190,.35),transparent 60%),radial-gradient(900px 360px at 100% 0%,rgba(251,146,60,.10),transparent 55%),linear-gradient(180deg,#172c4f 0%,#0b1a2e 100%);color:#cfd6e0;padding:72px 0 32px;box-shadow:inset 0 1px 0 rgba(255,255,255,.1);overflow:hidden}
.site-footer::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.10) 1px,transparent 1px);background-size:26px 26px;opacity:.12;pointer-events:none}
.site-footer .wrap{position:relative}
.foot-grid{display:grid;grid-template-columns:1.6fr repeat(4,1fr);gap:40px}
@media(max-width:1100px){.foot-grid{grid-template-columns:1fr 1fr 1fr;row-gap:36px}}
@media(max-width:900px){.foot-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.foot-grid{grid-template-columns:1fr}}
.foot-brand{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.09);border-left:3px solid var(--cta-orange);border-radius:12px;padding:22px 22px 24px;box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 14px 26px -18px rgba(0,0,0,.6);margin-top:-4px}
.foot-logo{height:36px;width:auto;display:block;margin-bottom:18px;filter:brightness(0) invert(1)}
.foot-blurb{font-size:14px;line-height:1.6;color:#aab4c2;max-width:32ch;margin:0}
.site-footer address{font-style:normal;font-size:13px;color:#aab4c2;margin:14px 0 0}
.site-footer h4{display:flex;align-items:center;gap:10px;color:#fff;font-size:13px;text-transform:uppercase;letter-spacing:.08em;margin:0 0 18px}
.foot-h-badge,.icon-badge{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;flex-shrink:0;background:linear-gradient(155deg,#ffbb78 0%,var(--cta-orange) 55%,#d9560a 100%);box-shadow:inset 0 1.5px 1px rgba(255,255,255,.6),inset 0 -2px 4px rgba(0,0,0,.3),0 5px 12px -3px rgba(217,86,10,.55),0 1px 2px rgba(0,0,0,.4)}
.foot-h-icon,.icon-badge svg{color:#fff;filter:drop-shadow(0 1px 1px rgba(0,0,0,.35))}
.site-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.site-footer ul a,.site-footer ul li{font-size:14px;color:#cfd6e0}
.site-footer ul a:hover{color:#fff}
.review-link{color:#fbbf24 !important}
.foot-linkedin{display:inline-flex;align-items:center;gap:8px;font-size:14px;color:#cfd6e0;margin-top:16px}
.foot-linkedin:hover{color:#fff}
.foot-linkedin svg{flex-shrink:0}
.foot-powered{font-size:12px;color:#8a94a3;font-style:italic;margin:20px 0 0}
.foot-areas{position:relative;margin-top:44px;padding:32px;border-radius:16px;background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 20px 40px -20px rgba(0,0,0,.65);display:grid;grid-template-columns:1.3fr 1fr;gap:40px;align-items:stretch}
.foot-areas::before,.foot-services::before{content:"";position:absolute;top:0;left:24px;right:24px;height:3px;border-radius:0 0 3px 3px;background:linear-gradient(90deg,var(--cta-orange),#fbbf24)}
@media(max-width:800px){.foot-areas{grid-template-columns:1fr}}
.areas-grid{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}
.areas-grid span{position:relative;display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;color:#fff;letter-spacing:.01em;background:linear-gradient(160deg,rgba(255,255,255,.2) 0%,rgba(255,255,255,.06) 45%,rgba(0,0,0,.12) 100%);border:1px solid rgba(255,255,255,.25);border-radius:22px;padding:9px 18px 9px 14px;box-shadow:inset 0 1.5px 0 rgba(255,255,255,.3),inset 0 -2px 3px rgba(0,0,0,.2),0 8px 16px -6px rgba(0,0,0,.6);transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease;overflow:hidden}
.areas-grid span::after{content:"";position:absolute;top:0;left:8%;right:8%;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent)}
.areas-grid span::before{content:"";width:8px;height:8px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#ffe0b0,var(--cta-orange) 55%,#c24d09);box-shadow:0 0 8px rgba(251,146,60,.85),inset 0 -1px 1px rgba(0,0,0,.35);flex-shrink:0}
.areas-grid span:hover{transform:translateY(-3px) scale(1.04);border-color:rgba(251,146,60,.6);box-shadow:inset 0 1.5px 0 rgba(255,255,255,.35),inset 0 -2px 3px rgba(0,0,0,.2),0 14px 24px -8px rgba(251,146,60,.4)}
.foot-map{position:relative;border-radius:14px;overflow:hidden;border:1px solid rgba(251,146,60,.35);min-height:200px;display:flex;box-shadow:0 18px 36px -16px rgba(0,0,0,.65),inset 0 1px 0 rgba(255,255,255,.1),0 0 0 4px rgba(255,255,255,.03)}
.foot-map iframe{width:100%;height:100%;min-height:200px;border:0;display:block;flex:1}
.foot-map-link{position:absolute;top:12px;left:12px;background:#fff;color:var(--navy);font-size:12.5px;font-weight:600;padding:6px 12px;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,.25)}
.foot-map-link:hover{color:var(--navy)}
.foot-services{position:relative;margin-top:28px;padding:32px;border-radius:16px;background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 20px 40px -20px rgba(0,0,0,.65)}
.foot-services-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px 20px;margin-top:4px}
@media(max-width:900px){.foot-services-grid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.foot-services-grid{grid-template-columns:1fr}}
.foot-services-grid a{font-size:13.5px;color:#aab4c2;padding:7px 10px;border-radius:8px;margin:-7px -10px;display:block;transition:background .15s ease,color .15s ease}
.foot-services-grid a:hover{color:#fff;background:rgba(255,255,255,.07)}
.foot-base{border-top:1px solid rgba(255,255,255,.14);margin-top:36px;padding-top:26px;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px}
.foot-base p{margin:0;font-size:13px;color:#aab4c2}
.foot-legal{display:flex;gap:20px}
.foot-legal a{font-size:13px;color:#aab4c2}
.foot-legal a:hover{color:#fff}

/* ---------- generic page content ---------- */
main{min-height:60vh}
.hero{padding:72px 0;background:linear-gradient(135deg,var(--navy),var(--navy-light));color:#fff}
.hero h1{color:#fff;font-size:clamp(32px,5vw,48px)}
.hero p{font-size:18px;color:#dbe1ea;max-width:60ch}
.hero[style*="text-align:center"] p{margin-inline:auto}
.section{padding:56px 0}
.section.alt{background:var(--light-bg)}
.section h2{font-size:clamp(24px,3vw,32px)}
.section .lede{font-size:17px;color:#535364;max-width:70ch}
.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:28px}
@media(max-width:800px){.card-grid{grid-template-columns:1fr}}
/* Site-wide mobile fix, 2026-08-26: any inline grid-template-columns (used
   throughout the build scripts for card-grid overrides and one-off
   multi-column layouts) locks out the responsive collapse above, since an
   inline style always wins over an external stylesheet's media query,
   regardless of specificity. An external !important is the one thing that
   can still override an inline style, so this collapses every inline grid
   to a single column below 800px without touching any of the ~110 build
   scripts that set grid-template-columns inline. Found via a site-wide
   scan: 108 of 127 pages had horizontal overflow on mobile from this. */
@media(max-width:800px){[style*="grid-template-columns"]{grid-template-columns:1fr!important}}
/* Comparison tables (15 pages use one) have no responsive handling at all
   and push the whole page into horizontal scroll on phones. Let the table
   itself scroll instead of the page: display:block plus overflow-x keeps
   the table's own internal layout (thead/tr/td keep their table display
   roles) while making the outer box scrollable. Desktop is untouched. */
@media(max-width:800px){table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}}
/* Companion fix: a couple of cards use inline grid-column:span 2 to fill
   an odd row on desktop. With the container forced to one column above,
   an item still asking to span 2 columns makes the browser implicitly
   generate a second column just to satisfy it, silently reintroducing
   the exact overflow this was meant to fix. Reset it to auto on mobile. */
@media(max-width:800px){[style*="grid-column"]{grid-column:auto!important}}
/* 2026-08-26: the homepage hero video is scaled 1.5x (transform-origin
   left top) to look bigger inside its desktop grid column. On mobile that
   column is full-width already (see the grid fix above), so the extra
   1.5x scale just pushes the video far past the right edge. Turn it off
   below the same breakpoint the hero grid collapses at. */
@media(max-width:800px){[style*="transform:scale(1.5)"]{transform:none!important}}
/* 2026-08-26: the mobile dropdown nav (Services expanded inline) can be
   taller than the viewport, and had no scroll/height limit of its own, so
   Solutions/How It Works/FAQ/About ended up hidden below the fixed bottom
   bar with no way to reach them. Give the panel its own scroll area sized
   to the space actually available, and make sure it draws above the
   bottom bar regardless of source order. */
@media(max-width:900px){
  .navtoggle:checked ~ .menu-panel{max-height:calc(100vh - 140px);overflow-y:auto;z-index:90}
}
/* 2026-08-26: the footer sits after <main> (which already has 56px of its
   own padding-bottom for this), so its own last row, Admin Login/Privacy
   Policy/Terms/SMS Terms, was left sitting right behind the fixed mobile
   Call/Book a Call/Free Consult bar. */
@media(max-width:900px){.site-footer{padding-bottom:calc(32px + 56px)}}
/* 2026-08-26: floating scroll-to-bottom/scroll-to-top button. Deliberately
   separate from the header, dropdown nav, and mobile Call/Book/Consult
   bar, a small glass-look circle bottom-right that reads the page's
   scroll position and flips between the two directions on its own. */
.scroll-fab{position:fixed;right:16px;bottom:24px;z-index:60;width:46px;height:46px;border-radius:50%;background:rgba(20,47,75,.4);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.35);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 8px 20px -8px rgba(0,0,0,.45);transition:background .2s ease,transform .15s ease;padding:0}
.scroll-fab:hover{background:rgba(20,47,75,.6);transform:translateY(-2px)}
.scroll-fab:active{transform:translateY(0)}
.scroll-fab svg{width:20px;height:20px;color:#fff}
@media(max-width:900px){.scroll-fab{bottom:72px}}
.card{background:linear-gradient(180deg,#fff,#fbfcfe);border:1px solid var(--line);border-radius:18px;padding:28px;box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 2px 5px rgba(20,32,48,.06),0 22px 40px -16px rgba(20,32,48,.28);transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s ease}
.card:hover{transform:translateY(-8px);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 4px 10px rgba(20,32,48,.08),0 36px 56px -18px rgba(20,32,48,.4)}
.card h3{font-size:17px;margin-bottom:8px;letter-spacing:-.01em}
.card p{font-size:14.5px;color:#535364;margin:0;line-height:1.6}
.card-photo{margin:-28px -28px 20px;height:160px;background-size:cover;background-position:center;border-radius:18px 18px 0 0;box-shadow:0 6px 12px -6px rgba(20,32,48,.35)}
.feature-row{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;margin-bottom:28px}
@media(max-width:800px){.feature-row{grid-template-columns:1fr}}
.feature-photo{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:18px;box-shadow:0 22px 40px -16px rgba(20,32,48,.35),0 2px 6px rgba(20,32,48,.12);border:1px solid rgba(255,255,255,.6)}
.glass-pill{position:relative;display:inline-block;background:linear-gradient(180deg,rgba(255,255,255,.4),rgba(255,255,255,.08));border:1px solid rgba(255,255,255,.4);border-radius:999px;padding:7px 16px;font-size:14px;font-weight:600;color:#fff;box-shadow:inset 0 1.5px 0 rgba(255,255,255,.65),inset 0 -6px 10px -6px rgba(0,0,0,.3),0 6px 14px -4px rgba(0,0,0,.4)}
.emboss-stat{font-size:32px;font-weight:800;color:var(--cta-orange);text-shadow:0 1px 0 rgba(255,255,255,.7),0 -1px 0 rgba(0,0,0,.1)}

/* ---------- data visualization: coded charts, never AI-generated ---------- */
.chart-donut{position:relative;width:140px;height:140px;border-radius:50%;margin:0 auto;background:conic-gradient(var(--chart-color,var(--cta-orange)) calc(var(--pct)*1%),var(--line) 0);box-shadow:0 10px 24px -12px rgba(20,32,48,.35),inset 0 1px 0 rgba(255,255,255,.5);display:flex;align-items:center;justify-content:center}
.chart-donut::before{content:"";position:absolute;inset:16px;border-radius:50%;background:#fff;box-shadow:inset 0 2px 6px rgba(20,32,48,.1)}
.chart-donut span{position:relative;font-family:var(--font-heading);font-size:28px;font-weight:800;color:var(--navy)}
.chart-donut-sm{width:72px;height:72px}
.chart-donut-sm::before{inset:9px}
.chart-donut-sm span{font-size:15px}
.chart-bars{display:grid;gap:16px}
.chart-bar-label{display:flex;justify-content:space-between;align-items:baseline;font-size:13.5px;color:#535364;margin-bottom:6px}
.chart-bar-label strong{font-family:var(--font-heading);font-size:15px;color:var(--navy)}
.chart-bar-track{background:var(--light-bg);border:1px solid var(--line);border-radius:999px;height:12px;overflow:hidden;box-shadow:inset 0 2px 4px rgba(20,32,48,.08)}
.chart-bar-fill{height:100%;border-radius:999px;background:var(--chart-color,linear-gradient(90deg,var(--navy-light),var(--cta-orange)));box-shadow:inset 0 1px 0 rgba(255,255,255,.4)}
.chart-trend{display:block;width:100%;height:auto}
.chart-trend-labels{display:flex;justify-content:space-between;font-size:13px;color:#535364;margin-top:6px}
.chart-trend-labels strong{font-family:var(--font-heading);font-size:16px;color:var(--navy)}
/* ---------- scripted demo widget (no live backend, sample responses only) ---------- */
.demo-widget{background:linear-gradient(180deg,#fff,#fbfcfe);border:1px solid var(--line);border-radius:18px;padding:28px;box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 2px 5px rgba(20,32,48,.06),0 22px 40px -16px rgba(20,32,48,.28)}
.demo-prompts{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0 20px}
.demo-prompt-btn{background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,0));border:1.5px solid var(--navy);color:var(--navy);border-radius:999px;padding:9px 16px;font-size:13.5px;font-weight:600;cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 2px 6px -3px rgba(20,32,48,.25);transition:transform .1s ease,box-shadow .15s ease,background .15s ease}
.demo-prompt-btn:hover{background:var(--navy);color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 4px 10px -4px rgba(20,32,48,.5)}
.demo-prompt-btn:active{transform:translateY(1px)}
.demo-prompt-btn:disabled{opacity:.5;cursor:default}
.demo-chat{background:var(--light-bg);border:1px solid var(--line);border-radius:14px;padding:20px;min-height:150px;box-shadow:inset 0 2px 6px rgba(20,32,48,.06)}
.demo-chat-empty{color:#8a94a3;font-size:14px;text-align:center;padding:24px 0}
.demo-msg{display:flex;gap:12px;margin-bottom:16px;align-items:flex-start}
.demo-msg:last-child{margin-bottom:0}
.demo-msg-avatar{width:30px;height:30px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;box-shadow:inset 0 1px 1px rgba(255,255,255,.5),0 2px 6px -2px rgba(0,0,0,.3)}
.demo-msg-user .demo-msg-avatar{background:linear-gradient(155deg,#5b7aa8,var(--navy) 60%,#0d1f36);color:#fff}
.demo-msg-ai .demo-msg-avatar{background:linear-gradient(155deg,#ffbb78,var(--cta-orange) 55%,#d9560a);color:#fff}
.demo-msg-body{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px;font-size:14px;color:#3d4657;line-height:1.6;box-shadow:0 2px 6px -3px rgba(20,32,48,.15)}
.demo-msg-body p{margin:0 0 8px}
.demo-msg-body p:last-child{margin-bottom:0}
.demo-typing{display:inline-flex;gap:4px;padding:4px 0}
.demo-typing span{width:6px;height:6px;border-radius:50%;background:var(--cta-orange);opacity:.4;animation:demo-typing-pulse 1s infinite ease-in-out}
.demo-typing span:nth-child(2){animation-delay:.15s}
.demo-typing span:nth-child(3){animation-delay:.3s}
@keyframes demo-typing-pulse{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
.demo-disclosure{font-size:12px;color:#8a94a3;margin-top:14px;text-align:center}
@media(prefers-reduced-motion:reduce){.demo-typing span{animation:none;opacity:.7}}
.card-tag{position:relative;display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;letter-spacing:.02em;border-radius:999px;padding:4px 12px 4px 10px;margin-bottom:8px;box-shadow:inset 0 1px 0 rgba(255,255,255,.7),inset 0 -2px 3px rgba(0,0,0,.06),0 4px 10px -4px rgba(20,32,48,.3)}
.card-tag::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.8;flex-shrink:0}
.phase-badge,.accent-badge{display:inline-flex;align-items:center;text-transform:uppercase;font-size:11.5px;font-weight:800;letter-spacing:.06em;color:#4a2405;background:linear-gradient(155deg,#ffe0b0 0%,var(--cta-orange) 60%,#c85f0d 100%);border-radius:999px;padding:5px 13px;box-shadow:inset 0 1.5px 0 rgba(255,255,255,.65),inset 0 -2px 3px rgba(0,0,0,.2),0 5px 12px -4px rgba(0,0,0,.45)}
.vertical-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;margin-top:28px;text-align:left}
@media(max-width:900px){.vertical-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.vertical-grid{grid-template-columns:1fr}}
.vertical-card{position:relative;border-radius:16px;overflow:hidden;aspect-ratio:3/4;background-size:cover;background-position:center;display:flex;align-items:flex-end;box-shadow:0 3px 8px rgba(20,32,48,.18),0 28px 48px -18px rgba(20,32,48,.45);border:1px solid rgba(255,255,255,.5);transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s ease}
.vertical-card:hover{transform:translateY(-8px) scale(1.015);box-shadow:0 6px 14px rgba(20,32,48,.22),0 40px 64px -20px rgba(20,32,48,.55)}
.vertical-card::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(30,58,95,0) 30%,rgba(20,26,38,.92) 88%)}
.vertical-card-body{position:relative;z-index:1;padding:18px}
.vertical-card-tag{display:inline-block;font-size:13px;font-weight:700;color:#fff;margin-bottom:8px;line-height:1.3}
.vertical-card-body p{font-size:13px;color:#dbe1ea;margin:0 0 10px;line-height:1.5}
.vertical-card-body a{font-size:13px;color:#fff;font-weight:600}
.vertical-card-body a:hover{color:var(--cta-orange)}
.faq-item{background:var(--light-bg);border-radius:10px;padding:20px 22px;margin-bottom:14px}
.faq-item h3{font-size:16px;margin-bottom:8px}
.faq-item p{margin:0;color:#3d4657}
.cta-band{background:var(--navy);color:#fff;text-align:center;padding:56px 0}
.cta-band h2{color:#fff}
.cta-band p{color:#dbe1ea;max-width:56ch;margin:0 auto 28px}
.breadcrumb{font-size:13px;color:#8a94a3;margin-bottom:20px}
.breadcrumb a{color:#8a94a3}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- forms (contact page) ---------- */
.form-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:32px;box-shadow:0 12px 30px -14px rgba(20,32,48,.18)}
.form-fieldset{border:0;padding:0;margin:0 0 32px}
.form-fieldset:last-of-type{margin-bottom:0}
.form-fieldset legend{font-family:var(--font-heading);font-weight:700;color:var(--navy);font-size:18px;padding:0 0 10px;width:100%;border-bottom:1px solid var(--line);margin-bottom:20px}
.form-fieldset .fieldset-hint{color:#8a94a3;font-size:13px;margin:-14px 0 20px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px}
@media(max-width:640px){.form-row{grid-template-columns:1fr}}
.form-field{margin-bottom:20px}
.form-field:last-child{margin-bottom:0}
.form-field label{display:block;font-size:14px;font-weight:600;color:var(--navy);margin-bottom:6px}
.form-field .optional{color:#8a94a3;font-weight:400}
.form-field .required{color:#c0392b}
.form-field input[type="text"],.form-field input[type="email"],.form-field input[type="tel"],.form-field input[type="url"],.form-field select,.form-field textarea{
  width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:8px;font-family:var(--font-body);font-size:15px;color:var(--text-dark);background:#fff}
.form-field input:focus,.form-field select:focus,.form-field textarea:focus{outline:2px solid var(--cta-orange);outline-offset:1px;border-color:transparent}
.form-field textarea{resize:vertical;min-height:110px}
.radio-group{display:flex;flex-wrap:wrap;gap:18px}
.radio-group label{display:flex;align-items:center;gap:8px;font-size:14.5px;font-weight:400;color:var(--text-dark);margin-bottom:0}
.radio-group input{width:16px;height:16px}
.form-consent{font-size:12.5px;color:#8a94a3;line-height:1.55;display:flex;gap:10px;align-items:flex-start;margin-top:24px}
.form-consent input{margin-top:3px;flex-shrink:0}
.form-submit{margin-top:28px;padding-top:24px;border-top:1px solid var(--line);text-align:right}
.form-submit .btn-cta{border:0;cursor:pointer;font-size:15px}