:root{
  --mtm-body-font:'Lato', sans-serif;
  --mtm-primary-font:'Playfair Display', serif;
  --ai-red:#EC2227;
  --ai-blue:#36AADD;
  --ai-ice:#9FD8F1;
  --ai-ink:#0D0C0D;
  --ai-slate:#1C2733;
  --ai-bg:#F7FBFF;
  --ai-card: rgba(255,255,255,.78);
  --ai-card-border: rgba(54,170,223,.22);
  --ai-shadow: 0 18px 50px rgba(13,12,13,.12);
  --ai-radius: 1.25rem;
}
html{ scroll-behavior:smooth; }
body{
  font-family: var(--mtm-body-font);
  background: radial-gradient(1200px 700px at 10% -10%, rgba(159,216,241,.50), rgba(247,251,255,0) 70%),
              radial-gradient(900px 600px at 90% 0%, rgba(54,170,223,.30), rgba(247,251,255,0) 60%),
              var(--ai-bg);
  color: var(--ai-ink);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
a{ color: var(--ai-blue); }
a:hover{ color: #2a8bb8; }

.navbar{ transition: background-color .25s ease, box-shadow .25s ease, backdrop-filter .25s ease; }
.navbar.ai-navbar{
  background: rgba(255,255,255,.45);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(54,170,223,.12);
}
.navbar.ai-navbar.scrolled{
  background: rgba(255,255,255,.78);
  box-shadow: 0 12px 36px rgba(13,12,13,.08);
}

/* Navbar link styles */
.ai-navbar .nav-link{
  color: var(--ai-slate);
  font-weight: 600;
  letter-spacing: .01em;
  position: relative;
  transition: color .18s ease, opacity .18s ease;
}
.ai-navbar .nav-link:hover,
.ai-navbar .nav-link:focus{
  color: var(--ai-blue);
}
.ai-navbar .nav-link.active{
  color: var(--ai-blue);
}
.ai-navbar .nav-link::after{ display:none !important; }
/* Home hero navbar variant: overlays hero */
.ai-navbar.ai-navbar--hero{
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1030;
  background: rgba(255,255,255,.72);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(54,170,223,.14);
}
.ai-navbar.ai-navbar--hero .nav-link{
  color: var(--ai-slate);
}
.ai-navbar.ai-navbar--hero .nav-link:hover,
.ai-navbar.ai-navbar--hero .nav-link:focus,
.ai-navbar.ai-navbar--hero .nav-link.active{
  color: var(--ai-blue);
}
.ai-navbar.ai-navbar--hero.scrolled{
  background: rgba(255,255,255,.86);
  box-shadow: 0 12px 36px rgba(13,12,13,.08);
}
/* Keep navbar padding for all other items, but let logo touch top/bottom */
.ai-navbar .navbar-brand{
  padding-top: 0;
  padding-bottom: 0;
  margin-top: -.5rem;     /* matches Bootstrap navbar vertical padding */
  margin-bottom: -.5rem;  /* matches Bootstrap navbar vertical padding */
}

.ai-navbar .navbar-brand img{
  height: 50px;           /* adjust if needed */
  width: auto;
  display: block;
}

.btn-ai{
  --bs-btn-color:#fff;
  --bs-btn-bg: var(--ai-red);
  --bs-btn-border-color: var(--ai-red);
  --bs-btn-hover-bg:#c91b20;
  --bs-btn-hover-border-color:#c91b20;
  --bs-btn-active-bg:#b6171c;
  --bs-btn-active-border-color:#b6171c;
  box-shadow: 0 12px 30px rgba(236,34,39,.22);
}
.btn-ai-outline{
  --bs-btn-color: var(--ai-slate);
  --bs-btn-border-color: rgba(54,170,223,.45);
  --bs-btn-hover-color: var(--ai-ink);
  --bs-btn-hover-bg: rgba(159,216,241,.25);
  --bs-btn-hover-border-color: rgba(54,170,223,.55);
  --bs-btn-active-bg: rgba(159,216,241,.35);
  border-width:2px;
}

.ai-hero{ position:relative; overflow:hidden; border-bottom:1px solid rgba(54,170,223,.14); }
.ai-hero::before{
  content:""; position:absolute; inset:-40px -40px -80px -40px;
  background:
    radial-gradient(900px 420px at 15% 10%, rgba(236,34,39,.18), rgba(236,34,39,0) 55%),
    radial-gradient(820px 420px at 85% 5%, rgba(54,170,223,.35), rgba(54,170,223,0) 60%),
    linear-gradient(180deg, rgba(247,251,255,.65), rgba(247,251,255,0) 55%);
  pointer-events:none;
}
.ai-hero::after{
  content:""; position:absolute; inset:0;
  background-image: var(--hero-bg);
  background-size:cover; background-position:center;
  opacity:.18; mix-blend-mode:multiply;
  transform: translate3d(0,var(--hero-shift,0px),0);
  pointer-events:none;
}
.ai-hero .container{ position:relative; z-index:1; }

.ai-hero-badge{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.45rem .75rem; border-radius:999px;
  background: rgba(255,255,255,.65);
  border: 1px solid rgba(54,170,223,.20);
  box-shadow: 0 10px 30px rgba(13,12,13,.06);
  font-weight:600;
}
.ai-gradient-text{
  background: linear-gradient(90deg, var(--ai-red), var(--ai-blue));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}

.ai-card{
  background: var(--ai-card);
  border: 1px solid var(--ai-card-border);
  border-radius: var(--ai-radius);
  box-shadow: var(--ai-shadow);
}
.ai-card-soft{
  background: rgba(255,255,255,.62);
  border: 1px solid rgba(54,170,223,.14);
  border-radius: var(--ai-radius);
}

/* ==========================================================
   Lighter, image-led blocks (reduces "card overload")
   ========================================================== */
.ai-mediaCard{
  border-radius: var(--ai-radius);
  overflow: hidden;
  border: 1px solid rgba(54,170,223,.18);
  background: rgba(255,255,255,.55);
  box-shadow: 0 14px 44px rgba(13,12,13,.10);
}
.ai-mediaCard__media{
  position: relative;
  aspect-ratio: 16 / 10;
  overflow: hidden;
}
.ai-mediaCard__img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transform: scale(1.02);
  filter: saturate(1.05) contrast(1.02);
}
.ai-mediaCard__overlay{
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(13,12,13,0) 35%, rgba(13,12,13,.40) 100%);
  pointer-events: none;
}
.ai-mediaCard__body{
  position: relative;
}

/* Image + caption without heavy card framing */
.ai-figure{
  margin: 0;
  border-radius: var(--ai-radius);
  overflow: hidden;
  border: 1px solid rgba(54,170,223,.18);
  background: rgba(255,255,255,.45);
  box-shadow: 0 14px 44px rgba(13,12,13,.08);
}
.ai-figure__img{
  width: 100%;
  height: auto;
  display: block;
}
.ai-figure__cap{
  padding: 14px 16px 16px;
}

/* Two-column feature list (replaces mini-cards) */
.ai-checkgrid{
  margin-top: 8px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 18px;
}
@media (max-width: 575.98px){
  .ai-checkgrid{ grid-template-columns: 1fr; }
}
.ai-checkgrid__item{
  padding: 12px 12px 10px;
  border-radius: 1rem;
  border: 1px dashed rgba(54,170,223,.28);
  background: rgba(255,255,255,.40);
}
.ai-checkgrid__item .fw-semibold{
  font-family: var(--mtm-body-font);
}
.ai-icon{
  width:46px; height:46px;
  display:grid; place-items:center;
  border-radius:14px;
  background: radial-gradient(circle at 30% 25%, rgba(159,216,241,.65), rgba(54,170,223,.18));
  border: 1px solid rgba(54,170,223,.18);
  color: var(--ai-slate);
}
.ai-kpi{ font-weight:800; font-size:clamp(1.6rem, 1.4rem + 1vw, 2.4rem); letter-spacing:-0.02em; }
.ai-muted{ color: rgba(28,39,51,.75); }

.section-pad{ padding:4.5rem 0; }
.reveal{ opacity:0; transform: translateY(18px); transition: opacity .7s ease, transform .7s ease; }
.reveal.in-view{ opacity:1; transform: translateY(0); }
.ai-divider{
  height:1px;
  background: linear-gradient(90deg, rgba(54,170,223,0), rgba(54,170,223,.35), rgba(236,34,39,.22), rgba(54,170,223,0));
}
footer{
  background: linear-gradient(180deg, rgba(247,251,255,0), rgba(159,216,241,.18));
  border-top: 1px solid rgba(54,170,223,.14);
}
.badge-ai{
  background: rgba(54,170,223,.12);
  border: 1px solid rgba(54,170,223,.22);
  color: var(--ai-slate);
  border-radius:999px;
  padding:.45rem .7rem;
}
.form-control, .form-select{
  border-radius:1rem;
  border-color: rgba(54,170,223,.28);
}
.form-control:focus, .form-select:focus{
  border-color: rgba(54,170,223,.55);
  box-shadow: 0 0 0 .25rem rgba(54,170,223,.18);
}

/* Typography: Google Fonts */
h1,h2,h3,h4,h5,h6{
  font-family: var(--mtm-primary-font);
}
.ai-navbar .nav-link,
.ai-navbar .dropdown-item{
  font-family: var(--mtm-body-font);
}

/* Navbar dropdown (glass) */
.navbar .dropdown-menu{
  background: rgba(255,255,255,.88);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(54,170,223,.16);
  border-radius: 1rem;
  box-shadow: 0 18px 50px rgba(13,12,13,.12);
  padding: .5rem;
}
.navbar .dropdown-item{
  border-radius: .75rem;
  padding: .55rem .75rem;
  font-weight: 600;
}
.navbar .dropdown-item.active,
.navbar .dropdown-item:active{
  background: rgba(54,170,223,.18);
  color: var(--ai-ink);
}

/* Mobile dropdown: keep menu readable inside collapsed navbar */
@media (max-width: 991.98px){
  .ai-navbar .dropdown-menu{
    position: static;
    float: none;
    width: 100%;
    margin-top: .35rem;
  }
  .ai-navbar .dropdown-menu.dropdown-menu-end{
    right: auto;
    left: auto;
  }
}

/* ==========================================================
   Full-Viewport Hero (Home Only)
   ========================================================== */
:root{
  --cnvs-accent: var(--ai-blue);
  --cnvs-accent-2: var(--ai-ice);
}

.cnvs-hero{
  position: relative;
  height: 100vh;
  min-height: 720px;
  background-color: #0b1117;
  overflow: hidden;
}
@media (max-width: 991.98px){ .cnvs-hero{ min-height: 640px; } }
@media (max-width: 575.98px){ .cnvs-hero{ min-height: 540px; } }

.cnvs-hero__bg{
  position:absolute;
  inset:-40px;
  background-size: cover;
  background-position: right top;
  background-repeat: no-repeat;
  transform: translate3d(0,0,0) scale(1.05);
  will-change: transform;
  filter: saturate(1.05) contrast(1.03);
}
@media (max-width: 991.98px){ .cnvs-hero__bg{
  background-position: left bottom !important;
} }

.cnvs-hero__overlay{
  position:absolute;
  inset:0;
  background: linear-gradient(90deg, rgba(0,0,0,0.52), rgba(0,0,0,0.0));
}

.cnvs-hero__inner{
  position: relative;
  z-index: 2;
  height: 100%;
  display:flex;
  align-items:center;
  padding-top: 86px;
}

.cnvs-hero__container{
  position: relative;
  height: 100%;
  display:flex;
  align-items:center;
}

/* Hero layout: integrated promo card (no overlap) */
.cnvs-hero__grid{
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
  gap: 28px;
  width: 100%;
  height: 100%;
  align-items: stretch;
  padding: 0 50px 28px;
}
.cnvs-hero__grid > .cnvs-hero__content{
  padding-left: 0;
  align-self: center;
}
@media (max-width: 991.98px){
  .cnvs-hero__grid{
    grid-template-columns: 1fr;
    padding: 0 22px 18px;
    gap: 18px;
  }
}
@media (max-width: 575.98px){
  .cnvs-hero__grid{
    padding: 0 18px 16px;
  }
}

.cnvs-hero__promo{
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.18);
  border-radius: 18px;
  padding: 18px 18px 16px;
  backdrop-filter: blur(16px);
  box-shadow: 0 18px 60px rgba(0,0,0,0.35);
  color: rgba(255,255,255,0.92);
  max-width: 520px;
  justify-self: end;
  align-self: end; /* stick to bottom */
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 900ms ease, transform 900ms ease;
  transition-delay: 220ms;
}
@media (max-width: 991.98px){
  .cnvs-hero__promo{
    max-width: 720px;
    justify-self: center; /* centered on mobile */
    width: 100%;
  }
}
@media (max-width: 575.98px){
  .cnvs-hero__promo{
    max-width: 520px; /* keep card readable */
  }
}

.cnvs-hero__promoBadge{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(54,170,223,0.18);
  border: 1px solid rgba(54,170,223,0.35);
  font-weight: 800;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  font-size: 12px;
  margin-bottom: 12px;
}
.cnvs-hero__promoTitle{
  font-family: var(--mtm-primary-font);
  font-weight: 800;
  font-size: 28px;
  line-height: 1.15;
  margin: 0 0 8px 0;
}
.cnvs-hero__promoSub{
  margin: 0 0 12px 0;
  color: rgba(255,255,255,0.80);
  font-size: 14px;
  line-height: 1.6;
}
.cnvs-hero__promoList{
  list-style: none;
  padding: 0;
  margin: 0 0 14px 0;
  display: grid;
  gap: 8px;
}
.cnvs-hero__promoList li{
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: 13px;
  color: rgba(255,255,255,0.82);
}
.cnvs-hero__promoList i{
  color: var(--cnvs-accent-2);
  margin-top: 2px;
}
.cnvs-hero__promoActions{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
.cnvs-hero__promoActions .cnvs-hero__btn{
  padding: 10px 16px;
}

.cnvs-hero.is-ready .cnvs-hero__promo{
  opacity: 1;
  transform: none;
}

/* Keep hero comfortable on short viewports */
@media (max-height: 760px){
  .cnvs-hero__inner{
    align-items: flex-start;
    padding-top: 92px;
    padding-bottom: 22px;
  }
  .cnvs-hero__container{ align-items: stretch; }
}
  .cnvs-hero__container{ align-items: flex-start; }
}

.cnvs-hero__content{
  position: relative;
  padding-left: 0;
  max-width: 860px;
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 900ms ease, transform 900ms ease;
  transition-delay: 140ms;
  color: rgba(255,255,255,0.92);
}
@media (max-width: 575.98px){ .cnvs-hero__content{ padding-left: 0; } }

.cnvs-hero__kicker{
  display:inline-flex;
  align-items:center;
  gap: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 14px;
  font-size: 1.7vw;
  font-weight: 500;
  font-family: 'Delicious Handrawn', cursive;
  color: var(--ai-ice);
}
.cnvs-hero__kickerDot{
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--cnvs-accent);
  box-shadow: 0 0 18px rgba(54,170,223,0.35);
}

.cnvs-hero__title{
  margin: 0 0 18px 0;
  font-weight: 800;
  line-height: 1.03;
  font-size: 64px;
  font-family: var(--mtm-primary-font);
}
@media (max-width: 991.98px){ .cnvs-hero__title{ font-size: 48px; } }
@media (max-width: 575.98px){ .cnvs-hero__title{ font-size: 38px; } }

.cnvs-hero__sub{
  margin: 0 0 22px 0;
  max-width: 720px;
  font-size: 16px;
  line-height: 1.65;
  color: rgba(255,255,255,0.82);
}

.cnvs-hero__line{
  position:absolute;
  left: clamp(140px, 22vw, 260px);
  width: 2px;
  height: 96px;
  background: var(--cnvs-accent);
  opacity: 0;
  transform: translateY(-18px);
  transition: opacity 800ms ease, transform 800ms ease;
  transition-delay: 260ms;
  box-shadow: 0 0 18px rgba(54,170,223,0.35);
}
.cnvs-hero__line--top{ top: calc(50% - 178px); }
.cnvs-hero__line--bottom{ top: calc(50% + 137px); transform: translateY(18px); }
@media (max-width: 575.98px){ .cnvs-hero__line{ display:none; } }

.cnvs-hero__actions{
  display:flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items:center;
  margin-top: 6px;
}

.cnvs-hero__btn{
  display:inline-flex;
  align-items:center;
  gap: 10px;
  padding: 12px 18px;
  border-radius: 999px;
  font-weight: 800;
  letter-spacing: 0.02em;
  cursor: pointer;
  user-select: none;
  text-decoration: none;
  border: 2px solid transparent;
  transition: transform 250ms ease, border-color 250ms ease, color 250ms ease, background 250ms ease, box-shadow 250ms ease;
  font-family: var(--mtm-body-font);
}
.cnvs-hero__btn i{ font-size: 0.95em; }
.cnvs-hero__btn:hover,
.cnvs-hero__btn:focus-visible{
  transform: translateY(-1px);
  outline: none;
}

.cnvs-hero__btn--primary{
  background: var(--cnvs-accent);
  color: #061018;
  box-shadow: 0 12px 30px rgba(54,170,223,0.20);
}
.cnvs-hero__btn--primary:hover,
.cnvs-hero__btn--primary:focus-visible{
  background: var(--cnvs-accent-2);
  color: #061018;
}

.cnvs-hero__btn--ghost{
  background: transparent;
  color: rgba(255,255,255,0.92);
  border-color: rgba(255,255,255,0.78);
}
.cnvs-hero__btn--ghost:hover,
.cnvs-hero__btn--ghost:focus-visible{
  color: var(--cnvs-accent-2);
  border-color: var(--cnvs-accent-2);
  box-shadow: 0 0 0 4px rgba(54,170,223,0.18);
}

.cnvs-hero__note{
  margin-top: 18px;
  font-size: 12px;
  color: rgba(255,255,255,0.62);
}

.cnvs-hero.is-ready .cnvs-hero__line,
.cnvs-hero.is-ready .cnvs-hero__content{
  opacity: 1;
  transform: none;
}

/* Modal (glass + 8px video padding) */
.cnvs-hero__modal{
  position: fixed;
  inset: 0;
  z-index: 1090;
  display: none;
}
.cnvs-hero__modal.is-open{ display:block; }

.cnvs-hero__modalBackdrop{
  position:absolute;
  inset:0;
  background: rgba(0,0,0,0.78);
}

.cnvs-hero__modalPanel{
  position:absolute;
  left:50%;
  top:50%;
  transform: translate(-50%, -50%);
  width: min(980px, calc(100% - 32px));
  background: rgba(255,255,255,0.08);
  backdrop-filter: blur(14px);
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 16px;
  box-shadow: 0 20px 70px rgba(0,0,0,0.65);
  overflow: hidden;
}

.cnvs-hero__modalClose{
  position:absolute;
  right: 10px;
  top: 8px;
  z-index: 2;
  border: none;
  background: rgba(0,0,0,0.25);
  color: rgba(255,255,255,0.92);
  width: 42px;
  height: 42px;
  border-radius: 999px;
  display:grid;
  place-items:center;
  cursor:pointer;
}
.cnvs-hero__modalClose:hover,
.cnvs-hero__modalClose:focus-visible{
  color:#fff;
  outline:none;
  box-shadow: 0 0 0 4px rgba(54,170,223,0.22);
}

.cnvs-hero__videoWrap{
  padding: 8px;
}
.cnvs-hero__videoInner{
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 14px;
  overflow: hidden;
  background: rgba(0,0,0,0.70);
  box-shadow: 0 18px 50px rgba(0,0,0,0.45);
}
.cnvs-hero__videoInner iframe{
  width: 100%;
  height: 100%;
  border: 0;
  display:block;
}

@media (prefers-reduced-motion: reduce){
  .cnvs-hero__bg{ transform: none !important; }
  .cnvs-hero__content, .cnvs-hero__line{ transition: none !important; }
}

/* Animated mobile toggler */
.ai-nav-toggler{
  width: 46px;
  height: 42px;
  padding: .55rem .6rem;
  border-radius: 999px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
  border: 1px solid rgba(54,170,223,.35);
  background: rgba(255,255,255,.35);
  backdrop-filter: blur(10px);
  color: var(--ai-slate);
}
.ai-navbar--hero .ai-nav-toggler{
  border-color: rgba(255,255,255,.30);
  background: rgba(11,17,23,.22);
  color: rgba(255,255,255,.92);
}
.ai-nav-toggler:focus{
  box-shadow: 0 0 0 .25rem rgba(54,170,223,.18);
}
.ai-toggler-bar{
  display: block;
  width: 22px;
  height: 2px;
  align-self: center;
  border-radius: 999px;
  background: currentColor;
  transition: transform .22s ease, opacity .18s ease;
}
.ai-nav-toggler[aria-expanded="true"] .ai-toggler-bar:nth-child(1){
  transform: translateY(8px) rotate(45deg);
}
.ai-nav-toggler[aria-expanded="true"] .ai-toggler-bar:nth-child(2){
  opacity: 0;
}
.ai-nav-toggler[aria-expanded="true"] .ai-toggler-bar:nth-child(3){
  transform: translateY(-8px) rotate(-45deg);
}

/* Desktop dropdown on hover (keeps click on mobile) */
@media (min-width: 992px){
  .ai-navbar .dropdown-menu{
    display: block;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    pointer-events: none;
    transition: opacity .16s ease, transform .16s ease, visibility .16s ease;
    margin-top: 0;
  }
  .ai-navbar .dropdown:hover > .dropdown-menu,
  .ai-navbar .dropdown:focus-within > .dropdown-menu{
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
  }
}

/* ==========================================================
   Products & Services: icon-forward feature cards (no images)
   ========================================================== */
.ai-featureCard{
  background: rgba(255,255,255,.70);
  border: 1px solid rgba(54,170,223,.20);
  border-radius: var(--ai-radius);
  box-shadow: 0 18px 50px rgba(13,12,13,.10);
  position: relative;
  overflow: hidden;
}
.ai-featureCard::before{
  content:"";
  position:absolute;
  inset:-40px -40px auto -40px;
  height: 170px;
  background:
    radial-gradient(220px 140px at 12% 25%, rgba(151, 199, 221,.14), rgba(236,34,39,0) 60%),
    radial-gradient(260px 160px at 88% 35%, rgba(54,170,223,.20), rgba(54,170,223,0) 65%);
  pointer-events:none;
}
.ai-featureCard > *{ position: relative; z-index: 1; }

.ai-icon.ai-icon--hero{
  width: 56px;
  height: 56px;
  border-radius: 18px;
  background:
    radial-gradient(circle at 30% 25%, rgba(159,216,241,.75), rgba(54,170,223,.22));
  border: 1px solid rgba(54,170,223,.22);
  box-shadow: 0 12px 30px rgba(13,12,13,.08);
}
.ai-icon.ai-icon--hero i{
  font-size: 1.2rem;
}

.ai-chip{
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  padding: .4rem .7rem;
  border-radius: 999px;
  background: rgba(54,170,223,.10);
  border: 1px solid rgba(54,170,223,.22);
  color: var(--ai-slate);
  font-weight: 800;
  letter-spacing: .02em;
  text-transform: uppercase;
  font-size: 11px;
}

.ai-iconlist{
  list-style: none;
  padding-left: 0;
  display: grid;
  gap: 8px;
}
.ai-iconlist li{
  display:flex;
  gap: 10px;
  align-items:flex-start;
}
.ai-iconlist li i{
  color: var(--ai-blue);
  margin-top: 2px;
}

/* ==========================================================
   Emphasis text: Ice And Snow font (user-provided)
   ========================================================== */

/* IMPORTANT: place the font file at:
   assets/fonts/IceAndsnowNormal-2ve8.ttf
*/
@font-face{
  font-family: "IceAndSnow";
  src: url("../fonts/IceAndsnowNormal-2ve8.ttf") format("truetype");
  font-display: swap;
}

.ai-iceText{
  display: inline-block;
  font-family: "IceAndSnow", var(--mtm-primary-font);
  font-size: 2.5rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: #e51c23; /* red */
  line-height: 1;
}

/* Remove old snow overlays if any remain */
.ai-iceText::before,
.ai-iceText::after{
  content: none !important;
}

/* Snow sits only on the top of letters with little drips */
.ai-iceText::after{
  content: attr(data-text);
  position: absolute;
  inset: 0;
  pointer-events: none;

  color: #ffffff;
  /* icy blue edge like logo snow */
  -webkit-text-stroke: 3px #1aa3ff;

  /* Mask: show only the top band + a handful of rounded drips */
  -webkit-mask-image:
    linear-gradient(#000 0 46%, rgba(0,0,0,0) 74%),
    radial-gradient(18px 14px at 12% 56%, #000 62%, transparent 63%),
    radial-gradient(26px 18px at 28% 54%, #000 62%, transparent 63%),
    radial-gradient(20px 16px at 44% 60%, #000 62%, transparent 63%),
    radial-gradient(30px 22px at 58% 54%, #000 62%, transparent 63%),
    radial-gradient(18px 14px at 70% 58%, #000 62%, transparent 63%),
    radial-gradient(26px 18px at 86% 54%, #000 62%, transparent 63%);
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  -webkit-mask-position: center;

  mask-image:
    linear-gradient(#000 0 46%, rgba(0,0,0,0) 74%),
    radial-gradient(18px 14px at 12% 56%, #000 62%, transparent 63%),
    radial-gradient(26px 18px at 28% 54%, #000 62%, transparent 63%),
    radial-gradient(20px 16px at 44% 60%, #000 62%, transparent 63%),
    radial-gradient(30px 22px at 58% 54%, #000 62%, transparent 63%),
    radial-gradient(18px 14px at 70% 58%, #000 62%, transparent 63%),
    radial-gradient(26px 18px at 86% 54%, #000 62%, transparent 63%);
  mask-repeat: no-repeat;
  mask-size: 100% 100%;
  mask-position: center;
}

/* subtle snowy highlight */
.ai-iceText::before{
  content:"";
  position:absolute;
  left: 4%;
  right: 4%;
  top: -0.10em;
  height: 0.45em;
  background: linear-gradient(180deg, rgba(255,255,255,0.55), rgba(255,255,255,0));
  border-radius: 999px;
  pointer-events:none;
  filter: blur(.2px);
}

/* Keep stroke thickness reasonable on mobile */
@media (max-width: 575.98px){
  .ai-iceText{
    -webkit-text-stroke: 6px #0d0c0d;
  }
  .ai-iceText::after{
    -webkit-text-stroke: 2.5px #1aa3ff;
  }
}

/* Snow cap overlay (masked to top + drips) */
.ai-iceText::after{
  content: attr(data-text);
  position: absolute;
  inset: 0;
  pointer-events: none;
  color: #ffffff;
  -webkit-text-stroke: 3px #1aa3ff; /* icy blue outline */
  text-shadow:
    0 3px 0 rgba(26,163,255,0.65),
    0 10px 20px rgba(0,0,0,0.25);

  /* Only show the snowy top + drips via mask */
  -webkit-mask-image:
    linear-gradient(#000 0 52%, rgba(0,0,0,0) 78%),
    radial-gradient(20px 14px at 10% 62%, #000 62%, transparent 63%),
    radial-gradient(28px 18px at 24% 58%, #000 62%, transparent 63%),
    radial-gradient(22px 16px at 40% 66%, #000 62%, transparent 63%),
    radial-gradient(30px 20px at 54% 60%, #000 62%, transparent 63%),
    radial-gradient(18px 14px at 66% 64%, #000 62%, transparent 63%),
    radial-gradient(26px 18px at 80% 58%, #000 62%, transparent 63%),
    radial-gradient(22px 16px at 92% 66%, #000 62%, transparent 63%);
  -webkit-mask-composite: source-over;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  -webkit-mask-position: center;

  mask-image:
    linear-gradient(#000 0 52%, rgba(0,0,0,0) 78%),
    radial-gradient(20px 14px at 10% 62%, #000 62%, transparent 63%),
    radial-gradient(28px 18px at 24% 58%, #000 62%, transparent 63%),
    radial-gradient(22px 16px at 40% 66%, #000 62%, transparent 63%),
    radial-gradient(30px 20px at 54% 60%, #000 62%, transparent 63%),
    radial-gradient(18px 14px at 66% 64%, #000 62%, transparent 63%),
    radial-gradient(26px 18px at 80% 58%, #000 62%, transparent 63%),
    radial-gradient(22px 16px at 92% 66%, #000 62%, transparent 63%);
  mask-repeat: no-repeat;
  mask-size: 100% 100%;
  mask-position: center;
}

/* Make the outline a bit thinner on small screens for readability */
@media (max-width: 575.98px){
  .ai-iceText{
    -webkit-text-stroke: 0px rgba(13,12,13,0.95);
  }
  .ai-iceText::after{
    -webkit-text-stroke: 0px #1aa3ff;
  }
}

/* Safety override */
.ai-iceText::after{ content:none !important; }

/* Safety override */
.ai-iceText::before{ content:none !important; }
