/* ============================================================
   AI1HOST TEMPLATE CSS
   File: template.css

   Purpose:
   - Global framework only
   - Header, navigation, main wrapper, footer and utilities
   - Homepage-specific design belongs in home.css
   ============================================================ */


/* ============================================================
   1) FONT + ROOT VARIABLES
   ============================================================ */

@import url("https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&display=swap");

:root{
  --ai1-font: "Comfortaa", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --ai1-accent: #2A9D29;
  --ai1-blue: #24a6d7;
  --ai1-blue-light: #79ddff;

  --ai1-bg: #02060d;
  --ai1-text: #ffffff;
  --ai1-muted: rgba(255,255,255,.74);
  --ai1-border: rgba(120,215,255,.18);

  --ai1-radius: 18px;
  --ai1-shadow: 0 22px 60px rgba(0,0,0,.48);
  --ai1-transition: .2s ease;
}


/* ============================================================
   2) RESET / BASE
   ============================================================ */

*,
*::before,
*::after{
  box-sizing: border-box;
}

html{
  scroll-behavior: smooth;
  background: #000;
}

body{
  margin: 0;
  min-height: 100vh;
  overflow-x: hidden;
  font-family: var(--ai1-font);
  color: var(--ai1-text);
  background:
    radial-gradient(1300px 900px at 50% 15%, rgba(36,166,215,.22), transparent 60%),
    radial-gradient(1200px 900px at 50% 42%, rgba(42,157,41,.12), transparent 64%),
    linear-gradient(180deg, #07111f 0%, #02060d 54%, #000 100%);
}

button,
input,
select,
textarea{
  font-family: inherit;
}

img,
video{
  max-width: 100%;
}

img{
  display: block;
}

a{
  color: var(--ai1-blue-light);
  text-decoration: none;
  transition: color var(--ai1-transition);
}

a:hover{
  color: #fff;
}

p{
  line-height: 1.7;
}

h1,
h2,
h3,
h4,
h5,
h6{
  margin-top: 0;
  line-height: 1.1;
}


/* ============================================================
   3) SHARED CONTAINER / ACCESSIBILITY
   ============================================================ */

.ai1-container{
  width: min(1180px, calc(100% - 2rem));
  margin: 0 auto;
}

.ai1-skip-link{
  position: absolute;
  top: -120px;
  left: 0;
  z-index: 9999;
  padding: .8rem 1rem;
  color: #fff;
  background: #000;
}

.ai1-skip-link:focus{
  top: 0;
}


/* ============================================================
   4) HEADER IMAGE
   ============================================================ */

.ai1-header{
  position: relative;
  z-index: 50;
  overflow: hidden;
  background: #020712;
  border-bottom: 1px solid rgba(36,166,215,.45);
}

.ai1-header-inner{
  position: relative;
  width: 100%;
}

.ai1-header-picture{
  display: block;
  width: 100%;
  line-height: 0;
}

.ai1-header-image{
  width: 100%;
  height: auto;
}


/* ============================================================
   5) LOGIN BUTTON
   ============================================================ */

.ai1-header-right{
  position: absolute;
  top: 22px;
  right: 32px;
  z-index: 60;
}

.ai1-login-btn{
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  padding: .7rem 1rem;
  border-radius: 14px;
  color: #fff;
  background: rgba(0,0,0,.45);
  border: 1px solid rgba(255,255,255,.12);
  backdrop-filter: blur(8px);
  box-shadow: 0 12px 30px rgba(0,0,0,.45);
  transition:
    transform .2s ease,
    background .2s ease,
    border-color .2s ease,
    box-shadow .2s ease;
}

.ai1-login-btn:hover{
  color: #fff;
  transform: translateY(-2px);
  background: rgba(0,0,0,.65);
  border-color: rgba(121,221,255,.35);
  box-shadow:
    0 16px 34px rgba(0,0,0,.5),
    0 0 22px rgba(36,166,215,.16);
}

.ai1-login-icon{
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: linear-gradient(135deg, #0c86be, #24a6d7);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.28);
}

.ai1-login-icon::before{
  content: "👤";
}


/* ============================================================
   6) PREMIUM NAVIGATION BAR
   ============================================================ */

.ai1-nav-bar{
  position: sticky;
  top: 0;
  z-index: 200;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 16px;
  background:
    radial-gradient(500px 90px at 22% 50%, rgba(121,221,255,.22), transparent 72%),
    radial-gradient(500px 90px at 78% 50%, rgba(42,157,41,.16), transparent 72%),
    linear-gradient(180deg, rgba(8,28,48,.96), rgba(1,5,12,.96));
  border-top: 1px solid rgba(121,221,255,.32);
  border-bottom: 1px solid rgba(121,221,255,.45);
  box-shadow:
    0 18px 45px rgba(0,0,0,.68),
    0 0 34px rgba(36,166,215,.18);
  backdrop-filter: blur(18px);
}

.ai1-nav-bar::before{
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.10),
    transparent
  );
  opacity: .55;
}

.ai1-nav-toggle{
  display: none;
  flex-direction: column;
  gap: 5px;
  padding: .75rem;
  border-radius: 16px;
  border: 1px solid rgba(121,221,255,.28);
  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.12),
      rgba(255,255,255,.04)
    );
  box-shadow: 0 14px 35px rgba(0,0,0,.45);
  cursor: pointer;
}

.ai1-nav-toggle-bar{
  width: 24px;
  height: 2px;
  background: #fff;
  border-radius: 999px;
}

.ai1-main-nav{
  position: relative;
  z-index: 2;
  padding: .45rem;
  border-radius: 999px;
  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.13),
      rgba(255,255,255,.04)
    );
  border: 1px solid rgba(121,221,255,.28);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 16px 42px rgba(0,0,0,.48);
  backdrop-filter: blur(18px);
}

.ai1-main-nav ul{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .35rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ai1-main-nav li{
  position: relative;
}

.ai1-main-nav a{
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 0 1.35rem;
  border-radius: 999px;
  color: rgba(255,255,255,.96);
  font-weight: 900;
  font-size: 1.02rem;
  letter-spacing: .015em;
  text-transform: uppercase;
  transition:
    transform .22s ease,
    color .22s ease,
    background .22s ease,
    box-shadow .22s ease,
    text-shadow .22s ease;
}

.ai1-main-nav a::before{
  content: "";
  position: absolute;
  inset: 4px;
  z-index: -1;
  border-radius: 999px;
  background:
    linear-gradient(
      135deg,
      rgba(121,221,255,.32),
      rgba(36,166,215,.20),
      rgba(42,157,41,.16)
    );
  opacity: 0;
  transform: scale(.82);
  transition:
    opacity .22s ease,
    transform .22s ease;
}

.ai1-main-nav a:hover::before,
.ai1-main-nav li.current > a::before,
.ai1-main-nav li.active > a::before{
  opacity: 1;
  transform: scale(1);
}


/* ============================================================
   7) PREMIUM VERTICAL DROPDOWNS
   ============================================================ */

.ai1-main-nav .mod-menu__toggle-sub{
  display: none;
}

.ai1-main-nav li.deeper.parent > a::after{
  content: "▾";
  margin-left: .5rem;
  font-size: .72em;
  opacity: .75;
  transition: transform .22s ease;
}

.ai1-main-nav li.deeper.parent:hover > a::after,
.ai1-main-nav li.deeper.parent:focus-within > a::after{
  transform: rotate(180deg);
}

.ai1-main-nav ul.mod-menu__sub{
  position: absolute;

  /*
   * The submenu now starts directly beneath the parent item.
   * The visual gap is created using transform rather than a
   * genuine empty gap that would break the hover state.
   */
  top: 100%;
  left: 50%;

  min-width: 260px;
  margin: 0;
  padding: calc(.7rem + 8px) .7rem .7rem;

  display: flex;
  flex-direction: column;
  gap: .35rem;

  border-radius: 24px;

  background:
    radial-gradient(
      360px 160px at 18% 0%,
      rgba(121,221,255,.18),
      transparent 72%
    ),
    linear-gradient(
      180deg,
      rgba(5,18,32,.98),
      rgba(0,0,0,.98)
    );

  border: 1px solid rgba(121,221,255,.25);

  box-shadow:
    0 24px 70px rgba(0,0,0,.72),
    0 0 32px rgba(36,166,215,.16);

  backdrop-filter: blur(18px);

  opacity: 0;
  visibility: hidden;
  pointer-events: none;

  transform:
    translate(-50%, 14px)
    scale(.97);

  transform-origin: top center;

  transition:
    opacity .2s ease,
    transform .2s ease,
    visibility 0s linear .16s;
}

/*
 * Invisible hover bridge.
 * This covers the small visual space between the parent
 * menu item and the visible dropdown panel.
 */
.ai1-main-nav ul.mod-menu__sub::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -14px;
  height: 14px;
  background: transparent;
}

.ai1-main-nav li:hover > ul.mod-menu__sub,
.ai1-main-nav li:focus-within > ul.mod-menu__sub{
  opacity: 1;
  visibility: visible;
  pointer-events: auto;

  transform:
    translate(-50%, 6px)
    scale(1);

  transition-delay: 0s;
}

.ai1-main-nav ul.mod-menu__sub::before{
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 14px;
  height: 14px;
  transform:
    translate(-50%, -50%)
    rotate(45deg);
  background: rgba(5,18,32,.98);
  border-left: 1px solid rgba(121,221,255,.22);
  border-top: 1px solid rgba(121,221,255,.22);
}

.ai1-main-nav ul.mod-menu__sub li{
  width: 100%;
}

.ai1-main-nav ul.mod-menu__sub a{
  width: 100%;
  min-height: auto;
  display: flex;
  justify-content: flex-start;
  padding: .82rem .9rem;
  border-radius: 16px;
  color: rgba(255,255,255,.86);
  text-align: left;
  white-space: normal;
}

.ai1-main-nav ul.mod-menu__sub a:hover,
.ai1-main-nav ul.mod-menu__sub a:focus-visible{
  color: #fff;
  background: rgba(36,166,215,.16);
  transform: translateX(4px);
}


/* ============================================================
   8) MAIN CONTENT FRAMEWORK
   ============================================================ */

.ai1-main{
  position: relative;
  min-height: 60vh;
  overflow: hidden;
}

.is-home .ai1-main{
  padding: 0;
}

.is-home .ai1-component-section--home{
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
}

.is-inner .ai1-main{
  padding: 3rem 0 4rem;
}

.ai1-component-section{
  position: relative;
}


/* ============================================================
   9) PREMIUM FULL WIDTH FOOTER - REBUILT
   ============================================================ */

.ai1-footer{
  position: relative;
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  margin-top: 0;

  padding: clamp(1rem, 1.8vw, 1.6rem) clamp(1rem, 3vw, 3rem) 0;

  overflow: hidden;

  color: #fff;

  background:
    radial-gradient(1000px 620px at 8% 8%, rgba(121,221,255,.30), transparent 68%),
    radial-gradient(950px 620px at 92% 10%, rgba(42,157,41,.22), transparent 70%),
    radial-gradient(900px 420px at 50% 100%, rgba(36,166,215,.22), transparent 72%),
    linear-gradient(180deg, #092033 0%, #03101d 48%, #000 100%);

  border-top: 1px solid rgba(121,221,255,.42);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    0 -35px 90px rgba(0,0,0,.62);
}

.ai1-footer::before{
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, transparent, rgba(255,255,255,.07), transparent),
    repeating-linear-gradient(
      90deg,
      rgba(255,255,255,.028) 0,
      rgba(255,255,255,.028) 1px,
      transparent 1px,
      transparent 96px
    );
  opacity: .58;
}

.ai1-footer::after{
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 0%, rgba(121,221,255,.18), transparent 38%),
    linear-gradient(180deg, rgba(255,255,255,.05), transparent 24%);
}

.ai1-footer .ai1-container{
  position: relative;
  z-index: 2;
  width: min(1560px, 100%);
  max-width: 1560px;
  margin: 0 auto;
}

.ai1-footer-glow{
  position: absolute;
  left: 8%;
  right: 8%;
  bottom: -120px;
  height: 340px;
  pointer-events: none;
  background: radial-gradient(circle, rgba(36,166,215,.34), transparent 70%);
  filter: blur(38px);
  opacity: .98;
}


/* ------------------------------------------------------------
   FOOTER MAIN HEADING PILL
   ------------------------------------------------------------ */

.ai1-footer-heading{
  position: relative;
  z-index: 2;

  display: flex;
  justify-content: center;

  margin-top: 0;

  /* MUCH TIGHTER */
  margin-bottom: clamp(1.6rem, 2.5vw, 2.4rem);

  padding-top: 0;
}

.ai1-footer-heading .ai1-footer-kicker{
  display: none;
}

.ai1-footer-heading h2,
.ai1-footer-heading-pill{

  position: relative;
  isolation: isolate;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  gap: .9rem;

  width: auto;
  max-width: min(94vw, 980px);

  /* REDUCED HEIGHT */
  padding:
    .82rem
    clamp(1.5rem, 3vw, 2.8rem);

  border-radius: 999px;

  border: 1px solid rgba(170,235,255,.58);

  background:
    radial-gradient(circle at 18% 30%, rgba(255,255,255,.22), transparent 30%),
    linear-gradient(
      135deg,
      rgba(125,220,255,.34),
      rgba(25,112,190,.30),
      rgba(3,25,55,.95)
    );

  color: #f5fcff;

  font-size: clamp(1rem, 2vw, 1.85rem);
  font-weight: 800;
  letter-spacing: .14em;
  line-height: 1;
  text-transform: uppercase;
  text-align: center;

  box-shadow:
    0 14px 40px rgba(0,0,0,.42),
    0 0 24px rgba(121,221,255,.18),
    inset 0 1px 0 rgba(255,255,255,.24);

  text-shadow:
    0 0 12px rgba(121,221,255,.28);

  overflow: hidden;
}

/* GLOW DOT */

.ai1-footer-heading h2::before,
.ai1-footer-heading-pill::before{
  content: "";

  width: 14px;
  height: 14px;

  border-radius: 50%;

  background:
    radial-gradient(circle, #aaf6ff 0%, #79ddff 60%, #54b9ff 100%);

  box-shadow:
    0 0 12px rgba(121,221,255,.95),
    0 0 24px rgba(121,221,255,.65);

  flex-shrink: 0;
}

/* SHINE EFFECT */

.ai1-footer-heading h2::after,
.ai1-footer-heading-pill::after{
  content: "";

  position: absolute;
  inset: 0;

  background:
    linear-gradient(
      120deg,
      transparent 0%,
      rgba(255,255,255,.14) 32%,
      transparent 60%
    );

  transform: translateX(-130%);
  animation: ai1-footer-pill-shine 6s linear infinite;
}

@keyframes ai1-footer-pill-shine{
  100%{
    transform: translateX(130%);
  }
}


/* ------------------------------------------------------------
   FOOTER GRID LAYOUT
   ------------------------------------------------------------ */

.ai1-footer-top{
  display: grid;

  grid-template-columns:
    minmax(0, 1.65fr)
    minmax(320px, .8fr);

  gap: clamp(1.6rem, 2.2vw, 2.4rem);

  align-items: stretch;

  /* REMOVE EXTRA SPACE */
  margin-top: 0;

  margin-bottom: clamp(1.8rem, 2.8vw, 2.6rem);
}

.ai1-footer-inner{
  display: grid;
  grid-template-columns:
    minmax(280px, .95fr)
    minmax(340px, 1fr)
    minmax(320px, 1fr);
  gap: clamp(1.6rem, 2.4vw, 2.5rem);
  align-items: stretch;
}


/* ------------------------------------------------------------
   FOOTER GLASS CARDS
   ------------------------------------------------------------ */

.ai1-footer-brand-card,
.ai1-footer-cta-card,
.ai1-footer-contact,
.ai1-footer-centre,
.ai1-footer-links{
  position: relative;
  overflow: visible;
  padding: clamp(1.8rem, 2.4vw, 2.5rem);
  border-radius: 34px;
  background:
    radial-gradient(520px 240px at 16% 0%, rgba(121,221,255,.18), transparent 72%),
    radial-gradient(440px 240px at 100% 100%, rgba(42,157,41,.13), transparent 72%),
    linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.04));
  border: 1px solid rgba(121,221,255,.32);
  box-shadow:
    0 38px 95px rgba(0,0,0,.62),
    0 0 46px rgba(36,166,215,.16),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(20px);
  transform-style: preserve-3d;
  transition:
    transform .25s ease,
    border-color .25s ease,
    box-shadow .25s ease;

    margin-bottom: 40px;
}

.ai1-footer-brand-card::before,
.ai1-footer-cta-card::before,
.ai1-footer-contact::before,
.ai1-footer-centre::before,
.ai1-footer-links::before{
  content: "";
  position: absolute;
  inset: 1px;
  border-radius: inherit;
  pointer-events: none;
  background:
    linear-gradient(135deg, rgba(255,255,255,.15), transparent 36%, rgba(121,221,255,.07));
  opacity: .86;
}

.ai1-footer-brand-card:hover,
.ai1-footer-cta-card:hover,
.ai1-footer-contact:hover,
.ai1-footer-centre:hover,
.ai1-footer-links:hover{
  transform: translateY(-8px) scale(1.015);
  border-color: rgba(121,221,255,.48);
  box-shadow:
    0 42px 105px rgba(0,0,0,.66),
    0 0 48px rgba(36,166,215,.24),
    inset 0 1px 0 rgba(255,255,255,.2);
}


/* ------------------------------------------------------------
   FOOTER BRAND / INTRO
   ------------------------------------------------------------ */

.ai1-footer-kicker{
  margin: 0 0 .75rem;
  color: #78d3ff;
  font-size: .9rem;
  font-weight: 900;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.ai1-footer-brand-title{
  margin: 0 0 1.25rem;
  font-size: clamp(3rem, 5vw, 5.2rem);
  line-height: 1;
  text-shadow:
    0 0 28px rgba(121,221,255,.34),
    0 0 52px rgba(36,166,215,.18);
}

.ai1-footer-brand-text{
  max-width: 900px;
  margin: 0;
  color: rgba(255,255,255,.88);
  font-size: clamp(1.05rem, 1.2vw, 1.18rem);
}


/* ------------------------------------------------------------
   FOOTER ANIMATED PILLS
   ------------------------------------------------------------ */

.ai1-footer-feature-pills,
.ai1-footer-mini-trust{
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  margin-top: 1.5rem;
  max-width: 100%;
  overflow: visible;
  padding-bottom: .15rem;
}

.ai1-footer-contact .ai1-footer-mini-trust{
  margin-top: 1.6rem;
  margin-bottom: 1.15rem;
}

.ai1-footer-feature-pills span,
.ai1-footer-mini-trust span{
  position: relative;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 1 auto;
  white-space: nowrap;
  padding: .72rem 1rem;
  border-radius: 999px;
  color: #effcff;
  background:
    radial-gradient(circle at 20% 20%, rgba(255,255,255,.28), transparent 36%),
    linear-gradient(135deg, rgba(121,221,255,.28), rgba(36,166,215,.18), rgba(42,157,41,.16));
  border: 1px solid rgba(121,221,255,.44);
  font-size: .9rem;
  font-weight: 900;
  box-shadow:
    0 12px 28px rgba(0,0,0,.30),
    0 0 18px rgba(36,166,215,.12),
    inset 0 1px 0 rgba(255,255,255,.22);
  transition:
    transform .22s ease,
    box-shadow .22s ease,
    border-color .22s ease,
    background .22s ease;
  animation: ai1-footer-pill-breathe 4.8s ease-in-out infinite;
}

.ai1-footer-feature-pills span::before,
.ai1-footer-mini-trust span::before{
  content: "✓";
  display: inline-grid;
  place-items: center;
  width: 1.35rem;
  height: 1.35rem;
  margin-right: .5rem;
  border-radius: 50%;
  color: #061018;
  font-size: .78rem;
  font-weight: 900;
  background: linear-gradient(135deg, #dffaff, #79ddff);
  box-shadow:
    0 0 14px rgba(121,221,255,.55),
    inset 0 1px 0 rgba(255,255,255,.7);
}

.ai1-footer-feature-pills span::after,
.ai1-footer-mini-trust span::after{
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-130%);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.22), transparent);
  transition: transform .45s ease;
}

.ai1-footer-feature-pills span:hover,
.ai1-footer-mini-trust span:hover{
  transform: translateY(-4px) scale(1.04);
  border-color: rgba(121,221,255,.72);
  box-shadow:
    0 18px 36px rgba(0,0,0,.38),
    0 0 26px rgba(36,166,215,.22),
    inset 0 1px 0 rgba(255,255,255,.28);
}

.ai1-footer-feature-pills span:hover::after,
.ai1-footer-mini-trust span:hover::after{
  transform: translateX(130%);
}

.ai1-footer-feature-pills span:nth-child(2),
.ai1-footer-mini-trust span:nth-child(2){
  animation-delay: .25s;
}

.ai1-footer-feature-pills span:nth-child(3),
.ai1-footer-mini-trust span:nth-child(3){
  animation-delay: .5s;
}

.ai1-footer-feature-pills span:nth-child(4){
  animation-delay: .75s;
}

.ai1-footer-feature-pills span:nth-child(5){
  animation-delay: 1s;
}

.ai1-footer-feature-pills span:nth-child(6){
  animation-delay: 1.25s;
}

@keyframes ai1-footer-pill-breathe{
  0%, 100%{
    box-shadow:
      0 12px 28px rgba(0,0,0,.30),
      0 0 18px rgba(36,166,215,.12),
      inset 0 1px 0 rgba(255,255,255,.22);
  }

  50%{
    box-shadow:
      0 16px 34px rgba(0,0,0,.36),
      0 0 28px rgba(36,166,215,.22),
      inset 0 1px 0 rgba(255,255,255,.28);
  }
}


/* ------------------------------------------------------------
   FOOTER CTA CARD
   ------------------------------------------------------------ */

.ai1-footer-cta-card{
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: auto;
}

.ai1-footer-cta-card h3{
  font-size: clamp(1.35rem, 2vw, 1.8rem);
}

.ai1-footer-cta-card p{
  color: rgba(255,255,255,.86);
}

.ai1-footer-cta{
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  margin-top: 1.4rem;
  padding: 1.15rem 1.3rem;
  border-radius: 22px;
  color: #061018 !important;
  font-size: 1rem;
  font-weight: 900;
  background: linear-gradient(135deg, #effcff, #78d3ff 42%, #24a6d7);
  box-shadow:
    0 26px 58px rgba(36,166,215,.42),
    inset 0 1px 0 rgba(255,255,255,.75);
  transition:
    transform .22s ease,
    box-shadow .22s ease;
}

.ai1-footer-cta:hover{
  transform: translateY(-4px);
  box-shadow:
    0 32px 66px rgba(36,166,215,.5),
    inset 0 1px 0 rgba(255,255,255,.78);
}


/* ------------------------------------------------------------
   FOOTER CONTACT
   ------------------------------------------------------------ */

.ai1-footer-title{
  margin: 0 0 1.4rem;
  font-size: clamp(1.35rem, 2vw, 1.7rem);
}

.ai1-footer-address-card{
  display: block;
  padding: 1.35rem;
  border-radius: 26px;
  background: rgba(0,0,0,.28);
  border: 1px solid rgba(255,255,255,.13);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.07),
    0 16px 34px rgba(0,0,0,.22);
}

.ai1-footer-address-icon,
.ai1-footer-email span{
  display: none;
}

.ai1-footer-address{
  color: rgba(255,255,255,.9);
  line-height: 1.6;
  font-size: .98rem;
}

.ai1-footer-email{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: .65rem;
  margin: 1.35rem 0;
  padding: .9rem 1rem;
  border-radius: 18px;
  background: rgba(0,0,0,.22);
  border: 1px solid rgba(255,255,255,.10);
}

.ai1-footer-email a{
  color: #79ddff;
}

.ai1-cookie-settings{
  display: inline-flex;
  margin-top: .35rem;
}


/* ------------------------------------------------------------
   FOOTER BYTE / CENTRE PANEL
   ------------------------------------------------------------ */

.ai1-footer-byte{
  position: relative;
  width: min(280px, 100%);
  margin: 0 auto 1.8rem;
  text-align: center;
}

.ai1-footer-byte video{
  position: relative;
  z-index: 2;
  width: 100%;
  border-radius: 32px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.15);
  box-shadow:
    0 32px 72px rgba(0,0,0,.78),
    0 0 52px rgba(36,166,215,.28);
}

.ai1-footer-byte-glow{
  position: absolute;
  inset: 16% 4% 10%;
  z-index: 1;
  border-radius: 50%;
  background: rgba(36,166,215,.36);
  filter: blur(36px);
}

.ai1-footer-byte-text{
  margin-top: 1rem;
  color: rgba(255,255,255,.88);
  font-size: .96rem;
}


/* ------------------------------------------------------------
   FOOTER SOCIAL / PAYMENTS / TRUST
   ------------------------------------------------------------ */

.ai1-footer-social-wrap,
.ai1-footer-payments{
  padding: 1.35rem;
  border-radius: 26px;
  background: rgba(0,0,0,.28);
  border: 1px solid rgba(255,255,255,.13);
}

.ai1-footer-social-title,
.ai1-footer-payments-title{
  margin: 0 0 1.1rem;
  color: rgba(255,255,255,.9);
  font-size: .9rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  text-align: center;
}

.ai1-footer-social{
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: .9rem;
  margin: 0;
}

.ai1-social{
  display: inline-flex;
  width: 54px;
  height: 54px;
  border-radius: 20px;
  background: rgba(255,255,255,.08);
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,255,255,.13);
  transition:
    transform .2s ease,
    background .2s ease,
    box-shadow .2s ease;
}

.ai1-social:hover{
  transform: translateY(-5px) rotate(-2deg);
  background: rgba(36,166,215,.2);
  box-shadow:
    0 18px 34px rgba(0,0,0,.44),
    0 0 22px rgba(36,166,215,.16);
}

.ai1-social img{
  width: 32px;
  height: 32px;
  object-fit: contain;
}

.ai1-footer-payments{
  margin-top: 1.35rem;
}

.ai1-payment-row{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .65rem;
  margin: 0;
}

.ai1-payment-row img{
  height: 30px;
  width: auto;
  background: #fff;
  border-radius: 8px;
  padding: 5px 8px;
}

.ai1-footer-trust{
  display: flex;
  justify-content: center;
  gap: .8rem;
  flex-wrap: wrap;
  margin-top: 1.35rem;
}

.ai1-footer-trust img{
  height: 54px;
  width: auto;
  filter: drop-shadow(0 10px 18px rgba(0,0,0,.3));
}


/* ------------------------------------------------------------
   FOOTER LINKS
   ------------------------------------------------------------ */

.ai1-footer-linkgrid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.35rem;
}

.ai1-footer-linkblock{
  padding: 1.35rem;
  border-radius: 26px;
  background: rgba(0,0,0,.28);
  border: 1px solid rgba(255,255,255,.13);
  transition:
    transform .2s ease,
    background .2s ease,
    border-color .2s ease,
    box-shadow .2s ease;
}

.ai1-footer-linkblock:hover{
  transform: translateY(-4px);
  background: rgba(36,166,215,.09);
  border-color: rgba(121,221,255,.28);
  box-shadow:
    0 18px 38px rgba(0,0,0,.32),
    0 0 24px rgba(36,166,215,.10);
}

.ai1-footer-linkblock-wide{
  grid-column: 1 / -1;
}

.ai1-footer-blocklabel{
  margin: 0 0 .85rem;
  color: #fff;
  font-weight: 900;
  font-size: .82rem;
  letter-spacing: .10em;
  text-transform: uppercase;
}

.ai1-footer-links ul,
.ai1-footer-links ol{
  margin: 0;
  padding: 0;
  list-style: none !important;
}

.ai1-footer-links li{
  position: relative;
  margin: 0;
  padding: 0 0 0 1.15rem !important;
  list-style: none !important;
}

.ai1-footer-links li::before{
  content: "";
  position: absolute;
  left: 0;
  top: .92rem;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: linear-gradient(135deg, #79ddff, #2A9D29);
  box-shadow: 0 0 12px rgba(121,221,255,.55);
}

.ai1-footer-links a{
  display: block;
  padding: .48rem 0;
  color: rgba(255,255,255,.84);
  font-size: .98rem;
  transition:
    color .18s ease,
    transform .18s ease;
}

.ai1-footer-links a:hover{
  color: #fff;
  transform: translateX(6px);
}


/* ------------------------------------------------------------
   FOOTER BOTTOM BAR
   ------------------------------------------------------------ */

.ai1-footer-bottom{
  display: block;
  text-align: center;
  margin-top: clamp(2rem, 3vw, 3rem);
  padding-top: 1.7rem;
  padding-bottom: 1.8rem;
  border-top: 1px solid rgba(255,255,255,.12);
}

.ai1-footer-legal{
  max-width: 1100px;
  margin: 0 auto;
  color: rgba(255,255,255,.72);
  font-size: .86rem;
  line-height: 1.5;
  text-align: center;
}

.ai1-footer-legal p{
  margin: .35rem 0;
}

.ai1-footer-copy{
  display: block;
  margin-top: 1.45rem;
  padding-top: 1.45rem;
  border-top: 1px solid rgba(255,255,255,.10);
  white-space: normal;
  color: rgba(255,255,255,.84);
  font-size: .94rem;
  text-align: center;
}


/* ------------------------------------------------------------
   FOOTER RESPONSIVE
   ------------------------------------------------------------ */

@media (max-width: 1180px){
  .ai1-footer{
    padding-top: 5rem;
  }

  .ai1-footer-top,
  .ai1-footer-inner{
    grid-template-columns: 1fr;
    gap: 2.4rem;
  }

  .ai1-footer-cta-card{
    min-height: auto;
  }

  .ai1-footer-contact,
  .ai1-footer-centre,
  .ai1-footer-links{
    text-align: center;
  }

  .ai1-footer-address-card{
    max-width: 560px;
    margin-inline: auto;
    text-align: center;
  }

  .ai1-footer-email,
  .ai1-footer-feature-pills,
  .ai1-footer-mini-trust{
    justify-content: center;
  }
}

@media (max-width: 640px){
  .ai1-footer{
    padding-inline: 1rem;
  }

  .ai1-footer-heading{
    margin-bottom: 2.8rem;
  }

  .ai1-footer-heading h2,
  .ai1-footer-heading-pill{
    width: 100%;
    padding: .95rem 1.1rem;
    font-size: clamp(1.25rem, 8vw, 2rem);
  }

  .ai1-footer-feature-pills span,
  .ai1-footer-mini-trust span{
    white-space: normal;
  }

  .ai1-footer-linkgrid{
    grid-template-columns: 1fr;
  }

  .ai1-footer-linkblock-wide{
    grid-column: auto;
  }

  .ai1-footer-brand-card,
  .ai1-footer-cta-card,
  .ai1-footer-contact,
  .ai1-footer-centre,
  .ai1-footer-links{
    padding: 2rem;
    border-radius: 28px;
  }
}


/* ============================================================
   10) PREMIUM BACK TO TOP BUTTON
   ============================================================ */

.ai1-btt{
  position:fixed;
  right:20px;
  bottom:20px;

  width:64px;
  height:64px;

  display:flex;
  align-items:center;
  justify-content:center;

  border:none;
  border-radius:50%;

  cursor:pointer;
  overflow:hidden;
  isolation:isolate;

  z-index:999;

  background:
    radial-gradient(circle at 30% 25%, rgba(121,221,255,.28), transparent 58%),
    linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.03)),
    rgba(5,12,20,.88);

  backdrop-filter:blur(12px);

  box-shadow:
    0 12px 35px rgba(0,0,0,.45),
    0 0 26px rgba(36,166,215,.18);

  transition:
    transform .25s ease,
    opacity .25s ease,
    background .25s ease,
    box-shadow .25s ease;

  opacity:0;
  visibility:hidden;

  transform:
    translateY(14px)
    scale(.92);
}

/* Visible state */

.ai1-btt.ai1-btt-visible{
  opacity:1;
  visibility:visible;

  transform:
    translateY(0)
    scale(1);
}

/* Hover */

.ai1-btt:hover{
  transform:
    translateY(-4px)
    scale(1.04);

  box-shadow:
    0 18px 40px rgba(0,0,0,.55),
    0 0 34px rgba(121,221,255,.28);
}

/* Icon */

.ai1-btt-icon{
  position:relative;
  z-index:2;

  font-size:1.2rem;
  font-weight:700;

  color:#ffffff;

  transition:
    transform .25s ease,
    text-shadow .25s ease;
}

.ai1-btt:hover .ai1-btt-icon{
  transform:translateY(-2px);

  text-shadow:
    0 0 12px rgba(121,221,255,.65);
}

/* SVG Ring */

.ai1-btt-ring{
  position:absolute;
  inset:0;

  width:100%;
  height:100%;

  transform:rotate(-90deg);
}

/* Background ring */

.ai1-btt-ring-bg{
  fill:none;

  stroke:rgba(255,255,255,.08);
  stroke-width:6;
}

/* Progress ring */

.ai1-btt-ring-progress{
  fill:none;

  stroke:#79ddff;
  stroke-width:6;
  stroke-linecap:round;

  stroke-dasharray:276.46;
  stroke-dashoffset:276.46;

  transition:stroke-dashoffset .15s linear;

  filter:
    drop-shadow(0 0 6px rgba(121,221,255,.7));
}

/* Mobile */

@media (max-width:768px){

  .ai1-btt{
    width:58px;
    height:58px;

    right:16px;
    bottom:16px;
  }

}


/* ============================================================
   11) COOKIE BANNER
   ============================================================ */

.ai1-cookie-banner{
  position: fixed;
  inset: auto 0 0 0;
  z-index: 9999;
  display: none;
  background: rgba(0,0,0,.82);
  backdrop-filter: blur(10px);
  border-top: 1px solid rgba(121,221,255,.22);
}

.ai1-cookie-inner{
  max-width: 960px;
  margin: 0 auto;
  padding: 1.6rem 1.8rem;
}

.ai1-cookie-actions{
  display: flex;
  gap: .8rem;
  flex-wrap: wrap;
}

.ai1-btn{
  padding: .8rem 1rem;
  border-radius: 14px;
  border: 0;
  cursor: pointer;
  font-weight: 800;
}

.ai1-btn-accept{
  background: var(--ai1-accent);
  color: #fff;
}

.ai1-btn-reject{
  background: rgba(255,255,255,.08);
  color: #fff;
}


/* ============================================================
   12) RESPONSIVE - TABLET / SMALL DESKTOP
   ============================================================ */

@media (max-width: 1120px){
  .ai1-footer-top,
  .ai1-footer-inner,
  .ai1-footer-bottom{
    grid-template-columns: 1fr;
  }

  .ai1-footer-contact,
  .ai1-footer-centre,
  .ai1-footer-links,
  .ai1-footer-bottom{
    text-align: center;
  }

  .ai1-footer-address-card{
    text-align: left;
    max-width: 520px;
    margin: 0 auto;
  }

  .ai1-footer-email,
  .ai1-footer-mini-trust,
  .ai1-footer-feature-pills{
    justify-content: center;
  }

  .ai1-footer-copy{
    white-space: normal;
  }
}


/* ============================================================
   13) RESPONSIVE - MOBILE NAVIGATION
   ============================================================ */

@media (max-width: 980px){
  .ai1-nav-bar{
    justify-content: flex-start;
  }

  .ai1-nav-toggle{
    display: inline-flex;
  }

  .ai1-main-nav{
    display: none;
    position: absolute;
    top: calc(100% + 10px);
    left: 1rem;
    right: 1rem;
    padding: 1rem;
    border-radius: 24px;
    background:
      radial-gradient(420px 160px at 20% 0%, rgba(121,221,255,.16), transparent 72%),
      rgba(0,0,0,.96);
  }

  .ai1-main-nav.ai1-nav-open,
  .ai1-main-nav.ai1-main-nav-open{
    display: block;
  }

  .ai1-main-nav ul{
    flex-direction: column;
    align-items: stretch;
    gap: .35rem;
  }

  .ai1-main-nav a{
    width: 100%;
    justify-content: flex-start;
    padding: .9rem 1rem;
  }

  .ai1-main-nav ul.mod-menu__sub{
    position: static;
    display: none;
    min-width: 0;
    margin: .35rem 0 .65rem;
    padding: .55rem;
    opacity: 1;
    visibility: visible;
    transform: none;
    pointer-events: auto;
    box-shadow: none;
  }

  .ai1-main-nav ul.mod-menu__sub::before{
    display: none;
  }

  .ai1-main-nav li:hover > ul.mod-menu__sub,
  .ai1-main-nav li:focus-within > ul.mod-menu__sub{
    display: flex;
    transform: none;
  }
}


/* ============================================================
   14) RESPONSIVE - SMALL MOBILE
   ============================================================ */

@media (max-width: 640px){
  .ai1-container{
    width: min(100% - 1.2rem, 1180px);
  }

  .ai1-header-right{
    top: 14px;
    right: 14px;
  }

  .ai1-login-text{
    display: none;
  }

  .ai1-login-btn{
    padding: .62rem;
  }

  .ai1-footer{
    padding-top: 3.2rem;
  }

  .ai1-footer-linkgrid{
    grid-template-columns: 1fr;
  }

  .ai1-footer-linkblock-wide{
    grid-column: auto;
  }
}


/* ============================================================
   15) REDUCED MOTION
   ============================================================ */

@media (prefers-reduced-motion: reduce){
  *,
  *::before,
  *::after{
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}

/* ============================================================
   16) TV STATIC PAGE TRANSITIONS
   ============================================================ */

.ai1-tv-transition{
  position:fixed;
  inset:0;
  z-index:100000;
  display:grid;
  place-items:center;
  overflow:hidden;
  pointer-events:none;
  opacity:0;
  visibility:hidden;
  background:#050505;
  transition:
    opacity .12s linear,
    visibility 0s linear .12s;
}

.ai1-tv-transition--active{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transition-delay:0s;
}

.ai1-tv-transition--leaving{
  opacity:0;
}

.ai1-tv-transition__noise,
.ai1-tv-transition__scanlines,
.ai1-tv-transition__flash{
  position:absolute;
  inset:-35%;
  pointer-events:none;
}

.ai1-tv-transition__noise{
  background:
    repeating-radial-gradient(
      circle at 17% 32%,
      rgba(255,255,255,.94) 0 1px,
      rgba(0,0,0,.96) 1px 3px
    ),
    repeating-radial-gradient(
      circle at 71% 62%,
      rgba(255,255,255,.8) 0 1px,
      rgba(0,0,0,.92) 1px 4px
    ),
    repeating-linear-gradient(
      37deg,
      rgba(255,255,255,.52) 0 1px,
      rgba(0,0,0,.7) 1px 3px
    );
  background-size:
    7px 7px,
    11px 11px,
    5px 5px;
  mix-blend-mode:screen;
  filter:contrast(190%) brightness(120%);
  opacity:.86;
  animation:
    ai1-tv-noise-jump .075s steps(2,end) infinite,
    ai1-tv-noise-flicker .16s steps(2,end) infinite;
}

.ai1-tv-transition__scanlines{
  inset:0;
  background:
    repeating-linear-gradient(
      180deg,
      rgba(255,255,255,.12) 0,
      rgba(255,255,255,.12) 1px,
      rgba(0,0,0,.34) 1px,
      rgba(0,0,0,.34) 4px
    );
  opacity:.62;
  animation:ai1-tv-scan-roll .26s linear infinite;
}

.ai1-tv-transition__flash{
  inset:0;
  background:
    linear-gradient(
      90deg,
      transparent 0%,
      rgba(255,255,255,.82) 48%,
      rgba(121,221,255,.85) 50%,
      rgba(255,255,255,.82) 52%,
      transparent 100%
    );
  transform:translateX(-130%) skewX(-16deg);
  opacity:.58;
  animation:ai1-tv-flash-sweep .42s ease-out infinite;
}

.ai1-tv-transition__label{
  position:relative;
  z-index:3;
  padding:.75rem 1rem;
  border:1px solid rgba(255,255,255,.75);
  border-radius:8px;
  color:#fff;
  background:rgba(0,0,0,.72);
  box-shadow:
    0 0 0 2px rgba(0,0,0,.8),
    0 0 24px rgba(255,255,255,.18);
  font-size:clamp(.72rem,1.4vw,.9rem);
  font-weight:900;
  letter-spacing:.22em;
  text-transform:uppercase;
  text-shadow:
    2px 0 0 rgba(255,0,80,.65),
    -2px 0 0 rgba(0,220,255,.65);
  animation:ai1-tv-label-jitter .09s steps(2,end) infinite;
}

@keyframes ai1-tv-noise-jump{
  0%{
    transform:translate3d(-3%,-4%,0) scale(1.04);
  }
  25%{
    transform:translate3d(4%,1%,0) scale(1.08);
  }
  50%{
    transform:translate3d(-1%,5%,0) scale(1.03);
  }
  75%{
    transform:translate3d(5%,-2%,0) scale(1.07);
  }
  100%{
    transform:translate3d(-4%,3%,0) scale(1.05);
  }
}

@keyframes ai1-tv-noise-flicker{
  0%,100%{opacity:.68}
  35%{opacity:.95}
  60%{opacity:.76}
  82%{opacity:1}
}

@keyframes ai1-tv-scan-roll{
  from{transform:translateY(0)}
  to{transform:translateY(8px)}
}

@keyframes ai1-tv-flash-sweep{
  0%{
    transform:translateX(-130%) skewX(-16deg);
  }
  100%{
    transform:translateX(130%) skewX(-16deg);
  }
}

@keyframes ai1-tv-label-jitter{
  0%,100%{transform:translate(0,0)}
  25%{transform:translate(-1px,1px)}
  50%{transform:translate(1px,-1px)}
  75%{transform:translate(1px,1px)}
}

@media (prefers-reduced-motion: reduce){
  .ai1-tv-transition__noise,
  .ai1-tv-transition__scanlines,
  .ai1-tv-transition__flash,
  .ai1-tv-transition__label{
    animation:none !important;
  }

  .ai1-tv-transition{
    background:#07111f;
  }
}