*{box-sizing:border-box}html{scroll-behavior:smooth}:root{--bg:#070b16;--panel:#0d1425;--panel2:#111a2e;--line:#ffffff16;--text:#f8fafc;--muted:#91a0b7;--accent:#7c3aed;--accent2:#06b6d4;--green:#22c55e;--red:#ef4444;--amber:#f59e0b}body{margin:0;background:radial-gradient(circle at 10% 0,#7c3aed1d,transparent 28%),radial-gradient(circle at 90% 10%,#06b6d41a,transparent 24%),var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;min-height:100vh}a{color:inherit;text-decoration:none}.wrap{width:min(1180px,calc(100% - 36px));margin:auto}.nav{height:74px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{font-size:20px;font-weight:850;display:flex;align-items:center;gap:11px}.brandmark{width:36px;height:36px;border-radius:11px;background:linear-gradient(135deg,var(--accent),var(--accent2));display:grid;place-items:center}.links{display:flex;align-items:center;gap:12px}.links a{font-size:14px;color:#c5cfdd}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);background:#ffffff08;color:#fff;border-radius:12px;padding:11px 15px;font-weight:750;font-size:14px;cursor:pointer}.btn:hover{border-color:#ffffff2f}.btn.primary{background:linear-gradient(135deg,var(--accent),#2563eb);border:0}.btn.danger{background:#ef444414;border-color:#ef44443b;color:#fecaca}.hero{padding:88px 0 64px;display:grid;grid-template-columns:1.04fr .96fr;gap:62px;align-items:center}.eyebrow{color:#b9a7ff;font-weight:800;text-transform:uppercase;letter-spacing:1.6px;font-size:12px}.hero h1{font-size:clamp(48px,7vw,84px);line-height:.98;letter-spacing:-4px;margin:15px 0 22px}.grad{background:linear-gradient(90deg,#fff,#a995ff 50%,#67e8f9);-webkit-background-clip:text;background-clip:text;color:transparent}.hero p{color:var(--muted);font-size:18px;line-height:1.8}.hero-card{border:1px solid var(--line);background:#0e1729cc;backdrop-filter:blur(18px);border-radius:28px;padding:22px;box-shadow:0 28px 90px #0008}.mock{border:1px solid var(--line);background:#08101f;border-radius:20px;padding:22px;min-height:340px}.mock .dots{display:flex;gap:6px}.mock .dots i{width:8px;height:8px;border-radius:50%;background:#334155}.mock .dots i:first-child{background:#8b5cf6}.chart{height:150px;margin-top:55px;position:relative;overflow:hidden}.chart:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 30%,#7c3aed2d 31%,#06b6d42a 60%,transparent 61%);clip-path:polygon(0 80%,15% 55%,30% 68%,46% 30%,60% 53%,77% 20%,100% 35%,100% 100%,0 100%)}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}.stat{padding:13px;border:1px solid var(--line);background:#ffffff05;border-radius:13px}.stat small{color:#718096}.stat b{display:block;margin-top:4px}.section{padding:62px 0}.section h2{font-size:38px;letter-spacing:-1.7px;margin:0 0 8px}.section .lead{color:var(--muted);line-height:1.7}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:26px}.card{border:1px solid var(--line);background:#ffffff05;border-radius:19px;padding:23px}.card h3{margin:0 0 8px}.card p{color:var(--muted);line-height:1.7;font-size:14px}.authshell{min-height:calc(100vh - 74px);display:grid;place-items:center;padding:42px 0}.authbox{width:min(500px,100%);border:1px solid var(--line);background:#0d1425e8;border-radius:24px;padding:28px;box-shadow:0 28px 90px #0006}.authbox h1{margin:0 0 8px;letter-spacing:-1.2px}.muted{color:var(--muted)}form{margin:0}.field{margin:16px 0}.field label{display:block;font-size:13px;font-weight:750;margin-bottom:7px;color:#d8e0eb}.input,.select,.textarea{width:100%;border:1px solid var(--line);background:#080f1e;color:#fff;border-radius:12px;padding:12px 13px;outline:none}.textarea{min-height:100px;resize:vertical}.input:focus,.select:focus,.textarea:focus{border-color:#7c3aed88}.flash{padding:12px 14px;border-radius:12px;margin:14px 0;border:1px solid}.flash.success{background:#22c55e10;border-color:#22c55e3b;color:#bbf7d0}.flash.error{background:#ef444410;border-color:#ef44443b;color:#fecaca}.dash{padding:36px 0 70px}.dashhead{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:26px}.dashhead h1{margin:0;letter-spacing:-1.5px}.grid2{display:grid;grid-template-columns:1.2fr .8fr;gap:18px}.panel{border:1px solid var(--line);background:#0d1425bf;border-radius:18px;padding:20px}.panel h2,.panel h3{margin-top:0}.site{border:1px solid var(--line);background:#ffffff04;border-radius:15px;padding:16px;margin:12px 0;display:flex;justify-content:space-between;align-items:center;gap:15px}.site strong{display:block;margin-bottom:4px}.site small{color:var(--muted)}.actions{display:flex;flex-wrap:wrap;gap:8px}.status{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:999px;font-size:11px;font-weight:800}.status.green{background:#22c55e16;color:#86efac}.status.amber{background:#f59e0b16;color:#fcd34d}.status.gray{background:#94a3b816;color:#cbd5e1}.code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;background:#030712;border:1px solid var(--line);padding:11px 12px;border-radius:10px;word-break:break-all;font-size:12px;color:#c4b5fd}.table{width:100%;border-collapse:collapse}.table th,.table td{padding:12px 9px;border-bottom:1px solid var(--line);text-align:left;font-size:13px}.table th{color:#8290a7;font-size:11px;text-transform:uppercase;letter-spacing:.8px}.help{padding:14px;border:1px dashed #7c3aed55;border-radius:13px;background:#7c3aed0c;color:#aab5c6;font-size:13px;line-height:1.7}.footer{border-top:1px solid var(--line);padding:24px 0;color:#64748b;font-size:13px;margin-top:45px}@media(max-width:900px){.hero,.grid2{grid-template-columns:1fr}.hero{padding-top:50px}.hero h1{letter-spacing:-2.7px}.cards{grid-template-columns:1fr}.links .hide-sm{display:none}.dashhead{align-items:flex-start;flex-direction:column}.site{align-items:flex-start;flex-direction:column}}@media(max-width:520px){.wrap{width:min(100% - 26px,1180px)}.nav{height:66px}.hero{padding:42px 0}.hero p{font-size:16px}.stats{grid-template-columns:1fr}.authbox{padding:21px}.actions .btn{flex:1}.table{display:block;overflow:auto}}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:0 0 18px}.kpi{border:1px solid var(--line);background:#ffffff05;border-radius:17px;padding:18px}.kpi small{color:#8290a7;letter-spacing:1px;font-size:11px}.kpi b{display:block;font-size:28px;margin-top:6px;letter-spacing:-1px}
.topbar{position:sticky;top:0;z-index:100;background:#070b16f2;backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}.topbar .nav{height:68px;border:0;display:flex;align-items:center;justify-content:space-between;gap:24px}.public-nav{display:flex;align-items:center;gap:10px}.public-nav>a:not(.btn){font-size:13px;font-weight:700;color:#aab6c8;padding:9px 10px;border-radius:10px}.public-nav>a:not(.btn):hover{background:#ffffff08;color:#fff}
.navicon{width:20px;height:20px;display:block}.bellicon{width:40px;height:40px;border:1px solid var(--line);border-radius:12px;display:grid;place-items:center;position:relative;color:#cbd5e1;background:#ffffff05}.bellicon:hover,.bellicon.active{background:#ffffff0b;color:#fff}.badge{position:absolute;top:-5px;right:-5px;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:#ef4444;color:#fff;border:2px solid #070b16;display:grid;place-items:center;font-size:9px;font-weight:900}
.navmore{position:relative}.navmore summary{list-style:none;cursor:pointer}.navmore summary::-webkit-details-marker{display:none}.avatar{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,#7c3aed,#2563eb);font-weight:900;color:#fff}.navmenu{position:absolute;top:48px;right:0;width:250px;padding:8px;border:1px solid var(--line);border-radius:14px;background:#0b1221;box-shadow:0 22px 70px #000a;display:grid;gap:3px;z-index:140}.navmenu a{padding:11px 12px;border-radius:9px;color:#cbd5e1;font-size:13px}.navmenu a:hover{background:#ffffff09;color:#fff}.navmenu strong,.navmenu small{padding:5px 12px;overflow:hidden;text-overflow:ellipsis}.navmenu small{color:var(--muted);padding-top:0;border-bottom:1px solid var(--line);padding-bottom:10px;margin-bottom:4px}
.app-auth{padding-left:248px}.app-sidebar{position:fixed;left:0;top:0;bottom:0;width:248px;background:#09111f;border-right:1px solid var(--line);z-index:120;display:flex;flex-direction:column}.sidebar-brand{height:72px;display:flex;align-items:center;padding:0 20px;border-bottom:1px solid var(--line)}.sidebar-brand .brand{font-size:19px}.sidebar-nav{padding:18px 14px;overflow:auto;flex:1}.side-group{display:grid;gap:4px;margin-bottom:22px}.side-label{padding:0 10px 7px;color:#59677c;font-size:10px;font-weight:900;letter-spacing:1.4px}.side-link{display:flex;align-items:center;gap:11px;min-height:42px;padding:0 12px;border-radius:11px;color:#99a7bb;font-size:13px;font-weight:750}.side-link:hover{background:#ffffff07;color:#eef2ff}.side-link.active{background:linear-gradient(90deg,#7c3aed20,#2563eb0d);color:#fff;box-shadow:inset 3px 0 #8b5cf6}.side-dot{width:7px;height:7px;border-radius:50%;background:#3a475b;flex:0 0 auto}.side-link.active .side-dot{background:#a78bfa;box-shadow:0 0 0 4px #7c3aed20}.sidebar-bottom{padding:14px;border-top:1px solid var(--line);display:grid;gap:6px}.side-language,.side-logout{min-height:40px;display:flex;align-items:center;gap:10px;padding:0 10px;border-radius:10px;color:#8f9db2;font-size:12px;font-weight:750}.side-language:hover,.side-logout:hover{background:#ffffff07;color:#fff}.side-language span{width:29px;height:25px;display:grid;place-items:center;border:1px solid var(--line);border-radius:7px;color:#d7deea;font-size:10px;font-weight:900}
.app-topbar{position:sticky;top:0;z-index:100;height:64px;background:#070b16ec;backdrop-filter:blur(18px);border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 24px}.app-topbar .topbar-spacer{flex:1}.app-topbar .nav-tools{display:flex;align-items:center;gap:9px;margin-left:auto}.app-topbar .mobile-brand{display:none}.app-auth .mobile-nav{display:none}.app-auth .dash{padding-top:28px}.app-auth .footer{margin-top:30px}.app-auth .wrap{width:min(1120px,calc(100% - 48px))}
.mobile-nav{display:none;position:relative}.mobile-nav>summary{list-style:none;width:40px;height:40px;border:1px solid var(--line);border-radius:11px;display:grid;place-items:center;cursor:pointer;font-size:20px}.mobile-nav>summary::-webkit-details-marker{display:none}.mobile-menu{position:absolute;right:0;top:48px;width:min(310px,calc(100vw - 28px));padding:10px;border:1px solid var(--line);border-radius:16px;background:#0b1221;box-shadow:0 24px 80px #000c;display:grid;z-index:140}.mobile-menu a{padding:12px;border-radius:10px;color:#d5deea;font-weight:700;font-size:14px;display:flex;align-items:center;gap:10px}.mobile-menu a:hover{background:#ffffff08}.badge-inline{margin-left:auto;background:#ef4444;color:#fff;border-radius:999px;padding:2px 7px;font-size:10px}
.notification-head-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.unread-summary{display:inline-flex;align-items:center;gap:7px;padding:9px 12px;border:1px solid var(--line);border-radius:12px;background:#ffffff05;color:#cbd5e1;font-size:13px}.notification-list{display:grid;gap:10px}.notification-card{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:14px;align-items:center;border:1px solid var(--line);background:#0d1425a8;border-radius:17px;padding:16px 18px}.notification-card.unread{background:linear-gradient(90deg,#7c3aed12,#0d1425d9 35%);border-color:#7c3aed45;box-shadow:inset 3px 0 #8b5cf6}.notification-icon{width:44px;height:44px;border-radius:13px;background:#ffffff08;border:1px solid var(--line);display:grid;place-items:center}.notice-svg{width:21px;height:21px;color:#c4b5fd}.notification-body{min-width:0}.notification-title-row{display:flex;align-items:center;gap:8px}.notification-body p{margin:5px 0;color:#aab6c8;line-height:1.5;font-size:13px}.notification-body time{font-size:11px;color:#68758a}.new-pill{padding:3px 6px;border-radius:999px;background:#7c3aed26;color:#c4b5fd;font-size:9px;font-weight:900}.notification-actions{display:flex;align-items:center;gap:7px}
@media(max-width:900px){.app-auth{padding-left:0}.app-sidebar{display:none}.app-topbar{height:64px;padding:0 14px}.app-topbar .mobile-brand{display:block}.app-topbar .mobile-brand .brand{font-size:17px}.app-topbar .mobile-brand .brandmark{width:32px;height:32px}.app-topbar .nav-tools>.bellicon,.app-topbar .nav-tools>.account{display:none}.app-auth .mobile-nav{display:block;margin-left:0}.app-auth .wrap{width:min(100% - 28px,1180px)}.kpis{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.notification-card{grid-template-columns:42px 1fr;padding:14px}.notification-actions{grid-column:2}.notification-head-actions{width:100%;justify-content:space-between}}
@media(max-width:520px){.kpis{grid-template-columns:1fr}.public-nav>a:first-child,.public-nav>a:nth-child(2){display:none}}

/* Documentation centre */
.docs-page{max-width:1180px}.docs-hero{border:1px solid var(--line);background:linear-gradient(135deg,#111a2eea,#0b1324d9);border-radius:24px;padding:30px;margin-bottom:18px;box-shadow:0 22px 70px #0004}.docs-hero h1{font-size:clamp(34px,5vw,56px);letter-spacing:-2.4px;margin:8px 0 12px}.docs-hero>p{color:#aab6c8;line-height:1.8;max-width:880px;margin:0 0 18px}.doc-section{margin-bottom:18px}.doc-section>h2,.faq-group>h2,.legal-section>h2{letter-spacing:-.7px}.doc-section p,.legal-section p{line-height:1.8}
.doc-flow{display:flex;align-items:stretch;gap:8px;overflow-x:auto;padding:12px 2px 4px;scrollbar-width:thin}.flow-node{min-width:145px;flex:1;border:1px solid #7c3aed35;background:#7c3aed0c;border-radius:14px;padding:14px;display:flex;align-items:center;gap:9px}.flow-node span{width:27px;height:27px;border-radius:9px;display:grid;place-items:center;background:#7c3aed2b;color:#c4b5fd;font-size:11px;font-weight:900;flex:0 0 auto}.flow-node strong{font-size:12px;line-height:1.35}.flow-arrow{display:grid;place-items:center;color:#58657a;font-size:20px;flex:0 0 18px}
.doc-status{display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--line);padding:13px 0}.doc-status:last-child{border-bottom:0}.doc-status strong{display:block;font-size:14px}.doc-status small{display:block;color:#7f8da2;margin-top:4px;line-height:1.5;max-width:760px}
.doc-steps{margin:0;padding-left:24px;counter-reset:item}.doc-steps li{padding:8px 0 8px 5px;color:#c4cedc;line-height:1.72}.doc-steps li::marker{color:#a78bfa;font-weight:900}.doc-steps a{color:#c4b5fd;text-decoration:underline;text-decoration-color:#7c3aed70;text-underline-offset:3px}.doc-steps code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:#d8b4fe;background:#030712;border:1px solid var(--line);border-radius:7px;padding:2px 6px}
.doc-ref-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.doc-ref{display:flex;align-items:center;justify-content:space-between;min-height:46px;padding:0 13px;border:1px solid var(--line);border-radius:11px;background:#ffffff04;color:#cbd5e1;font-size:13px;font-weight:750}.doc-ref:hover{background:#7c3aed10;border-color:#7c3aed45;color:#fff}
.doc-callout{margin-top:16px;padding:15px 16px;border-radius:13px;border:1px solid #2563eb38;background:#2563eb0d}.doc-callout.warn{border-color:#f59e0b3d;background:#f59e0b0b}.doc-callout strong{display:block;margin-bottom:5px}.doc-callout p{margin:0;color:#aeb9c8;line-height:1.65;font-size:13px}
.faq-group{margin-bottom:18px}.faq-item{border-top:1px solid var(--line)}.faq-item:first-of-type{border-top:0}.faq-item summary{list-style:none;cursor:pointer;padding:15px 2px;font-weight:800;color:#e6ebf3;display:flex;justify-content:space-between;gap:14px}.faq-item summary::-webkit-details-marker{display:none}.faq-item summary:after{content:"+";color:#8b9ab1;font-size:18px;font-weight:500}.faq-item[open] summary:after{content:"−"}.faq-answer{padding:0 2px 16px;color:#99a7ba;line-height:1.75;font-size:14px}
.legal-doc{display:grid;gap:12px}.legal-section{padding:22px}.legal-section h2{font-size:19px;margin-bottom:8px}.legal-section p{margin:0;color:#aeb8c7}
@media(max-width:800px){.doc-ref-grid{grid-template-columns:1fr 1fr}.docs-hero{padding:22px}.doc-status{align-items:flex-start;flex-direction:column}.doc-status .status{align-self:flex-start}}
@media(max-width:540px){.doc-ref-grid{grid-template-columns:1fr}.docs-hero{padding:18px;border-radius:18px}.docs-hero h1{letter-spacing:-1.5px}.flow-node{min-width:160px}.legal-section{padding:18px}}

.flow-stack{display:grid;gap:18px;margin-top:12px}.flow-block{border:1px solid var(--line);background:#ffffff03;border-radius:16px;padding:16px}.flow-block h3{margin:0 0 8px;font-size:15px}.flow-note{margin:10px 0 0!important;color:#8f9bb0!important;font-size:12px!important;line-height:1.6!important}


/* Tutorial flow layout fix: 2026-09-18 */
.docs-page,.doc-section,.flow-stack,.flow-block{min-width:0}
.docs-page{overflow-x:clip}
.doc-section,.flow-block{overflow:hidden}
.doc-flow{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(132px,1fr));
  align-items:stretch;
  gap:10px;
  overflow:visible;
  padding:12px 0 4px;
  min-width:0;
}
.flow-node{
  min-width:0;
  width:100%;
  height:100%;
  padding:14px;
}
.flow-node strong{
  min-width:0;
  overflow-wrap:anywhere;
  word-break:normal;
}
.flow-arrow{display:none}

/* Master Vidora workflow: keep every step visible without horizontal scrolling. */
.docs-page > .doc-section:first-of-type .doc-flow{
  grid-template-columns:repeat(3,minmax(0,1fr));
}

@media(max-width:700px){
  .docs-page > .doc-section:first-of-type .doc-flow,
  .flow-block .doc-flow{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media(max-width:460px){
  .docs-page > .doc-section:first-of-type .doc-flow,
  .flow-block .doc-flow{
    grid-template-columns:1fr;
  }
}

.flow-node{position:relative}
.flow-node:not(:last-child)::after{
  content:"›";
  position:absolute;
  right:9px;
  top:7px;
  color:#58657a;
  font-size:18px;
  line-height:1;
}
@media(max-width:460px){
  .flow-node:not(:last-child)::after{content:"↓"}
}


/* Guest mobile navigation refinement: 2026-09-18 */
.guest-desktop-nav{display:flex;align-items:center;gap:10px}
.guest-desktop-nav>a:not(.btn){font-size:13px;font-weight:700;color:#aab6c8;padding:9px 10px;border-radius:10px}
.guest-desktop-nav>a:not(.btn):hover{background:#ffffff08;color:#fff}
.guest-mobile-actions{display:none}
.public-mobile-nav{position:relative}
.public-mobile-nav>summary{list-style:none}
.public-mobile-nav>summary::-webkit-details-marker{display:none}
.hamburger-bars{width:18px;height:14px;display:flex;flex-direction:column;justify-content:space-between}
.hamburger-bars i{display:block;width:100%;height:2px;border-radius:999px;background:currentColor}

@media(max-width:760px){
  .guest-topbar .wrap{width:min(100% - 24px,1180px)}
  .guest-nav{height:68px;gap:10px;min-width:0}
  .guest-brand{font-size:18px;gap:9px;min-width:0;flex:0 1 auto}
  .guest-brand .brandmark{width:36px;height:36px;border-radius:11px;flex:0 0 auto}
  .guest-brand>span:last-child{font-size:18px;letter-spacing:.2px;white-space:nowrap}
  .public-nav{margin-left:auto;min-width:0;gap:0}
  .guest-desktop-nav{display:none}
  .guest-mobile-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;min-width:0}
  .guest-mobile-cta{min-height:40px;padding:9px 12px;font-size:12px;line-height:1.1;border-radius:11px;white-space:nowrap;flex:0 0 auto}
  .public-mobile-nav{display:block;flex:0 0 auto}
  .public-mobile-nav>summary{
    width:40px;height:40px;display:grid;place-items:center;
    border:1px solid var(--line);border-radius:11px;
    background:#ffffff06;color:#e5e7eb;cursor:pointer
  }
  .public-mobile-nav[open]>summary{background:#ffffff0d;border-color:#ffffff28;color:#fff}
  .public-mobile-menu{
    position:absolute;right:0;top:48px;
    width:min(280px,calc(100vw - 24px));
    padding:8px;border:1px solid var(--line);border-radius:15px;
    background:#0b1221;box-shadow:0 24px 80px #000c;
    display:grid;gap:3px;z-index:220
  }
  .public-mobile-menu a{
    min-height:46px;padding:0 12px;border-radius:10px;
    display:flex;align-items:center;justify-content:space-between;gap:12px;
    color:#d7deea;font-size:14px;font-weight:750
  }
  .public-mobile-menu a:hover{background:#ffffff08;color:#fff}
  .public-mobile-menu small{
    display:grid;place-items:center;min-width:34px;height:27px;padding:0 8px;
    border:1px solid var(--line);border-radius:8px;color:#c4b5fd;
    font-size:10px;font-weight:900
  }
}

@media(max-width:380px){
  .guest-topbar .wrap{width:min(100% - 18px,1180px)}
  .guest-nav{gap:7px}
  .guest-brand{gap:7px}
  .guest-brand .brandmark{width:34px;height:34px}
  .guest-brand>span:last-child{font-size:16px}
  .guest-mobile-actions{gap:6px}
  .guest-mobile-cta{padding:9px 10px;font-size:11px}
  .public-mobile-nav>summary{width:38px;height:38px}
}


/* Vidora AIDA sales homepage: 2026-09-18 */
.sales-home{overflow:hidden}
.sales-home .sales-hero{padding:92px 0 66px;grid-template-columns:1.08fr .92fr;gap:54px}
.sales-home .sales-hero h1{font-size:clamp(46px,6.6vw,78px);line-height:1;letter-spacing:-3.7px;margin:14px 0 20px}
.sales-home .sales-hero p{max-width:720px}
.hero-proof{display:flex;flex-wrap:wrap;gap:9px;margin:20px 0 0}
.hero-proof span{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:#ffffff06;border-radius:999px;padding:8px 11px;color:#b9c4d3;font-size:12px;font-weight:750}
.hero-proof span:before{content:"✓";display:grid;place-items:center;width:18px;height:18px;border-radius:999px;background:#22c55e18;color:#86efac;font-size:10px;font-weight:900}
.sales-demo{border:1px solid #7c3aed35;background:linear-gradient(180deg,#111a2ef2,#091120e8);border-radius:24px;padding:20px;box-shadow:0 28px 90px #0007}
.sales-demo-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.sales-demo-top strong{font-size:14px}
.live-pill{display:inline-flex;align-items:center;gap:7px;padding:6px 9px;border-radius:999px;background:#22c55e14;color:#86efac;font-size:10px;font-weight:900}
.live-pill:before{content:"";width:7px;height:7px;border-radius:50%;background:#22c55e}
.demo-chat{display:grid;gap:10px}
.demo-msg{max-width:88%;padding:12px 14px;border-radius:14px;font-size:13px;line-height:1.55}
.demo-msg.user{justify-self:end;background:linear-gradient(135deg,#7c3aed,#2563eb);color:white;border-bottom-right-radius:5px}
.demo-msg.ai{justify-self:start;background:#ffffff07;border:1px solid var(--line);color:#d7deea;border-bottom-left-radius:5px}
.demo-result{margin-top:15px;display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.demo-result div{border:1px solid var(--line);background:#ffffff04;border-radius:12px;padding:11px}
.demo-result small{display:block;color:#7d8ba0;font-size:9px;letter-spacing:.8px;font-weight:900}
.demo-result b{display:block;margin-top:5px;font-size:13px}

.sales-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#ffffff02}
.sales-strip-inner{padding:18px 0;display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.sales-strip-item{padding:10px 12px;text-align:center;color:#aeb8c7;font-size:12px;font-weight:800}
.sales-strip-item b{color:#fff}

.sales-section{padding:76px 0}
.sales-section.compact{padding:58px 0}
.sales-heading{max-width:760px;margin-bottom:28px}
.sales-heading.center{text-align:center;margin-left:auto;margin-right:auto}
.sales-heading h2{font-size:clamp(32px,4.5vw,52px);line-height:1.05;letter-spacing:-2.2px;margin:9px 0 12px}
.sales-heading p{color:var(--muted);font-size:16px;line-height:1.75;margin:0}
.problem-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:18px}
.problem-card,.benefit-card,.feature-card,.use-card,.security-card{border:1px solid var(--line);background:#ffffff04;border-radius:18px;padding:22px}
.problem-card h3,.benefit-card h3,.feature-card h3,.use-card h3,.security-card h3{margin:0 0 9px}
.problem-card p,.benefit-card p,.feature-card p,.use-card p,.security-card p{margin:0;color:#9dabbf;line-height:1.7;font-size:14px}
.problem-list{display:grid;gap:10px;margin-top:16px}
.problem-list div{display:flex;gap:10px;align-items:flex-start;padding:11px 0;border-bottom:1px solid var(--line);color:#c8d1dd;font-size:14px}
.problem-list div:last-child{border-bottom:0}
.problem-list span{width:24px;height:24px;flex:0 0 24px;border-radius:8px;background:#ef444412;color:#fca5a5;display:grid;place-items:center;font-size:12px;font-weight:900}

.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.feature-card{position:relative;overflow:hidden}
.feature-card:before{content:"";position:absolute;width:120px;height:120px;border-radius:50%;right:-50px;top:-55px;background:#7c3aed10}
.feature-icon{width:40px;height:40px;border:1px solid #7c3aed35;border-radius:12px;background:#7c3aed12;display:grid;place-items:center;margin-bottom:15px;color:#c4b5fd;font-weight:900}
.feature-card .mini{display:inline-flex;margin-top:14px;color:#b9a7ff;font-size:11px;font-weight:850}

.workflow{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;counter-reset:workflow}
.workflow-step{position:relative;border:1px solid var(--line);background:#0d1425c7;border-radius:17px;padding:20px;min-height:150px}
.workflow-step:before{counter-increment:workflow;content:counter(workflow);width:30px;height:30px;border-radius:10px;background:#7c3aed20;color:#c4b5fd;display:grid;place-items:center;font-size:11px;font-weight:900;margin-bottom:18px}
.workflow-step h3{font-size:15px;margin:0 0 7px}
.workflow-step p{font-size:13px;line-height:1.65;color:#92a0b5;margin:0}
.workflow-step:not(:last-child):after{content:"→";position:absolute;right:-19px;top:50%;transform:translateY(-50%);z-index:3;color:#57657a;font-size:18px}

.benefit-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.benefit-card{display:grid;grid-template-columns:46px 1fr;gap:14px;align-items:start}
.benefit-mark{width:46px;height:46px;border-radius:14px;background:linear-gradient(135deg,#7c3aed22,#06b6d417);border:1px solid #7c3aed2f;display:grid;place-items:center;color:#d8b4fe;font-weight:900}
.benefit-card h3{font-size:16px}

.use-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.use-card{min-height:190px}
.use-card .tag{display:inline-flex;padding:5px 8px;border-radius:999px;background:#ffffff07;color:#c4b5fd;font-size:10px;font-weight:900;margin-bottom:16px}
.use-card ul{padding-left:17px;margin:13px 0 0;color:#9daabe;font-size:13px;line-height:1.8}

.security-wrap{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:stretch}
.security-card{background:linear-gradient(145deg,#10182ad9,#0b1220d9)}
.security-points{display:grid;gap:10px;margin-top:15px}
.security-points div{padding:11px 12px;border:1px solid var(--line);border-radius:11px;background:#ffffff03;color:#b7c2d0;font-size:13px}
.security-points strong{color:#fff}

.sales-cta{padding:0 0 80px}
.sales-cta-box{border:1px solid #7c3aed45;background:radial-gradient(circle at 15% 0,#7c3aed29,transparent 38%),linear-gradient(135deg,#111a2e,#0a1221);border-radius:28px;padding:44px;text-align:center;box-shadow:0 24px 80px #0005}
.sales-cta-box h2{font-size:clamp(34px,5vw,56px);letter-spacing:-2.5px;line-height:1.04;margin:10px auto 13px;max-width:800px}
.sales-cta-box p{color:#aab6c8;max-width:720px;margin:0 auto 22px;line-height:1.7}
.sales-cta-box .actions{justify-content:center}
.sales-note{margin-top:12px;color:#718096;font-size:11px}

@media(max-width:900px){
  .sales-home .sales-hero,.problem-grid,.security-wrap{grid-template-columns:1fr}
  .feature-grid,.use-grid{grid-template-columns:repeat(2,1fr)}
  .workflow{grid-template-columns:repeat(2,1fr)}
  .workflow-step:nth-child(2):after{display:none}
  .sales-strip-inner{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:620px){
  .sales-home .sales-hero{padding:56px 0 46px}
  .sales-home .sales-hero h1{font-size:clamp(40px,12vw,58px);letter-spacing:-2.5px}
  .sales-home .sales-hero .actions{display:grid;grid-template-columns:1fr}
  .sales-home .sales-hero .actions .btn{width:100%}
  .hero-proof{gap:7px}
  .hero-proof span{font-size:11px}
  .feature-grid,.use-grid,.benefit-grid,.workflow{grid-template-columns:1fr}
  .workflow-step:after{display:none!important}
  .sales-section{padding:56px 0}
  .sales-heading h2{letter-spacing:-1.6px}
  .demo-result{grid-template-columns:1fr}
  .sales-strip-inner{grid-template-columns:1fr 1fr}
  .sales-cta-box{padding:30px 20px;border-radius:22px}
}


/* Logged-in mobile topbar: show notification bell beside hamburger */
@media(max-width:900px){
  .app-topbar .nav-tools{
    gap:8px;
  }
  .app-topbar .nav-tools>.bellicon{
    display:grid;
    width:40px;
    height:40px;
    flex:0 0 40px;
  }
  .app-topbar .nav-tools>.account{
    display:none;
  }
  .app-auth .mobile-nav{
    display:block;
    margin-left:0;
    flex:0 0 auto;
  }
  .app-topbar .mobile-brand{
    min-width:0;
  }
}

@media(max-width:380px){
  .app-topbar{
    padding:0 10px;
  }
  .app-topbar .nav-tools{
    gap:6px;
  }
  .app-topbar .nav-tools>.bellicon,
  .mobile-nav>summary{
    width:38px;
    height:38px;
  }
}


/* Animated ChatGPT conversation demo: 2026-09-18 */
.sales-demo{
  position:relative;
  overflow:hidden;
  animation:vidoraDemoFloat 5.5s ease-in-out infinite;
}
.sales-demo::before{
  content:"";
  position:absolute;
  inset:-25%;
  pointer-events:none;
  background:
    radial-gradient(circle at 18% 18%,rgba(124,58,237,.13),transparent 24%),
    radial-gradient(circle at 82% 26%,rgba(37,99,235,.11),transparent 25%),
    radial-gradient(circle at 50% 85%,rgba(6,182,212,.08),transparent 27%);
  animation:vidoraDemoGlow 8s ease-in-out infinite;
}
.sales-demo-top,.demo-chat,.demo-result{position:relative;z-index:2}
.sales-demo .live-pill{animation:vidoraConnectedPulse 1.8s ease-in-out infinite}
.demo-chat{min-height:210px}
.demo-msg{
  min-height:72px;
  transition:opacity .28s ease,transform .28s ease;
}
.demo-msg.demo-hidden{
  opacity:0;
  transform:translateY(12px) scale(.985);
}
.demo-msg.demo-visible{
  opacity:1;
  transform:translateY(0) scale(1);
}
.demo-copy{white-space:pre-wrap}
.demo-caret{
  display:inline-block;
  width:8px;
  height:1.05em;
  margin-left:3px;
  vertical-align:-2px;
  border-radius:2px;
  background:currentColor;
  animation:vidoraCaretBlink .78s steps(1) infinite;
}
.demo-msg.done .demo-caret{display:none}
.demo-typing{
  display:none;
  align-items:center;
  gap:5px;
  width:max-content;
  min-height:42px;
  margin-top:10px;
  padding:0 14px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#ffffff06;
}
.demo-typing.show{display:flex}
.demo-typing i{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#9aa7bb;
  animation:vidoraTypingDots 1.1s infinite ease-in-out;
}
.demo-typing i:nth-child(2){animation-delay:.16s}
.demo-typing i:nth-child(3){animation-delay:.32s}
.demo-result .demo-card{
  opacity:0;
  transform:translateY(14px) scale(.975);
}
.demo-result .demo-card.show{
  animation:vidoraCardReveal .46s ease forwards;
}
.demo-result .demo-card:nth-child(2).show{animation-delay:.12s}
.demo-result .demo-card:nth-child(3).show{animation-delay:.24s}

@keyframes vidoraDemoFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-5px)}
}
@keyframes vidoraDemoGlow{
  0%,100%{transform:translate3d(-1%,0,0)}
  50%{transform:translate3d(2%,1.5%,0)}
}
@keyframes vidoraConnectedPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(34,197,94,.18)}
  50%{box-shadow:0 0 0 10px rgba(34,197,94,0)}
}
@keyframes vidoraCaretBlink{
  0%,48%{opacity:1}
  49%,100%{opacity:0}
}
@keyframes vidoraTypingDots{
  0%,60%,100%{transform:translateY(0);opacity:.4}
  30%{transform:translateY(-4px);opacity:1}
}
@keyframes vidoraCardReveal{
  to{opacity:1;transform:translateY(0) scale(1)}
}
@media(prefers-reduced-motion:reduce){
  .sales-demo,.sales-demo::before,.sales-demo .live-pill,.demo-caret,.demo-typing i{animation:none!important}
  .demo-result .demo-card{opacity:1;transform:none}
}

/* ChatGPT-style MCP demo + balanced desktop hero: 2026-09-18 */
.sales-home .sales-hero{
  align-items:stretch;
}
.sales-home .sales-hero>div:first-child{
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.sales-demo{
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  height:100%;
  min-height:500px;
  padding:18px;
  border-radius:24px;
  background:linear-gradient(180deg,#101827f5,#0a1322f4);
  border:1px solid #7c3aed38;
  box-shadow:0 28px 90px rgba(0,0,0,.38);
}
.sales-demo-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}
.demo-window-meta{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}
.demo-window-meta>div{
  display:grid;
  gap:2px;
}
.demo-window-meta strong{
  font-size:14px;
  line-height:1.2;
}
.demo-window-meta small{
  color:#7f8da2;
  font-size:10px;
  font-weight:800;
  letter-spacing:.5px;
}
.demo-chatgpt-mark{
  width:34px;
  height:34px;
  border-radius:11px;
  display:grid;
  place-items:center;
  flex:0 0 34px;
  background:linear-gradient(135deg,#ffffff14,#7c3aed24);
  border:1px solid var(--line);
  color:#fff;
  font-size:16px;
}
.demo-chat-header{
  position:relative;
  z-index:2;
  margin-bottom:12px;
}
.demo-chat-badge{
  display:inline-flex;
  align-items:center;
  min-height:31px;
  padding:0 11px;
  border-radius:999px;
  border:1px solid #7c3aed33;
  background:#7c3aed0d;
  color:#c4b5fd;
  font-size:11px;
  font-weight:850;
}
.demo-chat{
  display:grid;
  align-content:start;
  gap:11px;
  min-height:275px;
}
.demo-message-row{
  display:flex;
  align-items:flex-start;
  gap:10px;
}
.demo-message-row.user-row{
  flex-direction:row-reverse;
}
.demo-message-body{
  min-width:0;
  flex:1;
}
.demo-msg.user .demo-message-body{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
}
.demo-avatar{
  width:30px;
  height:30px;
  flex:0 0 30px;
  border-radius:9px;
  display:grid;
  place-items:center;
  border:1px solid var(--line);
  font-size:11px;
  font-weight:900;
}
.user-avatar{
  background:linear-gradient(135deg,#7c3aed,#2563eb);
  color:#fff;
}
.ai-avatar{
  background:#ffffff0a;
  color:#f8fafc;
}
.demo-role{
  display:block;
  margin:0 0 5px;
  color:#8693a7;
  font-size:9px;
  font-weight:900;
  letter-spacing:.8px;
  text-transform:uppercase;
}
.demo-bubble{
  max-width:100%;
  padding:12px 14px;
  border-radius:15px;
  font-size:12px;
  line-height:1.58;
}
.user-bubble{
  width:max-content;
  max-width:92%;
  background:linear-gradient(135deg,#7c3aed,#2563eb);
  color:#fff;
  border-bottom-right-radius:6px;
}
.ai-bubble{
  width:100%;
  background:#0e1727;
  border:1px solid var(--line);
  color:#e5edf8;
  border-bottom-left-radius:6px;
}
.demo-tool-chip{
  display:inline-flex;
  align-items:center;
  min-height:22px;
  margin:0 0 6px;
  padding:0 8px;
  border-radius:7px;
  background:#22c55e10;
  border:1px solid #22c55e25;
  color:#86efac;
  font-size:8px;
  font-weight:900;
  letter-spacing:.7px;
}
.demo-typing{
  margin:0 0 0 40px;
  min-height:34px;
  padding:0 12px;
  border-radius:11px;
}
.demo-typing .demo-avatar{
  width:24px;
  height:24px;
  flex-basis:24px;
  border-radius:7px;
}
.typing-label{
  color:#94a3b8;
  font-size:10px;
  font-weight:800;
  margin-right:2px;
}
.demo-result{
  margin-top:12px;
}
.demo-result .demo-card{
  min-height:78px;
}
.demo-result .demo-card small{
  font-size:9px;
}
.demo-result .demo-card b{
  font-size:13px;
  line-height:1.35;
}
@media(min-width:901px){
  .sales-home .sales-hero{
    min-height:560px;
  }
  .sales-home .sales-hero>div:first-child,
  .sales-home .sales-demo{
    min-height:560px;
  }
}
@media(max-width:900px){
  .sales-home .sales-hero{
    align-items:start;
  }
  .sales-demo{
    min-height:0;
  }
  .demo-chat{
    min-height:255px;
  }
}
@media(max-width:620px){
  .sales-demo{
    padding:15px;
  }
  .demo-chat{
    min-height:290px;
  }
  .user-bubble{
    max-width:100%;
  }
  .demo-result{
    grid-template-columns:1fr;
  }
  .demo-result .demo-card{
    min-height:0;
  }
}


/* ChatGPT-like MCP conversation preview: 2026-09-18 */
.sales-home .sales-hero{
  align-items:stretch;
}
.sales-home .sales-hero>div:first-child{
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.gpt-demo.sales-demo{
  animation:none!important;
  position:relative;
  display:flex;
  flex-direction:column;
  min-height:560px;
  height:100%;
  padding:0;
  overflow:hidden;
  border:1px solid #ffffff14;
  border-radius:22px;
  background:#212121;
  box-shadow:0 24px 80px rgba(0,0,0,.42);
}
.gpt-demo.sales-demo::before{
  display:none!important;
}

.gpt-demo-top{
  height:52px;
  flex:0 0 52px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:0 14px 0 16px;
  border-bottom:1px solid #ffffff0d;
  background:#212121;
  position:relative;
  z-index:4;
}
.gpt-model{
  display:flex;
  align-items:center;
  gap:5px;
  color:#f4f4f4;
  font-size:14px;
  font-weight:700;
}
.gpt-chevron{
  color:#a8a8a8;
  font-size:15px;
  transform:translateY(-1px);
}
.gpt-top-actions{
  display:flex;
  align-items:center;
  gap:10px;
}
.gpt-mcp-status{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:27px;
  padding:0 9px;
  border:1px solid #ffffff14;
  border-radius:999px;
  background:#2f2f2f;
  color:#c8c8c8;
  font-size:10px;
  font-weight:650;
  white-space:nowrap;
}
.gpt-mcp-status i{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#19c37d;
  box-shadow:0 0 0 3px rgba(25,195,125,.12);
}
.gpt-more{
  color:#b8b8b8;
  font-size:14px;
  letter-spacing:1px;
}

.gpt-thread{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  padding:22px 18px 18px;
  scroll-behavior:smooth;
  scrollbar-width:thin;
  scrollbar-color:#4b4b4b transparent;
  transition:opacity .35s ease,transform .35s ease;
}
.gpt-thread::-webkit-scrollbar{
  width:6px;
}
.gpt-thread::-webkit-scrollbar-thumb{
  background:#4b4b4b;
  border-radius:999px;
}
.gpt-thread.gpt-resetting{
  opacity:0;
  transform:translateY(5px);
}

.gpt-message{
  width:min(100%,470px);
  margin-left:auto;
  margin-right:auto;
}
.gpt-message + .gpt-message{
  margin-top:18px;
}
.gpt-enter{
  animation:gptMessageIn .3s ease both;
}
.gpt-message-user{
  display:flex;
  justify-content:flex-end;
}
.gpt-user-bubble{
  max-width:82%;
  padding:10px 14px;
  border-radius:18px;
  border-bottom-right-radius:5px;
  background:#303030;
  color:#f4f4f4;
  font-size:12px;
  line-height:1.55;
  word-break:break-word;
}

.gpt-message-assistant{
  display:grid;
  grid-template-columns:27px minmax(0,1fr);
  align-items:flex-start;
  gap:10px;
}
.gpt-assistant-mark{
  width:27px;
  height:27px;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:#f4f4f4;
  color:#171717;
  font-size:13px;
  font-weight:900;
}
.gpt-assistant-content{
  min-width:0;
  padding-top:2px;
}
.gpt-tool-call{
  width:min(100%,360px);
  min-height:45px;
  display:grid;
  grid-template-columns:30px minmax(0,1fr) 18px;
  align-items:center;
  gap:9px;
  margin-bottom:10px;
  padding:7px 9px;
  border:1px solid #ffffff12;
  border-radius:11px;
  background:#2a2a2a;
}
.gpt-tool-icon{
  width:29px;
  height:29px;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:#19c37d;
  color:#082b20;
  font-size:11px;
  font-weight:950;
}
.gpt-tool-copy{
  display:grid;
  gap:1px;
  min-width:0;
}
.gpt-tool-copy strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#e8e8e8;
  font-size:10px;
  font-weight:700;
}
.gpt-tool-copy small{
  color:#8f8f8f;
  font-size:9px;
}
.gpt-tool-check{
  color:#19c37d;
  font-size:12px;
  font-weight:900;
}
.gpt-assistant-text{
  color:#ececec;
  font-size:12px;
  line-height:1.68;
  white-space:pre-wrap;
}
.gpt-response-actions{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:8px;
  color:#858585;
  font-size:10px;
  opacity:.85;
}

.gpt-thinking-row{
  margin-top:14px!important;
}
.gpt-thinking{
  display:flex;
  align-items:center;
  gap:4px;
  min-height:27px;
}
.gpt-thinking i{
  width:5px;
  height:5px;
  border-radius:50%;
  background:#a9a9a9;
  animation:gptThinking 1.1s ease-in-out infinite;
}
.gpt-thinking i:nth-child(2){animation-delay:.16s}
.gpt-thinking i:nth-child(3){animation-delay:.32s}

.gpt-composer-wrap{
  flex:0 0 auto;
  padding:10px 12px 10px;
  background:linear-gradient(to top,#212121 72%,rgba(33,33,33,.88));
  position:relative;
  z-index:5;
}
.gpt-composer{
  min-height:72px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:10px;
  padding:11px 11px 9px;
  border:1px solid #ffffff1a;
  border-radius:23px;
  background:#303030;
  box-shadow:0 4px 18px rgba(0,0,0,.18);
}
.gpt-composer-input{
  padding:0 3px;
  color:#a9a9a9;
  font-size:12px;
  line-height:1.4;
}
.gpt-composer-actions{
  display:flex;
  align-items:center;
  gap:8px;
}
.gpt-plus,.gpt-mic,.gpt-send{
  width:27px;
  height:27px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#d6d6d6;
  font-size:13px;
}
.gpt-plus,.gpt-mic{
  background:#3b3b3b;
}
.gpt-tools{
  display:inline-flex;
  align-items:center;
  min-height:27px;
  padding:0 9px;
  border:1px solid #ffffff12;
  border-radius:999px;
  color:#d5d5d5;
  background:#3a3a3a;
  font-size:10px;
  font-weight:650;
}
.gpt-send{
  margin-left:auto;
  background:#f4f4f4;
  color:#171717;
  font-size:16px;
  font-weight:900;
}
.gpt-footnote{
  padding-top:6px;
  color:#777;
  text-align:center;
  font-size:8px;
  line-height:1.35;
}

@keyframes gptMessageIn{
  from{opacity:0;transform:translateY(7px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes gptThinking{
  0%,60%,100%{opacity:.35;transform:translateY(0)}
  30%{opacity:1;transform:translateY(-3px)}
}

@media(min-width:901px){
  .sales-home .sales-hero{
    min-height:560px;
  }
  .sales-home .sales-hero>div:first-child,
  .gpt-demo.sales-demo{
    min-height:560px;
    height:560px;
  }
}

@media(max-width:900px){
  .gpt-demo.sales-demo{
    min-height:540px;
    height:540px;
  }
}

@media(max-width:620px){
  .gpt-demo.sales-demo{
    min-height:520px;
    height:520px;
    border-radius:18px;
  }
  .gpt-demo-top{
    padding:0 11px 0 13px;
  }
  .gpt-mcp-status{
    max-width:160px;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .gpt-thread{
    padding:18px 12px 14px;
  }
  .gpt-user-bubble{
    max-width:88%;
  }
  .gpt-composer-wrap{
    padding:8px 8px 9px;
  }
}

@media(prefers-reduced-motion:reduce){
  .gpt-enter,.gpt-thinking i{
    animation:none!important;
  }
}


/* Full rebuild: ChatGPT-style MCP preview */
.sales-home .sales-hero{
  align-items:stretch;
}
.sales-home .sales-hero>div:first-child{
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.cgpt-shell.sales-demo{
  position:relative;
  display:flex;
  flex-direction:column;
  height:560px;
  min-height:560px;
  padding:0!important;
  overflow:hidden;
  border:1px solid #2f2f2f!important;
  border-radius:20px!important;
  background:#212121!important;
  box-shadow:0 24px 80px rgba(0,0,0,.38)!important;
  animation:none!important;
  transform:none!important;
}
.cgpt-shell.sales-demo::before{
  display:none!important;
  content:none!important;
}

.cgpt-topbar{
  height:54px;
  flex:0 0 54px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:0 14px 0 16px;
  border-bottom:1px solid #2d2d2d;
  background:#212121;
  position:relative;
  z-index:5;
}
.cgpt-model,
.cgpt-more,
.cgpt-round,
.cgpt-toolbtn,
.cgpt-send{
  appearance:none;
  border:0;
  font:inherit;
  cursor:default;
}
.cgpt-model{
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:0;
  background:transparent;
  color:#ececec;
  font-size:14px;
  line-height:1;
  font-weight:700;
  white-space:nowrap;
}
.cgpt-model span{
  color:#aaa;
  font-size:13px;
}
.cgpt-topright{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}
.cgpt-connector{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:28px;
  padding:0 9px;
  border:1px solid #393939;
  border-radius:999px;
  background:#2b2b2b;
  color:#cfcfcf;
  font-size:10px;
  font-weight:650;
  white-space:nowrap;
}
.cgpt-connector i{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#19c37d;
  box-shadow:0 0 0 3px rgba(25,195,125,.11);
}
.cgpt-more{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  padding:0;
  background:transparent;
  color:#b8b8b8;
  font-size:13px;
  letter-spacing:1px;
}

.cgpt-thread{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  padding:20px 16px 18px;
  background:#212121;
  scroll-behavior:smooth;
  scrollbar-width:thin;
  scrollbar-color:#4d4d4d transparent;
  transition:opacity .3s ease,transform .3s ease;
}
.cgpt-thread::-webkit-scrollbar{width:6px}
.cgpt-thread::-webkit-scrollbar-thumb{
  background:#4d4d4d;
  border-radius:999px;
}
.cgpt-thread.cgpt-reset{
  opacity:0;
  transform:translateY(4px);
}

.cgpt-turn{
  width:min(100%,470px);
  margin:0 auto;
}
.cgpt-turn+.cgpt-turn{
  margin-top:20px;
}

.cgpt-user-row{
  display:flex;
  justify-content:flex-end;
  width:100%;
  margin-bottom:14px;
}
.cgpt-user-bubble{
  max-width:80%;
  padding:10px 14px;
  border-radius:18px;
  border-bottom-right-radius:5px;
  background:#303030;
  color:#f4f4f4;
  font-size:12px;
  line-height:1.58;
  word-break:break-word;
}

.cgpt-assistant-row{
  display:grid;
  grid-template-columns:28px minmax(0,1fr);
  align-items:flex-start;
  gap:10px;
  width:100%;
}
.cgpt-ai-mark{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:#f4f4f4;
  color:#171717;
  font-size:13px;
  font-weight:900;
}
.cgpt-assistant-body{
  min-width:0;
  padding-top:1px;
}
.cgpt-toolcall{
  width:min(100%,345px);
  min-height:46px;
  display:grid;
  grid-template-columns:30px minmax(0,1fr) 18px;
  align-items:center;
  gap:9px;
  padding:8px 9px;
  margin-bottom:10px;
  border:1px solid #353535;
  border-radius:11px;
  background:#2a2a2a;
}
.cgpt-tool-logo{
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:#19c37d;
  color:#072d21;
  font-size:11px;
  font-weight:950;
}
.cgpt-tool-main{
  min-width:0;
  display:grid;
  gap:1px;
}
.cgpt-tool-main strong{
  color:#ededed;
  font-size:10px;
  line-height:1.2;
  font-weight:700;
}
.cgpt-tool-main small{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#969696;
  font-size:9px;
  line-height:1.2;
}
.cgpt-tool-ok{
  color:#19c37d;
  font-size:12px;
  font-weight:900;
}
.cgpt-answer{
  color:#ececec;
  font-size:12px;
  line-height:1.68;
  white-space:pre-wrap;
}
.cgpt-actions{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:8px;
  color:#8d8d8d;
  font-size:10px;
  user-select:none;
}

.cgpt-thinking-row{
  margin-bottom:8px;
}
.cgpt-thinking{
  min-height:28px;
  display:flex;
  align-items:center;
  gap:4px;
}
.cgpt-thinking i{
  width:5px;
  height:5px;
  border-radius:50%;
  background:#a9a9a9;
  animation:cgptThinking 1.05s ease-in-out infinite;
}
.cgpt-thinking i:nth-child(2){animation-delay:.14s}
.cgpt-thinking i:nth-child(3){animation-delay:.28s}

.cgpt-bottom{
  flex:0 0 auto;
  padding:9px 10px 8px;
  border-top:1px solid #2d2d2d;
  background:#212121;
  position:relative;
  z-index:5;
}
.cgpt-composer{
  min-height:82px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:10px;
  padding:12px 11px 10px;
  border:1px solid #3a3a3a;
  border-radius:24px;
  background:#303030;
  box-shadow:0 2px 12px rgba(0,0,0,.16);
}
.cgpt-input{
  padding:0 3px;
  color:#a9a9a9;
  font-size:12px;
  line-height:1.35;
}
.cgpt-compose-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.cgpt-compose-left,
.cgpt-compose-right{
  display:flex;
  align-items:center;
  gap:7px;
}
.cgpt-round{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  padding:0;
  border-radius:50%;
  background:#3b3b3b;
  color:#e2e2e2;
  font-size:13px;
}
.cgpt-toolbtn{
  min-height:28px;
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:0 9px;
  border:1px solid #414141;
  border-radius:999px;
  background:#383838;
  color:#e0e0e0;
  font-size:10px;
  font-weight:650;
}
.cgpt-send{
  width:29px;
  height:29px;
  display:grid;
  place-items:center;
  padding:0;
  border-radius:50%;
  background:#f4f4f4;
  color:#171717;
  font-size:15px;
  font-weight:900;
}
.cgpt-note{
  padding-top:6px;
  color:#777;
  text-align:center;
  font-size:8px;
  line-height:1.35;
}

.cgpt-enter{
  animation:cgptEnter .24s ease both;
}
@keyframes cgptEnter{
  from{opacity:0;transform:translateY(6px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes cgptThinking{
  0%,60%,100%{opacity:.35;transform:translateY(0)}
  30%{opacity:1;transform:translateY(-3px)}
}

@media(min-width:901px){
  .sales-home .sales-hero{
    min-height:560px;
  }
  .sales-home .sales-hero>div:first-child,
  .cgpt-shell.sales-demo{
    min-height:560px;
    height:560px;
  }
}
@media(max-width:900px){
  .cgpt-shell.sales-demo{
    min-height:540px;
    height:540px;
  }
}
@media(max-width:620px){
  .cgpt-shell.sales-demo{
    min-height:520px;
    height:520px;
    border-radius:18px!important;
  }
  .cgpt-topbar{
    padding:0 10px 0 12px;
  }
  .cgpt-connector{
    max-width:145px;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .cgpt-thread{
    padding:16px 11px 14px;
  }
  .cgpt-user-bubble{
    max-width:88%;
  }
  .cgpt-bottom{
    padding:8px;
  }
}
@media(prefers-reduced-motion:reduce){
  .cgpt-enter,.cgpt-thinking i{
    animation:none!important;
  }
}


/* Custom domain DNS copy controls */
.copy-box{
  display:flex;
  align-items:center;
  gap:12px;
  width:100%;
  min-width:0;
  min-height:58px;
  padding:8px 8px 8px 16px;
  border:1px solid rgba(148,163,184,.20);
  border-radius:15px;
  background:rgba(3,8,20,.88);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.018);
  transition:border-color .16s ease,box-shadow .16s ease,background .16s ease;
}
.copy-box:hover{
  border-color:rgba(139,92,246,.38);
  background:rgba(4,9,23,.98);
  box-shadow:0 0 0 3px rgba(124,58,237,.055),inset 0 1px 0 rgba(255,255,255,.02);
}
.copy-value{
  flex:1 1 auto;
  min-width:0;
  overflow-wrap:anywhere;
  word-break:break-word;
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
  font-size:15px;
  line-height:1.45;
  color:#d8ccff;
}
.copy-btn{
  position:relative;
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-width:76px;
  min-height:38px;
  padding:0 13px 0 34px;
  border:1px solid rgba(167,139,250,.22);
  border-radius:10px;
  background:linear-gradient(180deg,rgba(124,58,237,.14),rgba(76,29,149,.10));
  color:#ddd6fe;
  font:inherit;
  font-size:12px;
  font-weight:750;
  letter-spacing:.01em;
  line-height:1;
  cursor:pointer;
  white-space:nowrap;
  box-shadow:none;
  -webkit-appearance:none;
  appearance:none;
  transition:transform .15s ease,border-color .15s ease,background .15s ease,color .15s ease,box-shadow .15s ease;
}
.copy-btn::before,
.copy-btn::after{
  content:"";
  position:absolute;
  width:10px;
  height:10px;
  border:1.5px solid currentColor;
  border-radius:2px;
}
.copy-btn::before{
  left:14px;
  top:11px;
  opacity:.58;
}
.copy-btn::after{
  left:17px;
  top:14px;
  background:rgba(20,12,46,.88);
}
.copy-btn:hover{
  border-color:rgba(167,139,250,.48);
  background:linear-gradient(180deg,rgba(124,58,237,.24),rgba(76,29,149,.17));
  color:#f5f3ff;
  box-shadow:0 5px 18px rgba(76,29,149,.16);
}
.copy-btn:active{
  transform:translateY(1px);
}
.copy-btn.copied{
  border-color:rgba(52,211,153,.38);
  background:rgba(6,78,59,.24);
  color:#a7f3d0;
  box-shadow:none;
}
.copy-btn.copied::before,
.copy-btn.copied::after{
  border-color:#a7f3d0;
}
@media(max-width:620px){
  .copy-box{
    gap:9px;
    min-height:54px;
    padding:7px 7px 7px 12px;
    border-radius:13px;
  }
  .copy-value{
    font-size:13px;
  }
  .copy-btn{
    min-width:68px;
    min-height:36px;
    padding:0 10px 0 31px;
    font-size:11px;
  }
  .copy-btn::before{
    left:11px;
    top:10px;
  }
  .copy-btn::after{
    left:14px;
    top:13px;
  }
}


/* Custom-domain quick guide */
.domain-quick-guide{
  margin:0 0 18px;
  padding:18px;
  border:1px solid rgba(139,92,246,.20);
  border-radius:18px;
  background:linear-gradient(180deg,rgba(124,58,237,.08),rgba(15,23,42,.32));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.02);
}
.domain-guide-title{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
  margin-bottom:14px;
}
.domain-guide-title span{
  color:#9f8cff;
  font-size:11px;
  font-weight:800;
  letter-spacing:.11em;
}
.domain-guide-title strong{
  color:#f8fafc;
  font-size:16px;
}
.domain-guide-steps{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
}
.domain-guide-steps>div{
  display:flex;
  align-items:flex-start;
  gap:9px;
  min-width:0;
  padding:12px;
  border:1px solid rgba(148,163,184,.12);
  border-radius:13px;
  background:rgba(3,8,20,.52);
}
.domain-guide-steps b{
  flex:0 0 auto;
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:rgba(124,58,237,.18);
  color:#ddd6fe;
  font-size:12px;
}
.domain-guide-steps span{
  color:#cbd5e1;
  font-size:12px;
  line-height:1.55;
}
.domain-guide-steps code,
.domain-guide-note code{
  color:#ddd6fe;
  font-size:.96em;
}
.domain-guide-note{
  margin:12px 0 0;
  padding:11px 12px;
  border-left:3px solid rgba(167,139,250,.65);
  border-radius:0 10px 10px 0;
  background:rgba(124,58,237,.07);
  color:#aeb9cb;
  font-size:12px;
  line-height:1.6;
}
@media(max-width:900px){
  .domain-guide-steps{grid-template-columns:1fr 1fr}
}
@media(max-width:620px){
  .domain-quick-guide{padding:14px}
  .domain-guide-title{align-items:flex-start;flex-direction:column}
  .domain-guide-steps{grid-template-columns:1fr}
}
