/* NEXGEN AI / PEARL INTELLIGENCE — private local redesign, October 2026.
   Keeps actual front-desk service copy and pricing; no OAuth on demo intake.
   Light editorial UI + believable glass-orb identity, NO neon. */
:root {
  --black:#F7F6F3;
  --void:#F2F1F6;
  --charcoal:#F0EDF5;
  --graphite:#EAE7F0;
  --silver:#232733;
  --muted:#575F71;
  --quiet:#777B8D;
  --line:rgba(56,47,82,.14);
  --soft-line:rgba(56,47,82,.085);
  --glass:rgba(255,255,255,.78);
  --mint:#8375A4;
  --mint-soft:rgba(143,135,158,.10);
  --plum:#8F879E;
  --lavender:#C9C0D9;
  --ink:#232733;
}
html { scroll-behavior:smooth; }
body {background:#F7F6F3;color:var(--ink)}
body::before {
  opacity:1;
  background:
    radial-gradient(ellipse at 82% 3%,rgba(202,192,224,.34),transparent 40%),
    radial-gradient(ellipse at 10% 39%,rgba(235,231,247,.40),transparent 40%),
    linear-gradient(180deg,#F7F6F3 0%,#F0EEF5 54%,#FAF9F7 100%);
}
body::after{opacity:.15;mix-blend-mode:multiply;background-image:radial-gradient(#BDB4CA .65px,transparent 1px);background-size:6px 6px}
::selection{background:#D6CEEA;color:#222132}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible {outline:3px solid #9685BC;outline-offset:3px}
.site { isolation:isolate; }
.nav{
 top:19px;
 border:1px solid rgba(95,90,119,.17);
 background:rgba(252,251,254,.80);
 box-shadow:0 12px 50px rgba(69,58,89,.09),inset 0 1px 0 white;
 backdrop-filter:blur(22px) saturate(150%);
}
.brand-name{color:#29283C}
.brand-sub{color:#817C91}
.nav-symbol{filter:grayscale(1) brightness(.58);opacity:1}
.nav-links{color:#666579}
.nav-links a:hover{background:#EDE9F4;color:#2E2942}
.button{
 border:1px solid rgba(70,62,96,.20);
 background:rgba(255,255,255,.68);
 color:#2D2E3E;
 min-height:47px;
 padding-inline:22px;
 box-shadow:0 2px 10px rgba(69,58,89,.035);
}
.button:hover{border-color:#9387B1;background:#fff;box-shadow:0 7px 21px rgba(69,58,89,.13)}
.button.primary{
 color:white;
 background:linear-gradient(135deg,#504968,#74678F);
 border-color:#635678;
 box-shadow:0 12px 30px rgba(79,67,111,.16),inset 0 1px 0 rgba(255,255,255,.18);
}
.button.primary:hover{background:linear-gradient(135deg,#3D3851,#655A80)}
/* Hero chapter: pair concise editorial copy with a large pearl-glass operational core. */
.hero{
 background:
   radial-gradient(circle at 73% 44%,rgba(196,188,219,.52),transparent 36%),
   radial-gradient(circle at 80% 55%,rgba(250,252,255,.85),transparent 42%),
   linear-gradient(132deg,#F8F7F4,#ECEBF4 58%,#E9E6F3);
 min-height:850px;
 min-height:min(850px,100svh);
}
.hero::before{
 background:
   radial-gradient(ellipse at 72% 51%,rgba(199,190,225,.35),transparent 44%),
   repeating-linear-gradient(0deg,rgba(107,91,144,.025) 0px,rgba(107,91,144,.025) 1px,transparent 1px,transparent 58px),
   repeating-linear-gradient(90deg,rgba(107,91,144,.025) 0px,rgba(107,91,144,.025) 1px,transparent 1px,transparent 58px);
 filter:none;
 transform:none!important;
}
.hero::after{
 background:radial-gradient(circle at 73% 47%,transparent 30%,rgba(255,255,255,.30) 73%);
 opacity:.55;
 mix-blend-mode:normal;
}
.platform-layer {opacity:0!important}
.atmosphere {opacity:.28;filter:grayscale(1) hue-rotate(210deg) brightness(1.8)}
.fog{opacity:.05}
.hero .stage{
 left:73%;bottom:6%;height:250px;width:650px;opacity:.46;
 background:radial-gradient(ellipse at center,rgba(144,128,178,.23),transparent 72%);
 box-shadow:0 0 90px rgba(193,180,222,.14);
}
.hero .core {
 left:73%;top:48%;
 width:min(680px,53vw);
 filter:drop-shadow(0 45px 38px rgba(82,73,120,.14));
}
.core::before{
 position:absolute;content:"";inset:12%;border-radius:50%;z-index:1;
 background:
  radial-gradient(circle at 34% 22%,rgba(255,255,255,.97) 0%,rgba(255,255,255,.50) 13%,transparent 28%),
  radial-gradient(circle at 58% 72%,rgba(124,103,163,.43),transparent 47%),
  radial-gradient(circle at 44% 36%,rgba(237,231,250,.83),rgba(178,166,210,.75) 52%,rgba(118,105,149,.68) 78%,rgba(242,236,249,.75) 100%);
 box-shadow:
  inset -24px -22px 50px rgba(96,81,133,.24),
  inset 24px 20px 54px rgba(255,255,255,.93),
  0 16px 80px rgba(135,119,171,.17),
  0 0 0 1px rgba(255,255,255,.9);
}
.core::after{
 position:absolute;content:"";inset:18%;z-index:2;border-radius:50%;pointer-events:none;
 border:1px solid rgba(255,255,255,.62);
 box-shadow:inset -18px -19px 32px rgba(122,112,165,.09),0 0 30px rgba(255,255,255,.35);
}
.inner-shell{
 inset:25%;z-index:3;
 border-color:rgba(255,255,255,.45);
 background:linear-gradient(135deg,rgba(255,255,255,.30),transparent 58%);
 box-shadow:inset 0 0 30px rgba(255,255,255,.25);
}
.core-brand{opacity:.28;filter:grayscale(1) brightness(.55);mix-blend-mode:multiply;z-index:4}
.core .orbit{border-color:rgba(110,99,151,.26);box-shadow:0 0 12px rgba(187,169,222,.04)}
.core .orbit.o2{border-color:rgba(111,98,151,.12)}
.core .orbit::before{background:#8271A8;box-shadow:0 0 10px rgba(140,124,173,.16)}
.core .trace{background:linear-gradient(90deg,transparent,rgba(135,121,173,.48),transparent);opacity:.5}
.hero .route{background:linear-gradient(90deg,transparent,rgba(118,108,151,.21),transparent);opacity:.60}
.hero .event{
 color:#4A4660;
 background:rgba(255,255,255,.80);
 border:1px solid rgba(119,110,148,.25);
 box-shadow:0 9px 28px rgba(94,78,131,.075);
 backdrop-filter:blur(18px);
 font-size:12px;
}
.hero .event::before{background:#9B8AB8}
.hero .hero-label{
 color:#6F6782;
 letter-spacing:.23em;
 font-size:11px;
 bottom:28px;
}
#particles{opacity:.25;filter:grayscale(1) hue-rotate(220deg)}
/* Make the hero headline part of the same cinematic frame rather than below it. */
.intro{
 position:absolute;top:0;left:0;z-index:11;width:100%;
 min-height:800px;padding:214px 0 0;
 border:0;background:none!important;
 pointer-events:none;
}
.intro .intro-inner{
 margin-left:max(5.5vw,calc((100% - 1160px)/2));
 margin-right:auto;
 max-width:590px;
 text-align:left;
 pointer-events:none;
}
.intro .intro-inner>*{pointer-events:auto}
.intro h1{
 font-size:clamp(53px,5.8vw,82px);
 font-weight:800;
 letter-spacing:-.085em;
 line-height:.98;
 color:#252737;
}
.intro p{max-width:480px;margin:0 0 30px;color:#67687A;font-size:16px;line-height:1.68}
.intro .actions{justify-content:flex-start}
.intro .eyebrow{color:#74678F}
.eyebrow{color:#766C91}
.eyebrow::before{background:#A698C2}
.section{
 padding:112px 0;
 background:transparent;
}
.section.alt{
 background:linear-gradient(180deg,rgba(229,225,239,.46),rgba(251,250,255,.30));
}
.section-head h2,.section h2{color:#272938}
.section-head .section-lead,.section-lead{color:#676C7C}
.glass {
 background:linear-gradient(155deg,rgba(255,255,255,.89),rgba(249,247,253,.65));
 border:1px solid rgba(114,101,152,.15);
 box-shadow:0 22px 70px rgba(80,70,116,.085),inset 0 1px 0 white;
 backdrop-filter:blur(18px);
}
.workflow-visual{
 min-height:420px;
 position:relative;overflow:hidden;
 background:linear-gradient(135deg,rgba(255,255,255,.9),rgba(231,226,246,.59));
}
.workflow-visual::before{
 content:"";position:absolute;inset:0;pointer-events:none;opacity:.44;
 background:radial-gradient(circle at 58% 50%,rgba(196,182,226,.19),transparent 64%);
}
.workflow-visual .mini{
 position:relative;min-height:125px;
 background:rgba(255,255,255,.75);
 border:1px solid rgba(130,117,171,.17);
 box-shadow:0 6px 18px rgba(99,84,131,.04);
}
.mini span{color:#8A7AA7}
.mini b{color:#292C3C}
.workflow-line{background:linear-gradient(90deg,transparent,#A99CC5,transparent)}
.service,.step,.plan,.contact,.form-intro{transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s}
.service:hover,.plan:hover{transform:translateY(-4px);box-shadow:0 29px 76px rgba(75,59,111,.12)}
.service h3{color:#2C2A3F}
.service small{color:#706684}
.code{
 background:#F0EDF7!important;
 color:#5C4F7B;
 border:1px solid #DDD5EB;
}
.step .num{color:#9583B4}
.step h3{color:#2B2A3A}
.plan.featured{border:1px solid rgba(126,106,176,.47);box-shadow:0 25px 75px rgba(110,94,148,.16),inset 0 1px 0 white}
.plan .badge{background:#EAE5F5;border:1px solid #D7CDEA;color:#60547B}
.plan .price{color:#27293B}
.plan .price span{color:#807A8B}
.plan p,.plan li,.service p,.service li,.step p{color:#686B7C}
.plan .button{border-color:#C6BDD8}
.form-intro{background:linear-gradient(148deg,#E9E5F3,#FAF9FC)}
.form-note{margin:0!important;color:#645F77;font-size:13px!important;line-height:1.65!important}
#demo-request-form{background:rgba(255,255,255,.92);padding:30px}
#demo-request-form .form-grid{border:0;margin:0;padding:0;min-width:0}
.field label{color:#3A374A}
input,select,textarea{
 color:#25283C;
 background:#FCFBFD;
 border:1px solid #DAD5E4;
 border-radius:11px;
}
input:focus,select:focus,textarea:focus{outline:2px solid #B9AAD8;outline-offset:1px;border-color:#9B8CB9;box-shadow:0 0 0 3px rgba(178,160,210,.16)}
input::placeholder,textarea::placeholder{color:#9B97A8}
#demo-submit-btn{width:100%;min-height:52px}
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip-path:inset(100%)!important;white-space:nowrap!important}
.note{color:#6D6D7D}
.footer{
 background:#EFEDF5;
 border-color:#DDD8E8;
 color:#696779;
}
.footer .brand-name{color:#343248}
.footer-badge{filter:grayscale(1);opacity:.68}
@media(max-width:980px) {
 .hero .core{left:69%;width:min(620px,60vw)}
 .intro .intro-inner{max-width:50%;margin-left:5vw}
 .intro h1{font-size:clamp(48px,6vw,72px)}
 .section{padding:95px 0}
}
@media(max-width:720px){
 .nav{top:12px;width:calc(100% - 20px);padding:6px 8px 6px 11px;gap:6px;background:rgba(252,251,255,.90)}
 .nav-links{display:none}
 .nav-cta .button{min-height:37px;font-size:11px;padding:0 12px}
 .brand-name{font-size:12px}
 .brand-sub{font-size:8px}
 .hero{min-height:870px}
 .hero .core{left:50%;top:67%;width:min(500px,98vw)}
 .hero .stage{left:50%;width:95vw;bottom:7%;height:200px}
 .hero .event{font-size:10px;padding:8px 10px}
 .hero .hero-label{bottom:12px;font-size:9px;letter-spacing:.13em}
 .intro{padding:122px 0 0;min-height:380px}
 .intro .intro-inner{max-width:none;width:calc(100% - 42px);margin:0 auto}
 .intro h1{font-size:clamp(47px,11.2vw,70px);max-width:620px}
 .intro p{font-size:14px;max-width:550px}
 .intro .actions{gap:9px}
 .intro .button{min-height:43px;padding:0 14px;font-size:12px}
 .section{padding:76px 0}
 .glass{border-radius:22px}
 #demo-request-form{padding:24px}
 .footer{padding:26px 0}
 .footer-badge{display:none}
}
@media(prefers-reduced-motion:reduce){
 .core,.orbit,.event,.inner-shell,.core-brand,.route,.core-particle{animation:none!important;transition:none!important}
 .hero::before{transform:none!important}
 .service:hover,.plan:hover{transform:none}
 html{scroll-behavior:auto}
}


/* QA repair: reserve visual space under mobile CTA before the pearl orb. */
@media(max-width:720px){
  .hero{min-height:1000px!important}
  .hero .core{top:80.5%!important;width:min(350px,92vw)!important}
  .hero .stage{bottom:0!important;opacity:.22}
  .hero .hero-label{display:none}
  .intro{padding-top:118px}
}
