/* =========================================================
   IngageAI Global Site CSS
   Paste this into DNN Custom CSS / Stylesheet settings.
   Do NOT wrap this in <style> tags.
   Page modules should NOT repeat this CSS.
   ========================================================= */

.ia-page{
  --blue:#4B9CD3;
  --blue2:#2f7fac;
  --ink:#132235;
  --muted:#5f6d7c;
  --line:#dce8f2;
  --soft:#f7fbff;
  --soft2:#eef7fd;
  --green:#0f766e;
  --green2:#0b5f59;
  --gold:#8a6400;
  --purple:#5a3ca0;
  --red:#9f2f2f;
  font-family:"Segoe UI",Roboto,Arial,sans-serif;
  color:var(--ink);
  background:#fff;
  line-height:1.65;
  font-weight:400;
}

.ia-page *{
  box-sizing:border-box;
}

.ia-wrap{
  max-width:1160px;
  margin:0 auto;
  padding:0 24px;
}

.ia-section{
  padding:58px 0;
  border-top:1px solid var(--line);
}

.ia-hero{
  padding:64px 0 68px;
  background:
    radial-gradient(circle at 88% 8%,rgba(75,156,211,.16),transparent 34%),
    linear-gradient(180deg,#f8fcff 0%,#fff 72%);
}

.ia-soft{
  background:var(--soft);
}

.ia-soft-blue{
  background:linear-gradient(180deg,#f8fcff 0%,#fff 100%);
}

.ia-soft-green{
  background:linear-gradient(180deg,#f3fbf9 0%,#fff 100%);
}

.ia-grid{
  display:grid;
  gap:28px;
}

.ia-two{
  grid-template-columns:1.08fr .92fr;
  align-items:center;
  gap:48px;
}

.ia-three{
  grid-template-columns:repeat(3,1fr);
}

.ia-four{
  grid-template-columns:repeat(4,1fr);
}

.ia-page .ia-hero-split{
  display:grid !important;
  grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr) !important;
  align-items:center !important;
  gap:48px !important;
}

.ia-page .ia-hero-copy{
  min-width:0;
}

.ia-page .ia-hero-media{
  min-width:0;
  display:flex;
  justify-content:center;
  align-items:center;
}

.ia-page .ia-hero-media .ia-video-card{
  width:100%;
  max-width:420px;
}

.ia-eyebrow{
  color:var(--blue2);
  font-size:12px;
  font-weight:500;
  letter-spacing:.08em;
  text-transform:uppercase;
  margin:0 0 12px;
}

.ia-page h1{
  font-size:clamp(30px,3.3vw,44px);
  line-height:1.2;
  margin:0 0 20px;
  letter-spacing:-.5px;
  font-weight:400;
  max-width:880px;
}

.ia-page h2{
  font-size:clamp(24px,2.6vw,34px);
  line-height:1.25;
  margin:0 0 15px;
  letter-spacing:-.3px;
  font-weight:400;
  max-width:860px;
}

.ia-page h3{
  font-size:19px;
  margin:0 0 10px;
  font-weight:500;
}

.ia-lead,
.ia-kicker{
  color:var(--muted);
  font-size:18px;
  max-width:850px;
  margin:0 0 22px;
  font-weight:400;
}

.ia-lead strong,
.ia-kicker strong{
  color:var(--ink);
  font-weight:500;
}

/* IngageAI Main Menu */

.ia-menu{
  background:#fff;
  border-bottom:1px solid var(--line);
}

.ia-menu-inner{
  max-width:1160px;
  margin:0 auto;
  padding:14px 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}

.ia-menu-brand{
  color:var(--ink);
  font-size:17px;
  font-weight:600;
  text-decoration:none;
  white-space:nowrap;
}

.ia-menu-brand span{
  color:var(--blue2);
}

.ia-menu-links{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:flex-end;
}

.ia-menu-links a{
  color:var(--muted);
  text-decoration:none;
  font-size:14px;
  font-weight:500;
  border:1px solid transparent;
  border-radius:999px;
  padding:7px 11px;
}

.ia-menu-links a:hover{
  color:var(--blue2);
  background:#f8fcff;
  border-color:#bddcf0;
  text-decoration:none;
}

.ia-menu-links a.ia-menu-active{
  color:var(--blue2);
  background:#e9f5fc;
  border-color:#bddcf0;
}

/* NorthStar Health Menu */

.ns-menu{
  background:#ffffff;
  border-bottom:1px solid #d8e8e4;
}

.ns-menu-inner{
  max-width:1160px;
  margin:0 auto;
  padding:14px 24px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
}

.ns-menu-brand{
  color:var(--green2);
  font-size:17px;
  font-weight:650;
  text-decoration:none;
  white-space:nowrap;
  padding-top:7px;
}

.ns-menu-brand span{
  color:var(--ink);
  font-weight:400;
}

.ns-menu-links{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  justify-content:flex-end;
  max-width:820px;
}

.ns-menu-links a{
  color:var(--muted);
  text-decoration:none;
  font-size:13px;
  line-height:1.2;
  font-weight:500;
  border:1px solid transparent;
  border-radius:999px;
  padding:8px 11px;
  white-space:nowrap;
}

.ns-menu-links a:hover{
  color:var(--green2);
  background:#f3fbf9;
  border-color:#b8e4dc;
  text-decoration:none;
}

.ns-menu-links a.ns-menu-active{
  color:var(--green2);
  background:#eafaf7;
  border-color:#b8e4dc;
}

/* Local Section Navigation */

.ia-local-nav{
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  padding:14px;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:24px 0 0;
}

.ia-local-nav a{
  color:var(--muted);
  background:#fff;
  border:1px solid var(--line);
  border-radius:999px;
  padding:8px 12px;
  text-decoration:none;
  font-size:14px;
  font-weight:500;
}

.ia-local-nav a:hover{
  color:var(--blue2);
  background:#f8fcff;
  border-color:#bddcf0;
  text-decoration:none;
}

/* Buttons */

.ia-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:22px;
}

.ia-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:43px;
  padding:9px 16px;
  border-radius:11px;
  border:1px solid var(--line);
  background:#fff;
  color:var(--ink) !important;
  text-decoration:none !important;
  font-weight:500;
}

.ia-btn:hover{
  text-decoration:none !important;
  background:#f8fcff;
}

.ia-btn-primary{
  background:var(--blue);
  border-color:var(--blue);
  color:#fff !important;
}

.ia-btn-primary:hover{
  background:var(--blue2);
  border-color:var(--blue2);
  color:#fff !important;
}

.ia-btn-green{
  background:var(--green);
  border-color:var(--green);
  color:#fff !important;
}

.ia-btn-green:hover{
  background:var(--green2);
  border-color:var(--green2);
  color:#fff !important;
}

/* Cards */

.ia-card,
.ia-note{
  background:#fff;
  border:1px solid var(--line);
  border-radius:22px;
  padding:24px;
}

.ia-shadow{
  box-shadow:0 18px 46px rgba(20,35,56,.07);
}

.ia-card p,
.ia-card li,
.ia-note{
  color:var(--muted);
  font-weight:400;
}

.ia-card p{
  margin:0;
}

.ia-card ul{
  margin:14px 0 0;
  padding-left:20px;
}

.ia-card li{
  margin-bottom:6px;
}

/* Video / Media Card */

.ia-video-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:26px;
  padding:18px;
  box-shadow:0 18px 46px rgba(20,35,56,.07);
  max-width:420px;
  margin:0 auto;
}

.ia-video-box{
  width:100%;
  aspect-ratio:9/16;
  border-radius:22px;
  background:#f8fcff;
  border:1px solid #bddcf0;
  overflow:hidden;
  margin-bottom:18px;
}

.ia-video-box video{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  border-radius:22px;
  background:#f8fcff;
}

.ia-video-label{
  display:inline-block;
  background:#e9f5fc;
  color:var(--blue2);
  border:1px solid #bddcf0;
  border-radius:999px;
  font-size:12px;
  font-weight:500;
  padding:7px 10px;
  text-transform:uppercase;
  margin-bottom:12px;
}

/* Story / Emphasis Blocks */

.ia-story-line{
  font-size:clamp(22px,2.5vw,32px);
  line-height:1.34;
  border-left:5px solid var(--blue);
  padding-left:20px;
  max-width:960px;
  margin:26px 0 0;
  font-weight:400;
}

.ia-story-line-green{
  border-left-color:var(--green);
}

.ia-stat{
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  padding:24px;
}

.ia-stat strong{
  display:block;
  font-size:28px;
  color:var(--blue2);
  font-weight:400;
  line-height:1.1;
}

.ia-stat span{
  display:block;
  color:var(--muted);
  margin-top:8px;
}

.ia-different{
  background:#fff;
  border:1px solid #bddcf0;
  border-radius:28px;
  padding:34px;
  box-shadow:0 18px 46px rgba(20,35,56,.07);
}

.ia-different h2{
  max-width:980px;
}

.ia-different-line{
  font-size:clamp(26px,3.2vw,42px);
  line-height:1.26;
  border-left:6px solid var(--blue);
  padding-left:22px;
  margin:28px 0 28px;
  font-weight:400;
  color:var(--ink);
}

/* Product Status Labels */

.ia-status-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:0 0 16px;
}

.ia-status{
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  border:1px solid #bddcf0;
  background:#e9f5fc;
  color:var(--blue2);
  font-size:12px;
  font-weight:500;
  letter-spacing:.04em;
  text-transform:uppercase;
  padding:6px 10px;
}

.ia-status-live{
  background:#e9f5fc;
  border-color:#bddcf0;
  color:var(--blue2);
}

.ia-status-inflight{
  background:#fff8e8;
  border-color:#ead59a;
  color:#8a6400;
}

.ia-status-concept{
  background:#f4f7fb;
  border-color:#dce8f2;
  color:#5f6d7c;
}

.ia-status-future{
  background:#f5f0ff;
  border-color:#dacbff;
  color:#5a3ca0;
}

.ia-status-production{
  background:#edf7ed;
  border-color:#b9dfbf;
  color:#276738;
}

/* Product Catalog Cards */

.ia-product-list{
  display:grid;
  gap:16px;
  margin-top:26px;
}

.ia-product-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:20px;
  padding:24px 26px;
  box-shadow:0 12px 32px rgba(20,35,56,.045);
}

.ia-product-card h3{
  font-size:21px;
  line-height:1.25;
  margin:0 0 8px;
  font-weight:500;
  color:var(--ink);
}

.ia-product-card p{
  color:var(--muted);
  font-size:16px;
  line-height:1.65;
  margin:0;
  max-width:940px;
}

.ia-product-meta{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:0 0 14px;
}

.ia-product-note{
  margin-top:14px;
  padding-top:14px;
  border-top:1px solid var(--line);
  color:var(--muted);
  font-size:15px;
}

.ia-product-note strong{
  color:var(--ink);
  font-weight:500;
}

.ia-product-section-intro{
  max-width:920px;
}

/* Scrum-to-Product Maturity Badges */

.ia-product-head{
  display:flex;
  gap:18px;
  align-items:flex-start;
}

.ia-product-badge{
  width:76px;
  min-width:76px;
  min-height:76px;
  border-radius:22px;
  background:linear-gradient(180deg,#e9f5fc 0%,#f8fcff 100%);
  border:1px solid #bddcf0;
  color:var(--blue2);
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  flex:0 0 auto;
  line-height:1.05;
  text-align:center;
  padding:8px;
}

.ia-product-badge strong{
  display:block;
  font-size:24px;
  font-weight:650;
  color:var(--blue2);
}

.ia-product-badge span{
  display:block;
  margin-top:5px;
  font-size:9px;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--muted);
  font-weight:650;
}

.ia-badge-idea{
  background:#f5f0ff;
  border-color:#dacbff;
}

.ia-badge-idea strong{
  color:#5a3ca0;
}

.ia-badge-backlog{
  background:#f4f7fb;
  border-color:#dce8f2;
}

.ia-badge-backlog strong{
  color:#5f6d7c;
}

.ia-badge-card{
  background:#f4f7fb;
  border-color:#dce8f2;
}

.ia-badge-card strong{
  color:#2f7fac;
}

.ia-badge-progress{
  background:#fff8e8;
  border-color:#ead59a;
}

.ia-badge-progress strong{
  color:#8a6400;
}

.ia-badge-review{
  background:#fff8e8;
  border-color:#ead59a;
}

.ia-badge-review strong{
  color:#8a6400;
}

.ia-badge-e2e{
  background:#e9f5fc;
  border-color:#bddcf0;
}

.ia-badge-e2e strong{
  color:var(--blue2);
}

.ia-badge-done{
  background:#eafaf7;
  border-color:#b8e4dc;
}

.ia-badge-done strong{
  color:#0f766e;
}

.ia-badge-production{
  background:#edf7ed;
  border-color:#b9dfbf;
}

.ia-badge-production strong{
  color:#276738;
}

.ia-badge-preserved{
  background:#fff4f4;
  border-color:#f2c5c5;
}

.ia-badge-preserved strong{
  color:#9f2f2f;
}

.ia-product-body{
  flex:1;
  min-width:0;
}

.ia-roi-line{
  margin-top:14px;
  padding:13px 15px;
  border-radius:16px;
  background:#f8fcff;
  border:1px solid var(--line);
  color:var(--muted);
  font-size:15px;
  line-height:1.55;
}

.ia-roi-line strong{
  color:var(--ink);
  font-weight:500;
}

.ia-automation-line{
  margin-top:14px;
  padding:13px 15px;
  border-radius:16px;
  background:#fff;
  border:1px dashed #bddcf0;
  color:var(--muted);
  font-size:15px;
  line-height:1.55;
}

.ia-automation-line strong{
  color:var(--blue2);
  font-weight:500;
}

.ia-demo-line{
  margin-top:14px;
  padding:13px 15px;
  border-radius:16px;
  background:#ffffff;
  border:1px solid #bddcf0;
  color:var(--muted);
  font-size:15px;
  line-height:1.55;
}

.ia-demo-line strong{
  color:var(--ink);
  font-weight:500;
}

.ia-demo-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-top:14px;
  min-height:38px;
  padding:8px 13px;
  border-radius:10px;
  border:1px solid var(--blue);
  background:#fff;
  color:var(--blue2) !important;
  text-decoration:none !important;
  font-size:14px;
  font-weight:500;
}

.ia-demo-link:hover{
  text-decoration:none !important;
  background:#f8fcff;
}

/* Question / Answer Blocks */

.ia-qa-list{
  display:grid;
  gap:16px;
  margin-top:26px;
}

.ia-qa-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:20px;
  padding:24px 26px;
  box-shadow:0 12px 32px rgba(20,35,56,.04);
}

.ia-qa-card h3{
  font-size:20px;
  margin:0 0 10px;
  color:var(--ink);
  font-weight:500;
}

.ia-qa-card p{
  margin:0;
  color:var(--muted);
  font-size:16px;
  line-height:1.65;
}

/* Problem Page Blocks */

.ia-problem-band{
  background:#fff;
  border:1px solid var(--line);
  border-radius:28px;
  padding:34px;
  box-shadow:0 18px 46px rgba(20,35,56,.07);
}

.ia-problem-line{
  font-size:clamp(25px,3vw,40px);
  line-height:1.28;
  border-left:6px solid var(--blue);
  padding-left:22px;
  margin:26px 0;
  font-weight:400;
  color:var(--ink);
}

.ia-problem-line-green{
  border-left-color:var(--green);
}

/* Final CTA Section */

.ia-final{
  background:var(--ink);
  color:#fff;
}

.ia-final h2,
.ia-final p{
  color:#fff;
}

.ia-final .ia-kicker{
  color:#d7e6f1;
}

.ia-final .ia-eyebrow{
  color:#8fd0ff;
}

.ia-final .ia-btn{
  border-color:#fff;
}

.ia-final .ia-btn-primary{
  border-color:var(--blue);
}

/* Responsive */

@media(max-width:1000px){
  .ia-four{
    grid-template-columns:repeat(2,1fr);
  }

  .ns-menu-inner{
    display:block;
  }

  .ns-menu-links{
    justify-content:flex-start;
    max-width:none;
    margin-top:10px;
  }
}

@media(max-width:900px){
  .ia-two,
  .ia-three,
  .ia-four{
    grid-template-columns:1fr;
  }

  .ia-page .ia-hero-split{
    grid-template-columns:1fr !important;
    gap:28px !important;
  }

  .ia-page .ia-hero-media{
    justify-content:flex-start;
  }

  .ia-page .ia-hero-media .ia-video-card{
    max-width:380px;
  }

  .ia-section,
  .ia-hero{
    padding:46px 0;
  }

  .ia-page h1{
    font-size:32px;
  }

  .ia-page h2{
    font-size:26px;
  }

  .ia-lead,
  .ia-kicker{
    font-size:17px;
  }

  .ia-video-card{
    max-width:360px;
  }

  .ia-different{
    padding:24px;
  }

  .ia-different-line{
    font-size:25px;
  }

  .ia-product-card{
    padding:22px;
  }

  .ia-product-card h3{
    font-size:20px;
  }

  .ia-menu-inner{
    display:block;
  }

  .ia-menu-links{
    justify-content:flex-start;
    margin-top:12px;
  }
}

@media(max-width:700px){
  .ia-wrap{
    padding:0 18px;
  }

  .ia-product-head{
    display:block;
  }

  .ia-product-badge{
    margin-bottom:14px;
  }

  .ia-actions{
    flex-direction:column;
  }

  .ia-btn{
    width:100%;
  }

  .ns-menu-links a,
  .ia-menu-links a{
    font-size:13px;
    padding:7px 10px;
  }
}

@media(max-width:520px){
  .ia-page .ia-hero-media .ia-video-card{
    max-width:100%;
  }
}
