
/* Triton Interactive Platform Demo — premium landing page */
.platform-hero{
  position:relative;
  overflow:hidden;
  padding:76px 0 86px;
  background:
    radial-gradient(circle at 72% 18%,rgba(15,127,255,.33),transparent 35%),
    radial-gradient(circle at 18% 86%,rgba(15,163,219,.18),transparent 34%),
    linear-gradient(135deg,#03172e 0%,#062a51 56%,#03172e 100%);
  color:#fff;
}
.platform-hero:after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:radial-gradient(rgba(73,169,255,.18) 1px,transparent 1px);
  background-size:28px 28px;mask-image:linear-gradient(to right,transparent,#000 55%,transparent);
}
.platform-hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:.9fr 1.1fr;gap:66px;align-items:center}
.platform-hero-copy h1{font-size:58px;line-height:1.02;margin:16px 0 20px;letter-spacing:-.045em}
.platform-hero-copy h1 em{display:block;color:#1b99ff;font-style:normal}
.platform-hero-copy .lead{font-size:18px;line-height:1.65;color:#c3d5e4;max-width:680px}
.platform-pills{display:flex;flex-wrap:wrap;gap:10px;margin:23px 0}
.platform-pills span{border:1px solid rgba(103,188,255,.28);background:rgba(7,45,80,.72);border-radius:999px;padding:8px 11px;color:#c5d9e9;font-size:12px;font-weight:700}
.platform-trust-note{display:flex;align-items:center;gap:8px;margin-top:15px;color:#8faac0;font-size:11px}
.platform-trust-note i{width:8px;height:8px;border-radius:50%;background:#38dc83;box-shadow:0 0 9px #38dc83}
.portal-showcase{position:relative;padding:18px}
.showcase-glow{position:absolute;inset:10% 5%;background:#0a83ff;filter:blur(80px);opacity:.24;border-radius:50%}
.showcase-window{position:relative;border-radius:18px;overflow:hidden;border:1px solid rgba(105,183,246,.32);background:#fff;box-shadow:0 34px 80px rgba(0,0,0,.38);transform:perspective(1200px) rotateY(-2deg) rotateX(1deg)}
.showcase-bar{height:42px;background:#0a2545;display:flex;align-items:center;padding:0 13px;color:#94adc2;font-size:10px}
.showcase-bar>div{display:flex;gap:6px}.showcase-bar i{width:8px;height:8px;border-radius:50%;background:#668096}
.showcase-bar span{margin-left:12px}.showcase-bar b{margin-left:auto;background:#0d7fff;color:#fff;border-radius:999px;padding:5px 8px;font-size:8px}
.showcase-image-wrap{height:430px;overflow:hidden;background:#f4f5f6}
.showcase-image-wrap img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block}
.showcase-float{position:absolute;display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid rgba(99,183,247,.28);background:rgba(5,31,57,.94);border-radius:12px;color:#fff;box-shadow:0 18px 45px rgba(0,0,0,.3);animation:floatCard 4s ease-in-out infinite}
.showcase-float>span{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:#0d7fff}.showcase-float b,.showcase-float small{display:block}.showcase-float b{font-size:11px}.showcase-float small{font-size:9px;color:#8fa9bf}
.float-one{left:-12px;bottom:50px}.float-two{right:-12px;top:90px;animation-delay:-2s}
.platform-proof-strip{background:#fff;border-bottom:1px solid #e0e9f1}
.platform-proof-grid{display:grid;grid-template-columns:repeat(5,1fr)}
.platform-proof-grid>div{display:flex;align-items:center;gap:12px;padding:21px 18px;border-right:1px solid #e0e9f1}
.platform-proof-grid>div:last-child{border-right:0}.platform-proof-grid>div>span{font-size:26px;color:#0d7fff}
.platform-proof-grid b,.platform-proof-grid small{display:block}.platform-proof-grid b{font-size:13px;color:#18314d}.platform-proof-grid small{font-size:10px;color:#7d8da0;margin-top:3px}
.platform-intro{background:linear-gradient(180deg,#f7fbff 0%,#fff 100%)}
.workflow-feature{display:grid;grid-template-columns:.8fr 1.2fr;gap:50px;align-items:center;border-radius:24px;padding:48px;margin:34px 0;overflow:hidden}
.workflow-feature-dark{background:radial-gradient(circle at 85% 25%,rgba(25,137,255,.2),transparent 34%),linear-gradient(135deg,#051a33,#082b50);color:#fff;box-shadow:0 24px 70px rgba(5,35,67,.18)}
.workflow-feature-light{grid-template-columns:1.2fr .8fr;background:#fff;border:1px solid #dce8f3;box-shadow:0 20px 55px rgba(28,70,108,.08)}
.workflow-number{display:block;font-size:11px;font-weight:900;letter-spacing:.16em;color:#45c8ff;margin-bottom:12px}
.workflow-copy h3{font-size:38px;line-height:1.08;margin:12px 0 16px}.workflow-copy p{color:#a9bfd1;line-height:1.65}.workflow-copy ul{display:grid;grid-template-columns:1fr 1fr;gap:10px 20px;padding:0;margin:22px 0;list-style:none}.workflow-copy li:before{content:"✓";color:#42caff;font-weight:900;margin-right:8px}.workflow-copy a{font-weight:900;color:#42caff;text-decoration:none}
.dark-copy h3{color:#071a33}.dark-copy p{color:#667a8e}.dark-copy li{color:#334d68}.dark-copy a{color:#0d7fff}
.workflow-ui{border:1px solid rgba(104,184,247,.28);background:#061d38;border-radius:17px;padding:18px;box-shadow:0 26px 60px rgba(0,0,0,.22)}
.ui-head{display:flex;justify-content:space-between;color:#fff;padding-bottom:14px;border-bottom:1px solid rgba(111,174,226,.13)}.ui-head span{font-size:10px;color:#89a6bd}
.ui-search-row{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:8px;margin:14px 0}.ui-search-row>div,.sip-form-grid label{background:#092a4d;border-radius:9px;padding:11px}.ui-search-row small,.ui-search-row b,.sip-form-grid small,.sip-form-grid b{display:block}.ui-search-row small,.sip-form-grid small{color:#789ab6;font-size:8px}.ui-search-row b,.sip-form-grid b{color:#fff;font-size:11px;margin-top:4px}.ui-search-row button,.ui-progress button,.sip-status-row button{border:0;background:#0d7fff;color:#fff;border-radius:9px;padding:10px 13px;font-weight:800;font-size:10px}
.ui-number-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.ui-number-grid span{padding:11px;border-radius:8px;background:#092a4d;color:#a8bfd2;font-size:10px}.ui-number-grid span.selected{border:1px solid #39c8ff;background:#0c3c68;color:#fff}
.ui-progress{display:flex;align-items:center;gap:10px;margin-top:14px}.ui-progress>i{flex:1;height:6px;border-radius:999px;background:linear-gradient(90deg,#0d7fff 64%,#103b61 64%)}.ui-progress small{color:#8ea9bf}.ui-progress button{margin-left:auto}
.sip-ui{background:#071f3b}.sip-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0}.sip-status-row{display:flex;align-items:center;gap:12px;padding-top:13px;border-top:1px solid rgba(111,174,226,.13)}.sip-status-row span{color:#94b0c6;font-size:9px}.sip-status-row span i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#39dc82;box-shadow:0 0 7px #39dc82;margin-right:5px}.sip-status-row button{margin-left:auto}
.dual-ui{display:grid;grid-template-columns:1fr 1fr;gap:14px}.mini-workflow-card{padding:21px;border:1px solid rgba(104,184,247,.2);border-radius:15px;background:#061d38}.mini-workflow-card>b,.mini-workflow-card>small{display:block}.mini-workflow-card>b{font-size:16px}.mini-workflow-card>small{color:#88a5bc;margin:5px 0 17px}.mini-icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:#0d7fff;margin-bottom:15px;font-size:21px}.mini-steps{display:grid;gap:8px}.mini-steps span{padding:9px;border-radius:8px;background:#092a4d;color:#8da8bd;font-size:9px}.mini-steps span:before{content:"○";margin-right:7px}.mini-steps .done:before{content:"✓";color:#39dc82}.mini-steps .active{border:1px solid #42caff;color:#fff}.mini-steps .active:before{content:"●";color:#42caff}
.platform-guided{background:linear-gradient(180deg,#fff,#eef7ff)}
.platform-guided-grid{display:grid;grid-template-columns:.88fr 1.12fr;gap:65px;align-items:center}
.platform-guided h2{font-size:44px;margin:12px 0}.platform-guided p{color:#63788d;line-height:1.65}
.guided-check-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:24px 0}.guided-check-grid span:before{content:"✓";color:#0d7fff;font-weight:900;margin-right:8px}
.ai-guide-card{background:linear-gradient(180deg,#071f3b,#04162b);border:1px solid rgba(89,171,238,.26);border-radius:20px;padding:21px;box-shadow:0 28px 70px rgba(7,41,74,.22)}
.ai-guide-head{display:flex;justify-content:space-between;color:#fff}.ai-guide-head>div{display:flex;align-items:center;gap:8px}.ai-guide-head i{width:8px;height:8px;border-radius:50%;background:#39dc82;box-shadow:0 0 8px #39dc82}.ai-guide-head span{font-size:9px;color:#39dc82}
.ai-message{padding:12px 14px;border-radius:12px;margin-top:12px;color:#fff;font-size:11px}.ai-message.user{background:#0d7fff;margin-left:65px;text-align:center}.ai-message.bot{background:#0b3158;margin-right:40px}
.ai-guide-steps{display:grid;gap:9px;margin-top:16px}.ai-guide-steps>div{display:grid;grid-template-columns:30px 1fr auto;align-items:center;gap:10px;padding:11px;border-radius:10px;background:#092947;color:#90aac0}.ai-guide-steps b{width:27px;height:27px;border-radius:50%;display:grid;place-items:center;background:#0b416d;color:#86b8de}.ai-guide-steps em{font-size:8px;font-style:normal}.ai-guide-steps .done b{background:#39b979;color:#fff}.ai-guide-steps .active{border:1px solid #42caff;color:#fff}.ai-guide-steps .active b{background:#0d7fff;color:#fff}
.platform-security{padding:70px 0;background:radial-gradient(circle at 75% 50%,rgba(15,127,255,.24),transparent 35%),linear-gradient(135deg,#03172e,#082b50);color:#fff}
.platform-security-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}.platform-security h2{font-size:42px;margin:12px 0}.platform-security p{color:#a8bfd2;line-height:1.65}
.security-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.security-metrics div{padding:22px;border:1px solid rgba(102,181,246,.22);border-radius:14px;background:rgba(6,35,65,.75)}.security-metrics b,.security-metrics span{display:block}.security-metrics b{font-size:31px}.security-metrics span{color:#93adc3;font-size:10px;margin-top:4px}
@keyframes floatCard{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@media(max-width:1050px){
  .platform-hero-grid,.workflow-feature,.workflow-feature-light,.platform-guided-grid,.platform-security-grid{grid-template-columns:1fr}
  .platform-proof-grid{grid-template-columns:repeat(3,1fr)}
  .portal-showcase{max-width:780px;margin:auto}
}
@media(max-width:680px){
  .platform-hero{padding:55px 0}.platform-hero-copy h1{font-size:42px}
  .showcase-image-wrap{height:280px}.showcase-float{display:none}
  .platform-proof-grid{grid-template-columns:1fr}.platform-proof-grid>div{border-right:0;border-bottom:1px solid #e0e9f1}
  .workflow-feature{padding:25px}.workflow-copy h3{font-size:31px}.workflow-copy ul,.guided-check-grid,.dual-ui,.security-metrics{grid-template-columns:1fr}
  .ui-search-row,.ui-number-grid,.sip-form-grid{grid-template-columns:1fr}.sip-status-row{flex-wrap:wrap}.sip-status-row button{margin-left:0}
}
@media(prefers-reduced-motion:reduce){.showcase-float{animation:none}}


/* V3.1 structural corrections */
html{scroll-behavior:smooth}
.platform-demo-page{margin:0;background:#fff}
.platform-demo-page .platform-hero{padding-top:72px}
.platform-demo-page .platform-guided h2,
.platform-demo-page .platform-guided p,
.platform-demo-page .guided-check-grid span{
  color:#10243d!important;
}
.platform-demo-page .platform-guided .eyebrow.dark{color:#0d7fff!important}
.platform-demo-page .platform-guided{padding-top:86px;padding-bottom:86px}
.platform-demo-page .platform-guided-grid{align-items:center}
.platform-demo-page .platform-guided-grid>div:first-child{padding-right:18px}
.platform-demo-page .guided-check-grid span{font-weight:700}

/* Clean demo-only header */
.demo-site-header{
  position:relative;
  z-index:100;
  background:#07182c;
  border-bottom:1px solid rgba(105,182,246,.14);
}
.demo-site-header-inner{
  min-height:78px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
}
.demo-brand{
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
  color:#fff;
  flex:0 0 auto;
}
.demo-brand img{width:62px;height:44px;object-fit:contain}
.demo-brand span{font-size:25px;font-weight:900;line-height:.9;letter-spacing:.04em}
.demo-brand small{display:block;color:#29a7ff;font-size:10px;letter-spacing:.24em;margin-top:7px}
.demo-site-actions{display:flex;align-items:center;gap:12px}
.demo-back-link{
  color:#a8bfd2;
  text-decoration:none;
  font-size:13px;
  font-weight:800;
  margin-right:4px;
}
.demo-back-link:hover{color:#fff}
.demo-site-header .btn{white-space:nowrap}

/* Ensure hero begins at the actual top of page content */
.platform-hero{margin-top:0}
.platform-hero-copy{align-self:center}
.platform-hero-copy h1{margin-top:12px}

/* Dedicated footer */
.demo-footer{
  background:#031426;
  color:#b4c6d4;
  padding:64px 0 22px;
  border-top:1px solid rgba(104,180,241,.12);
}
.demo-footer-grid{
  display:grid;
  grid-template-columns:1.7fr .75fr .75fr 1fr;
  gap:48px;
  align-items:start;
}
.demo-footer h4{margin:0 0 16px;color:#fff;font-size:13px}
.demo-footer a,.demo-footer span{
  display:block;
  color:#aebfcd;
  text-decoration:none;
  font-size:12px;
  line-height:1.9;
}
.demo-footer a:hover{color:#fff}
.demo-footer-brand p{max-width:470px;font-size:13px;line-height:1.65;margin:20px 0 0}
.demo-footer-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  border-top:1px solid rgba(108,175,228,.12);
  margin-top:45px;
  padding-top:20px;
}
.demo-footer-bottom span,.demo-footer-bottom a{font-size:11px}

/* Fix section centering/contrast */
.platform-guided-grid>div:first-child{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}
.platform-guided-grid .btn{margin-top:4px}
.platform-guided h2{margin-bottom:14px}
.guided-check-grid{width:100%}

/* Mobile */
@media(max-width:900px){
  .demo-site-header-inner{padding:14px 20px;align-items:flex-start}
  .demo-site-actions{flex-wrap:wrap;justify-content:flex-end}
  .demo-back-link{width:100%;text-align:right}
  .demo-footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:620px){
  .demo-site-header-inner{display:block}
  .demo-site-actions{margin-top:14px;justify-content:flex-start}
  .demo-back-link{width:auto;text-align:left}
  .demo-site-actions .btn{padding:10px 12px;font-size:11px}
  .demo-footer-grid{grid-template-columns:1fr}
  .demo-footer-bottom{display:block}
  .demo-footer-bottom a{margin-top:8px}
}


/* V3.2 clean dashboard image */
.showcase-image-wrap{
  background:#f3f4f5;
  display:flex;
  align-items:flex-start;
  justify-content:center;
}
.showcase-image-wrap img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:top center;
}


/* V3.3 dashboard aspect-ratio correction */
.showcase-image-wrap{
  height:auto!important;
  aspect-ratio:5 / 3;
  overflow:hidden;
  background:#f3f4f5;
}
.showcase-image-wrap img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:top center;
  display:block;
}
@media(max-width:680px){
  .showcase-image-wrap{
    height:auto!important;
    aspect-ratio:5 / 3;
  }
}


/* V3.4 sticky header + standard Triton footer */
.demo-site-header{
  position:fixed!important;
  top:0;
  left:0;
  right:0;
  width:100%;
  z-index:1000;
  box-shadow:0 10px 30px rgba(3,20,38,.22);
}
.demo-sticky-spacer{
  height:78px;
}
.platform-demo-page .platform-hero{
  margin-top:0!important;
}

/* Remove the superseded custom footer rules from visual influence */
.demo-footer,
.demo-footer-grid,
.demo-footer-bottom{
  display:none!important;
}

/* Ensure the standard site footer renders exactly like other Triton pages */
.platform-demo-page .footer{
  display:block!important;
  background:#031426;
  margin-top:0;
}
.platform-demo-page .footer .footer-grid{
  align-items:start;
}
.platform-demo-page .footer a{
  text-decoration:none;
}
.platform-demo-page .footer a:hover{
  color:#fff;
}

@media(max-width:620px){
  .demo-sticky-spacer{
    height:132px;
  }
}


/* V3.5 — full Triton navigation and top-spacing correction */

/* Retire the prior custom product-demo header. */
.demo-site-header,
.demo-sticky-spacer{
  display:none!important;
}

/* Use the same sticky navigation behavior as the rest of the Triton website. */
.platform-demo-page .nav{
  position:sticky!important;
  top:0;
  z-index:1000;
  box-shadow:0 10px 28px rgba(3,20,38,.16);
}

/* Match the balanced desktop header used on the current homepage. */
@media (min-width:1100px){
  .platform-demo-page .nav .nav-inner{
    display:grid;
    grid-template-columns:190px minmax(0,1fr) 270px;
    align-items:center;
    width:calc(100% - 40px);
    max-width:1320px;
    margin:0 auto;
    padding-left:0;
    padding-right:0;
    column-gap:24px;
  }
  .platform-demo-page .nav .brand{
    margin:0;
    justify-self:start;
  }
  .platform-demo-page .nav .links{
    display:contents;
  }
  .platform-demo-page .nav .nav-main-links{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:17px;
    min-width:0;
    white-space:nowrap;
  }
  .platform-demo-page .nav .nav-main-links a{
    font-size:14px;
    font-weight:700;
    white-space:nowrap;
  }
  .platform-demo-page .nav .nav-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:14px;
    min-width:0;
  }
  .platform-demo-page .nav .nav-actions .btn{
    flex:0 0 auto;
    white-space:nowrap;
  }
}
@media (min-width:1100px) and (max-width:1230px){
  .platform-demo-page .nav .nav-inner{
    grid-template-columns:178px minmax(0,1fr) 250px;
    width:calc(100% - 24px);
    column-gap:16px;
  }
  .platform-demo-page .nav .nav-main-links{gap:12px}
  .platform-demo-page .nav .nav-main-links a{
    font-size:12.75px;
    font-weight:700;
  }
  .platform-demo-page .nav .nav-actions{gap:10px}
}
@media (max-width:1099px){
  .platform-demo-page .nav .nav-main-links,
  .platform-demo-page .nav .nav-actions{
    display:contents;
  }
}

/* Prevent the hero eyebrow from ever sitting beneath or touching the sticky header. */
.platform-demo-page .platform-hero{
  padding-top:92px!important;
  margin-top:0!important;
}
.platform-demo-page .platform-hero-grid{
  align-items:center;
}
.platform-demo-page .platform-hero-copy{
  align-self:center;
  padding-top:0!important;
}
.platform-demo-page .platform-hero-eyebrow{
  display:inline-block;
  position:relative;
  z-index:2;
  margin-top:0!important;
  padding-top:0!important;
  line-height:1.3;
}

/* The full menu belongs on the marketing landing page.
   The separate portal-demo application keeps its own Exit Demo control. */
@media(max-width:680px){
  .platform-demo-page .platform-hero{
    padding-top:62px!important;
  }
}

/* V3.6 chat helper */
.tc-demo-link{
  display:inline-block;
  margin-top:8px;
  color:#0d7fff;
  font-weight:800;
  text-decoration:none;
}
.tc-demo-link:hover{text-decoration:underline}


/* V3.7 — exact index-page header behavior */

/* Remove all prior page-specific layout interference. */
.platform-demo-page .nav{
  position:sticky!important;
  top:0!important;
  z-index:1000!important;
  box-shadow:none!important;
}
.platform-demo-page .nav .nav-inner,
.platform-demo-page .nav .brand,
.platform-demo-page .nav .links,
.platform-demo-page .nav .nav-main-links,
.platform-demo-page .nav .nav-actions,
.platform-demo-page .nav .nav-main-links a,
.platform-demo-page .nav .nav-actions .btn{
  min-width:0;
}

/* The exact desktop spacing below mirrors index-7(4).html. */
@media (min-width:1100px){
  .platform-demo-page .nav .nav-inner{
    display:grid!important;
    grid-template-columns:190px minmax(0,1fr) 270px!important;
    align-items:center!important;
    width:calc(100% - 40px)!important;
    max-width:1320px!important;
    margin:0 auto!important;
    padding-left:0!important;
    padding-right:0!important;
    column-gap:24px!important;
  }

  .platform-demo-page .nav .brand{
    margin:0!important;
    justify-self:start!important;
  }

  .platform-demo-page .nav .links{
    display:contents!important;
  }

  .platform-demo-page .nav .nav-main-links{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:17px!important;
    min-width:0!important;
    white-space:nowrap!important;
  }

  .platform-demo-page .nav .nav-main-links a{
    font-size:14px!important;
    font-weight:700!important;
    white-space:nowrap!important;
  }

  .platform-demo-page .nav .nav-actions{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:14px!important;
    min-width:0!important;
  }

  .platform-demo-page .nav .nav-actions .btn{
    flex:0 0 auto!important;
    white-space:nowrap!important;
  }
}

@media (min-width:1100px) and (max-width:1230px){
  .platform-demo-page .nav .nav-inner{
    grid-template-columns:178px minmax(0,1fr) 250px!important;
    width:calc(100% - 24px)!important;
    column-gap:16px!important;
  }

  .platform-demo-page .nav .nav-main-links{
    gap:12px!important;
  }

  .platform-demo-page .nav .nav-main-links a{
    font-size:12.75px!important;
    font-weight:700!important;
  }

  .platform-demo-page .nav .nav-actions{
    gap:10px!important;
  }
}

@media (max-width:1099px){
  .platform-demo-page .nav .nav-main-links,
  .platform-demo-page .nav .nav-actions{
    display:contents!important;
  }
}

/* Keep the hero comfortably clear of the sticky navigation. */
.platform-demo-page .platform-hero{
  padding-top:76px!important;
}
